/* ============ tokens ============ */
:root{
  --bg:#0B0B0D; --bg2:#101013; --ink:#EDEAE3; --mut:#8B877E; --mut2:#5C594F;
  --red:#2276FF; --red2:#6FA8FF; --line:rgba(237,234,227,.14); --line2:rgba(237,234,227,.07);
  --fd:'Anton',Impact,'Arial Narrow',sans-serif;
  --fb:'Archivo','Helvetica Neue',Arial,sans-serif;
  --fm:'Space Mono','Courier New',monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--fb);line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--red);color:#fff}
a{color:inherit}
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,44px)}

/* grain */
body::after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:80;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)'/%3E%3C/svg%3E")}

/* scroll progress (decorativo, progressive enhancement) */
@supports ((animation-timeline: scroll()) and (animation-range: 0% 100%)){
  @keyframes prog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
  .prog{position:fixed;top:0;left:0;right:0;height:3px;background:var(--red);transform-origin:0 50%;
    z-index:90;animation:prog auto linear;animation-timeline:scroll(root)}
}

/* reveal on scroll */
.rv{opacity:0;translate:0 30px;transition:opacity .8s cubic-bezier(.2,.7,.2,1),translate .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.rv.in{opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){
  .rv{opacity:1!important;translate:none!important;transition:none!important}
  *{animation:none!important}
  html{scroll-behavior:auto}
}

/* type helpers */
.kick{font-family:var(--fm);font-size:11px;letter-spacing:.28em;text-transform:uppercase;color:var(--red);font-weight:700}
.kick.gh{color:var(--mut)}
h1,h2,h3{font-family:var(--fd);font-weight:400;text-transform:uppercase;line-height:.94;margin:0;letter-spacing:.005em}

/* ============ hero ============ */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;position:relative;border-bottom:1px solid var(--line)}
.hero .top{display:flex;justify-content:space-between;gap:16px;padding:26px 0;font-family:var(--fm);
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);flex-wrap:wrap}
.hero .top b{color:var(--ink);font-weight:700}
.hero .top i{color:var(--red);font-style:normal}
.hero .mid{padding:4vh 0 6vh}
.hero h1{font-size:clamp(40px,11.5vw,178px)}
.hero h1 .l1{display:block}
.hero h1 .l2{display:block;color:transparent;-webkit-text-stroke:1.5px var(--ink);text-stroke:1.5px var(--ink)}
.hero h1 .l3{display:block;color:var(--red)}
.hero .sub{margin-top:34px;display:flex;gap:34px;align-items:flex-end;flex-wrap:wrap;justify-content:space-between}
.hero .sub p{margin:0;max-width:52ch;font-size:clamp(15px,1.6vw,19px);color:var(--mut);line-height:1.6}
.hero .sub p b{color:var(--ink);font-weight:600}
.ticket{border:1px solid var(--line);padding:13px 16px;font-family:var(--fm);font-size:10.5px;line-height:1.9;
  letter-spacing:.06em;color:var(--mut);text-transform:uppercase;position:relative;background:var(--bg2)}
.ticket::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:4px;background:var(--red)}
.ticket b{color:var(--ink)}
.cue{position:absolute;right:clamp(20px,4vw,44px);bottom:110px;font-family:var(--fm);font-size:10px;
  letter-spacing:.24em;text-transform:uppercase;color:var(--mut2);writing-mode:vertical-rl}
.cue::after{content:"";display:block;width:1px;height:56px;background:var(--red);margin:14px auto 0;animation:drip 2.2s ease-in-out infinite}
@keyframes drip{0%,100%{transform:scaleY(.35);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}

/* marquee */
.marq{border-top:1px solid var(--line);overflow:hidden;white-space:nowrap;padding:16px 0;position:relative}
.marq .in{display:inline-block;animation:mq 36s linear infinite;font-family:var(--fd);font-size:clamp(20px,2.6vw,30px);letter-spacing:.04em;text-transform:uppercase}
.marq .in i{font-style:normal;color:var(--red);padding:0 .55em;font-family:var(--fm);font-size:.6em;vertical-align:.18em}
.marq .in em{font-style:normal;color:var(--mut2)}
.marq .in em.on{color:var(--ink)}
@keyframes mq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.marq .in{animation:none}}

