:root{
  --night:#1C080A;
  --night-2:#240B0E;
  --abyss:#0C0304;
  --garnet:#34111A;
  --maroon:#951B1E;
  --gold:#D6A13A;
  --gold-soft:#E9C77A;
  --gold-hi:#F6DE9A;
  --ivory:#F3EADB;
  --ivory-dim:rgba(243,234,219,.68);
  --ivory-faint:rgba(243,234,219,.42);
  --line:rgba(214,161,58,.26);
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Instrument Sans",system-ui,-apple-system,sans-serif;
  --wrap:1240px;
  --gutter:clamp(16px,4vw,48px);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--night);color:var(--ivory);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.locked{overflow:hidden;height:100vh}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- atmosphere: film grain and the visitor's own light ---------- */
.grain{position:fixed;inset:-100%;z-index:90;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 .9  0 0 0 0 .7  0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-6%,-2%)}80%{transform:translate(5%,4%)}100%{transform:translate(0,0)}}
.torch{position:fixed;inset:0;z-index:4;pointer-events:none;background:radial-gradient(circle 460px at var(--mx,50%) var(--my,40%),rgba(233,199,122,.075),transparent 70%);mix-blend-mode:screen;transition:opacity 1s}

/* ---------- the gate ---------- */
.gate{position:fixed;inset:0;z-index:100;perspective:2200px;background:#070102;overflow:hidden}
.gate .glow{position:absolute;left:50%;top:0;bottom:0;width:2px;transform:translateX(-50%);background:radial-gradient(50% 60% at 50% 50%,rgba(255,236,190,.95),rgba(233,181,90,.55) 45%,rgba(149,27,30,0) 100%);box-shadow:0 0 30px 6px rgba(246,222,154,.55),0 0 120px 30px rgba(214,161,58,.25);opacity:.0;transition:opacity 1.2s,width 3.2s cubic-bezier(.6,.02,.2,1)}
.gate.ready .glow{opacity:.85}
.gate.open .glow{width:110vw;opacity:0;transition:opacity 1.8s .6s,width 3s cubic-bezier(.6,.02,.2,1)}
.gate.open{background:transparent;transition:background 2.4s;pointer-events:none}
.gate.open *{pointer-events:none}
.door{position:absolute;top:0;bottom:0;width:50.05%;transform-style:preserve-3d;transition:transform 3.6s cubic-bezier(.62,.02,.18,1),filter 3.6s;
  background:linear-gradient(180deg,#2C070C,#3A0A10 50%,#27060A)}
.door.l{left:0;transform-origin:left center;background-image:linear-gradient(90deg,rgba(0,0,0,.45),transparent 30%,rgba(255,220,160,.035) 85%,rgba(0,0,0,.25)),linear-gradient(180deg,#2C070C,#3A0A10 50%,#27060A)}
.door.r{right:0;transform-origin:right center;background-image:linear-gradient(270deg,rgba(0,0,0,.45),transparent 30%,rgba(255,220,160,.035) 85%,rgba(0,0,0,.25)),linear-gradient(180deg,#2C070C,#3A0A10 50%,#27060A)}
.gate.open .door.l{transform:rotateY(-102deg);filter:brightness(.4)}
.gate.open .door.r{transform:rotateY(102deg);filter:brightness(.4)}
/* one fine gold frame per leaf, nothing else: the doors should read as lacquer, not as pattern */
.door .panel{position:absolute;inset:6vh 5vw;border:1px solid rgba(214,161,58,.34)}
.door .panel::before{content:"";position:absolute;inset:10px;border:1px solid rgba(214,161,58,.14)}
.door.l .panel{right:3vw}.door.r .panel{left:3vw}
/* the seam: a hairline of light that fades out behind the words */
.gate .seam{position:absolute;left:50%;top:0;bottom:0;width:1px;transform:translateX(-50%);z-index:2;background:linear-gradient(transparent,rgba(246,222,154,.7) 12%,rgba(246,222,154,0) 30%,rgba(246,222,154,0) 70%,rgba(246,222,154,.7) 88%,transparent);box-shadow:0 0 12px rgba(246,222,154,.35);transition:opacity 1s}
.gate.entering .seam{opacity:0}
.gate .hush{position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(38% 46% at 50% 50%,rgba(10,2,3,.78),rgba(10,2,3,.35) 60%,transparent 80%);transition:opacity 1s}
.gate.entering .hush{opacity:0}
.gate-ui{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;transition:opacity .9s,transform 1.2s var(--ease)}
.gate.entering .gate-ui{opacity:0;transform:scale(.96);pointer-events:none}
.gate-ui .seal{width:clamp(130px,14vw,190px);filter:drop-shadow(0 18px 40px rgba(0,0,0,.8));opacity:0;transform:translateY(10px);transition:all 1.4s var(--ease) .2s}
.gate-ui .name{font-family:var(--serif);font-weight:400;font-size:clamp(28px,3.4vw,46px);line-height:1.1;margin-top:26px;opacity:0;transition:opacity 1.4s .6s;text-shadow:0 2px 20px rgba(0,0,0,.8)}
.gate-ui .words{font-family:var(--serif);font-style:italic;font-size:clamp(18px,1.6vw,22px);color:var(--gold-soft);margin-top:10px;opacity:0;transition:opacity 1.4s .9s;text-shadow:0 2px 16px rgba(0,0,0,.8)}
.gate-ui .enter{display:flex;justify-content:center;margin-top:48px;opacity:0;transition:opacity 1.2s 1.3s}
.gate-ui .note{font-size:13px;color:var(--ivory-faint);margin-top:18px;opacity:0;transition:opacity 1.2s 1.6s}
.gate.ready .seal{opacity:1;transform:none}
.gate.ready .name,.gate.ready .words,.gate.ready .enter,.gate.ready .note{opacity:1}
.gate-ui .btn-gold{padding:17px 58px;font-size:16px;letter-spacing:.04em;box-shadow:0 0 0 6px rgba(214,161,58,.1),0 12px 40px rgba(0,0,0,.6)}
.gate-ui .btn-ghost{background:rgba(12,3,4,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.gate.gone{display:none}

/* ---------- buttons, nav ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:500 15px/1 var(--sans);text-decoration:none;border-radius:999px;padding:16px 28px;cursor:pointer;border:1px solid var(--gold);transition:background .35s,color .35s,border-color .35s,box-shadow .35s}
.btn-gold{background:var(--gold);color:var(--abyss)}
.btn-gold:hover{background:var(--gold-soft);border-color:var(--gold-soft)}
.btn-ghost{background:transparent;color:var(--ivory);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--gold)}
.nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .5s,border-color .5s,opacity 1.2s,transform 1.2s var(--ease);border-bottom:1px solid transparent}
.nav.hide{opacity:0;transform:translateY(-100%);pointer-events:none}
.nav.scrolled{background:rgba(20,6,8,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:24px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:44px;height:44px;object-fit:contain}
.brand span{font-family:var(--serif);font-size:21px;font-weight:600;letter-spacing:.02em}
.nav ul{display:flex;gap:32px;list-style:none;font-size:15px}
.nav ul a{text-decoration:none;color:var(--ivory-dim);transition:color .3s}
.nav ul a:hover{color:var(--ivory)}
.nav .btn{padding:12px 20px;font-size:14px}

/* ---------- sound control ---------- */
.sound{position:fixed;left:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:60;display:flex;align-items:center;gap:10px;font:500 13px/1 var(--sans);color:var(--ivory-dim);background:rgba(12,3,4,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:999px;padding:10px 16px 10px 14px;cursor:pointer;transition:opacity 1s,border-color .3s,color .3s}
.sound:hover{border-color:var(--gold);color:var(--ivory)}
.sound.hide{opacity:0;pointer-events:none}
.sound .bars{display:flex;align-items:flex-end;gap:2px;height:14px}
.sound .bars i{display:block;width:2px;height:3px;background:var(--gold);border-radius:1px;transition:height .3s}
.sound[aria-pressed=true] .bars i{animation:bar 1.1s ease-in-out infinite}
.sound[aria-pressed=true] .bars i:nth-child(2){animation-delay:-.4s}.sound[aria-pressed=true] .bars i:nth-child(3){animation-delay:-.8s}.sound[aria-pressed=true] .bars i:nth-child(4){animation-delay:-.2s}
@keyframes bar{0%,100%{height:3px}50%{height:14px}}

/* ---------- hero: the forming ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:560px;overflow:hidden;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(38% 30% at 50% 44%,rgba(233,181,90,.10),transparent 70%),
  radial-gradient(70% 55% at 50% 42%,rgba(120,26,30,.42),transparent 72%),
  radial-gradient(120% 80% at 50% 115%,var(--abyss),transparent 60%),var(--night)}
/* the light over the bar: a narrow cone from the top edge, like a display case lamp */
.hero::after{content:"";position:absolute;left:50%;top:0;width:min(1100px,110vw);height:78%;transform:translateX(-50%);z-index:-1;pointer-events:none;
  background:conic-gradient(from 180deg at 50% 0%,transparent 0deg,transparent 157deg,rgba(246,222,154,.07) 170deg,rgba(246,222,154,.11) 180deg,rgba(246,222,154,.07) 190deg,transparent 203deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 20%,transparent 100%);mask:linear-gradient(#000 20%,transparent 100%);opacity:0;transition:opacity 3s ease .4s}
.hero.opened::after,.hero.lit::after{opacity:1}
.hero canvas{position:absolute;inset:0;width:100%;height:100%}
.hero .fallback{position:absolute;left:50%;top:40%;width:min(360px,60vw);transform:translate(-50%,-50%);display:none}
.hero.no-gl .fallback{display:block}
.origin{position:absolute;transform:translate(-50%,calc(-50% + 9vh));font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(18px,1.8vw,26px);color:var(--gold-hi);white-space:nowrap;opacity:0;transition:opacity 1.2s,filter 1.2s;text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 22px rgba(0,0,0,.8);pointer-events:none}
.origin.show{opacity:1}
.origin.leave{opacity:0;transition:opacity 1.6s}
.letterbox{position:absolute;left:0;right:0;height:9vh;background:#070102;z-index:3;transition:transform 2.2s var(--ease)}
.letterbox.t{top:0}.letterbox.b{bottom:0}
.hero.opened .letterbox.t{transform:translateY(-100%)}
.hero.opened .letterbox.b{transform:translateY(100%)}
.flash{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(40% 30% at 50% 41%,rgba(255,244,214,.95),rgba(246,222,154,.35) 40%,transparent 75%)}
.flash.go{animation:flash 2.2s ease-out forwards}
@keyframes flash{0%{opacity:0}6%{opacity:1}100%{opacity:0}}
.hero-copy{position:absolute;left:0;right:0;bottom:clamp(40px,8vh,90px);text-align:center;padding:0 var(--gutter);z-index:2}
.hero-copy h1{font-family:var(--serif);font-weight:300;font-size:clamp(36px,4.8vw,72px);line-height:1.02;letter-spacing:-.015em;max-width:18ch;margin:0 auto;text-wrap:balance}
.hero-copy p{max-width:58ch;margin:18px auto 0;color:var(--ivory-dim);font-size:clamp(15px,1.2vw,18px);text-wrap:pretty}
.hero-copy .ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:26px}
.hero-copy > *{opacity:0;transform:translateY(16px);filter:blur(8px);transition:opacity 1.6s,transform 1.6s var(--ease),filter 1.6s}
.hero.opened .hero-copy > *{opacity:1;transform:none;filter:none}
.hero.opened .hero-copy > :nth-child(2){transition-delay:.35s}
.hero.opened .hero-copy > :nth-child(3){transition-delay:.7s}
.skip{position:absolute;right:clamp(8px,2vw,22px);bottom:calc(9vh + 8px);z-index:4;font:500 13px/1 var(--sans);color:var(--ivory-faint);background:none;border:0;cursor:pointer;padding:14px;min-height:44px;transition:opacity .8s}
.skip:hover{color:var(--ivory)}
.hero.opened .skip{opacity:0;pointer-events:none}

/* ---------- chapter: trust ---------- */
.trust{height:240vh;position:relative}
.pin{position:sticky;top:0;height:100vh;height:100svh;display:grid;place-items:center;overflow:hidden}
.trust blockquote{font-family:var(--serif);font-weight:300;font-size:clamp(40px,min(6.6vw,11vh),112px);line-height:1.04;letter-spacing:-.015em;max-width:17ch;transform:translateY(-5vh);text-align:center;padding:0 var(--gutter);text-wrap:balance}
.trust .w{display:inline-block;color:rgba(243,234,219,.1);transform:translateY(.12em);filter:blur(3px);transition:color .7s,transform .9s var(--ease),filter .9s,text-shadow .9s}
.trust .w.on{color:var(--ivory);transform:none;filter:none}
.trust .w.gold.on{color:var(--gold-soft);text-shadow:0 0 40px rgba(214,161,58,.45)}
.trust .after{position:absolute;bottom:8vh;left:0;right:0;text-align:center;color:var(--ivory-dim);max-width:60ch;margin:0 auto;padding:0 var(--gutter);opacity:0;transition:opacity 1.2s}
.trust .after.on{opacity:1}

/* ---------- chapter: the count ---------- */
.count{height:420vh;position:relative}
.count .pin{background:radial-gradient(60% 50% at 50% 50%,rgba(149,27,30,.28),transparent 70%)}
.slide{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 var(--gutter);opacity:0;transform:scale(1.06);filter:blur(14px);transition:opacity 1.1s,transform 1.4s var(--ease),filter 1.1s;pointer-events:none}
.slide.on{opacity:1;transform:none;filter:none}
.slide.past{transform:scale(.94)}
.slide .n{font-family:var(--serif);font-weight:300;font-size:clamp(150px,36vh,400px);line-height:.85;letter-spacing:-.04em;color:var(--gold);font-variant-numeric:lining-nums;text-shadow:0 0 80px rgba(214,161,58,.25)}
.slide .cap{font-family:var(--serif);font-size:clamp(26px,3vw,44px);line-height:1.15;margin-top:clamp(20px,3vh,36px);max-width:26ch;text-wrap:balance}
.slide .sub{color:var(--ivory-dim);margin-top:14px;max-width:48ch}
.rail{position:absolute;right:clamp(16px,3vw,44px);top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:14px}
.rail i{display:block;width:6px;height:6px;transform:rotate(45deg);border:1px solid var(--gold);transition:background .5s}
.rail i.on{background:var(--gold)}

/* ---------- chapter: six promises ---------- */
.promises{position:relative}
.promises .pin{display:block}
.promises .head{position:absolute;top:clamp(90px,14vh,140px);left:0;right:0}
.promises .head h2{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4vw,56px);line-height:1}
.promises .head p{color:var(--ivory-dim);margin-top:12px;max-width:52ch}
.track{position:absolute;top:0;bottom:0;left:0;display:flex;align-items:center;gap:clamp(56px,9vw,180px);padding:0 max(var(--gutter),calc((100vw - var(--wrap)) / 2 + var(--gutter)));padding-top:clamp(120px,16vh,170px);will-change:transform}
.promise{flex:none;width:min(78vw,820px)}
.promise h3{font-family:var(--serif);font-weight:400;font-size:clamp(60px,min(8.6vw,17vh),150px);white-space:nowrap;line-height:.9;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1px rgba(214,161,58,.55);transition:color 1s,-webkit-text-stroke-color 1s,text-shadow 1s}
.promise.on h3{color:var(--gold-soft);-webkit-text-stroke-color:transparent;text-shadow:0 0 60px rgba(214,161,58,.3)}
.promise p{color:var(--ivory-dim);font-size:clamp(17px,1.45vw,21px);max-width:40ch;margin-top:26px;opacity:.35;transition:opacity 1s}
.promise.on p{opacity:1}
.promise .idx{font-family:var(--serif);font-style:italic;color:var(--gold);font-size:20px;margin-bottom:10px}

/* ---------- shared section chrome ---------- */
section{position:relative}
.sec{padding:clamp(80px,10vw,140px) 0}
.sec-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:40px 64px;align-items:end;margin-bottom:clamp(48px,6vw,88px)}
.sec-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(38px,5vw,72px);line-height:1.02;letter-spacing:-.01em}
.sec-head p{color:var(--ivory-dim);max-width:52ch}
.rule{height:1px;background:var(--line);border:0}

/* ---------- arch portraits ---------- */
.arch{position:relative;border-radius:999px 999px 6px 6px;overflow:hidden;aspect-ratio:4/5;background:var(--garnet)}
/* the brochure portraits are cut-outs: the arch supplies a warm studio backdrop so every face reads clearly */
.arch{background:radial-gradient(90% 70% at 50% 34%,#D6AE7C 0%,#B7875A 38%,#7A3F2E 78%,#4E1A1C 100%)}
.arch img{width:100%;height:100%;object-fit:cover;object-position:50% 0;transition:transform 1.2s var(--ease)}
.person:hover .arch img{transform:scale(1.03)}
/* no photograph supplied yet: an engraved monogram on the same backdrop */
.mono-portrait{position:absolute;inset:0;display:grid;place-items:center;padding-bottom:12%;font-family:var(--serif);font-weight:500;font-size:clamp(56px,6vw,84px);letter-spacing:.04em;color:#6E3A22;text-shadow:0 1px 0 rgba(255,236,200,.55),0 -1px 0 rgba(60,20,10,.35)}
.arch::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(246,222,154,.18),inset 0 -40px 60px -30px rgba(40,10,12,.45)}
.arch-frame{position:relative;padding:8px}
.arch-frame::before{content:"";position:absolute;inset:0;border:1px solid var(--line);border-radius:999px 999px 10px 10px;transition:border-color .5s}
.person:hover .arch-frame::before{border-color:var(--gold)}
.person h4{font-family:var(--serif);font-weight:500;font-size:25px;line-height:1.15;margin-top:20px}
.person .role{color:var(--gold);font-size:14px;font-weight:500;margin-top:6px}
.person .firm{color:var(--ivory-dim);font-size:15px;margin-top:2px}

.leaders{background:linear-gradient(var(--night),var(--night-2) 30%,var(--night-2) 70%,var(--night))}
.president{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,7vw,110px);align-items:center}
.president .arch-frame{padding:12px;max-width:470px}
.president .role{color:var(--gold);font-weight:500;font-size:15px}
.president h3{font-family:var(--serif);font-weight:300;font-size:clamp(52px,7.5vw,112px);line-height:.95;letter-spacing:-.02em;margin:14px 0 18px}
.president .firm{color:var(--ivory-dim)}
.president q{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(26px,2.7vw,38px);line-height:1.2;margin:40px 0 20px;max-width:22ch;quotes:"\201C" "\201D"}
.president .note{color:var(--ivory-dim);max-width:50ch}
.bearers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,64px);margin-top:clamp(96px,11vw,150px)}
.group-title{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3.4vw,44px);margin:clamp(96px,11vw,150px) 0 12px}
.group-note{color:var(--ivory-dim);max-width:56ch;margin-bottom:48px}
.joint{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:56px clamp(20px,3vw,44px)}
.joint .person h4{font-size:22px}

/* ---------- founding roll ---------- */
/* ---------- member wall ---------- */
.wall-tools{display:flex;justify-content:space-between;align-items:center;gap:20px 32px;flex-wrap:wrap;margin-bottom:clamp(28px,3vw,40px)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips button{font:500 14px/1 var(--sans);color:var(--ivory-dim);background:transparent;border:1px solid var(--line);border-radius:999px;padding:11px 16px;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.chips button b{font-weight:500;color:var(--gold);margin-left:7px}
.chips button:hover{color:var(--ivory);border-color:rgba(214,161,58,.6)}
.chips button[aria-pressed=true]{background:var(--gold);border-color:var(--gold);color:var(--abyss)}
.chips button[aria-pressed=true] b{color:var(--abyss)}
.find input{font:400 16px/1.2 var(--sans);color:var(--ivory);background:transparent;border:0;border-bottom:1px solid rgba(243,234,219,.28);padding:10px 2px;width:min(280px,100%);-webkit-appearance:none;appearance:none;border-radius:0}
.find input::placeholder{color:var(--ivory-faint)}
.find input:focus{outline:none;border-bottom-color:var(--gold)}
.wall{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:14px}
.tile{position:relative;display:flex;flex-direction:column;background:linear-gradient(180deg,rgba(52,17,26,.55),rgba(36,11,14,.55));border:1px solid rgba(214,161,58,.22);border-radius:6px;padding:10px 10px 16px;transition:border-color .4s,transform .5s var(--ease),box-shadow .5s}
.tile.silver{border-color:rgba(227,228,228,.2)}
.tile:hover{border-color:var(--gold);transform:translateY(-3px);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.tile.silver:hover{border-color:#E3E4E4}
.tile[hidden]{display:none}
.tile-link{display:flex;flex-direction:column;flex:1;text-decoration:none;color:inherit}
.tile-link::after{content:"";position:absolute;inset:0}
.tile-link:focus-visible{outline:none}
.tile:has(.tile-link:focus-visible){outline:2px solid var(--gold);outline-offset:3px}
.tile:has(.tile-link):hover .meta b{color:var(--gold-soft)}
.plate{aspect-ratio:16/10;border-radius:3px;background:#F6EFE2;display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(160,105,43,.18)}
.plate img{max-width:84%;max-height:78%;object-fit:contain;mix-blend-mode:multiply}
.plate .mono{font-family:var(--serif);font-weight:500;font-size:44px;line-height:1;letter-spacing:.04em;color:#8A5A22;text-shadow:0 1px 0 rgba(255,255,255,.7),0 -1px 0 rgba(90,50,10,.25)}
.tile.silver .plate .mono{color:#6E6A66}
.tile .meta{padding:14px 4px 0}
.tile .meta b{display:block;font-family:var(--serif);font-weight:600;font-size:18px;line-height:1.2;color:var(--ivory);text-wrap:balance}
.tile .meta span{display:block;font-size:13px;color:var(--ivory-faint);margin-top:4px}
.tile .no{position:absolute;right:14px;bottom:16px;font-style:normal;font-size:11.5px;letter-spacing:.04em;color:var(--gold);font-variant-numeric:tabular-nums}
.tile.silver .no{color:#C9CACA}
.wall.collapsed .tile:nth-child(n+13){display:none}
.wall-more{display:flex;margin:22px auto 0}
.wall-more[hidden]{display:none}
.wall-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--ivory-dim);font-size:15px;padding-top:28px}
.wall-foot .key{display:flex;align-items:center;gap:8px;color:var(--ivory-faint)}
.wall-foot .k{display:inline-block;width:14px;height:10px;border-radius:2px;border:1px solid var(--gold)}
.wall-foot .k.silver{border-color:#E3E4E4;margin-left:14px}
/* ---------- news ---------- */
.news-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0 clamp(36px,5vw,72px);border-top:1px solid var(--line);padding-top:clamp(36px,4vw,52px)}
.story{display:block;text-decoration:none;color:inherit}
.story .meta{font-size:14px;color:var(--ivory-faint)}
.story .meta b{font-weight:500;color:var(--gold)}
.story h3{font-family:var(--serif);font-weight:500;line-height:1.15;margin:10px 0 0;transition:color .3s;text-wrap:pretty}
.story:hover h3,.story:focus-visible h3{color:var(--gold-soft)}
.story p{color:var(--ivory-dim);margin-top:14px;max-width:58ch;font-size:16px}
.lead h3{font-size:clamp(34px,3.6vw,52px);font-weight:400}
.lead p{font-size:18px}
.lead .read{display:inline-block;margin-top:24px;font-size:15px;color:var(--gold);border-bottom:1px solid var(--line);padding-bottom:3px}
.side{display:flex;flex-direction:column}
.side .story{padding:0 0 22px;margin-bottom:22px;border-bottom:1px solid rgba(214,161,58,.14)}
.side .story:last-child{border-bottom:0;margin-bottom:0}
.side .story h3{font-size:23px}
.more{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(24px,4vw,56px);margin-top:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.more .story{padding:26px 0 28px;border-bottom:1px solid rgba(214,161,58,.14)}
.more .story h3{font-size:22px}
.news-note{color:var(--ivory-faint);font-size:14px;margin-top:28px}
.news-empty{color:var(--ivory-dim);padding:40px 0}


/* ---------- apply ---------- */
.apply .panel{max-width:860px;margin:0 auto;position:relative;padding:clamp(40px,6vw,80px) clamp(22px,6vw,80px);border:1px solid var(--line);background:rgba(52,17,26,.35)}
.apply .panel::before{content:"";position:absolute;inset:8px;border:1px solid rgba(214,161,58,.14);pointer-events:none}
.apply h2{font-family:var(--serif);font-weight:400;font-size:clamp(38px,5vw,64px);line-height:1.02;text-align:center}
.apply .intro{color:var(--ivory-dim);text-align:center;max-width:52ch;margin:20px auto 48px}
form{display:grid;grid-template-columns:1fr 1fr;gap:22px 24px}
.field{display:flex;flex-direction:column;gap:8px}
.field.full{grid-column:1/-1}
label,.legend{font-size:14px;color:var(--ivory-dim)}
input[type=text],input[type=tel],select{font:400 17px/1.3 var(--sans);color:var(--ivory);background:transparent;border:0;border-bottom:1px solid rgba(243,234,219,.28);padding:10px 0;border-radius:0;transition:border-color .3s;-webkit-appearance:none;appearance:none}
select{background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px;background-repeat:no-repeat}
select option{background:var(--night);color:var(--ivory)}
input:focus,select:focus{outline:none;border-bottom-color:var(--gold)}
input[aria-invalid=true],select[aria-invalid=true]{border-bottom-color:#E07A6A}
.err{font-size:13px;color:#EFA394;min-height:0}
.metal{display:flex;gap:10px;flex-wrap:wrap}
.metal label{display:inline-flex;cursor:pointer}
.metal input{position:absolute;opacity:0;pointer-events:none}
.metal span{border:1px solid var(--line);border-radius:999px;padding:10px 20px;font-size:15px;color:var(--ivory-dim);transition:all .3s}
.metal input:checked+span{background:var(--gold);color:var(--night);border-color:var(--gold)}
.metal input:focus-visible+span{outline:2px solid var(--gold);outline-offset:3px}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:var(--ivory-dim);line-height:1.5;cursor:pointer}
.consent input{-webkit-appearance:none;appearance:none;margin-top:2px;width:19px;height:19px;flex:none;border:1px solid rgba(214,161,58,.6);border-radius:3px;background:transparent;display:grid;place-content:center;cursor:pointer}
.consent input::before{content:"";width:9px;height:5px;border:2px solid var(--night);border-top:0;border-right:0;transform:rotate(-45deg) translate(1px,-1px);opacity:0}
.consent input:checked{background:var(--gold);border-color:var(--gold)}
.consent input:checked::before{opacity:1}
form .btn{justify-self:center;grid-column:1/-1;margin-top:14px;padding:17px 34px;font-size:16px}
.done{text-align:center;display:none}
.done.show{display:block}
.done h3{font-family:var(--serif);font-weight:400;font-size:clamp(34px,4vw,52px);line-height:1.05;margin:24px 0 16px}
.done p{color:var(--ivory-dim);max-width:46ch;margin:0 auto}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding:72px 0 40px;font-size:15px;color:var(--ivory-dim)}
.foot{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:40px}
.foot .brand span{color:var(--ivory)}
.foot .tag{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ivory);margin-top:22px;max-width:26ch;line-height:1.25}
.foot h6{font:500 14px/1 var(--sans);color:var(--gold);margin-bottom:14px}
.foot address{font-style:normal;max-width:32ch}
.partner{display:inline-flex;align-items:center;gap:10px;text-decoration:none;min-height:44px}
.partner svg{height:26px;width:auto}
.fine{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:64px;padding-top:24px;border-top:1px solid var(--line);font-size:13px;color:var(--ivory-faint)}

/* ---------- quick application form ---------- */
body.dlg-on{overflow:hidden}
.apply-dialog{margin:auto;width:min(760px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:1px solid rgba(214,161,58,.45);border-radius:10px;color:var(--ivory);
  background:radial-gradient(90% 60% at 50% 0%,rgba(149,27,30,.35),transparent 70%),#1A0709;box-shadow:0 40px 120px rgba(0,0,0,.7),inset 0 0 0 8px rgba(0,0,0,.18),inset 0 0 0 9px rgba(214,161,58,.14);overflow:auto;overscroll-behavior:contain}
.apply-dialog::backdrop{background:rgba(8,2,3,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.apply-dialog[open]{animation:dlgIn .6s var(--ease)}
@keyframes dlgIn{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
.dlg-body,.dlg-done{padding:clamp(28px,5vw,52px) clamp(20px,5vw,56px) clamp(28px,4vw,44px)}
.dlg-body[hidden],.dlg-done[hidden]{display:none}
.dlg-seal{width:64px;margin:0 auto 14px}
.apply-dialog h2{font-family:var(--serif);font-weight:400;font-size:clamp(32px,4vw,46px);line-height:1.05;text-align:center}
.dlg-intro{color:var(--ivory-dim);text-align:center;max-width:46ch;margin:12px auto 32px;font-size:16px}
.dlg-close{position:absolute;top:12px;right:12px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(12,3,4,.5);cursor:pointer;z-index:2}
.dlg-close span::before,.dlg-close span::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:1.5px;background:var(--ivory);transform:translate(-50%,-50%) rotate(45deg)}
.dlg-close span::after{transform:translate(-50%,-50%) rotate(-45deg)}
.dlg-close:hover{border-color:var(--gold)}
#qf .f{display:flex;flex-direction:column;gap:6px}
#qf .f.full{grid-column:1/-1}
#qf label,#qf .lbl{font-size:14px;color:var(--ivory-dim)}
#qf label em{font-style:normal;color:var(--ivory-faint)}
#qf input:not([type=radio]):not([type=checkbox]),#qf select{font:400 17px/1.3 var(--sans);color:var(--ivory);background:transparent;border:0;border-bottom:1px solid rgba(243,234,219,.28);padding:9px 0;border-radius:0;-webkit-appearance:none;appearance:none;width:100%}
#qf select{background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);background-position:calc(100% - 12px) 55%,calc(100% - 7px) 55%;background-size:5px 5px;background-repeat:no-repeat}
#qf select option{background:var(--night)}
#qf input:focus,#qf select:focus{outline:none;border-bottom-color:var(--gold)}
#qf [aria-invalid=true]{border-bottom-color:#E07A6A}
#qf .e{font-size:13px;color:#EFA394;min-height:0}
#qf .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
#qf .consent{font-size:14px}
.form-msg{grid-column:1/-1;text-align:center;color:#EFA394;font-size:14px;min-height:0}
.form-msg:empty{display:none}
#qf .submit{grid-column:1/-1;justify-self:center;margin-top:6px;padding:17px 40px;font-size:16px}
#qf .submit:disabled{opacity:.6;cursor:progress}
.dlg-done{text-align:center;outline:none}
.dlg-done h2{margin:20px 0 12px}
.dlg-done p{color:var(--ivory-dim);max-width:44ch;margin:0 auto 28px}

/* ---------- responsive ---------- */
@media (max-width:980px){
  .nav ul{display:none}
  .sec-head,.president{grid-template-columns:1fr}
  .president .arch-frame{max-width:380px}
  .joint{grid-template-columns:repeat(2,minmax(0,1fr))}
  .aims{grid-template-columns:1fr 1fr}
  .news-grid{grid-template-columns:1fr}
  .side{margin-top:40px;padding-top:32px;border-top:1px solid var(--line)}
  .more{grid-template-columns:1fr 1fr}
  .aim,.aim:nth-child(3n+2),.aim:nth-child(3n+3){padding:32px 28px 36px 0;border-left:0}
  .aim:nth-child(2n){padding-left:28px;border-left:1px solid var(--line)}
  .foot{grid-template-columns:1fr 1fr}
  .foot > :first-child{grid-column:1/-1}
}
@media (max-width:640px){
  /* the sound control moves into the top bar so it never sits on top of content */
  .sound{top:13px;bottom:auto;left:66px;padding:0;width:38px;height:38px;justify-content:center;border-color:rgba(214,161,58,.35)}
  .hero-copy{bottom:calc(9vh + 14px)}
  .hero-copy h1{font-size:clamp(32px,9vw,40px)}
  .hero-copy p{font-size:15px;margin-top:12px}
  .hero-copy .ctas{margin-top:20px;gap:10px}
  .hero-copy .ctas .btn{padding:13px 18px;font-size:14px}
  .promises .pin{position:static;height:auto;overflow:visible;padding:96px 0 40px}
  .promises .head{position:static}
  .track{position:static;flex-direction:column;align-items:stretch;gap:56px;padding:48px var(--gutter) 0;transform:none!important}
  .promise{width:auto}
  .promise h3{font-size:clamp(52px,15vw,72px);color:var(--gold-soft);-webkit-text-stroke-color:transparent}
  .promise p{max-width:100%;opacity:1;margin-top:14px}
  .sound #soundLabel{display:none}
  .sound{padding:10px 12px}
  .rail{display:none}
  .skip{bottom:calc(9vh + 6px)}

  body{font-size:16px}
  .nav .wrap{height:64px}
  .brand span{display:none}
  .nav .btn{padding:10px 16px}
  .aims{grid-template-columns:1fr}
  .aim,.aim:nth-child(2n){padding:28px 0 30px;border-left:0}
  .bearers{grid-template-columns:1fr 1fr;gap:40px 18px}
  .bearers .person:first-child{grid-column:1/-1;max-width:62%;margin:0 auto;text-align:center}
  .joint{gap:40px 18px}
  .person h4,.joint .person h4{font-size:20px}
  .person .firm{font-size:14px}
  form,#qf{grid-template-columns:1fr}
  .apply-dialog{width:100%;max-width:100%;height:100%;height:100dvh;max-height:none;margin:0;inset:0;border:0;border-radius:0}
  #qf{gap:16px}
  .dlg-seal{width:52px}
  .wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .tile .meta b{font-size:16px}
  .tile .no{display:none}
  .find,.find input{width:100%}
  .more{grid-template-columns:1fr}
  .foot{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .grain{animation:none}
  .door,.slide,.trust .w{transition:none}
}

.apply-cta{text-align:center}
.apply-cta .btn{padding:18px 40px;font-size:16px}