.black-friday{

  --honey:#FFC83D; --deep-honey:#C98500; --charcoal:#1F1B16; --cream:#FFF8E7;

  --bg:#FFF8E7; --surface:#FFFFFF; --ink:#1F1B16; --muted:#6A6152; --line:#EADFC6;
  --accent:#C98500; --accent-ink:#1F1B16; --strike:#9A9080;
  --band:#1F1B16; --band-ink:#FFF8E7; --band-muted:#BFB49E; --band-line:#3A332A;
  --font-display:"Fredoka",ui-sans-serif,system-ui,sans-serif;
  --font-body:"Nunito",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-code:ui-monospace,ui-monospace,Menlo,Consolas,monospace;
}



.black-friday *{box-sizing:border-box}
.black-friday{background:var(--bg);color:var(--ink);font:16px/1.6 var(--font-body)}
.black-friday a{color:inherit}
.black-friday :focus-visible{outline:3px solid var(--honey);outline-offset:3px;border-radius:6px}
.black-friday .gutter{padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.black-friday .inner{max-width:1080px;margin:0 auto}

.black-friday
.hero{background:var(--band);color:var(--band-ink);position:relative;overflow:hidden}
.black-friday .hero::before{content:"";position:absolute;inset:0;opacity:.09;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M28 0l28 16v32L28 64 0 48V16zM28 64v33M0 16L-28 0M56 16L84 0' fill='none' stroke='%23FFC83D' stroke-width='1.5'/%3E%3C/svg%3E");background-size:56px 97px}
.black-friday .hero .inner{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:48px;align-items:center;padding-block:64px 72px}
.black-friday .eyebrow{font:700 13px var(--font-body);letter-spacing:.14em;text-transform:uppercase;color:var(--honey);display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.black-friday .eyebrow .dates{color:var(--band-muted);letter-spacing:.06em}
.black-friday .hero h1{font:800 clamp(40px,7vw,76px)/1 var(--font-display);margin:14px 0 18px;letter-spacing:-.025em;text-wrap:balance}
.black-friday .hero h1 em{font-style:normal;color:var(--honey)}
.black-friday .hero .sub{font-size:19px;color:var(--band-muted);max-width:46ch;margin:0}
.black-friday .hero .sub strong{color:var(--band-ink);font-weight:600}
.black-friday .cta-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:28px}
.black-friday .btn{display:inline-flex;align-items:center;gap:8px;font:700 17px var(--font-body);text-decoration:none;padding:14px 26px;border-radius:999px;border:0;cursor:pointer}
.black-friday .btn-honey{background:var(--honey);color:var(--charcoal)}
.black-friday .btn-honey:hover{background:#FFD566}
.black-friday .btn-ghost{background:transparent;color:var(--band-ink);box-shadow:inset 0 0 0 1.5px var(--band-line)}
.black-friday .small-note{font-size:14px;color:var(--band-muted)}

.black-friday
.label{background:var(--honey);color:var(--charcoal);border-radius:18px;padding:26px 26px 22px;transform:rotate(-2deg);box-shadow:0 18px 40px rgba(0,0,0,.35);max-width:400px;justify-self:end;width:100%}
.black-friday .label .top{display:flex;justify-content:space-between;font:700 12px var(--font-body);letter-spacing:.12em;text-transform:uppercase}
.black-friday .label .pct{font:800 clamp(64px,10vw,104px)/.95 var(--font-display);letter-spacing:-.04em;margin:10px 0 2px}
.black-friday .label .what{font-weight:600;font-size:16px}
.black-friday .codebox{margin-top:18px;display:flex;align-items:stretch;border:2px dashed var(--charcoal);border-radius:12px;overflow:hidden}
.black-friday .codebox code{flex:1;font:700 26px var(--font-code);letter-spacing:.12em;padding:10px 14px;display:flex;align-items:center;user-select:all}
.black-friday .codebox button{font:700 14px var(--font-body);background:var(--charcoal);color:var(--honey);border:0;padding:0 18px;cursor:pointer;min-width:96px}
.black-friday .label .timer{margin-top:16px;font:600 13px var(--font-body);display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.black-friday .label .timer b{font:700 14px var(--font-code);font-variant-numeric:tabular-nums}

.black-friday
main section{padding-block:64px}
.black-friday main section+section{border-top:1px solid var(--line)}
.black-friday h2{font:800 clamp(28px,4vw,40px)/1.1 var(--font-display);margin:0 0 10px;letter-spacing:-.015em;text-wrap:balance}
.black-friday .lead{color:var(--muted);max-width:62ch;margin:0 0 32px;font-size:17px}

.black-friday .steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;counter-reset:s}
.black-friday .steps li{counter-increment:s;background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:22px;min-width:0}
.black-friday .steps li::before{content:counter(s);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--honey);color:var(--charcoal);font:800 16px var(--font-display);margin-bottom:14px}
.black-friday .steps h3{font:700 18px var(--font-body);margin:0 0 6px}
.black-friday .steps p{margin:0;color:var(--muted)}
.black-friday .steps .tag{font-family:var(--font-code);font-weight:700;background:var(--bg);border:1px solid var(--line);padding:1px 6px;border-radius:6px;color:var(--ink);white-space:nowrap}

.black-friday .toggle{display:inline-flex;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:4px;margin-bottom:24px}
.black-friday .toggle button{font:600 15px var(--font-body);border:0;background:transparent;color:var(--muted);padding:8px 18px;border-radius:999px;cursor:pointer}
.black-friday .toggle button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.black-friday .toggle .save{font-weight:500;font-size:13px;opacity:.8}

.black-friday .plans{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.black-friday .plan{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:26px;display:flex;flex-direction:column;gap:14px;min-width:0}
.black-friday .plan.pop{border:2px solid var(--accent)}
.black-friday .plan .head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.black-friday .plan h3{font:800 24px var(--font-display);margin:0}
.black-friday .badge{font:700 11px var(--font-body);letter-spacing:.08em;text-transform:uppercase;background:var(--honey);color:var(--charcoal);padding:4px 10px;border-radius:999px}
.black-friday .plan .first{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.black-friday .plan .now{font:800 44px/1 var(--font-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.black-friday .plan .was{color:var(--strike);text-decoration:line-through;font-size:18px;font-variant-numeric:tabular-nums}
.black-friday .plan .period{color:var(--muted);font-size:15px}
.black-friday .plan .renew{font-size:14px;color:var(--muted);background:var(--bg);border-radius:10px;padding:8px 12px}
.black-friday .plan .renew b{color:var(--ink);font-variant-numeric:tabular-nums}
.black-friday .plan ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:15px}
.black-friday .plan li{display:flex;gap:10px}
.black-friday .plan li::before{content:"";flex:none;width:16px;height:16px;margin-top:4px;border-radius:50%;background:var(--honey) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='%231F1B16' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.black-friday .plan .btn{margin-top:auto;justify-content:center;background:var(--ink);color:var(--bg)}
.black-friday .plan.pop .btn{background:var(--honey);color:var(--charcoal)}

.black-friday .faq{display:grid;gap:12px;max-width:760px}
.black-friday .faq details{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 20px}
.black-friday .faq summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}
.black-friday .faq summary::after{content:"+";font:700 20px/1 var(--font-display);color:var(--accent)}
.black-friday .faq details[open] summary::after{content:"–"}
.black-friday .faq p{margin:10px 0 0;color:var(--muted)}
.black-friday .terms{font-size:14px;color:var(--muted);max-width:760px;margin-top:28px}
.black-friday .terms ul{margin:8px 0 0;padding-left:18px;display:grid;gap:4px}

.black-friday
.ended-box{background:var(--surface);border:1px solid var(--band-line);border-radius:18px;padding:28px;max-width:400px;justify-self:end;width:100%;color:var(--ink)}
.black-friday .ended-box h2{font-size:28px}
.black-friday .ended-box p{color:var(--muted);margin:0 0 18px}

@media (max-width:860px){
  .black-friday .hero .inner{grid-template-columns:1fr;gap:36px;padding-block:44px 56px}
  .black-friday .label,.black-friday .ended-box{justify-self:start;transform:none}
  .black-friday .steps,.black-friday .plans{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.black-friday *{transition:none!important;animation:none!important}}

.black-friday [hidden]{display:none!important}.black-friday h1,.black-friday h2,.black-friday h3{font-weight:600}.black-friday section p{margin:0 0 12px}.black-friday .hero .sub{margin:0}.black-friday{overflow:hidden}