/* ============================================
   DESIGN TOKENS — Tempero a Mais
   ============================================ */

/* === WEB FONTS === */
@font-face {
  font-family: 'BebasNeue';
  src: url('../assets/BebasNeue-Bold.otf') format('opentype');
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'BebasNeue';
  src: url('../assets/BebasNeue-Regular.otf') format('opentype');
  font-weight: 400;
  font-display: swap;
}

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

@font-face {
  font-family: 'Dax';
  src: url('../assets/Dax-Medium.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'Dax';
  src: url('../assets/Dax-Bold.ttf') format('truetype');
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'NexaRustSans';
  src: url('../assets/NexaRustSans-Black.otf') format('opentype');
  font-weight: 900;
  font-display: swap;
}

:root {
  /* === COLORS === */

  /* Amarelo — acento principal, CTAs, destaques, badges */
  --color-gold: #DAA520;
  --color-gold-rgb: 218, 165, 32;
  --color-gold-light: #E4BA4A;
  --color-gold-dark: #B8891A;
  --color-gold-hover: #C99A1C;

  /* Verde Escuro — texto principal, footer, cards escuros */
  --color-green-dark: #0D5E31;
  --color-green-dark-rgb: 13, 94, 49;
  --color-green-medium: #1A7A42;
  --color-green-light: #2D9B55;

  /* Branco Gelo — fundo predominante */
  --color-ice: #F5F3EF;
  --color-ice-rgb: 245, 243, 239;

  /* Branco Puro — cards, formularios */
  --color-white: #FFFFFF;
  --color-white-rgb: 255, 255, 255;

  /* Cinzas */
  --color-gray-100: #F0EDE8;
  --color-gray-200: #E5E1DA;
  --color-gray-300: #D1CCC3;
  --color-gray-400: #A8A299;
  --color-gray-500: #7D7870;
  --color-gray-600: #5C5850;
  --color-gray-700: #3D3A34;
  --color-gray-800: #2A2722;

  /* Semanticas */
  --color-success: #2D7A3A;
  --color-success-light: #E8F5EA;
  --color-error: #C43D3D;
  --color-error-light: #FDEAEA;
  --color-whatsapp: #25D366;
  --color-whatsapp-hover: #1EBE57;
  --color-info: #2B6CB0;
  --color-info-light: #EBF5FF;

  /* === TYPOGRAPHY === */
  --font-heading: 'BebasNeue', 'Arial Narrow', sans-serif;
  --font-heading-alt: 'NexaRustSans', 'BebasNeue', 'Arial Black', sans-serif;
  --font-body: 'Dax', 'Inter', 'Helvetica Neue', 'Arial', sans-serif;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;
  --text-5xl: 3rem;
  --text-6xl: 3.75rem;
  --text-7xl: 4.5rem;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  --leading-none: 1;
  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-normal: 1.6;
  --leading-relaxed: 1.75;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.025em;
  --tracking-wider: 0.05em;
  --tracking-widest: 0.1em;

  /* === SPACING === */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --space-32: 8rem;

  --section-padding-y: var(--space-24);
  --section-padding-y-mobile: var(--space-16);
  --container-padding-x: var(--space-6);
  --card-padding: var(--space-8);
  --card-padding-mobile: var(--space-6);
  --card-gap: var(--space-6);
  --input-padding-y: var(--space-3);
  --input-padding-x: var(--space-4);

  /* === BORDERS === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-2xl: 32px;
  --radius-full: 9999px;

  /* === SHADOWS === */
  --shadow-glass: 0 8px 32px rgba(0, 0, 0, 0.08);
  --shadow-glass-hover: 0 12px 40px rgba(0, 0, 0, 0.12);
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.14);
  --shadow-gold: 0 4px 24px rgba(218, 165, 32, 0.3);
  --shadow-gold-hover: 0 8px 32px rgba(218, 165, 32, 0.4);
  --shadow-inner-gold: inset 0 0 0 2px rgba(218, 165, 32, 0.3);

  /* === Z-INDEX === */
  --z-video: -1;
  --z-video-overlay: 0;
  --z-content: 1;
  --z-sticky: 10;
  --z-header: 100;
  --z-dropdown: 200;
  --z-modal: 300;
  --z-mobile-menu: 400;
  --z-whatsapp: 500;
  --z-toast: 600;

  /* === BREAKPOINTS (reference) === */
  --bp-mobile: 599px;
  --bp-tablet: 900px;
  --bp-desktop: 900px;
  --bp-wide: 1200px;
  --bp-max: 1440px;

  /* === TRANSITIONS === */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
  --transition-slow: 400ms ease;
  --transition-slower: 600ms ease;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-in-out-quart: cubic-bezier(0.76, 0, 0.24, 1);
}