@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');

:root { --ink:#102a39; --ink-soft:#173849; --paper:#f6f3ee; --sand:#e6dacb; --gold:#b88a4c; --line:rgba(16,42,57,.18); --mono:'DM Mono', monospace; --sans:'Manrope', sans-serif; --serif:'Playfair Display', Georgia, serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); }
a { color:inherit; text-decoration:none; }
img { display:block; width:100%; height:100%; object-fit:cover; }
.skip-link { position:fixed; transform:translateY(-120%); left:1rem; top:1rem; background:#fff; padding:.75rem 1rem; z-index:9; }
.skip-link:focus { transform:translateY(0); }
.site-header { height:84px; padding:0 clamp(1.25rem,4vw,5rem); display:flex; gap:2rem; justify-content:space-between; align-items:center; background:var(--paper); position:relative; z-index:2; }
.brand { display:flex; align-items:center; gap:.8rem; min-width:240px; }
.brand-mark { font-family:var(--serif); color:var(--gold); font-size:2.3rem; font-style:italic; line-height:.6; letter-spacing:-.18rem; }
.brand-name { font-family:var(--serif); font-size:1.1rem; line-height:1; }
.brand-name small { font:500 .48rem/1.4 var(--mono); display:block; margin-top:.3rem; text-transform:uppercase; letter-spacing:.13rem; }
nav { display:flex; gap:2.2rem; font:500 .63rem var(--mono); letter-spacing:.08rem; text-transform:uppercase; }
nav a, .instagram { transition:color .2s ease; } nav a:hover, .instagram:hover { color:var(--gold); }
.header-cta { border:1px solid var(--ink); border-radius:99px; padding:.78rem 1rem  .78rem 1.2rem; font-size:.68rem; font-weight:600; white-space:nowrap; transition:.25s ease; }
.header-cta span { margin-left:.45rem; font-size:1rem; }.header-cta:hover { background:var(--ink); color:var(--paper); }
.hero { min-height:calc(100vh - 84px); height:820px; background:var(--ink); color:#fff; padding:clamp(2rem,5vw,5.4rem); display:grid; grid-template-columns:minmax(300px,1.2fr) minmax(370px,.8fr); position:relative; overflow:hidden; }
.hero-image-wrap { min-height:460px; position:relative; overflow:hidden; }.hero-image { object-position:center 30%; filter:saturate(.85) contrast(.98); }.hero-film { position:absolute; inset:0; background:linear-gradient(90deg,rgba(8,29,40,.15),transparent 60%), linear-gradient(0deg,rgba(8,29,40,.48),transparent 42%); }.image-caption { position:absolute; margin:0; left:1rem; bottom:1rem; font:.54rem var(--mono); letter-spacing:.07rem; text-transform:uppercase; }
.hero-copy { display:flex; padding:clamp(1.5rem,7vw,7rem) clamp(1rem,4vw,5rem) clamp(2rem,4vw,3.5rem); flex-direction:column; justify-content:space-between; }.eyebrow { margin:0 0 1rem; color:var(--gold); font:500 .62rem var(--mono); letter-spacing:.14rem; }.hero h1 { font:500 clamp(3.5rem,6.2vw,7.6rem)/.94 var(--serif); letter-spacing:-.06em; margin:0; }.hero h1 em, .contact h2 em { color:var(--sand); }.hero-bottom { display:flex; align-items:end; gap:2rem; }.hero-bottom p { margin:0; max-width:290px; color:#c8d0d1; font-size:.82rem; line-height:1.7; }.round-link { display:grid; place-items:center; flex:none; border:1px solid rgba(255,255,255,.55); border-radius:50%; height:58px; width:58px; font-size:1.5rem; transition:.25s ease; }.round-link:hover { background:var(--gold); border-color:var(--gold); }.hero-index { bottom:1.1rem; right:clamp(1.25rem,4vw,5rem); position:absolute; font:.58rem var(--mono); color:#bfcbcf; }.hero-index span { padding:0 .3rem; color:var(--gold); }
.intro-band { padding:clamp(5rem,11vw,10rem) clamp(1.25rem,8vw,10rem); display:grid; grid-template-columns:1fr 3.5fr 1.5fr; gap:clamp(2rem,6vw,8rem); border-bottom:1px solid var(--line); }.section-number { margin:0; color:var(--gold); font:.65rem var(--mono); }.intro-band h2, .paths h2, .gallery-heading h2 { margin:0; max-width:650px; font:500 clamp(2.4rem,4.2vw,5rem)/1.04 var(--serif); letter-spacing:-.05em; }.intro-note { align-self:end; color:#51616a; font-size:.85rem; line-height:1.7; }
.portrait-feature { max-width:1480px; padding:clamp(5rem,9vw,9rem) clamp(1.25rem,8vw,10rem); margin:auto; display:grid; grid-template-columns:1.35fr 1.1fr .6fr; gap:clamp(1rem,3vw,3.5rem); align-items:center; }.feature-image.large { height:min(56vw,760px); }.feature-image.small { height:min(32vw,430px); align-self:end; }.feature-copy { padding:1.5rem 0; }.ornament { display:block; color:var(--gold); margin-bottom:3rem; font-size:1.3rem; }.feature-copy h2 { margin:0 0 1.6rem; font:500 clamp(2.1rem,3.6vw,4rem)/1.08 var(--serif); letter-spacing:-.045em; }.placeholder-copy { max-width:360px; color:#57666e; line-height:1.7; font-size:.86rem; }.text-link { display:inline-block; margin-top:2rem; border-bottom:1px solid var(--ink); padding-bottom:.5rem; font-size:.75rem; font-weight:700; }.text-link span { color:var(--gold); margin-left:1.2rem; }
.editorial-quote { position:relative; min-height:680px; overflow:hidden; background:var(--sand); padding:clamp(4rem,8vw,8rem) clamp(1.25rem,12vw,15rem); display:flex; flex-direction:column; justify-content:center; }.quote-kicker { color:var(--ink); font:.6rem var(--mono); letter-spacing:.12em; }.editorial-quote blockquote { position:relative; max-width:800px; z-index:1; margin:1.4rem 0 0; font:500 clamp(3rem,5.5vw,6.5rem)/1.02 var(--serif); letter-spacing:-.06em; }.quote-image { position:absolute; right:0; top:0; bottom:0; width:38%; }.quote-image:after { content:""; inset:0; position:absolute; background:linear-gradient(90deg,var(--sand),transparent 48%); }.quote-image img { object-position:58% center; }
.paths { padding:clamp(5rem,10vw,9rem) clamp(1.25rem,4vw,5rem); }.paths-head { display:grid; grid-template-columns:.35fr 1.8fr 1fr; gap:3rem; align-items:end; max-width:1450px; margin:0 auto 3.5rem; }.paths-head > p:last-child { margin:0; color:#57666e; font-size:.82rem; line-height:1.7; }.path-grid { display:grid; grid-template-columns:repeat(4,1fr); max-width:1450px; margin:auto; }.path-card { min-height:360px; padding:1.8rem; display:flex; flex-direction:column; position:relative; overflow:hidden; }.path-card > span { font:.58rem var(--mono); }.path-card h3 { margin:auto 0 .7rem; font:500 2rem/1.05 var(--serif); }.path-card p { max-width:230px; margin:0; font-size:.77rem; line-height:1.7; }.path-card > a { height:32px; width:32px; display:grid; place-items:center; position:absolute; right:1.6rem; bottom:1.6rem; font-size:1.25rem; }.card-dark { background:var(--ink); color:var(--paper); }.card-dark > span,.card-dark a { color:var(--gold); }.card-sand { background:#dfcfbc; }.card-gold { background:#bd8e50; color:#102a39; }.card-photo { padding:0; color:#fff; }.card-photo:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.55),transparent 65%); }.card-photo div { z-index:1; padding:1.8rem; display:flex; flex-direction:column; position:absolute; inset:0; }.card-photo div > span { font:.58rem var(--mono); }.card-photo h3 { margin:auto 0 0; }.card-photo a { right:1.6rem; bottom:1.6rem; }
.gallery-section { padding:clamp(5rem,10vw,9rem) 0; overflow:hidden; }.gallery-heading { padding:0 clamp(1.25rem,8vw,10rem) 3rem; }.gallery-heading h2 { max-width:500px; }.gallery-track { display:grid; grid-template-columns:1.3fr 1fr 1.3fr; gap:1.2rem; min-width:950px; padding:0 1.2rem; }.gallery-track figure { margin:0; height:530px; position:relative; overflow:hidden; }.gallery-track figure:nth-child(2) { transform:translateY(4rem); }.gallery-track img { transition:transform .5s ease; }.gallery-track figure:hover img { transform:scale(1.04); }.gallery-track figcaption { position:absolute; left:1rem; bottom:1rem; color:#fff; font:italic 1.8rem var(--serif); text-shadow:0 1px 10px #000; }
.contact { color:var(--paper); background:var(--ink); display:grid; grid-template-columns:1fr 1.2fr; min-height:680px; }.contact-image { min-height:500px; }.contact-image img { object-position:center 20%; filter:saturate(.8); }.contact-copy { padding:clamp(4rem,9vw,9rem); display:flex; flex-direction:column; justify-content:center; }.contact h2 { margin:0 0 1.5rem; font:500 clamp(3rem,5vw,6rem)/.98 var(--serif); letter-spacing:-.06em; }.contact-copy > p:not(.eyebrow) { max-width:400px; color:#c5d0d3; font-size:.86rem; line-height:1.75; }.contact-button { background:var(--gold); color:var(--ink); display:flex; justify-content:space-between; max-width:340px; margin-top:2rem; padding:1.1rem 1.3rem; font-size:.78rem; font-weight:700; transition:background .2s; }.contact-button:hover { background:#dfbd82; }.contact-button span { font-size:1.1rem; }.instagram { margin-top:1.4rem; width:max-content; border-bottom:1px solid rgba(255,255,255,.4); padding-bottom:.35rem; font:.64rem var(--mono); color:#d8e1e1; }
footer { display:flex; justify-content:space-between; padding:1.3rem clamp(1.25rem,4vw,5rem); color:#6d7d84; background:#0a1d28; font:.56rem var(--mono); letter-spacing:.04em; } footer a { color:#d1d9db; }
@media (max-width:900px) { .site-header { height:72px; }.brand { min-width:auto; } nav { display:none; }.header-cta { font-size:.57rem; }.hero { height:auto; min-height:0; display:flex; flex-direction:column; padding:1.2rem; }.hero-image-wrap { height:55vh; }.hero-copy { gap:4rem; padding:3rem 1rem 2rem; }.hero h1 { font-size:clamp(3.7rem,14vw,5.5rem); }.intro-band,.paths-head { grid-template-columns:1fr; gap:1.5rem; }.intro-note { max-width:430px; }.portrait-feature { grid-template-columns:1.3fr 1fr; }.feature-image.small { display:none; }.path-grid { grid-template-columns:1fr 1fr; }.quote-image { opacity:.38; width:100%; }.editorial-quote blockquote { font-size:clamp(3rem,9vw,5rem); }.contact { grid-template-columns:1fr; }.contact-image { height:52vh; min-height:0; } }
@media (max-width:540px) { .brand-name { display:none; }.header-cta { padding:.68rem .85rem; }.header-cta span { margin-left:.15rem; }.hero-bottom p { font-size:.75rem; }.intro-band { padding:4rem 1.25rem; }.portrait-feature { display:block; padding:4rem 1.25rem; }.feature-image.large { height:120vw; margin-bottom:2.6rem; }.paths { padding:4.5rem 1.25rem; }.path-grid { grid-template-columns:1fr; }.path-card { min-height:280px; }.gallery-track { grid-template-columns:300px 260px 300px; min-width:0; overflow-x:auto; padding-bottom:4rem; }.gallery-track figure { height:400px; }.gallery-track figure:nth-child(2) { transform:none; }.contact-copy { padding:4rem 1.25rem; } footer { gap:.7rem; flex-wrap:wrap; } }
