/* ===== Advanced effects layer (fx.js). Everything degrades gracefully when html.fx is absent. ===== */
#gl{position:absolute;inset:0;width:100%;height:100%;display:none}
html.gl-on #gl{display:block}html.gl-on #net{display:none}html.gl-on .hero .orb,html.gl-on .hero .grid-bg{opacity:.25}
/* marquee */
.marquee{background:#0b1220;color:#e2e8f0;overflow:hidden;border-block:1px solid #ffffff14;padding:18px 0;position:relative;z-index:2}
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;width:120px;z-index:1;pointer-events:none}
.marquee::before{left:0;background:linear-gradient(90deg,#0b1220,transparent)}.marquee::after{right:0;background:linear-gradient(-90deg,#0b1220,transparent)}
.mq-track{display:flex;width:max-content;animation:mq 42s linear infinite}.marquee:hover .mq-track{animation-play-state:paused}
.mq-set{display:flex;align-items:center;gap:28px;padding-right:28px;font:600 clamp(1rem,1.6vw,1.35rem) Fraunces,serif;white-space:nowrap}
.mq-dot{width:10px;height:10px;fill:var(--gold)}@keyframes mq{to{transform:translateX(-50%)}}
/* gradient mesh */
.mesh{isolation:isolate}
.mesh::before{content:"";position:absolute;inset:-20%;z-index:-1;opacity:.55;filter:blur(70px);pointer-events:none;
 background:radial-gradient(30% 35% at 20% 30%,#c7d2fe,transparent 70%),radial-gradient(25% 30% at 80% 20%,#a5f3fc,transparent 70%),radial-gradient(30% 30% at 65% 80%,#fde68a,transparent 70%),radial-gradient(25% 25% at 25% 85%,#ddd6fe,transparent 70%);
 animation:meshmove 22s ease-in-out infinite alternate}
@keyframes meshmove{33%{transform:translate(4%,-3%) rotate(6deg) scale(1.05)}66%{transform:translate(-5%,4%) rotate(-5deg) scale(.97)}100%{transform:translate(3%,5%) rotate(3deg) scale(1.04)}}
/* horizontal gallery */
.hgal{background:#070c16;color:#fff;position:relative;overflow:hidden}
.hgal-inner{padding:100px 0 90px}
.hgal-head{max-width:1180px;margin:0 auto 34px;padding:0 22px;width:100%}.hgal-head .eyebrow{color:var(--gold)}
.hgal-track{display:flex;gap:28px;padding:0 max(22px,calc((100vw - 1180px)/2));}
.hpanel{position:relative;flex:none;width:min(560px,78vw);aspect-ratio:4/3;border-radius:26px;overflow:hidden;background:#111827;box-shadow:0 40px 80px -40px #000}
.hpanel img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 1.2s var(--ease)}.hpanel:hover img{transform:scale(1.04)}
.hpanel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,#070c16ee)}
.hcap{position:absolute;left:28px;right:28px;bottom:24px;z-index:2}.hcap b{font:700 .85rem Inter;color:var(--gold);letter-spacing:.2em}.hcap h3{font:700 1.7rem Fraunces,serif;margin:6px 0}.hcap p{color:#cbd5e1;margin:0 0 4px}
.hpanel-cta{display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,#312e81,#0b1220 70%)}.hpanel-cta::after{display:none}.hpanel-cta .hcap{position:static;padding:40px}.hpanel-cta .btn{margin-top:16px}
.hgal-track{overflow-x:auto;padding-bottom:16px;scrollbar-width:thin;overscroll-behavior-x:contain}
@media(min-width:1100px){.hgal-track{display:grid;grid-template-columns:repeat(3,1fr);overflow:visible;padding:0 22px;max-width:1180px;margin:0 auto}.hpanel{width:auto}.hpanel:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}.hpanel-cta{grid-column:span 2;aspect-ratio:auto}}
/* stamp */
.stamp-seal{position:absolute;right:2%;top:-30px;width:clamp(90px,11vw,150px);transform:rotate(-12deg);filter:drop-shadow(0 18px 30px #000a);z-index:2}
html.fx .stamp-seal{opacity:0}
@media(max-width:760px){.stamp-seal{top:-60px;right:0}}
/* timeline */
.tl-wrap{position:relative}.tl-line{position:absolute;left:12%;right:12%;top:41px;width:76%;height:20px;overflow:visible;display:none}
.tl-line path{fill:none;stroke:url(#none);stroke:var(--ac);stroke-width:3;stroke-linecap:round;vector-effect:non-scaling-stroke}
html.fx .tl-line{display:block}html.fx .steps::before{display:none}
html.fx .steps li{opacity:.35;transform:translateY(20px) scale(.97);transition:opacity .5s,transform .6s var(--ease),box-shadow .5s,border-color .5s}
html.fx .steps li.on{opacity:1;transform:none;border-color:#c7d2fe;box-shadow:0 30px 60px -30px #4f46e566}
html.fx .steps li.on span{background:linear-gradient(135deg,var(--ac),var(--ac2));box-shadow:0 0 0 6px #fff,0 0 24px #6366f1aa}
@media(max-width:980px){.tl-line{display:none!important}}
/* map draw */
.map .route{fill:none;stroke:var(--gold);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.85;filter:drop-shadow(0 0 4px #f5b942)}
html.fx .map .pt:not(.hq) circle{fill:#334155;transition:fill .4s,r .4s}html.fx .map .pt:not(.hq) text{fill:#64748b;transition:fill .4s}
html.fx .map .pt.lit circle{fill:#fde68a;r:5;filter:drop-shadow(0 0 6px #f5b942)}html.fx .map .pt.lit text{fill:#fff}
/* ink-bleed image reveal */
html.fx .ink-reveal{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 200%22%3E%3Cdefs%3E%3Cfilter id=%22f%22 x=%22-30%25%22 y=%22-30%25%22 width=%22160%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%22.035%22 numOctaves=%224%22 seed=%2211%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 scale=%2238%22/%3E%3CfeGaussianBlur stdDeviation=%221.2%22/%3E%3C/filter%3E%3CradialGradient id=%22g%22%3E%3Cstop offset=%22.55%22 stop-color=%22%23000%22/%3E%3Cstop offset=%221%22 stop-color=%22%23000%22 stop-opacity=%220%22/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg filter=%22url%28%23f%29%22%3E%3Ccircle cx=%22100%22 cy=%22100%22 r=%2262%22 fill=%22url%28%23g%29%22/%3E%3Ccircle cx=%2262%22 cy=%2278%22 r=%2226%22/%3E%3Ccircle cx=%22138%22 cy=%22122%22 r=%2230%22/%3E%3Ccircle cx=%22120%22 cy=%2264%22 r=%2218%22/%3E%3Ccircle cx=%2274%22 cy=%22134%22 r=%2220%22/%3E%3C/g%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 200%22%3E%3Cdefs%3E%3Cfilter id=%22f%22 x=%22-30%25%22 y=%22-30%25%22 width=%22160%25%22 height=%22160%25%22%3E%3CfeTurbulence type=%22fractalNoise%22 baseFrequency=%22.035%22 numOctaves=%224%22 seed=%2211%22/%3E%3CfeDisplacementMap in=%22SourceGraphic%22 scale=%2238%22/%3E%3CfeGaussianBlur stdDeviation=%221.2%22/%3E%3C/filter%3E%3CradialGradient id=%22g%22%3E%3Cstop offset=%22.55%22 stop-color=%22%23000%22/%3E%3Cstop offset=%221%22 stop-color=%22%23000%22 stop-opacity=%220%22/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg filter=%22url%28%23f%29%22%3E%3Ccircle cx=%22100%22 cy=%22100%22 r=%2262%22 fill=%22url%28%23g%29%22/%3E%3Ccircle cx=%2262%22 cy=%2278%22 r=%2226%22/%3E%3Ccircle cx=%22138%22 cy=%22122%22 r=%2230%22/%3E%3Ccircle cx=%22120%22 cy=%2264%22 r=%2218%22/%3E%3Ccircle cx=%2274%22 cy=%22134%22 r=%2220%22/%3E%3C/g%3E%3C/svg%3E");-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:var(--ink,0%) var(--ink,0%);mask-size:var(--ink,0%) var(--ink,0%)}
html.fx .ink-reveal.inked{-webkit-mask-image:none;mask-image:none}
/* masked word reveal for headings */
.lm{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}.lm>span{display:inline-block;transform-origin:0 100%}
@media(prefers-reduced-motion:reduce){.mq-track{animation:none}.mesh::before{animation:none}html .ink-reveal{-webkit-mask-image:none!important;mask-image:none!important}}
/* With WebGL on, the 3D seal becomes the hero visual (photo stays for no-WebGL fallback) */
html.gl-on .hero .photo-frame{opacity:0;pointer-events:none}
html.gl-on .hero .card-glass{left:auto;right:0;bottom:-10px}