/* =============================================================
   ESTILOS DE PÁGINA (15 nuevos)
   Minimal · Vidrio · Degradado · Neón · Brutalista · Editorial ·
   Bento · Lujo · Orgánico · Retro 70 · Pop · Tech · Pastel ·
   Corporativo · Noir
   Primero va lo que comparten; después, lo propio de cada uno.
   Cada estilo ajusta estas variables:
   --r (radio de tarjetas), --bt (borde), --st (sombra), --btn-r (radio de botones)
   ============================================================= */

:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) { --r: 14px; --bt: 1px solid var(--linea); --st: none; --btn-r: 999px; --hero-bg: var(--fondo); }

/* ---- Tarjetas, botones y entrada: todos usan las variables ---- */
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .btn { border-radius: var(--btn-r); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .tile, .caja, .foto) { border-radius: var(--r); border: var(--bt); box-shadow: var(--st); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .plan.destacado { border-color: transparent; }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .obra { border-radius: var(--r); overflow: hidden; border: var(--bt); box-shadow: var(--st); background: var(--papel); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .obra .afiche, :is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .obra .talon { border-radius: 0; }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .talon { border-top: var(--bt); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .talon::before, :is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .talon::after { display: none; }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada {
  background: var(--papel); color: var(--texto); border-radius: var(--r); border: var(--bt);
  box-shadow: var(--st), 0 30px 60px -30px rgba(0,0,0,.35); transform: none; animation-name: subir;
}
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) :is(.entrada-etq, .entrada .cia, .entrada dt, .entrada-detalle) { color: var(--suave); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada dl { border-top: 1px solid var(--linea); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada-talon { border-top: 1px solid var(--linea); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada-talon::before, :is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada-talon::after { display: none; }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada-talon .btn:not(.btn-mp) { background: var(--primario); color: var(--fondo); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada.recomendado .plato-tags span { color: var(--texto); background: color-mix(in srgb, var(--texto) 8%, transparent); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada.recomendado .entrada-foto { border-radius: calc(var(--r) * .6); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .item-media .chip, :is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .afiche .chip { border-radius: var(--btn-r); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .filtros { border-radius: var(--btn-r); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .filtros button { border-radius: var(--btn-r); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .mapa { border-radius: var(--r); border: var(--bt); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .pie { background: color-mix(in srgb, var(--texto) 94%, var(--primario)); color: var(--fondo); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="degradado"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="retro"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .pie-legal { border-top-color: color-mix(in srgb, var(--fondo) 15%, transparent); }

/* ---- Portada clara (fondo de la página) ---- */
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"]) .escenario { background: var(--hero-bg); color: var(--texto); border-bottom: 1px solid var(--linea); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"]) .escenario::before, :is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"]) .escenario::after { background: none; -webkit-mask: none; mask: none; }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"]) .cabecera { color: var(--texto); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"]) .cabecera:not(.solida) .btn-chico { background: var(--primario); color: var(--fondo); }
:is([data-estilo="minimal"],[data-estilo="vidrio"],[data-estilo="neon"],[data-estilo="brutalista"],[data-estilo="editorial"],[data-estilo="bento"],[data-estilo="lujo"],[data-estilo="organico"],[data-estilo="pop"],[data-estilo="tech"],[data-estilo="pastel"],[data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"]) .lema { color: var(--suave); }

/* ---- Portada de color (principal) ---- */
:is([data-estilo="degradado"],[data-estilo="retro"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="tipografico"]) .escenario { background: var(--hero-bg); color: var(--fondo); border-bottom: 0; }
:is([data-estilo="degradado"],[data-estilo="retro"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="tipografico"]) .escenario::before, :is([data-estilo="degradado"],[data-estilo="retro"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="tipografico"]) .escenario::after { background: none; -webkit-mask: none; mask: none; }
:is([data-estilo="degradado"],[data-estilo="retro"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="tipografico"]) .cabecera:not(.solida) { color: var(--fondo); }
:is([data-estilo="degradado"],[data-estilo="retro"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="tipografico"]) .cabecera:not(.solida) .btn-chico { background: var(--fondo); color: var(--texto); }
:is([data-estilo="degradado"],[data-estilo="retro"],[data-estilo="corporativo"],[data-estilo="noir"],[data-estilo="tipografico"]) .lema { color: color-mix(in srgb, var(--fondo) 82%, transparent); }

/* =============================================================
   1. MINIMAL — blanco, mucho aire y líneas finas
   ============================================================= */
[data-estilo="minimal"] { --r: 0; --bt: 0; --btn-r: 0; }
[data-estilo="minimal"] .escenario-in { min-height: min(86vh, 800px); align-items: end; }
[data-estilo="minimal"] .hero-texto h1 { font-size: clamp(3.6rem, 11vw, 9.5rem); letter-spacing: -0.05em; line-height: .9; }
[data-estilo="minimal"] .btn { padding: .9rem 1.6rem; font-size: .88rem; letter-spacing: .02em; }
[data-estilo="minimal"] .btn-acento { background: var(--texto); color: var(--fondo); }
[data-estilo="minimal"] .entrada { border: 1px solid var(--texto); box-shadow: none; }
[data-estilo="minimal"] :is(.item, .carta-grupo, .plan, .testimonio, .obra) { background: transparent; border-top: 1px solid var(--texto); }
[data-estilo="minimal"] .item-cuerpo, [data-estilo="minimal"] .testimonio, [data-estilo="minimal"] .plan { padding-inline: 0; }
[data-estilo="minimal"] .plan.destacado { background: transparent; color: var(--texto); box-shadow: none; border-top: 4px solid var(--acento); }
[data-estilo="minimal"] .plan.destacado .btn:not(.btn-acento) { background: var(--texto); color: var(--fondo); }
[data-estilo="minimal"] .pregunta { background: transparent; border-bottom: 1px solid var(--linea); padding-inline: 0; }
[data-estilo="minimal"] .filtros { background: transparent; padding: 0; gap: 1.2rem; }
[data-estilo="minimal"] .filtros button { padding: .2rem 0; border-bottom: 1px solid transparent; }
[data-estilo="minimal"] .filtros button[aria-pressed="true"] { background: transparent; box-shadow: none; border-bottom-color: var(--texto); }
[data-estilo="minimal"] .sala, [data-estilo="minimal"] .numeros { background: var(--fondo); border-block: 1px solid var(--linea); }
[data-estilo="minimal"] .numero b { color: var(--texto); }

/* =============================================================
   2. VIDRIO — tarjetas translúcidas sobre un fondo de color
   ============================================================= */
[data-estilo="vidrio"] { --r: 22px; --bt: 1px solid color-mix(in srgb, #fff 45%, transparent); --st: 0 20px 50px -25px rgba(0,0,0,.35); --hero-bg: transparent; }
[data-estilo="vidrio"] body {
  background:
    radial-gradient(60vmax 60vmax at 0% 0%, color-mix(in srgb, var(--primario) 55%, transparent), transparent 60%),
    radial-gradient(50vmax 50vmax at 100% 30%, color-mix(in srgb, var(--acento) 55%, transparent), transparent 60%),
    radial-gradient(60vmax 60vmax at 30% 100%, color-mix(in srgb, var(--primario) 35%, var(--acento)), transparent 65%),
    var(--fondo);
  background-attachment: fixed;
}
[data-estilo="vidrio"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra, .entrada, .numero, .sala-in, .visit-info, .filtros) {
  background: color-mix(in srgb, var(--fondo) 55%, transparent);
  -webkit-backdrop-filter: blur(18px) saturate(1.5); backdrop-filter: blur(18px) saturate(1.5);
}
[data-estilo="vidrio"] .numero { border-radius: var(--r); border: var(--bt); padding: 1.5rem 1rem; }
[data-estilo="vidrio"] .sala, [data-estilo="vidrio"] .numeros { background: transparent; }
[data-estilo="vidrio"] .sala-in { border-radius: 28px; border: var(--bt); margin-block: 2rem; }
[data-estilo="vidrio"] .visit-info { border-radius: var(--r); border: var(--bt); padding: 2rem; }
[data-estilo="vidrio"] .escenario { border-bottom: 0; }
[data-estilo="vidrio"] .hero-texto h1 { font-size: clamp(3.4rem, 9vw, 7.6rem); letter-spacing: -0.04em; }
[data-estilo="vidrio"] .talon { background: transparent; }
[data-estilo="vidrio"] .plan.destacado { background: color-mix(in srgb, var(--primario) 85%, transparent); }

/* =============================================================
   3. DEGRADADO — malla de colores en movimiento
   ============================================================= */
[data-estilo="degradado"] { --r: 22px; --bt: 0; --st: 0 24px 50px -30px color-mix(in srgb, var(--primario) 70%, #000); --hero-bg: var(--primario); }
[data-estilo="degradado"] .escenario {
  background:
    radial-gradient(40% 60% at 15% 20%, var(--acento), transparent 70%),
    radial-gradient(45% 55% at 85% 30%, color-mix(in srgb, var(--primario) 60%, #ff4fa3), transparent 70%),
    radial-gradient(60% 70% at 50% 100%, color-mix(in srgb, var(--acento) 40%, var(--primario)), transparent 70%),
    var(--primario);
  background-size: 160% 160%; animation: malla 16s ease-in-out infinite alternate; color: #fff;
}
@keyframes malla { 0% { background-position: 0% 0%; } 100% { background-position: 100% 100%; } }
[data-estilo="degradado"] .cabecera:not(.solida) { color: #fff; }
[data-estilo="degradado"] .lema { color: rgba(255,255,255,.88); }
[data-estilo="degradado"] .hero-texto h1 { font-size: clamp(3.2rem, 9vw, 7.4rem); letter-spacing: -0.04em; line-height: .92; text-shadow: 0 2px 30px rgba(0,0,0,.18); }
[data-estilo="degradado"] .btn { background: linear-gradient(120deg, var(--primario), color-mix(in srgb, var(--acento) 55%, var(--primario))); color: #fff; }
[data-estilo="degradado"] .escenario .btn:not(.btn-linea), [data-estilo="degradado"] .cabecera:not(.solida) .btn-chico { background: #fff; color: var(--primario); }
[data-estilo="degradado"] .btn-linea { background: transparent; }
[data-estilo="degradado"] h2 { background: linear-gradient(100deg, var(--primario), color-mix(in srgb, var(--acento) 60%, var(--primario))); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: .08em; }
[data-estilo="degradado"] .plan.destacado { background: linear-gradient(150deg, var(--primario), color-mix(in srgb, var(--acento) 50%, var(--primario))); color: #fff; }
[data-estilo="degradado"] .numeros { background: linear-gradient(120deg, color-mix(in srgb, var(--primario) 10%, var(--fondo)), color-mix(in srgb, var(--acento) 15%, var(--fondo))); }
[data-estilo="degradado"] .ph.v0, [data-estilo="degradado"] .ph.v2 { background: linear-gradient(135deg, var(--primario), var(--acento)); }

/* =============================================================
   4. NEÓN — fondo oscuro y bordes que brillan
   ============================================================= */
[data-estilo="neon"] { --r: 10px; --bt: 1px solid color-mix(in srgb, var(--primario) 40%, transparent); --brillo: 0 0 24px color-mix(in srgb, var(--primario) 45%, transparent); }
[data-estilo="neon"] .escenario {
  background: radial-gradient(60% 80% at 80% 10%, color-mix(in srgb, var(--acento) 18%, transparent), transparent 70%),
    radial-gradient(50% 70% at 10% 90%, color-mix(in srgb, var(--primario) 14%, transparent), transparent 70%), var(--fondo);
}
[data-estilo="neon"] .hero-texto h1 { color: var(--primario); text-shadow: 0 0 18px color-mix(in srgb, var(--primario) 70%, transparent), 0 0 60px color-mix(in srgb, var(--primario) 40%, transparent); letter-spacing: -0.03em; }
[data-estilo="neon"] h2 { text-shadow: 0 0 22px color-mix(in srgb, var(--primario) 35%, transparent); }
[data-estilo="neon"] .btn { background: transparent; color: var(--primario); border: 1.5px solid var(--primario); box-shadow: var(--brillo), inset 0 0 12px color-mix(in srgb, var(--primario) 25%, transparent); }
[data-estilo="neon"] .btn:hover { background: var(--primario); color: var(--fondo); }
[data-estilo="neon"] .btn-acento { color: var(--acento); border-color: var(--acento); box-shadow: 0 0 24px color-mix(in srgb, var(--acento) 45%, transparent); }
[data-estilo="neon"] .cabecera:not(.solida) .btn-chico { background: transparent; color: var(--primario); }
[data-estilo="neon"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra, .entrada) { background: color-mix(in srgb, var(--fondo) 90%, var(--primario)); }
[data-estilo="neon"] :is(.item, .plan, .obra, .tile, .caja):hover { box-shadow: var(--brillo); border-color: var(--primario); }
[data-estilo="neon"] .plan.destacado { background: color-mix(in srgb, var(--fondo) 80%, var(--primario)); color: var(--texto); border: 1.5px solid var(--primario); box-shadow: var(--brillo); }
[data-estilo="neon"] .plan.destacado .btn:not(.btn-acento) { background: var(--primario); color: var(--fondo); }
[data-estilo="neon"] .entrada { box-shadow: var(--brillo); }
[data-estilo="neon"] .sala, [data-estilo="neon"] .numeros { background: color-mix(in srgb, var(--fondo) 94%, var(--primario)); }
[data-estilo="neon"] :is(.numero b, .plan-precio) { color: var(--primario); text-shadow: 0 0 16px color-mix(in srgb, var(--primario) 60%, transparent); }
[data-estilo="neon"] .pie { background: var(--fondo); color: var(--texto); border-top: var(--bt); }
[data-estilo="neon"] .mapa iframe { filter: invert(.9) hue-rotate(180deg) contrast(.9); }

/* =============================================================
   5. BRUTALISTA — letra de máquina, grilla y bloques
   ============================================================= */
[data-estilo="brutalista"] { --r: 0; --bt: 2px solid var(--texto); --st: 6px 6px 0 var(--texto); --btn-r: 0; --fuente-texto: var(--fuente-titulos); }
[data-estilo="brutalista"] body {
  background-image: linear-gradient(color-mix(in srgb, var(--texto) 7%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--texto) 7%, transparent) 1px, transparent 1px);
  background-size: 40px 40px; font-size: .98rem;
}
[data-estilo="brutalista"] :is(h1, h2, h3, .marca) { text-transform: uppercase; letter-spacing: -0.02em; }
[data-estilo="brutalista"] .escenario { background: transparent; border-bottom: var(--bt); }
[data-estilo="brutalista"] .hero-texto h1 { font-size: clamp(2.8rem, 8.5vw, 7rem); line-height: .95; }
[data-estilo="brutalista"] .hero-texto h1::after { content: "_"; color: var(--acento); }
[data-estilo="brutalista"] .lema { color: var(--texto); background: var(--acento); display: inline-block; padding: .2rem .6rem; }
[data-estilo="brutalista"] .btn { border: var(--bt); background: var(--texto); color: var(--fondo); text-transform: uppercase; font-size: .82rem; letter-spacing: .04em; box-shadow: 4px 4px 0 var(--acento); }
[data-estilo="brutalista"] .btn:hover { background: var(--acento); color: var(--texto); }
[data-estilo="brutalista"] :is(.btn-linea, .btn-acento) { background: var(--fondo); color: var(--texto); }
[data-estilo="brutalista"] .cabecera.solida { box-shadow: 0 2px 0 var(--texto); }
[data-estilo="brutalista"] .entrada { box-shadow: 10px 10px 0 var(--texto); }
[data-estilo="brutalista"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra) { background: var(--fondo); }
[data-estilo="brutalista"] .plan.destacado { background: var(--acento); color: var(--texto); border: var(--bt); box-shadow: var(--st); }
[data-estilo="brutalista"] .plan-badge { border-radius: 0; background: var(--texto); color: var(--fondo); }
[data-estilo="brutalista"] .filtros { background: transparent; border: var(--bt); padding: 0; gap: 0; }
[data-estilo="brutalista"] .filtros button { text-transform: uppercase; font-size: .78rem; }
[data-estilo="brutalista"] .filtros button + button { border-left: var(--bt); }
[data-estilo="brutalista"] .filtros button[aria-pressed="true"] { background: var(--texto); color: var(--fondo); box-shadow: none; }
[data-estilo="brutalista"] .sala, [data-estilo="brutalista"] .numeros { background: var(--acento); border-block: var(--bt); --suave: var(--texto); }
[data-estilo="brutalista"] .sala-der p { color: var(--texto); }
[data-estilo="brutalista"] .numero b { color: var(--texto); }
[data-estilo="brutalista"] :is(.tile-info, .caja-info) { background: var(--texto); color: var(--fondo); padding: .9rem 1rem; }

/* =============================================================
   6. EDITORIAL — como una revista
   ============================================================= */
[data-estilo="editorial"] { --r: 0; --bt: 0; --btn-r: 0; }
[data-estilo="editorial"] .escenario { border-bottom: 3px double var(--texto); }
[data-estilo="editorial"] .escenario-in { grid-template-columns: minmax(0, 1.7fr) minmax(280px, .8fr); }
[data-estilo="editorial"] .hero-texto { border-top: 6px solid var(--texto); padding-top: 1.4rem; }
[data-estilo="editorial"] .hero-texto h1 { font-size: clamp(3.4rem, 10vw, 8.6rem); line-height: .9; letter-spacing: -0.03em; }
[data-estilo="editorial"] .lema { font-family: var(--fuente-titulos); font-style: italic; font-size: clamp(1.3rem, 2vw, 1.7rem); color: var(--texto); }
[data-estilo="editorial"] .btn { text-transform: uppercase; letter-spacing: .14em; font-size: .74rem; padding: 1rem 1.5rem; }
[data-estilo="editorial"] .btn-acento { background: var(--texto); color: var(--fondo); }
[data-estilo="editorial"] .entrada { border-top: 6px solid var(--texto); box-shadow: none; background: transparent; }
[data-estilo="editorial"] .bloque-cab { border-bottom: 1px solid var(--texto); padding-bottom: 1.2rem; }
[data-estilo="editorial"] h2 { font-style: italic; }
[data-estilo="editorial"] :is(.item, .carta-grupo, .plan, .testimonio, .obra) { background: transparent; border-top: 2px solid var(--texto); }
[data-estilo="editorial"] :is(.item-cuerpo, .plan, .testimonio) { padding-inline: 0; }
[data-estilo="editorial"] .plan.destacado { background: transparent; color: var(--texto); box-shadow: none; border-top: 6px solid var(--acento); }
[data-estilo="editorial"] .plan.destacado .btn:not(.btn-acento) { background: var(--texto); color: var(--fondo); }
[data-estilo="editorial"] .testimonio blockquote { font-family: var(--fuente-titulos); font-style: italic; font-size: 1.35rem; line-height: 1.35; }
[data-estilo="editorial"] .cita::first-letter { float: left; font-size: 3.3em; line-height: .8; padding: .08em .1em 0 0; color: var(--acento); }
[data-estilo="editorial"] .sala, [data-estilo="editorial"] .numeros { background: var(--fondo); border-block: 1px solid var(--texto); }
[data-estilo="editorial"] .numero { border-left: 1px solid var(--linea); }
[data-estilo="editorial"] .numero b { color: var(--texto); font-style: italic; }
[data-estilo="editorial"] .pregunta { background: transparent; border-bottom: 1px solid var(--texto); padding-inline: 0; }
[data-estilo="editorial"] .filtros { background: transparent; padding: 0; gap: 1.2rem; }
[data-estilo="editorial"] .filtros button { font-family: var(--fuente-titulos); font-style: italic; font-size: 1.1rem; padding: .2rem 0; }
[data-estilo="editorial"] .filtros button[aria-pressed="true"] { background: transparent; box-shadow: none; text-decoration: underline; text-underline-offset: 5px; }

/* =============================================================
   7. BENTO — todo en cajas redondeadas
   ============================================================= */
[data-estilo="bento"] { --r: 26px; --bt: 0; }
[data-estilo="bento"] .escenario { border-bottom: 0; }
[data-estilo="bento"] .escenario-in { gap: 1rem; align-items: stretch; padding-bottom: 2.5rem; min-height: min(84vh, 760px); }
[data-estilo="bento"] .hero-texto { background: var(--primario); color: var(--fondo); border-radius: 32px; padding: clamp(2rem, 4vw, 3.5rem); display: flex; flex-direction: column; justify-content: flex-end; }
[data-estilo="bento"] .hero-texto .lema { color: color-mix(in srgb, var(--fondo) 80%, transparent); }
[data-estilo="bento"] .hero-texto h1 { font-size: clamp(3rem, 7.5vw, 6.4rem); letter-spacing: -0.04em; }
[data-estilo="bento"] .hero-texto .btn-acento { background: var(--fondo); color: var(--primario); }
[data-estilo="bento"] .entrada { border-radius: 32px; display: flex; flex-direction: column; justify-content: space-between; box-shadow: none; background: color-mix(in srgb, var(--acento) 30%, var(--papel)); }
[data-estilo="bento"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra) { background: var(--papel-2); }
[data-estilo="bento"] .numeros { background: transparent; }
[data-estilo="bento"] .numero { background: var(--papel-2); border-radius: var(--r); padding: 1.8rem 1rem; }
[data-estilo="bento"] .numero:nth-child(2) { background: var(--primario); --suave: color-mix(in srgb, var(--fondo) 80%, transparent); }
[data-estilo="bento"] .numero:nth-child(2) b { color: var(--fondo); }
[data-estilo="bento"] .sala { background: transparent; }
[data-estilo="bento"] .sala-in { background: var(--papel-2); border-radius: 32px; margin-block: 1rem; }
[data-estilo="bento"] .mapa { border-radius: 32px; }

/* =============================================================
   8. LUJO — negro, dorado y serif fina
   ============================================================= */
[data-estilo="lujo"] { --r: 0; --bt: 1px solid color-mix(in srgb, var(--primario) 35%, transparent); --btn-r: 0; }
[data-estilo="lujo"] .escenario { background: radial-gradient(70% 90% at 50% 0%, color-mix(in srgb, var(--primario) 14%, transparent), transparent 70%), var(--fondo); text-align: center; }
[data-estilo="lujo"] .escenario::before { inset: calc(var(--cab-alto, 90px) + 14px) 1.5rem 1.5rem; border: 1px solid color-mix(in srgb, var(--primario) 40%, transparent); }
[data-estilo="lujo"] .escenario-in { grid-template-columns: 1fr; justify-items: center; align-items: center; }
[data-estilo="lujo"] .hero-texto { display: grid; justify-items: center; }
[data-estilo="lujo"] .hero-texto::before { content: ""; width: 1px; height: 60px; background: var(--primario); margin-bottom: 1.8rem; }
[data-estilo="lujo"] .hero-texto h1 { font-size: clamp(3.4rem, 9vw, 8rem); letter-spacing: .02em; line-height: .95; font-weight: 500; }
[data-estilo="lujo"] .lema { margin-inline: auto; text-transform: uppercase; letter-spacing: .3em; font-size: .8rem; color: var(--primario); }
[data-estilo="lujo"] .hero-acciones { justify-content: center; }
[data-estilo="lujo"] .entrada { max-width: 460px; width: 100%; text-align: left; background: transparent; box-shadow: none; }
[data-estilo="lujo"] .btn { background: transparent; color: var(--primario); border: 1px solid var(--primario); text-transform: uppercase; letter-spacing: .22em; font-size: .72rem; font-weight: 500; padding: 1.05rem 1.9rem; }
[data-estilo="lujo"] .btn:hover { background: var(--primario); color: var(--fondo); }
[data-estilo="lujo"] .btn-acento, [data-estilo="lujo"] .entrada-talon .btn:not(.btn-mp) { background: var(--primario); color: var(--fondo); }
[data-estilo="lujo"] .cabecera:not(.solida) .btn-chico { background: transparent; color: var(--primario); border-color: var(--primario); }
[data-estilo="lujo"] h2 { font-weight: 500; letter-spacing: .01em; }
[data-estilo="lujo"] .bloque-cab { flex-direction: column; align-items: center; text-align: center; }
[data-estilo="lujo"] .bloque-cab h2::after { content: ""; display: block; width: 60px; height: 1px; background: var(--primario); margin: 1.2rem auto 0; }
[data-estilo="lujo"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra) { background: transparent; }
[data-estilo="lujo"] .plan.destacado { background: color-mix(in srgb, var(--primario) 10%, transparent); color: var(--texto); border: 1px solid var(--primario); box-shadow: none; }
[data-estilo="lujo"] .plan-badge { border-radius: 0; background: var(--primario); color: var(--fondo); letter-spacing: .15em; text-transform: uppercase; }
[data-estilo="lujo"] :is(.plan-precio, .numero b, .precio, .plato-precio) { color: var(--primario); }
[data-estilo="lujo"] .sala, [data-estilo="lujo"] .numeros { background: color-mix(in srgb, var(--fondo) 92%, var(--primario)); }
[data-estilo="lujo"] .filtros { background: transparent; padding: 0; gap: 1.5rem; }
[data-estilo="lujo"] .filtros button { text-transform: uppercase; letter-spacing: .18em; font-size: .72rem; padding: .3rem 0; border-bottom: 1px solid transparent; }
[data-estilo="lujo"] .filtros button[aria-pressed="true"] { background: transparent; box-shadow: none; color: var(--primario); border-bottom-color: var(--primario); }
[data-estilo="lujo"] .pie { background: var(--fondo); color: var(--texto); border-top: var(--bt); }
[data-estilo="lujo"] .mapa iframe { filter: grayscale(1) invert(.88) contrast(.9); }

/* =============================================================
   9. ORGÁNICO — formas suaves y tonos naturales
   ============================================================= */
[data-estilo="organico"] { --r: 34px; --bt: 0; --st: 0 18px 40px -28px color-mix(in srgb, var(--primario) 60%, #000); --hero-bg: color-mix(in srgb, var(--primario) 10%, var(--fondo)); }
[data-estilo="organico"] .escenario { border-bottom: 0; border-radius: 0 0 60px 60px; overflow: hidden; }
[data-estilo="organico"] .escenario::before {
  inset: auto -10% -30% auto; width: 60vmax; height: 60vmax; background: color-mix(in srgb, var(--acento) 45%, transparent);
  border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; animation: blob 18s ease-in-out infinite alternate;
}
[data-estilo="organico"] .escenario::after {
  inset: -20% auto auto -15%; width: 45vmax; height: 45vmax; background: color-mix(in srgb, var(--primario) 22%, transparent);
  border-radius: 61% 39% 44% 56% / 53% 61% 39% 47%; animation: blob 22s ease-in-out infinite alternate-reverse;
}
@keyframes blob { 50% { border-radius: 38% 62% 45% 55% / 60% 35% 65% 40%; transform: rotate(20deg) scale(1.08); } 100% { border-radius: 55% 45% 60% 40% / 45% 58% 42% 55%; transform: rotate(-10deg); } }
[data-estilo="organico"] .hero-texto h1 { font-size: clamp(3.2rem, 8.5vw, 7rem); letter-spacing: -0.03em; }
[data-estilo="organico"] .entrada { border-radius: 40px; }
[data-estilo="organico"] .item { padding: .6rem; }
[data-estilo="organico"] .item-media { border-radius: 28px; }
[data-estilo="organico"] .sala { background: color-mix(in srgb, var(--acento) 18%, var(--fondo)); border-radius: 60px; margin: 0 clamp(.5rem, 2vw, 1.5rem); }
[data-estilo="organico"] .numeros { background: transparent; }
[data-estilo="organico"] .numero { background: var(--papel); border-radius: 999px; padding: 1.6rem 1rem; box-shadow: var(--st); }
[data-estilo="organico"] :is(.persona img, .persona-ph) { border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; }
[data-estilo="organico"] .pie { border-radius: 60px 60px 0 0; }

/* =============================================================
   10. RETRO 70 — colores cálidos, rayas y letras redondas
   ============================================================= */
[data-estilo="retro"] { --r: 24px; --bt: 2.5px solid var(--texto); --st: 5px 5px 0 var(--texto); --hero-bg: var(--primario); }
[data-estilo="retro"] .escenario::before {
  inset: auto -8% -45% auto; width: 75vmax; height: 75vmax; border-radius: 50%;
  background: repeating-radial-gradient(circle, var(--acento) 0 34px, var(--fondo) 34px 68px, color-mix(in srgb, var(--acento) 55%, var(--primario)) 68px 102px, color-mix(in srgb, var(--primario) 70%, #000) 102px 136px);
  -webkit-mask: radial-gradient(circle, #000 64%, transparent 64.5%); mask: radial-gradient(circle, #000 64%, transparent 64.5%);
  opacity: .9;
}
[data-estilo="retro"] .hero-texto h1 { font-size: clamp(3.2rem, 9vw, 7.6rem); line-height: .9; letter-spacing: -0.02em; text-shadow: 4px 4px 0 color-mix(in srgb, var(--primario) 60%, #000); }
[data-estilo="retro"] .btn { border: 2.5px solid var(--texto); box-shadow: 4px 4px 0 var(--texto); font-weight: 700; }
[data-estilo="retro"] .btn:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0 var(--texto); }
[data-estilo="retro"] .escenario .btn-linea { background: var(--fondo); color: var(--texto); }
[data-estilo="retro"] .entrada { box-shadow: 8px 8px 0 var(--texto); }
[data-estilo="retro"] .plan.destacado { background: var(--acento); color: var(--texto); border: var(--bt); box-shadow: var(--st); }
[data-estilo="retro"] .sala { background: var(--acento); border-block: var(--bt); --suave: color-mix(in srgb, var(--texto) 80%, var(--acento)); }
[data-estilo="retro"] .sala-der p { color: var(--texto); }
[data-estilo="retro"] .numeros { background: repeating-linear-gradient(-45deg, color-mix(in srgb, var(--acento) 25%, var(--fondo)) 0 18px, var(--fondo) 18px 36px); border-block: var(--bt); }
[data-estilo="retro"] .numero b { color: var(--primario); text-shadow: 3px 3px 0 var(--acento); }

/* =============================================================
   11. POP — colores saturados y formas geométricas
   ============================================================= */
[data-estilo="pop"] { --r: 20px; --bt: 3px solid var(--texto); --st: 6px 6px 0 var(--primario); --hero-bg: color-mix(in srgb, var(--acento) 45%, var(--fondo)); }
[data-estilo="pop"] .escenario::before {
  background:
    radial-gradient(circle at 85% 22%, var(--primario) 0 9%, transparent 9.3%),
    radial-gradient(circle at 70% 78%, transparent 0 7%, var(--texto) 7.2% 8.2%, transparent 8.4%),
    conic-gradient(from 45deg at 92% 70%, var(--primario) 0 25%, transparent 0),
    radial-gradient(circle, color-mix(in srgb, var(--texto) 30%, transparent) 2px, transparent 2.5px) 0 0 / 22px 22px;
  -webkit-mask: linear-gradient(90deg, transparent 40%, #000 70%); mask: linear-gradient(90deg, transparent 40%, #000 70%);
}
[data-estilo="pop"] .hero-texto h1 { font-size: clamp(3rem, 8.5vw, 7rem); line-height: .95; letter-spacing: -0.03em; }
[data-estilo="pop"] .hero-texto h1::after { content: ""; display: block; width: 120px; height: 14px; margin-top: 1rem; background: var(--primario); border-radius: 99px; }
[data-estilo="pop"] .btn { border: 3px solid var(--texto); box-shadow: 4px 4px 0 var(--texto); font-weight: 800; }
[data-estilo="pop"] .btn-acento { background: var(--primario); color: #fff; }
[data-estilo="pop"] .btn:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--texto); }
[data-estilo="pop"] .entrada { transform: rotate(-2deg); box-shadow: 10px 10px 0 var(--primario); }
[data-estilo="pop"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra):nth-child(3n + 2) { --st: 6px 6px 0 var(--acento); }
[data-estilo="pop"] .plan.destacado { background: var(--primario); color: #fff; border: var(--bt); box-shadow: 6px 6px 0 var(--texto); }
[data-estilo="pop"] .sala { background: var(--primario); color: #fff; --suave: rgba(255,255,255,.85); --linea: rgba(255,255,255,.3); }
[data-estilo="pop"] .sala-der p { color: #fff; }
[data-estilo="pop"] .numeros { background: var(--acento); border-block: var(--bt); --suave: var(--texto); }
[data-estilo="pop"] .numero b { color: var(--texto); }

/* =============================================================
   12. TECH — grilla, letra técnica y acentos luminosos
   ============================================================= */
[data-estilo="tech"] { --r: 8px; --bt: 1px solid color-mix(in srgb, var(--primario) 25%, var(--linea)); --btn-r: 8px; }
[data-estilo="tech"] .escenario {
  background-image: linear-gradient(color-mix(in srgb, var(--primario) 10%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--primario) 10%, transparent) 1px, transparent 1px),
    radial-gradient(60% 60% at 70% 20%, color-mix(in srgb, var(--primario) 18%, transparent), transparent 70%);
  background-size: 48px 48px, 48px 48px, auto; background-color: var(--fondo);
}
[data-estilo="tech"] .hero-texto h1 { font-size: clamp(3rem, 8vw, 6.6rem); letter-spacing: -0.04em; }
[data-estilo="tech"] .hero-texto::before { content: "● Online"; display: inline-block; font-family: 'Space Mono', ui-monospace, monospace; font-size: .78rem; color: var(--primario); border: 1px solid color-mix(in srgb, var(--primario) 45%, transparent); padding: .3rem .7rem; border-radius: 6px; margin-bottom: 1.4rem; }
[data-estilo="tech"] .btn { font-family: 'Space Mono', ui-monospace, monospace; font-size: .82rem; }
[data-estilo="tech"] .btn-acento { background: var(--primario); color: var(--fondo); box-shadow: 0 0 30px color-mix(in srgb, var(--primario) 40%, transparent); }
[data-estilo="tech"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra, .entrada) { background: color-mix(in srgb, var(--fondo) 94%, var(--primario)); position: relative; }
[data-estilo="tech"] :is(.item, .plan, .testimonio)::after { content: ""; position: absolute; top: -1px; right: -1px; width: 14px; height: 14px; border-top: 2px solid var(--primario); border-right: 2px solid var(--primario); border-radius: 0 var(--r) 0 0; pointer-events: none; }
[data-estilo="tech"] .plan.destacado { background: color-mix(in srgb, var(--fondo) 84%, var(--primario)); color: var(--texto); border: 1px solid var(--primario); }
[data-estilo="tech"] .plan.destacado .btn:not(.btn-acento) { background: var(--primario); color: var(--fondo); }
[data-estilo="tech"] :is(.plan-precio, .numero b) { color: var(--primario); font-variant-numeric: tabular-nums; }
[data-estilo="tech"] :is(.plan-cat, .tile-cat, .entrada-etq, .item-detalle) { font-family: 'Space Mono', ui-monospace, monospace; }
[data-estilo="tech"] .sala, [data-estilo="tech"] .numeros { background: color-mix(in srgb, var(--fondo) 95%, var(--primario)); border-block: var(--bt); }
[data-estilo="tech"] .pie { background: var(--fondo); color: var(--texto); border-top: var(--bt); }

/* =============================================================
   13. PASTEL — tonos suaves y redondeado
   ============================================================= */
[data-estilo="pastel"] { --r: 28px; --bt: 0; --st: 0 14px 34px -20px color-mix(in srgb, var(--primario) 45%, transparent); --hero-bg: linear-gradient(160deg, color-mix(in srgb, var(--acento) 45%, var(--fondo)), color-mix(in srgb, var(--primario) 14%, var(--fondo))); }
[data-estilo="pastel"] .escenario { border-bottom: 0; }
[data-estilo="pastel"] .escenario::before { inset: 15% 5% auto auto; width: 34vmax; height: 34vmax; border-radius: 50%; background: color-mix(in srgb, var(--fondo) 50%, transparent); }
[data-estilo="pastel"] .hero-texto h1 { font-size: clamp(3rem, 8vw, 6.6rem); letter-spacing: -0.03em; }
[data-estilo="pastel"] .btn { padding: .95rem 1.7rem; }
[data-estilo="pastel"] .btn-acento { background: var(--primario); color: var(--fondo); }
[data-estilo="pastel"] .entrada { border-radius: 32px; }
[data-estilo="pastel"] .item-media { border-radius: 22px; margin: .6rem .6rem 0; }
[data-estilo="pastel"] .plan.destacado { background: var(--primario); }
[data-estilo="pastel"] .sala { background: color-mix(in srgb, var(--acento) 22%, var(--fondo)); }
[data-estilo="pastel"] .numeros { background: color-mix(in srgb, var(--primario) 8%, var(--fondo)); }

/* =============================================================
   14. CORPORATIVO — sobrio, ordenado y confiable
   ============================================================= */
[data-estilo="corporativo"] { --r: 12px; --bt: 1px solid var(--linea); --st: 0 1px 2px rgba(0,0,0,.05), 0 8px 24px -16px rgba(0,0,0,.18); --btn-r: 8px; --hero-bg: var(--primario); }
[data-estilo="corporativo"] .escenario { background: linear-gradient(115deg, var(--primario) 58%, color-mix(in srgb, var(--primario) 82%, #fff) 58.1%); }
[data-estilo="corporativo"] .escenario-in { min-height: min(80vh, 720px); align-items: center; }
[data-estilo="corporativo"] .hero-texto h1 { font-size: clamp(2.8rem, 6.5vw, 5.4rem); line-height: 1; letter-spacing: -0.03em; }
[data-estilo="corporativo"] .btn { font-size: .92rem; }
[data-estilo="corporativo"] .btn-acento { background: var(--acento); color: #0d1b2a; }
[data-estilo="corporativo"] .entrada { box-shadow: 0 30px 60px -25px rgba(0,0,0,.45); }
[data-estilo="corporativo"] .bloque-cab h2 { font-size: clamp(2.2rem, 4.5vw, 3.4rem); }
[data-estilo="corporativo"] .bloque-cab h2::before { content: ""; display: block; width: 44px; height: 4px; border-radius: 4px; background: var(--acento); margin-bottom: 1rem; }
[data-estilo="corporativo"] .filtros { border-radius: 10px; }
[data-estilo="corporativo"] .filtros button { border-radius: 8px; }
[data-estilo="corporativo"] .numeros { background: var(--primario); --suave: color-mix(in srgb, var(--fondo) 80%, transparent); }
[data-estilo="corporativo"] .numero b { color: var(--fondo); }

/* =============================================================
   15. NOIR — alto contraste y fotos en blanco y negro
   ============================================================= */
[data-estilo="noir"] { --r: 0; --bt: 1px solid color-mix(in srgb, var(--texto) 25%, transparent); --btn-r: 0; --hero-bg: #0c0c0c; }
[data-estilo="noir"] .escenario { color: #f4f1ea; background: radial-gradient(50% 70% at 75% 30%, rgba(255,255,255,.1), transparent 70%), #0c0c0c; }
[data-estilo="noir"] .cabecera:not(.solida) { color: #f4f1ea; }
[data-estilo="noir"] .cabecera:not(.solida) .btn-chico { background: #f4f1ea; color: #0c0c0c; }
[data-estilo="noir"] .lema { color: rgba(244,241,234,.75); }
[data-estilo="noir"] .hero-texto h1 { font-size: clamp(3.6rem, 11vw, 9.4rem); line-height: .86; letter-spacing: -0.04em; text-transform: uppercase; }
[data-estilo="noir"] .hero-texto h1::after { content: ""; display: block; width: 90px; height: 6px; background: var(--acento); margin-top: 1.2rem; }
[data-estilo="noir"] .escenario .btn-acento { background: #f4f1ea; color: #0c0c0c; }
[data-estilo="noir"] .escenario .btn-linea { color: #f4f1ea; }
[data-estilo="noir"] .btn { text-transform: uppercase; letter-spacing: .1em; font-size: .78rem; }
[data-estilo="noir"] img { filter: grayscale(1) contrast(1.15); }
[data-estilo="noir"] :is(.ph.v0, .ph.v1, .ph.v2, .ph.v3) { background: linear-gradient(135deg, #1b1b1b, #3a3a3a); color: #f4f1ea; }
[data-estilo="noir"] h2 { text-transform: uppercase; letter-spacing: -0.02em; }
[data-estilo="noir"] :is(.item, .carta-grupo, .plan, .testimonio, .pregunta, .obra) { background: var(--fondo); }
[data-estilo="noir"] .plan.destacado { background: var(--texto); color: var(--fondo); }
[data-estilo="noir"] .plan-badge { border-radius: 0; }
[data-estilo="noir"] .sala, [data-estilo="noir"] .numeros { background: #0c0c0c; color: #f4f1ea; --suave: rgba(244,241,234,.7); --linea: rgba(244,241,234,.2); }
[data-estilo="noir"] .numero b { color: #f4f1ea; }
[data-estilo="noir"] .sala-der p { color: rgba(244,241,234,.85); }
[data-estilo="noir"] .pie { background: #0c0c0c; color: #f4f1ea; }
[data-estilo="noir"] .mapa iframe { filter: grayscale(1) contrast(1.1); }

/* ---------- Celular ---------- */
@media (max-width: 980px) {
  [data-estilo="editorial"] .escenario-in, [data-estilo="bento"] .escenario-in { grid-template-columns: 1fr; }
  [data-estilo="pop"] .entrada { transform: none; }
}
@media (max-width: 720px) {
  [data-estilo="organico"] .escenario { border-radius: 0 0 36px 36px; }
  [data-estilo="organico"] .sala { border-radius: 36px; }
  [data-estilo="corporativo"] .escenario { background: var(--primario); }
  [data-estilo="lujo"] .escenario::before { inset: calc(var(--cab-alto, 70px) + 6px) .6rem .6rem; }
}

/* Degradado con paletas oscuras: el color principal es claro, así que el texto va oscuro */
[data-tono="oscuro"][data-estilo="degradado"] .escenario,
[data-tono="oscuro"][data-estilo="degradado"] .cabecera:not(.solida) { color: var(--fondo); }
[data-tono="oscuro"][data-estilo="degradado"] .lema { color: color-mix(in srgb, var(--fondo) 85%, transparent); }
[data-tono="oscuro"][data-estilo="degradado"] .hero-texto h1 { text-shadow: none; }
[data-tono="oscuro"][data-estilo="degradado"] .btn,
[data-tono="oscuro"][data-estilo="degradado"] .plan.destacado { color: var(--fondo); }
[data-tono="oscuro"][data-estilo="degradado"] .escenario .btn:not(.btn-linea),
[data-tono="oscuro"][data-estilo="degradado"] .cabecera:not(.solida) .btn-chico { background: var(--fondo); color: var(--primario); }

/* =============================================================
   ESTILOS DE AUTOR (catálogo de Diseños)
   Suizo · Galería · Tradicional · Tipográfico
   Reglas comunes: sin degradados ni sombras; las imágenes que faltan
   se reemplazan por planos de color, no por manchas decorativas.
   ============================================================= */
:is([data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .ph.v0 { background: var(--primario); }
:is([data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .ph.v1 { background: color-mix(in srgb, var(--primario) 62%, var(--fondo)); }
:is([data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .ph.v2 { background: color-mix(in srgb, var(--texto) 82%, var(--fondo)); }
:is([data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .ph.v3 { background: color-mix(in srgb, var(--acento) 70%, var(--primario)); }
:is([data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .foto span { background: color-mix(in srgb, #000 55%, transparent); }
:is([data-estilo="suizo"],[data-estilo="galeria"],[data-estilo="tradicional"],[data-estilo="tipografico"]) .entrada { box-shadow: none; }

/* -------------------------------------------------------------
   SUIZO — estilo tipográfico internacional
   Grotesca pesada, alineación a la izquierda, secciones numeradas,
   reglas finas como estructura y un único color de señal.
   ------------------------------------------------------------- */
[data-estilo="suizo"] { --r: 0; --bt: 0; --btn-r: 0; }
[data-estilo="suizo"] main { counter-reset: seccion; }
[data-estilo="suizo"] .marca { font-weight: 800; letter-spacing: -0.03em; font-size: 1.35rem; }
[data-estilo="suizo"] .top nav a { font-size: .86rem; opacity: 1; }
[data-estilo="suizo"] .escenario-in { align-items: end; border-bottom: 1px solid var(--texto); }
[data-estilo="suizo"] .hero-texto h1 { font-size: clamp(3.8rem, 12vw, 10.5rem); line-height: .84; letter-spacing: -0.055em; }
[data-estilo="suizo"] .lema { color: var(--texto); font-size: clamp(1.05rem, 1.4vw, 1.2rem); max-width: 30ch; border-left: 3px solid var(--acento); padding-left: .9rem; }
[data-estilo="suizo"] .btn { font-size: .86rem; padding: .95rem 1.4rem; }
[data-estilo="suizo"] .btn-acento { background: var(--acento); color: var(--texto); }
[data-estilo="suizo"] .btn-linea { border: 1px solid currentColor; }
[data-estilo="suizo"] .entrada { border-top: 8px solid var(--acento); background: var(--fondo); }
[data-estilo="suizo"] main > section:not(#hero):not(.fuera) { counter-increment: seccion; }
[data-estilo="suizo"] .bloque-cab { border-top: 1px solid var(--texto); padding-top: 1.1rem; align-items: start; }
[data-estilo="suizo"] .bloque-cab h2, [data-estilo="suizo"] .visit-info > h2 { font-weight: 800; letter-spacing: -0.045em; font-size: clamp(2.4rem, 5.5vw, 4.4rem); }
[data-estilo="suizo"] .bloque-cab h2::before, [data-estilo="suizo"] .visit-info > h2::before { content: counter(seccion, decimal-leading-zero); display: block; font-family: var(--fuente-texto); font-size: .82rem; font-weight: 600; letter-spacing: 0; color: var(--acento); margin-bottom: .9rem; }
[data-estilo="suizo"] :is(.item, .carta-grupo, .plan, .testimonio, .obra) { background: transparent; border-top: 1px solid var(--texto); }
[data-estilo="suizo"] :is(.item-cuerpo, .plan, .testimonio) { padding-inline: 0; }
[data-estilo="suizo"] .item h3, [data-estilo="suizo"] .plan h3 { font-weight: 800; letter-spacing: -0.03em; }
[data-estilo="suizo"] .plan.destacado { background: var(--texto); color: var(--fondo); border-top-color: var(--acento); }
[data-estilo="suizo"] .plan.destacado .btn:not(.btn-acento) { background: var(--acento); color: var(--texto); }
[data-estilo="suizo"] .filtros { background: transparent; padding: 0; gap: 1.4rem; }
[data-estilo="suizo"] .filtros button { padding: .2rem 0; font-weight: 600; }
[data-estilo="suizo"] .filtros button[aria-pressed="true"] { background: transparent; box-shadow: none; color: var(--acento); }
[data-estilo="suizo"] .sala, [data-estilo="suizo"] .numeros { background: var(--fondo); }
[data-estilo="suizo"] .numeros-in { text-align: left; gap: 0; }
[data-estilo="suizo"] .numero { border-left: 1px solid var(--texto); padding-left: 1rem; }
[data-estilo="suizo"] .numero b { color: var(--texto); font-weight: 800; letter-spacing: -0.04em; }
[data-estilo="suizo"] .cita { font-weight: 800; letter-spacing: -0.035em; line-height: 1.02; }
[data-estilo="suizo"] .pregunta { background: transparent; border-top: 1px solid var(--texto); padding-inline: 0; }
[data-estilo="suizo"] .pie { background: var(--texto); color: var(--fondo); }
[data-estilo="suizo"] .pie-nombre { font-weight: 800; letter-spacing: -0.05em; }

/* -------------------------------------------------------------
   GALERÍA — sala de exposición
   Blanco cálido, letra chica, títulos medianos y livianos; las
   imágenes van sin marco y el texto acompaña como un rótulo.
   ------------------------------------------------------------- */
[data-estilo="galeria"] { --r: 0; --bt: 0; --btn-r: 0; }
[data-estilo="galeria"] body { font-size: .96rem; }
[data-estilo="galeria"] .marca { font-size: 1.45rem; letter-spacing: .01em; }
[data-estilo="galeria"] .top nav a { font-size: .8rem; text-transform: uppercase; letter-spacing: .14em; opacity: .75; }
[data-estilo="galeria"] .escenario-in { min-height: min(88vh, 820px); align-items: end; }
[data-estilo="galeria"] .hero-texto h1 { font-size: clamp(3rem, 8vw, 6.6rem); line-height: .95; letter-spacing: -0.02em; font-weight: 400; }
[data-estilo="galeria"] .lema { font-size: .82rem; text-transform: uppercase; letter-spacing: .16em; max-width: 46ch; line-height: 1.7; }
[data-estilo="galeria"] .btn { background: transparent; color: var(--texto); border: 0; border-bottom: 1px solid currentColor; padding: .45rem 0; font-size: .8rem; text-transform: uppercase; letter-spacing: .14em; }
[data-estilo="galeria"] .btn:hover { background: transparent; color: var(--acento); }
[data-estilo="galeria"] .hero-acciones { gap: 2rem; }
[data-estilo="galeria"] .cabecera:not(.solida) .btn-chico, [data-estilo="galeria"] .btn-chico { background: transparent; color: inherit; }
[data-estilo="galeria"] .entrada { background: var(--fondo); border: 1px solid var(--linea); }
[data-estilo="galeria"] .entrada-talon .btn:not(.btn-mp) { background: transparent; color: var(--texto); }
[data-estilo="galeria"] .bloque-cab { align-items: end; }
[data-estilo="galeria"] .bloque-cab h2, [data-estilo="galeria"] .visit-info > h2 { font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 400; }
[data-estilo="galeria"] .bajada { font-size: .82rem; text-transform: uppercase; letter-spacing: .14em; }
[data-estilo="galeria"] :is(.item, .carta-grupo, .plan, .testimonio, .obra) { background: transparent; }
[data-estilo="galeria"] :is(.item-cuerpo, .plan, .testimonio) { padding-inline: 0; }
[data-estilo="galeria"] .item h3 { font-size: 1.3rem; font-weight: 400; }
[data-estilo="galeria"] .item-desc, [data-estilo="galeria"] .plan-desc { font-size: .88rem; }
[data-estilo="galeria"] .plan.destacado { background: transparent; color: var(--texto); border-top: 1px solid var(--texto); }
[data-estilo="galeria"] .plan.destacado .btn:not(.btn-acento) { background: transparent; color: var(--texto); }
[data-estilo="galeria"] .filtros { background: transparent; padding: 0; gap: 1.6rem; }
[data-estilo="galeria"] .filtros button { padding: .2rem 0; font-size: .78rem; text-transform: uppercase; letter-spacing: .14em; }
[data-estilo="galeria"] .filtros button[aria-pressed="true"] { background: transparent; box-shadow: none; border-bottom: 1px solid currentColor; }
[data-estilo="galeria"] .foto { border-radius: 0; }
[data-estilo="galeria"] .foto span { position: static; background: none; color: var(--suave); padding: .6rem 0 0; font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; }
[data-estilo="galeria"] .sala, [data-estilo="galeria"] .numeros { background: var(--fondo); }
[data-estilo="galeria"] .numero b { color: var(--texto); font-weight: 400; }
[data-estilo="galeria"] .numero span { font-size: .78rem; text-transform: uppercase; letter-spacing: .12em; }
[data-estilo="galeria"] .cita { font-size: clamp(1.7rem, 3vw, 2.5rem); font-weight: 400; }
[data-estilo="galeria"] .pregunta { background: transparent; border-bottom: 1px solid var(--linea); padding-inline: 0; }
[data-estilo="galeria"] .pie { background: var(--fondo); color: var(--texto); border-top: 1px solid var(--linea); }
[data-estilo="galeria"] .pie-legal { border-top-color: var(--linea); }

/* -------------------------------------------------------------
   TRADICIONAL — imprenta de oficio
   Papel, serif clásica, títulos centrados con versalitas y filetes
   dobles que ordenan (no decoran): separan portada, secciones y pie.
   ------------------------------------------------------------- */
[data-estilo="tradicional"] { --r: 2px; --bt: 1px solid color-mix(in srgb, var(--texto) 22%, transparent); --btn-r: 2px; }
[data-estilo="tradicional"] .marca { font-size: 1.55rem; }
[data-estilo="tradicional"] .top nav a { font-variant: small-caps; letter-spacing: .08em; font-size: 1rem; text-transform: lowercase; }
[data-estilo="tradicional"] .escenario { border-bottom: 3px double var(--texto); }
[data-estilo="tradicional"] .hero-texto { text-align: center; }
[data-estilo="tradicional"] .hero-texto h1 { font-size: clamp(3.2rem, 9vw, 7.4rem); line-height: .95; letter-spacing: -0.01em; }
[data-estilo="tradicional"] .lema { margin-inline: auto; font-family: var(--fuente-titulos); font-style: italic; font-size: clamp(1.2rem, 1.9vw, 1.55rem); color: var(--texto); }
[data-estilo="tradicional"] .hero-acciones { justify-content: center; }
[data-estilo="tradicional"] .btn { font-size: .76rem; text-transform: uppercase; letter-spacing: .16em; padding: 1rem 1.6rem; }
[data-estilo="tradicional"] .btn-acento { background: var(--primario); color: var(--fondo); }
[data-estilo="tradicional"] .btn-linea { border: 1px solid currentColor; }
[data-estilo="tradicional"] .entrada { border: 1px solid var(--texto); outline: 1px solid var(--texto); outline-offset: -6px; background: var(--fondo); }
[data-estilo="tradicional"] .bloque-cab { flex-direction: column; align-items: center; text-align: center; border-top: 3px double var(--texto); padding-top: 2rem; }
[data-estilo="tradicional"] .bloque-cab .bajada { margin-inline: auto; font-style: italic; }
[data-estilo="tradicional"] .visit-info > h2 { border-top: 3px double var(--texto); padding-top: 1.6rem; }
[data-estilo="tradicional"] :is(.item, .carta-grupo, .plan, .testimonio, .obra) { background: color-mix(in srgb, var(--fondo) 70%, #fff); border: var(--bt); }
[data-estilo="tradicional"] .item h3 { text-align: center; }
[data-estilo="tradicional"] .plan.destacado { background: var(--primario); color: var(--fondo); }
[data-estilo="tradicional"] .testimonio blockquote { font-family: var(--fuente-titulos); font-style: italic; font-size: 1.25rem; line-height: 1.4; text-align: center; }
[data-estilo="tradicional"] .testimonio figcaption { justify-content: center; }
[data-estilo="tradicional"] .filtros { background: transparent; padding: 0; gap: 1.2rem; justify-content: center; }
[data-estilo="tradicional"] .filtros button { font-variant: small-caps; letter-spacing: .08em; font-size: 1rem; text-transform: lowercase; padding: .2rem 0; }
[data-estilo="tradicional"] .filtros button[aria-pressed="true"] { background: transparent; box-shadow: none; text-decoration: underline; text-underline-offset: 6px; }
[data-estilo="tradicional"] .sala, [data-estilo="tradicional"] .numeros { background: var(--fondo); border-block: 1px solid color-mix(in srgb, var(--texto) 22%, transparent); }
[data-estilo="tradicional"] .numero b { color: var(--primario); }
[data-estilo="tradicional"] .numero span { font-variant: small-caps; letter-spacing: .06em; text-transform: lowercase; font-size: 1rem; }
[data-estilo="tradicional"] .cita { font-style: italic; }
[data-estilo="tradicional"] .pregunta { background: transparent; border-bottom: 1px solid color-mix(in srgb, var(--texto) 22%, transparent); padding-inline: 0; }
[data-estilo="tradicional"] .pie { background: var(--primario); color: var(--fondo); border-top: 3px double var(--fondo); }
[data-estilo="tradicional"] .pie-in { text-align: center; }
[data-estilo="tradicional"] .pie-cols { justify-content: center; }

/* -------------------------------------------------------------
   TIPOGRÁFICO — la letra es la imagen
   Portada de color plano con el nombre a escala de afiche, títulos
   contorneados, composición asimétrica (las secciones alternan el
   lado del título) y bordes gruesos en lugar de sombras.
   ------------------------------------------------------------- */
[data-estilo="tipografico"] { --r: 0; --bt: 2px solid var(--texto); --btn-r: 0; --hero-bg: var(--primario); }
[data-estilo="tipografico"] :is(h1, h2, .marca, .pie-nombre) { text-transform: uppercase; }
[data-estilo="tipografico"] .marca { font-size: 1.5rem; letter-spacing: .01em; }
[data-estilo="tipografico"] .top nav a { text-transform: uppercase; font-size: .8rem; letter-spacing: .1em; opacity: 1; }
[data-estilo="tipografico"] .escenario-in { grid-template-columns: 1fr; align-items: end; }
[data-estilo="tipografico"] .hero-texto h1 { font-size: clamp(4.4rem, 17vw, 15rem); line-height: .8; letter-spacing: -0.02em; }
[data-estilo="tipografico"] .lema { max-width: 40ch; font-size: clamp(1.05rem, 1.5vw, 1.25rem); color: var(--fondo); border-top: 2px solid currentColor; padding-top: 1rem; }
[data-estilo="tipografico"] .btn { border: 2px solid currentColor; text-transform: uppercase; letter-spacing: .08em; font-size: .82rem; }
[data-estilo="tipografico"] .escenario .btn-acento { background: var(--fondo); color: var(--texto); border-color: var(--fondo); }
[data-estilo="tipografico"] .escenario .btn-linea { color: var(--fondo); }
[data-estilo="tipografico"] .escenario .entrada { justify-self: end; max-width: 440px; width: 100%; border: 2px solid var(--fondo); }
[data-estilo="tipografico"] .bloque-cab h2, [data-estilo="tipografico"] .visit-info > h2 { font-size: clamp(3rem, 9vw, 7.5rem); line-height: .85; color: transparent; -webkit-text-stroke: 1.5px var(--texto); }
[data-estilo="tipografico"] main > section:nth-of-type(even) .bloque-cab { flex-direction: row-reverse; text-align: right; }
[data-estilo="tipografico"] :is(.item, .carta-grupo, .plan, .testimonio, .obra) { background: var(--fondo); border: var(--bt); }
[data-estilo="tipografico"] .item h3, [data-estilo="tipografico"] .plan h3 { text-transform: uppercase; }
[data-estilo="tipografico"] .plan.destacado { background: var(--acento); color: var(--texto); }
[data-estilo="tipografico"] .plan-badge { border-radius: 0; background: var(--texto); color: var(--fondo); }
[data-estilo="tipografico"] .filtros { background: transparent; border: var(--bt); padding: 0; gap: 0; }
[data-estilo="tipografico"] .filtros button { text-transform: uppercase; font-size: .78rem; letter-spacing: .06em; }
[data-estilo="tipografico"] .filtros button + button { border-left: var(--bt); }
[data-estilo="tipografico"] .filtros button[aria-pressed="true"] { background: var(--texto); color: var(--fondo); box-shadow: none; }
[data-estilo="tipografico"] .sala, [data-estilo="tipografico"] .numeros { background: var(--texto); color: var(--fondo); --suave: color-mix(in srgb, var(--fondo) 72%, transparent); --linea: color-mix(in srgb, var(--fondo) 25%, transparent); }
[data-estilo="tipografico"] .sala-der p { color: color-mix(in srgb, var(--fondo) 85%, transparent); }
[data-estilo="tipografico"] .numero b { color: var(--acento); font-size: clamp(3rem, 7vw, 5.5rem); }
[data-estilo="tipografico"] .cita { text-transform: uppercase; font-size: clamp(2rem, 4.4vw, 3.8rem); line-height: .95; }
[data-estilo="tipografico"] .pregunta { background: transparent; border-bottom: var(--bt); padding-inline: 0; }
[data-estilo="tipografico"] .pie { background: var(--primario); color: var(--fondo); }
[data-estilo="tipografico"] .pie-nombre { font-size: clamp(3.4rem, 11vw, 9rem); line-height: .82; }
@media (max-width: 720px) {
  [data-estilo="tipografico"] main > section:nth-of-type(even) .bloque-cab { flex-direction: column; text-align: left; }
  [data-estilo="tipografico"] .bloque-cab h2, [data-estilo="tipografico"] .visit-info > h2 { -webkit-text-stroke-width: 1px; }
  [data-estilo="tradicional"] .entrada { outline: 0; }
}