*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f4efe4;color:#173c31;font-family:Inter,Arial,sans-serif;overflow-x:hidden}.envelope-screen{position:fixed;inset:0;z-index:50;background:radial-gradient(circle at 50% 20%,#315f4f,#173c31 60%,#102b23);color:#f6f0e5;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:.9s}.envelope-screen.gone{opacity:0;visibility:hidden}.ornamental-mark{position:absolute;top:28px;color:#d0ad65;font-size:28px}.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:10px;font-weight:600;color:#8d733c}.light{color:#d6ba72}.envelope-screen>.eyebrow{position:absolute;top:16%}.envelope{position:relative;width:min(84vw,390px);height:250px;border:0;background:transparent;perspective:1000px;cursor:pointer}.env-back{position:absolute;inset:30px 0 0;background:#e7ddcd;border-radius:4px;z-index:1}.letter{position:absolute;left:8%;right:8%;top:42px;height:185px;background:#faf7ef;border:1px solid #d4c49d;z-index:2;display:flex;flex-direction:column;justify-content:center;gap:7px;transition:1s .3s}.letter span{font-family:Italiana,serif;color:#a3813d;font-size:13px;letter-spacing:.13em;text-transform:uppercase}.letter strong{font-family:'Cormorant Garamond',serif;color:#173c31;font-size:29px}.env-front{position:absolute;inset:30px 0 0;z-index:4;background:linear-gradient(150deg,transparent 49%,#ded2bf 50%) left/50% 100% no-repeat,linear-gradient(210deg,transparent 49%,#e8decd 50%) right/50% 100% no-repeat,linear-gradient(30deg,#e5dac7 49%,transparent 50%) left/50% 100% no-repeat,linear-gradient(-30deg,#eee4d5 49%,transparent 50%) right/50% 100% no-repeat}.env-flap{position:absolute;left:0;right:0;top:30px;height:135px;background:#eee4d5;clip-path:polygon(0 0,100% 0,50% 100%);transform-origin:top;z-index:6;transition:.85s}.seal{position:absolute;z-index:8;top:110px;left:50%;transform:translateX(-50%);width:84px;height:84px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#d8ba74,#a27a32 45%,#74531e);box-shadow:0 7px 18px #0004,inset 0 0 0 3px #7b5b25,inset 0 0 0 6px #caa85d;color:#173c31;display:flex;align-items:center;justify-content:center;gap:3px;font:700 25px 'Cormorant Garamond',serif;transition:.5s}.seal:after{content:'';position:absolute;inset:9px;border:1px solid #183c3177;border-radius:50%}.seal i{font-size:15px}.envelope.open .env-flap{transform:rotateX(180deg);z-index:0}.envelope.open .letter{transform:translateY(-100px)}.envelope.open .seal{opacity:0;transform:translateX(-50%) scale(.7)}.tap{margin:18px 0 5px;font:18px 'Cormorant Garamond',serif}.envelope-screen small{opacity:.65}.music{position:fixed;right:14px;bottom:18px;z-index:20;border:1px solid #c8a35b;background:#173c31ee;color:#f6f0e5;border-radius:30px;padding:10px 14px}.hidden{opacity:0;pointer-events:none}.main.locked{opacity:0;height:100vh;overflow:hidden;pointer-events:none}.main.ready{opacity:1;height:auto;overflow:visible;pointer-events:auto;transition:1s}.section{min-height:100svh;padding:86px 20px;display:grid;place-items:center;text-align:center;position:relative;overflow:hidden}.hero{background:radial-gradient(circle at 50% 12%,#d8bf8726,transparent 34%),#f4efe4}.ik{font-size:34px;color:#ae8a45}.mono{font:78px 'Cormorant Garamond',serif;margin:20px 0 10px}.mono em{font-size:34px;color:#b18d47}.invite{font:italic 20px 'Cormorant Garamond',serif;color:#69786e}.hero h1,.big,.arch h2,.closing h2{font-family:Italiana,serif;font-weight:400}.hero h1{font-size:clamp(48px,10vw,92px);margin:5px 0 20px}.names{font:clamp(30px,6vw,48px) 'Cormorant Garamond',serif;display:flex;justify-content:center;flex-wrap:wrap;gap:10px 16px}.names b{color:#b08c48}.rule{width:130px;height:1px;background:#b08c48;margin:22px auto}.date{font:17px 'Cormorant Garamond',serif}.scroll{position:absolute;bottom:26px;text-transform:uppercase;letter-spacing:.15em;font-size:9px}.ivory{background:#f7f2e8}.card{width:min(92vw,780px);border:1px solid #b08c4877;padding:50px 24px}.card h2{font:600 clamp(30px,6vw,48px)/1.1 'Cormorant Garamond',serif}.card h2 span{color:#b08c48}.body{max-width:560px;margin:0 auto 26px;font:19px/1.75 'Cormorant Garamond',serif;color:#485b51}.card h3{font:36px Italiana,serif;margin:8px 0}.label{text-transform:uppercase;letter-spacing:.14em;font-size:9px;color:#8a744a}.family{font:20px 'Cormorant Garamond',serif}.with{width:min(320px,80%);margin:25px auto;color:#b08c48;font:italic 18px 'Cormorant Garamond',serif}.green{background:#173c31;color:#f6f0e5}.arch{width:min(92vw,760px);min-height:610px;border:1px solid #c9a75c88;border-radius:220px 220px 12px 12px;padding:72px 22px 45px}.arch h2{font-size:clamp(48px,10vw,82px);margin:8px 0 24px}.date-disc{width:145px;height:145px;border:1px solid #c9a75c;border-radius:50%;margin:0 auto 20px;display:flex;flex-direction:column;justify-content:center;color:#d6b96f}.date-disc strong{font:56px Italiana,serif;color:#fff}.date-disc span{font-size:12px;letter-spacing:.2em}.event-day{font:21px 'Cormorant Garamond',serif}.venue{border-top:1px solid #c9a75c66;max-width:460px;margin:32px auto 0;padding-top:24px}.venue small{display:block;text-transform:uppercase;letter-spacing:.18em;color:#d1b469}.venue strong{display:block;font:32px 'Cormorant Garamond',serif;margin:7px}.big{font-size:clamp(46px,9vw,76px);margin:10px 0 35px}.count{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;width:min(92vw,680px)}.count div{border:1px solid #b08c4877;padding:22px 8px}.count strong{display:block;font:44px Italiana,serif}.count span{font-size:8px;letter-spacing:.16em;text-transform:uppercase;color:#8a744a}.actions{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:34px}.btn{padding:13px 20px;border:1px solid #b08c48;border-radius:30px;background:transparent;color:#173c31;text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:10px;cursor:pointer}.gold{background:#b08c48;color:white}.status{height:16px;font-size:11px}.hosts{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:760px}.hosts span{border:1px solid #c9a75c77;border-radius:30px;padding:12px 18px;font:30px 'Cormorant Garamond',serif}.closing{min-height:75svh;background:#eee7da}.closing-card{width:min(90vw,600px);border:1px solid #b08c4877;border-radius:230px 230px 0 0;padding:80px 20px 55px}.small{font-size:52px}.closing-card p{font:italic 19px 'Cormorant Garamond',serif;color:#68766e}.closing h2{font-size:50px;margin:16px 0 6px}.closing-card>span{font-size:10px;letter-spacing:.22em;color:#8e733d}.reveal{opacity:0;transform:translateY(24px);transition:.9s}.reveal.in{opacity:1;transform:none}@media(max-width:520px){.section{padding:74px 17px}.card{padding:44px 18px}.count{gap:5px}.count div{padding:16px 4px}.count strong{font-size:32px}.btn{width:100%;max-width:330px}}

