/* ===================================================================
   OASIS — Tokens de diseño (sistema de marca)
   Una sola fuente de verdad para color, tipografía, espaciado, etc.
   Paleta oficial: verde esmeralda + dorado (ver brand/MARCA_OASIS.md)
   =================================================================== */

:root {
  /* --- Color: crudos --- */
  --c-oro:        #C2912E;   /* primario — bienvenida / sol */
  --c-oro-claro:  #E6C677;
  --c-oro-oscuro: #9A6B1E;
  --c-verde:      #125C44;   /* secundario — refugio fresco */
  --c-palma:      #2E7D5B;
  --c-verde-hondo:#0D4533;
  --c-crema:      #F4ECDD;   /* base — nunca blanco frío */
  --c-arena:      #E7D9BF;
  --c-caoba:      #4E2E26;   /* anclaje cálido */
  --c-noche:      #172A4D;   /* modo noche / crepúsculo */
  --c-hibisco:    #BE3B27;   /* acento — solo chispa */
  --c-lino:       #FBF8F2;
  --c-carbon:     #2A2622;

  /* --- Color: semánticos --- */
  --bg:           var(--c-crema);
  --bg-arena:     var(--c-arena);
  --bg-card:      var(--c-lino);
  --bg-oscuro:    var(--c-verde);
  --bg-noche:     var(--c-noche);
  --bg-caoba:     var(--c-caoba);

  --texto:        var(--c-carbon);
  --texto-suave:  #5C534B;
  --texto-tenue:  #877C71;
  --texto-claro:  var(--c-lino);
  --texto-claro-suave: #D8E0D3;

  --acento:       var(--c-oro);     /* solo decorativo (no texto sobre crema) */
  --cta:          var(--c-verde);
  --cta-hover:    var(--c-verde-hondo);
  --chispa:       var(--c-hibisco);
  --borde:        #E0D4BD;
  --borde-oscuro: rgba(255,255,255,.14);

  /* --- Tipografía --- */
  --fuente-titulo: "Playfair Display", Georgia, "Times New Roman", serif;
  --fuente-cuerpo: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Escala fluida (móvil → desktop) */
  --txt-xs:   clamp(0.75rem, 0.72rem + 0.15vw, 0.85rem);
  --txt-sm:   clamp(0.86rem, 0.83rem + 0.18vw, 0.95rem);
  --txt-base: clamp(1rem,    0.96rem + 0.25vw, 1.13rem);   /* cuerpo 16→18px */
  --txt-lg:   clamp(1.2rem,  1.10rem + 0.55vw, 1.5rem);
  --txt-xl:   clamp(1.55rem, 1.30rem + 1.30vw, 2.35rem);
  --txt-2xl:  clamp(2.05rem, 1.60rem + 2.40vw, 3.4rem);
  --txt-3xl:  clamp(2.4rem,  1.80rem + 3.10vw, 4.2rem);
  --txt-hero: clamp(2.7rem,  1.90rem + 3.90vw, 5.2rem);

  --peso-titulo: 600;
  --peso-cuerpo: 400;
  --peso-medio:  500;
  --peso-fuerte: 700;
  --interlinea-titulo: 1.05;
  --interlinea-cuerpo: 1.65;
  --tracking-mayus: 0.16em;   /* para etiquetas en mayúsculas */

  /* --- Espaciado (base 4px) --- */
  --s-1: 0.25rem; --s-2: 0.5rem;  --s-3: 1rem;   --s-4: 1.5rem;
  --s-5: 2rem;    --s-6: 3rem;    --s-7: 4rem;   --s-8: 6rem;

  --seccion-y: clamp(3.5rem, 2.5rem + 5vw, 7rem);   /* ritmo vertical de sección */
  --ancho:     min(1180px, 92vw);                    /* container estándar */
  --ancho-angosto: min(720px, 92vw);

  /* --- Radios --- */
  --r-sm:   8px;
  --r-md:   14px;
  --r-lg:   22px;
  --r-xl:   32px;
  --r-pill: 999px;

  /* --- Sombras (cálidas, tinte caoba — nunca azul frío) --- */
  --sombra-sm:   0 2px 8px rgba(42,38,34,.08);
  --sombra-md:   0 12px 30px -8px rgba(42,38,34,.18);
  --sombra-foto: 0 22px 50px -16px rgba(78,46,38,.38);
  --sombra-card: 0 14px 36px -12px rgba(78,46,38,.22);

  /* --- Movimiento --- */
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.23,1,.32,1);   /* ease-out fuerte (entradas) */
  --t-rapido: .18s var(--ease);
  --t-medio:  .35s var(--ease);
  --t-lento:  .6s  var(--ease);

  /* --- Capas --- */
  --z-nav: 100;
  --z-menu: 200;
  --z-modal: 300;
  --z-grano: 400;   /* textura de grano (pointer-events:none) */

  /* --- Overlays sobre foto --- */
  --velo-verde:  linear-gradient(120deg, rgba(13,69,51,.82) 0%, rgba(18,92,68,.45) 45%, rgba(18,92,68,.08) 100%);
  --velo-noche:  linear-gradient(180deg, rgba(13,18,33,.25) 0%, rgba(13,18,33,.78) 100%);
  --velo-abajo:  linear-gradient(180deg, transparent 0%, transparent 40%, rgba(28,20,15,.72) 100%);
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-rapido: 0s; --t-medio: 0s; --t-lento: 0s; }
}