/* =====================================================
AGUA FRAMEWORK - theme.agua.css - v2.0
Identidade visual oficial do projeto: Léo Novais.
Design Tático & Estratégico (Dark Neon Lime & Clean Light).
===================================================== */

@font-face {
  font-family: 'Sora';
  src: url('../assets/sora-variable.woff2') format('woff2-variations'),
       url('../assets/sora-variable.woff2') format('woff2'),
       url('../assets/sora-variable.ttf') format('truetype');
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Sora';
  src: url('../assets/sora-200.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Sora';
  src: url('../assets/sora-300.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Sora';
  src: url('../assets/sora-600.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark;
  --font-sans: "Space Grotesk", "Sora", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "Space Grotesk", "Sora", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* =====================================================
     SISTEMA DE PADRONIZAÇÃO TIPOGRÁFICA GLOBAL
     ===================================================== */
  /* 1. Títulos */
  --font-size-title-hero: clamp(2.4rem, 5.5vw, 4.2rem);
  --font-size-title-section: clamp(1.8rem, 3.5vw, 2.75rem);
  --font-size-title-card: clamp(1.15rem, 1.8vw, 1.35rem);

  /* 2. Descrições / Subtítulos / Textos Explicativos Globais */
  --font-size-desc: clamp(0.96rem, 1.1vw, 1.06rem);
  --line-height-desc: 1.55;

  /* 3. Texto Normal do Site (Body) */
  --font-size-body: 1rem;

  /* 4. Avisos, Tags, Chips, Badges e Metadados */
  --font-size-tag: 0.78rem;

  /* 5. Botões Globais */
  --font-size-button: 0.95rem;
  
  /* Paleta Oficial Léo Novais (Dark Theme - Grafite Tático Refinado) */
  --color-bg: #141416;
  --color-surface: #1c1c20;
  --color-surface-2: #25252c;
  --color-surface-3: #32323a;
  
  --color-text: #f5f5f7;
  --color-text-2: #b5b5be;
  --color-text-3: #8e8e98;
  
  --color-border: rgba(255, 255, 255, 0.08);
  --color-border-2: rgba(255, 255, 255, 0.14);
  
  /* Verde-Lima & Oliva Táticos Oficiais */
  --color-accent: #d7f20c;
  --color-accent-2: #b8da08;
  --color-accent-dark: #5a7302;
  --color-accent-dim: rgba(215, 242, 12, 0.12);
  --color-accent-text: #141416;
  
  --color-cyan: #7ecdd1;
  --color-cyan-dim: rgba(126, 205, 209, 0.12);
  --color-overlay: rgba(20, 20, 22, 0.85);
  
  --color-success: #10b981;
  --color-warning: #f59e0b;
  /* Paleta Canônica & Tokens Compartilhados Palmaweb / Léo Novais */
  --ink: #05050A;
  --ink-2: #09090E;
  --ink-3: #0F0F14;
  --surface-tactical: #141416;
  --lime-brand: #d7f20c;
  --lime-glow: rgba(215, 242, 12, 0.25);
  --white: #ffffff;
  --text-gray: #a1a1aa;
  --text-muted: #71717a;
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.16);
  --glass: rgba(255, 255, 255, 0.03);
  --ease: cubic-bezier(.32, .72, 0, 1);
  --transition-tactile: transform 140ms cubic-bezier(0.23, 1, 0.32, 1);
  --transition-smooth: all 200ms cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* =====================================================
   ESTÉTICA FLAT TÁTICA (SEM GLOWS OU SOMBRAS EXAGERADAS)
   ===================================================== */
*, *::before, *::after {
  text-shadow: none !important;
}

.hero-stage-glow,
[class*="glow"],
[class*="-glow"] {
  display: none !important;
  opacity: 0 !important;
  background: none !important;
  filter: none !important;
}

.hero-mockup-frame,
.hero-mockup-frame img,
.hero-stage-visual img,
img {
  filter: none !important;
}

/* =====================================================
   SISTEMA DE APLICAÇÃO TIPOGRÁFICA GLOBAL
   ===================================================== */
/* 1. Texto Normal do Site (Body) */
body, p, li, input, textarea, select {
  font-size: var(--font-size-body);
}

/* 2. Títulos Globais Controlados */
h1, .hero-title, .title-hero {
  font-size: var(--font-size-title-hero);
}

h2, .section-title, .title-section {
  font-size: var(--font-size-title-section);
}

h3, h4, .card-title, .service-row-title, .pricing-card-title, .faq-question {
  font-size: var(--font-size-title-card);
}

/* 3. Descrições e Subtítulos Globais */
.hero-desc, .hero-lead, .section-desc, .section-subtitle, .lead, .hero-tagline, .footer-desc {
  font-size: var(--font-size-desc);
}

/* 4. Avisos, Tags, Chips, Badges e Metadados */
.tag, .badge, .chip, .service-row-chip, .notice, .method-step-pill, .footer-nav-title, .channel-box__user, small, .meta-text, .status-badge {
  font-size: var(--font-size-tag) !important;
}

/* 5. Botões Globais Controlados */
.btn, button, input[type="button"], input[type="submit"], .btn-lime-pill, .btn-hero-primary, .btn-hero-secondary {
  font-size: var(--font-size-button) !important;
}