/* =========================================================
   BELIEVON · Sistema visual "Rota"
   Carregado em todas as páginas, depois do CSS de cada uma.
   Fontes locais (Inter Tight), sem chamadas externas.
   ========================================================= */

@font-face{
  font-family:"Inter Tight";
  src:url("fonts/inter-tight-latin-wght-normal.woff2") format("woff2-variations"),
      url("fonts/inter-tight-latin-wght-normal.woff2") format("woff2");
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Inter Tight";
  src:url("fonts/inter-tight-latin-ext-wght-normal.woff2") format("woff2-variations"),
      url("fonts/inter-tight-latin-ext-wght-normal.woff2") format("woff2");
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

:root{
  --r-night:#060c16;
  --r-ink:#0b1f33;
  --r-ink-2:#13263b;
  --r-deep:#0d1520;
  --r-text:#0f1822;
  --r-muted:#5a6675;
  --r-sand:#ecebe6;
  --r-sand-2:#e3e1da;
  --r-mist:#cfd7de;
  --r-line:rgba(15,24,34,.12);
  --r-line-light:rgba(255,255,255,.14);
  --r-amber:#e2a13c;
  --r-amber-deep:#b8802a;
  --r-font:"Inter Tight",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --r-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --r-ease:cubic-bezier(.16,1,.3,1);
  --r-ease-io:cubic-bezier(.7,0,.2,1);
  --r-gut:clamp(16px,4vw,44px);

  /* reescreve os tokens antigos de cada página para o novo sistema */
  --serif:var(--r-font);
  --sans:var(--r-font);
  --paper:var(--r-sand);
  --sand:var(--r-sand-2);
  --white:#f6f5f1;
  --navy-900:var(--r-ink);
}

/* ---------- Base ---------- */
html{scroll-behavior:auto!important}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}

body{font-family:var(--r-font);background:var(--r-sand);color:var(--r-text);font-feature-settings:"ss01","cv11";letter-spacing:-.005em}
h1,h2,h3,h4{font-family:var(--r-font);font-weight:500;letter-spacing:-.035em}
h1 em,h2 em,h3 em{font-style:normal}
::selection{background:var(--r-amber);color:#1b1200}

/* transição suave entre páginas (Chrome, Edge, Safari 18+) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:r-out .45s var(--r-ease-io) both}
::view-transition-new(root){animation:r-in .7s var(--r-ease) both}
@keyframes r-out{to{opacity:0;filter:blur(8px);transform:scale(.985)}}
@keyframes r-in{from{opacity:0;filter:blur(10px);transform:scale(1.01)}}

/* esconde cabeçalhos antigos se algum sobrar */
.topbar,.site-header{display:none!important}

/* ---------- Cabeçalho ---------- */
.rh{
  position:fixed;inset:0 0 auto 0;z-index:80;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;
  padding:18px var(--r-gut);color:#fff;
  transition:color .5s var(--r-ease),transform .6s var(--r-ease);
}
.rh::before{
  content:"";position:absolute;inset:0 0 -30px 0;z-index:-1;pointer-events:none;opacity:0;
  background:linear-gradient(180deg,rgba(6,12,22,.85) 0%,rgba(6,12,22,.6) 55%,rgba(6,12,22,0) 100%);
  transition:opacity .5s var(--r-ease),background .5s var(--r-ease);
}
.rh.is-scrolled::before{opacity:1}
.rh.on-light{color:var(--r-text)}
.rh.on-light::before{background:linear-gradient(180deg,rgba(236,235,230,1) 0%,rgba(236,235,230,.92) 55%,rgba(236,235,230,0) 100%)}
.rh.is-hidden{transform:translateY(-110%)}

.rh-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:inherit;justify-self:start}
.rh-brand svg{width:30px;height:30px;flex:none}
.rh-brand b{font-weight:600;font-size:14px;letter-spacing:.2em}
.rh-brand small{display:block;font-family:var(--r-mono);font-size:9px;letter-spacing:.24em;opacity:.6;text-transform:uppercase;margin-top:2px}

.rh-pill{
  position:relative;display:flex;align-items:center;gap:2px;padding:5px;border-radius:999px;
  background:rgba(14,20,30,.5);border:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(16px) saturate(140%);backdrop-filter:blur(16px) saturate(140%);
  box-shadow:0 10px 30px rgba(0,0,0,.18);
}
.rh-pill a{
  position:relative;z-index:1;color:rgba(255,255,255,.78);text-decoration:none;
  font-size:13px;font-weight:500;padding:8px 15px;border-radius:999px;white-space:nowrap;
  transition:color .3s var(--r-ease);
}
.rh-pill a:hover,.rh-pill a[aria-current="page"]{color:#fff}
.rh-ind{
  position:absolute;z-index:0;top:5px;bottom:5px;left:0;width:0;border-radius:999px;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.1);
  transition:transform .55s var(--r-ease),width .55s var(--r-ease),opacity .3s;opacity:0;
}

