/* Guia da Barbearia. Direção: balcão de barbeiro, azulejo e aço, com a régua como assinatura. */
:root{
  --canvas:#0A1418; --panel:#0F1D23; --panel2:#15272F; --line:#2A444E;
  --tx:#E9EFF0; --tx2:#A9BBC0;
  --teal:#0B7892; --teal-hover:#0E8FAE; --teal-bright:#46BBD6; --teal-mute:#1B5568;
  --paper:#EDF1F0; --paper2:#E1E9E8; --paper-line:#BCCBCB;
  --ink:#12232A; --ink2:#43565C; --link:#08647E;
  --hh:64px;
  --ease:cubic-bezier(.22,.7,.2,1); --ease2:cubic-bezier(.65,0,.35,1);
  --fd:'Barlow Condensed','Arial Narrow',sans-serif;
  --fb:'Source Serif 4',Georgia,serif;
  --fm:'IBM Plex Mono',ui-monospace,monospace;
  --tshadow:0 1px 2px rgba(5,10,14,.95),0 3px 12px rgba(5,10,14,.78),0 10px 44px rgba(5,10,14,.8);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;overflow-x:hidden;overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:hidden;overflow-x:clip;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.65 var(--fb);-webkit-font-smoothing:antialiased}
body.is-home{background:var(--canvas);color:var(--tx)}
img,video,svg{max-width:100%;display:block}
a{color:var(--link);text-underline-offset:.2em;text-decoration-thickness:1px}
a:hover{color:var(--teal)}
:focus-visible{outline:3px solid var(--teal-bright);outline-offset:3px;border-radius:2px}
main:focus{outline:none}
.skip{position:absolute;left:-999px;top:8px;background:var(--teal);color:#fff;padding:.6rem 1rem;z-index:200;font-family:var(--fd);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.skip:focus{left:8px}
.mono{font-family:var(--fm);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}
.wrap{width:min(1180px,100% - 40px);margin-inline:auto}

/* ambiente: camada fixa de luz lenta */
.ambient{position:fixed;inset:-20%;z-index:-1;pointer-events:none;opacity:.55;
  background:radial-gradient(40% 35% at 20% 25%,rgba(11,120,146,.16),transparent 70%),radial-gradient(35% 40% at 80% 70%,rgba(70,187,214,.10),transparent 70%);
  animation:drift 70s ease-in-out infinite alternate}
body.is-inner .ambient{opacity:.5;background:radial-gradient(40% 35% at 15% 20%,rgba(11,120,146,.10),transparent 70%),radial-gradient(35% 40% at 85% 75%,rgba(11,120,146,.07),transparent 70%)}
@keyframes drift{from{transform:translate3d(-3%,-2%,0)}to{transform:translate3d(3%,3%,0)}}
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}