/* V2 refinements */
.envelope{overflow:visible}
.env-back{overflow:hidden}
.floral-engraving{
  position:absolute; inset:20px 0 0; z-index:4; pointer-events:none;
  background:
    linear-gradient(rgba(239,230,215,.88),rgba(239,230,215,.88)),
    url("assets/floral-envelope-reference.png") center/cover no-repeat;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%);
  opacity:.52; mix-blend-mode:multiply;
}
.env-flap{
  background:
    linear-gradient(rgba(241,232,217,.68),rgba(241,232,217,.68)),
    url("assets/floral-envelope-reference.png") center 22%/cover no-repeat;
  z-index:6;
}
.env-front{z-index:5}
.wax-seal{z-index:8}
.envelope-wrap.open .floral-engraving{opacity:.28;transition:opacity .6s ease}
.envelope-wrap.open .env-flap{z-index:2}
.host-list.sequence{
  display:grid;
  grid-template-columns:1fr;
  justify-items:center;
  gap:12px;
  width:min(92vw,520px);
  margin-inline:auto;
}
.host-list.sequence span{
  width:min(100%,360px);
  text-align:center;
}
@media(min-width:760px){
  .host-list.sequence{grid-template-columns:1fr 1fr; width:min(760px,90vw)}
  .host-list.sequence span:last-child{grid-column:1/-1}
}