.rh-menu{
  justify-self:end;display:inline-flex;align-items:center;gap:12px;
  background:none;border:0;color:inherit;font:500 13px/1 var(--r-font);cursor:pointer;padding:10px 4px;
}
.rh-burger{display:inline-flex;flex-direction:column;gap:5px;width:18px}
.rh-burger i{display:block;height:1.5px;background:currentColor;border-radius:2px;transition:transform .5s var(--r-ease),width .5s var(--r-ease)}
.rh-burger i:last-child{width:70%;margin-left:auto}
.rh-menu:hover .rh-burger i:last-child{width:100%}

@media (max-width:860px){
  .rh{grid-template-columns:1fr auto}
  .rh-pill{display:none}
}

/* ---------- Menu lateral ---------- */
.rd{position:fixed;inset:0;z-index:90;visibility:hidden;pointer-events:none}
.rd.is-open{visibility:visible;pointer-events:auto}
.rd-veil{
  position:absolute;inset:0;background:rgba(4,8,14,.45);opacity:0;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  transition:opacity .7s var(--r-ease);
}
.rd.is-open .rd-veil{opacity:1}
.rd-panel{
  position:absolute;top:0;right:0;bottom:0;width:min(440px,100%);
  background:var(--r-sand);color:var(--r-text);display:flex;flex-direction:column;
  padding:28px clamp(24px,4vw,40px) 32px;transform:translateX(100%);
  transition:transform .85s var(--r-ease-io);overflow-y:auto;
}
.rd.is-open .rd-panel{transform:none}
.rd-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--r-mono);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--r-muted)}
.rd-close{width:40px;height:40px;border-radius:50%;border:1px solid var(--r-line);background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--r-text);transition:transform .5s var(--r-ease),background .3s}
.rd-close:hover{transform:rotate(90deg);background:#fff}
.rd-list{list-style:none;margin:clamp(30px,7vh,64px) 0 0;padding:0}
.rd-list li{border-bottom:1px solid var(--r-line);overflow:hidden}
.rd-list a{
  display:flex;align-items:baseline;gap:18px;padding:14px 0;text-decoration:none;color:inherit;
  font-size:clamp(26px,4.2vh,36px);font-weight:500;letter-spacing:-.035em;line-height:1.1;
  transform:translateY(105%);transition:transform .9s var(--r-ease),color .3s;
}
.rd-list a span{font-family:var(--r-mono);font-size:10px;letter-spacing:.1em;color:var(--r-muted);flex:none;width:18px}
.rd-list a:hover{color:var(--r-amber-deep)}
.rd-list a[aria-current="page"]{color:var(--r-amber-deep)}
.rd.is-open .rd-list a{transform:none}
.rd-foot{margin-top:auto;padding-top:34px;font-size:14px;color:var(--r-muted);line-height:1.6}
.rd-foot .rd-social{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:14px}
.rd-foot a{color:var(--r-text);text-decoration:none;border-bottom:1px solid var(--r-line)}
.rd-foot a:hover{border-color:var(--r-amber-deep)}

/* ---------- Botões ---------- */
.rbtn{
  --bg:#fff;--fg:#0f1822;--dot:#0f1822;--dot-fg:#fff;
  display:inline-flex;align-items:center;gap:14px;padding:6px 6px 6px 20px;border-radius:999px;
  background:var(--bg);color:var(--fg);text-decoration:none;font:500 14px/1 var(--r-font);border:0;cursor:pointer;
  box-shadow:0 10px 30px rgba(0,0,0,.14);transition:transform .5s var(--r-ease),box-shadow .5s var(--r-ease),padding .5s var(--r-ease);
}
.rbtn i{width:34px;height:34px;border-radius:50%;background:var(--dot);color:var(--dot-fg);display:grid;place-items:center;flex:none;transition:transform .6s var(--r-ease)}
.rbtn i svg{width:14px;height:14px}
.rbtn:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.2);padding-left:24px}
.rbtn:hover i{transform:rotate(-45deg)}
.rbtn--down:hover i{transform:translateY(2px)}
.rbtn--dark{--bg:#0f1822;--fg:#fff;--dot:#fff;--dot-fg:#0f1822}
.rbtn--amber{--bg:var(--r-amber);--fg:#1b1200;--dot:#1b1200;--dot-fg:var(--r-amber)}

/* ---------- Revelação ao rolar ---------- */
.js .rv{opacity:0;transform:translate3d(0,34px,0);filter:blur(8px);transition:opacity 1.1s var(--r-ease),transform 1.2s var(--r-ease),filter 1.1s var(--r-ease);transition-delay:var(--d,0s)}
.js .rv.is-in{opacity:1;transform:none;filter:none}
.js [data-split] .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.js [data-split] .w>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--r-ease);transition-delay:calc(var(--i,0)*45ms + var(--d,0s))}
.js [data-split].is-in .w>span{transform:none}