/* cabeçalho */
.top{position:sticky;top:0;z-index:100;background:rgba(10,20,24,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.top-in{height:var(--hh);width:min(1280px,100% - 32px);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand img{height:36px;width:auto}
.nav>ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nv{position:relative}
.nv-top{display:block;padding:.7rem 1rem;color:var(--tx);text-decoration:none;font:700 1.02rem/1 var(--fd);letter-spacing:.08em;text-transform:uppercase;position:relative}
.nv-top::after{content:"";position:absolute;left:1rem;right:1rem;bottom:.35rem;height:2px;background:var(--teal-bright);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nv:hover .nv-top::after,.nv:focus-within .nv-top::after{transform:scaleX(1)}
.nv-top:hover{color:#fff}
.dd{position:absolute;left:0;top:100%;min-width:290px;list-style:none;margin:0;padding:.5rem;background:var(--panel);border:1px solid var(--line);border-radius:4px;box-shadow:0 18px 40px rgba(0,0,0,.45);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s}
.nv:hover .dd,.nv:focus-within .dd{opacity:1;visibility:visible;transform:none}
.dd a{display:block;padding:.55rem .8rem;color:var(--tx2);text-decoration:none;font:400 .95rem/1.3 var(--fb);border-radius:3px}
.dd a:hover{background:var(--panel2);color:#fff}
.burger{display:none;width:44px;height:44px;border:1px solid var(--line);background:transparent;border-radius:4px;cursor:pointer;padding:0;position:relative}
.burger span{position:absolute;left:11px;right:11px;height:2px;background:var(--tx);transition:transform .3s var(--ease),opacity .2s}
.burger span:nth-child(1){top:15px}.burger span:nth-child(2){top:21px}.burger span:nth-child(3){top:27px}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mnav{max-height:calc(100svh - var(--hh));overflow:auto;padding:8px 16px 24px;border-top:1px solid var(--line)}
.mnav[hidden]{display:none}
.mnav summary{list-style:none;cursor:pointer;padding:1rem .2rem;color:var(--tx);font:700 1.2rem/1 var(--fd);letter-spacing:.08em;text-transform:uppercase;border-bottom:1px solid var(--line);display:flex;justify-content:space-between}
.mnav summary::-webkit-details-marker{display:none}
.mnav summary::after{content:"+";color:var(--teal-bright)}
.mnav details[open] summary::after{content:"−"}
.msub{display:flex;flex-direction:column;padding:.4rem 0 .8rem}
.msub a,.minst a{padding:.55rem .6rem;color:var(--tx2);text-decoration:none;font-size:1rem}
.minst{display:flex;flex-direction:column;margin-top:1rem;font-family:var(--fm)}
.minst a{font-size:.85rem}
@media (max-width:980px){.nav{display:none}.burger{display:block}}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.9rem 1.6rem;background:var(--teal);color:#fff;border:2px solid var(--teal);border-radius:3px;font:700 1.05rem/1 var(--fd);letter-spacing:.09em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .3s var(--ease),transform .3s var(--ease),border-color .3s}
.btn:hover{background:var(--teal-hover);border-color:var(--teal-hover);color:#fff;transform:translateY(-2px)}
.btn-ghost{background:transparent;border-color:rgba(233,239,240,.55);color:var(--tx)}
.btn-ghost:hover{background:rgba(233,239,240,.1);border-color:var(--tx);color:#fff}
.btn-text{background:transparent;border-color:transparent;color:var(--tx2);text-decoration:underline;text-underline-offset:.25em}
.btn-text:hover{background:transparent;border-color:transparent;color:#fff;transform:none}
@media (pointer:coarse){.btn,.burger,.linklike,.nv-top,.msub a,.minst a{min-height:44px}.btn{display:inline-flex}}
.linklike{background:none;border:0;padding:0;color:inherit;font:inherit;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}
.more-link{font:700 1.05rem/1 var(--fd);letter-spacing:.08em;text-transform:uppercase;text-decoration:none;color:var(--link);display:inline-block;border-bottom:2px solid var(--teal);padding-bottom:.25rem}
.more-link:hover{color:var(--teal)}
body.is-home .more-link{color:var(--teal-bright);border-color:var(--teal-bright)}

/* régua: elemento assinatura */
.ruler-h{height:20px;margin-top:2rem;background:
  repeating-linear-gradient(90deg,var(--ink) 0 1.5px,transparent 1.5px 10px) bottom/100% 8px no-repeat,
  repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 50px) bottom/100% 18px no-repeat;
  opacity:.5;transform:scaleX(0);transform-origin:left;animation:trace 1.4s var(--ease) .2s forwards}
body.is-home .ruler-h{background:
  repeating-linear-gradient(90deg,var(--tx2) 0 1.5px,transparent 1.5px 10px) bottom/100% 8px no-repeat,
  repeating-linear-gradient(90deg,var(--teal-bright) 0 2px,transparent 2px 50px) bottom/100% 18px no-repeat}
@keyframes trace{to{transform:scaleX(1)}}
.rv.in .ruler-h,.ruler-h{will-change:transform}
.kicker{font:500 .78rem/1 var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin:0 0 1rem;display:flex;gap:.7rem;align-items:center}
.kicker .num{background:var(--teal);color:#fff;padding:.35rem .5rem;border-radius:2px}
body.is-home .kicker{color:var(--tx2)}
.sec-h{font:700 clamp(1.8rem,3.4vw,2.6rem)/1 var(--fd);letter-spacing:.04em;text-transform:uppercase;margin:0 0 2rem}

/* ---- HERO (home) ---- */
.hero{position:relative;height:1000vh}
.stage{position:sticky;top:var(--hh);height:calc(100vh - var(--hh));height:calc(100svh - var(--hh));overflow:hidden;background:var(--canvas);color:#fff}
.poster{position:absolute;inset:0;background:url(hero-ending.jpg) center/cover no-repeat}
.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s var(--ease);will-change:transform}
.stage.video-ready video{opacity:1}
.scrim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(10,20,24,0) 35%,rgba(10,20,24,.62) 100%)}
.ring{position:absolute;right:28px;top:22px;width:40px;height:40px;color:var(--teal-bright);transform:rotate(-90deg);transition:opacity .6s}
.stage.video-ready .ring,.stage.video-failed .ring{opacity:0}
.ruler-v{position:absolute;right:20px;top:12vh;bottom:12vh;width:34px;background:
  repeating-linear-gradient(0deg,rgba(233,239,240,.55) 0 1.5px,transparent 1.5px 10px) right/12px 100% no-repeat,
  repeating-linear-gradient(0deg,var(--teal-bright) 0 2px,transparent 2px 50px) right/24px 100% no-repeat;opacity:.9}
.ruler-v i{position:absolute;right:0;top:0;width:34px;height:3px;background:#fff;box-shadow:0 0 12px rgba(70,187,214,.9);transform:translateY(0)}
.band{position:absolute;left:clamp(20px,6vw,90px);bottom:clamp(40px,12vh,120px);max-width:min(780px,86vw);opacity:0;pointer-events:none;text-shadow:var(--tshadow);will-change:opacity}
.band::before{content:"";position:absolute;inset:-26% -14%;z-index:-1;pointer-events:none;opacity:calc(.25 + .75*var(--k,1));background:radial-gradient(ellipse 74% 62% at 50% 50%,rgba(5,10,14,.7) 0%,rgba(5,10,14,.46) 46%,rgba(5,10,14,0) 76%)}
.band .btn{text-shadow:none}
.band .lab{display:block;color:var(--teal-bright);margin-bottom:1rem}
.big{font:700 clamp(2.6rem,6.4vw,5.6rem)/.92 var(--fd);letter-spacing:.015em;text-transform:uppercase;margin:0}
.final .big{font-size:clamp(3rem,8vw,7.2rem)}
.final .sub{max-width:34em;font:400 clamp(1.05rem,1.5vw,1.3rem)/1.5 var(--fb);margin:1.4rem 0 0;color:var(--tx);opacity:var(--ks,0);transform:translateY(calc((1 - var(--ks,0))*14px))}
.final .cta{display:flex;flex-wrap:wrap;gap:.8rem;margin:1.8rem 0 0;opacity:var(--kb,0);transform:translateY(calc((1 - var(--kb,0))*14px))}
.final{pointer-events:auto}
.cue{position:absolute;left:50%;bottom:16px;margin-left:-22px;width:44px;height:44px;display:grid;place-items:center;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:50%;background:rgba(10,20,24,.45);animation:bob 2.6s ease-in-out infinite;transition:opacity .4s}
@keyframes bob{50%{transform:translateY(5px)}}
.w{display:inline-block;white-space:pre}
.c{display:inline-block}
/* entradas */
.fx-scatter .c{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);transform:translate(calc((1 - var(--kc))*var(--jx,0px)),calc((1 - var(--kc))*var(--jy,0px))) rotate(calc((1 - var(--kc))*var(--jr,0deg)))}
.fx-drift .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*-26px))}
.fx-punch .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);--ks2:clamp(0,(var(--k,0) - var(--th,0) - .1)*3.2,1);opacity:var(--kc);transform:scale(calc(.6 + .52*var(--kc) - .12*var(--ks2)))}
.fx-rise .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*30px))}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* estado estático do hero: portões idênticos ao JS */
@media (max-width:720px),(orientation:portrait) and (max-width:1024px),(orientation:portrait) and (pointer:coarse),(orientation:landscape) and (pointer:coarse) and (max-height:560px),(prefers-reduced-motion:reduce){
  .hero{height:auto}
  .stage{position:relative;top:auto;height:auto;min-height:calc(100svh - var(--hh));display:flex;align-items:flex-end}
  .stage video,.ring,.ruler-v,.cue,.band:not(.final){display:none!important}
  .stage .scrim{background:linear-gradient(180deg,rgba(10,20,24,.35) 0%,rgba(10,20,24,.88) 100%)}
  .band.final{position:relative;left:auto;bottom:auto;opacity:1!important;padding:96px 20px 48px;max-width:640px;--k:1;--ks:1;--kb:1}
  .band.final::before{display:none}
  .band.final .w,.band.final .c{opacity:1!important;transform:none!important}
  .final .sub,.final .cta{opacity:1!important;transform:none!important}
  .final .big{font-size:clamp(3.2rem,15vw,5rem)}
}
@media (max-height:560px){.cue,.ruler-v{display:none}}

