/* Spy-da Productions Shop — matches the main site (black / #e50914) */
:root {
    --bg:#050505;
    --bg-soft:#0c0c0c;
    --card:#141414;
    --card-2:#1b1b1b;
    --text:#ffffff;
    --muted:#b8b8b8;
    --red:#e50914;
    --line:rgba(255,255,255,0.12);
    --glow:rgba(229,9,20,0.35);
    --radius:24px;
    --max:1180px;
}
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { font-family:Arial, Helvetica, sans-serif; background:var(--bg); color:var(--text); line-height:1.6; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; display:block; }
p { color:var(--muted); }
.red { color:var(--red); }
.container { width:min(var(--max), calc(100% - 32px)); margin:0 auto; }
.narrow { max-width:820px; }
.section-pad { padding:90px 0; }

/* ---------- header ---------- */
.site-header { position:sticky; top:0; z-index:999; background:rgba(0,0,0,0.85); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); border-bottom:1px solid var(--line); }
.navbar { width:min(var(--max), calc(100% - 32px)); margin:0 auto; min-height:84px; display:flex; align-items:center; justify-content:space-between; gap:20px; position:relative; }
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark img { width:132px; height:62px; object-fit:contain; object-position:left center; }
.brand-text strong { display:block; font-size:1rem; line-height:1.1; }
.brand-text small { color:var(--muted); font-size:0.75rem; }
.nav-links { display:flex; align-items:center; gap:22px; font-size:0.92rem; color:#e8e8e8; }
.nav-links a:hover { color:var(--red); }
.nav-cta { padding:10px 18px; border-radius:999px; background:var(--red); color:#fff !important; box-shadow:0 0 24px var(--glow); display:inline-flex; align-items:center; gap:8px; }
.cart-count { background:#fff; color:var(--red); border-radius:999px; font-size:0.75rem; font-weight:800; min-width:20px; height:20px; display:inline-grid; place-items:center; padding:0 6px; }
.menu-toggle { display:none; background:transparent; border:1px solid var(--line); color:#fff; padding:8px 12px; border-radius:10px; font-size:1.3rem; cursor:pointer; }

/* ---------- type + buttons ---------- */
.eyebrow { color:var(--red); font-size:0.8rem; text-transform:uppercase; letter-spacing:0.16em; font-weight:800; margin-bottom:12px; }
h1 { font-size:clamp(2.6rem, 6vw, 5.4rem); line-height:0.95; letter-spacing:-0.05em; margin-bottom:22px; }
h2 { font-size:clamp(2rem, 4vw, 3.6rem); line-height:1; letter-spacing:-0.04em; margin-bottom:18px; }
h3 { font-size:1.3rem; margin-bottom:6px; letter-spacing:-0.01em; }
.page-title { font-size:clamp(2.2rem, 5vw, 3.6rem); }
.small-h2 { font-size:1.6rem; letter-spacing:-0.02em; margin:46px 0 18px; }
.section-heading { text-align:center; max-width:760px; margin:0 auto 46px; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:13px 22px; border-radius:999px; font-weight:800; border:1px solid transparent; cursor:pointer; font-size:0.95rem; font-family:inherit; transition:transform .15s ease, box-shadow .15s ease, background .15s ease; }
.btn:hover { transform:translateY(-1px); }
.btn-primary { background:var(--red); color:#fff; box-shadow:0 0 28px var(--glow); }
.btn-primary:hover { box-shadow:0 0 38px rgba(229,9,20,0.55); }
.btn-ghost { background:rgba(255,255,255,0.06); color:#fff; border-color:var(--line); }
.btn-ghost:hover { border-color:rgba(255,255,255,0.35); }
.btn-sm { min-height:40px; padding:9px 16px; font-size:0.88rem; }
.btn-block { width:100%; }
.link-btn { background:none; border:0; color:var(--muted); text-decoration:underline; cursor:pointer; font-size:0.85rem; padding:0; font-family:inherit; }

/* ---------- flash ---------- */
.flash { padding:14px 0; font-weight:700; border-bottom:1px solid var(--line); }
.flash-ok { background:#0f2a14; color:#7ff09a; }
.flash-error { background:#2a0d0f; color:#ff8a8f; }
.flash-info { background:#141414; color:#ddd; }
.flash-inline { background:#2a0d0f; color:#ff8a8f; padding:14px; border-radius:14px; }

/* ---------- hero ---------- */
.shop-hero { position:relative; overflow:hidden; padding:90px 0 70px; border-bottom:1px solid var(--line);
    background: radial-gradient(circle at 15% 15%, rgba(229,9,20,0.25), transparent 35%), radial-gradient(circle at 85% 60%, rgba(229,9,20,0.14), transparent 40%), #050505; }
.shop-hero-grid { display:grid; grid-template-columns:1.05fr 0.95fr; gap:40px; align-items:center; }
.hero-text { font-size:1.15rem; max-width:620px; margin-bottom:28px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:30px; }
.trust-row { display:flex; flex-wrap:wrap; gap:10px; }
.trust-row span { border:1px solid var(--line); background:rgba(255,255,255,0.06); padding:9px 14px; border-radius:999px; color:#e7e7e7; font-size:0.86rem; }
.hero-stack { position:relative; height:440px; }
.hero-stack img { position:absolute; width:78%; border-radius:16px; box-shadow:0 40px 80px rgba(0,0,0,0.65), 0 0 0 1px rgba(255,255,255,0.08); }
.stack-a { right:0; top:0; transform:rotate(2deg); z-index:3; }
.stack-b { left:0; top:120px; transform:rotate(-4deg); z-index:2; opacity:.92; }
.stack-c { right:6%; bottom:0; transform:rotate(5deg); z-index:1; opacity:.8; }

/* ---------- plugins ---------- */
.plugin-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; }
.plugin-card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; transition:border-color .2s ease, transform .2s ease; }
.plugin-card:hover { border-color:color-mix(in srgb, var(--accent) 60%, transparent); transform:translateY(-3px); }
.plugin-face { position:relative; background:#0a0a0a; border-bottom:1px solid var(--line); aspect-ratio:16/10; overflow:hidden; }
.plugin-face img { width:100%; height:100%; object-fit:cover; }
.badge { position:absolute; top:14px; left:14px; background:var(--red); color:#fff; font-size:0.72rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:5px 10px; border-radius:999px; }
.plugin-body { padding:22px; display:flex; flex-direction:column; flex:1; }
.plugin-cat { color:var(--accent, var(--red)); font-size:0.75rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; margin-bottom:6px; }
.plugin-tag { color:#eee; font-weight:700; margin-bottom:8px; }
.plugin-formats { font-size:0.75rem; color:#8a8a8a; letter-spacing:.06em; text-transform:uppercase; margin:-4px 0 10px; }
.plugin-desc { font-size:0.92rem; margin-bottom:14px; }
.tick-list { list-style:none; display:grid; gap:7px; margin:4px 0 18px; }
.tick-list li { position:relative; padding-left:24px; color:#ddd; font-size:0.92rem; }
.tick-list li::before { content:""; position:absolute; left:2px; top:7px; width:10px; height:6px; border-left:2px solid var(--red); border-bottom:2px solid var(--red); transform:rotate(-45deg); }
.plugin-foot { margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:14px; border-top:1px solid var(--line); }
.plugin-price strong { font-size:1.5rem; letter-spacing:-0.03em; }
.plugin-price span { color:var(--muted); font-size:0.88rem; }
.included-in { font-size:0.78rem; color:#8a8a8a; margin-top:12px; }

/* ---------- plans ---------- */
.plans-section { background:linear-gradient(180deg, #0b0b0b, #050505); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.billing-toggle { display:inline-flex; gap:4px; padding:5px; border-radius:999px; border:1px solid var(--line); background:#0f0f0f; margin-top:18px; }
.billing-toggle button, .billing-toggle a { background:transparent; border:0; color:#ccc; padding:10px 20px; border-radius:999px; font-weight:800; cursor:pointer; font-size:0.9rem; font-family:inherit; }
.billing-toggle .active { background:var(--red); color:#fff; }
.billing-toggle em { font-style:normal; font-size:0.72rem; opacity:.85; margin-left:6px; }
.plan-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:22px; align-items:stretch; }
.plan-card { position:relative; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:32px 28px; display:flex; flex-direction:column; }
.plan-card.featured { border-color:var(--red); box-shadow:0 0 0 1px var(--red), 0 30px 80px rgba(229,9,20,0.18); background:linear-gradient(180deg, #1a0a0b, #141414 45%); }
.plan-flag { position:absolute; top:-13px; left:50%; transform:translateX(-50%); background:var(--red); color:#fff; font-size:0.74rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:6px 14px; border-radius:999px; white-space:nowrap; }
.plan-blurb { margin-bottom:18px; }
.plan-price strong { font-size:3rem; letter-spacing:-0.05em; line-height:1; }
.plan-price span { color:var(--muted); margin-left:4px; }
.plan-save { font-size:0.85rem; color:#ff6b72; margin:8px 0 20px; }
.plan-card .tick-list { margin-bottom:26px; flex:1; align-content:start; }
.plan-card form { margin-top:auto; }
[data-billing="month"] .when-year, [data-billing="year"] .when-month { display:none !important; }
.steps { display:grid; grid-template-columns:repeat(4, 1fr); gap:18px; margin-top:56px; }
.step { border:1px solid var(--line); border-radius:20px; padding:22px; background:rgba(255,255,255,0.03); }
.step strong { color:var(--red); font-size:0.85rem; letter-spacing:.14em; }
.step h4 { margin:8px 0 6px; font-size:1.05rem; }
.step p { font-size:0.9rem; }
.step a { color:var(--red); }

/* ---------- merch ---------- */
.merch-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; }
.merch-card { background:var(--card); border:1px solid var(--line); border-radius:20px; overflow:hidden; transition:transform .2s ease, border-color .2s ease; }
.merch-card:hover { transform:translateY(-3px); border-color:rgba(229,9,20,0.6); }
.merch-img { position:relative; aspect-ratio:1/1; background:radial-gradient(circle at 50% 35%, #2a2a2a, #121212 70%); }
.merch-img img { width:100%; height:100%; object-fit:cover; }
.merch-body { padding:16px 18px 18px; }
.merch-body h3 { font-size:1rem; }
.merch-meta { display:flex; align-items:center; justify-content:space-between; margin-top:6px; }
.swatches { display:flex; gap:6px; }
.swatches i { width:14px; height:14px; border-radius:50%; border:1px solid rgba(255,255,255,0.35); display:block; }

/* ---------- product ---------- */
.product-grid { display:grid; grid-template-columns:1.05fr 0.95fr; gap:50px; align-items:start; }
.product-main { position:relative; border-radius:24px; overflow:hidden; border:1px solid var(--line); background:radial-gradient(circle at 50% 35%, #2a2a2a, #111 70%); aspect-ratio:1/1; }
.product-main img { width:100%; height:100%; object-fit:cover; }
.product-thumbs { display:flex; gap:12px; margin-top:14px; }
.thumb { width:84px; height:84px; border-radius:14px; overflow:hidden; border:2px solid var(--line); background:#151515; cursor:pointer; padding:0; }
.thumb.active { border-color:var(--red); }
.product-title { font-size:clamp(2.2rem, 4.5vw, 3.6rem); margin-bottom:10px; }
.product-price { font-size:1.8rem; color:#fff; font-weight:800; margin-bottom:14px; }
.buy-form { margin:26px 0; display:grid; gap:20px; }
.buy-form fieldset { border:0; }
.buy-form legend { font-weight:800; margin-bottom:10px; font-size:0.92rem; }
.buy-form legend span { color:var(--muted); font-weight:400; }
.swatch-pick { display:flex; gap:10px; }
.swatch-pick input, .size-pick input { position:absolute; opacity:0; pointer-events:none; }
.swatch-pick i { display:block; width:38px; height:38px; border-radius:50%; border:2px solid rgba(255,255,255,0.25); cursor:pointer; box-shadow:inset 0 0 0 3px #050505; }
.swatch-pick input:checked + i { border-color:var(--red); }
.swatch-pick input:focus-visible + i, .size-pick input:focus-visible + span { outline:2px solid #fff; outline-offset:2px; }
.size-pick { display:flex; flex-wrap:wrap; gap:8px; }
.size-pick span { display:inline-grid; place-items:center; min-width:54px; height:44px; padding:0 14px; border-radius:12px; border:1px solid var(--line); background:#111; cursor:pointer; font-weight:700; }
.size-pick input:checked + span { background:#fff; color:#000; border-color:#fff; }
.qty-row { display:flex; align-items:center; gap:12px; }
.qty-row label { font-weight:800; font-size:0.92rem; }
.qty-row input, .cart-qty { width:74px; height:48px; border-radius:12px; border:1px solid var(--line); background:#111; color:#fff; text-align:center; font-size:1rem; }
.qty-row .btn { flex:1; }
.ship-note { border:1px solid var(--line); border-radius:16px; padding:16px; display:grid; gap:4px; background:rgba(255,255,255,0.03); }
.ship-note span { color:var(--muted); font-size:0.9rem; }
.more-merch { padding-top:0; }

/* ---------- cart ---------- */
.cart-lines { border-top:1px solid var(--line); }
.cart-line { display:grid; grid-template-columns:88px 1fr 80px 90px; gap:18px; align-items:center; padding:18px 0; border-bottom:1px solid var(--line); }
.cart-img img { width:88px; height:88px; object-fit:cover; border-radius:14px; background:#1a1a1a; }
.cart-info { display:grid; gap:2px; }
.cart-info span { color:var(--muted); font-size:0.9rem; }
.cart-info .link-btn { justify-self:start; margin-top:4px; }
.cart-price { text-align:right; font-weight:800; }
.cart-actions { display:flex; justify-content:flex-end; margin:14px 0 30px; }
.cart-summary { background:var(--card); border:1px solid var(--line); border-radius:22px; padding:24px; display:grid; gap:12px; max-width:420px; margin-left:auto; }
.cart-summary > div { display:flex; justify-content:space-between; gap:12px; color:#ddd; }
.free-ship-note { font-size:0.88rem; color:#ff6b72; }
.secure-note { font-size:0.8rem; text-align:center; }
.empty-box { border:1px dashed var(--line); border-radius:22px; padding:40px; text-align:center; display:grid; gap:14px; justify-items:center; }
.empty-box .btn { min-width:180px; }

/* ---------- account ---------- */
.center-box { text-align:center; margin:0 auto; }
.login-form { display:flex; gap:10px; max-width:520px; margin:26px auto 16px; }
.login-form input { flex:1; height:50px; border-radius:999px; border:1px solid var(--line); background:#111; color:#fff; padding:0 20px; font-size:1rem; }
.muted-small { font-size:0.85rem; color:#8f8f8f; }
.account-head { display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap; }
.sub-list { display:grid; gap:12px; }
.sub-row { display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px 22px; }
.sub-row.inactive { opacity:.55; }
.status { display:inline-block; font-size:0.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; padding:3px 9px; border-radius:999px; margin-left:8px; background:#333; color:#ddd; vertical-align:middle; }
.status-active, .status-trialing { background:#0f2a14; color:#7ff09a; }
.status-past_due { background:#2a220d; color:#ffd36b; }
.status-canceled, .status-unpaid, .status-incomplete_expired { background:#2a0d0f; color:#ff8a8f; }
.licence { display:grid; gap:4px; text-align:right; }
.licence span { font-size:0.75rem; color:var(--muted); text-transform:uppercase; letter-spacing:.1em; }
.licence code, .admin-table code { font-family:Menlo, Consolas, monospace; background:#0a0a0a; border:1px solid var(--line); padding:6px 10px; border-radius:8px; color:#fff; user-select:all; }
.download-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:14px; }
.download-card { display:grid; grid-template-columns:72px 1fr auto; gap:14px; align-items:center; background:var(--card); border:1px solid var(--line); border-radius:18px; padding:14px; }
.download-card img { width:72px; height:46px; object-fit:cover; border-radius:8px; }
.download-card strong { display:block; font-size:0.95rem; }
.download-card.locked { opacity:.55; }
.soon { font-size:0.78rem; color:#ffd36b; max-width:120px; text-align:right; }
.install-help { margin-top:40px; border:1px solid var(--line); border-radius:20px; padding:24px; background:rgba(255,255,255,0.03); }
.install-help ol { margin:10px 0 0 20px; color:var(--muted); display:grid; gap:6px; }

/* ---------- faq + terms ---------- */
.faq-section details { border-bottom:1px solid var(--line); padding:18px 0; }
.faq-section summary { cursor:pointer; font-weight:800; font-size:1.05rem; list-style:none; display:flex; justify-content:space-between; gap:16px; }
.faq-section summary::after { content:"+"; color:var(--red); font-size:1.4rem; line-height:1; }
.faq-section details[open] summary::after { content:"–"; }
.faq-section details p { margin-top:10px; }
.faq-section a { color:var(--red); }
.terms p { margin-bottom:14px; }

/* ---------- admin ---------- */
.admin-stats { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; margin:28px 0; }
.admin-stats div { background:var(--card); border:1px solid var(--line); border-radius:18px; padding:18px; }
.admin-stats strong { display:block; font-size:1.8rem; letter-spacing:-0.03em; }
.admin-stats span { color:var(--muted); font-size:0.85rem; }
.admin-tabs { margin:0 0 20px; }
.table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:18px; }
.admin-table { width:100%; border-collapse:collapse; font-size:0.88rem; min-width:900px; }
.admin-table th, .admin-table td { text-align:left; padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top; }
.admin-table th { background:#111; color:#fff; font-size:0.78rem; text-transform:uppercase; letter-spacing:.08em; }
.admin-table small { color:var(--muted); }
.ship-form { display:flex; gap:6px; }
.ship-form input { width:130px; border-radius:10px; border:1px solid var(--line); background:#111; color:#fff; padding:0 10px; }

/* ---------- footer ---------- */
.site-footer { border-top:1px solid var(--line); background:#080808; padding-top:60px; }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:30px; padding-bottom:40px; }
.footer-grid h4 { margin-bottom:10px; }
.footer-grid a { display:block; color:var(--muted); margin-bottom:6px; }
.footer-grid a:hover { color:var(--red); }
.footer-bottom { text-align:center; color:#777; padding:18px; border-top:1px solid var(--line); font-size:0.88rem; }

/* ---------- responsive ---------- */
@media (max-width:1000px) {
    .plugin-grid, .plan-grid { grid-template-columns:repeat(2, 1fr); }
    .merch-grid { grid-template-columns:repeat(3, 1fr); }
    .steps, .admin-stats { grid-template-columns:repeat(2, 1fr); }
    .download-grid { grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:900px) {
    .menu-toggle { display:block; }
    .nav-links { position:absolute; left:0; right:0; top:76px; display:none; flex-direction:column; align-items:stretch; background:#080808; border:1px solid var(--line); border-radius:18px; padding:18px; }
    .nav-links.active { display:flex; }
    .shop-hero-grid, .product-grid { grid-template-columns:1fr; }
    .hero-stack { height:300px; }
    .plan-card.featured { order:-1; }
}
@media (max-width:640px) {
    .section-pad { padding:64px 0; }
    .shop-hero { padding:60px 0 50px; }
    .brand-text { display:none; }
    .plugin-grid, .plan-grid, .steps, .download-grid, .footer-grid { grid-template-columns:1fr; }
    .merch-grid { grid-template-columns:repeat(2, 1fr); gap:12px; }
    .merch-body { padding:12px; }
    .merch-meta { flex-direction:column; align-items:flex-start; gap:6px; }
    .hero-stack { height:230px; }
    .cart-line { grid-template-columns:70px 1fr 64px; }
    .cart-img img { width:70px; height:70px; }
    .cart-price { grid-column:2 / 4; text-align:left; }
    .login-form { flex-direction:column; }
    .login-form input { min-height:50px; }
    .licence { text-align:left; }
    .admin-stats { grid-template-columns:1fr 1fr; }
}


/* ---------- launch sale ---------- */
.sale-banner { background:linear-gradient(90deg,#7a040b,#e50914 55%,#7a040b); border-bottom:1px solid rgba(255,255,255,0.15); }
.sale-banner-inner { display:flex; align-items:center; gap:16px; padding:10px 0; }
.sale-banner p { color:#fff; font-size:0.95rem; margin:0; flex:1; }
.sale-banner strong { color:#fff; }
.sale-count { background:#000; color:#ffd36b; font-weight:800; font-size:0.82rem; padding:7px 12px; border-radius:999px; white-space:nowrap; }
.sale-star { position:absolute; top:10px; right:10px; width:76px; height:76px; display:grid; place-items:center; z-index:2;
    background:radial-gradient(circle at 35% 30%, #ffe27a, #f5b301 55%, #c98a00);
    clip-path:polygon(50.0% 0.0%, 58.0% 9.8%, 69.1% 3.8%, 72.8% 15.9%, 85.4% 14.6%, 84.1% 27.2%, 96.2% 30.9%, 90.2% 42.0%, 100.0% 50.0%, 90.2% 58.0%, 96.2% 69.1%, 84.1% 72.8%, 85.4% 85.4%, 72.8% 84.1%, 69.1% 96.2%, 58.0% 90.2%, 50.0% 100.0%, 42.0% 90.2%, 30.9% 96.2%, 27.2% 84.1%, 14.6% 85.4%, 15.9% 72.8%, 3.8% 69.1%, 9.8% 58.0%, 0.0% 50.0%, 9.8% 42.0%, 3.8% 30.9%, 15.9% 27.2%, 14.6% 14.6%, 27.2% 15.9%, 30.9% 3.8%, 42.0% 9.8%); filter:drop-shadow(0 6px 14px rgba(0,0,0,0.5)); transform:rotate(-12deg);
    animation:starPulse 2.8s ease-in-out infinite; }
.sale-star span { color:#1a0a00; font-weight:900; font-size:0.78rem; line-height:1; text-align:center; letter-spacing:.02em; }
.sale-star.small { position:static; width:54px; height:54px; flex:0 0 auto; animation:none; }
.sale-star.small span { font-size:0.62rem; }
.plan-star { top:-22px; right:-14px; width:70px; height:70px; }
@keyframes starPulse { 0%,100% { transform:rotate(-12deg) scale(1); } 50% { transform:rotate(-8deg) scale(1.06); } }
@media (prefers-reduced-motion:reduce) { .sale-star { animation:none; } }
.then-price { display:block; font-style:normal; font-size:0.78rem; color:#ffb3b7; margin-top:2px; }
.trust-row .trust-sale { background:rgba(245,179,1,0.15); border-color:rgba(245,179,1,0.5); color:#ffd36b; font-weight:800; }
.plugin-foot { flex-direction:column; align-items:stretch; gap:12px; }
.buy-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.buy-row + .buy-row { padding-top:12px; border-top:1px dashed var(--line); }
.buy-label { display:block; font-size:0.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#8a8a8a; margin-bottom:2px; }
.buy-row .btn { min-width:104px; }
@media (max-width:640px) {
    .sale-banner-inner { flex-wrap:wrap; gap:10px; }
    .sale-banner p { font-size:0.85rem; flex-basis:calc(100% - 70px); }
    .sale-star { width:64px; height:64px; }
}
.plans-section { overflow-x:clip; }
@media (max-width:640px) { .plan-star { right:4px; top:-18px; } }
