/* ==========================================================================
   RORAIMA POÇOS ARTESIANOS — DESIGN TOKENS  v2.0
   Fonte única de verdade para cores, tipografia, espaçamento, raios,
   sombras e movimento. Altere aqui e o site inteiro acompanha.
   Documentação visual: /design-system.html
   ========================================================================== */

:root {
  /* ---------- Cores da marca ---------- */
  --c-abyss:      #020E1A;   /* fundo mais profundo (rodapé, aquífero) */
  --c-navy-900:   #04182B;   /* fundo escuro principal */
  --c-navy-800:   #072640;   /* superfícies sobre o escuro */
  --c-navy-700:   #003D66;   /* azul institucional (secundária do logo) */
  --c-blue-600:   #1C5A8C;   /* azul primário do logo */
  --c-blue-500:   #2873B2;
  --c-aqua-400:   #2FB8EA;   /* água — destaque principal */
  --c-aqua-300:   #74D2F4;
  --c-aqua-100:   #DDF3FC;
  --c-go-500:     #2BD46D;   /* CTA / WhatsApp */
  --c-go-600:     #1FB75A;
  --c-sun-400:    #FFC24B;   /* alerta/estiagem — uso pontual */

  /* ---------- Terra (estratos do subsolo) ---------- */
  --c-earth-1:    #C79A63;
  --c-earth-2:    #9C6B43;
  --c-earth-3:    #6E4E3A;
  --c-rock:       #3C4A5A;

  /* ---------- Neutros ---------- */
  --c-ink:        #0A1A2A;   /* texto forte no claro */
  --c-text:       #3A4B5D;   /* texto corrido no claro */
  --c-muted:      #6A7B8E;
  --c-line:       #DCE5EE;
  --c-paper:      #F3F7FB;   /* fundo claro de seção */
  --c-white:      #FFFFFF;

  /* ---------- Papéis semânticos (tema claro) ---------- */
  --bg:           var(--c-white);
  --bg-alt:       var(--c-paper);
  --surface:      var(--c-white);
  --fg:           var(--c-ink);
  --fg-soft:      var(--c-text);
  --fg-muted:     var(--c-muted);
  --border:       var(--c-line);
  --accent:       var(--c-blue-600);
  --accent-2:     var(--c-aqua-400);
  --cta:          var(--c-go-500);
  --cta-ink:      var(--c-navy-900);

  /* ---------- Gradientes ---------- */
  --g-deep:   radial-gradient(120% 90% at 80% 0%, #0B3A63 0%, var(--c-navy-900) 45%, var(--c-abyss) 100%);
  --g-water:  linear-gradient(135deg, var(--c-aqua-400) 0%, var(--c-blue-500) 55%, var(--c-navy-700) 100%);
  --g-text:   linear-gradient(100deg, #A9E6FB 0%, var(--c-aqua-400) 45%, #4A9BE0 100%);
  --g-cta:    linear-gradient(180deg, #3BE07C 0%, var(--c-go-500) 100%);

  /* ---------- Tipografia ---------- */
  --font-display: "Kanit", "Segoe UI", system-ui, sans-serif;   /* fonte da marca */
  --font-body:    "Manrope", "Segoe UI", system-ui, sans-serif;

  --fs-xs:   0.78rem;
  --fs-sm:   0.9rem;
  --fs-md:   1.0625rem;
  --fs-lg:   clamp(1.125rem, 1.05rem + 0.35vw, 1.3rem);
  --fs-h4:   clamp(1.2rem, 1.1rem + 0.5vw, 1.45rem);
  --fs-h3:   clamp(1.45rem, 1.25rem + 0.9vw, 1.9rem);
  --fs-h2:   clamp(2rem, 1.55rem + 2vw, 3.2rem);
  --fs-h1:   clamp(2.6rem, 1.7rem + 4.2vw, 5.4rem);
  --fs-mega: clamp(3.2rem, 2rem + 6vw, 7.5rem);

  --lh-tight: 1.04;
  --lh-snug:  1.2;
  --lh-body:  1.65;
  --tracking-caps: 0.14em;

  /* ---------- Espaçamento (base 4px) ---------- */
  --s-1: 4px;  --s-2: 8px;  --s-3: 12px; --s-4: 16px; --s-5: 20px;
  --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-16: 64px;
  --s-20: 80px; --s-24: 96px; --s-32: 128px;
  --section-y: clamp(72px, 6vw + 40px, 140px);
  --gutter: clamp(16px, 4vw, 40px);
  --container: 1240px;
  --container-narrow: 760px;

  /* ---------- Raios ---------- */
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 22px;
  --r-xl: 32px;
  --r-pill: 999px;

  /* ---------- Sombras ---------- */
  --sh-1: 0 1px 2px rgba(4, 24, 43, .06), 0 2px 8px rgba(4, 24, 43, .05);
  --sh-2: 0 6px 24px -6px rgba(4, 24, 43, .14), 0 2px 6px rgba(4, 24, 43, .05);
  --sh-3: 0 24px 60px -18px rgba(4, 24, 43, .28);
  --sh-glow: 0 0 0 1px rgba(47, 184, 234, .25), 0 10px 40px -10px rgba(47, 184, 234, .55);
  --sh-cta: 0 10px 30px -8px rgba(43, 212, 109, .55);

  /* ---------- Movimento ---------- */
  --ease-out:    cubic-bezier(.16, 1, .3, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: 160ms;
  --t-base: 320ms;
  --t-slow: 700ms;
  --t-reveal: 1000ms;

  /* ---------- Camadas ---------- */
  --z-base: 1; --z-sticky: 50; --z-header: 100; --z-overlay: 200; --z-toast: 300;
}

/* Seções escuras invertem os papéis semânticos */
.theme-dark {
  --bg:       var(--c-navy-900);
  --bg-alt:   var(--c-navy-800);
  --surface:  rgba(255, 255, 255, .04);
  --fg:       #F2F8FD;
  --fg-soft:  #B7C8D9;
  --fg-muted: #7F95AB;
  --border:   rgba(148, 196, 235, .14);
  --accent:   var(--c-aqua-400);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t-base: 0ms; --t-slow: 0ms; --t-reveal: 0ms; }
}