/* ---- Home: abaixo da dobra ---- */
.intro{padding:clamp(70px,11vw,140px) 0 clamp(50px,7vw,90px);background:linear-gradient(180deg,var(--canvas),#0C181D)}
.statement{font:400 clamp(1.5rem,3.1vw,2.5rem)/1.3 var(--fb);max-width:30em;margin:0;color:var(--tx)}
.statement em{font-style:italic;color:var(--teal-bright)}
.intro-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);margin-top:2.4rem;color:var(--tx2)}
.intro-cols p{margin:0;max-width:34em}
@media (max-width:760px){.intro-cols{grid-template-columns:1fr}}

.cats{background:var(--paper);color:var(--ink);padding:clamp(60px,8vw,110px) 0}
.cats .sec-h{color:var(--ink)}
.cat-row{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,5vw,72px);align-items:center;padding:clamp(24px,4vw,48px) 0;border-top:1px solid var(--paper-line)}
.cat-row.flip{grid-template-columns:1fr 1.1fr}
.cat-row.flip .cat-img{order:2}
.cat-img{display:block;overflow:hidden;position:relative;clip-path:polygon(0 0,calc(100% - 48px) 0,100% 48px,100% 100%,0 100%)}
.cat-img img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform 1.2s var(--ease)}
.cat-img:hover img{transform:scale(1.04)}
.cat-txt{position:relative}
.cat-n{position:absolute;right:0;top:-.4em;font:700 clamp(5rem,10vw,9rem)/1 var(--fd);color:transparent;-webkit-text-stroke:1.5px var(--paper-line);z-index:0;pointer-events:none}
.cat-txt>*:not(.cat-n){position:relative;z-index:1}
.cat-txt h3{font:700 clamp(2rem,3.6vw,3rem)/1 var(--fd);text-transform:uppercase;letter-spacing:.03em;margin:0 0 .8rem}
.cat-txt h3 a{color:var(--ink);text-decoration:none}
.cat-txt p{margin:0 0 1rem;color:var(--ink2);max-width:32em}
.cat-list{list-style:none;margin:0 0 1.4rem;padding:0;border-top:1px solid var(--paper-line)}
.cat-list li{border-bottom:1px solid var(--paper-line)}
.cat-list a{display:block;padding:.6rem 0;text-decoration:none;color:var(--ink);font-size:1rem;transition:padding .3s var(--ease),color .3s}
.cat-list a:hover{padding-left:.7rem;color:var(--link)}
@media (max-width:860px){.cat-row,.cat-row.flip{grid-template-columns:1fr}.cat-row.flip .cat-img{order:0}.cat-n{top:-.9em}}

