/* Invitación de boda (demo). Base: ../comun/evento/evento.css */
:root {
  --ev-fondo: #f7f3ec;
  --ev-fondo2: #efe7da;
  --ev-tinta: #3a3229;
  --ev-tenue: #7a6f62;
  --ev-acento: #9c7a45;
  --ev-acento2: #7d8b6a;
  --ev-linea: rgba(58, 50, 41, .14);
  --ev-tarjeta: #fffdf9;
  --ev-sobre: #efe6d6;
  --ev-sobre-tapa: #e4d7c0;
  --ev-sobre-fondo: radial-gradient(circle at 50% 40%, #fbf8f2, #ece3d3);
  --ev-carta: #fffdf8;
  --ev-sello: #8e2f2a;
  --ev-sello-texto: #f6dccb;
  --ev-f-titulo: "Cormorant Garamond", Georgia, serif;
  --ev-f-guion: "Pinyon Script", cursive;
  --ev-f-texto: "Jost", system-ui, sans-serif;
  --ev-radio: 4px;
  --ev-sombra: 0 30px 60px -40px rgba(80, 60, 30, .5);
}

body { background-image: var(--m-grano); background-size: 200px; background-blend-mode: soft-light; }
.ev-titulo { font-weight: 500; }
.ev-titulo em { font-size: 1.15em; }
.ev-personas p, .ev-hito h3, .ev-lugar-cuerpo h3 { font-weight: 500; }
.ev-sello { font-size: 26px; }

/* Bordes finos tipo papelería */
.ev-cuenta > div, .ev-personas article, .ev-lugar, .ev-regalos article, .ev-hito, .ev-rsvp { outline: 1px solid var(--ev-linea); outline-offset: -8px; }

/* ---------- Héroe ---------- */
.hero-luz { position: absolute; inset: -20%; z-index: -1; background: radial-gradient(ellipse 50% 40% at 50% 45%, #fffaf0, transparent 70%), radial-gradient(circle at 15% 85%, rgba(125, 139, 106, .16), transparent 40%), radial-gradient(circle at 85% 15%, rgba(216, 180, 160, .25), transparent 40%); }
.hero-arco { position: absolute; left: 0; right: 0; bottom: 0; z-index: 0; width: min(560px, 88vw); height: auto; margin-inline: auto; fill: none; stroke: var(--ev-acento); stroke-width: 1.2; opacity: .5; }
.hero-arco path { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 3.2s cubic-bezier(.6, 0, .2, 1) .4s; }
.hero-arco path + path { transition-delay: .8s; }
.ev-abierta .hero-arco path { stroke-dashoffset: 0; }

.hero-rama { position: absolute; z-index: 1; width: clamp(150px, 20vw, 260px); height: auto; aspect-ratio: 220 / 420; color: var(--ev-acento2); fill: #a7b393; fill-opacity: 0; stroke: var(--ev-acento2); stroke-width: 1.4; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 3s cubic-bezier(.6, 0, .2, 1) .3s, fill-opacity 2s ease 2s; overflow: visible; }
.hero-rama svg, .hero-rama use { overflow: visible; }
.ev-abierta .hero-rama { stroke-dashoffset: 0; fill-opacity: .45; }
.hero-rama--izq { left: -2%; top: 4%; transform-origin: 50% 100%; rotate: 18deg; }
.hero-rama--der { right: -2%; top: 4%; transform-origin: 50% 100%; rotate: -18deg; scale: -1 1; }
.hero-rama--abajo { left: 50%; bottom: -16%; width: clamp(110px, 13vw, 170px); margin-left: clamp(-85px, -6.5vw, -55px); rotate: 0deg; opacity: .7; }
.ev-abierta .hero-rama--izq { animation: ramaIzq 7s ease-in-out 3s infinite; }
.ev-abierta .hero-rama--der { animation: ramaDer 8s ease-in-out 3s infinite; }
@keyframes ramaIzq { 50% { rotate: 21deg; } }
@keyframes ramaDer { 50% { rotate: -21deg; } }

.ev-nombres { color: var(--ev-tinta); text-shadow: 0 2px 30px #fffaf0; }
.hero-lugar { margin-top: 20px; color: var(--ev-tenue); font-size: 14px; letter-spacing: .3em; text-transform: uppercase; }

/* ---------- Frase ---------- */
.ev-frase p { font-weight: 500; }

/* ---------- Pie ---------- */
.ev-pie { background: linear-gradient(transparent, #efe7da); }

@media (max-width: 760px) {
  .hero-rama--izq { left: -14%; top: 2%; }
  .hero-rama--der { right: -14%; top: 2%; }
  .hero-rama--abajo { display: none; }
  .ev-fecha-hero { gap: 12px; }
}