/* Soft floral engraving around clean sections */
.hero::after,
.blessings::after,
.countdown::after,
.closing::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    linear-gradient(rgba(247,242,232,.90), rgba(247,242,232,.90)),
    url("assets/soft-floral-frame.png") center/cover no-repeat;
  opacity:.18;
  mix-blend-mode:multiply;
}
.hero .hero-inner,
.blessings .content-card,
.countdown > .reveal,
.closing .closing-arch,
.closing small{
  position:relative;
  z-index:2;
}

/* Very light florals on green sections too, mostly at the edges */
.event::after,
.family::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    linear-gradient(rgba(23,60,49,.94), rgba(23,60,49,.94)),
    url("assets/soft-floral-frame.png") center/cover no-repeat;
  opacity:.16;
  mix-blend-mode:screen;
}
.event .architectural-frame,
.family > .reveal{
  position:relative;
  z-index:2;
}

/* Awaiting Eyes: desktop one-line */
.host-list.sequence{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(150px, 1fr)) !important;
  gap:12px !important;
  width:min(1180px, 92vw) !important;
  margin:0 auto !important;
  align-items:center;
  justify-content:center;
}
.host-list.sequence span{
  width:100% !important;
  text-align:center;
  white-space:nowrap;
}

/* Tablet / mobile: strict 3 + 2 sequence */
@media(max-width:900px){
  .host-list.sequence{
    grid-template-columns:repeat(6, minmax(0,1fr)) !important;
    width:min(720px, 92vw) !important;
  }
  .host-list.sequence span:nth-child(1){grid-column:1 / span 2}
  .host-list.sequence span:nth-child(2){grid-column:3 / span 2}
  .host-list.sequence span:nth-child(3){grid-column:5 / span 2}
  .host-list.sequence span:nth-child(4){grid-column:2 / span 2}
  .host-list.sequence span:nth-child(5){grid-column:4 / span 2}
}

/* Small phones: keep 3 + 2 but compact */
@media(max-width:520px){
  .host-list.sequence{gap:8px !important}
  .host-list.sequence span{
    font-size:14px !important;
    padding:10px 7px !important;
    white-space:normal;
    line-height:1.15;
  }
}




/* ===== V5 — STRICT USER CHANGES ===== */

/* Make room for decorative layers while preserving original content */
.main .section{
  isolation:isolate;
}

/* LIGHT FLORAL ENGRAVING THROUGHOUT THE WEBSITE */
.main .section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background-image:url("assets/soft-floral-frame.png");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:.13;
}

/* Ivory sections: slightly more visible embossed floral detail */
.main .section.ivory::before,
.main .hero-section::before,
.main .closing::before{
  opacity:.20;
  filter:saturate(.35) sepia(.08);
}

/* Bottle-green sections: keep floral artwork subtle and elegant */
.main .section.green::before{
  opacity:.09;
  filter:grayscale(1) brightness(2.7);
}

/* Protect content above floral background */
.main .section > *{
  position:relative;
  z-index:1;
}

