:root { --ink:#161616; --paper:#f5f4f0; --line:rgba(22,22,22,.16); --pad:clamp(22px,3vw,54px); --display:"Bodoni 72", Didot, "Iowan Old Style", Georgia, serif; --sans:"Helvetica Neue", Helvetica, Arial, sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; width:100%; overflow-x:hidden; }
body { margin:0; width:100%; overflow-x:hidden; background:var(--paper); color:var(--ink); font-family:var(--sans); }
a { color:inherit; text-decoration:none; }
.hero { width:100%; min-height:100svh; margin:0; position:relative; color:#fff; overflow:hidden; }
.video-stage,.hero-still,.hero-shade { position:absolute; inset:0; width:100%; height:100%; }
.hero-still { display:block; object-fit:cover; object-position:center center; transform:scale(1.06); transform-origin:60% center; }
.hero-shade { background:linear-gradient(180deg,rgba(0,0,0,.38),transparent 35%,rgba(0,0,0,.24)); z-index:1; }
.hero-header { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; padding:clamp(24px,4vw,55px) var(--pad); }
.brand { font-size:clamp(27px,3.3vw,48px); letter-spacing:-.075em; font-weight:300; line-height:.9; }
nav { display:flex; gap:clamp(15px,2.5vw,44px); font-size:clamp(15px,1.25vw,19px); }
nav a { opacity:.86; transition:opacity .2s; } nav a:hover { opacity:1; }
.hero-copy { position:absolute; z-index:2; left:var(--pad); bottom:15vh; }
.eyebrow { font:10px/1.3 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing:.11em; margin:0 0 20px; }
h1,h2 { font-family:var(--sans); font-weight:400; letter-spacing:-.065em; margin:0; }
h1 { font-size:clamp(39px,6.4vw,104px); line-height:.9; }
.scroll-cue { position:absolute; z-index:2; bottom:clamp(28px,4vw,55px); left:var(--pad); font-size:11px; display:flex; gap:16px; align-items:center; }
.scroll-cue span { font-size:20px; }
.gallery-section { padding:clamp(78px,12vw,178px) var(--pad); }
.section-header { max-width:580px; margin-bottom:clamp(44px,7vw,90px); }
h2 { font-size:clamp(43px,6vw,90px); line-height:.95; }
.section-note { max-width:300px; font-size:13px; line-height:1.6; margin:26px 0 0; }
.gallery { columns:4; column-gap:5px; }
.gallery-item { display:block; position:relative; overflow:hidden; isolation:isolate; margin:0 0 5px; break-inside:avoid; background:#d7d5cf; }
.gallery-item img { width:100%; height:auto; display:block; transition:transform .7s ease; }
.gallery-item:hover img { transform:scale(1.025); }
.gallery-item::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.5)); opacity:0; transition:opacity .35s; }
.gallery-item:hover::after,.gallery-item:hover span { opacity:1; }
.gallery-item span { position:absolute; z-index:1; left:15px; bottom:13px; color:#fff; font:10px ui-monospace, SFMono-Regular, Menlo, monospace; opacity:0; transition:opacity .35s; }
.tall,.wide,.square,.portrait { grid-row:auto; }
.about-section,.courses-section { padding:clamp(80px,13vw,190px) var(--pad); display:grid; grid-template-columns:1fr 2fr; gap:30px; border-top:1px solid var(--line); }.about-section p:not(.eyebrow),.courses-section>p:not(.eyebrow) { max-width:440px; font-size:14px; line-height:1.7; margin:30px 0 0; }.courses-section { display:block; }.courses-section h2 { max-width:650px; }.text-link { display:inline-flex; margin-top:32px; gap:24px; font-size:13px; border-bottom:1px solid var(--ink); padding-bottom:7px; }
.footer { background:#191919; color:#f5f4f0; padding:clamp(80px,12vw,170px) var(--pad) 30px; }.email { display:inline-block; font-size:clamp(17px,1.5vw,24px); letter-spacing:-.025em; border-bottom:1px solid rgba(255,255,255,.45); }.phone { display:block; width:max-content; margin-top:14px; font-size:clamp(15px,1.15vw,18px); letter-spacing:0; }.footer-bottom { margin-top:clamp(100px,16vw,230px); display:flex; justify-content:space-between; color:#9d9d9a; font:10px ui-monospace, SFMono-Regular, Menlo, monospace; }
.lightbox { width:100%; height:100%; max-width:none; max-height:none; border:0; margin:0; padding:clamp(22px,4vw,54px); background:rgba(9,9,9,.96); color:#fff; place-items:center; overflow:hidden; }.lightbox[open] { display:grid; }.lightbox::backdrop { background:rgba(0,0,0,.72); }.lightbox-image { max-width:100%; max-height:calc(100svh - 110px); object-fit:contain; }.lightbox-caption { position:absolute; left:var(--pad); bottom:25px; margin:0; font:10px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing:.08em; }.lightbox-close { position:absolute; top:18px; right:var(--pad); z-index:1; width:42px; height:42px; border:0; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; font:32px/1 Arial; }.lightbox-close:hover { background:rgba(255,255,255,.22); }
@media (max-width:700px) { .hero { min-height:100svh; }.hero-header { align-items:flex-start; padding-top:25px; }.brand { font-size:25px; max-width:180px; } nav { width:165px; flex-wrap:wrap; justify-content:flex-end; line-height:1.7; font-size:14px; }.hero-copy { bottom:17vh; }.scroll-cue { bottom:25px; }.gallery-section { padding-top:84px; }.gallery { columns:2; column-gap:5px; }.gallery-item { margin-bottom:5px; }.gallery-item span { opacity:1; }.gallery-item::after { opacity:1; }.about-section { display:block; }.about-section h2 { margin-top:32px; }.footer-bottom { gap:20px; } }
@media (max-width:390px) { nav { width:145px; gap:8px 16px; }.hero-copy { bottom:14vh; }.footer-bottom { flex-direction:column; } }