/**
 * Beta Energy — Design tokens
 * Source of truth: DESIGN.md. Do not add colors or fonts outside that guide.
 */
:root {
  /* Brand */
  --be-lima: #8DC63F;
  --be-verde-profundo: #0B3D2E;
  --be-negro: #000000;
  --be-blanco: #FFFFFF;

  /* Derived scale */
  --be-lima-700: #5E8F1F;
  --be-lima-600: #79B02F;
  --be-lima-100: #EAF5D9;
  --be-lima-50: #F5FAEC;
  --be-verde-800: #124D3B;
  --be-tinta: #14201B;
  --be-gris-600: #55635C;
  --be-gris-300: #CBD5CF;
  --be-gris-100: #F1F4F2;

  /* States */
  --be-exito: #2E8540;
  --be-alerta: #B7791F;
  --be-error: #C0392B;

  /* Typography */
  --be-fuente: "Manrope", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Radii & shadows */
  --be-radio-sm: 8px;
  --be-radio-md: 14px;
  --be-radio-full: 999px;
  --be-sombra-sm: 0 1px 2px rgba(11, 61, 46, .08);
  --be-sombra-md: 0 8px 24px rgba(11, 61, 46, .10);

  /* Site-level tokens derived from the guide */
  --be-sobre-oscuro: rgba(255, 255, 255, .8);     /* body text on dark sections */
  --be-borde-oscuro: rgba(255, 255, 255, .16);    /* dividers on dark sections */
  --be-velo: rgba(11, 61, 46, .6);                /* scrim behind modal and drawer */
  --be-velo-foto: linear-gradient(180deg, rgba(0, 0, 0, .15) 0%, rgba(11, 61, 46, .95) 100%);
  --be-transicion: 180ms ease-out;

  /* Layout */
  --be-ancho: 1200px;
  --be-margen: 32px;            /* Shared horizontal padding — logo & all content */
  --be-seccion: 96px;           /* Vertical padding between sections */
  --be-header: 72px;
}

@media (max-width: 900px) {
  :root {
    --be-margen: 24px;
    --be-seccion: 64px;
  }
}