/* Folio — a base comum das páginas do site fora do React (Vitrine e Artigos):
   as cores da página inicial nos dois temas (folio_landing/index.html, site novo
   de 26/10/2026), o fundo animado, o cabeçalho, os botões e o rodapé dela.
   As cores são cópia das variáveis do index; mudou lá, muda aqui.
   Cada seção tem o seu CSS por cima deste: vitrine/vitrine.css, artigos/artigos.css. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}

:root{
  --paper:#f8f4ee;--surface:#fffdfa;--surface-2:#f1eae0;
  --ink:#231b15;--ink-2:#463b33;--ink-3:#5c4f45;
  --accent:#c98424;--accent-ink:#87500f;
  --btn:#231b15;--btn-hover:#3a2d24;--on-btn:#faf6f0;--btn-accent:#e2a04a;
  --line:#ded3c6;--line-strong:#9a8979;
  --veil:248 244 238;--veil-alpha:.86;
  --card-shadow:0 10px 30px -12px #4e382624;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]){
    --paper:#15100d;--surface:#211a15;--surface-2:#2a221c;
    --ink:#f5eee4;--ink-2:#e2d6c8;--ink-3:#c9bbaa;
    --accent:#e2a04a;--accent-ink:#edb45e;
    --btn:#f2e7d8;--btn-hover:#fff6ea;--on-btn:#1a130e;--btn-accent:#87500f;
    --line:#3a2f27;--line-strong:#7d6b5c;
    --veil:20 15 12;--veil-alpha:.74;
    --card-shadow:0 14px 34px -14px #0009;
    color-scheme:dark;
  }
}
:root[data-theme=dark]{
  --paper:#15100d;--surface:#211a15;--surface-2:#2a221c;
  --ink:#f5eee4;--ink-2:#e2d6c8;--ink-3:#c9bbaa;
  --accent:#e2a04a;--accent-ink:#edb45e;
  --btn:#f2e7d8;--btn-hover:#fff6ea;--on-btn:#1a130e;--btn-accent:#87500f;
  --line:#3a2f27;--line-strong:#7d6b5c;
  --veil:20 15 12;--veil-alpha:.74;
  --card-shadow:0 14px 34px -14px #0009;
  color-scheme:dark;
}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{background:var(--paper);color:var(--ink-2);font-family:'Lora',Georgia,serif;font-size:16px;line-height:1.6;overflow-x:hidden;transition:background-color .2s,color .2s;}
a{color:inherit;}
img{max-width:100%;display:block;}
svg{flex-shrink:0;}
::selection{background:color-mix(in srgb,var(--accent) 30%,transparent);color:var(--ink);}
.d{font-family:'Cormorant Garamond',Georgia,'Times New Roman',serif;font-weight:700;letter-spacing:-.01em;line-height:1.1;color:var(--ink);font-variant-numeric:lining-nums;}
.d em{font-style:italic;font-weight:500;color:var(--accent-ink);}
.ey{display:inline-flex;align-items:center;gap:.4rem;font-family:'Crimson Pro',Georgia,serif;font-weight:700;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink);}
.ey svg{width:16px;height:16px;color:var(--accent);}
.cartao{background:var(--surface);border:1px solid var(--line);box-shadow:var(--card-shadow);}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

.w{max-width:72rem;margin:0 auto;padding:0 1.5rem;}

/* FUNDO — a biblioteca 3D do index (site/fundo.js) e o véu por cima dela. As
   duas camadas ficam atrás de tudo; o conteúdo sobe com z-index. */