/* AWAITING EYES — 3 NAMES, SIMPLE WRAPPING LAYOUT */
.hosts.awaiting-sequence{
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  align-items:stretch !important;
  gap:12px !important;
  width:min(720px, 94vw) !important;
  margin:0 auto !important;
}
.hosts.awaiting-sequence span{
  width:auto !important;
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  text-align:center !important;
  margin:0 !important;
  flex:0 1 auto !important;
}

@media(max-width:520px){
  .hosts.awaiting-sequence span{
    font-size:17px !important;
    padding:10px 14px !important;
    line-height:1.15 !important;
  }
}

/* SCROLL COPY */
.scroll{
  letter-spacing:.15em !important;
}
.scroll span{
  display:inline-block;
  margin-left:6px;
}

@media(max-width:520px){
  .scroll{
    position:static !important;
    bottom:auto !important;
    margin-top:24px !important;
  }
}

/* FINAL BRAND CREDIT */
.shaadi-credit{
  opacity:.78 !important;
  text-transform:none !important;
  letter-spacing:.08em !important;
}






/* ==========================================================
   FULL RESPONSIVE SYSTEM — MOBILE / TABLET / DESKTOP
   ========================================================== */

*,
*::before,
*::after{
  box-sizing:border-box;
}

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

html{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  margin:0;
}

img,
svg,
video,
canvas{
  max-width:100%;
  height:auto;
}

button,
a{
  -webkit-tap-highlight-color:transparent;
}

/* Generic section safety */
.section,
.main,
.hero,
.ivory,
.green,
.closing{
  width:100%;
  max-width:100%;
  overflow:hidden;
}

.section{
  min-height:100svh;
  padding-left:clamp(16px,4vw,48px);
  padding-right:clamp(16px,4vw,48px);
}

.section > *{
  max-width:100%;
}

/* Main text scaling */
.hero h1,
.event h2,
.countdown h2,
.family h2,
.closing h2{
  overflow-wrap:anywhere;
}

.names{
  width:min(100%,900px);
  margin-inline:auto;
}

.names span{
  max-width:100%;
}

/* ---------- OPENING SCREEN ---------- */

.final-opening{
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#f3eadb;
  padding:
    max(10px,env(safe-area-inset-top))
    max(10px,env(safe-area-inset-right))
    max(10px,env(safe-area-inset-bottom))
    max(10px,env(safe-area-inset-left));
  transition:opacity .75s ease,visibility .75s ease;
}

