/* ============ v2: royal layer, intro, vine, venue+travel ============ */
@property --m{syntax:'<percentage>';inherits:false;initial-value:-20%}
.gold-text{background:linear-gradient(100deg,#7d5a1f 0%,#e8cd8a 22%,#b5873a 40%,#f5e3ae 58%,#a77a30 76%,#7d5a1f 100%);background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 7s linear infinite}
@keyframes sheen{to{background-position:-220% 0}}
.jaali{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23DCC08A' stroke-width='.8' opacity='.22'%3E%3Cpath d='M32 4c8 10 8 18 0 28c-8-10-8-18 0-28zM32 60c8-10 8-18 0-28c-8 10-8 18 0 28zM4 32c10-8 18-8 28 0c-10 8-18 8-28 0zM60 32c-10-8-18-8-28 0c10 8 18 8 28 0z'/%3E%3Ccircle cx='32' cy='32' r='3'/%3E%3Ccircle cx='0' cy='0' r='6'/%3E%3Ccircle cx='64' cy='0' r='6'/%3E%3Ccircle cx='0' cy='64' r='6'/%3E%3Ccircle cx='64' cy='64' r='6'/%3E%3C/g%3E%3C/svg%3E")}
.jaali-light{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='%23B5873A' stroke-width='.7' opacity='.12'%3E%3Cpath d='M32 4c8 10 8 18 0 28c-8-10-8-18 0-28zM32 60c8-10 8-18 0-28c-8 10-8 18 0 28zM4 32c10-8 18-8 28 0c-10 8-18 8-28 0zM60 32c-10-8-18-8-28 0c10 8 18 8 28 0z'/%3E%3Ccircle cx='32' cy='32' r='3'/%3E%3C/g%3E%3C/svg%3E")}
.lotus-div{display:block;width:220px;height:40px;margin:0 auto;color:var(--gold)}
.ornate{position:relative}
.ornate>.crn{position:absolute;width:46px;height:46px;color:var(--gold);pointer-events:none;z-index:2}
.ornate>.crn.tl{top:4px;left:4px}.ornate>.crn.tr{top:4px;right:4px;transform:scaleX(-1)}
.ornate>.crn.bl{bottom:4px;left:4px;transform:scaleY(-1)}.ornate>.crn.br{bottom:4px;right:4px;transform:scale(-1)}

/* ---------- intro ---------- */
#intro{position:fixed;inset:0;z-index:100;background:var(--paper);display:flex;align-items:center;justify-content:center;overflow:hidden;
  transition:transform 1.6s cubic-bezier(.75,0,.2,1),opacity 1.2s ease .3s}
#intro::before{content:"";position:absolute;inset:0;opacity:1}
#intro.leave{transform:translateY(-100%)}
#intro.hidden{display:none}
.intro-frame{position:absolute;inset:clamp(10px,2.4vw,28px);pointer-events:none}
.intro-frame svg{width:100%;height:100%;overflow:visible}
.intro-frame path,.intro-frame rect{stroke-dasharray:6000;stroke-dashoffset:6000;animation:draw 3.2s cubic-bezier(.6,0,.3,1) .2s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.intro-stack{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;text-align:center;width:min(92vw,980px)}
.intro-tree{position:relative;width:min(88vw,820px,calc((100vh - 260px)*1.34));aspect-ratio:2400/1792}
.intro-tree img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply;
  -webkit-mask-image:linear-gradient(to top,#000 var(--m),transparent calc(var(--m) + 18%));
          mask-image:linear-gradient(to top,#000 var(--m),transparent calc(var(--m) + 18%));
  animation:grow 3.6s cubic-bezier(.45,0,.25,1) .5s forwards;transform-origin:50% 92%}
@keyframes grow{0%{--m:-20%;transform:scale(.94)}100%{--m:105%;transform:scale(1)}}
.intro-tree .breeze{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 30% 20% at var(--bx,20%) 30%,rgba(255,240,200,.35),transparent 70%);mix-blend-mode:soft-light;animation:breeze 6s ease-in-out infinite}
@keyframes breeze{0%,100%{--bx:20%}50%{--bx:80%}}
.intro-copy{margin-top:-2%;opacity:0;transform:translateY(20px);animation:rise 1.4s ease 3.4s forwards}
@keyframes rise{to{opacity:1;transform:none}}
.intro-copy .caps{font-size:12px;letter-spacing:.42em}
.intro-copy h1{font-family:var(--f-script);font-weight:400;font-size:clamp(52px,8vw,104px);line-height:1.05;color:var(--red)}
.intro-copy h1 .amp{font-family:var(--f-display);font-style:italic;font-size:.5em;padding:0 .18em;vertical-align:middle}
.intro-copy .date{font-family:var(--f-caps);letter-spacing:.32em;font-weight:600;font-size:14px;color:var(--ink);margin-top:2px}
.enter{margin-top:24px;display:inline-flex;align-items:center;gap:14px;padding:14px 30px;background:transparent;border:1px solid var(--gold);color:var(--red-deep);
  font-family:var(--f-caps);letter-spacing:.3em;text-transform:uppercase;font-weight:700;font-size:13px;cursor:pointer;position:relative;transition:all .4s}
.enter::before,.enter::after{content:"";position:absolute;width:7px;height:7px;background:var(--gold);transform:rotate(45deg);top:50%;margin-top:-3.5px}
.enter::before{left:-4px}.enter::after{right:-4px}
.enter:hover{background:var(--red);color:#fff4df;border-color:var(--red)}
#intro .petal{z-index:3}

/* ---------- petals (shared) ---------- */
.petal{position:absolute;top:-30px;width:var(--w,14px);height:calc(var(--w,14px)*1.15);pointer-events:none;
  border-radius:80% 0 80% 0;background:radial-gradient(circle at 30% 30%,#d13a3f,#9b1b1e 55%,#5c0a0f);opacity:.9;
  animation:petalfall var(--d,9s) linear forwards}
.petal.w{background:radial-gradient(circle at 30% 30%,#fff,#f4ead8 60%,#dccdb0)}
.petal.g{background:radial-gradient(circle at 30% 30%,#f3dfa6,#b5873a 70%);border-radius:50%;width:5px;height:5px;box-shadow:0 0 6px #f3dfa6}
@keyframes petalfall{
  0%{transform:translate3d(0,0,0) rotate(0) rotateY(0)}
  25%{transform:translate3d(var(--x1,40px),27vh,0) rotate(90deg) rotateY(180deg)}
  50%{transform:translate3d(var(--x2,-30px),54vh,0) rotate(180deg) rotateY(360deg)}
  75%{transform:translate3d(var(--x1,40px),80vh,0) rotate(270deg) rotateY(540deg)}
  100%{transform:translate3d(0,108vh,0) rotate(360deg) rotateY(720deg)}}
#petalLayer{position:fixed;inset:0;pointer-events:none;z-index:40;overflow:hidden}

/* ---------- flowing vine ---------- */
#vine{position:absolute;left:0;top:0;width:100%;pointer-events:none;z-index:3;overflow:visible}
#vine .v-main{fill:none;stroke:var(--gold);stroke-width:1.4;opacity:.75}
#vine .v-shadow{fill:none;stroke:var(--gold-soft);stroke-width:5;opacity:.18}
#vine .bud{transform-box:fill-box;transform-origin:center;transform:scale(0);transition:transform .9s cubic-bezier(.3,1.6,.5,1)}
#vine .bud.on{transform:scale(1)}
#vineTip{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;z-index:4;pointer-events:none;border-radius:50%;
  background:radial-gradient(circle,#fff6d8 0 18%,#f3c66a 30%,rgba(243,180,90,.0) 70%);filter:blur(.3px);animation:tip 1.6s ease-in-out infinite}
@keyframes tip{50%{transform:scale(1.35)}}

/* ---------- hero v2 ---------- */
#hero{padding-top:120px}
.blessing{text-align:center;margin-bottom:46px;display:flex;flex-direction:column;align-items:center;gap:10px}
.blessing .ganesh{font-family:var(--f-display);font-style:italic;font-size:18px;color:var(--muted)}
.blessing .caps{font-size:14px;letter-spacing:.42em}
.hero-grid .parents .names{font-size:26px}
.arch .apex{position:absolute;left:50%;top:-34px;width:34px;height:40px;margin-left:-17px;color:var(--gold)}

/* ---------- red sections royal ---------- */
#countdown,#rsvp{position:relative}
#countdown .title,#rsvp .title{background:linear-gradient(100deg,#c79a4a,#f5e3ae 30%,#dcc08a 50%,#fff1c8 65%,#c79a4a);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:220% 100%;animation:sheen 7s linear infinite}
.band{position:absolute;left:0;right:0;height:14px;background:repeating-linear-gradient(90deg,var(--gold) 0 2px,transparent 2px 12px),linear-gradient(var(--gold),var(--gold)) 0 50%/100% 1px no-repeat;opacity:.55}
.band.top{top:18px}.band.bot{bottom:18px}
.cd-num{text-shadow:0 0 30px rgba(243,200,120,.25)}

/* ---------- venue & travel ---------- */
#visit{padding:140px 0 120px}
.visit-card{max-width:1040px;margin:0 auto;background:rgba(255,253,246,.75);border:1px solid rgba(181,135,58,.45);padding:64px clamp(24px,5vw,72px);position:relative}
.visit-card::before{content:"";position:absolute;inset:9px;border:1px solid rgba(181,135,58,.22);pointer-events:none}
.visit-top{text-align:center;padding-bottom:40px;border-bottom:1px solid rgba(181,135,58,.35);margin-bottom:40px}
.visit-top .dates{font-family:var(--f-caps);letter-spacing:.34em;font-weight:600;font-size:14px;color:var(--gold)}
.visit-top h3{font-family:var(--f-display);font-weight:500;font-size:clamp(54px,8vw,92px);line-height:1;color:var(--red);margin:10px 0 6px}
.visit-top p{font-family:var(--f-display);font-style:italic;font-size:21px;color:var(--muted);max-width:560px;margin:0 auto 22px;text-wrap:pretty}
.visit-top .btn{align-self:center}
.visit-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.visit-grid .tv{padding:6px 28px 4px;text-align:center}
.visit-grid .tv+.tv{border-left:1px solid rgba(181,135,58,.35)}
.visit-grid .tv a{color:var(--red);font-family:var(--f-caps);letter-spacing:.18em;text-transform:uppercase;font-weight:700;font-size:12px;text-decoration:none;border-bottom:1px solid var(--gold);display:inline-block;margin-top:10px;padding-bottom:2px}
.visit-fam{margin-top:40px;padding-top:30px;border-top:1px dashed rgba(181,135,58,.5);text-align:center}
.visit-fam .n{font-family:var(--f-display);font-size:28px;font-weight:500}
.visit-fam .s{font-family:var(--f-display);font-style:italic;color:var(--muted);font-size:18px}

/* events small polish */
.day-head .num{background:linear-gradient(100deg,#8a6424,#e9cf8f 40%,#b5873a 60%,#8a6424);-webkit-background-clip:text;background-clip:text;color:transparent}
.dress{background:rgba(255,253,246,.82)}
.ev .art .arch .frame{box-shadow:none}

@media (max-width:900px){
  .visit-grid{grid-template-columns:1fr}
  .visit-grid .tv{padding:22px 4px}
  .visit-grid .tv+.tv{border-left:none;border-top:1px solid rgba(181,135,58,.35)}
  .blessing{margin-bottom:18px}
  .hero-grid{grid-template-columns:1fr 1fr;gap:20px 14px}
  .hero-grid .arch{grid-column:1 / -1;order:0;margin:30px auto 10px}
  .hero-grid .parents{order:1}
  .hero-grid .parents.p2{order:2}
  .hero-grid .parents .names{font-size:19px}
  .hero-grid .parents .of{font-size:14px}
  .ornate>.crn{width:30px;height:30px}
  .intro-tree{width:min(96vw,calc((100vh - 300px)*1.34))}
}

/* ---------- YouTube music card ---------- */
#ytHolder{position:fixed;left:20px;bottom:84px;z-index:61;width:264px;padding:10px 12px 12px;background:var(--paper);border:1px solid var(--gold);
  box-shadow:0 14px 34px rgba(60,20,10,.25);opacity:0;transform:translateY(10px) scale(.98);pointer-events:none;transition:opacity .35s,transform .35s}
#ytHolder.show{opacity:1;transform:none;pointer-events:auto}
#ytHolder:not(.show){left:-9999px}
#ytHolder .yt-cap{font-family:var(--f-caps);letter-spacing:.18em;text-transform:uppercase;font-weight:700;font-size:11px;color:var(--red);margin-bottom:8px;padding-right:22px}
#ytHolder .yt-box{width:240px;height:135px;background:#000}
#ytHolder iframe{display:block;width:240px;height:135px}
#ytHolder .yt-x{position:absolute;top:4px;right:6px;width:28px;height:28px;border:none;background:none;font-size:20px;color:var(--muted);cursor:pointer}
#ytHolder .yt-open{display:block;margin-top:8px;font-size:12px;color:var(--red);text-decoration:none;border-bottom:1px solid rgba(155,27,30,.3);width:max-content}

#d21 > .day-head > .num, #d22 > .day-head > .num, #d23 > .day-head > .num{padding:4px}

/* ---------- softer dress-code suggestion ---------- */
.dress.soft{padding:16px 0 0;background:transparent;border:none;border-top:1px solid rgba(181,135,58,.35);border-radius:0;margin-top:18px;max-width:460px}
.ev.flip .dress.soft{margin-left:auto}
.dress.soft::before{display:none}
.dress.soft .dc-top{display:flex;flex-direction:column;align-items:flex-start;gap:0}
.ev.flip .dress.soft .dc-top{align-items:flex-end}
.dress.soft .dc-kind{font-family:var(--f-caps);letter-spacing:.2em;font-size:11px;color:var(--gold);font-weight:600}
.dress.soft .dc-name{font-family:var(--f-display);font-style:italic;font-weight:500;font-size:21px}
.dress.soft .swatches{margin:10px 0 8px;gap:8px}
.ev.flip .dress.soft .swatches{justify-content:flex-end}
.dress.soft .sw{width:auto;font-size:0}
.dress.soft .sw i{width:24px;height:24px}
.dc-hint{font-size:15px;color:var(--muted);line-height:1.5;text-wrap:pretty;margin:0}
.dc-more{margin-top:8px}
.dc-more summary{cursor:pointer;list-style:none;font-family:var(--f-caps);letter-spacing:.16em;text-transform:uppercase;font-size:11px;font-weight:700;color:var(--red);display:inline-flex;align-items:center;gap:6px;padding:6px 0}
.dc-more summary::-webkit-details-marker{display:none}
.dc-more summary::after{content:"+";font-size:14px;transition:transform .3s}
.dc-more[open] summary::after{transform:rotate(45deg)}
.dc-more .ideas{margin-top:6px;text-align:left}
.ev.flip .dress.soft .dc-more,.ev.flip .dress.soft .dc-hint{text-align:right}
@media (max-width:900px){
  .ev.flip .dress.soft{margin-left:0}
  .ev.flip .dress.soft .dc-top{align-items:flex-start}
  .ev.flip .dress.soft .swatches{justify-content:flex-start}
  .ev.flip .dress.soft .dc-more,.ev.flip .dress.soft .dc-hint{text-align:left}
}

body:not(.family) .visit-grid{grid-template-columns:repeat(2,1fr);max-width:720px;margin:0 auto}
@media (max-width:900px){body:not(.family) .visit-grid{grid-template-columns:1fr}}

/* ---------- grandparents & raised-by ---------- */
.grand{display:grid;grid-template-columns:1fr auto 1fr;gap:10px 34px;align-items:start;max-width:820px;margin:14px auto 4px}
.gp{display:flex;flex-direction:column;gap:3px}
.gp:first-child{text-align:right}.gp:last-child{text-align:left}
.gp-lab{font-family:var(--f-caps);letter-spacing:.22em;text-transform:uppercase;font-size:10.5px;font-weight:600;color:var(--gold);margin-bottom:4px}
.gp-n{font-family:var(--f-display);font-size:18px;line-height:1.35;color:var(--ink)}
.gp-n em{font-style:italic;color:var(--muted);font-size:.88em}
.gp-dot{width:1px;align-self:stretch;background:linear-gradient(transparent,var(--gold-soft),transparent)}
.raised{margin-top:10px;font-family:var(--f-display);font-style:italic;font-size:15px;color:var(--muted);opacity:.85}
.ev .desc b{font-family:var(--f-caps);letter-spacing:.12em;font-weight:700;color:var(--gold);font-size:.9em}
.pills input[type=checkbox]+span::before{content:"";display:inline-block;width:10px;height:10px;margin-right:8px;border:1px solid currentColor;transform:rotate(45deg) translateY(-1px)}
.pills input[type=checkbox]:checked+span::before{background:#fff6e6;border-color:#fff6e6}
@media (max-width:900px){
  .grand{grid-template-columns:1fr;gap:18px}
  .gp:first-child,.gp:last-child{text-align:center}
  .gp-dot{display:none}
  .gp-n{font-size:16px}
  .raised{font-size:13px}
}