/* The Ivory Garden — Sweety & Ripul / visual edition
   Layered over the original website, preserving invitation animation and functionality. */
:root{
  --wine:#643746;--wine-dark:#412330;--plum:#563642;
  --rose:#b98483;--cream:#f7f2e9;--paper:#fffaf2;--gold:#ac8657;
  --gold-pale:#e9d6ba;--ink:#44363a;--muted:#786a65;
  --line:rgba(120,86,67,.20);--shadow:0 25px 70px rgba(73,43,41,.065);
}
html{scroll-padding-top:90px}
body{
  font-family:'DM Sans',sans-serif;color:var(--ink);
  background:var(--cream);font-weight:400;
}
.serif,.section-title,.intro-copy,.event-name,.footer-names,.scene-name,.count-num,.gate-heading{
  font-family:'Cormorant Garamond',Georgia,serif;
}
.script,.amp,.intro .script,.scene-script,.footer-names span,.gate-ring i{
  font-family:'Italianno','Great Vibes',cursive;
}
.eyebrow,.section-kicker,.event-index,.scene-act,.countdown-label{
  font-weight:500;letter-spacing:.3em;font-size:10px;
}
.container{width:min(1180px,calc(100% - 80px))}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{
  outline:2px solid #b99664;outline-offset:4px;
}
/* The discreet, typographic navigation */
.nav{
  height:89px;padding:0 max(5.3%,26px);
  border-bottom:1px solid rgba(164,126,93,.09);
  color:var(--wine-dark);z-index:28;
}
body.scrolled .nav{
  background:rgba(251,246,237,.94);
  border-bottom-color:rgba(120,86,67,.17);
  box-shadow:0 8px 40px rgba(65,35,48,.055);
}
.monogram{
  width:55px;height:55px;display:flex;align-items:center;justify-content:center;
  gap:3px;border:1px solid rgba(172,134,87,.5);border-radius:50%;
  font-family:'Cormorant Garamond',Georgia,serif;font-size:24px;
  font-weight:500;letter-spacing:-.065em;
}
.monogram span{font-size:26px;color:#9a6b69;margin:0 1px}
.nav-links{gap:38px;font-size:10px;letter-spacing:.23em;font-weight:600}
.nav-links a:not(.nav-rsvp):after{
  content:'';position:absolute;bottom:-8px;left:0;right:100%;height:1px;
  background:var(--gold);transition:right .35s ease;
}
.nav-links a:not(.nav-rsvp):hover:after{right:0}
.nav-links .nav-rsvp{
  border-radius:2px;padding:14px 24px;background:var(--wine-dark);
  color:#fffaf1;font-size:10px;letter-spacing:.18em;box-shadow:none;
}
.nav-links .nav-rsvp:hover{background:#8c5660}
/* A wedding letter instead of an ordinary hero */
.hero{
  min-height:900px;padding:138px 20px 100px;
  background:
    radial-gradient(ellipse at 52% 52%,rgba(255,254,246,.95) 0%,rgba(254,248,236,.78) 40%,transparent 73%),
    radial-gradient(ellipse at 5% 100%,#e1d6c7 0%,transparent 53%),
    radial-gradient(ellipse at 95% 25%,#f0e6db 0%,transparent 57%),
    #f8f2e9;
  isolation:isolate;
}
.hero:after{
  inset:19px;border:1px solid rgba(157,122,82,.28);border-radius:0;
  box-shadow:inset 0 0 0 7px rgba(255,255,255,.15);
}
.hero:before{
  content:'';z-index:0;pointer-events:none;position:absolute;
  left:50%;top:64px;transform:translateX(-50%);
  width:min(900px,92vw);height:85%;
  background:radial-gradient(ellipse at 50% 44%,rgba(226,210,186,.19),transparent 64%);
}
.hero-arch{
  width:min(580px,72vw);height:715px;top:110px;
  border-radius:320px 320px 0 0;border:1px solid rgba(176,137,88,.57);
  background:linear-gradient(180deg,rgba(255,253,245,.60),rgba(249,234,210,.18) 53%,rgba(255,248,233,.03) 97%);
  box-shadow:0 0 0 8px rgba(225,195,154,.045),inset 0 0 75px rgba(208,183,150,.075);
}
.hero-arch:before{
  inset:12px;border-radius:320px 320px 0 0;
  border-color:rgba(185,147,96,.32);
}
.hero-arch:after{width:290px;height:290px;top:105px;filter:blur(55px);opacity:.6}
.hero-content{max-width:850px;transform:translateY(0)}
.hero .eyebrow{
  color:#8f7655;font-size:11px;letter-spacing:.38em;
  margin:0 0 17px;text-shadow:0 1px #fff;
}
.flourish{margin-bottom:29px;color:#b49166;gap:16px}
.flourish .line{width:90px;background:linear-gradient(90deg,transparent,#b89d77)}
.flourish svg{width:22px;height:22px}
.hero h1{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(88px,11vw,156px);font-weight:400;
  letter-spacing:-.083em;line-height:.75;color:#673846;
  text-shadow:0 7px 36px rgba(135,100,96,.07);
}
.hero .names-last{margin-left:0}
.amp{
  font-family:'Italianno','Great Vibes',cursive;
  display:block;font-size:clamp(88px,10.5vw,150px);
  line-height:.75;color:#b28f76;margin:12px 0 20px;
  transform:rotate(-8deg);letter-spacing:0;
}
.hero-subtitle{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(21px,2.6vw,30px);font-style:italic;
  color:#78645b;letter-spacing:.012em;margin:35px 0 21px;
}
.hero-date{
  font-size:11px;letter-spacing:.3em;font-weight:600;color:#876d54;
  margin-top:20px;line-height:1.8;
}
.hero-actions{margin-top:35px;gap:13px}
.btn{
  border-radius:2px;font-size:10px;letter-spacing:.19em;
  font-weight:600;padding:17px 28px;
  transition:transform .35s cubic-bezier(.2,.7,.2,1),background .35s,border-color .35s,box-shadow .35s;
}
.btn-primary{background:#633848;color:#fffaf2;box-shadow:0 12px 27px rgba(83,50,57,.12)}
.btn-primary:hover{background:#452532;box-shadow:0 16px 32px rgba(83,50,57,.17)}
.btn-outline{background:rgba(255,251,244,.65);border-color:#b59a7b;color:var(--wine-dark)}
.btn-outline:hover{background:#fff8eb}
.hero-botanical{width:clamp(260px,34vw,510px);opacity:.78;color:#a49179}
.hero-botanical.left{left:-52px;bottom:-28px}
.hero-botanical.right{right:-52px;bottom:-28px}
.hero-botanical .petal{fill:#c58f8e;stroke:#ae8278;fill-opacity:.19}
.hero-botanical .leaf{fill:#879278;stroke:#808973;fill-opacity:.25}
.sparkle{color:#ac936b;opacity:.44}
.hero-side-note{
  position:absolute;z-index:3;top:51%;left:33px;
  transform:translateY(-50%);writing-mode:vertical-rl;
  font:500 9px/1 'DM Sans',sans-serif;letter-spacing:.39em;
  color:rgba(111,82,69,.66);text-transform:uppercase;pointer-events:none;
}
.hero-side-note.right{left:auto;right:33px;transform:translateY(-50%) rotate(180deg)}
.hero-seal{
  width:56px;height:56px;margin:0 auto 24px;
  display:grid;place-items:center;border:1px solid rgba(170,137,93,.48);
  border-radius:50%;color:#9a765d;font:italic 25px/1 'Cormorant Garamond',serif;
  position:relative;
}
.hero-seal:after{content:'';position:absolute;inset:5px;border:1px solid rgba(177,145,97,.25);border-radius:50%}
.replay-intro-btn{color:#8f786b;font-size:9px;letter-spacing:.17em}
.scroll-hint{color:#917761;letter-spacing:.3em;bottom:34px}
/* The invitation, letterpress-inspired */
.intro{
  padding:143px 24px 132px;
  background:
    radial-gradient(ellipse at 0% 70%,#f1e1dc 0%,transparent 45%),
    radial-gradient(ellipse at 100% 15%,#f6eae1 0%,transparent 50%),#fbf7f0;
  border-top:1px solid rgba(158,128,93,.19);border-bottom:1px solid rgba(158,128,93,.16);
}
.intro::before,.intro::after{
  content:'❧';font-size:39px;color:#b09b83;top:43%;
}
.intro .script{font-size:clamp(46px,6.5vw,78px);color:#ad807b;line-height:.92;margin-bottom:23px}
.intro-copy{
  font-size:clamp(29px,4.2vw,53px);font-weight:400;line-height:1.24;
  letter-spacing:-.018em;max-width:870px;color:#65424b;
}
.intro-note{font-size:10px;letter-spacing:.29em;color:#927d70;margin-top:35px}
.intro .reveal:after{
  content:'✧';display:block;margin:42px auto 0;font:28px Georgia,serif;color:#b69a70;
}
/* Quiet countdown */
.countdown-section{background:#eee6d9;padding:53px 20px 61px}
.countdown-section:before,.countdown-section:after{background:#d9c9b5}
.countdown-label{color:#917554;letter-spacing:.36em;margin-bottom:23px}
.countdown{gap:clamp(20px,6vw,83px)}
.count-num{font-size:clamp(44px,6vw,65px);font-weight:400;line-height:1}
.count-name{font-size:9px;letter-spacing:.27em;color:#8f7b70}
.count-item:not(:last-child):after{color:#b3a186;font-size:19px;top:16px}
/* Dramatic page-turn chapters */
.story-experience{
  background:
    radial-gradient(circle at 96% 8%,rgba(227,202,166,.12),transparent 35%),#f9f5ee;
  padding:120px 0 42px;
}
.story-experience:before{opacity:.28}
.story-heading{margin-bottom:49px}
.section-title{
  font-size:clamp(49px,6vw,80px);line-height:1.03;letter-spacing:-.045em;
  font-weight:400;color:#673a47;
}
.story-heading .section-title{font-size:clamp(46px,5.3vw,68px)}
.section-intro{font-size:14px;line-height:1.9;color:#80716a;max-width:550px}
.story-stage{
  height:465px;border-radius:3px;border:1px solid rgba(132,91,70,.2);
  box-shadow:0 27px 73px rgba(66,37,49,.15);
}
.story-stage::after{inset:17px;border:1px solid rgba(255,246,227,.43);border-radius:0}
.story-scene{
  padding:56px 80px 58px 91px;
  grid-template-columns:43% 57%;
  clip-path:inset(0 0 0 100%);
}
.story-scene.is-active{clip-path:inset(0 0 0 0)}
.scene-haldi{background:radial-gradient(ellipse at 78% 48%,#fff2c5 0%,#f4dea5 47%,#e9b977 100%);color:#674b38}
.scene-sangeet{background:radial-gradient(ellipse at 78% 40%,#6d667c 0%,#383449 48%,#242738 100%);color:#fff5eb}
.scene-wedding{background:radial-gradient(ellipse at 75% 32%,#b16e7e 0%,#854758 45%,#512b3c 100%);color:#fff9ed}
.scene-act{font-size:10px;letter-spacing:.34em}
.scene-script{font-size:clamp(42px,4.5vw,66px);margin:0 0 -5px}
.scene-name{
  font-size:clamp(78px,9vw,124px);font-weight:400;letter-spacing:-.048em;
  line-height:.9;margin-bottom:30px;
}
.scene-date{font-size:12px;font-weight:600;letter-spacing:.1em}
.scene-venue{font-size:12px}
.scene-visual svg{max-height:355px;filter:drop-shadow(0 18px 20px rgba(55,31,36,.13))}
.story-controls{
  border-bottom:1px solid rgba(138,105,80,.23);padding-bottom:25px;margin-top:27px;
}
.story-tab{
  border-radius:2px;padding:13px 20px;background:#fbf7ef;
  color:#8d716a;font-weight:600;letter-spacing:.16em;border-color:#d9c8b5;
}
.story-tab.is-active{background:#633847;border-color:#633847}
.story-play{border-radius:2px;padding:13px 17px;font-size:10px;letter-spacing:.12em}
.story-arrow{border-radius:50%;background:#fbf7f0}
.story-instruction{margin-top:21px;letter-spacing:.08em}
/* Celebration event cards */
.events{background:#f9f5ef}
.events.section{padding-top:95px;padding-bottom:142px}
.event-grid{margin-top:69px;gap:25px}
.event-card{
  background:#fffcf7;border:1px solid rgba(155,123,93,.26);
  box-shadow:0 21px 46px rgba(76,52,46,.055);overflow:visible;
}
.event-card:before{
  content:'✦';position:absolute;z-index:3;left:50%;top:-15px;
  transform:translateX(-50%);width:29px;height:29px;display:grid;place-items:center;
  border-radius:50%;font-size:12px;font-weight:400;
  color:#ab885e;background:#f9f5ee;
}
.event-card:hover{box-shadow:0 30px 65px rgba(82,52,47,.11);transform:translateY(-8px)}
.event-art{height:268px;overflow:hidden}
.event-art::before{inset:11px;border:1px solid rgba(255,255,255,.57)}
.art-haldi{background:radial-gradient(circle at 48% 48%,#fff3ce 0%,#f2d9a0 71%,#e8c88b 100%)}
.art-sangeet{background:radial-gradient(circle at 50% 45%,#73748a 0%,#444455 63%,#343440 100%)}
.art-wedding{background:radial-gradient(circle at 50% 36%,#ad7683 0%,#744755 68%,#5c3546 100%)}
.event-art svg{width:195px;height:190px}
.event-content{padding:43px 24px 45px}
.event-index{font-size:9px;letter-spacing:.28em;font-weight:600;color:#a58064}
.event-name{font-size:clamp(49px,4.6vw,63px);line-height:1;margin:14px 0 22px;color:#66404a;letter-spacing:-.048em}
.event-divider{background:#beaa90;margin-bottom:22px}
.event-time{font-weight:500;font-size:13px;line-height:1.8;color:#64545a}
.event-location{font-size:12px;color:#8b7e78;margin-top:9px;margin-bottom:25px}
.event-cal{font-weight:600;font-size:10px;letter-spacing:.15em;border-bottom-color:#b9a08b;padding-bottom:7px}
.events-foot{color:#9a8880;margin-top:36px;letter-spacing:.03em}
/* Palace location as a chapter on wine */
.venue{
  background:
    radial-gradient(ellipse at 10% 82%,rgba(182,129,130,.13),transparent 50%),
    linear-gradient(135deg,#532f3e,#4a2938 65%,#3e2534);color:#fff5e8;
}
.venue.section{padding:112px 0}
.venue:before{inset:24px;border-color:rgba(225,192,158,.22)}
.venue-inner{min-height:470px;gap:80px}
.venue .section-kicker{color:#d2b28d}
.venue .section-title{color:#fff1e3;font-size:clamp(62px,6vw,79px)}
.venue-copy{color:#eedbd0;font-size:15px;line-height:1.85;max-width:380px}
.venue-illustration svg{color:#e2c29d}
.venue-illustration:before{background:#cf9b95;opacity:.09;filter:blur(40px)}
.venue-address{color:#f5e2d1}
.btn-light{background:#f8eee0;color:#5b3945}
.btn-light:hover{background:#e9d6bc}
/* Closing note and RSVP */
.dress{background:#fffbf4;padding:119px 20px 124px;position:relative}
.dress:before{
  content:'';width:1px;height:55px;position:absolute;left:50%;top:0;
  background:linear-gradient(transparent,#b69a79);
}
.dress .section-title{font-style:italic;font-size:clamp(42px,6vw,72px)}
.dress-symbol{border-color:#d4bc9d;color:#a68560;border-radius:50%;font-size:31px}
.dress-line{background:#d4bc9d}
.dress-note{font-size:14px}
.rsvp{
  background:radial-gradient(ellipse at 0 15%,#eadad5 0%,transparent 45%),#f3e9df;
  padding:133px 0 145px;
}
.rsvp-wrap{gap:clamp(45px,8vw,110px)}
.rsvp-text .section-title{font-size:clamp(56px,6.3vw,83px)}
.rsvp-card{
  padding:50px 48px 46px;background:#fffcf7;
  border:1px solid #dac6b1;box-shadow:0 24px 65px rgba(83,55,53,.085);
  position:relative;
}
.rsvp-card:before{content:'';position:absolute;inset:10px;border:1px solid rgba(174,145,111,.25);pointer-events:none}
.rsvp-card h3{font:400 39px/1.05 'Cormorant Garamond',Georgia,serif;color:#653e4a}
.rsvp-card .form-intro{color:#917f76}
.field label{color:#785e62;letter-spacing:.16em;font-size:10px;font-weight:600}
.field input,.field select{
  height:53px;background:#fffdfa;border:1px solid #d9c7b7;color:#4b3c3f;
  border-radius:2px;padding:0 15px;
}
.field input:focus,.field select:focus{border-color:#a17a68;box-shadow:0 0 0 3px rgba(160,121,104,.09)}
.footer{
  background:#3c2733;color:#f7ebdc;padding:92px 20px 30px;
  border-top:1px solid rgba(216,185,150,.2);
}
.footer-kicker{color:#dbc19f;letter-spacing:.36em}
.footer-names{font-size:clamp(59px,7vw,85px);font-weight:400;letter-spacing:-.055em}
.footer-names span{font-size:1.14em;color:#d4afa5}
.footer-note{color:#d9c3b6;letter-spacing:.13em;font-size:12px}
.footer-bottom{border-color:rgba(237,205,172,.14);color:#c9aca1}
/* Opening gate shares the same visual language */
.gate-leaf{
  background:radial-gradient(ellipse at 60% 40%,#805061 0%,#593242 53%,#38232f 100%);
  box-shadow:inset 0 0 0 18px rgba(220,183,142,.045);
}
.gate-leaf:before{border-color:rgba(230,194,147,.38);inset:26px}
.gate-ring{border-color:#dfbf9a;font-family:'Cormorant Garamond',serif;font-size:60px}
.gate-kicker{letter-spacing:.42em}
.gate-heading{font-size:clamp(33px,5vw,49px);letter-spacing:-.03em}
.gate-skip{border-radius:2px;background:rgba(80,39,52,.75)}
/* Deliberate micro-interactions */
.event-card,.btn,.story-stage,.story-tab,.nav-links a{
  transition-timing-function:cubic-bezier(.22,.78,.25,1);
}
.reveal{transition-duration:1.15s}
::selection{background:#dbc0b3;color:#442735}
@media (min-width:1400px){
  .hero{min-height:980px}
  .hero-arch{top:131px;height:755px}
}
@media(max-width:950px){
  .container{width:min(100% - 48px,1180px)}
  .hero-botanical.left{left:-115px}
  .hero-botanical.right{right:-115px}
  .venue-inner{gap:32px}
  .rsvp-wrap{gap:36px}
  .story-scene{padding:48px 50px}
  .scene-name{font-size:clamp(68px,9vw,102px)}
}
@media(max-width:760px){
  .container{width:calc(100% - 42px)}
  .nav{height:72px;padding:0 22px}
  .monogram{width:44px;height:44px;font-size:21px}
  .monogram span{font-size:22px}
  .nav-links{
    top:71px;right:12px;left:12px;padding:24px 23px 25px;
    background:#fbf5ea;gap:26px;text-align:center;border:1px solid #d8bfa7;
    box-shadow:0 25px 50px rgba(50,30,30,.13);
  }
  .menu-toggle{background:rgba(252,246,235,.94);border-color:rgba(155,121,90,.4)}
  .hero{min-height:850px;padding:139px 18px 100px}
  .hero:after{inset:11px}
  .hero-arch{width:min(490px,87vw);height:690px;top:93px}
  .hero h1{font-size:clamp(83px,14vw,114px)}
  .amp{font-size:112px;margin:8px 0 19px}
  .hero-subtitle{font-size:24px;line-height:1.08;max-width:300px;margin:31px auto 21px}
  .hero .eyebrow{font-size:9px;letter-spacing:.27em}
  .hero-side-note{display:none}
  .hero-botanical{width:290px;opacity:.61}
  .hero-botanical.left{left:-160px;bottom:4px}
  .hero-botanical.right{right:-160px;bottom:4px}
  .intro{padding:112px 23px 102px}
  .intro-copy{font-size:clamp(29px,6.2vw,44px)}
  .intro .script{font-size:62px}
  .story-experience{padding:95px 0 30px}
  .story-stage{height:552px}
  .story-scene{
    grid-template-columns:1fr;grid-template-rows:49% 51%;
    padding:37px 33px 15px;clip-path:inset(0 0 0 100%);
  }
  .story-scene.is-active{clip-path:inset(0)}
  .scene-name{font-size:clamp(67px,12vw,90px);margin-bottom:15px}
  .scene-script{font-size:49px}
  .scene-visual svg{max-height:270px}
  .story-controls{gap:16px}
  .story-tab{padding:11px 14px}
  .events.section{padding:83px 0 105px}
  .event-grid{grid-template-columns:1fr;max-width:465px}
  .event-card{margin-top:7px}
  .event-art{height:234px}
  .event-content{padding:34px 24px 39px}
  .event-name{font-size:61px}
  .venue.section{padding:92px 0 85px}
  .venue-inner{grid-template-columns:1fr;gap:0;text-align:center}
  .venue-info{order:1}.venue-illustration{order:2}
  .venue .section-title{font-size:73px}
  .venue-copy{margin:20px auto 26px}
  .venue-address{justify-content:center;text-align:left}
  .dress{padding:95px 20px}
  .rsvp{padding:95px 0 107px}
  .rsvp-wrap{grid-template-columns:1fr;gap:45px}
  .rsvp-text{text-align:center;max-width:none}
  .rsvp-text .section-intro{margin:18px auto 0}
  .rsvp-flowers{display:none}
  .rsvp-card{max-width:510px;margin:auto;width:100%}
}
@media(max-width:450px){
  .container{width:calc(100% - 34px)}
  .hero{min-height:805px;padding:115px 15px 100px}
  .hero-arch{top:86px;height:653px;width:89vw}
  .hero h1{font-size:clamp(74px,17.5vw,89px)}
  .amp{font-size:100px;margin:7px 0 17px}
  .hero .eyebrow{font-size:8px}
  .hero .flourish{margin-bottom:24px}
  .hero-seal{width:46px;height:46px;font-size:23px;margin-bottom:16px}
  .hero-subtitle{font-size:22px;margin:26px auto 18px}
  .hero-date{font-size:9px;line-height:2;letter-spacing:.2em;margin-top:18px}
  .hero-actions{margin-top:25px;gap:10px}
  .hero-actions .btn{width:210px;padding:14px 16px}
  .hero-botanical.left{left:-177px}
  .hero-botanical.right{right:-177px}
  .flourish .line{width:58px}
  .intro{padding:94px 20px 85px}
  .intro-copy{font-size:29px}
  .intro-note{font-size:9px;line-height:1.8}
  .countdown{gap:14px}
  .count-item{min-width:53px}
  .count-num{font-size:46px}
  .count-item:not(:last-child):after{right:-10px}
  .story-experience{padding:82px 0 23px}
  .story-heading{margin-bottom:29px}
  .story-heading .section-title{font-size:47px}
  .story-stage{height:530px}
  .story-scene{padding:35px 25px 14px;grid-template-rows:50% 50%}
  .scene-name{font-size:73px}
  .scene-script{font-size:43px}
  .scene-visual svg{max-height:231px}
  .story-tabs{gap:6px}
  .story-tab{padding:10px 12px;font-size:9px}
  .event-name{font-size:57px}
  .venue .section-title{font-size:65px}
  .rsvp-card{padding:42px 27px 38px}
  .rsvp-card h3{font-size:35px}
  .footer-names{font-size:59px}
}
@media(prefers-reduced-motion:reduce){
  .reveal,.reveal.on{filter:none!important}
  .hero .hero-seal{animation:none!important}
}