/* ============ manifesto ============ */
.manif{padding:clamp(72px,11vh,130px) 0;border-bottom:1px solid var(--line)}
.manif .grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(28px,5vw,72px);align-items:start}
.manif h2{font-size:clamp(34px,4.6vw,62px);max-width:18ch}
.manif h2 em{font-style:normal;color:var(--red)}
.manif p{margin:22px 0 0;font-size:16.5px;color:var(--mut);max-width:58ch}
.manif p b{color:var(--ink);font-weight:600}
.bigstats{display:flex;flex-direction:column;gap:0;border:1px solid var(--line)}
.bs{padding:20px 22px;border-top:1px solid var(--line)}
.bs:first-child{border-top:0}
.bs b{display:block;font-family:var(--fd);font-size:clamp(38px,4.4vw,58px);line-height:1;color:var(--ink)}
.bs b.r{color:var(--red)}
.bs span{display:block;margin-top:8px;font-family:var(--fm);font-size:9.5px;letter-spacing:.16em;color:var(--mut);text-transform:uppercase;line-height:1.8}

/* ============ o dia dele ============ */
.dia{position:relative;border-bottom:1px solid var(--line)}
.dia .head{padding:clamp(64px,9vh,110px) 0 30px}
.dia .head h2{font-size:clamp(40px,6.4vw,92px)}
.dia .head h2 em{font-style:normal;color:transparent;-webkit-text-stroke:1.2px var(--red)}
.dia .head p{margin:20px 0 0;color:var(--mut);max-width:64ch;font-size:16px}
.dia .head p b{color:var(--ink);font-weight:600}

.mom{position:relative;padding:clamp(44px,7vh,84px) 0;border-top:1px solid var(--line2)}
.mom .g{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4.5vw,64px);align-items:center}
.mom.flip .g{direction:rtl}
.mom.flip .g>*{direction:ltr}
.hour{font-family:var(--fd);font-size:clamp(72px,12vw,168px);line-height:.86;color:transparent;
  -webkit-text-stroke:1.4px rgba(237,234,227,.4);user-select:none;letter-spacing:-.01em}
.hour i{font-style:normal;display:block;color:var(--red);-webkit-text-stroke:0;font-size:.34em;letter-spacing:.02em;margin-top:10px}
.mom .tx .kick{display:block;margin-bottom:14px}
.mom .tx h3{font-size:clamp(26px,3.2vw,42px);max-width:22ch}
.mom .tx p{margin:16px 0 0;color:var(--mut);font-size:15.5px;max-width:56ch}
.mom .tx p b{color:var(--ink);font-weight:600}
.stamps{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.st{border:1px dashed rgba(237,234,227,.3);padding:10px 14px 11px;font-family:var(--fm);position:relative;background:rgba(237,234,227,.02)}
.st .n{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut);padding-right:42px}
.st .v{font-size:20px;font-weight:700;color:var(--ink);line-height:1.25}
.st .v small{font-size:10.5px;font-weight:400;color:var(--mut2)}
.st .x{position:absolute;top:6px;right:8px;font-size:9px;color:var(--mut2)}
.st.hot{border-color:rgba(34,118,255,.65);background:rgba(34,118,255,.07)}
.st.hot .v{color:var(--red2)}
.st.hot .n{color:rgba(255,75,87,.8)}

/* ============ muro tipográfico ============ */
.muro{padding:clamp(72px,11vh,130px) 0;border-bottom:1px solid var(--line);background:var(--bg2)}
.muro h2{font-size:clamp(38px,5.6vw,80px);max-width:16ch}
.muro h2 em{font-style:normal;color:var(--red)}
.muro .exp{margin:20px 0 0;color:var(--mut);max-width:66ch;font-size:16px}
.muro .exp b{color:var(--ink);font-weight:600}
.wall{margin-top:clamp(36px,6vh,64px);display:flex;flex-wrap:wrap;align-items:baseline;gap:.35em .55em}
.w{font-family:var(--fd);text-transform:uppercase;line-height:.95;letter-spacing:.01em;white-space:nowrap;
  font-size:calc(15px + var(--p)*1.35px);cursor:default;transition:.18s;position:relative}