.tool{background:var(--panel);color:var(--tx);padding:clamp(60px,8vw,110px) 0;border-block:1px solid var(--line)}
.tool-in{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(30px,6vw,90px);align-items:center}
.tool h2{font:700 clamp(2.2rem,4.4vw,3.6rem)/1 var(--fd);text-transform:uppercase;margin:0 0 1rem}
.tool p{color:var(--tx2);margin:0}
.tool-form{background:var(--canvas);border:1px solid var(--line);padding:clamp(20px,3vw,34px);border-radius:4px}
.tool-form label{display:block;font:500 .78rem/1 var(--fm);letter-spacing:.1em;text-transform:uppercase;color:var(--tx2);margin:0 0 .5rem}
select,input,textarea{width:100%;font:400 1rem/1.4 var(--fb);color:var(--tx);background:var(--panel2);border:1px solid #4A6671;border-radius:3px;padding:.8rem .9rem;margin:0 0 1.2rem}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--tx2) 50%),linear-gradient(135deg,var(--tx2) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat;padding-right:2.4rem}
.tool-out{border-top:1px solid var(--line);padding-top:1.3rem}
.tool-ruler{height:28px;position:relative;background:repeating-linear-gradient(90deg,var(--tx2) 0 1.5px,transparent 1.5px 12px) bottom/100% 10px no-repeat,repeating-linear-gradient(90deg,var(--teal-bright) 0 2px,transparent 2px 60px) bottom/100% 20px no-repeat}
.tool-ruler i{position:absolute;bottom:0;height:100%;background:rgba(11,120,146,.38);border-left:2px solid var(--teal-bright);border-right:2px solid var(--teal-bright);left:30%;width:25%;transition:left .6s var(--ease),width .6s var(--ease)}
.tool-res{font:700 clamp(1.5rem,2.6vw,2rem)/1.1 var(--fd);text-transform:uppercase;letter-spacing:.03em;color:var(--tx)!important;margin:1rem 0 .4rem!important}
.tool-sub{color:var(--tx2)!important;font-size:.74rem}
@media (max-width:860px){.tool-in{grid-template-columns:1fr}}

.late{background:var(--paper);color:var(--ink);padding:clamp(60px,8vw,110px) 0}
.late .sec-h{color:var(--ink)}
.late-list{border-top:2px solid var(--ink)}
.late-row{display:grid;grid-template-columns:70px 1fr 40px;gap:16px;align-items:baseline;padding:1.3rem 0;border-bottom:1px solid var(--paper-line);text-decoration:none;color:var(--ink);transition:background .3s,padding .3s var(--ease)}
.late-row:hover{background:var(--paper2);padding-inline:14px;color:var(--ink)}
.late-n{color:var(--link)}
.late-t{display:flex;flex-direction:column;gap:.35rem}
.late-t .mono{color:var(--ink2)}
.late-t strong{font:600 clamp(1.15rem,2.2vw,1.55rem)/1.25 var(--fb)}
.late-go{font:700 1.6rem/1 var(--fd);color:var(--teal);text-align:right}

.how{background:var(--paper2);color:var(--ink);padding:clamp(50px,7vw,90px) 0;border-top:1px solid var(--paper-line)}
.how .sec-h{color:var(--ink)}
.how-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,4vw,56px)}
.how-cols .mono{color:var(--link);display:block;border-top:3px solid var(--teal);padding-top:.8rem}
.how-cols p{margin:.6rem 0 0;color:var(--ink2)}
.how-link{margin:2.2rem 0 0}
.how .more-link{color:var(--link)}
@media (max-width:760px){.how-cols{grid-template-columns:1fr}}

