:root{
  --paper:#f4f0e9;
  --paper-warm:#efe9df;
  --paper-deep:#e6ddd0;
  --ink:#2a2520;
  --ink-soft:#4a443c;
  --ink-faint:#8a8074;
  --rule:#c9bda9;
  --black-footer:#15120f;
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{ background:var(--paper); color:var(--ink); font-family:'EB Garamond', 'EB Garamond Fallback', Georgia, serif; -webkit-font-smoothing:antialiased; }
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
.display{ font-family:'Cormorant', 'Cormorant Fallback', Georgia, serif; font-weight:400; letter-spacing:0.01em; }
.eyebrow{ font-family:'EB Garamond', 'EB Garamond Fallback', Georgia, serif; font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--ink-soft); }

.progress-bar{ position:fixed; top:0; left:0; height:3px; background:var(--ink); width:0%; z-index:60; pointer-events:none; }

header.site{
  position:sticky; top:0; z-index:55; background:var(--paper);
  box-shadow:0 1px 0 rgba(42,37,32,0.12);
  padding:18px clamp(22px,5vw,56px) 14px;
  display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
}
.logo{ font-family:'Cormorant SC', 'Cormorant SC Fallback', Georgia, serif; font-size:19px; letter-spacing:0.28em; font-weight:500; color:var(--ink); }
.header-actions{ display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.nav-link{ font-family:'EB Garamond', 'EB Garamond Fallback', Georgia, serif; font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:var(--ink); padding:16px 2px 6px; border-bottom:1px solid var(--ink); }

.portfolio-hero{ position:relative; background:linear-gradient(160deg,#f8f4ec,#efe9df); min-height:260px; overflow:hidden; display:flex; align-items:center; }
.portfolio-hero-img{ position:absolute; inset:0; width:100%; height:100%; overflow:hidden; }
.portfolio-hero-img img{ width:100%; height:100%; object-fit:cover; object-position:70% center; filter:saturate(0.82); }
.portfolio-hero-img::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,#f4f0e9 0%,rgba(244,240,234,.9) 26%,rgba(244,240,234,.4) 55%,rgba(244,240,234,.12) 78%,transparent 100%);
}
.portfolio-hero-content{ position:relative; z-index:2; width:100%; max-width:100%; padding:clamp(24px,5vw,45px) clamp(22px,5vw,56px) clamp(14px,2.4vw,23px); display:flex; flex-direction:column; gap:10px; }
.portfolio-hero-content h1{ font-weight:400; font-size:clamp(1.72rem,5.2vw,3.3rem); line-height:1; letter-spacing:0.005em; color:var(--ink); max-width:16ch; }
.portfolio-hero-content p{ font-size:clamp(15px,2.2vw,18px); line-height:1.6; color:var(--ink-soft); max-width:420px; }

.stories{ background:var(--paper); border-top:1px solid var(--rule); }

.featured-story{ display:flex; flex-wrap:wrap; gap:clamp(28px,5vw,64px); align-items:center; padding:clamp(48px,8vw,90px) clamp(22px,5vw,56px); }
.featured-photo{ flex:1 1 420px; position:relative; overflow:hidden; background:var(--paper-deep); aspect-ratio:5/3; opacity:0; transform:translateY(24px); transition:opacity 1s ease, transform 1s ease; }
.featured-photo.is-visible{ opacity:1; transform:translateY(0); }
.featured-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.featured-info{ flex:1 1 360px; display:flex; flex-direction:column; gap:12px; max-width:440px; }
.featured-info h2{ font-weight:400; font-style:italic; font-size:clamp(28px,4vw,38px); color:var(--ink); }
.meta-line{ font-size:14px; letter-spacing:0.05em; color:var(--ink-soft); display:flex; gap:10px; flex-wrap:wrap; }
.featured-info p.teaser{ font-size:16px; line-height:1.7; color:var(--ink-soft); max-width:420px; }
.open-story{ display:inline-block; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:6px; width:fit-content; margin-top:8px; }

.story-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:clamp(32px,5vw,64px) clamp(24px,4vw,48px); padding:clamp(32px,5vw,64px) clamp(22px,5vw,56px); border-top:1px solid var(--rule); }
.story-card{ display:flex; flex-direction:column; gap:16px; opacity:0; transform:translateY(24px); transition:opacity 1s ease, transform 1s ease; }
.story-card.is-visible{ opacity:1; transform:translateY(0); }
.story-card .card-photo{ position:relative; overflow:hidden; background:var(--paper-deep); aspect-ratio:4/3; }
.story-card .card-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.story-card .card-content{ display:flex; flex-direction:column; gap:8px; }
.story-card h2{ font-weight:400; font-style:italic; font-size:clamp(24px,3vw,30px); color:var(--ink); }
.story-card .meta-line{ color:var(--ink-soft); }
.story-card p.teaser{ font-size:14.5px; line-height:1.6; color:var(--ink-soft); }
.story-card .open-story{ color:var(--ink); border-bottom:1px solid var(--ink); }

@media (min-width:900px){
  .portfolio-hero{ min-height:320px; }
  .portfolio-hero-img::after{ background:linear-gradient(100deg,#f4f0e9 0%,rgba(244,240,234,.94) 22%,rgba(244,240,234,.55) 42%,rgba(244,240,234,.12) 62%,transparent 82%); }
  .portfolio-hero-content{ max-width:46%; }
}

.cta{ position:relative; min-height:300px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.cta img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 35%; z-index:0; }
.cta::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(15,10,8,0.55), rgba(15,10,8,0.68)); z-index:1; }
.cta-content{ position:relative; z-index:2; text-align:center; color:#f4f0e9; transition:opacity 0.25s ease; }
.cta-content:hover{ opacity:0.82; }
.cta-content:hover .underline{ width:130px; }
.cta-content .pre{ font-family:'Cormorant', 'Cormorant Fallback', Georgia, serif; font-style:italic; font-size:21px; margin-bottom:10px; }
.cta-content h2{ font-family:'Cormorant', 'Cormorant Fallback', Georgia, serif; font-weight:400; font-size:clamp(2rem,7vw,3rem); letter-spacing:0.06em; }
.cta-content .underline{ width:90px; height:1px; background:rgba(244,240,234,0.6); margin:18px auto 0; transition:width 0.25s ease; }

footer.site{ background:var(--black-footer); color:#cfc7ba; padding:32px 22px; display:flex; flex-direction:column; gap:18px; align-items:flex-start; }
.footer-logo{ font-family:'Cormorant SC', 'Cormorant SC Fallback', Georgia, serif; font-size:15px; letter-spacing:0.24em; color:#f0ece3; margin-bottom:10px; }
.footer-meta{ font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:#8d847a; line-height:1.8; }
.footer-ig{ font-family:'Cormorant', 'Cormorant Fallback', Georgia, serif; font-style:italic; font-size:18px; display:inline-flex; align-items:center; gap:10px; color:#f0ece3; padding:6px 0; }

@media (min-width:900px){
  .cta-content h2{ font-size:50px; }
  footer.site{ flex-direction:row; justify-content:space-between; gap:0; align-items:center; padding:38px 56px; }
  .footer-meta{ font-size:10.5px; }
}