/* Season Pass wall — the scorekeeper intro offer and the wall's offer-era pieces
   (CR req_NMY4lroe9Jk3): offer bar + countdowns, "Act now" tag, % off starburst, feature chips,
   faded hand-drawn sport art, valid-through date, the phone sticky buy bar and the bottom-sheet
   checkout. Loaded after season-pass-wall.css; uses its per-theme tokens (--spw-red / -yellow /
   -ink), so every sport keeps its own colors. Countdown: public/js/pitch/season-pass-offer.js.
   No build step — bump asset_version. */

[hidden] { display:none !important; }

/* ---- top offer bar: pinned, so the countdown stays in view (the wall's scroll-snap would
   otherwise scroll it off above the hero on load) ---- */
.spw-offer-bar { position:sticky; top:0; z-index:950; box-shadow:0 2px 10px rgba(0,0,0,.18); background:var(--spw-yellow); color:var(--spw-ink); text-align:center; font-weight:900; text-transform:uppercase; letter-spacing:.6px;
    padding:9px 12px; font-size:clamp(.78rem,2.6vmin,.95rem); display:flex; gap:10px; justify-content:center; align-items:center; flex-wrap:wrap; }
.spw-offer-bar-sm { display:none; }
.spw-clock { font-family:'Anton'; letter-spacing:1px; background:var(--spw-ink); color:var(--spw-yellow); padding:2px 10px; border-radius:7px; font-size:1.1em; font-variant-numeric:tabular-nums; }