.w sup{font-family:var(--fm);font-size:clamp(9px,.6em,13px);font-weight:700;color:var(--mut);margin-left:.18em;letter-spacing:0}
.w.c1{color:var(--red)}
.w.c2{color:var(--red2)}
.w.c3{color:var(--ink)}
.w.c4{color:rgba(237,234,227,.32)}
.w:hover{color:#fff;text-shadow:0 0 26px rgba(34,118,255,.65)}
.w .afi.{font-family:var(--fm);font-size:10px;font-weight:700;letter-spacing:.05em;background:var(--red);color:#fff;
  padding:2px 6px;vertical-align:super;margin-left:.3em}
@media(max-width:700px){.w{font-size:calc(10px + var(--p)*.52px)}}
.wleg{margin-top:34px;display:flex;gap:22px;flex-wrap:wrap;font-family:var(--fm);font-size:10px;letter-spacing:.1em;color:var(--mut);text-transform:uppercase}
.wleg i{display:inline-block;width:10px;height:10px;margin-right:7px;vertical-align:-1px}
.callouts{margin-top:44px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.co{border-left:3px solid var(--red);padding:4px 0 4px 18px;font-size:14.5px;color:var(--mut);line-height:1.6}
.co b{color:var(--ink);font-weight:600}
.co .fm{font-family:var(--fm);color:var(--red);font-weight:700}

/* ============ pull quote ============ */
.pull{padding:clamp(80px,13vh,150px) 0;text-align:center;border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.pull .bgnum{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--fd);font-size:clamp(200px,42vw,560px);color:transparent;-webkit-text-stroke:1px rgba(34,118,255,.14);
  pointer-events:none;user-select:none;line-height:1}
.pull h2{font-size:clamp(30px,4.6vw,60px);max-width:22ch;margin:0 auto;position:relative}
.pull h2 em{font-style:normal;color:var(--red)}
.pull p{position:relative;margin:22px auto 0;max-width:58ch;color:var(--mut);font-size:16px}
.pull p b{color:var(--ink);font-weight:600}

/* ============ dossiês ============ */
.doss{padding:clamp(72px,11vh,130px) 0;border-bottom:1px solid var(--line)}
.doss>.wrap>h2{font-size:clamp(40px,6.4vw,92px)}
.doss>.wrap>h2 em{font-style:normal;color:var(--red)}
.doss .exp{margin:20px 0 0;color:var(--mut);max-width:66ch;font-size:16px}
.doss .exp b{color:var(--ink);font-weight:600}
.cards{margin-top:clamp(36px,6vh,60px);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(430px,100%),1fr));gap:16px}
.card{border:1px solid var(--line);background:var(--bg2);padding:24px 24px 26px;position:relative;transition:.25s cubic-bezier(.2,.7,.2,1)}
.card:hover{translate:-3px -3px;box-shadow:6px 6px 0 rgba(34,118,255,.85);border-color:rgba(237,234,227,.3)}
.card .no{position:absolute;top:18px;right:20px;font-family:var(--fm);font-size:11px;color:var(--mut2);letter-spacing:.1em}
.card .city{font-family:var(--fd);font-size:clamp(24px,2.6vw,34px);text-transform:uppercase;line-height:1;padding-right:44px}
.card .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tag{font-family:var(--fm);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px;border:1px solid var(--line);color:var(--mut)}
.tag.r{border-color:rgba(34,118,255,.55);color:var(--red2);background:rgba(34,118,255,.08)}
.tag.w{background:var(--red);border-color:var(--red);color:#fff;font-weight:700}
.card .who{margin-top:18px;font-family:var(--fd);font-size:21px;text-transform:uppercase;color:var(--red);letter-spacing:.015em}
.card ul{list-style:none;margin:14px 0 0;padding:0}
.card li{padding:9px 0;border-top:1px solid var(--line2);font-size:14px;color:var(--mut);line-height:1.5}
.card li b{color:var(--ink);font-weight:600}
.card li .fm{font-family:var(--fm);font-size:12.5px;color:var(--red2);font-weight:700;white-space:nowrap}
.card .risk{margin-top:16px;padding-top:14px;border-top:1px dashed rgba(237,234,227,.25);font-size:13.5px;color:var(--mut2)}
.card .risk .lb{font-family:var(--fm);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--mut2);display:block;margin-bottom:5px}
.card .risk s{text-decoration-color:rgba(34,118,255,.75);text-decoration-thickness:2px;color:var(--mut)}

