@import url('https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Tajawal:wght@400;500;700;800&display=swap');
:root{--ink:#071b24;--mint:#b9f6d4;--paper:#f4eedf}*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper);font-family:Tajawal,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;font:inherit}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:5px}button:disabled{cursor:default;opacity:.45}#world{position:fixed;inset:0;z-index:-2;background:radial-gradient(ellipse at bottom,#1b4650,transparent 80%),#06151e;overflow:hidden}.stars{position:absolute;inset:0;background-image:radial-gradient(1px 1px at 20% 22%,white 90%,transparent),radial-gradient(1px 1px at 75% 18%,white 90%,transparent);background-size:171px 223px,257px 181px}.aurora{position:absolute;inset:-50%;filter:blur(35px);background:repeating-conic-gradient(from 115deg at 50% 35%,transparent 0deg 35deg,#63efa588 40deg,#a782d855 48deg,transparent 58deg 100deg);opacity:.18;animation:dance 14s infinite alternate ease-in-out;transition:opacity 3s}.reveal .aurora{opacity:1}@keyframes dance{to{transform:rotate(20deg) translateY(8%)}}header,footer{padding:24px 5%;display:flex;align-items:center;justify-content:space-between;gap:18px}header a{color:inherit;text-decoration:none;font-size:20px}header a span{color:var(--mint)}.controls{display:flex;align-items:center;gap:24px}.controls>span,footer{font-size:11px;letter-spacing:1px;color:#adc5c5}#sound{background:#ffffff0a;color:#d3e9dd;border:1px solid #ffffff25;border-radius:25px;padding:9px 14px;font-size:12px}main{min-height:calc(100svh - 146px);max-width:1400px;margin:auto;padding:22px 5%;outline:none}.intro{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;min-height:70vh}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--mint)}h1{font:400 clamp(40px,5.6vw,77px)/1.4 Amiri,Georgia,serif;margin:20px 0}h1 em{font-style:normal;color:var(--mint)}p{font-size:18px;line-height:1.9;color:#c7dbd6}.primary{background:var(--mint);color:#143b34;border:0;border-radius:5px;padding:17px 26px;font-weight:800;box-shadow:0 8px 30px #0002}.primary:hover{filter:brightness(1.08)}.sub{font-size:12px;color:#aac5bd}.passport{background:#153b38;border:1px solid #668879;border-radius:8px;max-width:390px;margin:auto;transform:rotate(-4deg);padding:25px;box-shadow:15px 25px 80px #0007;width:100%}.passport-title{font-size:12px;color:#d7c395;letter-spacing:4px;text-align:center}.portrait{height:205px;width:155px;object-fit:cover;object-position:57% 39%;border-radius:4px;display:block;margin:24px auto 17px;filter:saturate(.8)}.passport h2{font:36px Amiri;text-align:center;margin:10px}.passport-details{display:flex;justify-content:space-between;border-top:1px solid #ffffff25;padding-top:16px;font-size:13px;color:#d8e2d6}.passport-bottom{text-align:center;color:#d7c395;font-size:10px;letter-spacing:3px;margin-top:20px}.scenehead{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px}.scenehead h1{font-size:clamp(33px,4vw,52px);margin:8px 0}.scenehead p{font-size:15px;margin:0}.steps{display:flex;gap:8px;margin-top:18px}.steps i{width:25px;height:3px;background:#ffffff25}.steps i.on{background:var(--mint)}.theatre{position:relative;height:clamp(370px,52vh,570px);border:1px solid #ffffff20;border-radius:16px;overflow:hidden;isolation:isolate;box-shadow:0 20px 90px #0003}.airport{background:linear-gradient(180deg,#16353e,#567477 70%,#172c35 70%)}.terminal-glass{position:absolute;inset:0 0 30%;background:repeating-linear-gradient(90deg,transparent 0 18%,#b4d0cb25 18% 18.6%),linear-gradient(#47727d55,#bcc6b066)}.terminal-glass:before{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 70px,#c7e4dd22 70px 74px)}.runway{position:absolute;bottom:33%;left:-10%;width:120%;height:20px;background:#829497;transform:rotate(-3deg)}.jet{position:absolute;bottom:40%;left:20%;font-size:95px;color:#dae9e3;transform:rotate(-9deg)}.board{position:absolute;top:25px;left:25px;right:25px;background:#0b1c20e8;padding:20px;color:#d4e0c2;box-shadow:0 5px 20px #0004}.board-title{font:11px monospace;letter-spacing:3px;margin-bottom:15px;color:#9cb9b2}.board-line{display:flex;justify-content:space-between;gap:10px;direction:ltr;font:clamp(12px,2vw,21px) monospace}.board-line b{color:#caeaa6}.gate{position:absolute;right:8%;bottom:22%;background:#16353c;border:1px solid #9bb3a1;padding:15px 24px;text-align:center}.gate strong{display:block;font:45px Georgia;color:#d5dfbb}.seats{position:absolute;bottom:12%;left:10%;display:flex;gap:5px}.seats i{display:block;width:45px;height:45px;border:3px solid #829ba0;border-top:0;border-radius:0 0 10px 10px;background:#203c46}.scan-card{position:absolute;bottom:26px;right:50%;transform:translateX(50%) rotate(-3deg);background:var(--paper);color:#193b36;border:0;border-radius:6px;padding:15px 20px;display:flex;align-items:center;gap:18px;box-shadow:0 8px 30px #0006;text-align:right;min-width:260px}.scan-card img{width:47px;height:58px;object-fit:cover;object-position:55% 40%;border-radius:3px}.scan-card strong{display:block;font-size:17px}.scan-card small{display:block;font-size:11px;margin-top:6px}.scan-card:after{content:'';height:42px;width:45px;background:repeating-linear-gradient(90deg,#173c32 0 2px,transparent 2px 4px)}.scan-card.scanned{box-shadow:0 0 30px #a5ffad88}.caption{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px;min-height:60px}.caption p{font-size:14px;margin:0}.caption .primary{min-width:190px}.cabin{background:radial-gradient(ellipse at center,#899c9d,#455860 70%)}.window{position:absolute;top:8%;left:50%;transform:translateX(-50%);width:220px;height:300px;border:17px solid #bac6c6;border-radius:100px;box-shadow:0 0 0 8px #4a626c,0 14px 22px #0004;overflow:hidden;background:linear-gradient(#508da7,#cedfdf)}.window .outside{position:absolute;inset:0;background:linear-gradient(#578baf,#b5d7e1 65%,#f5f4e7);transition:transform 6s}.cloud{position:absolute;border-radius:50%;background:#fff9;width:150px;height:40px;bottom:25%;left:-30px;box-shadow:85px 30px 0 8px #fff8}.flying .outside{transform:scale(1.4) translateY(20%)}.flying .cloud{animation:clouds 7s linear infinite}@keyframes clouds{to{transform:translateX(300px)}}.shade{position:absolute;inset:0;background:linear-gradient(#c8d1cd,#80989c);border:0;border-bottom:8px solid #e4e8dd;border-radius:0 0 80px 80px;color:#193b40;transition:transform 1s;font-weight:700;padding-top:80px}.shade.open{transform:translateY(-95%)}.belt{position:absolute;bottom:28px;left:50%;transform:translateX(-50%);background:#142c35;border:2px solid #b9cbca;border-radius:10px;padding:16px 30px;color:#e0e9df;min-width:230px}.belt:before{content:'▰ ▰';display:block;font:30px monospace;color:#c8d2c9;letter-spacing:12px;margin-bottom:6px}.belt.locked{border-color:var(--mint);color:var(--mint)}.seat-no{position:absolute;right:25px;top:25px;border:1px solid #cedbd555;border-radius:20px;padding:8px 13px;font:12px monospace}.flight-route{position:absolute;left:25px;top:25px;font:12px monospace;color:#e3e9e4;writing-mode:vertical-rl;letter-spacing:3px}.forest{background:linear-gradient(#102e3c 0 60%,#bbd4db 60%,#e5eff0);perspective:700px}.forest:after{content:'';position:absolute;bottom:-30%;left:22%;width:56%;height:70%;background:linear-gradient(#9eb8c988,#f5f5ef);clip-path:polygon(48% 0,52% 0,100% 100%,0 100%);z-index:1}.trees{position:absolute;inset:0;transition:transform 1s;z-index:2;pointer-events:none}.tree{position:absolute;bottom:18%;width:100px;height:230px;background:#0b3036;clip-path:polygon(50% 0,72% 28%,63% 28%,90% 58%,73% 58%,100% 86%,56% 86%,56% 100%,44% 100%,44% 86%,0 86%,27% 58%,10% 58%,37% 28%,28% 28%)}.tree:after{content:'';position:absolute;inset:0;background:#cce1e0;clip-path:polygon(50% 0,67% 21%,49% 16%,36% 21%,48% 8%,50% 0)}.hut{position:absolute;bottom:37%;left:42%;width:90px;height:65px;background:#633e31;border:3px solid #29383a;z-index:3;transition:transform 1s}.hut:before{content:'';position:absolute;width:120px;height:60px;left:-18px;top:-49px;background:#e2e8e3;clip-path:polygon(50% 0,100% 100%,0 100%)}.hut:after{content:'';position:absolute;width:22px;height:26px;background:#ffd788;top:15px;left:30px;box-shadow:0 0 30px #ffc75c99}.walk-button{position:absolute;bottom:28px;z-index:5;left:50%;transform:translateX(-50%)}.flakes{position:absolute;inset:0;pointer-events:none;z-index:4;background-image:radial-gradient(2px 2px at 10% 10%,#fff9 90%,transparent),radial-gradient(1px 1px at 40% 40%,#fff9 90%,transparent);background-size:90px 120px,67px 80px;animation:snow 12s linear infinite}@keyframes snow{to{background-position:60px 480px,20px 320px}}.night .aurora{opacity:.45}.final{position:relative;text-align:center;min-height:65vh;padding:35px 0}.final h1{font-size:clamp(39px,5.5vw,70px)}.final p{max-width:630px;margin:20px auto}.sky-touch{background:transparent;color:var(--mint);border:1px solid #b9f6d455;border-radius:50%;width:145px;height:145px;font-size:17px;box-shadow:0 0 60px #a4ffb311;animation:pulse 3s infinite}.sky-touch span{display:block;font-size:35px;margin-bottom:12px}@keyframes pulse{50%{box-shadow:0 0 90px #a4ffb344}}.letter{animation:arrive 1.2s ease}.signature{font:32px Amiri;color:var(--mint)}.keepsake{display:inline-flex;gap:14px;align-items:center;margin:15px auto;border:1px solid #ffffff30;padding:12px 20px;border-radius:8px;text-align:right}.keepsake img{width:52px;height:65px;object-fit:cover;object-position:55% 40%;border-radius:4px}.secondary{display:block;margin:20px auto;background:none;border:1px solid #ffffff35;color:#d7e8dd;padding:12px 24px;border-radius:5px}.toast{color:var(--mint)!important}.arrival{animation:arrive .7s ease}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){header,footer{padding:20px 6%}.controls>span{display:none}header a{font-size:17px}main{padding:10px 6%}.intro{grid-template-columns:1fr;gap:35px;padding-bottom:30px}.intro h1{font-size:49px}.intro p{font-size:16px}.passport{max-width:320px}.portrait{height:170px;width:135px}.scenehead{display:block}.scenehead h1{font-size:35px}.steps{margin-top:12px}.theatre{height:430px}.caption{align-items:stretch;flex-direction:column;gap:12px}.caption .primary{width:100%}.board{left:15px;right:15px;padding:17px}.gate{right:5%;bottom:26%}.seats{left:5%}.seats i{width:30px}.window{height:285px;width:200px}.tree{width:80px}.final p{font-size:17px}footer{font-size:10px}.primary{padding:15px 20px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}