*{box-sizing:border-box}
:root{--ivory:#fffaf6;--cream:#fff4ed;--rose:#f0d2d5;--rose2:#e7b9bf;--roseDark:#8f5661;--gold:#c99a43;--gold2:#efd38a;--ink:#634b50;--deep:#4e3840}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:Montserrat,sans-serif}
a{text-decoration:none;color:inherit}button{font:inherit}
.preloader{position:fixed;inset:0;background:var(--ivory);z-index:999;display:grid;place-items:center;transition:.6s}.preloader.hide{opacity:0;visibility:hidden}.preloader-a{font:italic 80px "Cormorant Garamond",serif;color:var(--gold);animation:pulse 1.5s infinite}
.opening{height:100svh;min-height:560px;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#9e747c;isolation:isolate}.opening-bg{position:absolute;inset:-2%;background:url("../recursos/fondos/castillo-aurora.png") center 24%/cover no-repeat;transform:scale(1.02);filter:saturate(.92) brightness(.91);z-index:-3}.opening-vignette{position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,rgba(40,21,32,.18),rgba(40,21,32,.02) 45%,rgba(40,21,32,.2)),radial-gradient(ellipse at center,rgba(255,232,221,.12),rgba(45,22,32,.23))}.opening-light{position:absolute;width:65vmax;height:65vmax;left:50%;top:47%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,240,226,.18),rgba(255,240,226,.04) 42%,transparent 70%);z-index:-1;pointer-events:none}
.floating-card{position:relative;z-index:3;width:min(76vw,340px);height:min(57svh,390px);min-height:350px;max-height:390px;padding:28px 26px;display:flex;align-items:center;justify-content:center;text-align:center;background:linear-gradient(145deg,rgba(255,251,248,.975),rgba(250,228,223,.96));border:1px solid rgba(198,148,67,.78);border-radius:3px;box-shadow:0 22px 55px rgba(42,20,28,.28),0 6px 18px rgba(42,20,28,.18),inset 0 0 0 1px rgba(255,255,255,.78);animation:floatCard 5.5s ease-in-out infinite}.floating-card:before{content:"";position:absolute;inset:9px;border:1px solid rgba(193,142,62,.22);pointer-events:none}.floating-card:after{content:"";position:absolute;inset:15px;border:1px solid rgba(255,255,255,.62);pointer-events:none}.card-content{position:relative;z-index:2;width:100%;display:flex;flex-direction:column;align-items:center}.card-ornament{position:absolute;z-index:4;width:78px;height:76px;object-fit:contain;pointer-events:none;opacity:.92}.card-ornament.tl{top:8px;left:8px}.card-ornament.tr{top:8px;right:8px;transform:scaleX(-1)}.card-ornament.bl{bottom:8px;left:8px;transform:scaleY(-1)}.card-ornament.br{bottom:8px;right:8px;transform:scale(-1,-1)}
.opening-crown-img{width:45px;height:34px;object-fit:contain;opacity:.95}.opening-monogram{
  width:115px;
  height:115px;
  object-fit:contain;
  display:block;
  margin-bottom:4px;
  filter:drop-shadow(0 8px 12px rgba(90,45,45,.12));
}.opening-kicker{margin:13px 0 3px;font-size:8px;letter-spacing:.32em;font-weight:600;color:var(--roseDark)}.floating-card h1{margin:0;font:500 43px/1 "Cormorant Garamond",serif;letter-spacing:.07em;color:#a26069}.opening-name{margin-top:8px;font:15px/1.15 "Cormorant Garamond",serif;letter-spacing:.105em;color:#76575b}.opening-divider{display:block;width:130px;height:19px;object-fit:contain;margin:11px 0 8px;opacity:.9}.opening-date{font-size:9px;letter-spacing:.19em;color:#80676b}.enter{position:relative;z-index:5;margin-top:14px;border:0;background:none;padding:0;cursor:pointer;filter:drop-shadow(0 8px 16px rgba(45,22,22,.38));animation:pulseButton 3.2s ease-in-out infinite}.enter img{width:78px;height:auto;display:block;transition:transform .25s ease,filter .25s ease}.enter:hover img{transform:scale(1.06);filter:brightness(1.06)}.tap{position:relative;z-index:5;color:#fffaf6;font-size:7px;letter-spacing:.21em;text-align:center;text-shadow:0 2px 9px rgba(35,18,23,.72);margin:4px 0 0;max-width:290px}
.invitation{display:none}.invitation.open{display:block}
/* HERO */
.hero{height:100svh;min-height:700px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center;color:white}.hero-bg{position:absolute;inset:0;background:url("../recursos/fondos/castillo-aurora.png") center/cover no-repeat;transform:scale(1.04)}.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(47,24,35,.52),rgba(92,45,55,.13) 46%,rgba(37,22,27,.55))}.hero-title{position:absolute;z-index:6;top:5.5%;left:0;right:0;display:flex;align-items:center;flex-direction:column;text-shadow:0 3px 16px rgba(45,20,25,.5)}.hero-crown-img{width:66px;height:43px;object-fit:contain;margin-bottom:3px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.25))}.hero .mini-title{color:#fff5ed;margin:4px 0 1px}.hero h2{margin:0;color:#fff8f3;font:600 clamp(52px,7vw,78px)/.95 "Cormorant Garamond",serif;letter-spacing:.06em}.hero-surname{margin:7px 0 0;font:18px "Cormorant Garamond",serif;letter-spacing:.17em}.hero-divider{width:min(390px,58vw);height:36px;object-fit:contain;margin-top:5px;opacity:.92}.hero-ariana{position:absolute;z-index:4;bottom:-5%;left:50%;transform:translateX(-50%);height:73%;max-width:88vw;object-fit:contain;filter:drop-shadow(0 22px 26px rgba(35,16,20,.42))}.hero-bottom{position:absolute;z-index:7;bottom:6.5%;left:0;right:0;display:flex;align-items:center;flex-direction:column;text-shadow:0 2px 10px rgba(30,15,20,.65)}.hero-bottom p{font:22px "Cormorant Garamond",serif;margin:0;max-width:560px}.hero-bottom span{margin-top:7px;font-size:9px;letter-spacing:.28em;color:#f5dfb1}.hero-corner{position:absolute;z-index:3;width:210px;height:210px;object-fit:contain;opacity:.8}.hero-corner-tl{left:-20px;top:-20px}.hero-corner-br{right:-20px;bottom:-20px;transform:rotate(180deg)}.hero-butterflies img{position:absolute;z-index:8;object-fit:contain;filter:drop-shadow(0 5px 8px rgba(35,15,15,.25));opacity:.88}.hero-butterflies img:nth-child(1){width:46px;left:11%;top:38%;animation:butterflyFloat 8s ease-in-out infinite}.hero-butterflies img:nth-child(2){width:37px;right:13%;top:49%;animation:butterflyFloat 9s ease-in-out infinite 1.4s}.hero-butterflies img:nth-child(3){width:75px;left:13%;bottom:20%;animation:butterflyFloat 11s ease-in-out infinite 2s}.sparkles i{position:absolute;z-index:7;color:#f5d88c;font-style:normal;animation:twinkle 3s infinite}.sparkles i:nth-child(1){left:22%;top:27%}.sparkles i:nth-child(2){right:18%;top:34%;animation-delay:.8s}.sparkles i:nth-child(3){left:17%;bottom:31%;animation-delay:1.4s}.sparkles i:nth-child(4){right:22%;bottom:22%;animation-delay:2s}.scroll-note{position:absolute;z-index:9;bottom:15px;left:0;right:0;font-size:8px;letter-spacing:.25em;color:#fff}
/* GENERIC */
.section{position:relative;padding:82px 20px;text-align:center;overflow:hidden}.section-inner{max-width:980px;margin:auto}.section h2{font:600 clamp(40px,5vw,58px)/1 "Cormorant Garamond",serif;margin:7px 0 20px}.rose{background:linear-gradient(180deg,#fff0ee,#efd0d4)}.eyebrow{font-size:9px;letter-spacing:.28em;color:var(--roseDark);margin:0 0 7px;font-weight:500}.section-corner{position:absolute;width:180px;height:180px;object-fit:contain;opacity:.35;pointer-events:none}.sc-tl{top:-12px;left:-12px}.sc-br{right:-12px;bottom:-12px;transform:rotate(180deg)}.wide-ornament{display:block;width:min(430px,65vw);height:35px;object-fit:contain;margin:5px auto 22px;opacity:.8}.section-crown{width:60px;height:44px;object-fit:contain;margin-bottom:2px}.small-ornament{width:230px;height:28px;object-fit:contain;margin:0 auto 18px;opacity:.72}
/* COUNTDOWN */
.count-section{background:linear-gradient(180deg,#fffaf6,#f8e7e2);min-height:490px;display:flex;align-items:center;justify-content:center}.count-inner{position:relative;z-index:2;width:min(920px,100%);padding:36px 24px 42px;background:rgba(255,253,249,.72);border:1px solid rgba(201,154,67,.35);box-shadow:0 24px 70px rgba(96,56,56,.09);border-radius:2px}.count-inner:before,.count-inner:after{content:"";position:absolute;inset:10px;border:1px solid rgba(201,154,67,.18);pointer-events:none}.count-inner:after{inset:15px;border-color:rgba(255,255,255,.8)}.countdown{max-width:760px;margin:20px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.countdown div{position:relative;background:rgba(255,255,255,.86);border:1px solid rgba(201,154,67,.38);border-radius:4px;padding:21px 8px 18px;box-shadow:0 12px 30px rgba(115,65,65,.08)}.countdown div:before{content:"✦";position:absolute;top:5px;left:50%;transform:translateX(-50%);font-size:8px;color:var(--gold)}.countdown strong{display:block;font:600 clamp(38px,5vw,52px) "Cormorant Garamond",serif;color:var(--roseDark);margin-top:3px}.countdown span{font-size:8px;letter-spacing:.16em;color:#80676b}.count-butterfly{position:absolute;z-index:1;width:55px;object-fit:contain;opacity:.8}.count-b1{left:8%;top:25%;animation:butterflyFloat 8s ease-in-out infinite}.count-b2{right:9%;bottom:22%;width:45px;animation:butterflyFloat 9s ease-in-out infinite 2s}.today{display:none;color:var(--roseDark);font:26px "Cormorant Garamond",serif}
/* PEOPLE */
.people{min-height:650px}.people-inner{position:relative;z-index:2}.people-monogram{width:115px;height:115px;object-fit:contain;margin-bottom:4px;filter:drop-shadow(0 8px 12px rgba(90,45,45,.12))}.people h2{margin-bottom:6px}.people-card{max-width:800px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:18px}.person{position:relative;overflow:hidden;background:rgba(255,252,249,.86);padding:30px 22px 28px;border-radius:3px;border:1px solid rgba(201,154,67,.35);box-shadow:0 16px 38px rgba(90,50,50,.08)}.person>img{position:absolute;width:72px;height:86px;object-fit:contain;right:-13px;bottom:-15px;opacity:.52;transform:rotate(-10deg)}.person span{display:block;color:var(--gold);font-size:22px;margin-bottom:8px}.person strong{font:21px "Cormorant Garamond",serif;color:#674b50}.between-people{height:56px;display:flex;align-items:center;justify-content:center}.between-people img{width:300px;height:35px;object-fit:contain;opacity:.7}
/* STORY */
.story{padding-top:70px;padding-bottom:70px;color:#fff}.story-bg{position:absolute;inset:0;background:url("../recursos/fondos/castillo-aurora.png") center/cover no-repeat;transform:scale(1.04)}.story-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(48,24,32,.62),rgba(55,27,35,.22)),rgba(55,28,35,.16)}.story-inner{position:relative;z-index:2;max-width:1100px;margin:auto;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:44px;text-align:left}.story-copy{padding:40px 35px;background:rgba(255,249,245,.91);color:var(--ink);border:1px solid rgba(201,154,67,.4);box-shadow:0 24px 70px rgba(35,17,22,.22)}.story-copy h2{font-size:58px;margin:5px 0 10px}.story-divider{width:300px;height:30px;object-fit:contain;margin:0 0 15px}.story-copy p{font:20px/1.55 "Cormorant Garamond",serif}.signature strong{font-size:38px;color:var(--roseDark)}.story-frame img{width:100%;max-height:680px;object-fit:contain;filter:drop-shadow(0 22px 28px rgba(30,12,15,.35))}.story-corner{position:absolute;z-index:2;width:190px;height:190px;object-fit:contain;opacity:.75}.story-ctl{left:-15px;top:-15px}.story-cbr{right:-15px;bottom:-15px;transform:rotate(180deg)}
/* MAP */
.map-section{background:linear-gradient(135deg,#f6e3df,#fffaf6);min-height:590px;display:flex;align-items:center;justify-content:center}.map-card{position:relative;z-index:2;max-width:760px;width:100%;margin:auto;background:rgba(255,255,255,.86);border:1px solid rgba(201,154,67,.4);border-radius:3px;padding:50px 35px;box-shadow:0 24px 70px rgba(100,55,55,.11)}.map-card:before{content:"";position:absolute;inset:10px;border:1px solid rgba(201,154,67,.18);pointer-events:none}.map-crown{width:65px;height:42px;object-fit:contain}.map-details{max-width:560px;margin:8px auto 0;display:grid;gap:10px}.map-details div{padding:13px 12px;background:rgba(250,239,234,.58);border-bottom:1px solid rgba(201,154,67,.22)}.map-details span{display:block;font-size:8px;letter-spacing:.2em;color:var(--roseDark);margin-bottom:4px}.map-details strong{font:19px/1.25 "Cormorant Garamond",serif}
/* DRESS/GALLERY */
.dress-img{width:min(100%,760px);max-height:760px;object-fit:contain;border-radius:4px;box-shadow:0 20px 50px rgba(80,40,40,.12)}.gallery{background:var(--ivory);padding-top:80px;padding-bottom:90px}.gallery p{max-width:650px;margin:10px auto;line-height:1.7}.gallery-camera{font-size:58px;margin-bottom:3px;filter:drop-shadow(0 4px 8px rgba(80,40,40,.12))}.gallery-flower{position:absolute;width:110px;height:125px;object-fit:contain;right:6%;top:10%;opacity:.55;transform:rotate(15deg)}.photo-placeholder{width:min(90vw,700px);height:250px;margin:30px auto;border:1px solid rgba(201,154,67,.38);border-radius:4px;background:linear-gradient(135deg,#fff8f3,#f5dedf);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--roseDark);font:24px "Cormorant Garamond",serif;box-shadow:0 15px 40px rgba(80,40,40,.07)}.photo-placeholder img{width:55px;height:48px;object-fit:contain;opacity:.8}
/* GIFTS */
.gifts{min-height:510px;display:flex;align-items:center;justify-content:center}.gift-card{position:relative;z-index:2;width:min(760px,100%);padding:52px 45px;background:rgba(255,251,247,.9);border:1px solid rgba(201,154,67,.4);box-shadow:0 24px 70px rgba(90,50,50,.11)}.gift-card:before{content:"";position:absolute;inset:11px;border:1px solid rgba(201,154,67,.18);pointer-events:none}.gift-crown{width:72px;height:50px;object-fit:contain}.gift-card h2{font-size:54px;margin:7px auto 4px;max-width:620px}.gift-card p{max-width:600px;margin:0 auto 12px;font:21px/1.55 "Cormorant Garamond",serif}.gift-card>strong{font:600 15px "Cormorant Garamond",serif;color:var(--roseDark)}.gift-butterfly{position:absolute;z-index:1;object-fit:contain;opacity:.8}.gift-b1{width:105px;left:7%;bottom:15%;animation:butterflyFloat 10s ease-in-out infinite}
/* CONFIRM/FINAL */
.confirm{background:linear-gradient(180deg,#efd0d4,#e5b7be);min-height:500px;display:flex;align-items:center;justify-content:center}.confirm-card{position:relative;max-width:670px;width:100%;margin:auto;background:rgba(255,250,246,.9);border:1px solid rgba(201,154,67,.45);padding:50px 28px;box-shadow:0 24px 70px rgba(85,45,45,.13)}.confirm-monogram{width:80px;height:80px;object-fit:contain}.confirm-card p{font:19px/1.5 "Cormorant Garamond",serif}.whatsapp-button{display:inline-flex;justify-content:center;align-items:center;margin-top:18px;padding:15px 24px;border-radius:999px;border:1px solid #9e8241;background:linear-gradient(135deg,#d8b867,#f1d993);color:#5d4532;font-size:10px;font-weight:600;letter-spacing:.1em;transition:.25s}.gold-button{display:inline-flex;justify-content:center;align-items:center;margin-top:18px;padding:14px 22px;border-radius:999px;border:1px solid var(--gold);background:linear-gradient(135deg,#e4b75c,#f3d991);color:#5d4532;font-size:10px;font-weight:600;letter-spacing:.1em;transition:.25s}.gold-button:hover,.whatsapp-button:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(110,70,35,.15)}.final{position:relative;overflow:hidden;padding:90px 20px;text-align:center;background:#f7e3df;color:var(--roseDark)}.final-monogram{font:italic 75px "Cormorant Garamond",serif;color:var(--gold)}.final p,.final h2{font-family:"Cormorant Garamond",serif}.final h2{font-size:38px}.footer-date{font-size:10px;letter-spacing:.25em}.final-flowers{position:absolute;width:145px;height:165px;object-fit:contain;left:5%;bottom:-5%;opacity:.55;transform:rotate(25deg)}.final-butterflies{position:absolute;width:120px;height:110px;object-fit:contain;right:5%;top:10%;opacity:.65}
@keyframes floatCard{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes pulseButton{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes pulse{50%{transform:scale(1.08);opacity:.7}}@keyframes twinkle{0%,100%{opacity:.15;transform:scale(.8)}50%{opacity:1;transform:scale(1.25)}}@keyframes butterflyFloat{0%,100%{transform:translate(0,0) rotate(-4deg)}50%{transform:translate(28px,-24px) rotate(8deg)}}

/* =========================================================
   SECCIÓN 03 · PADRES Y PADRINOS — V9
   Diseño editorial compacto y ceremonial
   ========================================================= */
.family-section{
  position:relative; isolation:isolate; overflow:hidden;
  min-height:auto !important;
  padding:clamp(64px,8vw,100px) 20px clamp(70px,9vw,105px) !important;
  background:radial-gradient(circle at 50% 12%,rgba(255,220,226,.78),transparent 35%),linear-gradient(145deg,#fbefe9 0%,#f7e2dc 48%,#f4d9d6 100%) !important;
}
.family-section::before{content:"";position:absolute;inset:22px;border:1px solid rgba(171,118,57,.28);pointer-events:none;z-index:-1}
.family-section::after{content:"";position:absolute;width:520px;height:520px;left:-250px;bottom:-300px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.55),transparent 68%);z-index:-1}
.family-inner{width:min(1120px,100%);margin:auto;position:relative;z-index:2}
.family-card{position:relative;width:min(1020px,100%);margin:auto;padding:clamp(34px,5vw,58px) clamp(22px,5vw,64px) clamp(38px,5vw,62px);background:rgba(255,249,245,.88);border:1px solid rgba(177,128,68,.42);box-shadow:0 24px 70px rgba(75,36,42,.13);backdrop-filter:blur(8px);text-align:center}
.family-card::before{content:"";position:absolute;inset:10px;border:1px solid rgba(176,127,63,.16);pointer-events:none}
.family-monogram{width:clamp(105px,12vw,145px);height:auto;display:block;margin:0 auto 10px;filter:drop-shadow(0 8px 15px rgba(100,57,24,.15))}
.family-script{margin:0;color:#9f6731;font-family:"Great Vibes","Alex Brush","Cormorant Garamond",serif;font-size:clamp(42px,5vw,61px);line-height:1;font-weight:400}
.family-title{margin:8px 0;color:#6d3c35;font-family:"Cinzel","Cormorant Garamond",Georgia,serif;font-size:clamp(25px,3vw,38px);font-weight:500;letter-spacing:.18em;line-height:1.2}
.family-orn{display:block;width:min(500px,78%);height:auto;margin:13px auto 18px;opacity:.95}
.family-intro{max-width:690px;margin:0 auto 34px;color:#604b4a;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(16px,1.6vw,19px);line-height:1.55}
.family-grid{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:clamp(18px,3vw,42px);max-width:860px;margin:0 auto}
.family-divider{width:1px;background:linear-gradient(to bottom,transparent,#b98443 18%,#b98443 82%,transparent);opacity:.65;position:relative;color:#b98443;display:flex;align-items:center;justify-content:center;font-size:12px}
.family-divider::after{content:"";position:absolute;top:50%;left:50%;width:22px;height:22px;transform:translate(-50%,-50%);background:#fff8f3}
.family-person{position:relative;min-height:210px;padding:24px 20px 20px;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(250,232,227,.52));border:1px solid rgba(184,132,68,.25);box-shadow:0 10px 28px rgba(90,45,50,.07)}
.family-label{display:inline-block;margin-bottom:17px;color:#a26b35;font-family:"Montserrat",Arial,sans-serif;font-size:10px;font-weight:600;letter-spacing:.28em}
.family-name{margin:4px 0;color:#4b3031;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(21px,2.3vw,29px);font-weight:600;line-height:1.12}
.family-role-orn{width:150px;max-width:70%;margin:14px auto 0;opacity:.75}
.family-rama{position:absolute;width:clamp(120px,17vw,205px);height:auto;top:-14px;left:-20px;opacity:.88;transform:rotate(-5deg);pointer-events:none;z-index:1}
.family-flower{position:absolute;width:clamp(135px,18vw,225px);height:auto;right:-18px;bottom:-20px;opacity:.9;pointer-events:none;z-index:1;filter:drop-shadow(0 12px 18px rgba(88,46,44,.12))}
.family-butterflies{position:absolute;width:clamp(90px,12vw,145px);right:4%;top:18%;opacity:.62;pointer-events:none}
.family-butterfly{position:absolute;width:clamp(45px,6vw,75px);left:4%;bottom:14%;opacity:.5;transform:rotate(-8deg);pointer-events:none}
.family-note{margin:34px auto 0;color:#8b654b;font-family:"Montserrat",Arial,sans-serif;font-size:10px;letter-spacing:.22em;text-transform:uppercase}
.family-monogram,.family-flower,.family-rama{transition:transform .7s ease}
.family-section:hover .family-monogram{transform:scale(1.025)}
.family-section:hover .family-flower{transform:translateY(-3px) rotate(1deg)}
.family-section:hover .family-rama{transform:rotate(-3deg) translateY(2px)}
@media(max-width:700px){.opening-bg{background-position:center 23%}.floating-card{width:min(76vw,320px);height:min(54svh,360px);min-height:325px;padding:22px 20px}.card-ornament{width:64px;height:62px}.opening-crown-img{width:39px;height:29px}.opening-monogram{font-size:50px}.opening-kicker{font-size:7px;margin-top:10px}.floating-card h1{font-size:39px}.opening-name{font-size:13px}.opening-divider{width:112px;height:16px;margin:9px 0 6px}.opening-date{font-size:8px}.enter{margin-top:11px}.enter img{width:72px}.tap{font-size:6.5px;letter-spacing:.17em}.hero{min-height:650px}.hero-title{top:5%}.hero-crown-img{width:53px;height:35px}.hero h2{font-size:58px}.hero-surname{font-size:14px}.hero-divider{width:76vw;height:29px}.hero-ariana{height:67%;bottom:0}.hero-bottom{bottom:5.5%;padding:0 20px}.hero-bottom p{font-size:18px}.hero-corner{width:140px;height:140px}.hero-butterflies img:nth-child(1){left:5%;top:38%;width:34px}.hero-butterflies img:nth-child(2){right:6%;top:52%;width:30px}.hero-butterflies img:nth-child(3){left:5%;bottom:22%;width:55px}.section{padding:68px 16px}.section h2{font-size:42px}.section-corner{width:120px;height:120px}.count-section{min-height:520px}.count-inner{padding:30px 14px 34px}.countdown{gap:7px}.countdown div{padding:19px 3px 15px}.countdown strong{font-size:34px}.countdown span{font-size:6px;letter-spacing:.1em}.count-b1{left:3%;top:19%;width:40px}.count-b2{right:4%;bottom:16%;width:35px}.people-card{grid-template-columns:1fr;gap:12px}.people-monogram{width:70px;height:70px}.person{padding:25px 16px}.between-people{height:46px}.between-people img{width:250px}.story{padding-top:45px;padding-bottom:45px}.story-inner{grid-template-columns:1fr;gap:18px}.story-copy{padding:30px 23px;text-align:left}.story-copy h2{font-size:44px}.story-copy p{font-size:19px}.story-frame{order:-1}.story-frame img{max-height:470px}.story-corner{width:125px;height:125px}.map-section{min-height:620px}.map-card{padding:40px 18px}.map-details strong{font-size:18px}.gift-card{padding:43px 22px}.gift-card h2{font-size:43px}.gift-card p{font-size:19px}.gift-b1{width:75px;left:2%;bottom:9%}.final-flowers{width:100px;height:120px}.final-butterflies{width:85px;height:80px}}
@media(min-width:1100px){.floating-card{width:340px;height:390px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}

/* ===== HERO V6 — COMPOSICIÓN EDITORIAL ===== */
.hero-editorial{height:100svh;min-height:700px;display:block;text-align:left;background:#39252c}
.hero-editorial .hero-bg{inset:-1.5%;background-position:center 16%;transform:scale(1.02);filter:saturate(.98) brightness(.86)}
.hero-editorial .hero-bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 30% 24% at 58% 19%,rgba(255,220,174,.18),transparent 72%);pointer-events:none}
.hero-editorial .hero-shade{background:linear-gradient(90deg,rgba(34,18,25,.78) 0%,rgba(40,21,28,.55) 27%,rgba(43,24,30,.10) 57%,rgba(31,17,22,.22) 100%),linear-gradient(180deg,rgba(31,15,21,.08),transparent 48%,rgba(24,13,18,.45))}
.hero-left-glow{position:absolute;z-index:1;left:-8%;top:0;width:64%;height:100%;background:radial-gradient(ellipse at 35% 48%,rgba(151,89,98,.20),transparent 63%);pointer-events:none}
.hero-copy{position:absolute;z-index:6;left:clamp(42px,7vw,105px);top:50%;transform:translateY(-51%);width:min(470px,39vw);text-align:left;color:#fff;display:flex;flex-direction:column;align-items:flex-start;text-shadow:0 3px 15px rgba(30,13,19,.62)}
.hero-monogram-wrap{width:92px;height:92px;margin-bottom:6px;display:flex;align-items:center;justify-content:flex-start;filter:drop-shadow(0 5px 12px rgba(0,0,0,.25))}
.hero-monogram{width:92px;height:92px;object-fit:contain}
.hero-editorial .mini-title{font-size:10px;letter-spacing:.36em;margin:2px 0 4px;color:#f8e6ce;font-weight:500}
.hero-editorial h2{margin:0;color:#fff7ed;font:500 clamp(58px,6.1vw,92px)/.88 "Cormorant Garamond",serif;letter-spacing:.045em}
.hero-editorial .hero-surname{margin:11px 0 0;color:#f8e6d7;font:18px/1.1 "Cormorant Garamond",serif;letter-spacing:.19em}
.hero-editorial .hero-divider{width:250px;height:30px;object-fit:contain;object-position:left center;margin:9px 0 3px;opacity:.9}
.hero-editorial .hero-phrase{margin:5px 0 16px;max-width:385px;color:#fff3ea;font:22px/1.18 "Cormorant Garamond",serif;letter-spacing:.01em}
.hero-count-card{width:min(430px,100%);padding:13px 15px 11px;border:1px solid rgba(240,204,135,.55);background:linear-gradient(135deg,rgba(48,28,35,.72),rgba(78,45,52,.48));box-shadow:0 14px 35px rgba(18,8,12,.25),inset 0 0 0 1px rgba(255,244,218,.07);backdrop-filter:blur(4px);text-align:center}
.hero-count-title{margin:0 0 8px;color:#f8dfb5;font-size:8px;letter-spacing:.30em;font-weight:600}
.hero-countdown{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.hero-countdown>div{position:relative;padding:1px 8px 0;border-right:1px solid rgba(240,204,135,.26)}
.hero-countdown>div:last-child{border-right:0}
.hero-countdown strong{display:block;color:#fff6eb;font:500 clamp(31px,3vw,43px)/.9 "Cormorant Garamond",serif}
.hero-countdown span{display:block;margin-top:5px;color:#e9cfae;font-size:6px;letter-spacing:.16em}
.hero-count-card small{display:block;margin-top:9px;color:#f6e3c9;font-size:7px;letter-spacing:.20em}
.hero-ariana-wrap{position:absolute;z-index:5;right:clamp(1%,3vw,5%);bottom:-4%;width:min(58vw,850px);height:92%;display:flex;align-items:flex-end;justify-content:center;pointer-events:none}
.hero-editorial .hero-ariana{position:relative;inset:auto;left:auto;bottom:auto;transform:none;width:100%;height:100%;max-width:none;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 24px 28px rgba(28,12,17,.52))}
.hero-editorial .hero-corner{width:180px;height:180px;opacity:.72;z-index:4}
.hero-editorial .hero-corner-tl{left:-22px;top:-22px}
.hero-editorial .hero-corner-br{right:-22px;bottom:-22px;transform:rotate(180deg)}
.hero-editorial .hero-butterflies img:nth-child(1){width:42px;left:42%;top:19%;opacity:.72}
.hero-editorial .hero-butterflies img:nth-child(2){width:34px;right:9%;top:34%;opacity:.75}
.hero-editorial .hero-butterflies img:nth-child(3){width:62px;left:44%;bottom:12%;opacity:.72}
.hero-scroll{position:absolute;z-index:10;bottom:13px;left:0;right:0;text-align:center;color:#fff0e7;text-shadow:0 2px 10px rgba(25,10,15,.8);font-size:7px;letter-spacing:.30em}
.hero-scroll b{display:block;font-size:15px;line-height:.7;font-weight:300;animation:scrollBob 1.8s ease-in-out infinite}
@keyframes scrollBob{0%,100%{transform:translateY(0);opacity:.65}50%{transform:translateY(5px);opacity:1}}

@media(max-width:900px){
  .hero-editorial{min-height:680px}
  .hero-editorial .hero-bg{background-position:center 17%}
  .hero-copy{left:5%;top:43%;width:46%;transform:translateY(-50%)}
  .hero-monogram-wrap,.hero-monogram{width:72px;height:72px}
  .hero-editorial h2{font-size:clamp(50px,8vw,72px)}
  .hero-editorial .hero-surname{font-size:14px;letter-spacing:.14em}
  .hero-editorial .hero-phrase{font-size:19px}
  .hero-count-card{width:100%;padding:11px 8px}
  .hero-countdown strong{font-size:30px}
  .hero-ariana-wrap{right:-2%;width:60vw;height:89%}
}
@media(max-width:700px){
  .hero-editorial{height:100svh;min-height:650px}
  .hero-editorial .hero-bg{background-position:center 24%}
  .hero-editorial .hero-shade{background:linear-gradient(180deg,rgba(33,16,23,.30),rgba(37,19,26,.20) 35%,rgba(28,14,20,.65) 100%)}
  .hero-left-glow{left:0;top:0;width:100%;height:68%;background:radial-gradient(ellipse at 50% 45%,rgba(116,61,72,.25),transparent 68%)}
  .hero-copy{left:6%;right:6%;top:7%;width:auto;transform:none;align-items:center;text-align:center}
  .hero-monogram-wrap,.hero-monogram{width:66px;height:66px}
  .hero-editorial .mini-title{font-size:7px;letter-spacing:.28em}
  .hero-editorial h2{font-size:52px}
  .hero-editorial .hero-surname{font-size:11px;letter-spacing:.13em;margin-top:7px}
  .hero-editorial .hero-divider{width:180px;height:22px;margin:5px auto}
  .hero-editorial .hero-phrase{font-size:17px;line-height:1.12;margin:2px auto 9px;max-width:290px}
  .hero-count-card{width:min(360px,94vw);padding:8px 7px 8px}
  .hero-count-title{font-size:6px;letter-spacing:.22em;margin-bottom:5px}
  .hero-countdown strong{font-size:25px}
  .hero-countdown span{font-size:5px;margin-top:3px}
  .hero-count-card small{font-size:5.5px;margin-top:6px;letter-spacing:.13em}
  .hero-ariana-wrap{right:-5%;bottom:-1%;width:82vw;height:63%;align-items:flex-end}
  .hero-editorial .hero-ariana{object-position:center bottom}
  .hero-editorial .hero-corner{width:110px;height:110px}
  .hero-editorial .hero-corner-tl{left:-13px;top:-13px}
  .hero-editorial .hero-corner-br{right:-13px;bottom:-13px}
  .hero-editorial .hero-butterflies img:nth-child(1){width:30px;left:8%;top:48%}
  .hero-editorial .hero-butterflies img:nth-child(2){width:25px;right:7%;top:53%}
  .hero-editorial .hero-butterflies img:nth-child(3){width:45px;left:6%;bottom:16%}
  .hero-scroll{bottom:8px;font-size:5.5px}
}


/* V8 — HERO: jerarquía dorada y monograma protagonista */
.hero-editorial .hero-monogram-wrap{
  width:132px;
  height:132px;
  margin-bottom:8px;
  filter:drop-shadow(0 0 10px rgba(241,194,91,.22)) drop-shadow(0 6px 14px rgba(0,0,0,.28));
}
.hero-editorial .hero-monogram{
  width:132px;
  height:132px;
}
.hero-editorial .mini-title{
  color:#f4cf83;
  font-size:13px;
  letter-spacing:.42em;
  font-weight:600;
  text-shadow:0 2px 10px rgba(27,12,16,.75),0 0 10px rgba(211,157,58,.18);
  margin:2px 0 7px;
}
.hero-editorial h2{
  font-size:clamp(68px,7vw,104px);
  font-weight:500;
  letter-spacing:.055em;
  background:linear-gradient(180deg,#fff0b5 0%,#e9bb61 42%,#b97820 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  text-shadow:0 4px 18px rgba(24,10,14,.55);
  filter:drop-shadow(0 1px 1px rgba(255,235,169,.2));
}
.hero-editorial .hero-surname{
  color:#f8e8d1;
  font-size:19px;
  letter-spacing:.21em;
  text-shadow:0 2px 10px rgba(28,11,16,.72);
}
.hero-editorial .hero-divider{
  width:275px;
  height:34px;
  margin:8px 0 4px;
  filter:drop-shadow(0 2px 7px rgba(204,150,55,.25));
}
.hero-editorial .hero-phrase{
  color:#fff4e7;
  font-size:22px;
  max-width:405px;
  margin:5px 0 17px;
  text-shadow:0 3px 12px rgba(25,10,15,.78);
}
.hero-count-card{
  border-color:rgba(245,207,128,.72);
  background:linear-gradient(135deg,rgba(39,22,29,.80),rgba(79,45,52,.58));
  box-shadow:0 16px 38px rgba(18,8,12,.30),inset 0 0 0 1px rgba(255,244,218,.08),0 0 22px rgba(202,145,49,.08);
}
.hero-count-title{color:#f7d994}

@media(max-width:1100px) and (min-width:701px){
  .hero-editorial .hero-monogram-wrap,.hero-editorial .hero-monogram{width:112px;height:112px}
  .hero-editorial .mini-title{font-size:11px}
  .hero-editorial h2{font-size:clamp(60px,7vw,84px)}
  .hero-editorial .hero-surname{font-size:16px}
}

@media(max-width:700px){
  .hero-editorial .hero-monogram-wrap,.hero-editorial .hero-monogram{width:76px;height:76px}
  .hero-editorial .hero-monogram-wrap{margin-bottom:5px}
  .hero-editorial .mini-title{font-size:8px;letter-spacing:.30em;margin:1px 0 4px}
  .hero-editorial h2{font-size:58px;letter-spacing:.045em}
  .hero-editorial .hero-surname{font-size:11px;letter-spacing:.13em}
  .hero-editorial .hero-divider{width:190px;height:23px;margin:5px auto}
  .hero-editorial .hero-phrase{font-size:16px;max-width:300px;margin:2px auto 9px}
}

@media(max-width:700px){
  .family-section{padding:52px 14px 65px !important}
  .family-section::before{inset:10px}
  .family-card{padding:34px 18px 42px}
  .family-grid{grid-template-columns:1fr;gap:14px;max-width:540px}
  .family-divider{width:150px;height:1px;margin:auto;background:linear-gradient(to right,transparent,#b98443 18%,#b98443 82%,transparent)}
  .family-person{min-height:165px;padding:22px 16px}
  .family-rama{width:120px;left:-18px;top:4px}
  .family-flower{width:130px;right:-20px;bottom:-8px}
  .family-butterflies{width:85px;right:3%;top:10%}
  .family-butterfly{width:52px;bottom:9%}
  .family-note{line-height:1.5;letter-spacing:.16em}
}

/* ===== DRESS CODE V10 — COMPOSICIÓN PREMIUM ===== */
.dress-premium{min-height:760px;padding:76px 24px 88px;background:linear-gradient(180deg,#fff3f0 0%,#f3d8da 50%,#fff1ee 100%);isolation:isolate}
.dress-shell{position:relative;z-index:3;width:min(1120px,100%);margin:0 auto}
.dress-heading{max-width:760px;margin:0 auto 30px;text-align:center}
.dress-crown{width:54px;height:40px;object-fit:contain;margin-bottom:3px;filter:drop-shadow(0 4px 8px rgba(90,45,45,.15))}
.dress-heading .eyebrow{color:#9a6a50;margin-bottom:6px}
.dress-heading h2{margin:0;color:#6a3f48;font-size:clamp(45px,5vw,64px);letter-spacing:.025em}
.dress-divider{width:min(380px,64vw);height:30px;object-fit:contain;margin:2px auto 8px;opacity:.9}
.dress-lead{max-width:620px;margin:0 auto;color:#76565a;font:19px/1.45 "Cormorant Garamond",serif}
.dress-card{position:relative;display:grid;grid-template-columns:minmax(310px,.86fr) minmax(430px,1.14fr);min-height:500px;overflow:hidden;border:1px solid rgba(190,137,67,.46);background:rgba(255,250,247,.72);box-shadow:0 26px 70px rgba(92,49,54,.14),inset 0 0 0 1px rgba(255,255,255,.75)}
.dress-card:before{content:"";position:absolute;inset:11px;border:1px solid rgba(190,137,67,.22);pointer-events:none;z-index:5}
.dress-copy{position:relative;z-index:4;display:flex;flex-direction:column;justify-content:center;padding:58px clamp(34px,5vw,68px);text-align:left;background:linear-gradient(135deg,rgba(255,249,246,.97),rgba(248,225,224,.76));border-right:1px solid rgba(190,137,67,.28)}
.dress-number{font-size:9px;letter-spacing:.34em;color:#a06d3f;font-weight:600;margin-bottom:9px}
.dress-copy h3{margin:0;color:#6d3d46;font:600 clamp(45px,5vw,61px)/.95 "Cormorant Garamond",serif;letter-spacing:.035em}
.dress-formal{margin:14px 0 0;color:#a66c39;font:600 17px/1.25 Montserrat,sans-serif;letter-spacing:.08em;text-transform:uppercase}
.dress-line{width:82px;height:1px;background:linear-gradient(90deg,#c99a43,transparent);margin:20px 0 17px}
.dress-copy>p:not(.dress-formal){max-width:430px;margin:0;color:#654d50;font:20px/1.5 "Cormorant Garamond",serif}
.dress-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}
.dress-tags span{padding:8px 12px;border:1px solid rgba(186,132,63,.35);color:#8c5d43;background:rgba(255,255,255,.5);font-size:8px;letter-spacing:.16em;text-transform:uppercase}
.dress-visual{position:relative;min-height:500px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;background:radial-gradient(circle at 50% 38%,rgba(255,245,232,.92),rgba(245,211,211,.72) 46%,rgba(218,174,183,.55) 100%)}
.dress-visual:before{content:"";position:absolute;inset:12px;border:1px solid rgba(190,137,67,.2);pointer-events:none;z-index:2}
.dress-visual-glow{position:absolute;width:70%;height:65%;left:15%;top:10%;border-radius:50%;background:radial-gradient(circle,rgba(255,248,224,.8),rgba(255,239,215,.16) 55%,transparent 72%);filter:blur(4px)}
.dress-img{position:relative;z-index:3;width:min(100%,620px);height:500px;max-height:none;object-fit:contain;object-position:center bottom;border-radius:0;box-shadow:none;filter:drop-shadow(0 20px 22px rgba(88,44,46,.18))}
.dress-caption{position:absolute;z-index:4;left:28px;right:28px;bottom:24px;display:flex;align-items:flex-end;justify-content:space-between;gap:15px;padding:13px 18px;border:1px solid rgba(191,140,72,.32);background:rgba(69,38,45,.58);backdrop-filter:blur(5px);color:#fff7ed}
.dress-caption span{font-size:7px;letter-spacing:.25em;opacity:.85}
.dress-caption strong{font:500 18px "Cormorant Garamond",serif;letter-spacing:.04em}
.dress-footer{display:flex;align-items:center;justify-content:center;gap:18px;margin:27px auto 0;color:#8a6050;font-size:9px;letter-spacing:.2em;text-transform:uppercase}
.dress-footer img{width:125px;height:28px;object-fit:contain;opacity:.62}
.dress-corner{position:absolute;width:170px;height:170px;object-fit:contain;opacity:.46;z-index:1;pointer-events:none}
.dress-corner-tl{top:-15px;left:-15px}
.dress-corner-br{right:-15px;bottom:-15px;transform:rotate(180deg)}
.dress-butterfly{position:absolute;object-fit:contain;z-index:2;pointer-events:none;filter:drop-shadow(0 4px 8px rgba(85,43,44,.14))}
.dress-butterfly-1{width:54px;left:7%;top:34%;opacity:.72;animation:butterflyFloat 8s ease-in-out infinite}
.dress-butterfly-2{width:105px;right:3%;top:14%;opacity:.42;animation:butterflyFloat 11s ease-in-out infinite 1s}
@media(max-width:900px){
  .dress-premium{padding:66px 18px 72px}
  .dress-card{grid-template-columns:1fr;min-height:0}
  .dress-copy{min-height:330px;padding:42px 30px;border-right:0;border-bottom:1px solid rgba(190,137,67,.28);text-align:center;align-items:center}
  .dress-line{margin:17px auto 14px}
  .dress-copy>p:not(.dress-formal){max-width:560px}
  .dress-tags{justify-content:center}
  .dress-visual{min-height:460px}
  .dress-img{height:460px;width:min(100%,600px)}
}
@media(max-width:700px){
  .dress-premium{padding:52px 13px 60px}
  .dress-crown{width:45px;height:34px}
  .dress-heading{margin-bottom:22px}
  .dress-heading h2{font-size:43px}
  .dress-divider{width:230px;height:24px}
  .dress-lead{font-size:17px;line-height:1.35;padding:0 8px}
  .dress-card{margin:0 2px}
  .dress-card:before{inset:7px}
  .dress-copy{min-height:330px;padding:37px 23px 38px}
  .dress-copy h3{font-size:48px}
  .dress-formal{font-size:13px;letter-spacing:.06em}
  .dress-copy>p:not(.dress-formal){font-size:18px;line-height:1.42}
  .dress-tags{gap:6px;margin-top:20px}
  .dress-tags span{padding:7px 9px;font-size:7px}
  .dress-visual{min-height:390px}
  .dress-img{height:390px;width:100%}
  .dress-caption{left:17px;right:17px;bottom:15px;padding:10px 12px;flex-direction:column;align-items:center;text-align:center;gap:3px}
  .dress-caption span{font-size:5.5px}
  .dress-caption strong{font-size:16px}
  .dress-footer{gap:6px;font-size:7px;letter-spacing:.13em;line-height:1.3}
  .dress-footer img{width:72px;height:20px}
  .dress-corner{width:105px;height:105px}
  .dress-butterfly-1{width:35px;left:1%;top:27%}
  .dress-butterfly-2{width:70px;right:-2%;top:8%}
}

/* =========================================================
   V11 — SISTEMA VISUAL STORYBOOK: CASTILLO + RÍO + MONOGRAMA OFICIAL
   Mantiene Hero, familia y Dress Code aprobados y añade una
   atmósfera coherente al resto de la invitación.
   ========================================================= */
.storybook-page{position:relative;isolation:isolate;background:#3b2730}
.storybook-atmosphere{position:fixed;z-index:-10;inset:0;background:url("../recursos/fondos/castillo-aurora.png") center 55%/cover no-repeat;filter:saturate(.9) brightness(.82);pointer-events:none}
.storybook-atmosphere:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(48,25,35,.22),rgba(255,235,225,.08) 35%,rgba(48,25,35,.28));}

/* El fondo narrativo aparece en todas las secciones posteriores al Hero,
   pero con veladuras distintas para evitar repetición visual. */
.section-with-story-bg{position:relative;isolation:isolate}
.section-with-story-bg:before{content:"";position:absolute;z-index:-2;inset:0;background-image:url("../recursos/fondos/castillo-aurora.png");background-size:cover;background-repeat:no-repeat;opacity:.34;pointer-events:none}
.section-with-story-bg:after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none}

/* 03 — Padres y Padrinos: fondo de río muy suave */
.family-section:before{background-position:center 78%;opacity:.30;filter:saturate(.85)}
.family-section:after{background:linear-gradient(180deg,rgba(255,246,240,.88),rgba(247,225,220,.92))}
.family-section .family-inner{position:relative;z-index:3}
.family-section .family-monogram{width:148px;height:148px;object-fit:contain;filter:drop-shadow(0 7px 15px rgba(92,49,24,.22))}

/* 05 — Ubicación: el castillo queda al fondo, el contenido manda */
.map-section:before{background-position:center 47%;opacity:.28;filter:saturate(.82) blur(.1px)}
.map-section:after{background:linear-gradient(180deg,rgba(255,248,243,.88),rgba(249,228,222,.90))}
.map-card{backdrop-filter:blur(3px)}

/* 06 — Dress Code: río y flores como escenario editorial */
.dress-premium:before{background-position:center 72%;opacity:.25;filter:saturate(.8)}
.dress-premium:after{background:linear-gradient(180deg,rgba(255,242,239,.90),rgba(241,213,216,.82),rgba(255,241,237,.91))}
.dress-shell{position:relative;z-index:4}

/* 07 — Galería: más inmersiva, sin dejar que el fondo compita */
.gallery:before{background-position:center 61%;opacity:.28;filter:saturate(.82)}
.gallery:after{background:linear-gradient(180deg,rgba(255,249,245,.91),rgba(246,225,222,.84))}
.gallery{background:transparent}

/* 08 — Regalos: ambiente de cuento */
.gifts:before{background-position:center 39%;opacity:.28;filter:saturate(.8)}
.gifts:after{background:linear-gradient(180deg,rgba(255,239,237,.84),rgba(239,207,212,.86))}
.gifts{background:transparent}
.gift-card{backdrop-filter:blur(4px)}

/* 09 — Confirmación: cierre más profundo y elegante */
.confirm:before{background-position:center 67%;opacity:.34;filter:saturate(.75) brightness(.82)}
.confirm:after{background:linear-gradient(180deg,rgba(112,58,68,.48),rgba(74,39,48,.66))}
.confirm{background:transparent}
.confirm-card{backdrop-filter:blur(7px)}

/* Cierre: el castillo queda como recuerdo final */
.final:before{background-position:center 57%;opacity:.48;filter:saturate(.78) brightness(.72)}
.final:after{background:linear-gradient(180deg,rgba(39,20,29,.52),rgba(31,17,25,.70))}
.final{position:relative;isolation:isolate;background:transparent}
.final > *{position:relative;z-index:3}
.final-monogram{display:flex;align-items:center;justify-content:center}
.final-monogram img{width:112px;height:112px;object-fit:contain;filter:drop-shadow(0 7px 18px rgba(0,0,0,.30))}

/* El nuevo monograma también reemplaza cualquier versión antigua del Hero */
.hero-editorial .hero-monogram{content:url("../recursos/nuevos/monograma-ariana-oficial.png");object-fit:contain}

/* Microdetalle: una línea de luz que unifica las secciones */
.section-with-story-bg:after{box-shadow:inset 0 1px rgba(255,246,230,.18),inset 0 -1px rgba(130,72,67,.08)}

@media(max-width:700px){
  .storybook-atmosphere{position:absolute;background-attachment:scroll;background-position:center 52%}
  .section-with-story-bg:before{background-position:center 64%;opacity:.22}
  .family-section:before{background-position:center 78%;opacity:.22}
  .map-section:before{background-position:center 48%;opacity:.20}
  .dress-premium:before{background-position:center 70%;opacity:.20}
  .gallery:before{background-position:center 61%;opacity:.20}
  .gifts:before{background-position:center 42%;opacity:.20}
  .confirm:before{background-position:center 68%;opacity:.24}
  .final:before{background-position:center 56%;opacity:.34}
  .family-section .family-monogram{width:118px;height:118px}
  .final-monogram img{width:92px;height:92px}
}

/* =========================================================
   V12 — AJUSTE DE SEPARADORES + CONTRASTE + MOBILE
   No altera la composición aprobada; corrige únicamente:
   - áreas transparentes excesivas de los separadores
   - separación Padres / Padrinos
   - contraste tipográfico del cierre
   - adaptación móvil
   ========================================================= */

/* 03 — Padres y Padrinos: separador compacto y proporcionado */
.family-grid{grid-template-columns:minmax(0,1fr) 88px minmax(0,1fr);gap:clamp(12px,2.2vw,28px);align-items:center}
.family-divider{width:88px;height:72px;background:none;display:flex;align-items:center;justify-content:center;position:relative}
.family-divider::after{display:none}
.family-divider img{display:block;width:86px;height:54px;object-fit:contain;object-position:center;filter:drop-shadow(0 3px 5px rgba(86,45,26,.14));opacity:.92}
.family-person{min-height:190px}

/* Cierre: sobre el castillo oscuro la tipografía pasa a marfil/dorado,
   con sombra sutil para conservar lectura sin perder elegancia. */
.final{color:#fff8ee;text-shadow:0 2px 12px rgba(20,10,15,.55)}
.final p{color:#f7e8d7;font-size:clamp(18px,2vw,23px);line-height:1.5;max-width:620px;margin:18px auto 10px}
.final h2{color:#f4d487;font-size:clamp(38px,5vw,58px);letter-spacing:.025em;text-shadow:0 3px 15px rgba(20,10,15,.65);margin:8px 0 14px}
.footer-date{color:#f7e8d7;text-shadow:0 2px 9px rgba(20,10,15,.6)}
.final-monogram img{filter:drop-shadow(0 7px 18px rgba(0,0,0,.42))}

/* Mejor contraste en secciones con fotografía de fondo, sin modificar el
   fondo aprobado: únicamente refuerza los bloques donde el texto lo necesita. */
.map-card,.gift-card,.confirm-card{box-shadow:0 24px 70px rgba(35,17,22,.22),inset 0 0 0 1px rgba(255,255,255,.45)}

@media(max-width:700px){
  .family-grid{grid-template-columns:1fr;gap:10px}
  .family-divider{width:min(190px,62vw);height:42px;margin:0 auto}
  .family-divider img{width:min(180px,60vw);height:36px}
  .family-person{min-height:150px;padding:20px 15px}
  .family-label{margin-bottom:11px;font-size:8px;letter-spacing:.22em}
  .family-name{font-size:21px;line-height:1.1}
  .family-role-orn{width:112px;margin-top:10px}

  .final{padding:78px 18px 70px;min-height:480px;display:flex;flex-direction:column;align-items:center;justify-content:center}
  .final-monogram img{width:88px;height:88px}
  .final p{font-size:18px;line-height:1.42;max-width:330px;margin:15px auto 8px}
  .final h2{font-size:42px;line-height:1.02;margin:8px 0 14px}
  .footer-date{font-size:9px;letter-spacing:.22em}
}

/* ===== V13 — HERO MOBILE / RESPONSIVE REFINEMENT ===== */
@media (max-width:700px){
  .hero-editorial{
    height:100svh;
    min-height:640px;
    max-height:980px;
    overflow:hidden;
  }

  /* El castillo permanece visible y el encuadre prioriza la escena central */
  .hero-editorial .hero-bg{
    background-position:center 24%;
    transform:scale(1.04);
  }

  .hero-editorial .hero-shade{
    background:
      linear-gradient(180deg,rgba(31,14,21,.34) 0%,rgba(39,18,25,.10) 30%,rgba(30,14,20,.20) 48%,rgba(25,12,17,.72) 100%);
  }

  .hero-copy{
    left:4%;
    right:4%;
    top:3.2%;
    width:auto;
    height:94%;
    transform:none;
    align-items:center;
    text-align:center;
    z-index:7;
    pointer-events:none;
  }

  .hero-monogram-wrap,
  .hero-editorial .hero-monogram{
    width:58px;
    height:58px;
  }

  .hero-monogram-wrap{
    margin-bottom:2px;
  }

  .hero-editorial .mini-title{
    font-size:7px;
    letter-spacing:.30em;
    margin:1px 0 3px;
  }

  .hero-editorial h2{
    font-size:clamp(48px,14vw,62px);
    line-height:.86;
    letter-spacing:.045em;
  }

  .hero-editorial .hero-surname{
    font-size:10px;
    letter-spacing:.13em;
    margin-top:6px;
  }

  .hero-editorial .hero-divider{
    width:160px;
    height:20px;
    margin:4px auto 0;
  }

  /* Frase separada de la cuenta para evitar que ambos bloques compitan */
  .hero-editorial .hero-phrase{
    position:absolute;
    top:30.5%;
    left:50%;
    transform:translateX(-50%);
    width:92%;
    max-width:330px;
    margin:0;
    font-size:15px;
    line-height:1.13;
    color:#fff7ee;
    text-shadow:0 3px 13px rgba(20,8,13,.9),0 0 8px rgba(20,8,13,.45);
  }

  /* Cuenta compacta y centrada, sin tapar el rostro */
  .hero-count-card{
    position:absolute;
    top:38%;
    left:50%;
    transform:translateX(-50%);
    width:min(350px,92vw);
    padding:8px 8px 7px;
    background:linear-gradient(135deg,rgba(39,21,29,.88),rgba(77,43,50,.72));
    border-color:rgba(245,207,128,.78);
    box-shadow:0 14px 32px rgba(14,6,10,.38),inset 0 0 0 1px rgba(255,244,218,.09);
    backdrop-filter:blur(5px);
    pointer-events:auto;
  }

  .hero-count-title{
    font-size:6px;
    letter-spacing:.22em;
    margin-bottom:5px;
  }

  .hero-countdown{
    gap:0;
  }

  .hero-countdown>div{
    padding:1px 5px 0;
  }

  .hero-countdown strong{
    font-size:clamp(23px,6.8vw,29px);
  }

  .hero-countdown span{
    font-size:5px;
    letter-spacing:.10em;
    margin-top:3px;
  }

  .hero-count-card small{
    font-size:5px;
    letter-spacing:.11em;
    margin-top:6px;
  }

  /* Ariana queda visualmente por debajo de la información */
  .hero-ariana-wrap{
    right:-8%;
    bottom:-7%;
    width:92vw;
    height:58%;
    z-index:5;
    align-items:flex-end;
  }

  .hero-editorial .hero-ariana{
    width:100%;
    height:100%;
    object-fit:contain;
    object-position:center bottom;
    filter:drop-shadow(0 18px 24px rgba(24,9,14,.56));
  }

  .hero-editorial .hero-corner{
    width:100px;
    height:100px;
    opacity:.72;
  }

  .hero-editorial .hero-corner-tl{left:-14px;top:-14px}
  .hero-editorial .hero-corner-br{right:-14px;bottom:-14px}

  .hero-editorial .hero-butterflies img:nth-child(1){width:27px;left:7%;top:46%}
  .hero-editorial .hero-butterflies img:nth-child(2){width:23px;right:6%;top:50%}
  .hero-editorial .hero-butterflies img:nth-child(3){width:42px;left:5%;bottom:14%}

  .hero-scroll{
    bottom:7px;
    font-size:5px;
    z-index:11;
  }
}

@media (max-width:380px){
  .hero-editorial{min-height:610px}
  .hero-monogram-wrap,.hero-editorial .hero-monogram{width:52px;height:52px}
  .hero-editorial h2{font-size:48px}
  .hero-editorial .hero-surname{font-size:9px}
  .hero-editorial .hero-phrase{top:30%;font-size:14px}
  .hero-count-card{top:37.5%;width:93vw;padding:7px 6px}
  .hero-countdown strong{font-size:22px}
  .hero-ariana-wrap{width:96vw;height:57%;right:-10%;bottom:-8%}
}


/* =========================================================
   MÚSICA · CONTROL DISCRETO Y RESPONSIVE
   La reproducción comienza al pulsar "Entrar".
   ========================================================= */
.music-toggle {
  position: fixed;
  z-index: 120;
  right: clamp(14px, 2.2vw, 28px);
  bottom: clamp(14px, 2.2vw, 28px);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 9px 14px 9px 11px;
  border: 1px solid rgba(235, 194, 102, .62);
  border-radius: 999px;
  background: rgba(35, 14, 27, .78);
  color: #f6dfaa;
  box-shadow: 0 10px 28px rgba(0,0,0,.25), inset 0 0 0 1px rgba(255,255,255,.035);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font: 500 10px/1 'Montserrat', sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .25s ease, background .25s ease, border-color .25s ease;
}
.music-toggle:hover { transform: translateY(-2px); }
.music-toggle:focus-visible {
  outline: 2px solid #f2d58b;
  outline-offset: 3px;
}
.music-icon {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid rgba(242,213,139,.45);
  border-radius: 50%;
  font: 600 14px/1 'Cormorant Garamond', serif;
}
.music-toggle.is-playing .music-icon {
  animation: musicPulse 1.35s ease-in-out infinite;
}
@keyframes musicPulse {
  0%,100% { transform: scale(1); opacity: .82; }
  50% { transform: scale(1.12); opacity: 1; }
}
@media (max-width: 640px) {
  .music-toggle {
    right: 12px;
    bottom: 12px;
    min-height: 40px;
    padding: 8px 11px 8px 9px;
  }
  .music-label { font-size: 9px; }
}


/* =========================================================
   V15 — PADRES Y PADRINOS · COMPOSICIÓN COMPACTA
   Corrige el exceso de aire vertical provocado por recursos
   PNG con lienzos transparentes y reduce la altura visual.
   ========================================================= */
.family-section{
  min-height:auto !important;
  padding:56px 20px 62px !important;
}
.family-inner{max-width:1080px}
.family-card{
  width:min(980px,100%);
  padding:30px clamp(20px,4vw,52px) 34px;
}
.family-monogram{width:112px !important;height:112px !important;margin:0 auto 4px}
.family-script{font-size:clamp(34px,4vw,48px);line-height:.95}
.family-title{margin:5px 0 4px;font-size:clamp(25px,3vw,37px);line-height:1.08;letter-spacing:.16em}
.family-orn{width:min(340px,62%);height:auto;margin:7px auto 11px}
.family-intro{
  max-width:650px;
  margin:0 auto 20px;
  font-size:clamp(16px,1.45vw,18px);
  line-height:1.32;
}
.family-grid{
  grid-template-columns:minmax(0,1fr) 76px minmax(0,1fr);
  gap:16px;
  max-width:820px;
  align-items:center;
}
.family-person{
  min-height:155px;
  padding:17px 16px 14px;
}
.family-label{margin-bottom:10px;font-size:9px;letter-spacing:.25em}
.family-name{font-size:clamp(20px,2vw,26px);line-height:1.08;margin:3px 0}
.family-role-orn{width:105px;max-width:60%;margin:9px auto 0}
.family-divider{width:76px;height:58px}
.family-divider img{width:76px;height:auto;object-fit:contain}
.family-note{margin:18px auto 0;font-size:9px;letter-spacing:.18em}
.family-rama{width:115px;top:5px;left:-15px;opacity:.72}
.family-flower{width:125px;right:-13px;bottom:-8px;opacity:.72}
.family-butterflies{width:78px;right:4%;top:12%;opacity:.5}
.family-butterfly{width:48px;left:4%;bottom:12%;opacity:.42}

@media(max-width:700px){
  .family-section{padding:40px 12px 48px !important}
  .family-section::before{inset:9px}
  .family-card{padding:24px 15px 28px}
  .family-monogram{width:92px !important;height:92px !important;margin-bottom:3px}
  .family-script{font-size:34px}
  .family-title{font-size:24px;letter-spacing:.12em;margin:4px 0}
  .family-orn{width:min(250px,72vw);margin:6px auto 9px}
  .family-intro{font-size:16px;line-height:1.3;margin-bottom:14px;max-width:330px}
  .family-grid{grid-template-columns:1fr;gap:8px;max-width:420px}
  .family-person{min-height:125px;padding:16px 13px 12px}
  .family-label{margin-bottom:8px;font-size:8px}
  .family-name{font-size:20px}
  .family-role-orn{width:92px;margin-top:7px}
  .family-divider{width:min(155px,55vw);height:34px;margin:0 auto}
  .family-divider img{width:100%;height:auto}
  .family-note{margin-top:14px;font-size:8px;line-height:1.4}
  .family-rama{width:78px;left:-12px;top:2px}
  .family-flower{width:90px;right:-12px;bottom:-4px}
  .family-butterflies{width:55px;right:2%;top:9%}
  .family-butterfly{width:38px;left:2%;bottom:9%}
}


/* V16 · DRESS CODE */
.dress-code-main{
  margin: .7rem auto .45rem;
  text-align:center;
  font-size:clamp(1.25rem,2.3vw,1.85rem);
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.dress-code-note{
  max-width:760px;
  margin: .75rem auto 0;
  text-align:center;
  line-height:1.7;
  font-size:clamp(.95rem,1.45vw,1.12rem);
}
@media (max-width:640px){
  .dress-code-main{letter-spacing:.1em}
  .dress-code-note{padding:0 1rem}
}


/* V17 · DRESS CODE: monograma oficial y portada sin numeración */
.dress-crown.dress-monogram{
  width:72px;
  height:72px;
  object-fit:contain;
  margin-bottom:8px;
  filter:drop-shadow(0 5px 10px rgba(90,45,45,.16));
}
.dress-heading > h2{
  letter-spacing:.055em;
}
@media (max-width:640px){
  .dress-crown.dress-monogram{
    width:58px;
    height:58px;
    margin-bottom:6px;
  }
  .dress-heading > h2{
    letter-spacing:.035em;
  }
}


/* V18 · eliminar leyenda superior de Dress Code */
.dress-heading > h2 {
  margin-top: 0;
}


/* V18 · Dress Code simplificado: la tarjeta pasa a ser el encabezado principal */
.dress-card{
  margin-top: 0;
}
.dress-copy .dress-formal{
  text-transform: uppercase;
  letter-spacing: .16em;
}
@media (max-width: 640px){
  .dress-card{
    margin-top: 0;
  }
}