@media (prefers-reduced-motion:reduce){
  .js .rv{opacity:1;transform:none;filter:none;transition:none}
  .js [data-split] .w>span{transform:none;transition:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}

/* ---------- Rodapé ---------- */
.rf{background:var(--r-sand);color:var(--r-text);padding:clamp(60px,9vw,110px) var(--r-gut) 28px;border-top:1px solid var(--r-line);overflow:hidden}
.rf-in{max-width:1320px;margin:0 auto}
.rf-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}
.rf-about p{color:var(--r-muted);font-size:15px;line-height:1.65;max-width:36ch;margin:14px 0 0}
.rf h5{font:500 11px/1 var(--r-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--r-muted);margin:6px 0 18px}
.rf ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.rf a{color:var(--r-text);text-decoration:none;font-size:15px;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s var(--r-ease)}
.rf a:hover{background-size:100% 1px}
.rf-word{
  font-weight:600;letter-spacing:-.06em;line-height:.8;font-size:clamp(64px,17vw,260px);
  margin:clamp(50px,8vw,90px) 0 0;color:transparent;-webkit-text-stroke:1px rgba(15,24,34,.18);
  white-space:nowrap;user-select:none;
}
.rf-disc{font-size:12.5px;line-height:1.7;color:var(--r-muted);border-top:1px solid var(--r-line);margin-top:28px;padding-top:20px;max-width:110ch}
.rf-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;margin-top:22px;font-size:13px;color:var(--r-muted)}
.rf-bottom ul{display:flex;flex-wrap:wrap;gap:8px 20px}
.rf-bottom a{font-size:13px;color:var(--r-muted)}
@media (max-width:900px){.rf-grid{grid-template-columns:1fr 1fr}.rf-about{grid-column:1/-1}}
@media (max-width:520px){.rf-grid{grid-template-columns:1fr}}

/* ---------- Ajustes nas páginas internas antigas ---------- */
.crumb{background:var(--r-night)!important;border:0!important;color:rgba(255,255,255,.5)!important;padding-top:78px}
.crumb a{color:rgba(255,255,255,.72)!important}
.crumb a:hover{color:var(--r-amber)!important}
.art-hero,.ap-hero,.hero{background:var(--r-night)!important}
.art-hero h1,.ap-hero h1{font-weight:500;letter-spacing:-.045em;line-height:.98}
.art-hero h1 em,.ap-hero h1 em{color:var(--r-amber)}
.art-kicker,.eyebrow{font-family:var(--r-mono)}
.artigo h2,.lista-head h2{font-weight:500;letter-spacing:-.035em}
.artigo h2 em,.lista-head h2 em{font-style:normal;color:var(--r-amber-deep)}
.artigo .abre::first-letter{font-family:var(--r-font);font-weight:500}
.pratico{border-radius:18px;background:var(--r-ink)!important;overflow:hidden}
.citacao{border-radius:0 14px 14px 0}
.btn{border-radius:999px!important}
.rec,.opcao,.destino,.ap-deck,.ap-modo,.ap-cartao,.ap-fim,.ap-backup,.ap-lote,.ap-add,.ap-n,.ap-op{border-radius:16px!important;overflow:hidden}
.rec,.opcao,.destino{transition:transform .6s var(--r-ease),box-shadow .6s var(--r-ease)}
.rec:hover,.opcao:hover,.destino:hover{transform:translateY(-4px);box-shadow:0 20px 50px rgba(11,31,51,.12)}
.footer{display:none!important}

/* ---------- Atalho de acessibilidade ---------- */
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--r-amber);color:#1b1200;padding:12px 18px;border-radius:999px;font-weight:600;text-decoration:none}
.skip:focus{left:12px;top:12px}
:focus-visible{outline:2px solid var(--r-amber);outline-offset:3px}
