/* Legibilidad del blanco sobre renders (misma receta que merry.es, 11-nov-2026).
   Sombra MINIMA y difusa: despega logo y textos de la imagen sin leerse como sombra.
   Solo donde hay texto claro encima de una foto; en zonas de fondo liso no aplica. */
:root{
  --ts:0 1px 3px rgba(0,0,0,.18),0 2px 22px rgba(0,0,0,.22);
  --ds:drop-shadow(0 1px 2px rgba(0,0,0,.2)) drop-shadow(0 2px 14px rgba(0,0,0,.18));
}

/* Cabecera mientras va sobre la portada (A, I) y la de las propuestas a pantalla completa (C, Cine B) */
.v-a .top:not(.solid),.v-i .top:not(.solid){background-image:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,0))}
.v-a .top:not(.solid) .brand svg,.v-i .top:not(.solid) .brand svg,.v-c .top .brand svg,.v-cine-b .top .brand svg{filter:var(--ds)}
.v-a .top:not(.solid) .nav,.v-i .top:not(.solid) .nav,.v-c .top .nav,.v-cine-b .top .nav{text-shadow:var(--ts)}

/* Logos grandes y textos sobre imagen */
.intro-logo svg{filter:var(--ds)}
.hero-in,.dn-tag,                         /* A */
.r-hero-in,.cs-lead figcaption,           /* I */
.scene .intro-in,.scene .sc-in,           /* C, Cine B */
.ap-meta,                                 /* F */
.tile span{text-shadow:var(--ts)}         /* G */

/* Tamaños de menú y frases de portada (David, 11-nov: "se ven muy pequeños"). Pisa a cada propuesta. */
.top .nav{font-size:clamp(14px,1.1vw,17px)}
.scene .intro-in p{font-size:clamp(18px,1.7vw,26px);line-height:1.4;max-width:34ch}
/* «Empezar» / «Proyectos» de la portada, encapsulado (David, 11-nov). Sin flechas en ninguna propuesta. */
.scene .down{font-size:clamp(13px,1vw,15px);padding:13px 26px;border:1px solid rgba(245,239,230,.7);border-radius:999px;
  background:rgba(14,11,8,.28);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);text-shadow:none;transition:background .25s,color .25s}
.scene .down:hover{background:#f5efe6;color:#14110e}
.hero-foot{font-size:clamp(13px,1vw,15px)}
.hz-intro p{font-size:clamp(18px,1.7vw,25px)}
.f-sub{font-size:clamp(19px,1.9vw,27px)}
.h-meta{font-size:14px}
.f-hint,.hz-hint{font-size:clamp(13px,1vw,15px)}

/* Portada que rota (B, D, H, I; ver rota() y comun.js): la primera marca el tamaño, el resto encima */
.rota{position:relative}
.rota>img{transition:opacity 1.4s ease}
.rota>img:first-child{height:auto}  /* el atributo height pisaba el aspect-ratio de B y H (salia de 1170 px) */
.rota>img:not(:first-child){position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rota>img:not(.on){opacity:0}
.dh-img .rota,.r-hero .rota{position:absolute;inset:0}

/* Volver al selector de propuestas (solo mientras Paco elige; se borra con las demás) */
.pl-cat{position:fixed;left:16px;bottom:16px;z-index:90;padding:9px 14px;border-radius:999px;
  font:500 11px/1 system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
  color:#f5efe6;background:rgba(20,16,12,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(245,239,230,.18);transition:background .2s}
.pl-cat:hover{background:rgba(20,16,12,.85)}
/* Fotos de portada un 6 % mas oscuras: solo en C (no se toca). En las demas, fuera (David, 12-nov: menos ahumado) */
.v-c .scene .bg{filter:brightness(.94)}