/* Welcome offer: teaser pill + bottom sheet (WelcomeSheet.jsx).
   Sitewide, so this file stays small. Layering: nav 60, partner pill 58,
   PDP / club docks 50, consent notice 90. The sheet sits at 95, above the
   consent notice, because on a first visit both are up at once and the notice
   was covering the email field and the button (seen 2026-09-23 on a 390px
   viewport). The teaser sits at 57 so the partner pill wins, and it lifts
   above the notice while `body.abso-notice-open` is set (ConsentBanner). */

.ws-teaser{position:fixed;right:14px;bottom:calc(84px + env(safe-area-inset-bottom,0px));z-index:57;
  display:inline-flex;align-items:center;gap:7px;padding:10px 14px 10px 13px;border:0;border-radius:999px;
  background:var(--solar,#DF6D09);color:var(--cream,#FFF7E9);cursor:pointer;
  font-family:var(--sans,"Inter Tight",system-ui,sans-serif);font-weight:600;font-size:13px;letter-spacing:.01em;line-height:1;
  box-shadow:0 10px 24px -10px rgba(31,26,18,.6);transition:transform .25s var(--e-decel,ease),opacity .25s}
.ws-teaser em{font-family:var(--serif,"Instrument Serif",Georgia,serif);font-style:italic;font-weight:400;font-size:17px;line-height:1}
.ws-teaser-arrow{font-size:12px;opacity:.85}
.ws-teaser:hover{transform:translateY(-2px)}
.ws-teaser:focus-visible{outline:2px solid var(--ink,#1F1A12);outline-offset:3px}
.ws-teaser-clock{background:var(--ink,#1F1A12);color:var(--cream,#FFF7E9);gap:9px}
.ws-teaser-clock b{font-family:var(--mono,"JetBrains Mono",ui-monospace,monospace);font-weight:500;font-size:14px;font-variant-numeric:tabular-nums;letter-spacing:.03em;color:var(--solar-soft,#F0A14A)}
.ws-teaser-dot{width:7px;height:7px;border-radius:50%;background:var(--solar,#DF6D09);box-shadow:0 0 0 3px rgba(223,109,9,.25)}
body.abso-notice-open .ws-teaser{bottom:calc(150px + env(safe-area-inset-bottom,0px))}
body.abso-notice-compact .ws-teaser{bottom:calc(128px + env(safe-area-inset-bottom,0px))}
@media (min-width:900px){
  .ws-teaser{right:22px;bottom:22px}
  body.abso-notice-open .ws-teaser,body.abso-notice-compact .ws-teaser{bottom:22px;right:calc(22px + 400px)}
}
@media (prefers-reduced-motion:no-preference){
  .ws-teaser:not(.ws-teaser-clock){animation:ws-nudge 6s ease-in-out infinite}
  @keyframes ws-nudge{0%,92%,100%{transform:none}96%{transform:translateY(-3px)}}
}

.ws-root{position:fixed;inset:0;z-index:95}
.ws-scrim{position:absolute;inset:0;background:rgba(21,27,82,.42)}
.ws-sheet{position:absolute;left:0;right:0;bottom:0;background:#fff;color:var(--ink,#1F1A12);
  border-radius:22px 22px 0 0;padding:12px 20px calc(24px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -20px 50px -30px rgba(31,26,18,.5);font-family:var(--sans,"Inter Tight",system-ui,sans-serif)}
.ws-grab{width:38px;height:4px;border-radius:2px;background:rgba(31,26,18,.18);margin:0 auto 16px}
.ws-x{position:absolute;right:14px;top:14px;width:30px;height:30px;border:0;border-radius:50%;
  background:rgba(31,26,18,.06);color:rgba(31,26,18,.65);font-size:18px;line-height:1;cursor:pointer;display:grid;place-items:center}
.ws-x:focus-visible,.ws-cta:focus-visible,.ws-code:focus-visible{outline:2px solid var(--ink,#1F1A12);outline-offset:2px}
.ws-eyebrow{margin:0 0 6px;font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--solar,#DF6D09)}
.ws-h{margin:0;font-family:var(--serif,"Instrument Serif",Georgia,serif);font-weight:400;font-size:32px;line-height:1;letter-spacing:-.01em;color:var(--ink,#1F1A12);text-wrap:balance}
.ws-h em{font-style:italic}
.ws-sub{margin:10px 0 0;font-size:14px;line-height:1.45;color:rgba(31,26,18,.7);max-width:34ch}
.ws-form{display:block}
.ws-trap{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.ws-field{display:block;width:100%;box-sizing:border-box;margin-top:16px;padding:13px 14px;border:1.5px solid rgba(31,26,18,.22);border-radius:12px;
  background:#fff;color:var(--ink,#1F1A12);font:inherit;font-size:16px;line-height:1.2}
.ws-field::placeholder{color:rgba(31,26,18,.42)}
.ws-field:focus{outline:none;border-color:var(--ink,#1F1A12)}
.ws-cta{display:block;width:100%;margin-top:10px;padding:14px;border:0;border-radius:12px;background:var(--solar,#DF6D09);color:var(--cream,#FFF7E9);
  font:inherit;font-weight:600;font-size:15px;cursor:pointer;transition:filter .15s}
.ws-cta:hover{filter:brightness(.95)}
.ws-cta:disabled{opacity:.7;cursor:default}
.ws-micro{margin:10px 0 0;font-size:11.5px;line-height:1.45;color:rgba(31,26,18,.5)}
.ws-error{margin:10px 0 0;font-size:13px;line-height:1.4;color:#B3261E}
.ws-code{display:flex;width:100%;box-sizing:border-box;align-items:center;justify-content:space-between;margin-top:16px;padding:13px 14px;
  border:1.5px dashed rgba(31,26,18,.3);border-radius:12px;background:var(--cream,#FFF7E9);cursor:pointer;font:inherit;color:var(--ink,#1F1A12)}
.ws-code span{font-family:var(--mono,"JetBrains Mono",ui-monospace,monospace);font-weight:500;font-size:18px;letter-spacing:.06em}
.ws-code small{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--solar,#DF6D09)}
.ws-applied{margin:10px 0 0;font-size:13px;font-weight:600;color:var(--night,#151B52)}
.ws-timer{margin:12px 0 0;display:flex;align-items:baseline;gap:8px;font-size:12.5px;color:rgba(31,26,18,.7)}
.ws-timer b{font-family:var(--mono,"JetBrains Mono",ui-monospace,monospace);font-weight:500;font-size:24px;letter-spacing:.02em;color:var(--night,#151B52);font-variant-numeric:tabular-nums}
.ws-sheet .ws-cta+.ws-micro{margin-top:10px}

@media (prefers-reduced-motion:no-preference){
  .ws-scrim{animation:ws-fade .25s ease-out both}
  .ws-sheet{animation:ws-rise .35s var(--e-decel,cubic-bezier(.05,.7,.1,1)) both}
  @keyframes ws-fade{from{opacity:0}to{opacity:1}}
  @keyframes ws-rise{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
}

/* Desktop: a card in the corner instead of a full-width sheet. */
@media (min-width:900px){
  .ws-scrim{background:rgba(21,27,82,.22)}
  .ws-sheet{left:auto;right:24px;bottom:24px;width:min(420px,calc(100vw - 48px));border-radius:18px;padding:22px 24px 24px}
  .ws-grab{display:none}
  .ws-h{font-size:34px}
}