:root { --ink:#050a32; --ocean:#092c96; --aqua:#075ee5; --coral:#0798eb; --sand:#e8f1ff; --cream:#f8fbff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); font-family:"Manrope",sans-serif; }
a { color:inherit; text-decoration:none; }
.site-shell { min-height:100svh; overflow:hidden; position:relative; display:grid; grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr); grid-template-rows:auto 1fr auto; padding:30px clamp(24px,5vw,78px) 24px; isolation:isolate; }
.site-shell:before { content:""; position:absolute; inset:0; z-index:-3; background:radial-gradient(circle at 78% 24%,rgba(7,94,229,.13),transparent 28%),linear-gradient(115deg,#fafdff 0 57%,#e9f2ff 57% 100%); }
.ambient { position:absolute; border-radius:50%; filter:blur(1px); z-index:-2; animation:drift 10s ease-in-out infinite alternate; }
.ambient-one { width:330px;height:330px;right:-110px;top:-90px;background:rgba(7,152,235,.13); }
.ambient-two { width:210px;height:210px;left:35%;bottom:-110px;background:rgba(9,44,150,.10);animation-delay:-4s; }
.topbar { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; z-index:4; }
.brand { display:flex; align-items:center; gap:13px; }
.brand-mark { display:grid; place-items:center; width:48px;height:48px;border-radius:50% 50% 45% 55%; color:white; background:linear-gradient(135deg,var(--ocean),var(--aqua)); font-weight:900; font-size:15px; letter-spacing:-1px; transform:rotate(-6deg); box-shadow:0 10px 28px rgba(8,127,140,.22); }
.brand-copy { display:grid; line-height:1; gap:5px; }
.brand-copy strong { letter-spacing:.17em;font-size:14px; }
.brand-copy small { font-size:8px;letter-spacing:.35em;color:var(--ocean); }
.top-contact { border-bottom:1px solid rgba(8,60,75,.3);font-size:13px;font-weight:800;padding:7px 0; }
.top-contact span { color:var(--coral);margin-left:5px; }
.hero { align-self:center; max-width:760px; padding:clamp(60px,9vh,110px) 0 55px; z-index:2; }
.eyebrow { display:flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.18em;color:var(--ocean);font-size:11px;font-weight:800;margin-bottom:22px; }
.eyebrow span { width:28px;height:2px;background:var(--coral); }
h1 { margin:0;font-family:"Playfair Display",serif;font-size:clamp(48px,6.25vw,92px);line-height:.98;letter-spacing:-.045em;font-weight:700; }
h1 em { color:var(--ocean);font-weight:500; }
.intro { max-width:620px;margin:28px 0;color:#496970;font-size:clamp(15px,1.3vw,18px);line-height:1.75; }
.flight-scene { position:relative;width:min(100%,600px);height:104px;margin:24px 0 25px;overflow:hidden;border-radius:22px;background:linear-gradient(110deg,rgba(232,241,255,.8),rgba(255,255,255,.25));border:1px solid rgba(9,44,150,.08); }
.flight-path { position:absolute;width:82%;height:100px;left:6%;top:37px;border-top:2px dashed rgba(7,94,229,.28);border-radius:50%;transform:rotate(-5deg); }
.flying-plane { position:absolute;left:-52px;top:46px;color:var(--ocean);font-size:38px;filter:drop-shadow(0 7px 8px rgba(5,10,50,.22));z-index:2;animation:plane-flight 6.5s cubic-bezier(.45,.05,.55,.95) infinite; }
.flight-cloud { position:absolute;width:56px;height:14px;border-radius:30px;background:rgba(255,255,255,.95);box-shadow:0 7px 18px rgba(9,44,150,.08); }
.flight-cloud:before,.flight-cloud:after { content:"";position:absolute;bottom:0;border-radius:50%;background:inherit; }
.flight-cloud:before { width:22px;height:22px;left:9px; }.flight-cloud:after { width:29px;height:29px;right:7px; }
.cloud-left { left:9%;top:25px;animation:cloud-drift 5s ease-in-out infinite alternate; }.cloud-right { right:12%;top:21px;transform:scale(.72);animation:cloud-drift 6s ease-in-out -2s infinite alternate-reverse; }
.flight-copy { position:absolute;right:18px;bottom:13px;text-transform:uppercase;letter-spacing:.16em;color:var(--ocean);font-size:8px;font-weight:800; }
.countdown { display:flex;gap:clamp(15px,3vw,42px);margin:34px 0 32px; }
.time-unit { min-width:67px;position:relative; }
.time-unit:not(:last-child):after { content:"";position:absolute;right:clamp(-22px,-1.5vw,-10px);top:10px;width:4px;height:4px;border-radius:50%;background:var(--coral);box-shadow:0 9px 0 var(--coral); }
.time-unit strong { display:block;font-family:"Playfair Display",serif;font-size:clamp(32px,3.4vw,52px);font-variant-numeric:tabular-nums;line-height:1; }
.time-unit span { display:block;margin-top:8px;text-transform:uppercase;letter-spacing:.16em;font-size:8px;font-weight:800;color:#6d868b; }
.actions { display:flex;flex-wrap:wrap;gap:12px; }
.button { min-height:52px;padding:0 23px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;transition:transform .25s,box-shadow .25s,background .25s; }
.button:hover { transform:translateY(-3px); }
.button.primary { background:var(--ink);color:white;box-shadow:0 14px 34px rgba(8,60,75,.2); }
.button.primary span { color:var(--coral);font-size:18px;margin-left:16px; }
.button.secondary { border:1px solid rgba(8,60,75,.2);background:rgba(255,255,255,.35); }
.brand-poster { width:min(34vw,470px);align-self:center;justify-self:end;position:relative;padding:16px;background:rgba(255,255,255,.92);border:1px solid rgba(9,44,150,.12);border-radius:28px;box-shadow:0 35px 80px rgba(5,10,50,.16);animation:reveal 1.1s cubic-bezier(.2,.8,.2,1) both;transform:rotate(1.2deg); }
.brand-poster:before { content:"";position:absolute;inset:-10px;border:1px solid rgba(7,94,229,.15);border-radius:35px;z-index:-1; }
.brand-poster img { display:block;width:100%;height:auto;border-radius:17px;mix-blend-mode:multiply; }
.poster-kicker { padding:7px 8px 15px;text-align:center;text-transform:uppercase;letter-spacing:.17em;font-size:8px;font-weight:800;color:var(--ocean); }
.service-strip { display:grid;grid-template-columns:repeat(4,1fr);gap:5px;padding:13px 4px 2px; }
.service-strip span { padding:8px 3px;border-radius:999px;background:#edf4ff;text-align:center;font-size:8px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:var(--ocean); }
.card-sun { position:absolute;width:115px;height:115px;border-radius:50%;background:#ffd27a;right:14%;top:16%;box-shadow:0 0 0 18px rgba(255,210,122,.14); }
.card-cloud { position:absolute;width:76px;height:20px;border-radius:30px;background:rgba(255,255,255,.72);animation:cloud 12s linear infinite; }
.card-cloud:before,.card-cloud:after { content:"";position:absolute;border-radius:50%;background:inherit; }
.card-cloud:before { width:30px;height:30px;left:12px;bottom:0; }.card-cloud:after { width:38px;height:38px;right:10px;bottom:0; }
.cloud-a { top:25%;left:9%; }.cloud-b { top:39%;left:55%;transform:scale(.65);animation-delay:-7s; }
.card-plane { position:absolute;top:31%;left:40%;font-size:34px;color:white;transform:rotate(14deg);filter:drop-shadow(0 5px 8px rgba(8,60,75,.15));animation:fly 5s ease-in-out infinite; }
.mountain { position:absolute;bottom:31%;width:0;height:0;border-style:solid; }
.mountain-back { left:-20%;border-width:0 180px 210px 180px;border-color:transparent transparent #3d9b91 transparent; }
.mountain-front { right:-27%;border-width:0 220px 260px 220px;border-color:transparent transparent #176d71 transparent; }
.card-caption { position:absolute;inset:auto 27px 24px;color:white;padding-top:20px;border-top:1px solid rgba(255,255,255,.48); }
.card-caption span { display:block;text-transform:uppercase;letter-spacing:.22em;font-size:8px;margin-bottom:7px;opacity:.75; }
.card-caption strong { font-family:"Playfair Display",serif;font-size:clamp(21px,2.2vw,31px);font-weight:500; }
.route { position:absolute;border:2px dashed rgba(8,127,140,.18);border-radius:50%;z-index:-1; }
.route-one { width:360px;height:160px;right:25%;top:22%;transform:rotate(-18deg); }.route-two { width:260px;height:120px;left:-90px;bottom:6%;transform:rotate(22deg); }
footer { grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;color:#71888c;font-size:10px;letter-spacing:.04em;z-index:3; }
footer nav { display:flex;gap:22px; } footer a:hover { color:var(--coral); }
@keyframes drift { to{transform:translate(28px,18px) scale(1.08)} } @keyframes reveal { from{opacity:0;transform:translateY(30px) scale(.97)} } @keyframes fly { 50%{transform:translate(22px,-18px) rotate(8deg)} } @keyframes cloud { 50%{transform:translateX(22px)} } @keyframes plane-flight { 0%{left:-52px;top:61px;transform:rotate(-7deg)} 45%{top:34px;transform:rotate(-2deg)} 100%{left:calc(100% + 12px);top:19px;transform:rotate(-9deg)} } @keyframes cloud-drift { to{margin-left:18px} }
@media (max-width:900px){.site-shell{grid-template-columns:1fr;}.hero{padding-bottom:38px}.brand-poster{width:min(78vw,470px);justify-self:center;margin-bottom:50px}.site-shell:before{background:radial-gradient(circle at 78% 24%,rgba(7,94,229,.13),transparent 26%),var(--cream)}footer{margin-top:8px}}
@media (max-width:560px){.site-shell{padding:22px 19px 18px}.top-contact{font-size:0}.top-contact span{font-size:20px}.hero{padding-top:58px}h1{font-size:clamp(43px,13vw,62px)}.intro{line-height:1.65}.flight-scene{height:92px}.actions{display:grid}.button{width:100%}.brand-poster{width:100%;border-radius:22px}.service-strip{grid-template-columns:repeat(2,1fr)}footer{align-items:flex-start;gap:18px;flex-direction:column}footer nav{gap:15px}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition:none!important}}