.final-opening.gone{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

.opening-art{
  width:min(96vw,1180px);
  height:min(94svh,820px);
  max-width:100%;
  max-height:100%;
  flex:0 1 auto;
  background-image:url("assets/opening-green-envelope-final.png");
  background-repeat:no-repeat;
  background-position:center center;
  background-size:contain;
}

.open-invite-hitarea{
  position:absolute;
  inset:0;
  z-index:2;
  width:100%;
  height:100%;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  touch-action:manipulation;
}

.open-invite-hitarea:focus-visible{
  outline:3px solid #c6a05a;
  outline-offset:-8px;
}

/* ---------- CONTENT CARDS / FRAMES ---------- */

.hero-inner,
.content-card,
.architectural-frame,
.countdown > .reveal,
.family > .reveal,
.closing-arch{
  width:min(100%,900px);
  margin-inline:auto;
}

.content-card{
  padding:clamp(34px,6vw,64px) clamp(18px,4vw,40px);
}

.architectural-frame{
  min-height:auto;
  padding:clamp(64px,8vw,84px) clamp(18px,4vw,36px) clamp(40px,6vw,56px);
}

.closing-arch{
  padding:clamp(64px,9vw,92px) clamp(18px,4vw,36px) clamp(44px,6vw,64px);
}

/* ---------- COUNTDOWN ---------- */

.count-grid{
  width:min(100%,680px);
  margin-inline:auto;
  grid-template-columns:repeat(4,minmax(0,1fr));
}

.count-grid div{
  min-width:0;
}

.count-grid strong{
  line-height:1;
}

/* ---------- ACTION BUTTONS ---------- */

.actions{
  width:min(100%,760px);
  margin-inline:auto;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:stretch;
  gap:10px;
}

.actions .btn{
  min-height:48px;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:13px 18px;
  white-space:normal;
  text-align:center;
  touch-action:manipulation;
}

.map-btn{
  text-decoration:none;
}

.map-pin{
  width:22px;
  height:22px;
  flex:0 0 22px;
  display:inline-grid;
  place-items:center;
  border:1px solid currentColor;
  border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
}

.map-pin::after{
  content:"";
  width:6px;
  height:6px;
  border:1px solid currentColor;
  border-radius:50%;
}

/* ---------- MUSIC CONTROL ---------- */

.music-btn{
  max-width:calc(100vw - 24px);
  right:max(12px,env(safe-area-inset-right));
  bottom:max(14px,env(safe-area-inset-bottom));
}

/* =========================
   TABLET: 769px–1024px
   ========================= */
@media (max-width:1024px){

  .section{
    min-height:auto;
    padding-top:clamp(72px,10vw,100px);
    padding-bottom:clamp(72px,10vw,100px);
  }

  .hero{
    min-height:100svh;
  }

  .hero h1{
    font-size:clamp(48px,8vw,78px);
  }

  .names{
    font-size:clamp(28px,5vw,42px);
  }

  .content-card h2{
    font-size:clamp(30px,5vw,44px);
  }

  .architectural-frame h2{
    font-size:clamp(48px,8vw,72px);
  }

  .family h2{
    font-size:clamp(38px,7vw,58px);
  }

  .opening-art{
    width:94vw;
    height:90svh;
    max-width:900px;
    max-height:950px;
  }

  .actions .btn{
    flex:1 1 220px;
  }
}

/* =========================
   TABLET / LARGE MOBILE
   ========================= */
@media (max-width:768px){

  .section{
    padding-left:18px;
    padding-right:18px;
    padding-top:72px;
    padding-bottom:72px;
  }

  .opening-art{
    width:94vw;
    height:90svh;
    max-width:740px;
    max-height:900px;
  }

  .hero-inner{
    width:min(100%,660px);
  }

  .monogram-large{
    font-size:clamp(58px,14vw,78px);
  }

  .hero h1{
    font-size:clamp(46px,11vw,68px);
    line-height:.98;
  }

  .names{
    flex-direction:column;
    gap:6px;
    font-size:clamp(28px,7vw,38px);
  }

  .names b{
    line-height:1;
  }

  .date-line{
    max-width:90%;
    margin-inline:auto;
    line-height:1.45;
  }

  .content-card{
    width:min(100%,680px);
    padding:42px 20px;
  }

  .body-copy{
    font-size:18px;
    line-height:1.7;
  }

  .content-card h3{
    font-size:32px;
  }

  .architectural-frame{
    width:min(100%,680px);
    border-radius:180px 180px 10px 10px;
  }

  .date-emblem{
    width:132px;
    height:132px;
  }

  .count-grid{
    width:min(100%,620px);
    gap:7px;
  }

  .count-grid div{
    padding:18px 6px;
  }

  .actions{
    width:min(100%,520px);
  }

  .actions .btn{
    width:100%;
    flex:1 1 100%;
    max-width:420px;
    min-height:50px;
  }

  .hosts.awaiting-sequence{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
    width:min(720px,94vw)!important;
    gap:10px!important;
  }

  .hosts.awaiting-sequence span:nth-child(1){grid-column:1/span 2!important}
  .hosts.awaiting-sequence span:nth-child(2){grid-column:3/span 2!important}
  .hosts.awaiting-sequence span:nth-child(3){grid-column:5/span 2!important}
  .hosts.awaiting-sequence span:nth-child(4){grid-column:2/span 2!important}
  .hosts.awaiting-sequence span:nth-child(5){grid-column:4/span 2!important}

  .closing-arch{
    width:min(100%,580px);
    border-radius:180px 180px 0 0;
  }
}

/* =========================
   MOBILE PHONES
   ========================= */
@media (max-width:480px){

  .final-opening{
    padding:
      max(8px,env(safe-area-inset-top))
      max(10px,env(safe-area-inset-right))
      max(8px,env(safe-area-inset-bottom))
      max(10px,env(safe-area-inset-left));
  }

  .opening-art{
    width:95vw;
    height:88svh;
    max-width:460px;
    max-height:760px;
    background-size:contain;
    background-position:center;
  }

  .section{
    padding-left:14px;
    padding-right:14px;
    padding-top:64px;
    padding-bottom:64px;
  }

  .hero{
    min-height:100svh;
    padding-top:max(58px,env(safe-area-inset-top));
    padding-bottom:max(70px,env(safe-area-inset-bottom));
  }

  .hero .eyebrow{
    font-size:9px;
    letter-spacing:.16em;
  }

  .ik-onkar{
    font-size:28px;
  }

  .monogram-large{
    font-size:clamp(50px,18vw,68px);
    margin:18px 0 14px;
  }

  .monogram-large em{
    font-size:26px;
  }

  .script-small{
    font-size:18px;
  }

  .hero h1{
    font-size:clamp(42px,13vw,56px);
    line-height:.95;
    margin-bottom:16px;
  }

  .names{
    font-size:clamp(26px,8vw,34px);
  }

  .gold-rule{
    margin-top:10px;
  }

  .date-line{
    max-width:95%;
    font-size:15px;
    line-height:1.4;
  }

  .scroll-cue{
    bottom:max(16px,env(safe-area-inset-bottom));
    font-size:8px;
    letter-spacing:.12em;
  }

  .content-card{
    width:100%;
    padding:34px 16px;
  }

  .content-card h2{
    font-size:clamp(28px,8vw,36px);
    line-height:1.12;
  }

  .body-copy{
    font-size:17px;
  }

  .content-card h3{
    font-size:30px;
  }

  .family-names{
    font-size:18px;
  }

  .architectural-frame{
    width:100%;
    min-height:auto;
    border-radius:145px 145px 10px 10px;
    padding:66px 14px 38px;
  }

  .architectural-frame h2{
    font-size:clamp(42px,12vw,56px);
  }

  .date-emblem{
    width:118px;
    height:118px;
  }

  .date-emblem strong{
    font-size:48px;
  }

  .event-day{
    font-size:18px;
  }

  .venue-block strong{
    font-size:28px;
  }

  .countdown h2{
    font-size:clamp(38px,10vw,50px);
    margin-bottom:26px;
  }

  .count-grid{
    width:100%;
    gap:5px;
  }

  .count-grid div{
    padding:14px 3px;
  }

  .count-grid strong{
    font-size:clamp(26px,9vw,36px);
  }

  .count-grid span{
    font-size:7px;
    letter-spacing:.10em;
  }

  .actions{
    width:100%;
  }

  .actions .btn{
    width:100%;
    max-width:100%;
    min-height:50px;
    font-size:11px;
    padding:14px 12px;
  }

  .family h2{
    font-size:clamp(34px,10vw,44px);
    line-height:1.05;
  }

  .hosts.awaiting-sequence{
    gap:7px!important;
    width:100%!important;
  }

  .hosts.awaiting-sequence span{
    white-space:normal!important;
    font-size:15px!important;
    line-height:1.15!important;
    padding:9px 4px!important;
  }

  .closing{
    min-height:auto;
  }

  .closing-arch{
    width:100%;
    border-radius:145px 145px 0 0;
    padding:62px 14px 46px;
  }

  .monogram-small{
    font-size:44px;
  }

  .closing h2{
    font-size:44px;
  }

  .music-btn{
    max-width:calc(100vw - 20px);
    right:max(10px,env(safe-area-inset-right));
    bottom:max(10px,env(safe-area-inset-bottom));
    min-height:44px;
  }
}

/* Extra-small devices */
@media (max-width:360px){

  .opening-art{
    width:96vw;
    height:86svh;
  }

  .section{
    padding-left:12px;
    padding-right:12px;
  }

  .hero h1{
    font-size:40px;
  }

  .names{
    font-size:25px;
  }

  .count-grid strong{
    font-size:25px;
  }

  .count-grid span{
    font-size:6px;
  }

  .actions .btn{
    font-size:10px;
  }

  .hosts.awaiting-sequence span{
    font-size:13px!important;
    padding:8px 3px!important;
  }
}

/* Landscape phones / short-height screens */
@media (max-height:600px) and (orientation:landscape){

  .final-opening{
    padding:6px 12px;
  }

  .opening-art{
    width:92vw;
    height:92svh;
  }

  .hero{
    min-height:auto;
  }

  .section{
    min-height:auto;
    padding-top:48px;
    padding-bottom:48px;
  }

  .scroll-cue{
    position:static;
    margin-top:24px;
  }
}


/* ===== FINAL CLEAN OPENING OVERRIDE ===== */
.final-opening{
  position:fixed !important;
  inset:0 !important;
  z-index:100 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:#f3eadb !important;
  padding:
    max(8px, env(safe-area-inset-top))
    max(8px, env(safe-area-inset-right))
    max(8px, env(safe-area-inset-bottom))
    max(8px, env(safe-area-inset-left)) !important;
}

.opening-art{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  background-image:url("assets/opening-green-envelope-final.png") !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:contain !important;
  flex:1 1 auto !important;
}

/* Entire opening is one large tap target */
.open-invite-hitarea{
  position:absolute !important;
  inset:0 !important;
  z-index:3 !important;
  width:100% !important;
  height:100% !important;
  border:0 !important;
  background:transparent !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
}

/* Desktop */
@media (min-width:1025px){
  .final-opening{
    padding:18px !important;
  }
  .opening-art{
    width:min(100%, 1600px) !important;
    height:min(100%, 980px) !important;
    background-size:contain !important;
  }
}

/* Tablet */
@media (max-width:1024px){
  .opening-art{
    width:96vw !important;
    height:94svh !important;
    background-size:contain !important;
  }
}

/* Mobile */
@media (max-width:768px){
  .final-opening{
    padding:
      max(8px, env(safe-area-inset-top))
      max(10px, env(safe-area-inset-right))
      max(8px, env(safe-area-inset-bottom))
      max(10px, env(safe-area-inset-left)) !important;
  }
  .opening-art{
    width:95vw !important;
    height:92svh !important;
    background-size:contain !important;
  }
}

/* Small mobile */
@media (max-width:480px){
  .opening-art{
    width:96vw !important;
    height:90svh !important;
    background-size:contain !important;
  }
}

/* Landscape phones */
@media (max-height:600px) and (orientation:landscape){
  .opening-art{
    width:96vw !important;
    height:94svh !important;
    background-size:contain !important;
  }
}


/* ===== APPROVED FINAL OPENING IMAGE ===== */
.final-opening{
  position:fixed !important;
  inset:0 !important;
  z-index:100 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:#f3eadb !important;
  padding:
    max(8px, env(safe-area-inset-top))
    max(8px, env(safe-area-inset-right))
    max(8px, env(safe-area-inset-bottom))
    max(8px, env(safe-area-inset-left)) !important;
}

.opening-art{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  background-image:url("assets/opening-green-envelope-final.png") !important;
  background-repeat:no-repeat !important;
  background-position:center center !important;
  background-size:contain !important;
}

/* Desktop */
@media (min-width:1025px){
  .opening-art{
    width:min(100%,1600px) !important;
    height:min(100%,1000px) !important;
  }
}

/* Tablet */
@media (max-width:1024px){
  .opening-art{
    width:96vw !important;
    height:94svh !important;
  }
}

/* Mobile */
@media (max-width:768px){
  .opening-art{
    width:95vw !important;
    height:92svh !important;
  }
}

/* Small mobile */
@media (max-width:480px){
  .opening-art{
    width:96vw !important;
    height:90svh !important;
  }
}

/* CLIENT CORRECTIONS */
.tap-open,.tapOpen,.seal-label,.wax-seal .tap-label{display:none!important}

/* Correct Gurmukhi Ek Onkar */
.ik-onkar,.ikOnkar{
  font-family:"Noto Sans Gurmukhi","Noto Sans",sans-serif!important;
  font-weight:400!important;
  line-height:1!important;
}

/* Slide 2 date/time +2px */
.date-line{font-size:calc(1em + 2px)!important}

/* Slide 4 year +2px */
.date-emblem .year,.event-year{font-size:calc(1em + 2px)!important}