:root{
  --navy:#10264b;--navy-d:#0a1a35;--gold:#c9a24b;--cream:#f6f1e7;--ink:#1c2535;
  --sky:#2f80c4;--lime:#c4e063;--coral:#e8664d;--sage:#8fc27a;
  --serif:'Fraunces',Georgia,serif;--sans:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;font:400 1.0625rem/1.6 var(--sans);color:var(--ink);background:var(--navy-d);overflow-x:hidden}
body.loading{overflow:hidden}
img{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p{margin:0}
.serif{font-family:var(--serif);font-weight:600;letter-spacing:-.015em}
.wrap{width:min(1200px,100% - 32px);margin-inline:auto}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
button{font:inherit;cursor:pointer}

/* demo banner */
.demo{background:#06112a;color:#cfd8ea;font-size:.82rem;text-align:center;padding:9px 16px;position:relative;z-index:5}
.demo a{color:var(--gold);font-weight:700}

/* preloader (UMS-Wright inspired) */
#pre{position:fixed;inset:0;z-index:100;background:var(--navy);color:#fff;display:grid;place-items:center}
#pre .pin{display:grid;gap:18px;justify-items:center;width:min(260px,70vw)}
#pre svg{width:78px;height:88px}
#pcount{font:600 1.1rem var(--serif);letter-spacing:.12em}
#pre .track{width:100%;height:2px;background:rgba(255,255,255,.2)}
#pfill{display:block;height:100%;background:var(--gold);transform:scaleX(0);transform-origin:left}

/* fixed UI */
.logo{position:fixed;left:16px;top:52px;z-index:90;display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;background:var(--navy);padding:6px 16px 6px 8px;border-radius:999px;font:600 1rem var(--serif);box-shadow:0 4px 20px rgba(0,0,0,.25)}
.logo svg{width:30px;height:34px}
.mbtn{position:fixed;right:16px;top:44px;z-index:95;width:56px;height:56px;border-radius:50%;border:0;background:var(--gold);display:grid;place-content:center;gap:6px;box-shadow:0 4px 20px rgba(0,0,0,.3);transition:transform .3s}
.mbtn:hover{transform:scale(1.08)}
.mbtn span{display:block;width:24px;height:2.5px;background:var(--navy-d);border-radius:2px;transition:transform .4s,opacity .3s}
.mbtn.x span:first-child{transform:translateY(4.2px) rotate(45deg)}
.mbtn.x span:last-child{transform:translateY(-4.2px) rotate(-45deg)}
#bar{position:fixed;left:0;top:0;height:4px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;z-index:96}

/* full-screen menu (circle reveal from the button) */
#menu{position:fixed;inset:0;z-index:80;background:var(--navy);color:#fff;display:flex;align-items:center;visibility:hidden;clip-path:circle(0 at calc(100% - 44px) 72px);transition:clip-path .85s cubic-bezier(.7,0,.2,1),visibility 0s .85s;overflow:hidden}
#menu.open{visibility:visible;clip-path:circle(150% at calc(100% - 44px) 72px);transition:clip-path .85s cubic-bezier(.7,0,.2,1),visibility 0s}
#menu .crest-wm{position:absolute;right:-80px;bottom:-60px;width:min(520px,80vw);opacity:.07;pointer-events:none}
#menu ul{list-style:none;margin:0;padding:0;position:relative}
#menu .m{overflow:hidden}
#menu .m a{display:block;font:600 clamp(2rem,6.5vw,4.4rem)/1.18 var(--serif);text-decoration:none;padding:4px 0;transform:translateY(110%);transition:transform .8s cubic-bezier(.2,.8,.2,1) calc(var(--i)*60ms + 250ms),color .2s}
#menu.open .m a{transform:none}
#menu .m a:hover{color:var(--gold)}
#menu .m a span{font:500 .9rem var(--sans);letter-spacing:.12em;color:var(--gold);margin-right:14px;vertical-align:middle}

/* hero scene (Brentwood inspired: giant title, tiles rise past it) */
.hero{position:relative;height:100svh;min-height:560px;overflow:hidden;background:var(--navy-d);color:#fff}
.hero-bg{position:absolute;inset:0}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,26,53,.55),rgba(10,26,53,.85))}
.hero-title{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:0 16px;pointer-events:none}
.hero-title .small{font:400 clamp(1.3rem,3.4vw,2.4rem) var(--serif);color:#dbe3f2;margin-bottom:.1em}
.hero-title .big{font:600 clamp(3.4rem,17vw,15rem)/.9 var(--serif);color:#b8c6e0;letter-spacing:-.03em}
.line{display:block;overflow:hidden;padding-bottom:.06em}
.line>span{display:block}
.hero-cue{position:absolute;left:50%;bottom:112px;transform:translateX(-50%);font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;color:#cfd8ea;display:grid;gap:8px;justify-items:center}
.hero-cue i{display:block;width:1px;height:44px;background:linear-gradient(var(--gold),transparent);animation:cue 1.8s ease-in-out infinite;transform-origin:top}
@keyframes cue{0%{transform:scaleY(0)}60%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.pillars{position:absolute;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(255,255,255,.3);margin:0 clamp(16px,4vw,56px) 24px;padding-top:14px;text-align:center}
.pillars b{display:block;font:600 .8rem var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.pillars span{font-size:.85rem;color:#d6dcea;display:block;max-width:22ch;margin:4px auto 0}
@media(max-width:640px){.pillars span{display:none}.pillars{margin-bottom:76px}}
.ftile{position:absolute;top:0;width:clamp(150px,19vw,270px);aspect-ratio:3/4;border-radius:14px;overflow:hidden;background:#162c55;box-shadow:0 18px 40px rgba(0,0,0,.4);will-change:transform;color:#fff;text-decoration:none}
.ftile img{width:100%;height:100%;object-fit:cover}
.ftile::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(5,12,28,.92))}
.ftile .cap{position:absolute;z-index:1;left:12px;right:12px;bottom:12px;font:600 clamp(.9rem,1.2vw,1.05rem)/1.25 var(--sans)}
.chip{display:inline-block;background:#b0359b;color:#fff;font:700 .62rem var(--sans);letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:5px;margin-bottom:6px}
.chip.g{background:var(--gold);color:var(--navy-d)}.chip.s{background:var(--sky)}.chip.l{background:var(--lime);color:var(--navy-d)}
.t1{left:5%}.t2{left:26%}.t3{left:50%}.t4{left:72%}.t5{left:14%}.t6{left:62%}
@media(max-width:760px){.ftile{width:44vw}.t1{left:4%}.t2{left:52%}.t3{left:10%}.t4{left:50%}.t5,.t6{display:none}}

/* ticker (stats marquee) */
.ticker{background:var(--gold);color:var(--navy-d);overflow:hidden;padding:18px 0;position:relative}
.ticker-track{display:flex;width:max-content;will-change:transform}
.ticker-set{display:flex;flex:none}
.ticker-set span{font:600 clamp(1.2rem,2.6vw,2rem) var(--serif);white-space:nowrap;padding:0 28px;display:flex;align-items:center;gap:56px}
.ticker-set span::after{content:'✦';font-size:.7em}

/* about: word reveal + drawn arrow */
.about{background:var(--cream);padding:clamp(72px,12vw,150px) 0;text-align:center}
.eyebrow{font:700 .78rem var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#7a5c12}
.arrow{width:1px;height:90px;background:var(--navy);margin:20px auto;position:relative;transform-origin:top}
.arrow::after{content:'';position:absolute;bottom:-1px;left:-5px;width:10px;height:10px;border-right:1px solid var(--navy);border-bottom:1px solid var(--navy);transform:rotate(45deg)}
.about p.big{font:600 clamp(1.7rem,4.4vw,3.2rem)/1.25 var(--serif);color:var(--navy);max-width:24em;margin:0 auto}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 30px;border-radius:999px;font:700 1rem var(--sans);text-decoration:none;border:2px solid transparent;background:var(--gold);color:var(--navy-d)}
.btn.o{background:transparent;border-color:currentColor;color:inherit}
.about .btn{margin-top:36px;background:var(--navy);color:#fff}

/* values statement with drawn underlines */
.values{background:var(--navy);color:#fff;text-align:center;padding:clamp(80px,14vw,170px) 0;position:relative;overflow:hidden}
.values .crest-wm{position:absolute;right:-6%;top:50%;transform:translateY(-50%);width:min(520px,70vw);opacity:.06}
.values .q{font:600 clamp(2rem,5.6vw,4.2rem)/1.3 var(--serif);max-width:20em;margin:0 auto;position:relative}
.values .mark{display:block;font:600 5rem/1 var(--serif);color:var(--sky);margin-bottom:6px}
.u{background:linear-gradient(currentColor,currentColor) 0 100%/0 .09em no-repeat;padding-bottom:.08em}
.u1{color:var(--sky)}.u2{color:var(--lime)}.u3{color:#e46fd0}
.u b{color:#fff;font-weight:inherit}

/* tile wall (Brentwood inspired) */
.wall{background:var(--navy-d);padding:clamp(72px,10vw,130px) 0}
.wall h2{color:#fff;font:600 clamp(2rem,5vw,3.6rem)/1.1 var(--serif);text-align:center;margin-bottom:48px}
.grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(190px,auto);gap:16px}
.t{border-radius:16px;overflow:hidden;position:relative;color:#fff;min-height:190px;padding:0;border:0;text-align:left;display:flex;flex-direction:column;justify-content:flex-end;background:var(--navy);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.t:hover{transform:translateY(-6px) rotate(-.4deg)}
.t img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.t:hover img{transform:scale(1.07)}
.t.ph::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(5,12,28,.9))}
.t .in{position:relative;z-index:1;padding:20px}
.t.q{padding:0;color:var(--navy-d)}
.t.q .in{padding:26px;display:flex;flex-direction:column;justify-content:space-between;height:100%}
.t.q blockquote{margin:0;font:600 clamp(1.1rem,1.8vw,1.5rem)/1.3 var(--serif)}
.t.q cite{font:500 .85rem var(--sans);font-style:normal;margin-top:16px;display:block}
.t.q .qm{font:600 3rem/.7 var(--serif)}
.t.n{justify-content:center;text-align:center;padding:24px}
.t.n b{font:600 clamp(3rem,6vw,5rem)/1 var(--serif)}
.t.n span{display:block;margin-top:8px;font-size:.95rem}
.w2{grid-column:span 2}.r2{grid-row:span 2}
.bg-lime{background:var(--lime)}.bg-sky{background:var(--sky)}.bg-coral{background:var(--coral)}.bg-cream{background:var(--cream)}.bg-mag{background:#b0359b;color:#fff!important}
.play{position:absolute;z-index:2;right:14px;top:14px;width:46px;height:46px;border-radius:50%;background:var(--lime);display:grid;place-items:center}
.play::after{content:'';border-left:14px solid var(--navy-d);border-top:9px solid transparent;border-bottom:9px solid transparent;margin-left:4px}
.ph-t{font:600 1.15rem/1.25 var(--sans)}
@media(max-width:980px){.grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.grid{grid-template-columns:1fr}.w2{grid-column:auto}.r2{grid-row:auto}.t{min-height:260px}}

/* carousel (UMS-Wright inspired photo strip) */
.rail-sec{background:var(--cream);padding:clamp(64px,9vw,120px) 0}
.rail-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px;flex-wrap:wrap}
.rail-head h2{font:600 clamp(2rem,5vw,3.4rem)/1.1 var(--serif);color:var(--navy);max-width:14em}
.ctrl{display:flex;gap:10px}
.ctrl button{width:56px;height:56px;border-radius:50%;border:2px solid var(--navy);background:transparent;color:var(--navy);font-size:1.4rem;display:grid;place-items:center;transition:background .2s,color .2s}
.ctrl button:hover{background:var(--navy);color:#fff}
.rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 max(16px,calc((100vw - 1200px)/2));scroll-padding:0 max(16px,calc((100vw - 1200px)/2));scrollbar-width:none;cursor:grab}
.rail::-webkit-scrollbar{display:none}
.rail.drag{scroll-snap-type:none;cursor:grabbing;user-select:none}
.rail figure{margin:0;flex:none;width:clamp(260px,34vw,440px);scroll-snap-align:start}
.rail img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:14px;pointer-events:none}
.rail figure:nth-child(even) img{aspect-ratio:1/1;margin-top:60px}
.rail figcaption{margin-top:10px;font:600 1rem var(--sans);color:var(--navy)}
.prog{height:3px;background:rgba(16,38,75,.15);margin:32px max(16px,calc((100vw - 1200px)/2)) 0}
.prog i{display:block;height:100%;background:var(--navy);transform:scaleX(.2);transform-origin:left}

/* stages accordion */
.stages{background:var(--navy);color:#fff;padding:clamp(72px,10vw,130px) 0}
.stages h2{font:600 clamp(2rem,5vw,3.6rem)/1.1 var(--serif);margin-bottom:12px}
.stages .sub{color:#cfd8ea;margin-bottom:36px}
.acc{display:flex;gap:12px;height:min(70vh,560px)}
.panel{position:relative;flex:1;border:0;border-radius:16px;overflow:hidden;color:#fff;text-align:left;background:#162c55;transition:flex .7s cubic-bezier(.2,.8,.2,1);min-width:0}
.panel.on{flex:3.4}
.panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.7) brightness(.7);transition:filter .6s,transform 1s}
.panel.on img{filter:none;transform:scale(1.04)}
.panel::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(5,12,28,.92))}
.panel .in{position:absolute;z-index:1;left:20px;right:20px;bottom:20px}
.panel .age{font:700 .75rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.panel h3{font:600 clamp(1.3rem,2.2vw,2rem)/1.1 var(--serif);margin:4px 0}
.panel p,.panel .go{max-height:0;opacity:0;overflow:hidden;transition:max-height .6s,opacity .5s .15s;font-size:.98rem}
.panel.on p,.panel.on .go{max-height:140px;opacity:1}
.panel .go{display:inline-block;margin-top:10px;font-weight:700;color:var(--gold)}
@media(max-width:760px){.acc{flex-direction:column;height:auto}.panel{flex:none;height:96px;transition:height .6s cubic-bezier(.2,.8,.2,1)}.panel.on{height:380px}}

/* closing CTA */
.cta{background:var(--cream);text-align:center;padding:clamp(80px,12vw,160px) 0;overflow:hidden}
.cta h2{font:600 clamp(2.6rem,9vw,7.5rem)/.98 var(--serif);color:var(--navy);letter-spacing:-.03em}
.cta .actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:44px}
.cta .btn.o{color:var(--navy)}
.mag{will-change:transform}
footer{background:var(--navy-d);color:#aeb9d0;padding:36px 0 28px;font-size:.88rem;text-align:center}
footer a{color:#e8ecf4}
@media(max-width:760px){body{padding-bottom:0}}

/* lightbox */
dialog.lb{border:0;padding:0;background:transparent;max-width:min(960px,94vw);width:100%;overflow:visible}
dialog.lb::backdrop{background:rgba(5,12,28,.88)}
dialog.lb img{width:100%;max-height:78vh;object-fit:cover;border-radius:14px}
dialog.lb p{color:#fff;margin-top:12px;font:600 1.1rem var(--sans)}
dialog.lb button{position:absolute;right:0;top:-54px;background:var(--gold);border:0;border-radius:999px;padding:10px 20px;font-weight:700}

/* reduced motion / no JS fallback */
.reduce .ftile{display:none}
.reduce .hero{height:auto;min-height:100svh;display:grid}
.reduce #menu,.reduce #menu .m a{transition:none}
.reduce .hero-cue i{animation:none}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
