/* css/promo.css - the website popup (inc/promo.php, js/tt-promo.js). Tokens from css/tokens.css only.
   Doubled class: the homepage's legacy main.css out-specifies single-class rules on dialog / a / img. */
.tt-promo.tt-promo{ padding:0; border:0; margin:auto; border-radius:var(--r-lg); width:min(480px, 92vw); max-width:92vw;
  max-height:85vh; overflow:auto; background:var(--white); color:var(--ink-900); box-shadow:var(--shadow-float); }
.tt-promo::backdrop{ background:rgba(15, 23, 42, .55); }
.tt-promo[hidden]{ display:none; }
.tt-promo__in{ position:relative; }
.tt-promo__pic{ display:block; }
.tt-promo.tt-promo .tt-promo__pic img{ display:block; width:100%; height:auto; max-width:none; }   /* width/height attributes reserve the box */
.tt-promo.tt-promo .tt-promo__x{ position:absolute; top:8px; right:8px; z-index:1; width:44px; height:44px; padding:0; border:0;
  border-radius:50%; background:rgba(255, 255, 255, .92); color:var(--ink-900); display:grid; place-items:center; cursor:pointer;
  box-shadow:var(--shadow-sm); }
.tt-promo__body{ padding:var(--sp-4) var(--sp-5) var(--sp-5); }
.tt-promo.tt-promo .tt-promo__h{ margin:0 0 var(--sp-2); font-size:22px; line-height:1.3; font-weight:700; color:var(--navy-900); }
.tt-promo.tt-promo .tt-promo__p{ margin:0 0 var(--sp-4); font-size:16px; line-height:1.5; color:var(--ink-700); }
.tt-promo.tt-promo .tt-promo__cta{ display:flex; width:100%; align-items:center; justify-content:center; min-height:48px; text-decoration:none; }
.tt-promo.tt-promo .tt-promo__x:focus-visible,
.tt-promo.tt-promo .tt-promo__cta:focus-visible,
.tt-promo.tt-promo .tt-promo__pic:focus-visible{ outline:3px solid var(--blue-600); outline-offset:2px; }
@media (max-width:600px){ .tt-promo.tt-promo{ width:92vw; } }
@media (prefers-reduced-motion:no-preference){
  .tt-promo[open]{ animation:tt-promo-in .18s ease-out; }
  @keyframes tt-promo-in{ from{ opacity:0; transform:translateY(8px) scale(.98); } to{ opacity:1; transform:none; } }
}
.tt-promo.tt-promo .tt-promo__code{ display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:var(--sp-2); margin:0 0 var(--sp-4);
  font-size:16px; color:var(--ink-700); }
.tt-promo.tt-promo .tt-promo__code strong{ padding:6px 14px; border:2px dashed var(--navy-900); border-radius:var(--r-sm); font-size:20px;
  letter-spacing:.08em; color:var(--navy-900); overflow-wrap:anywhere; }
.tt-promo.tt-promo .tt-promo__copy{ width:44px; height:44px; padding:0; border:1px solid var(--ink-500); border-radius:50%; background:var(--white);
  color:var(--ink-900); display:grid; place-items:center; cursor:pointer; }
.tt-promo.tt-promo .tt-promo__copy.is-copied{ border-color:var(--navy-900); background:var(--surface); }
.tt-promo.tt-promo .tt-promo__copy:focus-visible{ outline:3px solid var(--blue-600); outline-offset:2px; }
/* A coupon popup with text: crop a tall picture to 42vh so the code and the button stay on screen at 1440x900. */
.tt-promo.tt-promo--text.tt-promo--coupon .tt-promo__pic img{ max-height:42vh; object-fit:cover; }