:root{--ink:#4f3b68;--deep:#563c79;--purple:#8f6bce;--purple-2:#b19ae8;--lilac:#e9defe;--paper:#fffaff;--pink:#f4bfd0;--gold:#d7ad65;--line:#e8daf9;--muted:#82738f;--shadow:0 20px 70px rgba(112,79,157,.12);--font:"Noto Sans Gujarati","Hind Vadodara",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:82px}body{margin:0;background:#fbf7ff;color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.7;overflow-x:hidden}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit}.ambient{position:fixed;pointer-events:none;border-radius:50%;filter:blur(80px);opacity:.38;z-index:-1}.ambient-one{width:260px;height:260px;background:#d8c8ff;top:8%;left:-150px}.ambient-two{width:300px;height:300px;background:#fde3ef;right:-170px;bottom:6%}.welcome-screen{position:fixed;inset:0;width:100%;z-index:50;min-height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:34px 22px 58px;background:radial-gradient(ellipse at 50% 38%,#fffaff 0,#f6ecff 47%,#eee2ff 100%);isolation:isolate}.welcome-screen:before,.welcome-screen:after{content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(185,157,225,.24);border-radius:50%;z-index:-1}.welcome-screen:before{top:-120px;left:-85px;box-shadow:0 0 0 20px rgba(255,255,255,.18),0 0 0 40px rgba(255,255,255,.12)}.welcome-screen:after{right:-120px;bottom:-120px;box-shadow:0 0 0 20px rgba(255,255,255,.2),0 0 0 40px rgba(255,255,255,.12)}.welcome-inner{width:min(100%,440px);position:relative;z-index:2;text-align:center;animation:rise-in .9s both}.ganesh-mantra{font-size:clamp(17px,4vw,21px);color:#765a9b;letter-spacing:.03em;font-weight:700;margin:0 0 10px}.ganesha-art{width:min(78%,304px);margin:0 auto 1px;filter:drop-shadow(0 15px 17px rgba(127,93,164,.13));animation:soft-float 5s ease-in-out infinite}.ganesha-art img{display:block;width:100%;height:auto;max-height:340px;object-fit:contain}.welcome-inner h1{margin:3px 0 4px;font-size:clamp(30px,8vw,42px);line-height:1.25;letter-spacing:.01em;color:#7154a1;font-weight:800}.welcome-subtitle{margin:8px 0 6px;color:#a1859e;font-size:14px;letter-spacing:.07em}.welcome-names{margin:0 0 22px;font-size:22px;font-weight:700;color:#725492}.welcome-names span{color:#de92b3;font-size:16px;padding:0 7px}.primary-button{border:0;border-radius:999px;padding:13px 27px;background:linear-gradient(125deg,#b7a0ec,#8863c5);box-shadow:0 11px 25px rgba(127,95,186,.26),inset 0 1px 0 rgba(255,255,255,.6);color:#fff;font-weight:700;letter-spacing:.01em;transition:transform .2s ease,box-shadow .2s ease;min-height:50px}.primary-button:hover{transform:translateY(-2px);box-shadow:0 15px 30px rgba(127,95,186,.33)}.primary-button:active{transform:scale(.98)}.primary-button span{margin-left:10px}.open-invitation{min-width:210px}.tap-hint{margin:13px 0 0;color:#ad9cbd;font-size:12px}.welcome-stars span{position:absolute;color:#c4a4e9;animation:twinkle 3.7s ease-in-out infinite}.welcome-stars span:nth-child(1){top:17%;left:14%;font-size:27px}.welcome-stars span:nth-child(2){top:27%;right:13%;font-size:32px;animation-delay:.8s}.welcome-stars span:nth-child(3){bottom:22%;left:10%;font-size:18px;animation-delay:1.2s}.welcome-stars span:nth-child(4){top:13%;right:26%;font-size:34px}.welcome-stars span:nth-child(5){bottom:17%;right:12%;font-size:26px;animation-delay:1.7s}.welcome-cloud{position:absolute;background:rgba(255,255,255,.55);height:42px;width:140px;border-radius:50px;filter:blur(.2px);z-index:0}.welcome-cloud:before,.welcome-cloud:after{content:"";position:absolute;bottom:7px;background:inherit;border-radius:50%}.welcome-cloud:before{width:60px;height:60px;left:20px}.welcome-cloud:after{width:75px;height:75px;right:19px}.cloud-a{left:-28px;top:40%}.cloud-b{right:-35px;bottom:21%;transform:scale(.8)}.welcome-bottom-flower{position:absolute;bottom:13px;left:50%;transform:translateX(-50%);font-size:24px;color:#c5aadf;opacity:.7}.invitation-main{max-width:760px;margin:0 auto;padding:0 18px 34px;animation:main-enter .28s ease both}.invitation-main[hidden]{display:none!important}.topbar{height:65px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:20;background:rgba(251,247,255,.89);backdrop-filter:blur(16px);margin:0 -18px;padding:0 20px;border-bottom:1px solid rgba(219,204,242,.65)}.brand-mark{text-decoration:none;display:flex;align-items:center;gap:8px;color:#8b6db8;font-size:14px;font-weight:700}.brand-mark:first-letter{color:#c999c5}.share-button{border:1px solid #e0d0f3;background:#fff9ff;border-radius:999px;padding:7px 13px;color:#765894;font-size:12px;font-weight:600}.share-button span{margin-left:4px}.hero-section{text-align:center;position:relative;padding:42px 15px 38px;overflow:hidden;background:linear-gradient(180deg,rgba(249,242,255,.74),rgba(255,250,255,.42));border-radius:0 0 46% 46% / 0 0 4% 4%;}.eyebrow{text-transform:none;color:#aa8dbf;font-size:12px;letter-spacing:.08em;font-weight:700;margin:0 0 9px}.hero-section .eyebrow{font-size:16px;color:#8668a7;margin-bottom:2px}.hero-baby-art{width:min(86%,380px);margin:0 auto 5px;position:relative;filter:drop-shadow(0 12px 15px rgba(156,130,193,.1));animation:soft-float 6s ease-in-out infinite}.hero-baby-art img{display:block;width:100%;height:auto;max-height:310px;object-fit:contain}.hero-kicker{font-size:13px;color:#a58cb4;margin:0 0 8px}.hero-section h2{font-size:clamp(27px,6vw,35px);line-height:1.55;margin:0 auto 12px;color:#735797;font-weight:800}.hero-section h2 span{color:#b37bb2}.hero-description{max-width:500px;margin:0 auto 23px;font-size:14px;color:#82718f;line-height:2}.couple-names{display:flex;align-items:center;justify-content:center;gap:15px;font-size:27px;color:#735796;font-weight:800;margin:20px 0 19px}.couple-names i{font-size:13px;font-style:normal;font-weight:500;color:#b191bf}.date-pill{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.83);border:1px solid #eadff8;border-radius:999px;padding:9px 16px;color:#83679f;font-size:13px;box-shadow:0 7px 19px rgba(136,106,177,.07)}.date-pill span{color:#d5ad64}.ornament{position:absolute;top:110px;font-size:36px;color:#c6a6de;opacity:.7}.ornament-left{left:3%}.ornament-right{right:3%;top:195px;color:#e3b0cb}.scroll-cue{display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;color:#b29bc5;font-size:11px;margin-top:23px}.scroll-cue span{width:17px;height:27px;border:1.5px solid #cdb6df;border-radius:12px;position:relative}.scroll-cue span:after{content:"";position:absolute;width:3px;height:5px;border-radius:3px;background:#b397d2;top:5px;left:5.5px;animation:scroll-dot 1.5s infinite}.section{padding:55px 0 44px}.section-heading{text-align:center;margin:0 auto 25px}.section-heading h2{margin:0;font-size:clamp(27px,6vw,34px);line-height:1.5;color:#765a9b;font-weight:800}.section-heading>p:last-child{font-size:13px;color:#9c8aa9;margin:5px 0 0}.heading-sparkle{font-size:20px;color:#d9b06c;vertical-align:top}.vote-card,.event-card,.rsvp-card{background:rgba(255,255,255,.82);border:1px solid #e8dbf8;border-radius:27px;padding:21px;box-shadow:var(--shadow)}.vote-card{padding:18px}.vote-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.vote-option{min-width:0;border-radius:22px;border:1px solid transparent;padding:17px 9px 13px;display:flex;flex-direction:column;align-items:center;gap:3px;transition:transform .2s,border-color .2s,box-shadow .2s;background:#eff5ff;color:#63749a;position:relative;overflow:hidden}.vote-option:before{content:"";position:absolute;width:125px;height:125px;border-radius:50%;background:rgba(255,255,255,.55);top:-76px;right:-40px}.girl-option{background:#fff0f6;color:#ad7895}.vote-option:hover{transform:translateY(-3px)}.vote-option:disabled{cursor:wait;opacity:.75}.submit-button:disabled{opacity:.7;cursor:wait}.attendance-choice input:focus-visible+span,.vote-option:focus-visible,.primary-button:focus-visible,.share-button:focus-visible,.map-button:focus-visible{outline:3px solid #9c7bd0;outline-offset:3px}.vote-option[aria-pressed="true"]{border-color:#a68bdd;box-shadow:0 0 0 3px rgba(175,150,226,.16)}.option-illustration{display:grid;place-items:center;width:68px;height:68px;border-radius:50%;font-size:34px;background:rgba(255,255,255,.64);box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);margin-bottom:7px}.option-title{font-weight:800;font-size:21px}.option-small{font-size:11px;opacity:.84}.choose-label{font-size:11px;margin-top:9px;padding:4px 11px;border-radius:999px;background:rgba(255,255,255,.64)}.name-suggestion-option{grid-column:1/-1;justify-self:center;width:min(100%,245px);background:linear-gradient(145deg,#f5eaff,#ffeff8);color:#8a6da7;border-color:#e5d4f4}.name-illustration{color:#9778b5;font-size:30px}.name-suggestion-option[aria-expanded="true"]{border-color:#b39ad9;box-shadow:0 0 0 3px rgba(177,154,226,.15)}.name-suggestion-panel{margin-top:17px;padding:18px 16px 15px;background:linear-gradient(150deg,#fffaff,#f7f0ff);border:1px solid #e6d8f5;border-radius:19px;box-shadow:0 10px 25px rgba(112,79,157,.07);animation:rise-in .25s ease}.name-suggestion-panel[hidden]{display:none!important}.name-suggestion-heading{font-size:15px;font-weight:800;color:#76599a;text-align:center;margin:0 0 17px}.name-suggestion-panel input{width:100%;background:#fff;border:1px solid #e4d7f3;color:#5d4b70;border-radius:13px;padding:12px 13px;outline:0;margin-bottom:15px}.name-suggestion-panel input:focus{border-color:#b19ae2;box-shadow:0 0 0 3px rgba(177,154,226,.15)}.name-suggestion-panel input::placeholder{color:#c0b2ca}.cancel-name-suggestion{display:block;border:0;background:transparent;color:#a18ab4;font-size:12px;font-weight:700;margin:10px auto 0;padding:7px 12px}.vote-results{margin-top:22px;padding:17px 7px 0;border-top:1px solid #eee4fa}.results-title,.result-label{display:flex;justify-content:space-between;align-items:center;gap:10px}.results-title{margin-bottom:15px;font-size:13px;color:#7f6c93}.results-title strong{font-size:12px;background:#f4edff;color:#8e70b5;border-radius:30px;padding:4px 9px}.result-row{margin:10px 0 15px}.result-label{font-size:12px;margin-bottom:6px}.result-label strong{font-size:12px;color:#84709c}.result-track{height:10px;background:#f0e9f9;border-radius:99px;overflow:hidden}.result-fill{display:block;width:0;height:100%;border-radius:99px;transition:width .65s ease}.boy-fill{background:linear-gradient(90deg,#a8c9f9,#659ce3)}.girl-fill{background:linear-gradient(90deg,#f5bdd7,#de8ab7)}.vote-note{font-size:11px;color:#9b86ab;text-align:center;margin:10px 0 0}.demo-note{font-size:10px;line-height:1.7;color:#ae9dbb;text-align:center;margin:18px 3px 2px}.tiny-blessing{text-align:center;color:#b39ac6;font-size:12px;margin:19px 0 0}.event-section{padding-top:50px}.event-card{padding:22px 23px 25px;position:relative;overflow:hidden}.event-card:before{content:"";position:absolute;inset:9px;border:1px solid rgba(211,191,237,.63);border-radius:20px;pointer-events:none}.event-card-top{display:flex;justify-content:center;align-items:center;gap:13px;color:#c6a4d4;font-size:18px}.event-label{font-size:11px;letter-spacing:.08em;font-weight:700;color:#b399c3}.event-card h3{text-align:center;color:#765a9a;font-size:25px;margin:4px 0 3px}.event-divider,.blessing-divider{display:flex;align-items:center;gap:10px;justify-content:center;color:#dbb56c;margin:6px auto 20px}.event-divider:before,.event-divider:after,.blessing-divider:before,.blessing-divider:after{content:"";width:55px;height:1px;background:#e6d5f3}.event-info-row{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:start;margin:18px 2px;position:relative;z-index:1}.info-icon{width:34px;height:34px;border-radius:12px;background:#f2eaff;color:#9c7abc;display:grid;place-items:center;font-size:19px}.event-info-row small{display:block;color:#b09bbd;font-size:11px;margin-bottom:3px}.event-info-row strong{display:block;color:#6a547f;font-size:14px;line-height:1.7}.address-text{display:block;color:#928099;font-family:var(--font);font-size:12px;line-height:1.8;margin-top:3px}.map-button{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;border:1px solid #d9c4f0;background:#faf6ff;color:#8062a5;border-radius:999px;padding:11px 20px;font-size:13px;font-weight:700;margin:21px 0 0;transition:background .2s}.map-button:hover{background:#f0e6ff}.countdown-card{margin:17px 0 0;background:linear-gradient(130deg,#eee4ff,#fce9f2);border:1px solid rgba(229,211,244,.9);border-radius:22px;padding:19px 13px;text-align:center}.countdown-card>p{font-size:12px;color:#937aa8;margin:0 0 11px}.countdown-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.countdown-grid div{display:flex;flex-direction:column;align-items:center;gap:1px}.countdown-grid strong{font-size:clamp(23px,6vw,29px);color:#775b9a;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.4}.countdown-grid span{font-size:10px;color:#a38db6}.blessing-section{position:relative;text-align:center;padding:47px 25px 48px;margin:0 -18px;background:linear-gradient(155deg,rgba(236,223,255,.7),rgba(255,242,248,.9));border-top:1px solid #e9dcf7;border-bottom:1px solid #e9dcf7;overflow:hidden}.blessing-section:before,.blessing-section:after{content:"✿";position:absolute;color:#c9b0e8;font-size:95px;opacity:.14;top:25px}.blessing-section:before{left:-18px;transform:rotate(-28deg)}.blessing-section:after{right:-18px;transform:rotate(28deg)}.blessing-ornament{color:#c4a3d9;font-size:38px;margin-bottom:5px}.blessing-section blockquote{font-size:clamp(15px,3.8vw,18px);line-height:2.15;color:#806b91;margin:16px auto 20px;max-width:530px;font-weight:500}.blessing-divider{margin-bottom:13px}.blessing-signoff{margin:0;color:#a48cb5;font-size:12px}.blessing-section h2{font-size:28px;color:#775b9a;margin:6px 0 0}.blessing-section h2 span{font-weight:400;color:#d0a0c7;font-size:17px}.rsvp-section{padding-top:53px}.rsvp-card{padding:24px 22px}.form-label{display:block;font-size:13px;font-weight:700;color:#765d90;margin:0 0 8px}.form-label span{color:#cf83ab}.rsvp-card>input,.rsvp-card>select,.rsvp-card>textarea{width:100%;background:#fdfaff;border:1px solid #e4d7f3;color:#5d4b70;border-radius:13px;padding:12px 13px;outline:0;margin-bottom:19px;transition:border-color .2s,box-shadow .2s}.rsvp-card input:focus,.rsvp-card select:focus,.rsvp-card textarea:focus{border-color:#b19ae2;box-shadow:0 0 0 3px rgba(177,154,226,.15)}.rsvp-card input::placeholder,.rsvp-card textarea::placeholder{color:#c0b2ca}.attendance-field{border:0;padding:0;margin:0 0 20px;min-width:0}.attendance-field legend{padding:0}.attendance-options{display:grid;grid-template-columns:1fr 1fr;gap:9px}.attendance-choice{position:relative;cursor:pointer}.attendance-choice input{position:absolute;opacity:0;pointer-events:none}.attendance-choice span{display:flex;justify-content:center;align-items:center;text-align:center;min-height:48px;padding:8px;border:1px solid #e2d5f3;border-radius:12px;background:#fcf9ff;color:#8e7a9f;font-size:12px;transition:all .2s}.attendance-choice input:checked+span{background:#f0e8ff;border-color:#a891d9;color:#72549a;box-shadow:0 0 0 2px rgba(177,154,226,.13)}.rsvp-card textarea{resize:vertical;min-height:91px}.submit-button{width:100%;margin-top:1px}.form-status{font-size:12px;line-height:1.8;text-align:center;color:#8a6cab;margin:10px 0 0;min-height:0}.form-status:empty{display:none}.form-status.success{padding:10px 12px;border-radius:12px;background:#f2ecff}.form-status.error{color:#af527a}.closing-card{position:relative;overflow:hidden;text-align:center;color:#fff5ff;border-radius:29px;margin:15px 0 15px;padding:34px 22px 29px;background:radial-gradient(circle at 50% 0%,#7f5aa5 0,#493064 54%,#322047 100%);box-shadow:0 18px 48px rgba(75,49,99,.2)}.closing-card:before,.closing-card:after{content:"";position:absolute;width:240px;height:240px;border:1px solid rgba(239,214,255,.14);border-radius:50%;pointer-events:none}.closing-card:before{top:-160px;left:-100px;box-shadow:0 0 0 17px rgba(255,255,255,.025),0 0 0 37px rgba(255,255,255,.022)}.closing-card:after{bottom:-170px;right:-90px;box-shadow:0 0 0 17px rgba(255,255,255,.025),0 0 0 37px rgba(255,255,255,.022)}.closing-stars{font-size:15px;letter-spacing:.18em;color:#f3d796;margin-bottom:8px}.closing-card .ganesh-mantra{color:#e9d5fa;font-size:15px}.closing-lotus{font-size:58px;color:#f2d7b0;line-height:1.4;text-shadow:0 0 30px rgba(255,225,181,.3);margin:3px 0 7px}.closing-heading{font-size:16px;line-height:2;color:#f6eafd;margin:0 0 13px}.closing-names{font-size:28px;font-weight:800;color:#fff4d7}.closing-names span{font-size:16px;color:#e9bad4;padding:0 7px}.closing-date{color:#e4cde9;font-size:12px;margin-top:7px}.closing-line{height:1px;width:85px;background:linear-gradient(90deg,transparent,#e2c588,transparent);margin:21px auto}.hosts-intro{font-size:12px;color:#d8bce9;margin:0 0 4px}.host-name{font-size:14px;color:#fff2ff;margin:2px 0}.contact-numbers{display:flex;flex-direction:column;align-items:center;gap:7px;margin-top:10px}.contact-link{display:inline-block;color:#f6dca9;text-decoration:none;font-size:13px;margin-top:0;border-bottom:1px solid rgba(246,220,169,.45)}.closing-thanks{font-size:12px;color:#e4cfef;margin:22px 0 0}.made-with-love{font-size:10px;color:#bfa6d6;margin:19px 0 0}.made-with-love span{color:#f3d696}.toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translate(-50%,14px);padding:10px 17px;max-width:calc(100vw - 36px);border-radius:999px;background:#4d3866;color:#fff;font-size:12px;box-shadow:0 8px 24px rgba(54,32,76,.22);z-index:50;opacity:0;pointer-events:none;transition:all .25s;text-align:center}.toast.visible{opacity:1;transform:translate(-50%,0)}.reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s ease}.reveal.in-view{opacity:1;transform:translateY(0)}body.entered .welcome-screen{animation:welcome-exit .52s ease forwards}.welcome-screen[hidden]{display:none!important}
@keyframes rise-in{from{opacity:0;transform:translateY(17px)}to{opacity:1;transform:translateY(0)}}@keyframes main-enter{from{opacity:0}to{opacity:1}}@keyframes welcome-exit{to{opacity:0;transform:scale(1.025);visibility:hidden}}@keyframes soft-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes twinkle{0%,100%{opacity:.48;transform:scale(.84)}50%{opacity:1;transform:scale(1.12)}}@keyframes scroll-dot{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(8px)}}
@media(min-width:700px){.welcome-inner{max-width:500px}.welcome-screen{padding:45px 24px 60px}.ganesha-art{width:285px}.invitation-main{padding:0 27px 45px}.topbar{margin:0 -27px;padding:0 30px;height:70px}.hero-section{padding:48px 30px 43px}.hero-baby-art{width:360px}.section{padding:64px 0 52px}.vote-card{padding:23px}.vote-options{gap:18px}.vote-option{padding:21px 13px}.event-card{max-width:600px;margin:0 auto;padding:27px 40px}.countdown-card{max-width:600px;margin:17px auto 0}.blessing-section{margin:0 -27px;padding:59px 50px}.rsvp-card{max-width:570px;margin:0 auto;padding:29px 32px}.closing-card{padding:40px 35px 34px}.ornament-left{left:10%}.ornament-right{right:10%}}
@media(max-width:380px){body{font-size:15px}.welcome-screen{padding-left:16px;padding-right:16px}.ganesha-art{width:74%}.vote-card{padding:13px}.vote-option{padding:13px 6px}.option-illustration{width:58px;height:58px}.event-card{padding:20px 16px}.event-info-row strong{font-size:13px}.address-text{font-size:11px}.rsvp-card{padding:21px 16px}.attendance-choice span{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}}