.three-bg-canvas{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0;background-color:#181310;width:100vw;height:100vh;transition:opacity 1.2s;}
.three-bg-canvas.is-ready{opacity:1;}
.three-bg-canvas canvas{filter:blur(3px);display:block;transform:scale(1.03);width:100%!important;height:100%!important;}
.three-blur-scrim{position:fixed;inset:0;z-index:1;pointer-events:none;background:rgb(var(--veil) / var(--veil-alpha));width:100vw;height:100vh;transition:background-color .4s;}
main,.pe-site{position:relative;z-index:2;}

/* CABEÇALHO — o do index: barra fixa, logo, seções, tema, Entrar, Baixar App */
.cab{position:sticky;top:0;z-index:40;background:var(--paper);background:color-mix(in srgb,var(--paper) 90%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
.cab .w{height:4rem;display:flex;align-items:center;justify-content:space-between;gap:1.5rem;}
.logo{font-family:'Cormorant Garamond',Georgia,serif;font-size:1.875rem;font-weight:700;letter-spacing:-.01em;color:var(--ink);text-decoration:none;white-space:nowrap;}
.logo span{color:var(--accent);}
.secoes{display:flex;align-items:center;gap:1.75rem;}
.nl{font-family:'Crimson Pro',Georgia,serif;font-weight:600;font-size:.95rem;color:var(--ink-2);text-decoration:none;white-space:nowrap;transition:color .2s;}
.nl:hover{color:var(--ink);}
.nl.on{color:var(--ink);font-weight:700;}
.nav-r{display:flex;align-items:center;gap:.6rem;}
.tema{width:2.5rem;height:2.5rem;display:grid;place-items:center;border-radius:.75rem;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;transition:background-color .2s;}
.tema[hidden]{display:none;}
.tema:hover{background:var(--surface-2);}
.tema svg{width:18px;height:18px;}
.tema .sol{display:none;}
:root[data-theme=dark] .tema .sol{display:block;}
:root[data-theme=dark] .tema .lua{display:none;}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]) .tema .sol{display:block;}
  :root:not([data-theme=light]) .tema .lua{display:none;}
}

/* BOTÕES — os do index. Primário: a cor de botão do tema. Contorno: ganha a
   cor de botão ao passar o mouse, como os botões de loja do index. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-family:'Crimson Pro',Georgia,serif;font-weight:600;font-size:.95rem;line-height:1.2;text-decoration:none;border:1px solid transparent;border-radius:.75rem;padding:.65rem 1.15rem;cursor:pointer;white-space:nowrap;transition:background-color .2s,color .2s,border-color .2s,transform .1s;}
.btn:active{transform:scale(.98);}
.btn svg{width:15px;height:15px;}
.bg{background:var(--btn);color:var(--on-btn);border-color:var(--btn);}
.bg:hover{background:var(--btn-hover);border-color:var(--btn-hover);}
.bg svg{color:var(--btn-accent);}
.bo{background:var(--surface);color:var(--ink);border-color:var(--line-strong);}
.bo:hover,.bo:focus-visible{background:var(--btn);color:var(--on-btn);border-color:var(--btn);}
.blg{padding:.85rem 1.5rem;font-size:1.02rem;border-radius:1rem;}
.btn.peq{padding:.55rem 1rem;font-size:.85rem;}

/* O aviso de afiliado: frase inteira no topo e no rodapé, rótulo curto em cada cartão. */
.aviso{font-size:.9rem;color:var(--ink-3);line-height:1.55;}
.aviso b{font-weight:600;color:var(--ink-2);}

/* RODAPÉ — o do index */
.pe-site{margin-top:5rem;border-top:1px solid var(--line);padding:3rem 0;background:var(--paper);background:color-mix(in srgb,var(--paper) 95%,transparent);}
.pe-site .aviso{max-width:46rem;margin-bottom:2rem;}
.pe-linha{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.5rem;}
.pe-linha .logo{font-size:1.5rem;}
.pe-linha .copy{font-size:.875rem;color:var(--ink-3);}
.pe-links{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.5rem;font-size:.875rem;color:var(--ink-2);}
.pe-links a{text-decoration:none;text-underline-offset:4px;}
.pe-links a:hover{color:var(--ink);text-decoration:underline;}
.pe-links a[aria-current]{color:var(--ink);font-weight:600;}
.pe-links .ct{color:var(--ink-3);}

@media(max-width:1024px){
  .secoes{display:none;}
}
@media(max-width:640px){
  .w{padding:0 1rem;}
  .logo{font-size:1.6rem;}
  .nav-r .some{display:none;}
}