:root{--ink:#080a1c;--paper:#f9eaf2;--pink:#ff94bd;--lav:#b59aff;--blue:#79c9ff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:#f9f4fc;font-family:"DM Sans",sans-serif;overflow-x:hidden}.aurora{position:fixed;width:45vw;height:45vw;border-radius:50%;filter:blur(90px);opacity:.18;pointer-events:none;z-index:-1}.aurora-one{background:#5633ac;top:-15vw;left:-12vw}.aurora-two{background:#d8499d;right:-20vw;top:25vh}#stars{inset:0;position:fixed;z-index:-1;overflow:hidden}.star{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;box-shadow:0 0 8px #cdd6ff;animation:twinkle var(--d) ease-in-out infinite alternate}@keyframes twinkle{to{opacity:.18;transform:scale(.5)}}main{max-width:1200px;margin:auto}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:70px 24px}.eyebrow{text-transform:uppercase;letter-spacing:.2em;color:#c9badb;font-size:11px;font-weight:600;margin:0 0 28px}.names{display:flex;align-items:center;gap:43px;margin-bottom:35px}.person{display:grid;gap:4px}.person .flag{font-size:27px}.person strong{font:600 26px "Playfair Display",serif}.person em{font-size:13px;color:#c7bad1;font-style:normal}.connection-mark{width:145px;height:70px;position:relative;color:var(--pink);font-size:31px}.connection-mark span{position:absolute;top:13px;left:57px;z-index:2;text-shadow:0 0 22px #ff7eb7}.connection-mark i{position:absolute;top:30px;left:0;width:145px;border-top:1px solid #bb8bcd}.connection-mark b{position:absolute;right:-7px;top:20px;font-size:11px;color:#d9c4ff}.hero h1,.section-heading h2,.final-section h2{font:500 clamp(38px,6vw,74px)/1.08 "Playfair Display",serif;letter-spacing:-.04em;margin:0}.hero h1 i,.section-heading h2 i,.heart-message i{font-weight:500;color:#f7b2d0}.reveal-button{margin-top:46px;border:1px solid rgba(255,192,222,.55);background:linear-gradient(120deg,#e86caa,#9870d1);color:white;padding:16px 24px;border-radius:100px;font:500 14px "DM Sans";cursor:pointer;box-shadow:0 8px 35px #c6518a55;transition:.3s}.reveal-button:hover{transform:translateY(-3px);box-shadow:0 13px 42px #c6518a77}.reveal-button span,.love-line span,.signature span,.final-section h2 span{color:#ff93bc}.scroll-note{margin-top:20px;color:#a8a0bd;font-size:12px}.map-section{padding:130px 24px 110px;text-align:center}.section-heading{margin-bottom:35px}.map-wrap{max-width:900px;margin:auto;position:relative}.map{width:100%;overflow:visible}.land{fill:url(#land);opacity:.73;stroke:#737bb2;stroke-width:1}.africa{opacity:.66}.coast{fill:none;stroke:#9a8bc4;stroke-width:.9;stroke-dasharray:3 7;opacity:.65}.water-label{fill:#9b91bc;font:10px "DM Sans";letter-spacing:4px;opacity:.55}.route{fill:none;stroke-linecap:round}.route-soft{stroke:#db73b6;stroke-width:15;opacity:.11;filter:url(#glow)}.route-bright{stroke:url(#routeGradient);stroke:#ffa2ce;stroke-width:2;stroke-dasharray:3 8;filter:url(#glow);animation:dash 1.7s linear infinite}@keyframes dash{to{stroke-dashoffset:-22}}.place-halo{fill:#fd8abe;opacity:.16;animation:pulse 2.2s ease-out infinite}.place-dot{fill:#fff;filter:url(#glow)}.france-dot{stroke:#ff9dcc;stroke-width:4}.egypt-dot{stroke:#a994ff;stroke-width:4}@keyframes pulse{70%{transform:scale(1.35);opacity:0}100%{opacity:0}}.map-label text{fill:#f8eefa;font:600 12px "DM Sans";letter-spacing:1.8px}.map-label .country{fill:#c8b9d8;font-size:10px;letter-spacing:1px}.travel text{font:19px "DM Sans";fill:#ff94bd;filter:url(#glow)}.journey{display:flex;justify-content:center;gap:34px;flex-wrap:wrap;margin:8px auto 37px;color:#efe7f5;font-size:14px}.journey .middle{color:#c5b5df;font-size:12px}.distance{display:inline-flex;align-items:center;text-align:left;gap:15px;border:1px solid #806a9d66;border-radius:15px;padding:13px 20px;background:#17173155}.distance b{font:500 30px "Playfair Display";color:#f9b3d0}.distance span{font-size:12px;color:#c7bdd2;line-height:1.55}.distance small{font-size:10px;color:#8f88a5}.letter-section{padding:95px 24px;background:linear-gradient(130deg,#16112b88,#38204755);border-block:1px solid #8f70a733}.letter{max-width:650px;margin:auto}.letter h2{font:500 44px "Playfair Display";margin:0 0 24px}.letter>p:not(.eyebrow){font:400 17px/1.9 "DM Sans";color:#e3dce9;margin:0 0 22px}.letter .love-line{font:500 25px "Playfair Display";color:#fff;margin:35px 0}.letter .signature{font:italic 20px/1.5 "Playfair Display"!important;color:#f6c8dc!important;margin-top:38px!important}.heart-section{text-align:center;padding:130px 24px}.big-heart{display:grid;place-items:center;margin:auto;width:145px;height:145px;border:0;border-radius:50%;background:radial-gradient(circle at 35% 28%,#ffb3cf,#dc578f 55%,#9250aa);color:#fff;font-size:69px;cursor:pointer;box-shadow:0 0 0 1px #ffc0d855,0 0 45px #f560a488;transition:.35s}.big-heart:hover{transform:scale(1.08);box-shadow:0 0 65px #f560a4bb}.big-heart.active{animation:heartbeat .8s ease-in-out 2}@keyframes heartbeat{50%{transform:scale(1.24)}}.heart-prompt{color:#b7aac5;font-size:12px;margin:20px}.heart-message{max-height:0;overflow:hidden;opacity:0;transition:.8s;font:500 28px/1.35 "Playfair Display";color:#f3edf8}.heart-message.show{max-height:100px;opacity:1;margin-top:32px}.burst-heart{position:fixed;z-index:5;color:#ff9fc7;font-size:20px;pointer-events:none;animation:floatAway 2.7s ease-out forwards}@keyframes floatAway{to{transform:translate(var(--x),var(--y)) rotate(30deg);opacity:0}}.final-section{text-align:center;padding:110px 24px 120px}.mini-route{display:flex;align-items:center;justify-content:center;gap:11px;margin-bottom:32px}.mini-route span{font-size:20px}.mini-route i{height:1px;width:85px;background:linear-gradient(90deg,#9284e9,#ff9bc4);position:relative}.mini-route b{color:#ff9cc3;font-size:20px;text-shadow:0 0 15px #ff88bb}.final-section h2{font-size:48px}.from{color:#c7b5d2;font:italic 16px "Playfair Display"}.final-note{margin:53px auto 0;color:#aaa1bd;font-size:13px}@media(max-width:600px){.names{gap:16px}.connection-mark{width:72px}.connection-mark i{width:72px}.connection-mark span{left:24px}.connection-mark b{right:-3px}.person strong{font-size:21px}.map-section{padding-block:90px}.journey{flex-direction:column;gap:13px}.letter-section{padding-block:70px}.letter>p:not(.eyebrow){font-size:16px}.map-label text{font-size:10px}}