/* Smooth balloon lift: transform + opacity are the only animated properties. */
.balloon-burst{position:fixed;inset:0;z-index:100;overflow:hidden;pointer-events:none;isolation:isolate;contain:layout paint style}
.balloon-burst[hidden]{display:none!important}
.balloon-flyer{position:absolute;bottom:var(--balloon-bottom,-8px);width:var(--balloon-width,38px);height:calc(var(--balloon-height,46px) + var(--balloon-string-height,28px));display:flex;flex-direction:column;align-items:center;will-change:transform,opacity;backface-visibility:hidden;transform:translate3d(0,0,0);}
.balloon-flyer.balloon-css-fallback{animation:balloon-lift-fallback var(--balloon-duration,1200ms) linear var(--balloon-delay,0ms) both}
.balloon-body{position:relative;display:block;width:100%;height:var(--balloon-height,46px);flex:none;border-radius:52% 48% 48% 48%;transform:rotate(-4deg);background:radial-gradient(ellipse at 28% 22%,rgba(255,255,255,.84) 0,rgba(255,255,255,.2) 18%,transparent 35%),linear-gradient(145deg,rgba(255,255,255,.25),transparent 45%),var(--balloon-color,#b49ae9);box-shadow:inset -3px -4px 7px rgba(73,46,101,.1),inset 2px 2px 3px rgba(255,255,255,.5),0 2px 4px rgba(99,70,130,.08);border:1px solid rgba(255,255,255,.55)}
.balloon-body:after{content:"";position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);width:9px;height:9px;background:var(--balloon-color,#b49ae9);clip-path:polygon(0 0,100% 0,50% 100%)}
.balloon-string{display:block;flex:none;width:1px;height:var(--balloon-string-height,28px);background:linear-gradient(to bottom,rgba(125,97,151,.58),rgba(125,97,151,.12));transform:translateX(1px)}
@keyframes balloon-lift-fallback{0%{opacity:0;transform:translate3d(0,0,0)}7%{opacity:1;transform:translate3d(0,-10.5vh,0)}84%{opacity:1;transform:translate3d(0,-126vh,0)}100%{opacity:0;transform:translate3d(0,-150vh,0)}}
@media(prefers-reduced-motion:reduce){.balloon-burst{display:none!important}.balloon-flyer{animation:none!important}}

/* The main invitation fades in behind the rising balloons; both motions run together. */
body.entered .hero-section.reveal{transition-duration:.28s}

/* Mobile-first layout refinement: tuned for common phone widths (320–430px). */
@media (max-width: 600px) {
  :root { --phone-gutter: 14px; }
  html { scroll-padding-top: 64px; }
  body { font-size: 15px; line-height: 1.65; }
  .ambient-one { width: 190px; height: 190px; left: -125px; }
  .ambient-two { width: 210px; height: 210px; right: -135px; }

  /* Welcome screen: keep the artwork, names and button within short phone viewports. */
  .welcome-screen {
    min-height: 100vh;
    min-height: 100svh;
    padding: max(16px, env(safe-area-inset-top)) 16px max(28px, env(safe-area-inset-bottom));
  }
  .welcome-inner { width: min(100%, 420px); }
  .ganesh-mantra { font-size: clamp(15px, 4.2vw, 19px); margin-bottom: 6px; }
  .ganesha-art { width: min(70vw, 260px); margin-bottom: 0; }
  .ganesha-art img { max-height: min(31svh, 270px); }
  .welcome-inner h1 { font-size: clamp(28px, 7.4vw, 36px); line-height: 1.25; }
  .welcome-subtitle { font-size: 12px; margin: 6px 0 4px; }
  .welcome-names { font-size: clamp(18px, 5.3vw, 22px); margin-bottom: 17px; }
  .open-invitation { min-width: 0; width: min(100%, 250px); }
  .primary-button { min-height: 48px; padding: 12px 19px; }
  .tap-hint { margin-top: 9px; font-size: 11px; }
  .welcome-stars span:nth-child(1) { top: 13%; left: 7%; }
  .welcome-stars span:nth-child(2) { top: 22%; right: 7%; }
  .welcome-stars span:nth-child(3) { bottom: 17%; left: 7%; }
  .welcome-stars span:nth-child(4) { top: 10%; right: 22%; }
  .welcome-stars span:nth-child(5) { bottom: 12%; right: 7%; }
  .welcome-cloud { opacity: .7; }

  /* Main page: consistent side gutters and reduced vertical dead space. */
  .invitation-main { width: 100%; max-width: 760px; padding: 0 var(--phone-gutter) 24px; }
  .topbar { height: 56px; margin: 0 calc(-1 * var(--phone-gutter)); padding: 0 14px; }
  .brand-mark { font-size: 12px; gap: 6px; }
  .share-button { padding: 7px 10px; font-size: 11px; white-space: nowrap; }
  .hero-section { padding: 23px 5px 27px; border-radius: 0 0 42% 42% / 0 0 3% 3%; }
  .hero-section .eyebrow { font-size: 14px; }
  .hero-baby-art { width: min(75vw, 300px); margin-bottom: 1px; }
  .hero-baby-art img { max-height: min(31svh, 255px); }
  .hero-kicker { font-size: 12px; margin-bottom: 5px; }
  .hero-section h2 { font-size: clamp(25px, 6.6vw, 31px); line-height: 1.4; margin-bottom: 8px; }
  .hero-description { font-size: 13px; line-height: 1.8; margin-bottom: 14px; max-width: 430px; }
  .couple-names { gap: clamp(7px, 2.4vw, 13px); font-size: clamp(19px, 5.5vw, 25px); flex-wrap: wrap; margin: 13px 0 13px; }
  .couple-names i { font-size: 11px; }
  .date-pill { max-width: 100%; gap: 6px; padding: 8px 10px; font-size: clamp(10px, 3.2vw, 12px); line-height: 1.5; flex-wrap: wrap; justify-content: center; }
  .ornament { top: 76px; font-size: 24px; }
  .ornament-left { left: 1%; }
  .ornament-right { right: 1%; top: 145px; }
  .scroll-cue { margin-top: 15px; font-size: 10px; gap: 4px; }

  .section { padding: 39px 0 31px; }
  .section-heading { margin-bottom: 18px; }
  .section-heading h2 { font-size: clamp(24px, 6.7vw, 30px); line-height: 1.4; }
  .section-heading > p:last-child { font-size: 12px; line-height: 1.7; }
  .vote-card, .event-card, .rsvp-card { border-radius: 21px; }
  .vote-card { padding: 12px; }
  .vote-options { gap: 8px; }
  .vote-option { border-radius: 17px; padding: 12px 5px 10px; gap: 2px; }
  .option-illustration { width: 54px; height: 54px; font-size: 28px; margin-bottom: 4px; }
  .option-title { font-size: clamp(16px, 4.6vw, 19px); }
  .option-small { font-size: 10px; line-height: 1.55; }
  .choose-label { font-size: 10px; margin-top: 6px; padding: 4px 8px; }
  .name-suggestion-option { width: min(100%, 280px); }
  .name-suggestion-panel { padding: 15px 12px 12px; }
  .name-suggestion-heading { margin-bottom: 13px; font-size: 14px; }
  .name-suggestion-panel input { padding: 11px 12px; margin-bottom: 13px; font-size: 16px; }
  .demo-note { font-size: 10px; line-height: 1.65; }
  .tiny-blessing { font-size: 11px; margin-top: 13px; }

  .event-section { padding-top: 40px; }
  .event-card { padding: 19px 13px 18px; }
  .event-card:before { inset: 7px; border-radius: 16px; }
  .event-card-top { gap: 9px; font-size: 15px; }
  .event-label { font-size: 10px; }
  .event-card h3 { font-size: 22px; margin-top: 5px; }
  .event-divider, .blessing-divider { margin-bottom: 15px; }
  .event-info-row { grid-template-columns: 31px minmax(0, 1fr); gap: 8px; margin: 14px 1px; }
  .info-icon { width: 30px; height: 30px; border-radius: 10px; font-size: 16px; }
  .event-info-row small { font-size: 10px; margin-bottom: 2px; }
  .event-info-row strong { font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
  .address-text { font-size: 11px; line-height: 1.7; overflow-wrap: anywhere; }
  .map-button { margin-top: 16px; padding: 11px 12px; font-size: 12px; }
  .countdown-card { border-radius: 18px; padding: 15px 7px; }
  .countdown-card > p { font-size: 11px; margin-bottom: 9px; }
  .countdown-grid { gap: 3px; }
  .countdown-grid strong { font-size: clamp(20px, 6.2vw, 26px); }
  .countdown-grid span { font-size: 10px; }

  .blessing-section { margin: 0 calc(-1 * var(--phone-gutter)); padding: 36px 17px 37px; }
  .blessing-ornament { font-size: 31px; }
  .blessing-section blockquote { font-size: clamp(14px, 3.9vw, 16px); line-height: 1.95; margin: 12px auto 16px; }
  .blessing-section h2 { font-size: clamp(21px, 6vw, 26px); line-height: 1.5; }
  .blessing-section h2 span { font-size: 15px; }
  .rsvp-section { padding-top: 39px; }
  .rsvp-card { padding: 19px 13px; }
  .form-label { font-size: 12px; }
  .rsvp-card > input, .rsvp-card > select, .rsvp-card > textarea { font-size: 16px; padding: 11px 12px; border-radius: 11px; margin-bottom: 16px; }
  .attendance-options { gap: 7px; }
  .attendance-choice span { min-height: 46px; padding: 8px 5px; font-size: 11px; }
  .closing-card { border-radius: 23px; margin: 12px 0; padding: 28px 13px 23px; }
  .closing-lotus { font-size: 47px; }
  .closing-heading { font-size: 14px; line-height: 1.9; }
  .closing-names { font-size: clamp(21px, 6.2vw, 27px); line-height: 1.55; overflow-wrap: anywhere; }
  .closing-names span { font-size: 14px; padding: 0 4px; }
  .closing-date { font-size: 11px; line-height: 1.7; }
  .host-name { font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
  .contact-link { font-size: 12px; }
  .closing-thanks { font-size: 11px; line-height: 1.8; }
}

/* Extra compact phones and landscape: avoid clipping on shorter displays. */
@media (max-width: 360px) {
  :root { --phone-gutter: 11px; }
  .invitation-main { padding-right: var(--phone-gutter); padding-left: var(--phone-gutter); }
  .topbar { padding-right: 11px; padding-left: 11px; }
  .brand-mark { font-size: 11px; }
  .share-button { padding: 6px 8px; }
  .hero-baby-art { width: min(70vw, 245px); }
  .couple-names { font-size: 19px; gap: 6px; }
  .vote-card { padding: 9px; }
  .option-illustration { width: 48px; height: 48px; font-size: 25px; }
  .event-card { padding-right: 10px; padding-left: 10px; }
  .closing-card { padding-right: 10px; padding-left: 10px; }
}

@media (max-width: 600px) and (max-height: 720px) {
  .welcome-screen { align-items: center; padding-top: 12px; padding-bottom: 22px; }
  .ganesha-art { width: min(56vw, 220px); }
  .ganesha-art img { max-height: 25svh; }
  .welcome-inner h1 { font-size: clamp(26px, 7vw, 33px); }
  .welcome-names { margin-bottom: 12px; }
  .welcome-bottom-flower { bottom: 5px; }
}


/* Phone-screen sections: keep one invitation chapter visible at a time. */
@media (max-width: 600px) {
  :root { --phone-topbar-height: 56px; }

  /* The top bar plus each chapter fill one phone viewport. The section is a
     minimum height, not a fixed height, so expanded forms can still scroll. */
  .hero-section,
  .section,
  .blessing-section,
  .closing-card {
    min-height: calc(100vh - var(--phone-topbar-height));
    min-height: calc(100svh - var(--phone-topbar-height));
    scroll-margin-top: var(--phone-topbar-height);
  }

  .hero-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 16px 5px 18px;
  }
  .hero-section .eyebrow { margin-bottom: 3px; }
  .hero-baby-art { width: min(68vw, 270px); margin: 0 auto 3px; }
  .hero-baby-art img { max-height: min(25svh, 225px); }
  .hero-kicker { margin-bottom: 5px; }
  .hero-section h2 { margin-bottom: 7px; }
  .hero-description {
    width: 100%;
    max-width: 430px;
    line-height: 1.65;
    margin-bottom: 9px;
  }
  .couple-names { margin: 8px 0 9px; }
  .date-pill { align-self: center; }
  .scroll-cue { margin-top: 8px; }

  /* Each major content block starts on its own screen, so the next chapter
     does not peek into view before the guest scrolls. */
  .section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 24px 0 22px;
  }
  .section-heading { width: 100%; margin-bottom: 14px; }
  .blessing-section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 28px 17px;
  }
  .closing-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
}

/* Short phones: tighten content spacing rather than letting a half-section
   of the next chapter appear below the current one. Taller content remains
   scrollable because these panels use min-height, not a locked height. */
@media (max-width: 600px) and (max-height: 760px) {
  .hero-section { padding-top: 10px; padding-bottom: 12px; }
  .hero-section .eyebrow { font-size: 12px; }
  .hero-baby-art { width: min(58vw, 215px); }
  .hero-baby-art img { max-height: min(21svh, 150px); }
  .hero-kicker { font-size: 11px; }
  .hero-section h2 { font-size: clamp(23px, 6vw, 28px); line-height: 1.32; }
  .hero-description { font-size: 12px; line-height: 1.5; }
  .couple-names { font-size: clamp(18px, 5vw, 22px); }
  .scroll-cue { margin-top: 6px; }
  .section { padding-top: 16px; padding-bottom: 16px; }
  .section-heading { margin-bottom: 11px; }
  .section-heading h2 { font-size: clamp(22px, 6.2vw, 27px); }
  .option-illustration { width: 46px; height: 46px; font-size: 24px; }
  .vote-option { padding: 9px 4px 8px; }
  .blessing-section { padding-top: 22px; padding-bottom: 22px; }
}


/* Unified screen cards: make each main invitation chapter feel intentional.
   The closing card is intentionally excluded so its original deep-purple design remains. */
.hero-section,
.guess-section,
.event-section,
.rsvp-section {
  position: relative;
  border: 1px solid rgba(224, 207, 242, .95);
  border-radius: 28px;
  box-shadow: 0 14px 38px rgba(112, 79, 157, .10);
  background: linear-gradient(145deg, rgba(255, 252, 255, .98), rgba(250, 244, 255, .96));
  overflow: hidden;
}

.hero-section {
  border-radius: 28px;
  margin: 16px 0;
  background: radial-gradient(ellipse at 50% 0%, rgba(242, 231, 255, .84), rgba(255, 252, 255, .98) 64%);
}

.guess-section,
.event-section,
.rsvp-section {
  margin: 16px 0;
  padding: 30px 24px;
}

/* The chapter itself is the card; avoid an unnecessary second frame around the poll. */
.guess-section .vote-card {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.event-section .event-card {
  box-shadow: none;
  background: rgba(255, 255, 255, .74);
}

/* Keep the RSVP form comfortably inside its chapter card without a nested outer frame. */
.rsvp-section .rsvp-card {
  width: 100%;
  max-width: 570px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.closing-card {
  margin: 16px 0;
}

/* The bar is visible at the very top and glides out of view on the first scroll. */
.topbar {
  transition: transform .22s ease, opacity .18s ease;
  will-change: transform;
}
body.has-scrolled .topbar {
  transform: translate3d(0, -110%, 0);
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 600px) {
  :root { --phone-topbar-height: 56px; --phone-card-gap: 12px; }
  .hero-section {
    margin: var(--phone-card-gap) 0;
    min-height: calc(100vh - var(--phone-topbar-height) - 24px);
    min-height: calc(100svh - var(--phone-topbar-height) - 24px);
    padding: 16px 12px 18px;
    border-radius: 24px;
    scroll-margin-top: 12px;
  }
  .hero-section .eyebrow { font-size: 13px; }
  .hero-baby-art { width: min(68vw, 270px); }
  .hero-baby-art img { max-height: min(25svh, 215px); }
  .hero-section h2 { font-size: clamp(24px, 6.3vw, 30px); line-height: 1.38; }
  .hero-description { font-size: 12px; line-height: 1.62; margin-bottom: 8px; }
  .couple-names { margin: 8px 0 9px; }
  .scroll-cue { margin-top: 7px; }

  .section,
  .guess-section,
  .event-section,
  .rsvp-section {
    min-height: calc(100vh - 24px);
    min-height: calc(100svh - 24px);
    margin: var(--phone-card-gap) 0;
    padding: 22px 15px;
    border-radius: 24px;
    scroll-margin-top: 12px;
  }
  .section-heading { margin-bottom: 13px; }
  .section-heading h2 { font-size: clamp(23px, 6.4vw, 29px); }
  .guess-section .vote-card { width: 100%; }
  .vote-options { gap: 8px; }
  .vote-option { padding: 12px 5px 10px; }
  .option-illustration { width: 52px; height: 52px; font-size: 27px; }

  .event-section { padding: 22px 13px; }
  .event-section .event-card { padding: 18px 13px; }
  .event-section .countdown-card { margin-top: 12px; }
  .rsvp-section { padding: 22px 15px; }
  .rsvp-section .rsvp-card { padding: 0; }
  .closing-card {
    min-height: calc(100vh - 24px);
    min-height: calc(100svh - 24px);
    margin: var(--phone-card-gap) 0;
    padding: 22px 15px;
    border-radius: 24px;
    justify-content: center;
  }
}

@media (max-width: 380px) {
  .hero-section,
  .section,
  .guess-section,
  .event-section,
  .rsvp-section,
  .closing-card { border-radius: 21px; }
  .guess-section,
  .event-section,
  .rsvp-section { padding-left: 12px; padding-right: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .topbar { transition: none; }
}


/* Calendar actions in the शुभ પ્રસંગો event card */
.calendar-actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  margin-top: 12px;
}
.calendar-button {
  width: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid #cbb5e7;
  border-radius: 999px;
  padding: 12px 17px;
  background: linear-gradient(135deg, #8060a5, #9a78bc);
  color: #fff;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 7px 18px rgba(117, 83, 157, .16);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  -webkit-tap-highlight-color: transparent;
}
.calendar-button:hover { filter: brightness(1.04); box-shadow: 0 9px 22px rgba(117, 83, 157, .22); }
.calendar-button:active { transform: translateY(1px) scale(.99); }
.calendar-button:focus-visible, .calendar-google-link:focus-visible { outline: 3px solid #d7b9f0; outline-offset: 3px; }
.calendar-button-icon { font-size: 19px; line-height: 1; }
.calendar-google-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  padding: 5px 9px;
  color: #8062a5;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(128, 98, 165, .28);
}
.calendar-note {
  margin: -2px 0 0;
  color: #a58db5;
  font-size: 10px;
  line-height: 1.6;
  text-align: center;
}
@media (prefers-reduced-motion: reduce) {
  .calendar-button { transition: none; }
}


/* Baal Hanuman hero illustration: gentle floating motion with subtle drifting petals and twinkling stars. */
.hero-baby-art.hanuman-art {
  position: relative;
  isolation: isolate;
  overflow: visible;
  animation: hanuman-float 5.2s ease-in-out infinite;
  filter: drop-shadow(0 12px 15px rgba(156, 130, 193, .11));
  transform-origin: 50% 62%;
}
.hero-baby-art.hanuman-art::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 12% 7% 2%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 57%, rgba(225, 204, 255, .40), rgba(255, 239, 249, .20) 54%, transparent 75%);
  filter: blur(15px);
  opacity: .68;
  pointer-events: none;
  animation: hanuman-aura 5.2s ease-in-out infinite;
}
.hero-baby-art.hanuman-art .hanuman-image {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  max-height: min(31svh, 265px);
  object-fit: contain;
  user-select: none;
  -webkit-user-drag: none;
  animation: hanuman-breathe 5.2s ease-in-out infinite;
  transform-origin: 50% 67%;
}
.hanuman-decorations {
  position: absolute;
  z-index: 2;
  inset: 1% 1% 3%;
  overflow: visible;
  pointer-events: none;
}
.hanuman-twinkle {
  position: absolute;
  display: block;
  color: #d5b46d;
  font-size: clamp(14px, 3.8vw, 21px);
  line-height: 1;
  text-shadow: 0 0 12px rgba(255, 225, 157, .65);
  transform-origin: center;
  animation: hanuman-twinkle 2.8s ease-in-out infinite;
}
.twinkle-a { left: 11%; top: 34%; animation-delay: -.4s; }
.twinkle-b { right: 11%; top: 24%; color: #c09ce9; font-size: clamp(18px, 4.2vw, 24px); animation-delay: -1.3s; }
.twinkle-c { right: 18%; bottom: 18%; font-size: 14px; animation-delay: -2s; }
.hanuman-petal {
  position: absolute;
  display: block;
  width: 9px;
  height: 15px;
  border-radius: 85% 0 85% 0;
  background: linear-gradient(145deg, #f5b8d7, #d78fd0);
  box-shadow: 0 2px 6px rgba(196, 123, 184, .13);
  opacity: .68;
  animation: hanuman-petal-drift 5.8s ease-in-out infinite;
}
.petal-a { left: 20%; top: 57%; animation-delay: -1.1s; }
.petal-b { right: 17%; top: 45%; width: 7px; height: 12px; background: linear-gradient(145deg, #f8d99b, #d7ae64); animation-delay: -3.2s; }
.petal-c { right: 25%; bottom: 13%; width: 6px; height: 10px; animation-delay: -4.1s; }
@keyframes hanuman-float {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(0, -6px, 0) rotate(-.35deg); }
}
@keyframes hanuman-breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.012); }
}
@keyframes hanuman-aura {
  0%, 100% { opacity: .52; transform: scale(.98); }
  50% { opacity: .82; transform: scale(1.035); }
}
@keyframes hanuman-twinkle {
  0%, 100% { opacity: .28; transform: scale(.78) rotate(0deg); }
  50% { opacity: .95; transform: scale(1.12) rotate(18deg); }
}
@keyframes hanuman-petal-drift {
  0%, 100% { opacity: .28; transform: translate3d(0, 0, 0) rotate(32deg); }
  50% { opacity: .82; transform: translate3d(7px, -13px, 0) rotate(67deg); }
}
@media (max-width: 600px) {
  .hero-baby-art.hanuman-art { width: min(76vw, 310px); }
  .hero-baby-art.hanuman-art .hanuman-image { max-height: min(27svh, 235px); }
}
@media (max-width: 600px) and (max-height: 760px) {
  .hero-baby-art.hanuman-art { width: min(62vw, 250px); }
  .hero-baby-art.hanuman-art .hanuman-image { max-height: min(22svh, 158px); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-baby-art.hanuman-art,
  .hero-baby-art.hanuman-art::before,
  .hero-baby-art.hanuman-art .hanuman-image,
  .hanuman-twinkle,
  .hanuman-petal { animation: none !important; }
}

/* Final readability and spacing pass: consistent insets, stronger type hierarchy,
   and balanced use of each phone-sized invitation panel. */
:root {
  --readable-copy: 16px;
  --readable-secondary: 14px;
  --panel-inset: 28px;
  --panel-rhythm: 18px;
}
body { font-size: 17px; line-height: 1.68; }
.hero-description { font-size: 16px; line-height: 1.75; }
.hero-kicker { font-size: 15px; line-height: 1.6; }
.couple-names { font-size: clamp(24px, 3.2vw, 28px); }
.date-pill { font-size: 14px; }
.section-heading h2 { font-size: clamp(29px, 3.4vw, 34px); line-height: 1.35; }
.section-heading .eyebrow,
.eyebrow { font-size: 14px; line-height: 1.55; letter-spacing: .025em; }
.section-heading > p:last-child { font-size: 15px; line-height: 1.7; }
.option-title { font-size: 22px; }
.option-small { font-size: 14px; line-height: 1.55; }
.choose-label { font-size: 13px; line-height: 1.5; }
.name-suggestion-heading { font-size: 17px; line-height: 1.5; }
.name-suggestion-panel .form-label,
.form-label { font-size: 15px; line-height: 1.55; }
.name-suggestion-panel input,
.rsvp-card > input,
.rsvp-card > select,
.rsvp-card > textarea { font-size: 17px; line-height: 1.55; min-height: 50px; }
.name-suggestion-panel input::placeholder,
.rsvp-card input::placeholder,
.rsvp-card textarea::placeholder { font-size: 15px; }
.demo-note { font-size: 13px; line-height: 1.65; }
.tiny-blessing { font-size: 14px; line-height: 1.6; }
.event-label { font-size: 13px; }
.event-card h3 { font-size: 27px; line-height: 1.4; }
.event-info-row small { font-size: 14px; line-height: 1.5; }
.event-info-row strong { font-size: 16px; line-height: 1.65; }
.address-text { font-size: 15px; line-height: 1.7; }
.map-button { font-size: 15px; min-height: 48px; }
.calendar-button { font-size: 15px; min-height: 50px; }
.calendar-google-link { font-size: 14px; min-height: 42px; }
.calendar-note { font-size: 12px; line-height: 1.6; }
.countdown-card > p { font-size: 14px; }
.countdown-grid span { font-size: 13px; }
.attendance-choice span { font-size: 15px; line-height: 1.5; }
.primary-button { font-size: 16px; }
.share-button { font-size: 13px; }
.brand-mark { font-size: 14px; }
.closing-heading { font-size: 17px; line-height: 1.75; }
.closing-date { font-size: 14px; line-height: 1.65; }
.hosts-intro { font-size: 14px; }
.host-name { font-size: 16px; line-height: 1.6; }
.contact-link { font-size: 15px; }
.closing-thanks { font-size: 15px; line-height: 1.7; }
.made-with-love { font-size: 12px; line-height: 1.6; }

@media (max-width: 600px) {
  :root { --panel-inset: clamp(20px, 5.2vw, 26px); --panel-rhythm: clamp(14px, 2svh, 21px); }
  body { font-size: 17px; line-height: 1.68; }

  /* Each screen uses the same top/bottom inset and a balanced vertical rhythm. */
  .hero-section,
  .guess-section,
  .event-section,
  .rsvp-section {
    padding-top: clamp(24px, 3.2svh, 32px);
    padding-bottom: clamp(24px, 3.2svh, 32px);
  }
  .hero-section {
    padding-left: clamp(17px, 4.6vw, 24px);
    padding-right: clamp(17px, 4.6vw, 24px);
    justify-content: space-evenly;
    gap: clamp(8px, 1.1svh, 13px);
  }
  .hero-section .eyebrow { font-size: 16px; margin: 0; }
  .hero-baby-art { width: min(82vw, 350px); margin: 0 auto; }
  .hero-baby-art img { max-height: min(29svh, 265px); }
  .hero-kicker { font-size: 15px; line-height: 1.6; margin: 0; }
  .hero-section h2 { font-size: clamp(28px, 7vw, 32px); line-height: 1.38; margin: 0; }
  .hero-description { font-size: 16px; line-height: 1.72; margin: 0 auto; max-width: 410px; }
  .couple-names { gap: clamp(7px, 2.4vw, 13px); font-size: clamp(24px, 6.2vw, 28px); line-height: 1.55; margin: 0; }
  .couple-names i { font-size: 14px; }
  .date-pill { font-size: 14px; line-height: 1.55; padding: 9px 13px; margin: 0 auto; }
  .scroll-cue { font-size: 13px; gap: 5px; margin: 0; }

  .section,
  .guess-section,
  .event-section,
  .rsvp-section {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: stretch;
    gap: var(--panel-rhythm);
    padding-left: var(--panel-inset);
    padding-right: var(--panel-inset);
  }
  .section-heading { width: 100%; margin: 0; }
  .section-heading .eyebrow,
  .eyebrow { font-size: 14px; line-height: 1.55; margin-bottom: 5px; }
  .section-heading h2 { font-size: clamp(28px, 7vw, 31px); line-height: 1.4; }
  .section-heading > p:last-child { font-size: 15px; line-height: 1.65; margin-top: 6px; }

  .guess-section .vote-card { width: 100%; margin: 0; }
  .vote-options { gap: 10px; }
  .vote-option { border-radius: 19px; padding: 15px 7px 13px; gap: 4px; min-height: 160px; }
  .option-illustration { width: 62px; height: 62px; font-size: 32px; margin-bottom: 5px; }
  .option-title { font-size: clamp(20px, 5.3vw, 23px); line-height: 1.45; }
  .option-small { font-size: 14px; line-height: 1.55; }
  .choose-label { font-size: 13px; margin-top: 7px; padding: 5px 10px; }
  .name-suggestion-option { width: min(100%, 300px); min-height: 130px; }
  .name-illustration { font-size: 31px; }
  .name-suggestion-panel { margin-top: 14px; padding: 18px 15px 15px; border-radius: 18px; }
  .name-suggestion-heading { font-size: 17px; margin-bottom: 14px; }
  .name-suggestion-panel .form-label, .form-label { font-size: 15px; margin-bottom: 7px; }
  .name-suggestion-panel input { font-size: 17px; min-height: 50px; padding: 12px 13px; margin-bottom: 13px; }
  .name-suggestion-panel input::placeholder { font-size: 15px; }
  .name-suggestion-panel .primary-button { width: 100%; min-height: 52px; }
  .cancel-name-suggestion { font-size: 14px; min-height: 42px; }
  .vote-results { margin-top: 18px; padding-top: 16px; }
  .results-title, .result-label { font-size: 15px; }
  .result-row { margin-bottom: 12px; }
  .vote-note { font-size: 14px; line-height: 1.65; }
  .demo-note { font-size: 13px; line-height: 1.65; margin: 12px 0 0; }
  .tiny-blessing { font-size: 14px; line-height: 1.6; margin: 0; }

  /* Event details sit directly in their screen card; text aligns to one common inset. */
  .event-section { gap: clamp(13px, 1.9svh, 19px); }
  .event-section .event-card {
    width: 100%; max-width: none; margin: 0; padding: 21px 15px 20px;
    border-radius: 18px; background: rgba(255,255,255,.62);
  }
  .event-card:before { inset: 7px; border-radius: 13px; }
  .event-card-top { font-size: 16px; gap: 10px; }
  .event-label { font-size: 13px; }
  .event-card h3 { font-size: 26px; line-height: 1.4; margin: 5px 0; }
  .event-divider { margin: 8px auto 14px; }
  .event-info-row { grid-template-columns: 34px minmax(0,1fr); gap: 10px; margin: 13px 1px; }
  .info-icon { width: 32px; height: 32px; font-size: 17px; }
  .event-info-row small { font-size: 14px; margin-bottom: 3px; }
  .event-info-row strong { font-size: 16px; line-height: 1.55; overflow-wrap: anywhere; }
  .address-text { font-size: 15px; line-height: 1.65; overflow-wrap: anywhere; }
  .map-button { margin-top: 14px; padding: 12px 14px; min-height: 48px; font-size: 15px; }
  .calendar-actions { gap: 8px; margin-top: 12px; }
  .calendar-button { min-height: 50px; padding: 12px 14px; font-size: 15px; }
  .calendar-google-link { min-height: 42px; font-size: 14px; }
  .calendar-note { font-size: 12px; line-height: 1.55; }
  .event-section .countdown-card { width: 100%; max-width: none; margin: 0; padding: 16px 10px; border-radius: 18px; }
  .countdown-card > p { font-size: 14px; line-height: 1.6; margin-bottom: 10px; }
  .countdown-grid { gap: 4px; }
  .countdown-grid strong { font-size: clamp(22px, 6.6vw, 28px); }
  .countdown-grid span { font-size: 13px; }

  .rsvp-section .rsvp-card { width: 100%; max-width: none; margin: 0; padding: 0; }
  .form-label { font-size: 15px; line-height: 1.55; margin-bottom: 7px; }
  .rsvp-card > input, .rsvp-card > select, .rsvp-card > textarea { font-size: 17px; line-height: 1.55; min-height: 50px; padding: 12px 13px; margin-bottom: 14px; }
  .rsvp-card > textarea { min-height: 100px; }
  .rsvp-card input::placeholder, .rsvp-card textarea::placeholder { font-size: 15px; }
  .attendance-field { margin-bottom: 15px; }
  .attendance-choice span { min-height: 50px; padding: 9px 7px; font-size: 14px; line-height: 1.5; }
  .submit-button { min-height: 52px; font-size: 16px; }
  .form-status { font-size: 14px; line-height: 1.6; }

  /* Keep the original deep-purple closing design; only regularize its typography and rhythm. */
  .closing-card {
    min-height: calc(100svh - 24px);
    padding: clamp(25px, 3.2svh, 32px) var(--panel-inset);
    display: flex; flex-direction: column; justify-content: space-evenly; align-items: center;
    gap: 5px; text-align: center;
  }
  .closing-stars { font-size: 17px; margin: 0; }
  .closing-card .ganesh-mantra { font-size: 16px; margin: 0; }
  .closing-lotus { font-size: 49px; line-height: 1.25; margin: 0; }
  .closing-heading { font-size: 17px; line-height: 1.7; margin: 0; }
  .closing-names { font-size: clamp(24px, 6.6vw, 29px); line-height: 1.5; margin: 0; }
  .closing-names span { font-size: 15px; padding: 0 5px; }
  .closing-date { font-size: 14px; line-height: 1.6; margin: 0; }
  .closing-line { margin: 9px auto; }
  .hosts-intro { font-size: 14px; margin: 0; }
  .host-name { font-size: 15px; line-height: 1.6; margin: 0; overflow-wrap: anywhere; }
  .contact-numbers { gap: 8px; margin: 4px 0; }
  .contact-link { font-size: 15px; line-height: 1.6; }
  .closing-thanks { font-size: 14px; line-height: 1.65; margin: 3px 0 0; }
  .made-with-love { font-size: 12px; line-height: 1.55; margin: 3px 0 0; }
}

@media (max-width: 380px) {
  body { font-size: 16px; }
  .hero-description { font-size: 15px; }
  .hero-baby-art { width: min(79vw, 310px); }
  .vote-option { padding: 13px 5px 11px; }
  .option-small { font-size: 13.5px; }
  .event-section .event-card { padding-left: 13px; padding-right: 13px; }
  .event-info-row strong { font-size: 15.5px; }
  .address-text { font-size: 14.5px; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-section, .guess-section, .event-section, .rsvp-section, .closing-card { scroll-behavior: auto; }
}