/* ============================================================
   CUESTA SOLAR — Design Tokens (LIGHT / Daylight)
   Estética clara, solar, premium. Fonte única de verdade.
   ============================================================ */

:root {
  /* ---- Cor: base (claro) ---- */
  --c-black:        #f8f5ef;   /* page bg (warm daylight) — nome mantido p/ compatibilidade */
  --c-ink:          #ffffff;   /* superfície branca pura */
  --c-deep:         #ffffff;   /* superfície de card */
  --c-mid:          #ece6d9;   /* tom neutro quente p/ divisórias */
  --c-line:         rgba(28, 24, 16, 0.10);
  --c-line-strong:  rgba(28, 24, 16, 0.18);
  --c-white:        #ffffff;

  /* superfícies extras */
  --c-bg:           #f8f5ef;
  --c-bg-2:         #f1ece1;
  --c-surface:      #ffffff;
  --c-surface-2:    #fbf8f2;

  /* ---- Cor: texto (escuro sobre claro) ---- */
  --ink:     #16140f;
  --t-hi:    rgba(22, 20, 15, 0.96);
  --t-mid:   rgba(38, 34, 26, 0.70);
  --t-low:   rgba(38, 34, 26, 0.52);
  --t-faint: rgba(38, 34, 26, 0.24);

  /* ---- Cor: marca ---- */
  --gold:        #ffb200;
  --gold-soft:   #ffce4d;
  --gold-deep:   #e07b00;
  --gold-ink:    #b56400;   /* gold acessível p/ texto sobre claro */
  --blue:        #0094c2;   /* azul acessível p/ texto/ícones */
  --blue-soft:   #33cdf2;
  --blue-bright: #00d4ff;   /* azul vivo p/ glow/accent */
  --blue-deep:   #006e8c;

  /* ---- Gradientes de marca ---- */
  --grad-solar:   linear-gradient(135deg, #ffd24d 0%, #ffb200 40%, #ff7a00 100%);
  --grad-electric:linear-gradient(135deg, #33d6ff 0%, #00a7cc 55%, #006e8c 100%);
  --grad-fusion:  linear-gradient(120deg, #ff8c00 0%, #00a0c8 100%);
  --grad-ink:     radial-gradient(120% 120% at 50% 0%, #ffffff 0%, #f8f5ef 46%, #f1ece1 100%);
  --grad-sun:     radial-gradient(circle at 50% 0%, rgba(255,200,80,.28), transparent 60%);

  /* ---- Glow (suave p/ fundo claro) ---- */
  --glow-gold: 0 0 0 1px rgba(255,178,0,.30), 0 18px 50px -18px rgba(255,150,0,.45);
  --glow-blue: 0 0 0 1px rgba(0,148,194,.26), 0 18px 50px -18px rgba(0,160,200,.40);

  /* ---- Sombras (light theme usa sombra, não borda-glass) ---- */
  --shadow-sm: 0 2px 10px -4px rgba(40,30,10,.12);
  --shadow-md: 0 14px 44px -16px rgba(40,30,10,.20);
  --shadow-lg: 0 30px 80px -24px rgba(40,30,10,.26);

  /* ---- Glass (sobre claro) ---- */
  --glass-bg:     rgba(255, 255, 255, 0.72);
  --glass-bg-2:   rgba(255, 255, 255, 0.66);
  --glass-line:   rgba(28, 24, 16, 0.08);
  --glass-blur:   16px;

  /* ---- Tipografia ---- */
  --f-sans: "Inter", "Helvetica Neue", Helvetica, Arial, system-ui, -apple-system,
            "Segoe UI", Roboto, sans-serif;
  --f-display: "Sora", "Inter", system-ui, sans-serif;

  --fs-xs:    0.72rem;
  --fs-sm:    0.82rem;
  --fs-base:  0.94rem;
  --fs-md:    clamp(0.96rem, 0.9rem  + 0.5vw, 1.22rem);
  --fs-lg:    clamp(1.15rem, 1rem    + 1vw,   1.6rem);
  --fs-xl:    clamp(1.5rem,  1.2rem  + 2vw,   2.6rem);
  --fs-2xl:   clamp(1.9rem,  1.3rem  + 3.6vw, 4rem);
  --fs-3xl:   clamp(2.3rem,  1.4rem  + 5.4vw, 5.4rem);
  --fs-hero:  clamp(2.1rem,  1.1rem  + 5vw,   5rem);

  --lh-tight: 1.04;
  --lh-snug:  1.18;
  --lh-body:  1.62;

  --ls-hero:  -0.03em;
  --ls-head:  -0.02em;
  --ls-eyebrow: 0.28em;

  /* ---- Espaço (base 4px) ---- */
  --s-1: 4px;   --s-2: 8px;   --s-3: 12px;  --s-4: 16px;
  --s-5: 24px;  --s-6: 32px;  --s-7: 48px;  --s-8: 64px;
  --s-9: 96px;  --s-10: 128px; --s-11: 160px; --s-12: 200px;

  /* ---- Layout ---- */
  --maxw:      1440px;
  --maxw-prose: 820px;
  --gutter:    clamp(20px, 5vw, 72px);
  --radius:    18px;
  --radius-lg: 28px;
  --radius-sm: 12px;
  --radius-pill: 999px;

  /* ---- Motion ---- */
  --e-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --e-inout:  cubic-bezier(0.65, 0, 0.35, 1);
  --e-soft:   cubic-bezier(0.33, 1, 0.68, 1);
  --d-fast:   0.28s;
  --d-base:   0.5s;
  --d-slow:   0.9s;
  --d-cine:   1.3s;

  /* ---- z ---- */
  --z-bg:    0;
  --z-base:  1;
  --z-nav:   100;
  --z-menu:  200;
  --z-top:   300;
}