/* ============================================================================
   RENTAL.DO · MARCA DE CARA AL HUÉSPED · SISTEMA FIRMADO
   Marisol · dirección creativa. Lo cargan index.html, alojamientos.html y
   propiedad.html, SIEMPRE después de marca-sistema.css.
   La ley vive en stealth/SISTEMA.md. Si algo de aquí contradice ese
   documento, gana el documento.

   DÓNDE VIVE EL COLOR
   Aquí ya no. Los tokens de color y tipografía se mudaron a
   marca-sistema.css, que cargan TODAS las páginas del sitio y no solo estas
   tres. Estaban repetidos y esa repetición fue parte de por qué el navy
   muerto sobrevivió en cinco páginas. Este archivo se queda solo con lo que
   es del carril huésped y de ninguna otra superficie: el grano, el lockup,
   el velo de foto y la entrada.

   LA IDEA CENTRAL
   La sombra fresca de la casa, mirando el calor de afuera. La interfaz es
   la sombra: brisa, clara, en calma. La fotografía es el calor: piedra
   coral, teca, sol bajo. La versión noche (#0E1210) fue una exploración
   anterior al sistema firmado y está muerta: si un color de aquella
   iteración aparece en pantalla, la pieza está mal.

   LAS CUATRO REGLAS (no se negocian)
   1. Un acento por pantalla. Flamboyán aparece una vez.
   2. Sobre azafrán y sobre flamboyán, el texto es tinta. Sin excepción.
   3. Azafrán, flamboyán y larimar nunca se tocan sin brisa, tinta o teal
      hondo entre medio.
   4. Nunca #FFFFFF ni #000000. Blanco sobre flamboyán da 4.00 y NO pasa.
      (Única excepción viva: el botón de Google en la ficha, que es un
      control de marca ajena y se queda como Google lo pide.)

   TIPOGRAFÍA · CLASH DISPLAY, AUTO ALOJADA
   El display del sistema es Clash Display (500 de 24px hacia arriba, 600
   debajo). Licencia FFL de Fontshare VERIFICADA Y APROBADA por el
   Fundador: uso comercial permitido, auto alojado permitido. El papel
   vive en assets/fuentes/FFL.txt, junto a los woff2 del kit oficial.
   Se sirve desde nuestro propio origen, así que la CSP actual
   (font-src 'self') ya la permite: no se amplió nada.
   Figtree queda detrás en la pila como respaldo para el instante de
   carga (font-display:swap): la página nunca se rompe si la fuente
   tarda. Lo único prohibido por la FFL es redistribuir la fuente como
   fuente, que no hacemos.

   FOTOGRAFÍA, LO QUE SE PROBÓ Y SIGUE VALIENDO
   1. Recorte. crop=focalpoint con fp-y bajo saca el cielo vacío del
      cuadro. Es el 80% de la mejora.
   2. Vertical. 4/5 en vez de 3/2. Editorial, no inventario.
   3. Velo solo en el tercio de abajo, marrón cálido de tinta, nunca negro.
   4. sat=-12 y gam=4, nada más.
   La foto es bloque: radio 20, sombra propia en tono de la superficie.
   El calor lo pone la foto; la superficie alrededor es fría.
   ============================================================================ */

/* Los @font-face de Clash Display, la paleta firmada, los estados, los
   radios, las sombras, la curva y el remapeo de los tokens heredados
   (--navy, --bg, --ink, --line...) viven todos en marca-sistema.css.
   Ese archivo carga antes que este. Aquí no se declara ni un color. */


/* Grano. SVG fractalNoise, baseFrequency .82, 3 octavas. Sobre claro va
   multiply al .055, nunca overlay (SISTEMA.md, efectos 1). Para web el
   filtro en vivo está bien: es un mosaico de 180px que el navegador
   rasteriza una vez. El costo real es el mix-blend-mode en una capa fija
   a pantalla completa; medido abajo en el QA. Para PDF se hornea, aquí no. */
body::after{
  content:""; position:fixed; inset:0; z-index:2000; pointer-events:none;
  opacity:.055; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Tipografía de display. Clash Display: 500 con -.024em de 24px hacia
   arriba; 600 con -.026em debajo de 24px. Dos pesos de la misma familia.
   Nunca versalitas, nunca itálica, nunca cuerpo. La clase .serif se
   conserva por nombre (la usan las tres páginas) pero ya no es una serif:
   la serif del sistema operativo fue parte de la exploración muerta. */
.serif{
  font-family:var(--display); font-weight:500; letter-spacing:-.024em;
  line-height:1.06;
}
.kicker{
  font-family:var(--ui); font-size:.68rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--larimar-d);
}

/* Precios: Figtree 700, tabular. Nunca se achican ni se disculpan. */
.precio-num{
  font-family:var(--ui); font-weight:700; font-variant-numeric:tabular-nums;
}

/* ---- el lockup ----
   Símbolo: la ligadura rdo del trace original del Fundador
   (stealth/marca-rental/logo/svg/rdo-simbolo-original-fundador.svg,
   pegado inline en el marcado: con <use> se deforma). Nunca se redibuja.
   Sobre brisa la marca va en teal hondo.
   En barras: símbolo + "rental", Clash 600. Alineación a la base: la base
   del símbolo pisa el baseline del nombre y queda más alto que él. */
.lockup{
  display:inline-flex; align-items:baseline; gap:.34em;
  color:var(--teal-hondo); text-decoration:none;
}
.lockup svg{ height:1.28em; width:auto; display:inline-block; }
.lockup .wm{
  font-family:var(--display); font-weight:600; letter-spacing:-.026em;
  text-transform:lowercase; line-height:1;
}

/* Velo de foto. Solo el tercio de abajo, marrón cálido de tinta, nunca
   negro puro. El resplandor de ámbar NO vive aquí: es uno por pantalla y
   cada página lo pone solo en su foto héroe. */
.velo-calido{
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(0deg,
    rgba(20,10,6,.74) 0%,
    rgba(24,16,10,.42) 30%,
    rgba(24,16,10,0) 62%);
}

/* Entrada. Güira y tambora. Nada más se mueve. */
.sube{ opacity:0; transform:translateY(14px);
  transition:opacity var(--tambora) var(--ease), transform var(--tambora) var(--ease); }
.sube.dentro{ opacity:1; transform:none; }

@media (prefers-reduced-motion:reduce){
  .sube{ opacity:1; transform:none; transition:none; }
}
