:root{--primary:#ff758c;--primary-light:#ff7eb3;--secondary:#fceabb;--accent:#ff4e50;--bg:#1a0b1c;--bg-alt:#26112a;--text:#fdf2f8;--text-muted:#fbcfe8;--border:#ff758c33;--glass-bg:#1a0b1cb3;--font-sans:"Poppins", sans-serif;--font-serif:"Cinzel", serif;--font-script:"Great Vibes", cursive;--font-motherly:"Dancing Script", cursive;--font-warm:"Pacifico", cursive;--font-gentle:"Satisfy", cursive;--font-playful:"Kalam", cursive;--font-kannada:"Baloo Tamma 2", cursive;--container-width:1200px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-sans);background-color:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden}.kannada-text{font-family:var(--font-kannada);line-height:1.8}.accent{font-family:var(--font-script);color:var(--primary);font-size:1.5em;display:inline-block}.music-btn{background:var(--glass-bg);border:1px solid var(--border);width:50px;height:50px;color:var(--text);cursor:pointer;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:50%;justify-content:center;align-items:center;font-size:1.5rem;transition:all .3s;display:flex;position:relative;bottom:2rem;right:2rem;box-shadow:0 4px 15px #0000004d}.music-btn:before{content:"";border:2px solid var(--primary);opacity:0;border-top:2px solid #0000;border-radius:50%;width:30px;height:30px;animation:1s linear infinite musicLoading;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.music-btn.loading:before{opacity:1}.music-btn.loading{color:#0000}@keyframes musicLoading{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}.music-btn:hover{transform:scale(1.1)}.music-btn.playing{background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);color:#fff;border-color:var(--primary);animation:2s infinite pulse}.music-btn.playing:after{content:"🎶";font-size:.8rem;animation:2s ease-in-out infinite noteFloat;position:absolute;top:-8px;right:-5px}@keyframes roseBloom{0%{opacity:0;transform:scale(0)rotate(-180deg)}50%{opacity:.8;transform:scale(1.2)rotate(-90deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes lineAppear{0%{opacity:0;transform:scaleX(0)}to{opacity:.6;transform:scaleX(1)}}@keyframes decorAppear{0%{opacity:0;transform:translateY(10px)scale(.8)}to{opacity:.7;transform:translateY(0)scale(1)}}@keyframes heartPulse{0%,to{opacity:.3;transform:scale(1)}50%{opacity:.6;transform:scale(1.2)}}@keyframes noteFloat{0%,to{opacity:1;transform:translateY(0)}50%{opacity:.7;transform:translateY(-8px)}}@keyframes pulse{0%{box-shadow:0 0 #ff758c66}70%{box-shadow:0 0 0 15px #ff758c00}to{box-shadow:0 0 #ff758c00}}.hero{background:radial-gradient(circle at center, var(--bg-alt) 0%, var(--bg) 100%);flex-direction:column;min-height:100vh;display:flex;position:relative}.nav{text-align:center;padding:2rem}.nav__brand{font-family:var(--font-motherly);color:var(--primary);text-shadow:0 2px 10px #ff758c4d;letter-spacing:1px;font-size:3rem;font-weight:600}.hero__container{max-width:var(--container-width);flex:1;align-items:center;margin:0 auto;padding:0 2rem;display:flex}.hero__content{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;display:grid}.baby-illustration-wrapper{filter:drop-shadow(0 8px 16px #0003);width:180px;height:180px;margin-bottom:2rem;animation:4s ease-in-out infinite babyFloat}@keyframes babyFloat{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-8px)rotate(2deg)}}.flower-container{animation:6s ease-in-out infinite gentleFloat}@keyframes gentleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.heart-beat{transform-origin:50%;animation:1.5s infinite heartbeat}@keyframes heartbeat{0%,to{transform:scale(1)}15%{transform:scale(1.2)}30%{transform:scale(1)}45%{transform:scale(1.2)}}.hero__tag{color:var(--primary-light);letter-spacing:3px;text-transform:uppercase;font-size:1.1rem;font-family:var(--font-gentle);text-shadow:0 2px 8px #ff758c4d;margin-bottom:1rem;font-weight:400}.hero__title{font-family:var(--font-motherly);text-shadow:0 3px 15px #ff758c33;margin-bottom:1.5rem;font-size:4.5rem;font-weight:600;line-height:1.1}.hero__title--accent{color:var(--primary);font-family:var(--font-motherly);text-shadow:0 4px 20px #ff758c66;font-size:5.5rem;font-weight:600}.hero__subtitle{font-family:var(--font-playful);color:var(--text-muted);text-shadow:0 1px 5px #ff758c33;margin-bottom:2rem;font-size:1.3rem;font-weight:400}.letter-container{perspective:1000px}.animated-letter{filter:drop-shadow(0 10px 20px #0000004d);animation:12s ease-in-out infinite letterFloat;position:relative}@keyframes letterFloat{0%,to{transform:translateY(0)rotateX(0)rotateY(0)}33%{transform:translateY(-15px)rotateX(2deg)rotateY(1deg)}66%{transform:translateY(-8px)rotateX(-1deg)rotateY(-1deg)}}.letter-paper{width:650px;height:800px;transform-style:preserve-3d;background:linear-gradient(135deg,#fefefe 0%,#f9f9f9 100%),repeating-linear-gradient(0deg,#0000,#0000 24px,#c8c8c81a 25px);border:3px solid #ff758c26;border-radius:15px;padding:4rem;animation:15s ease-in-out infinite paperFloat;position:relative;overflow:hidden;box-shadow:0 30px 70px #00000059,0 15px 35px #00000040,inset 0 2px #ffffffe6,inset 0 0 50px #fffc}.letter-paper:before{content:"";background:linear-gradient(#0000 0%,#ff758c4d 10% 90%,#0000 100%);width:2px;position:absolute;top:0;bottom:0;left:60px}@keyframes paperFloat{0%,to{transform:translateY(0)rotateX(0)rotateY(0)}25%{transform:translateY(-8px)rotateX(1deg)rotateY(1deg)}50%{transform:translateY(-12px)rotateX(0)rotateY(-1deg)}75%{transform:translateY(-6px)rotateX(-1deg)rotateY(1deg)}}.letter-paper:before{content:"";background:linear-gradient(90deg,#0000 0%,#fff6 50%,#0000 100%);animation:8s ease-in-out infinite paperShimmer;position:absolute;inset:0;transform:translate(-100%)}@keyframes paperShimmer{0%,90%,to{transform:translate(-100%)}10%,80%{transform:translate(100%)}}@keyframes paperSway{0%,to{transform:rotateY(0)rotateX(0)scale(1)}25%{transform:rotateY(2deg)rotateX(1deg)scale(1.02)}50%{transform:rotateY(0)rotateX(-1deg)scale(1.01)}75%{transform:rotateY(-2deg)rotateX(1deg)scale(1.02)}}.letter-header{text-align:right;z-index:2;margin-bottom:3rem;position:relative}.letter-date{font-family:var(--font-motherly);color:var(--primary);opacity:0;margin-bottom:.5rem;font-size:1.3rem;animation:1.5s ease-out 1s both writeIn}.letter-location{font-family:var(--font-gentle);color:#666;opacity:0;font-size:1rem;font-style:italic;animation:1.5s ease-out 1.5s both writeIn}.letter-greeting{margin-bottom:3rem;position:relative}.greeting-text{font-family:var(--font-motherly);color:var(--primary);opacity:0;font-size:2.2rem;font-weight:600;animation:2s ease-out 2s both writeIn;display:inline-block}.greeting-underline{background:linear-gradient(90deg, var(--primary), transparent);transform-origin:0;height:3px;margin-top:.5rem;animation:1.5s ease-out 3.5s both underlineGrow;transform:scaleX(0)}.letter-body{font-family:var(--font-playful);color:#2c2c2c;font-size:1.25rem;line-height:2.2}.letter-paragraph{opacity:0;text-align:justify;margin-bottom:2.5rem;position:relative}.letter-indent{color:var(--primary);margin-right:.2rem;font-size:1.4rem;font-weight:600}.para-1{animation:3s ease-out 4s both typeWriter}.para-2{animation:3s ease-out 6s both typeWriter}.para-3{animation:3s ease-out 10s both typeWriter}.para-4{animation:3s ease-out 12s both typeWriter}@keyframes typeWriter{0%{opacity:0;transform:translate(-20px)}10%{opacity:.3}to{opacity:1;transform:translate(0)}}@keyframes writeIn{0%{opacity:0;transform:translateY(-10px)rotate(-1deg)}to{opacity:1;transform:translateY(0)rotate(0)}}@keyframes underlineGrow{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.letter-text{font-family:var(--font-playful);color:#333;font-size:1.2rem;font-weight:400;line-height:2}.letter-section{margin-bottom:1rem}.letter-section-1 .letter-paragraph:first-child{animation-delay:2.5s}.letter-section-1 .letter-paragraph:nth-child(2){animation-delay:3s}.letter-rose-divider{justify-content:center;align-items:center;margin:2.5rem 0;display:flex;position:relative}.letter-rose-divider:before,.letter-rose-divider:after{content:"";background:linear-gradient(90deg, transparent, var(--primary), transparent);opacity:0;flex:1;height:2px;animation:1s ease-out 4s both lineAppear}.letter-rose-divider .flower-container{opacity:0;animation:2s ease-out 4.5s both roseBloom;transform:scale(0)rotate(-180deg)}.letter-section-2 .letter-paragraph:first-child{animation-delay:5.5s}.letter-section-2 .letter-paragraph:nth-child(2){animation-delay:6s}.letter-section-2 .letter-closing{animation-delay:6.5s}.letter-paragraph{opacity:0;text-align:justify;text-indent:2rem;margin-bottom:2rem;font-size:1.15rem;line-height:2.1;animation:1.2s ease-out both textAppear}.letter-paragraph:first-child{animation-delay:2.5s}.letter-paragraph:nth-child(2){animation-delay:3s}.letter-closing{font-family:var(--font-motherly);color:var(--primary);opacity:0;text-align:center;text-indent:0;margin-top:2.5rem;font-size:1.5rem;font-style:italic;font-weight:600;animation:1.2s ease-out both textAppear}@keyframes textAppear{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.letter-signature{z-index:2;position:absolute;bottom:4rem;right:4rem}.signature-line{flex-direction:column;align-items:flex-end;gap:.5rem;display:flex}.signature-label{font-family:var(--font-gentle);color:#666;opacity:0;font-size:1rem;font-style:italic;animation:1.5s ease-out 16s both writeIn}.signature-name{font-family:var(--font-motherly);color:var(--primary);opacity:0;font-size:2rem;font-weight:700;animation:3s ease-out 17s both signatureWrite}.signature-flourish{opacity:0;margin-top:.5rem;animation:2s ease-out 19s both flourishDraw}.signature-curve{stroke-dasharray:100;stroke-dashoffset:100px;animation:2s ease-out 19s both curveDraw}@keyframes signatureWrite{0%{opacity:0;filter:blur(2px);transform:translate(-30px)rotate(-5deg)}50%{opacity:.7;filter:blur(1px)}to{opacity:1;filter:blur();transform:translate(0)rotate(0)}}@keyframes flourishDraw{0%{opacity:0;transform:scale(.5)}to{opacity:.8;transform:scale(1)}}@keyframes curveDraw{0%{stroke-dashoffset:100px}to{stroke-dashoffset:0}}.letter-decorations{pointer-events:none;position:absolute;inset:0}.corner-decoration{opacity:0;font-size:1.2rem;animation:1s ease-out both decorationAppear;position:absolute}.top-left{animation-delay:20s;top:1.5rem;left:1.5rem}.top-right{animation-delay:20.5s;top:1.5rem;right:1.5rem}.bottom-left{animation-delay:21s;bottom:1.5rem;left:1.5rem}@keyframes decorationAppear{0%{opacity:0;transform:scale(0)rotate(180deg)}50%{transform:scale(1.3)rotate(90deg)}to{opacity:.6;transform:scale(1)rotate(0)}}@keyframes underlineWrite{0%{transform:scaleX(0)}to{transform:scaleX(1)}}.letter-fold{z-index:3;background:linear-gradient(135deg,#0000 50%,#0000001a 50%);border-radius:0 12px 0 0;width:60px;height:60px;animation:8s ease-in-out infinite foldFlutter;position:absolute;top:0;right:0}@keyframes foldFlutter{0%,90%,to{transform:rotate(0)}5%,85%{transform:rotate(2deg)}10%,80%{transform:rotate(-1deg)}}.letter-shadow{z-index:-1;background:radial-gradient(#0000004d 0%,#0000 70%);border-radius:50%;height:35px;animation:6s ease-in-out infinite shadowDance;position:absolute;bottom:-20px;left:20px;right:20px}@keyframes shadowDance{0%,to{opacity:.3;transform:scale(1)skew(0)}33%{opacity:.4;transform:scale(1.1)skew(2deg)}66%{opacity:.2;transform:scale(.9)skew(-2deg)}}.scroll-indicator{opacity:.7;font-family:var(--font-gentle);color:var(--text-muted);flex-direction:column;align-items:center;gap:1rem;font-size:.9rem;display:flex;position:absolute;bottom:2rem;left:50%;transform:translate(-50%)}.scroll-indicator__line{background:linear-gradient(to bottom, var(--primary), transparent);width:1px;height:40px;animation:2s infinite scrollDown}@keyframes scrollDown{0%{transform-origin:top;transform:scaleY(0)}50%{transform-origin:top;transform:scaleY(1)}50.1%{transform-origin:bottom;transform:scaleY(1)}to{transform-origin:bottom;transform:scaleY(0)}}.footer{text-align:center;border-top:1px solid var(--border);padding:4rem 2rem}.footer__main{font-size:1.2rem;font-family:var(--font-playful);margin-bottom:1rem;font-weight:400}.footer__wishes{font-family:var(--font-motherly);color:var(--primary-light);font-size:2.5rem;font-weight:600}@media (width<=900px){.hero__content{text-align:center;grid-template-columns:1fr;gap:2rem}.hero__media-row{flex-direction:column;gap:2rem}.baby-illustration-wrapper{width:150px!important;height:150px!important}.letter-paper{width:550px;height:700px;padding:3rem}.letter-body{font-size:1.1rem}.letter-paragraph{font-size:1.05rem;line-height:2}.greeting-text{font-size:1.8rem}.signature-name{font-size:1.7rem}.letter-rose-section .flower-container{width:140px!important;height:140px!important}.hero__title{font-size:3rem}.hero__title--accent{font-size:4rem}}@media (width<=600px){.hero__content,.hero__media-row{gap:1.5rem}.baby-illustration-wrapper{width:120px!important;height:120px!important}.letter-paper{width:380px;height:550px;padding:2.5rem}.letter-body{font-size:1rem;line-height:2}.letter-paragraph{margin-bottom:2rem;font-size:.95rem;line-height:2}.greeting-text{margin-bottom:1.5rem;font-size:1.6rem}.letter-closing{margin-top:2rem;font-size:1.4rem}.signature-name{font-size:1.5rem}.letter-date{font-size:1.1rem}.letter-rose-section .flower-container{width:120px!important;height:120px!important}.letter-rose-section{margin:2rem 0}.letter-signature{bottom:2.5rem;right:2.5rem}.corner-decoration{font-size:1rem}.hero__title{font-size:2.2rem}.hero__title--accent{font-size:2.8rem}.nav{padding:1rem}.music-btn{width:50px;height:50px;bottom:1rem;right:1rem}.footer{padding:3rem 1rem}}