/* ---- hero: faded hand-drawn sport behind everything ---- */
.spw-hero-art { position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.spw-hero-art img { position:absolute; width:min(900px,150vw); left:50%; top:52%; transform:translate(-50%,-50%) rotate(-4deg);
    filter:grayscale(1) contrast(1.4) brightness(1.15); mix-blend-mode:screen; opacity:.16;
    -webkit-mask-image:radial-gradient(closest-side,#000 55%,transparent 100%); mask-image:radial-gradient(closest-side,#000 55%,transparent 100%); }

/* ---- badge with the valid-through date ---- */
.spw-badge-valid { text-transform:uppercase; }

/* ---- feature chips ---- */
.spw-chips { list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:8px 10px; max-width:800px; margin:clamp(8px,1.6vh,14px) auto 0; padding:0; }
.spw-chips li { display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.96); color:var(--spw-ink); font-weight:900;
    font-size:clamp(.82rem,2.4vmin,1rem); padding:7px 14px 7px 8px; border-radius:999px; box-shadow:0 4px 0 rgba(0,0,0,.22); }
.spw-chips li:nth-child(odd) { transform:rotate(-1.5deg); }
.spw-chips li:nth-child(even) { transform:rotate(1.5deg); }
.spw-chip-ic { width:28px; height:28px; border-radius:50%; background:var(--spw-yellow); display:inline-flex; align-items:center; justify-content:center; font-size:.95rem; }
.spw-hero .spw-deck--small { font-size:clamp(.85rem,2.3vmin,1.05rem); margin-top:10px; opacity:.92; }

/* ---- "ACT NOW · 50% OFF" with its timer ---- */
.spw-offer-tag { display:inline-block; margin-top:clamp(10px,1.8vh,14px); background:var(--spw-ink); color:var(--spw-yellow); font-family:'Anton';
    font-size:clamp(1.5rem,6vmin,2.6rem); letter-spacing:1px; padding:4px 18px 6px; border-radius:12px; transform:rotate(-2deg);
    box-shadow:0 6px 0 rgba(0,0,0,.25); text-transform:uppercase; line-height:1.1; }
.spw-offer-tag-clock { display:block; font-family:'Archivo'; font-weight:900; font-size:.42em; letter-spacing:2px; color:#fff; margin-top:2px; }
.spw-offer-tag-clock b { font-family:'Anton'; font-size:1.9em; letter-spacing:1px; color:var(--spw-yellow); font-weight:400; font-variant-numeric:tabular-nums; margin-left:6px; vertical-align:-2px; }

/* ---- starburst: struck regular price + % off ---- */
.spw-burst-was { font-weight:900; font-size:clamp(.66rem,2vmin,.85rem); text-decoration:line-through; text-decoration-thickness:2px; text-decoration-color:var(--spw-red); }
.spw-burst-off { font-weight:900; font-size:clamp(.6rem,1.8vmin,.76rem); text-transform:uppercase; color:var(--spw-red); }
.spw-offer-fine { margin-top:10px; color:#fff; font-weight:700; font-size:clamp(.78rem,2.2vmin,.9rem); opacity:.95; }

/* ---- price card ---- */
.spw-pick-valid { font-size:.82rem; font-weight:700; color:#334155; margin-top:2px; }
.spw-pick-valid b { color:var(--spw-ink); }
.spw-pick-was { font-size:.85rem; color:#64748b; font-weight:700; }
.spw-pick-was s, .spw-pm-was s { text-decoration-thickness:2px; text-decoration-color:var(--spw-red); }
.spw-pick-save { display:inline-block; margin-top:6px; background:var(--spw-red); color:#fff; font-weight:900; font-size:.72rem; text-transform:uppercase; letter-spacing:1px; padding:3px 10px; border-radius:999px; }
.spw-pick-save span { font-variant-numeric:tabular-nums; }

/* ---- checkout modal header ---- */
.spw-pm-offer { background:var(--spw-ink); color:var(--spw-yellow); font-family:'Anton'; font-size:1.6rem; letter-spacing:1px; text-transform:uppercase; border-radius:12px; padding:6px 10px; margin:4px 0 8px; }
.spw-pm-was { color:#64748b; font-weight:700; font-size:.9rem; margin-top:4px; }
.spw-pm-clock { color:var(--spw-red); font-weight:800; font-size:.85rem; margin-top:6px; }
.spw-pm-clock span { font-variant-numeric:tabular-nums; }
.spw-pm-sub b { color:var(--spw-ink); }

/* ---- the offer's motion (only while it is live; never for reduced-motion users) ---- */
@media (prefers-reduced-motion:no-preference) {
    .spw-cta.is-offer { animation:spw-pulse 1.6s ease-in-out infinite; }
    .spw-burst.is-offer { animation:spw-wobble 2.4s ease-in-out infinite; }
    .spw-offer-bar .spw-clock { animation:spw-blink 1s steps(2) infinite; }
}
@keyframes spw-pulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.05); } }
@keyframes spw-wobble { 0%,100% { transform:rotate(-8deg) scale(1); } 50% { transform:rotate(-3deg) scale(1.07); } }
@keyframes spw-blink { 50% { opacity:.55; } }

/* ---- phone sticky buy bar (hidden above phone width) ---- */
.spw-stick { display:none; }

/* ---- phones: price + buy on the first screen ---- */
@media (max-width:560px) {
    .spw-offer-bar { flex-wrap:nowrap; padding:7px 10px; gap:8px; font-size:.82rem; }
    .spw-offer-bar-lg { display:none; }
    .spw-offer-bar-sm { display:inline; }
    body.spw-is-offer .spw-marquee--game { display:none; }

    .spw-hero.spw-screen { min-height:0; justify-content:flex-start; padding:14px 0 96px; }
    .spw-badge { font-size:.66rem; padding:4px 12px; }
    .spw-badge-valid { display:block; font-size:.9em; letter-spacing:.6px; }
    .spw-badge-dot { display:none; }
    .spw-hero h1 { font-size:1.6rem; margin:10px 0 6px; }
    .spw-chips { gap:6px; margin-top:6px; }
    .spw-chips li { font-size:.76rem; padding:4px 10px 4px 5px; gap:6px; box-shadow:0 3px 0 rgba(0,0,0,.2); transform:none; }
    .spw-chips li:nth-child(odd), .spw-chips li:nth-child(even) { transform:none; }
    .spw-chip-ic { width:22px; height:22px; font-size:.75rem; }
    .spw-hero .spw-deck--small { display:none; }
    .spw-offer-tag { font-size:1.45rem; margin-top:12px; padding:4px 14px; }
    .spw-hero-grid { margin-top:12px; gap:10px; }
    .spw-hero .spw-phone { zoom:.72; }
    .spw-burst { width:138px; }
    .spw-cta { font-size:1.15rem; margin-top:14px; padding:12px 20px; }
    .spw-offer-fine { font-size:.76rem; }
    .spw-hero .spw-datasafe { font-size:.76rem; padding:6px 12px; }
    .spw-order.spw-screen { min-height:0; padding:34px 0 110px; }
    .spw-footnote { padding-bottom:96px; }

    .spw-stick { display:flex; position:fixed; left:0; right:0; bottom:0; z-index:900; align-items:center; gap:10px;
        background:var(--spw-ink); color:#fff; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); box-shadow:0 -8px 24px rgba(0,0,0,.35); }
    .spw-stick-l { flex:1; min-width:0; }
    .spw-stick-p { font-family:'Anton'; font-size:1.5rem; line-height:1; color:var(--spw-yellow); }
    .spw-stick-p s { font-family:'Archivo'; font-size:.8rem; color:#9ca3af; font-weight:800; margin-left:4px; }
    .spw-stick-t { font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.5px; color:#e5e7eb; margin-top:3px; }
    .spw-stick-t b { color:var(--spw-yellow); font-variant-numeric:tabular-nums; }
    .spw-stick-b { flex:0 0 auto; background:var(--spw-yellow); color:var(--spw-ink); border:0; border-radius:12px; font-family:'Anton'; font-size:1.1rem;
        text-transform:uppercase; padding:12px 16px; box-shadow:0 4px 0 rgba(0,0,0,.35); cursor:pointer; }
    body.spw-modal-open .spw-stick { display:none; }

    /* checkout slides up from the bottom like an app sheet */
    .spw-pay-modal { padding:0; align-items:flex-end; }
    .spw-pay-modal-card { border-radius:20px 20px 0 0; max-height:92dvh; padding:20px 16px calc(16px + env(safe-area-inset-bottom)); }
    .spw-pm-offer { font-size:1.3rem; }
}

/* ---- penalty-tracker add-on (soccer / hockey, CR req_dj6sf4MOjVtA): a switch under the modal's
   price, and the highlighted BONUS line once it is on (partials.season-pass-wall.addon-toggle) ---- */
.spw-addon { margin:10px 0 2px; display:flex; flex-direction:column; align-items:center; gap:8px; }
.spw-addon-switch { display:inline-flex; align-items:center; gap:10px; cursor:pointer; font-weight:800; color:var(--spw-ink); font-size:.95rem; text-align:left; }
.spw-addon-switch input { position:absolute; opacity:0; width:1px; height:1px; pointer-events:none; }
.spw-addon-track { position:relative; flex:none; width:46px; height:26px; border-radius:999px; background:#cbd5e1; transition:background .15s; }
.spw-addon-thumb { position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.3); transition:transform .15s; }
.spw-addon-switch input:checked + .spw-addon-track { background:var(--spw-red); }
.spw-addon-switch input:checked + .spw-addon-track .spw-addon-thumb { transform:translateX(20px); }
.spw-addon-switch input:focus-visible + .spw-addon-track { outline:3px solid var(--spw-yellow); outline-offset:2px; }
.spw-addon-text b { color:var(--spw-red); }
.spw-addon-bonus { background:var(--spw-yellow); color:var(--spw-ink); font-weight:900; text-transform:uppercase; letter-spacing:.8px; font-size:.8rem; padding:5px 12px; border-radius:999px; box-shadow:0 3px 0 rgba(0,0,0,.18); }