.close{background:var(--canvas);color:var(--tx);padding:clamp(60px,9vw,120px) 0;text-align:left}
.close h2{font:700 clamp(2.4rem,5.4vw,4.6rem)/.95 var(--fd);text-transform:uppercase;margin:0 0 1rem;max-width:12em}
.close p{color:var(--tx2);margin:0 0 1.6rem;max-width:32em}

/* ---- Páginas internas ---- */
.crumbs{display:flex;flex-wrap:wrap;gap:.5rem;font:400 .78rem/1.2 var(--fm);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2);margin-bottom:1.6rem}
.crumbs a{color:var(--ink2);text-decoration:none}.crumbs a:hover{color:var(--link);text-decoration:underline}
.art,.hub-head{width:min(1180px,100% - 40px);margin-inline:auto}
.art-head,.hub-head{padding-top:clamp(36px,5vw,64px)}
.art h1,.hub-head h1{font:700 clamp(2.2rem,5.2vw,4.3rem)/.98 var(--fd);letter-spacing:.02em;text-transform:uppercase;margin:0 0 1.2rem;max-width:18em;color:var(--ink)}
.lead{font:400 clamp(1.15rem,1.8vw,1.4rem)/1.5 var(--fb);color:var(--ink2);max-width:38em;margin:0}
.byline{font:400 .8rem/1.6 var(--fm);color:var(--ink2);margin:1.4rem 0 0}
.art-fig{margin:2rem 0 0;position:relative;overflow:hidden;clip-path:polygon(0 0,calc(100% - 64px) 0,100% 64px,100% 100%,0 100%);background:var(--canvas)}
.art-fig img{width:100%;aspect-ratio:16/7;object-fit:cover}
.art-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:clamp(24px,5vw,72px);padding:clamp(32px,4vw,56px) 0 clamp(40px,6vw,80px)}
.toc{position:sticky;top:calc(var(--hh) + 24px);align-self:start;font-size:.95rem;border-left:2px solid var(--paper-line);padding-left:1rem}
.mono-h{font:500 .76rem/1 var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--ink2);margin:0 0 .8rem}
.toc ol{margin:0;padding:0;list-style:none;counter-reset:t}
.toc li{counter-increment:t;margin:0 0 .5rem}
.toc li::before{content:counter(t,decimal-leading-zero) " ";font:400 .75rem var(--fm);color:var(--link)}
.toc a{color:var(--ink);text-decoration:none;line-height:1.35}.toc a:hover{color:var(--link);text-decoration:underline}
.prose{max-width:46rem;min-width:0}
.art-grid:not(:has(.toc)){grid-template-columns:minmax(0,1fr)}
.prose h2{font:700 clamp(1.6rem,2.6vw,2.1rem)/1.05 var(--fd);letter-spacing:.03em;text-transform:uppercase;margin:2.6rem 0 .9rem;color:var(--ink);scroll-margin-top:calc(var(--hh) + 20px);padding-top:.2em}
.prose h2::before{content:"";display:block;width:44px;height:4px;background:var(--teal);margin-bottom:.9rem}
.prose p,.prose ul,.prose ol{margin:0 0 1.15rem}
.prose li{margin:.3rem 0}
.prose li::marker{color:var(--teal);font-weight:600}
.prose strong{font-weight:600}
.tw{overflow-x:auto;margin:1.4rem 0;border:1px solid var(--paper-line);border-radius:3px;background:#F6F9F8}
.prose table{border-collapse:collapse;width:100%;font-size:.97rem;min-width:420px}
.prose th{font:500 .74rem var(--fm);letter-spacing:.09em;text-transform:uppercase;text-align:left;background:var(--ink);color:#fff;padding:.7rem .9rem}
.prose td{padding:.65rem .9rem;border-top:1px solid var(--paper-line);vertical-align:top}
.note{margin:2rem 0 0;padding:1rem 1.2rem;border-left:4px solid var(--teal);background:var(--paper2);font-size:.98rem;border-radius:0 3px 3px 0}
.more{width:min(1180px,100% - 40px);margin:0 auto;padding:0 0 clamp(50px,7vw,100px)}
.rel{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.5vw,32px)}
.rel-card{display:flex;flex-direction:column;gap:.5rem;text-decoration:none;color:var(--ink)}
.rel-card img{width:100%;aspect-ratio:16/9;object-fit:cover;margin-bottom:.4rem;transition:transform .8s var(--ease),filter .4s}
.rel-card:hover img{filter:brightness(1.08)}
.rel-card .mono{color:var(--link)}
.rel-card strong{font:700 1.45rem/1.05 var(--fd);text-transform:uppercase;letter-spacing:.03em}
.rel-t{color:var(--ink2);font-size:.95rem;line-height:1.4}
@media (max-width:900px){.art-grid{grid-template-columns:1fr}.toc{position:static;border:1px solid var(--paper-line);padding:1rem;border-radius:3px;background:var(--paper2)}.rel{grid-template-columns:1fr}}

.hub-list{width:min(1180px,100% - 40px);margin:0 auto;padding:clamp(24px,4vw,48px) 0 clamp(60px,8vw,110px)}
.hub-row{display:grid;grid-template-columns:70px 1fr 300px;gap:clamp(14px,3vw,36px);align-items:center;padding:1.5rem 0;border-top:1px solid var(--paper-line);text-decoration:none;color:var(--ink);transition:background .3s,padding .3s var(--ease)}
.hub-row:last-child{border-bottom:1px solid var(--paper-line)}
.hub-row:hover{background:var(--paper2);padding-inline:14px;color:var(--ink)}
.hub-n{color:var(--link)}
.hub-txt{display:flex;flex-direction:column;gap:.45rem}
.hub-txt strong{font:700 clamp(1.6rem,3vw,2.3rem)/1 var(--fd);text-transform:uppercase;letter-spacing:.03em}
.hub-txt span{color:var(--ink2);font-size:1rem;line-height:1.5}
.hub-txt em{font-style:normal;color:var(--ink2)}
.hub-row img{width:100%;aspect-ratio:16/10;object-fit:cover;clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%)}
@media (max-width:820px){.hub-row{grid-template-columns:1fr}.hub-row img{order:-1;max-height:220px}}

