@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500&family=Libre+Caslon+Text&display=swap');
:root{font-family:'DM Sans',Arial,sans-serif;color:#191919;background:#fff;font-synthesis:none;font-size:16px;--edge:clamp(22px,2.1vw,40px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-snap-type:y mandatory;scroll-padding-top:0}body{margin:0}a{color:inherit;text-decoration:none}a:focus-visible,summary:focus-visible{outline:2px solid #aa6653;outline-offset:7px}::selection{background:#cf9b85;color:#111}
.skip-link{position:fixed;top:16px;left:16px;z-index:20;background:white;color:#111;padding:12px;transform:translateY(-200%)}.skip-link:focus{transform:translateY(0)}
.cover{position:fixed;inset:0;background:radial-gradient(ellipse at 72% 80%,#9e6954 0%,#663d32 22%,#301e1d 46%,#101013 79%);z-index:-1}.cover video{width:100%;height:100%;object-fit:cover;display:none}.cover.has-video video{display:block}.cover-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.22),transparent 65%)}
.identity,.navigation{position:fixed;z-index:5;top:50%;transform:translateY(-50%);transition:color .6s ease,opacity .7s ease;color:#191919;font-size:1rem;line-height:1.45}.identity{left:var(--edge);width:150px}.navigation{left:23%;display:flex;flex-direction:column;gap:8px}.navigation a{color:#777;transition:color .35s ease,transform .35s ease;width:fit-content}.navigation a:hover{color:#191919;transform:translateX(3px)}.navigation a[aria-current]{color:#191919}.at-home .identity,.at-home .navigation{color:#fff}.at-home .navigation a{color:#beb5b1}.at-home .navigation a:hover,.at-home .navigation a[aria-current]{color:#fff}.typing .identity,.typing .navigation{opacity:0;pointer-events:none}
.section{min-height:100svh;scroll-snap-align:start;scroll-snap-stop:always;position:relative;display:flex;align-items:center}.home{color:white}.home h1{position:absolute;left:var(--edge);top:41%;margin:0;max-width:470px;font-family:'Libre Caslon Text',Georgia,serif;font-weight:400;font-size:clamp(25px,2.1vw,34px);line-height:1.4;letter-spacing:-.025em;transition:top 1.1s cubic-bezier(.22,1,.36,1),font-size 1.1s ease}.home h1.settled{top:var(--edge);font-size:clamp(23px,1.65vw,29px);max-width:410px}.home-foot{position:absolute;bottom:var(--edge);left:var(--edge);right:var(--edge);display:flex;justify-content:space-between;gap:20px;font-size:.875rem;color:#e5d8d1;transition:opacity .7s ease}.home-foot a span{margin-left:18px}.typing .home-foot{opacity:0}.light{background:#fff}.section-content{width:43%;margin-left:52%;padding:90px 0;max-width:720px}.eyebrow{font-size:.875rem;color:#777;margin:0 0 34px;line-height:1.5}h2{font-size:clamp(30px,3vw,48px);line-height:1.12;font-weight:400;letter-spacing:-.04em;margin:0 0 48px}.project-list{border-top:1px solid #dedede}.project{border-bottom:1px solid #dedede;padding:25px 0}.project summary{list-style:none;cursor:pointer;display:flex;gap:18px;align-items:baseline;font-size:clamp(18px,1.55vw,24px);font-weight:400;letter-spacing:-.025em}.project summary::-webkit-details-marker{display:none}.project-number{font-size:.75rem;letter-spacing:0;color:#777;min-width:22px}.project-toggle{margin-left:auto;font-size:22px;font-weight:400}.project[open] .project-toggle{transform:rotate(45deg)}.project-body{padding-left:40px;animation:reveal .4s ease}.project-body p{color:#676767;font-size:1rem;line-height:1.6;max-width:440px;margin:18px 0 4px}.project-body img{width:100%;height:auto;margin-top:22px;display:block}.officer-list{display:grid;grid-template-columns:1fr 1fr;gap:0 34px}.officer{border-top:1px solid #dedede;padding:23px 0;min-height:90px}.officer h3{font-size:1rem;line-height:1.45;font-weight:400;margin:0}.officer p{font-size:1rem;color:#777;margin:10px 0;line-height:1.5}.officer img{width:100%;aspect-ratio:4/5;object-fit:cover;margin-bottom:18px}.join-content h2{margin-bottom:30px}.join-copy{color:#777;line-height:1.6;margin-bottom:44px}.join-link{display:flex;align-items:center;justify-content:space-between;padding:16px 0;border-bottom:1px solid #191919;max-width:300px;font-size:1.125rem}.join-link span{transition:transform .2s}.join-link:hover span{transform:translate(3px,-3px)}footer{position:absolute;left:var(--edge);right:var(--edge);bottom:var(--edge);display:flex;justify-content:space-between;color:#777;font-size:.875rem}.intro-locked{overflow:hidden}@keyframes reveal{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1700px){.navigation{left:16%}.section-content{margin-left:57%;width:36%}}
@media(max-width:760px){.identity,.navigation{top:22px;transform:none;font-size:.875rem}.identity{width:120px}.navigation{left:auto;right:22px;gap:5px}.home h1{max-width:330px;right:24px}.home h1.settled{top:35%;font-size:28px}.section-content{margin-left:var(--edge);width:calc(100% - var(--edge)*2);padding:180px 0 100px;max-width:none}.section{min-height:100svh}.section-content h2{font-size:36px;margin-bottom:32px}.eyebrow{margin-bottom:24px}.officer-list{gap:0 22px}.officer{min-height:88px}.home-foot{font-size:.75rem}footer{font-size:.75rem;gap:20px}.light::before{content:'';position:absolute;top:0;left:0;right:0;height:145px;background:linear-gradient(white 80%,transparent);pointer-events:none}.project summary{font-size:20px}.join-content{padding-bottom:140px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* The opening stays locked until the visitor chooses to enter. */
.enter-screen{position:fixed;inset:0;width:100%;height:100%;z-index:10;border:0;padding:0;background:transparent;color:white;cursor:pointer;font:inherit;touch-action:none}
.enter-label{position:fixed;left:50%;top:calc(100% - 64px);transform:translateX(-50%);font-size:.875rem;line-height:1.5;white-space:nowrap;pointer-events:none;text-shadow:0 1px 8px #000}
.enter-label.following{transform:none}
.enter-screen:focus-visible{outline:1px solid rgba(255,255,255,.6);outline-offset:-12px}
.enter-screen:focus-visible .enter-label{ text-decoration:underline;text-underline-offset:5px }
.intro-locked .identity,.intro-locked .navigation,.intro-locked .home-foot{opacity:0;pointer-events:none}
.intro-locked .home h1.settled{top:41%;font-size:clamp(25px,2.1vw,34px);max-width:470px}
#projects:focus{outline:none}
@media(pointer:coarse){.enter-label{font-size:1rem}}
.enter-screen .enter-label{opacity:0;transition:opacity .35s ease}
.enter-screen.ready .enter-label{opacity:1}
.enter-screen[aria-disabled="true"]{cursor:default}

/* A single, measured glide from the cover into the site. */
html.entering{scroll-snap-type:none;scroll-behavior:auto}
.entering .identity,.entering .navigation,.entering .home-foot{opacity:0;pointer-events:none}
.entering .home h1.settled{top:41%;font-size:clamp(25px,2.1vw,34px);max-width:470px}
.intro-brand{position:absolute;left:var(--edge);bottom:var(--edge);white-space:pre-line;font-size:1rem;line-height:1.45;color:white;opacity:0;transition:opacity .35s ease;pointer-events:none}
.entry-ready .intro-brand{opacity:1}
@media(max-width:760px){.intro-brand{font-size:.875rem}.enter-label:not(.following){left:auto;right:var(--edge);top:auto;bottom:var(--edge);transform:none}}
.project-label{display:flex;flex-direction:column;gap:7px}
.project-status{font-size:.875rem;line-height:1.4;letter-spacing:0;color:#777}
.project-body img{max-height:440px;object-fit:contain;object-position:center;background:#fff}

/* Reveal the warm cover underneath as the opening film fades away. */
.cover video{display:block;opacity:0;transition:opacity 3.2s cubic-bezier(.4,0,.2,1)}
.cover.has-video video{opacity:1}
.cover.has-video.video-finished video{opacity:0}
.officer img[src="assets/malik-salah.png"]{object-position:center top}

/* Black while loading; bring in the gradient only as the film ends. */
.cover{background:#000}
.cover::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 72% 80%,#9e6954 0%,#663d32 22%,#301e1d 46%,#101013 79%);opacity:0;transition:opacity 3.2s cubic-bezier(.4,0,.2,1)}
.cover.video-finished::before{opacity:1}
.cover video{position:relative}