/* Black Friday week 2026 (Mon 23 to Mon 30 November)
   .bfp  = the /black-friday/ page body
   .hrbf = the homepage section
   Both switch state from /assets/js/black-friday.js. Safe to delete after the offer. */

.bfp,.hrbf{--bf-black:#09090B;--bf-coal:#121215;--bf-card:#17171B;--bf-line:#2A2A31;--bf-gold:#E5B249;--bf-gold-l:#F2CC75;--bf-text:#E8E8EC;--bf-muted:#A3A3AD;--bf-head:'Archivo',Arial,sans-serif;--bf-body:'Inter',Arial,sans-serif}
.bfp,.bfp *,.hrbf,.hrbf *{box-sizing:border-box}
.bfp :where(h1,h2,h3,p,ul,ol,table),.hrbf :where(h1,h2,h3,p,ul,ol){margin:0;padding:0}
.bfp{background:var(--bf-black);color:var(--bf-text);font-family:var(--bf-body);font-size:17px;line-height:1.55}
.bfp a{color:inherit}
.bfp .bf-wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.bfp h1,.bfp h2,.bfp h3{font-family:var(--bf-head);font-weight:900;line-height:1.02;letter-spacing:-.01em;color:#fff}
.bfp .bf-eb{font:800 13px/1.2 var(--bf-head);letter-spacing:.18em;text-transform:uppercase;color:var(--bf-gold)}
.bfp :focus-visible,.hrbf :focus-visible{outline:3px solid var(--bf-gold);outline-offset:3px}

/* states: bf-up = before it starts, bf-live = during, bf-end = after, bf-on = before and during */
.bfp:not(.is-upcoming) .bf-up,.bfp:not(.is-ended) .bf-end,.bfp.is-upcoming .bf-live,.bfp.is-ended .bf-live,.bfp.is-ended .bf-on{display:none!important}

/* ticker + status */
.bfp .bf-ticker{background:var(--bf-black);color:var(--bf-gold);overflow:hidden;white-space:nowrap;font:900 15px/1 var(--bf-head);letter-spacing:.14em;text-transform:uppercase;padding:14px 0;border-top:3px solid var(--bf-gold);border-bottom:1px solid var(--bf-line)}
.bfp .bf-run{display:inline-block;animation:bf-run 38s linear infinite}
.bfp .bf-ticker span{margin:0 18px}.bfp .bf-ticker i{font-style:normal;opacity:.6}
@keyframes bf-run{to{transform:translateX(-50%)}}
.bfp .bf-status{background:var(--bf-coal);text-align:center;padding:10px 16px;font-size:14px;font-weight:600;border-bottom:1px solid var(--bf-line)}

/* hero */
.bfp .bf-hero{position:relative;overflow:hidden;padding:76px 0 84px;background:radial-gradient(900px 420px at 85% -10%,rgba(229,178,73,.18),transparent 60%),repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 2px,transparent 2px 22px),var(--bf-black)}
.bfp .bf-pill,.hrbf .hrbf-pill{display:inline-flex;gap:10px;align-items:center;border:1px solid var(--bf-gold);color:var(--bf-gold);border-radius:999px;padding:8px 16px;font:800 13px var(--bf-head);letter-spacing:.14em;text-transform:uppercase}
.bfp .bf-pill:before,.hrbf .hrbf-pill:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bf-gold);box-shadow:0 0 0 4px rgba(229,178,73,.2)}
.bfp .bf-word,.hrbf .hrbf-big{font:900 clamp(64px,15vw,184px)/.86 var(--bf-head);letter-spacing:-.035em;text-transform:uppercase;color:#fff;margin-top:18px}
.bfp .bf-word span,.hrbf .hrbf-big span{display:block;color:transparent;-webkit-text-stroke:2px var(--bf-gold)}
@supports not (-webkit-text-stroke:2px #000){.bfp .bf-word span,.hrbf .hrbf-big span{color:var(--bf-gold)}}
.bfp .bf-hero h1{font-size:clamp(38px,6.4vw,72px);margin-top:30px}
.bfp h1 em,.bfp h2 em{font-style:normal;color:var(--bf-gold)}
.bfp .bf-lead{font-size:clamp(18px,2.3vw,21px);color:#C9C9D1;max-width:700px;margin-top:18px}
.bfp .bf-lead a{color:var(--bf-gold)}
.bfp .bf-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.bfp .bf-btn,.hrbf .hrbf-btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:999px;font:800 16px var(--bf-head);text-decoration:none;border:2px solid var(--bf-gold);background:var(--bf-gold);color:var(--bf-black)}
.bfp .bf-btn:hover,.hrbf .hrbf-btn:hover{background:var(--bf-gold-l);border-color:var(--bf-gold-l)}
.bfp .bf-btn.s{background:none;color:#fff}.bfp .bf-btn.s:hover{background:rgba(229,178,73,.12)}
.bfp .bf-label,.hrbf .hrbf-label{font:800 13px var(--bf-head);letter-spacing:.18em;text-transform:uppercase;color:var(--bf-muted)}
.bfp .bf-label{margin-top:34px}
.bfp .bf-count,.hrbf .hrbf-count{display:flex;gap:10px;margin-top:10px}
.bfp .bf-count div,.hrbf .hrbf-count div{background:var(--bf-coal);border:1px solid var(--bf-line);border-top:3px solid var(--bf-gold);border-radius:10px;padding:12px 16px;min-width:84px;text-align:center}
.bfp .bf-count b,.hrbf .hrbf-count b{display:block;font:900 34px var(--bf-head);color:#fff}
.bfp .bf-count span,.hrbf .hrbf-count span{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bf-muted)}
.bfp .bf-jump{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.bfp .bf-jump a{font-size:14px;font-weight:600;border:1px solid var(--bf-line);padding:8px 14px;border-radius:999px;text-decoration:none}
.bfp .bf-jump a:hover{border-color:var(--bf-gold);color:var(--bf-gold)}

/* sections */
.bfp .bf-sec{padding:76px 0;border-top:1px solid var(--bf-line)}
.bfp .bf-sec.alt{background:var(--bf-coal)}
.bfp .bf-sec h2{font-size:clamp(32px,5vw,50px);margin-top:12px}
.bfp .bf-intro{color:var(--bf-muted);max-width:720px;margin-top:14px;font-size:18px}
.bfp .bf-intro a,.bfp .bf-note a{color:var(--bf-gold)}
.bfp .bf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:36px}
.bfp .bf-card{position:relative;background:var(--bf-card);border:1px solid var(--bf-line);border-radius:16px;padding:28px 26px 26px;display:flex;flex-direction:column}
.bfp .bf-card.hi{border-color:var(--bf-gold);box-shadow:0 0 0 1px var(--bf-gold),0 20px 50px rgba(229,178,73,.08)}
.bfp .bf-off{position:absolute;top:-1px;right:22px;background:var(--bf-gold);color:var(--bf-black);font:900 13px var(--bf-head);letter-spacing:.08em;text-transform:uppercase;padding:7px 10px 8px;border-radius:0 0 8px 8px}
.bfp .bf-card h3{font-size:26px}
.bfp .bf-meta{color:var(--bf-muted);font-size:15px;margin-top:4px}
.bfp .bf-price{display:flex;align-items:baseline;gap:12px;margin-top:18px;flex-wrap:wrap}
.bfp .bf-price b{font:900 54px/1 var(--bf-head);color:var(--bf-gold)}
.bfp .bf-price span{font-weight:600;color:var(--bf-muted)}
.bfp .bf-card ul{list-style:none;margin-top:18px;padding-top:16px;border-top:1px solid var(--bf-line);display:grid;gap:8px;font-size:15px;color:#CFCFD6}
.bfp .bf-card li,.bfp .bf-ticks li,.hrbf .hrbf-list li{padding-left:24px;position:relative}
.bfp .bf-card li:before,.bfp .bf-ticks li:before,.hrbf .hrbf-list li:before{content:"";position:absolute;left:2px;top:8px;width:9px;height:9px;transform:rotate(45deg);background:var(--bf-gold)}
.bfp .bf-note{margin-top:20px;color:var(--bf-muted);font-size:15px}
.bfp .bf-soon{align-self:flex-start;font:800 11px var(--bf-head);letter-spacing:.14em;text-transform:uppercase;border:1px solid var(--bf-gold);color:var(--bf-gold);padding:6px 10px;border-radius:6px;margin-bottom:14px}
.bfp .bf-card p{color:var(--bf-muted);margin-top:8px;font-size:15px}
.bfp .bf-q{font:900 54px/1 var(--bf-head);color:transparent;-webkit-text-stroke:1.5px var(--bf-gold);margin-top:18px;letter-spacing:.04em}
.bfp .bf-follow{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px;align-items:center}
.bfp .bf-follow span{color:var(--bf-muted);font-weight:600;margin-right:6px}

/* feature panels */
.bfp .bf-feature{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.bfp .bf-panel{border:1px solid var(--bf-gold);border-radius:18px;padding:32px;background:var(--bf-black)}
.bfp .bf-sec:not(.alt) .bf-panel{background:var(--bf-coal)}
.bfp .bf-big{font:900 92px/1 var(--bf-head);color:var(--bf-gold);margin-top:10px}
.bfp .bf-was{font-weight:600;color:var(--bf-muted);margin-top:8px}
.bfp .bf-panel p{color:#C9C9D1;margin-top:14px}
.bfp table{width:100%;border-collapse:collapse;margin-top:16px;font-size:15px}
.bfp th,.bfp td{text-align:left;padding:11px 0;border-bottom:1px solid var(--bf-line)}
.bfp th{color:var(--bf-muted);font-weight:600}
.bfp .r{text-align:right}
.bfp tr.t td{font:900 20px var(--bf-head);border-bottom:0;color:var(--bf-gold);padding-top:14px}
.bfp .bf-ticks{list-style:none;margin-top:20px;display:grid;gap:10px}

/* steps */
.bfp .bf-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:32px;counter-reset:s}
.bfp .bf-step{background:var(--bf-card);border:1px solid var(--bf-line);border-radius:16px;padding:24px}
.bfp .bf-step:before{counter-increment:s;content:"0" counter(s);display:block;font:900 34px var(--bf-head);color:var(--bf-gold);margin-bottom:10px}
.bfp .bf-step b{display:block;font-family:var(--bf-head);font-size:19px;color:#fff}
.bfp .bf-step span{color:var(--bf-muted);font-size:15px}
.bfp .bf-step a{color:var(--bf-gold)}

/* terms + closing */
.bfp .bf-terms h2{font-size:28px}
.bfp .bf-terms ol{margin:18px 0 0 20px;display:grid;gap:10px;color:var(--bf-muted);font-size:15px;max-width:860px}
.bfp .bf-terms li::marker{color:var(--bf-gold)}
.bfp .bf-closing{text-align:center;background:radial-gradient(700px 300px at 50% 120%,rgba(229,178,73,.2),transparent 70%),var(--bf-black)}
.bfp .bf-closing .bf-btns{justify-content:center}
.bfp .bf-closing p{color:#C9C9D1;margin-top:12px}

/* homepage section */
.hrbf{position:relative;overflow:hidden;background:radial-gradient(800px 360px at 90% -20%,rgba(229,178,73,.2),transparent 60%),repeating-linear-gradient(135deg,rgba(255,255,255,.025) 0 2px,transparent 2px 22px),var(--bf-black);color:var(--bf-text);padding:64px 0;font-family:var(--bf-body);line-height:1.55;border-top:3px solid var(--bf-gold)}
.hrbf .hrbf-wrap{max-width:1120px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:center}
.hrbf .hrbf-big{font-size:clamp(56px,10vw,120px)}
.hrbf .hrbf-line{font:900 clamp(24px,3.2vw,34px)/1.1 var(--bf-head);color:#fff;margin-top:24px}
.hrbf .hrbf-line em{font-style:normal;color:var(--bf-gold)}
.hrbf .hrbf-text{color:#C9C9D1;font-size:18px;max-width:560px;margin-top:12px}
.hrbf .hrbf-btn{margin-top:26px}
.hrbf .hrbf-side{background:var(--bf-coal);border:1px solid var(--bf-gold);border-radius:18px;padding:26px}
.hrbf .hrbf-count{display:grid;grid-template-columns:repeat(3,1fr)}
.hrbf .hrbf-count div{background:var(--bf-black);min-width:0;padding:12px 6px}
.hrbf .hrbf-list{list-style:none;margin-top:20px;display:grid;gap:10px;font-size:15px}
.hrbf[data-state="upcoming"] .hrbf-live,.hrbf[data-state="live"] .hrbf-soon,.hrbf[data-state="ended"]{display:none}

@media (max-width:820px){
  .bfp .bf-feature,.hrbf .hrbf-wrap{grid-template-columns:1fr}
  .bfp .bf-sec{padding:58px 0}
  .bfp .bf-hero{padding:52px 0 60px}
  .bfp .bf-word span,.hrbf .hrbf-big span{-webkit-text-stroke-width:1.5px}
  .hrbf{padding:52px 0}
}
@media (prefers-reduced-motion:reduce){.bfp .bf-run{animation:none}}
