@font-face {
  font-family: "Amarillo";
  src: url("../assets/fonts/Amarillo.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-texto: #0d6073;
  --color-fondo: #ffffff;
  --color-marca: #0d6073;
  --color-marca-oscura: #0a4d5c;
  --color-acento: #0d6073;
  --color-divisor: #dfecee;
  --fuente-cuerpo: "Poppins", system-ui, sans-serif;
  --fuente-titulos: "Poppins", system-ui, sans-serif;
  --fuente-destacada: "Amarillo", cursive;
  --bp-sm: 640px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;

  --teal: var(--color-marca);
  --teal-deep: var(--color-marca-oscura);
  --teal-mid: #408190;
  --teal-soft: #247774;
  --mint: #92b7c0;
  --mint-light: #b4d0cf;
  --mint-pale: #ccdfdf;
  --card: #b4d0cf;
  --card-bg: #b4d0cf;
  --ice: #ccdfdf;
  --white: var(--color-fondo);
  --text: var(--color-texto);
  --muted: #5a7a80;
  --gray: #4a6a70;
  --shadow: 0 12px 40px rgba(13, 96, 115, 0.12);
  --radius: 22px;
  --radius-lg: 36px;
  --radius-pill: 999px;
  --container: 1120px;
  --z-header: 100;
  --z-nav-overlay: 200;
  --font: var(--fuente-cuerpo);
  --font-display: var(--fuente-titulos);
  --font-script: var(--fuente-destacada);
  --font-serif: var(--fuente-titulos);
}

@media (prefers-reduced-motion: reduce) {
  html,
  body {
    scroll-behavior: auto;
  }

  [data-reveal] {
    opacity: 1;
    transform: none;
  }
}