/*
 * Design tokens extraídos do Figma "LP - ORTOBOM GARANHUNS".
 * O Figma foi desenhado em 1920px com tipografia muito grande; a escala
 * abaixo mantém a hierarquia do design em tamanhos de leitura confortáveis.
 * Medidas fluidas: clamp(mínimo no mobile, valor em vw, teto em telas grandes).
 */
:root {
  /* Cores */
  --color-brand-700: #0248ca;
  --color-brand-500: #068fff;
  --color-brand-heading: #034dce;
  --color-brand-navy: #003f83;
  --color-accent: #0584f7;

  --color-whatsapp-start: #029500;
  --color-whatsapp-mid: #0da90a;
  --color-whatsapp-end: #46ca44;

  --color-text: #373737;
  --color-text-strong: #1e1e1e;
  --color-text-muted: #858585;
  --color-text-faq: #270708;
  --color-text-footer: #f1ebeb;

  --color-white: #fff;
  --color-surface: #f3f3f3;
  --color-surface-alt: #eee;
  --color-surface-neutral: #e8e8e8;
  --color-border-card: #343434;

  --gradient-brand: linear-gradient(90deg, var(--color-brand-700), var(--color-brand-500));
  --gradient-brand-vertical: linear-gradient(180deg, var(--color-brand-500), var(--color-brand-700));
  --gradient-whatsapp: linear-gradient(90deg, var(--color-whatsapp-start), var(--color-whatsapp-mid) 50%, var(--color-whatsapp-end));

  /* Tipografia */
  --font-base: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-footer: "Poppins", var(--font-base);

  --fs-hero-title: clamp(2rem, 3.6vw, 4.25rem);
  --fs-location-title: clamp(2rem, 3.4vw, 4rem);
  --fs-quiz-title: clamp(1.625rem, 3.1vw, 3.625rem);
  --fs-display: clamp(1.75rem, 3.1vw, 3.5rem);
  --fs-product-name: clamp(1.5rem, 2.3vw, 2.75rem);
  --fs-h3-lg: clamp(1.0625rem, 1.75vw, 2rem);
  --fs-lead-lg: clamp(1rem, 1.6vw, 1.875rem);
  --fs-h3: clamp(1.125rem, 1.7vw, 2rem);
  --fs-lead: clamp(0.9375rem, 1.4vw, 1.625rem);
  --fs-body-lg: clamp(0.875rem, 1.3vw, 1.5rem);
  --fs-stat-label: clamp(0.875rem, 1.3vw, 1.5rem);
  --fs-button-lg: clamp(1rem, 1.3vw, 1.5rem);
  --fs-body: clamp(0.9375rem, 1.25vw, 1.4375rem);
  --fs-note: clamp(1rem, 1.4vw, 1.625rem);
  --fs-faq: clamp(0.9375rem, 1.2vw, 1.375rem);
  --fs-info: clamp(0.875rem, 1.1vw, 1.25rem);
  --fs-button-hero: clamp(0.8125rem, 1.15vw, 1.375rem);
  --fs-size-label: clamp(0.8125rem, 1.05vw, 1.25rem);
  --fs-highlight-value: clamp(1rem, 2vw, 2.375rem);
  --fs-highlight-label: clamp(0.75rem, 1vw, 1.125rem);
  --fs-small: clamp(0.875rem, 0.95vw, 1.0625rem);
  --fs-size-option: clamp(0.8125rem, 0.85vw, 1rem);
  --fs-header: clamp(0.8125rem, 0.8vw, 0.955rem);
  --fs-tagline: clamp(0.3125rem, 0.5vw, 0.625rem);

  /* Espaçamento */
  --gutter: clamp(1rem, 4vw, 2rem);
  --space-section: clamp(3.5rem, 6vw, 7rem);
  --space-block: clamp(1.5rem, 3.5vw, 4rem);
  --space-stack: clamp(1rem, 2.2vw, 2.5rem);

  /* Larguras máximas de conteúdo */
  --width-carousel: 1400px;
  --width-wide: 1320px;
  --width-content: 1200px;
  --width-narrow: 1080px;
  --width-faq: 1000px;
  --width-location: 1240px;

  /* Raios */
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: clamp(16px, 1.9vw, 32px);
  --radius-pill: 999px;

  /* Elevação e movimento */
  --header-height: clamp(62px, 5vw, 96px);
  --transition-fast: 160ms ease;
  --transition-base: 240ms ease;
  --focus-ring: 3px solid var(--color-accent);
}
