/* ═══════════════════════════════════════════════════════════
   VERACI · LANDING PAGE · DESIGN TOKENS
   Paleta da marca (teal · verde-preto · creme)
   Linguagem: glass, textura viva, serif itálico em escala
   ═══════════════════════════════════════════════════════════ */

:root{
  /* — base — */
  --bg:          #050f0d;
  --bg-2:        #071612;
  --bg-deep:     #020807;
  --teal:        #3ecfb2;
  --teal-hi:     #6fe6ce;
  --teal-lo:     #1d7d6a;
  --moss:        #3D5229;
  --cream:       #F0EBE1;

  /* — texto — */
  --tx-strong:   #eefaf7;
  --tx-body:     rgba(222,242,238,.62);
  --tx-faint:    rgba(222,242,238,.34);

  /* — GLASS estilo Apple —
     Quatro camadas: fundo translúcido, backdrop tratado,
     borda em gradiente de luz e specular que segue o cursor. */
  --glass:       rgba(255,255,255,.05);
  --glass-2:     rgba(255,255,255,.085);
  --glass-brd-hi:rgba(62,207,178,.42);

  /* saturate e brightness são o que separa vidro de fumaça */
  --glass-blur:  blur(30px) saturate(180%) brightness(1.08);

  /* borda: luz forte no topo, some no meio, volta fraca embaixo */
  --glass-edge:  linear-gradient(160deg,
                   rgba(255,255,255,.50) 0%,
                   rgba(255,255,255,.10) 26%,
                   rgba(255,255,255,.02) 52%,
                   rgba(255,255,255,.16) 100%);

  /* brilho interno + sombra de profundidade */
  --glass-inner: inset 0 1px 1px rgba(255,255,255,.14),
                 inset 0 -1px 1px rgba(0,0,0,.22);
  --glass-drop:  0 18px 50px rgba(0,0,0,.42), 0 2px 10px rgba(0,0,0,.28);

  /* — tipografia — */
  --f-serif: 'Playfair Display', 'Iowan Old Style', Georgia, serif;
  --f-sans:  'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --f-mono:  'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* — escala (mais ampla que documento) — */
  --t-label: clamp(9px, 8px + .18vw, 11px);
  --t-sm:    clamp(.84rem, .8rem + .2vw, .95rem);
  --t-base:  clamp(.96rem, .92rem + .24vw, 1.08rem);
  --t-md:    clamp(1.18rem, 1rem + .7vw, 1.6rem);
  --t-lg:    clamp(2rem, 1.3rem + 3vw, 3.6rem);
  --t-xl:    clamp(2.8rem, 1.5rem + 5.6vw, 6.4rem);
  --t-huge:  clamp(3.4rem, 1.4rem + 8.4vw, 8.6rem);

  /* — ritmo — */
  --maxw:    1240px;
  --maxw-tx: 720px;
  --gut:     clamp(1.2rem, .7rem + 2.4vw, 3rem);
  --sec-y:   clamp(4.5rem, 2.6rem + 7vw, 10rem);

  /* — raios — */
  --r-xl:   26px;
  --r-card: 20px;
  --r-sm:   14px;
  --r-pill: 999px;

  /* — movimento — */
  --e-out:  cubic-bezier(.16,1,.3,1);
  --e-io:   cubic-bezier(.76,0,.24,1);
  --d-fast: .3s;
  --d-mid:  .6s;
  --d-slow: 1.05s;

  /* — luz — */
  --glow-teal: radial-gradient(ellipse, rgba(62,207,178,.16) 0%, transparent 62%);
  --shadow-lift: 0 20px 60px rgba(0,0,0,.45);
}

@media (prefers-reduced-motion: reduce){
  :root{ --d-fast:.01s; --d-mid:.01s; --d-slow:.01s; }
}
