@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=DM+Mono:wght@400;500&family=DM+Sans:wght@400;500;600&display=swap');

:root{
  --paper:#f3efe8;
  --paper-2:#eae3d8;
  --ink:#1e211d;
  --muted:#716e66;
  --line:rgba(30,33,29,.15);
  --accent:#a45c45;
  --serif:"Cormorant Garamond", Georgia, serif;
  --sans:"DM Sans", Arial, sans-serif;
  --mono:"DM Mono", monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.6}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
.site-header{position:sticky;top:0;z-index:50;background:rgba(243,239,232,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{max-width:1220px;margin:auto;padding:18px 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{font-family:var(--mono);font-size:12px;letter-spacing:.12em;font-weight:500}
.nav-links{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.nav-links a{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);position:relative}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-links a.active:after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:var(--accent)}
main{max-width:1220px;margin:auto;padding:0 28px}
.hero{min-height:82vh;display:grid;grid-template-columns:1.1fr .9fr;align-items:end;gap:7vw;padding:8vh 0 12vh}
.eyebrow,.kicker{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.hero h1{font-family:var(--serif);font-weight:500;font-size:clamp(68px,10vw,148px);line-height:.78;letter-spacing:-.045em;margin:24px 0 34px;max-width:800px}
.hero h1 em{font-weight:400;color:var(--accent)}
.hero-copy{max-width:520px;font-size:17px;color:#46453f}
.hero-note{align-self:center;border-left:1px solid var(--line);padding-left:30px;max-width:390px}
.hero-note p{font-family:var(--serif);font-size:28px;line-height:1.05;margin:14px 0}
.hero-note small{font-family:var(--mono);font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.section{padding:90px 0;border-top:1px solid var(--line)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:36px}
.section-head h2{font-family:var(--serif);font-weight:500;font-size:58px;line-height:.9;margin:0;letter-spacing:-.03em}
.section-head p{max-width:390px;color:var(--muted);margin:0}
.mosaic{display:grid;grid-template-columns:1.05fr .72fr 1fr;gap:14px;align-items:start}
.mosaic figure{margin:0;position:relative}
.mosaic img{display:block;width:100%;height:560px;object-fit:cover;filter:saturate(.9)}
.mosaic figure:nth-child(2){margin-top:100px}
.mosaic figure:nth-child(3){margin-top:35px}
.caption{padding:14px 4px 0}
.caption .num{font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.1em}
.caption p{font-family:var(--serif);font-size:25px;line-height:1.08;margin:7px 0 0}
.link-arrow{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--accent)}
.statement{font-family:var(--serif);font-size:clamp(45px,6vw,86px);line-height:.92;max-width:1000px;margin:0}
.statement em{color:var(--accent)}
.two-col{display:grid;grid-template-columns:.75fr 1.25fr;gap:8vw}
.story h2{font-family:var(--serif);font-size:56px;line-height:.95;font-weight:500;margin:0 0 25px}
.story p{max-width:650px;color:#4f4d47}
.pullquote{font-family:var(--serif);font-size:38px;line-height:1.02;padding-top:15px}
.footer{max-width:1220px;margin:auto;padding:45px 28px 60px;display:flex;justify-content:space-between;gap:30px;border-top:1px solid var(--line);font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.page-intro{padding:100px 0 70px;display:grid;grid-template-columns:1fr .8fr;gap:8vw;align-items:end}
.page-intro h1{font-family:var(--serif);font-size:clamp(70px,9vw,130px);font-weight:500;line-height:.78;letter-spacing:-.04em;margin:20px 0 0}
.page-intro p{color:var(--muted);max-width:440px}
.gallery{columns:3 280px;column-gap:16px}
.photo-card{break-inside:avoid;margin:0 0 38px}
.photo-trigger{border:0;padding:0;background:none;width:100%;cursor:zoom-in;text-align:left}
.photo-trigger img{width:100%;display:block;object-fit:cover;max-height:780px;transition:transform .45s ease,filter .45s ease}
.photo-trigger:hover img{transform:scale(.985);filter:saturate(.75)}
.photo-meta{display:flex;justify-content:space-between;margin-top:10px;font-family:var(--mono);font-size:9px;text-transform:uppercase;letter-spacing:.11em;color:var(--muted)}
.photo-card h3{font-family:var(--serif);font-size:29px;font-weight:500;line-height:1;margin:7px 0}
.photo-card p{font-size:13px;color:#5d5a52;margin:0;max-width:450px}
.note-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.note{background:var(--paper);padding:42px;min-height:320px}
.note .index{font-family:var(--mono);font-size:10px;color:var(--accent)}
.note h2{font-family:var(--serif);font-weight:500;font-size:43px;line-height:.95;margin:35px 0 16px}
.note p{color:#5d5a52;max-width:500px}
.place{display:grid;grid-template-columns:.95fr 1.05fr;gap:5vw;align-items:center;margin:0 0 100px}
.place:nth-child(even){grid-template-columns:1.05fr .95fr}
.place:nth-child(even) .place-image{order:2}
.place-image img{width:100%;display:block;max-height:720px;object-fit:cover}
.place-copy .number{font-family:var(--mono);font-size:10px;color:var(--accent)}
.place-copy h2{font-family:var(--serif);font-size:70px;line-height:.82;font-weight:500;margin:16px 0 24px}
.place-copy p{max-width:520px;color:#55524b}
.tagline{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.about-wrap{display:grid;grid-template-columns:1fr 1fr;gap:7vw;padding-bottom:100px}
.about-portrait img{width:100%;height:700px;object-fit:cover}
.about-copy h2{font-family:var(--serif);font-weight:500;font-size:70px;line-height:.82;margin:0 0 30px}
.about-copy p{color:#55524b;max-width:560px}
.sitemap{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.sitemap a{border:1px solid var(--line);padding:24px;min-height:170px;display:flex;flex-direction:column;justify-content:space-between;transition:.3s}
.sitemap a:hover{background:var(--ink);color:var(--paper);transform:translateY(-3px)}
.sitemap span{font-family:var(--mono);font-size:10px}
.sitemap strong{font-family:var(--serif);font-size:31px;font-weight:500}
.lightbox{position:fixed;inset:0;background:rgba(18,18,16,.94);z-index:100;display:none;align-items:center;justify-content:center;padding:5vw}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:82vh;object-fit:contain}
.lightbox .close{position:absolute;top:22px;right:28px;border:0;background:none;color:white;font-size:32px;cursor:pointer}
.lightbox .light-caption{position:absolute;bottom:24px;left:5vw;right:5vw;color:white;font-family:var(--serif);font-size:24px;text-align:center}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:none}
@media(max-width:820px){
  .nav{padding:15px 18px;align-items:flex-start}.nav-links{gap:10px 14px}.logo{max-width:180px}
  main{padding:0 18px}.hero{grid-template-columns:1fr;min-height:auto;padding:80px 0}.hero-note{margin-top:20px}
  .hero h1{font-size:18vw}.mosaic{grid-template-columns:1fr}.mosaic figure:nth-child(2),.mosaic figure:nth-child(3){margin-top:0}
  .mosaic img{height:auto;max-height:none}.section{padding:65px 0}.section-head{display:block}.section-head h2{font-size:48px;margin-bottom:14px}
  .two-col,.page-intro,.about-wrap,.place,.place:nth-child(even){grid-template-columns:1fr;gap:30px}.page-intro{padding:70px 0 50px}
  .page-intro h1{font-size:18vw}.place:nth-child(even) .place-image{order:0}.place-copy h2{font-size:58px}
  .note-grid{grid-template-columns:1fr}.sitemap{grid-template-columns:1fr 1fr}.about-portrait img{height:auto}
  .footer{padding-left:18px;padding-right:18px;display:block}.footer span{display:block;margin-top:8px}
}