:root{font-family:Arial,Helvetica,sans-serif;color:#0b2349;background:#f8fafc;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100svh;overflow-x:hidden}button{font:inherit}.page{min-height:100svh;display:flex;flex-direction:column;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(circle at 72% 45%,#ffffff 0,#f4f7fb 45%,#edf2f8 100%)}.page:before{content:"";position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(12,43,86,.035) 1px,transparent 1px),linear-gradient(rgba(12,43,86,.035) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,transparent 20%,#000 100%);z-index:-1}.shell{width:min(1440px,100%);padding-inline:clamp(24px,5.2vw,90px);margin-inline:auto}.top{height:136px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{width:clamp(230px,27vw,390px);height:auto;display:block;filter:drop-shadow(0 3px 8px rgba(13,34,72,.04))}.top-right{display:flex;align-items:center;gap:14px;text-transform:uppercase;font-size:11px;font-weight:700;letter-spacing:.22em;color:#476080;white-space:nowrap}.top-right:before{content:"";width:28px;height:1px;background:#ba8325}.main{flex:1;display:grid;grid-template-columns:1.06fr .94fr;align-items:center;gap:20px;padding-block:10px 48px}.copy{position:relative;z-index:2;padding-bottom:18px}.eyebrow{display:flex;align-items:center;gap:14px;color:#a97922;text-transform:uppercase;letter-spacing:.3em;font-weight:800;font-size:12px;margin-bottom:28px;animation:rise .8s .1s both}.eyebrow:before{content:"";width:36px;height:2px;background:linear-gradient(90deg,#a56a0f,#edc66a)}h1{font-weight:800;font-size:clamp(68px,8.2vw,132px);line-height:.9;letter-spacing:-.085em;margin:0;color:#071c40;animation:rise 1s .2s both}h1 span{display:block;color:transparent;background:linear-gradient(115deg,#956212 5%,#d9a83b 42%,#fff0aa 57%,#a87316 87%);background-clip:text;background-size:220% 100%;animation:rise 1s .3s both,shine 8s 2s infinite}.divider{width:90px;height:3px;margin:40px 0 27px;background:linear-gradient(90deg,#b47c22,#f8d779);animation:grow 1s .65s both}.intro{font-size:clamp(18px,1.8vw,23px);line-height:1.5;max-width:540px;margin:0 0 15px;color:#17355f;font-weight:600;animation:rise 1s .5s both}.sub{font-size:clamp(15px,1.15vw,17px);line-height:1.75;max-width:550px;color:#60718a;margin:0;animation:rise 1s .65s both}.visual{height:min(660px,60vw);min-height:430px;position:relative;display:grid;place-items:center;animation:appear 1.3s .25s both}.halo{position:absolute;width:min(590px,100%);aspect-ratio:1;border-radius:50%;border:1px solid rgba(157,113,34,.15);background:radial-gradient(circle,#fff 4%,rgba(233,239,248,.8) 58%,transparent 71%);box-shadow:0 0 0 38px rgba(187,139,48,.035),0 0 0 96px rgba(13,52,108,.025);animation:breathe 7s ease-in-out infinite}.halo:after{content:"";position:absolute;inset:-23px;border-radius:50%;border:1px dashed rgba(159,120,55,.18);animation:rotate 55s linear infinite}.mark{width:min(94%,570px);position:relative;z-index:1;object-fit:contain;filter:drop-shadow(0 32px 29px rgba(19,44,84,.16));animation:float 6s ease-in-out infinite}.orbit{position:absolute;border-radius:50%;background:#d7a13e;box-shadow:0 0 16px 5px rgba(218,166,69,.25);width:7px;height:7px;z-index:2}.orbit.one{top:18%;left:13%;animation:twinkle 3s infinite}.orbit.two{bottom:17%;right:10%;width:5px;height:5px;animation:twinkle 3s 1.3s infinite}.footer{position:relative;background:#071a3a;color:#dae3f1}.footer:before{content:"";height:3px;position:absolute;inset:0 0 auto;background:linear-gradient(90deg,transparent,#bf8b2d 25%,#f4d27a 52%,#a46a18 77%,transparent);background-size:200% 100%;animation:shine 9s linear infinite}.foot-inner{min-height:99px;display:flex;justify-content:space-between;align-items:center;gap:22px}.services{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;text-transform:uppercase;letter-spacing:.19em;font-weight:700;font-size:12px}.services b{font-size:12px;color:#d6a244;font-weight:400}.copyright{color:#a6b5ca;font-size:12px;white-space:nowrap}@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}@keyframes appear{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@keyframes float{50%{transform:translateY(-13px)}}@keyframes breathe{50%{transform:scale(1.04);opacity:.76}}@keyframes twinkle{50%{opacity:.25;transform:scale(.5)}}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes grow{from{transform:scaleX(0);transform-origin:left;opacity:0}to{transform:scaleX(1);opacity:1}}@keyframes shine{to{background-position:-200% 0}}@media(max-width:900px){.main{grid-template-columns:1fr;text-align:center;gap:0;padding-block:44px 55px}.copy{order:2}.visual{order:1;height:340px;min-height:0}.mark{width:min(75%,330px)}.halo{width:330px}.eyebrow{justify-content:center}.divider{margin:30px auto 22px}.intro,.sub{margin-inline:auto}h1{font-size:clamp(65px,11vw,100px)}.top{height:110px}.foot-inner{justify-content:center;text-align:center;flex-direction:column;padding-block:25px}.services{justify-content:center}}@media(max-width:520px){.top{height:88px}.brand{width:220px}.top-right{display:none}.main{padding-block:15px 45px}.visual{height:280px}.halo{width:270px}.mark{width:260px}.eyebrow{font-size:10px;letter-spacing:.22em;margin-bottom:20px}h1{font-size:clamp(58px,14.4vw,78px)}.intro{font-size:18px}.sub{font-size:15px}.services{font-size:10px;gap:8px 10px;letter-spacing:.12em}.copyright{white-space:normal}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}

/* Quiet skyline depth and centered brand mark */
.page:after{content:"";position:absolute;inset:0 0 99px;z-index:-1;pointer-events:none;background:url("assets/skyline.webp") center 48% / cover no-repeat;opacity:.68;animation:skylineDrift 24s ease-in-out infinite alternate;mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.38) 33%,#000 100%)}
.visual{transform:translateX(5%)}
.mark{width:min(94%,570px);margin-top:-300px}
.halo{margin-top:-300px}
@keyframes skylineDrift{from{background-position:49% 48%;transform:scale(1)}to{background-position:53% 49%;transform:scale(1.035)}}
@media(max-width:900px){.visual{transform:none}.mark{margin-top:-35px}.halo{margin-top:-35px}.page:after{inset:0 0 110px;opacity:.38;background-position:65% center;mask-image:linear-gradient(180deg,rgba(0,0,0,.75),transparent 82%)}}
@media(max-width:520px){.mark{width:260px;margin-top:-20px}.halo{margin-top:-20px}.page:after{opacity:.28}}
@media(prefers-reduced-motion:reduce){.page:after{animation:none}}

/* Keep the mark in a dedicated row on tablets and phones. */
@media(max-width:1180px){.main{grid-template-columns:1fr;gap:10px;text-align:center;padding-block:22px 54px}.visual{order:1;height:380px;min-height:0;transform:none}.copy{order:2;padding-bottom:0}.mark{width:min(76%,350px);margin-top:0}.halo{width:360px;margin-top:0}.eyebrow{justify-content:center}.divider{margin:30px auto 22px}.intro,.sub{margin-inline:auto}}
@media(max-width:900px){.visual{height:340px}.mark{width:min(75%,320px);margin-top:0}.halo{width:330px;margin-top:0}}
@media(max-width:520px){.main{gap:8px;padding-block:10px 42px}.visual{height:270px}.mark{width:min(82%,245px);margin-top:0}.halo{width:250px;margin-top:0}.copy{padding-top:12px}}
.spark{position:absolute;z-index:2;width:5px;height:5px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff5bb,#edbe58 45%,#b8791c 85%);box-shadow:0 0 10px rgba(217,159,55,.75);opacity:0;pointer-events:none;animation:sparkPop 4.8s ease-in-out infinite}.s1{left:10%;top:26%;animation-delay:.2s}.s2{left:27%;top:7%;width:4px;height:4px;animation-delay:1.5s}.s3{right:13%;top:15%;width:7px;height:7px;animation-delay:2.2s}.s4{right:3%;top:44%;animation-delay:.9s}.s5{right:20%;bottom:17%;width:4px;height:4px;animation-delay:3.1s}.s6{left:15%;bottom:22%;width:6px;height:6px;animation-delay:2.8s}.s7{left:40%;bottom:7%;width:4px;height:4px;animation-delay:4s}.s8{right:39%;top:4%;width:3px;height:3px;animation-delay:3.6s}
@keyframes sparkPop{0%,12%,70%,100%{opacity:0;transform:scale(.2)}20%{opacity:.95;transform:scale(1.35)}30%,55%{opacity:.65;transform:scale(.85)}}
@media(prefers-reduced-motion:reduce){.spark{opacity:.45;animation:none}}

/* Precise mobile/tablet composition: mark and halo share one fixed visual box. */
@media(max-width:1180px){.main{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:380px auto;align-items:stretch;gap:16px}.visual{grid-column:1;grid-row:1;order:unset;position:relative;width:100%;height:380px;min-height:0;transform:none;overflow:visible}.copy{grid-column:1;grid-row:2;order:unset;position:relative;z-index:2}.visual .mark{position:absolute;left:50%;top:50%;width:min(76%,340px);height:auto;margin:0;animation:markFloatCentered 6s ease-in-out infinite}.visual .halo{position:absolute;left:50%;top:50%;width:350px;max-width:95vw;margin:0;animation:haloCentered 7s ease-in-out infinite}.visual .orbit,.visual .spark{z-index:3}}
@media(max-width:900px){.main{grid-template-rows:330px auto}.visual{height:330px}.visual .mark{width:min(72%,305px)}.visual .halo{width:315px}}
@media(max-width:520px){.main{grid-template-rows:265px auto;gap:16px}.visual{height:265px}.visual .mark{width:min(68%,225px)}.visual .halo{width:240px}.copy{padding-top:0}}
@keyframes markFloatCentered{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 12px))}}
@keyframes haloCentered{0%,100%{transform:translate(-50%,-50%) scale(1)}50%{transform:translate(-50%,-50%) scale(1.04);opacity:.76}}
.ambient-dots{position:absolute;inset:0 0 99px;z-index:1;pointer-events:none;overflow:hidden}.ambient-dots i{position:absolute;left:var(--x);top:var(--y);width:4px;height:4px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff4b3,#e8b64e 52%,#b6781e);box-shadow:0 0 9px 2px rgba(204,145,38,.28);opacity:0;animation:ambientPop 5.6s var(--delay) ease-in-out infinite}.ambient-dots i:nth-child(4n){width:6px;height:6px}.ambient-dots i:nth-child(5n){width:3px;height:3px}
@keyframes ambientPop{0%,14%,66%,100%{opacity:0;transform:scale(.25)}24%{opacity:.78;transform:scale(1.35)}40%,52%{opacity:.5;transform:scale(.9)}}
@media(prefers-reduced-motion:reduce){.visual .mark,.visual .halo{animation:none;transform:translate(-50%,-50%)}.ambient-dots i{animation:none;opacity:.36}}
