/* Marca principal de la plataforma. Paleta REAL que ya usan las páginas (index.html, apps por rol), escrita
   con nombres de uso. Hoy las páginas todavía traen sus propios :root; esta es la fuente de la guía
   /marca/ y la que deben leer las pantallas nuevas. Si hace falta otro tono, se agrega AQUÍ con su uso. */
:root{
  /* Marca */
  --marca:#b6f13a;            /* lima: botón principal (Buscar / Search), ofertas especiales. Solo como fondo o sobre oscuro, nunca texto sobre blanco */
  --marca-hover:color-mix(in srgb,var(--marca) 85%,#000); /* al pasar el mouse o tocar el botón principal */
  --marca-suave:color-mix(in srgb,var(--marca) 22%,#fff); /* fondos de chips y avisos de la marca */
  --sobre-marca:#0a0c12;      /* texto encima de --marca */
  --acento:#2e9bff;           /* azul: chips e insignias numéricas. Nunca texto largo */
  --sobre-acento:#ffffff;     /* texto encima de --acento (solo negritas grandes) */
  /* Neutros */
  --fondo:#ffffff;            /* fondo de página */
  --fondo-oscuro:#04070f;     /* héroe, encabezado y color del tema de la PWA */
  --fondo-escena:#1246e2;     /* escena azul detrás del héroe */
  --fondo-pie:#0a1533;        /* pie de página */
  --superficie:#f5f4f8;       /* tarjetas y secciones claras */
  --tinta:#0a0c12;            /* texto principal */
  --tinta-2:#4a515c;          /* texto secundario */
  --linea:#ededf0;            /* bordes y tarjetas grises */
  /* Estados (los de las apps por rol) */
  --ok:#1D6A4B;      /* éxito: reserva pagada, llegada escaneada */
  --aviso:#875814;   /* atención */
  --error:#AC312A;   /* error */
  --info:#295F8A;    /* información */
  /* Tipografía: una sola familia */
  --display:'Mulish',ui-sans-serif,system-ui,sans-serif;
  --sans:'Mulish',ui-sans-serif,system-ui,sans-serif;
  --t-1:2.5rem; --t-2:1.75rem; --t-3:1.25rem; --t-texto:1rem; --t-chico:.875rem;
  /* Forma */
  --radio:16px; --radio-chico:10px; --sombra:0 1px 2px rgba(10,12,18,.06),0 8px 24px -12px rgba(10,12,18,.2);

  /* ── Apps por rol (huésped, aliados, operadores, promotores: apps-marca.css sobre la base común) ──
     «Carta náutica»: tarjetas de noche con isóbatas vivas (carta-nautica.js) y papel claro para leer con sol.
     Todo lo que depende del color de la marca se deriva de --marca/--acento: una marca con color propio
     (marca-ident.js) tiñe las apps sin tocar código. */
  --marca-oscura:color-mix(in srgb,var(--marca) 38%,#0a0c12);  /* texto de la pestaña activa y enlaces sobre papel */
  --marca-suave-2:color-mix(in srgb,var(--marca) 34%,#fff);    /* píldora de la barra, barras de avance */
  --noche:#050b1c;            /* tarjeta principal (carta náutica), hojas y avisos */
  --noche-2:#0c1d46;          /* segundo tono de la noche: el mar abierto arriba a la derecha */
  --sobre-noche:#f3efe6;      /* texto sobre --noche: marfil, no blanco puro */
  --champan:#e9d4a4;          /* cifras de dinero sobre --noche: el sol bajo sobre el agua */
  --papel:#edf0f4;            /* fondo de página de las apps (porcelana apenas fría: se lee a pleno sol) */
  --tarjeta:#ffffff;          /* tarjetas sobre --papel */
  --tinta-3:#6b7280;          /* texto terciario (fechas, notas) ≥ 4.5:1 sobre --tarjeta */
  --vidrio-fuerte:rgba(255,255,255,.86); /* barra superior y barra de secciones */
  --vidrio-noche:rgba(243,239,230,.1);   /* chips y paneles de vidrio sobre --noche */
  --apps-sans:'Figtree',ui-sans-serif,system-ui,sans-serif;  /* autoalojada: se lee firme con sol */
  --radio-tarjeta:24px; --radio-heroe:30px; --radio-accion:999px;
  --sombra-alta:0 24px 60px -24px rgba(5,11,28,.55),0 2px 6px rgba(5,11,28,.08);
  --dur-normal:250ms; --curva:cubic-bezier(.2,0,0,1);
}
