/* PLANTILLA "NOCHE ESTRELLADA" · azul noche + plata + dorado
   Fuentes: Cinzel, Allura, Jost */
:root {
  --fondo: #0d1430;
  --fondo-escritorio: #070b1c;
  --superficie: rgba(255, 255, 255, .06);
  --texto: #e8ecf7;
  --titulo: #f3f5fb;
  --suave: #a5afc9;
  --acento: #d9c08a;
  --acento2: #b9c4e0;
  --sobre-acento: #0d1430;
  --linea: rgba(217, 192, 138, .25);
  --f-titulo: "Cinzel", Georgia, serif;
  --f-script: "Allura", cursive;
  --f-texto: "Jost", system-ui, sans-serif;
  --sombra: 0 14px 40px -18px rgba(0, 0, 0, .7);
  --estrellas:
    radial-gradient(1.5px 1.5px at 20px 30px, #fff, transparent),
    radial-gradient(1px 1px at 120px 80px, #fff, transparent),
    radial-gradient(1.5px 1.5px at 200px 150px, #dfe6ff, transparent),
    radial-gradient(1px 1px at 60px 190px, #fff, transparent),
    radial-gradient(2px 2px at 260px 40px, #fff7dd, transparent),
    radial-gradient(1px 1px at 300px 220px, #fff, transparent),
    radial-gradient(1px 1px at 160px 260px, #dfe6ff, transparent);
  --intro-fondo: radial-gradient(ellipse at 50% 30%, #1e2b5c 0%, #0d1430 70%);
}
#xv { background: linear-gradient(var(--fondo), color-mix(in srgb, var(--fondo), #3a4a8a 12%) 40%, var(--fondo)); }
#xv::before { content: ""; position: absolute; inset: 0; background-image: var(--estrellas); background-size: 320px 300px; opacity: .55; pointer-events: none; }
.intro-fondo::after, .hero-deco i:nth-child(1) { content: ""; position: absolute; inset: 0; background-image: var(--estrellas); background-size: 320px 300px; animation: titilar 4s ease-in-out infinite; }

/* Portada */
.hero-foto img { object-position: center 30%; filter: saturate(.9); }
.hero-foto::after { background: linear-gradient(to bottom, color-mix(in srgb, var(--fondo) 15%, transparent) 0%, transparent 30%, color-mix(in srgb, var(--fondo) 75%, transparent) 70%, var(--fondo) 100%); }
.hero-tipo { color: var(--acento); letter-spacing: .45em; font-size: .85rem; }
.hero-nombre { font-size: clamp(4.4rem, 22vw, 6.8rem); text-shadow: 0 0 30px rgba(185, 196, 224, .5); }
.hero-fecha { color: var(--acento2); letter-spacing: .3em; }
.hero-deco i:nth-child(1) { inset: 0 0 40% 0; background-size: 280px 260px; opacity: .9; z-index: 0; }
.hero-deco i:nth-child(2) { top: 7%; right: 9%; width: 54px; height: 54px; border-radius: 50%; box-shadow: inset -12px -4px 0 0 #f4ecd2; filter: drop-shadow(0 0 12px rgba(244,236,210,.6)); transform: rotate(-20deg); }
.hero-deco i:nth-child(3) { top: 18%; left: -10%; width: 60%; height: 2px; background: linear-gradient(90deg, transparent, #fff); transform: rotate(-25deg); opacity: 0; animation: fugaz 7s ease-in 2s infinite; }
@keyframes titilar { 0%, 100% { opacity: .5; } 50% { opacity: 1; } }
@keyframes fugaz { 0% { opacity: 0; translate: 0 0; } 3% { opacity: 1; } 10% { opacity: 0; translate: 160% 80px; } 100% { opacity: 0; translate: 160% 80px; } }

/* Secciones */
.sec { position: relative; }
.sec + .sec::before { width: 120px; height: 10px; opacity: .8; background:
  radial-gradient(circle, var(--acento) 2.5px, transparent 3px) center / 10px 10px no-repeat,
  linear-gradient(var(--acento), var(--acento)) left center / 48px 1px no-repeat,
  linear-gradient(var(--acento), var(--acento)) right center / 48px 1px no-repeat; }
.sec-titulo { font-size: clamp(1.6rem, 7vw, 2.1rem); letter-spacing: .12em; text-transform: uppercase; }
.frase { font-family: var(--f-texto); font-style: normal; font-weight: 300; font-size: 1.2rem; color: var(--acento2); }
.cuenta-item, .info, .cuenta-banco { backdrop-filter: blur(6px); background: rgba(255,255,255,.05); }
.cuenta-num { color: var(--titulo); text-shadow: 0 0 14px rgba(217, 192, 138, .45); }
.info-titulo { text-transform: uppercase; letter-spacing: .1em; font-size: 1.1rem; color: var(--acento); }
.destacado { font-size: 1.3rem; letter-spacing: .08em; }
.galeria-item { border-radius: 4px; box-shadow: 0 0 0 1px var(--linea); }
.campo { background: rgba(255,255,255,.06); }
.modal { background: #141d42; }
.intro-sello { background: radial-gradient(circle at 35% 30%, #f3e3b8, #b9995a); color: #0d1430; box-shadow: 0 0 0 6px #0d1430, 0 0 0 7px var(--acento), 0 0 60px rgba(217,192,138,.35); font-family: var(--f-titulo); font-size: 58px; }
.intro-tipo { letter-spacing: .3em; text-transform: uppercase; font-size: 1.1rem; color: var(--acento); }
.cierre-nombre { font-size: 4rem; color: var(--titulo); text-shadow: 0 0 30px rgba(185,196,224,.5); }