.inst-head h1{max-width:none}
.inst{width:min(1180px,100% - 40px);margin:0 auto;padding:clamp(24px,4vw,48px) 0 clamp(60px,8vw,110px)}
.inst .prose h2:first-child{margin-top:0}
.cform{max-width:36rem;margin-top:1.2rem}
.cform label{display:block;font:500 .78rem/1 var(--fm);letter-spacing:.1em;text-transform:uppercase;margin:0 0 .5rem;color:var(--ink2)}
.cform input,.cform select,.cform textarea{background:#F8FAFA;color:var(--ink);border-color:#7F9298}
.cform select{background-image:linear-gradient(45deg,transparent 50%,var(--ink2) 50%),linear-gradient(135deg,var(--ink2) 50%,transparent 50%)}
.fine{font-size:.9rem;color:var(--ink2);margin:1rem 0 0}

/* rodapé */
.foot{background:var(--canvas);color:var(--tx2);border-top:1px solid var(--line)}
.foot-in{width:min(1180px,100% - 40px);margin:0 auto;padding:clamp(40px,6vw,72px) 0;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:40px}
.foot-brand p{max-width:28em;margin:1rem 0 0;font-size:.98rem}
.foot-h{font:500 .76rem/1 var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--tx);margin:0 0 1rem}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{margin:.2rem 0}
.foot a{color:var(--tx2);text-decoration:none;display:inline-block;padding:.25rem 0}
.foot a:hover{color:#fff;text-decoration:underline}
.foot-bot{width:min(1180px,100% - 40px);margin:0 auto;border-top:1px solid var(--line);padding:1.2rem 0 2rem;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;font:400 .76rem/1.5 var(--fm);color:var(--tx2)}
.foot-bot .linklike{color:var(--tx)}
@media (max-width:760px){.foot-in{grid-template-columns:1fr}}

/* cookies */
.cookie{position:fixed;z-index:150;left:16px;right:16px;bottom:16px;max-width:560px;background:var(--panel);color:var(--tx);border:1px solid var(--line);border-top:3px solid var(--teal);border-radius:4px;padding:20px 22px;box-shadow:0 20px 50px rgba(0,0,0,.5);transform:translateY(24px);opacity:0;transition:transform .5s var(--ease),opacity .5s var(--ease)}
.cookie.show{transform:none;opacity:1}
.cookie[hidden]{display:none}
.cookie h2{font:700 1.3rem/1 var(--fd);letter-spacing:.06em;text-transform:uppercase;margin:0 0 .6rem}
.cookie p{margin:0 0 1rem;font-size:.95rem;line-height:1.5;color:var(--tx2)}
.cookie a{color:var(--teal-bright)}
.ck-opts{display:grid;gap:.4rem;margin:0 0 1rem}
.ck-opts label{display:flex;gap:.6rem;align-items:center;font:400 .9rem var(--fb)}
.ck-opts input{width:auto;margin:0;accent-color:var(--teal)}
.ck-btns{display:flex;flex-wrap:wrap;gap:.6rem}
.ck-btns .btn{padding:.7rem 1.1rem;font-size:.95rem}

/* entradas ao rolar */
.rv{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.js-off .rv{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
  .ruler-h{transform:none}
  .ambient{animation:none}
}