/* ============ prompt ============ */
.layer{padding:clamp(72px,11vh,130px) 0;border-bottom:1px solid var(--line);background:var(--bg2)}
.layer h2{font-size:clamp(36px,5vw,68px);max-width:18ch}
.layer h2 em{font-style:normal;color:var(--red)}
.layer .exp{margin:20px 0 0;color:var(--mut);max-width:64ch;font-size:16px}
.layer .exp b{color:var(--ink);font-weight:600}
.pbox{margin-top:38px;border:1px solid var(--line);background:var(--bg)}
.pbh{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:13px 18px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.pbh span{font-family:var(--fm);font-size:9.5px;letter-spacing:.2em;color:var(--red);text-transform:uppercase;font-weight:700}
.pbh button{border:1px solid var(--red);background:transparent;color:var(--ink);font-family:var(--fm);font-size:11px;
  letter-spacing:.1em;text-transform:uppercase;padding:9px 16px;cursor:pointer;transition:.15s;font-weight:700}
.pbh button:hover{background:var(--red);color:#fff}
.pbox pre{margin:0;padding:20px 22px;white-space:pre-wrap;font-family:var(--fm);font-size:11.5px;line-height:1.75;color:#B9B5AB;max-height:380px;overflow:auto}
.pbox pre::-webkit-scrollbar{width:8px}
.pbox pre::-webkit-scrollbar-thumb{background:rgba(34,118,255,.5)}
.pbox pre::-webkit-scrollbar-track{background:transparent}

/* ============ footer ============ */
footer{padding:56px 0 72px}
footer .fx{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px)}
footer h4{margin:0 0 12px;font-family:var(--fm);font-size:9.5px;letter-spacing:.2em;color:var(--red);text-transform:uppercase}
footer p{margin:0 0 10px;font-size:12.5px;color:var(--mut2);line-height:1.75;font-family:var(--fm)}
footer .sig{margin-top:44px;padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-family:var(--fm);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut2)}
footer .sig b{color:var(--ink)}


/* --- camada visual --- */
.headg{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,60px);align-items:center}
.clock{max-width:430px;margin-left:auto;width:100%}
.clock svg{width:100%;height:auto;display:block}
.cleg{display:flex;gap:18px;flex-wrap:wrap;justify-content:center;margin-top:14px;font-family:var(--fm);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut2)}
.cleg i{display:inline-block;width:16px;height:5px;margin-right:6px;vertical-align:1px}
.cleg i.r{background:var(--red)}
.cleg i.w{background:rgba(237,234,227,.75)}
.metanote{margin:18px 0 0;padding:11px 14px;border-left:2px solid rgba(34,118,255,.55);background:rgba(34,118,255,.05);font-family:var(--fm);font-size:10.5px;line-height:1.75;color:var(--mut);max-width:62ch}
.metanote b{color:var(--ink);font-weight:700}
.src,.pull p.src,.manif .grid p.src,.dia .head p.src,.muro p.src,.layer p.src{margin:14px auto 0;font-family:var(--fm);font-size:7.5px!important;line-height:1.8;color:rgba(92,89,79,.9);letter-spacing:.05em;text-transform:uppercase;max-width:100ch}
.src b{color:rgba(34,118,255,.9);font-weight:700;margin-right:6px}
.card .src{margin-top:14px;padding-top:10px;border-top:1px solid var(--line2)}
.dstrip{display:flex;gap:4px;margin-top:20px;max-width:300px}
.dstrip i{height:7px;flex:1;background:rgba(237,234,227,.1)}
.dstrip i.past{background:rgba(237,234,227,.28)}
.dstrip i.on{background:var(--red);box-shadow:0 0 14px rgba(34,118,255,.7)}
.dots{display:grid;grid-template-columns:repeat(10,7px);gap:5px;margin-bottom:16px}
.dots i{width:7px;height:7px;border-radius:50%;background:rgba(237,234,227,.13)}
.dots i.f{background:var(--ink)}
.dots i.fr{background:var(--red);box-shadow:0 0 8px rgba(34,118,255,.55)}
.fprint{margin-top:16px}
.fprint svg{width:100%;height:auto;display:block}
.blkh{display:flex;align-items:center;gap:10px;margin:18px 0 2px;font-family:var(--fm);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:700}
.blkh::after{content:"";flex:1;height:1px;background:var(--line2)}
.blkh.tgi{color:var(--mut2)}
.blkh.cid{color:var(--red)}
.card li i{font-style:normal;color:var(--mut2);font-size:12px}
.play{margin-top:16px;border:1px solid rgba(34,118,255,.42);background:rgba(34,118,255,.06);padding:13px 15px;font-size:13.5px;color:#D8D5CD;line-height:1.55}
.play .plb{display:block;font-family:var(--fm);font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--red);font-weight:700;margin-bottom:6px}
.play b{color:#fff}
@media(max-width:860px){
  .manif .grid{grid-template-columns:1fr}
  .headg{grid-template-columns:1fr}
  .clock{margin:26px auto 0}
  .mom .g{grid-template-columns:1fr;gap:20px}
  .mom.flip .g{direction:ltr}
  .hour{font-size:clamp(64px,17vw,120px)}
  .cue{display:none}
  footer .fx{grid-template-columns:1fr}
}
