/* The celebrations — immersive artwork, cinematic motion, accessible selection */
:root{--ease-story:cubic-bezier(.22,.86,.26,1)}
.story-experience{padding-bottom:57px}
.story-heading .section-intro{max-width:630px}
.story-stage{
  height:492px;
  overflow:hidden;
  border:1px solid rgba(184,128,144,.44);
  box-shadow:0 30px 80px rgba(83,47,65,.18),0 0 0 7px rgba(255,252,248,.58);
  background:#ecd5c9;
  isolation:isolate
}
.story-stage::after{z-index:8;pointer-events:none}
.story-scene{
  padding:46px 57px 50px 70px;grid-template-columns:39% 61%;
  transform:translateX(35px) scale(1.035);opacity:0;
  clip-path:inset(0 0 0 100%);
  filter:blur(12px);
  transition:clip-path 1050ms cubic-bezier(.72,.05,.17,1),transform 1100ms var(--ease-story),opacity 530ms,filter 860ms;
  overflow:hidden
}
.story-scene.is-active{transform:none;opacity:1;clip-path:inset(0);filter:none}
.scene-copy{z-index:5}
.scene-act{letter-spacing:.23em;font-size:10px;font-weight:600}
.scene-script{font-size:clamp(41px,4.8vw,65px)}
.scene-name{font-size:clamp(68px,8vw,112px);line-height:.95}
.scene-date{letter-spacing:.065em}
.scene-visual{z-index:3;position:relative;min-width:0;height:100%;display:grid;place-items:center}
.scene-visual img{
  position:relative;width:112%;max-width:none;height:115%;
  object-fit:contain;filter:drop-shadow(0 24px 21px rgba(63,38,50,.12));
  transform:scale(.91) translateY(28px);
  opacity:0;
}
.story-scene.is-active .scene-visual img{
  animation:illustrationEnter 1120ms var(--ease-story) .14s forwards,illustrationHover 7s ease-in-out 1.5s infinite;
}
@keyframes illustrationEnter{from{opacity:0;transform:scale(.91) translateY(28px);filter:blur(8px) drop-shadow(0 16px 15px rgba(63,38,50,.12))}to{opacity:1;transform:scale(1) translateY(0);filter:blur(0) drop-shadow(0 24px 21px rgba(63,38,50,.12))}}
@keyframes illustrationHover{0%,100%{translate:0 0}50%{translate:0 -7px}}
.story-scene.is-active .scene-visual{animation:none}
.scene-visual::before{
  content:'';position:absolute;inset:8% 8% 7%;border-radius:50%;
  background:radial-gradient(circle,rgba(255,253,240,.22),transparent 67%);
  filter:blur(17px);pointer-events:none;z-index:-1
}
.scene-visual::after{
  content:'';position:absolute;inset:auto 12% 8%;height:20%;
  background:radial-gradient(ellipse,#49324e28,transparent 70%);filter:blur(12px);z-index:-1
}
.scene-haldi{background:radial-gradient(ellipse at 70% 55%,#fbedcf 3%,#eac8a2 69%,#e5b793);color:#704b42}
.scene-sangeet{background:radial-gradient(ellipse at 72% 40%,#8b7189,#56455f 51%,#342d46 100%);color:#fff6f4}
.scene-wedding{background:radial-gradient(ellipse at 68% 40%,#e6c1c8,#ba8498 48%,#794b65);color:#fff9f4}
.scene-haldi .scene-name{color:#6e4e40}
.scene-sangeet .scene-name,.scene-wedding .scene-name{color:#fffcf7}
.scene-wedding .scene-script,.scene-sangeet .scene-script{color:#f7d9d7}
.scene-atmos{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
.scene-atmos i,.card-atmos i{
  position:absolute;width:6px;height:6px;border-radius:50%;
  background:rgba(255,246,211,.87);box-shadow:0 0 9px rgba(255,244,205,.8);
  opacity:0;pointer-events:none
}
.story-scene.is-active .scene-atmos i{animation:atmosRise var(--duration,5s) ease-in-out var(--delay,0s) infinite}
.scene-atmos i:nth-child(1){left:58%;top:78%;--duration:4.9s;--delay:-1s}
.scene-atmos i:nth-child(2){left:75%;top:26%;--duration:5.7s;--delay:-3s}
.scene-atmos i:nth-child(3){left:88%;top:70%;--duration:5.3s;--delay:-2s}
.scene-atmos i:nth-child(4){left:94%;top:35%;--duration:7s;--delay:-5s}
.scene-atmos i:nth-child(5){left:50%;top:43%;--duration:6s;--delay:-2.5s}
.scene-atmos i:nth-child(6){left:67%;top:88%;--duration:6.6s;--delay:-4s}
.scene-atmos i:nth-child(7){left:82%;top:13%;--duration:5s;--delay:-1.7s}
.scene-haldi .scene-atmos i{background:#f4bc61;box-shadow:0 0 9px #f2be6a}
.scene-wedding .scene-atmos i{background:#ffe4cf;box-shadow:0 0 10px #fff3d7}
@keyframes atmosRise{0%,100%{opacity:0;transform:translate3d(0,18px,0) scale(.65)}30%,65%{opacity:.75}70%{transform:translate3d(12px,-18px,0) scale(1.2)}}
.story-stage:focus-visible{outline:3px solid #ba8290;outline-offset:5px}
.story-progress{display:flex;gap:7px;width:100%;margin:20px 0 0;align-items:center}
.story-progress>span{flex:1;height:3px;background:#e5cbd1;border-radius:99px;overflow:hidden;position:relative}
.story-progress>span::before{content:'';position:absolute;inset:0;background:#a66f83;transform-origin:left;transform:scaleX(0);transition:transform .65s var(--ease-story)}
.story-progress>span.is-complete::before,.story-progress>span.is-current::before{transform:scaleX(1)}
.story-progress>span.is-current::before{background:#774b60}
.story-instruction{font-size:12px;color:#8c6f7b;letter-spacing:.05em}
.story-controls{margin-top:28px;padding-bottom:10px;border:0}
.story-tab{transition:background .25s,border .25s,transform .25s}
.story-tab:focus-visible,.art-open:focus-visible,.event-preview:focus-visible{outline:3px solid #bd8698;outline-offset:4px}
/* Detailed illustrated invitations, not icon tiles */
.event-grid{align-items:stretch;gap:26px}
.event-card{
  display:flex;flex-direction:column;cursor:default;
  overflow:hidden;border:1px solid #e4c3cb;background:#fffcfa;
  box-shadow:0 20px 50px rgba(95,61,74,.08);
  transition:transform .55s var(--ease-story),box-shadow .55s,border-color .45s
}
.event-card::before{display:none}
.event-card.is-selected{
  border-color:#b9798e;box-shadow:0 24px 55px rgba(106,66,83,.15)
}
.event-card.is-selected .event-name{color:#85495f}
.event-art{
  display:block;height:288px;overflow:hidden;isolation:isolate;
  position:relative;background:#f3ddc7
}
.event-art::before{inset:11px;border:1px solid rgba(255,252,245,.48);z-index:4;pointer-events:none}
.event-art img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center center;z-index:1;
  transform:scale(1.005);filter:saturate(.96);
  transition:transform 900ms var(--ease-story),filter 700ms
}
.event-card:hover .event-art img,.event-card:focus-within .event-art img{
  transform:scale(1.082);filter:saturate(1.07)
}
.event-art::after{
  content:'';position:absolute;inset:0;z-index:2;opacity:.62;
  background:linear-gradient(to top,rgba(60,38,50,.16),transparent 38%);
  transform:none;transition:opacity .35s
}
.event-card:hover .event-art::after{opacity:.88;transform:none}
.event-art.art-haldi{background:#f3d6b0}
.event-art.art-sangeet{background:#55465e}
.event-art.art-wedding{background:#b3859c}
.card-atmos{position:absolute;inset:0;pointer-events:none;z-index:3}
.card-atmos i{animation:atmosRise var(--duration,4.9s) ease-in-out var(--delay,-1s) infinite}
.card-atmos i:nth-child(1){top:80%;left:18%;--duration:5.3s;--delay:-2s}
.card-atmos i:nth-child(2){top:64%;left:76%;--duration:4.6s;--delay:-4s}
.card-atmos i:nth-child(3){top:35%;left:22%;--duration:6.7s;--delay:-1s}
.card-atmos i:nth-child(4){top:23%;left:84%;--duration:4.8s;--delay:-3s}
.card-atmos i:nth-child(5){top:84%;left:56%;--duration:6.3s;--delay:-3.8s}
.art-haldi .card-atmos i{background:#ffe4a0;box-shadow:0 0 10px #f6d69c}
.art-wedding .card-atmos i{background:#ffe0d2;box-shadow:0 0 10px #fff1df}
.art-open{
  position:absolute;inset:0;z-index:5;display:block;width:100%;height:100%;
  background:transparent;border:0;cursor:pointer;color:transparent;
  font-size:0;padding:0;
}
.art-label{
  position:absolute;z-index:4;bottom:21px;left:22px;color:#fffaf4;
  font-size:10px;text-transform:uppercase;letter-spacing:.2em;
  font-weight:700;text-shadow:0 1px 12px rgba(50,33,42,.7);
  pointer-events:none
}
.art-haldi .art-label{color:#6c4839;text-shadow:0 1px 10px rgba(255,252,239,.7)}
.event-content{
  padding:33px 22px 35px;display:flex;align-items:center;flex-direction:column;flex:1
}
.event-content::after{display:none}
.event-index{font-size:10px;color:#ac7585}
.event-name{font-size:58px;margin:13px 0 19px}
.event-time{font-size:13px}
.event-location{margin-bottom:16px}
.event-actions{
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  width:100%;margin-top:auto;padding-top:9px;gap:15px
}
.event-preview{
  appearance:none;cursor:pointer;display:inline-flex;
  justify-content:center;align-items:center;gap:9px;
  width:min(100%,252px);padding:13px 17px;background:#754553;color:#fffaf6;
  border:1px solid #754553;border-radius:2px;
  font-size:10px;font-weight:650;text-transform:uppercase;letter-spacing:.12em;
  transition:transform .3s,background .3s,border-color .3s
}
.event-preview:hover{background:#9b6276;border-color:#9b6276;transform:translateY(-2px)}
.event-preview:active{transform:scale(.98)}
.event-preview span{font-size:17px;line-height:0}
.event-cal{padding:7px 5px;border-bottom-color:#cfabb6}
.event-card:hover{transform:translateY(-7px)}
/* responsive galleries and accessible motion */
@media(max-width:1000px) and (min-width:761px){
  .event-art{height:245px}.event-name{font-size:51px}.event-preview{font-size:9px}
  .story-scene{grid-template-columns:41% 59%;padding:46px 35px}
}
@media(max-width:760px){
  .story-experience{padding-bottom:35px}
  .story-stage{height:555px}
  .story-scene{grid-template-columns:1fr;grid-template-rows:43% 57%;padding:30px 25px 16px}
  .scene-visual img{width:112%;height:114%;max-width:none}
  .scene-name{font-size:clamp(58px,11vw,82px);margin-bottom:14px}
  .scene-script{font-size:42px}
  .scene-date{font-size:12px}
  .story-progress{margin-top:16px}
  .event-grid{gap:25px}
  .event-art{height:270px}
  .event-content{padding:29px 24px 35px}
  .event-name{font-size:59px}
  .event-preview{min-height:45px}
  .event-card:active{transform:scale(.995)}
}
@media(max-width:450px){
  .story-stage{height:530px}
  .story-scene{grid-template-rows:47% 53%;padding:28px 22px 11px}
  .scene-visual img{width:116%;height:116%}
  .scene-script{font-size:39px}
  .scene-name{font-size:69px}
  .event-art{height:247px}
  .story-instruction{font-size:11px;line-height:1.6}
}
@media(prefers-reduced-motion:reduce){
  .story-scene,.story-scene.is-active{transition:none!important;filter:none!important;transform:none!important}
  .story-scene.is-active .scene-visual img{
    animation:none!important;opacity:1!important;transform:none!important;filter:none!important
  }
  .card-atmos,.scene-atmos{display:none!important}
  .event-art img,.event-card:hover .event-art img{transform:none!important;transition:none!important}
  .story-progress>span::before{transition:none!important}
}