:root{
    --bg:#FAFAF8;
    --ink:#1C1B19;
    --ink-soft:#5B584F;
    --hairline:#E4E1D8;
    --olive:#6B7156;
    --clay:#A67F5D;
    --card:#F2F0E8;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Inter', sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit; text-decoration:none;}

  /* ---------- NAV ---------- */
  nav{
    position:sticky; top:0; z-index:10;
    display:flex; justify-content:space-between; align-items:center;
    padding:0.7rem 2.8vw;
    background:rgba(250,250,248,0.9);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--hairline);
  }
  .logo{
    font-family:'Fraunces', serif;
    font-size:0.9rem;
    letter-spacing:0.01em;
  }
  .nav-links{display:flex; gap:1.2rem; font-size:0.68rem; color:var(--ink-soft);}
  .nav-links a:hover{color:var(--ink);}

/* ---------- HERO ---------- */
  .hero{
    position:relative;
    height:52vh;
    min-height:320px;
    max-height:580px;
    overflow:hidden;
    border-bottom:1px solid var(--hairline);
  }
  .hero-img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:50% 57%;
    filter:saturate(0.9) contrast(1.08);
  }
  .hero::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg, rgba(17,15,12,0.34) 0%, rgba(17,15,12,0.14) 32%, rgba(17,15,12,0.16) 100%);
  }
  .hero-text{
    position:absolute;
    top:clamp(0.7rem, 1.2vw, 1.2rem);
    left:clamp(0.7rem, 1.2vw, 1.2rem);
    z-index:1;
    width:min(18rem, 30vw);
    text-align:left;
    color:#fff;
    text-shadow:0 2px 18px rgba(0,0,0,0.35);
  }
  .hero-eyebrow{
    font-family:'JetBrains Mono', monospace;
    font-size:0.54rem;
    letter-spacing:0.08em;
    color:rgba(255,255,255,0.93);
    margin-bottom:0.7rem;
    text-transform:lowercase;
  }
  .hero-text h1{
    font-family:'Fraunces', serif;
    font-weight:400;
    font-size:clamp(1.45rem, 2vw, 2.7rem);
    line-height:1.04;
    letter-spacing:-0.02em;
    color:#fff;
  }
  .hero-text h1 em{
    font-style:italic;
    color:#f4d7b8;
  }

  /* ---------- PRESS ---------- */
  .press{
    text-align:center;
    padding:2rem 2.8vw;
    border-bottom:1px solid var(--hairline);
  }
  .press .eyebrow{
    font-family:'JetBrains Mono', monospace;
    font-size:0.54rem;
    letter-spacing:0.16em;
    text-transform:uppercase;
    color:var(--ink-soft);
    margin-bottom:0.7rem;
  }
  .press-mark{
    font-family:'Fraunces', serif;
    font-style:italic;
    font-size:1.5rem;
    letter-spacing:0.03em;
    color:var(--clay);
    margin-bottom:0.7rem;
  }
  .press-link{
    display:inline-block;
    font-size:0.72rem;
    color:var(--ink-soft);
    border-bottom:1px solid var(--hairline);
    padding-bottom:2px;
    transition:color 0.25s ease, border-color 0.25s ease;
  }
  .press-link:hover{color:var(--ink); border-color:var(--ink-soft);}

  /* ---------- WORK / MASONRY GRID ---------- */
  .work{
    padding:2.4rem 2.8vw 1.3rem;
    border-bottom:1px solid var(--hairline);
  }
  .work:last-of-type{border-bottom:none;}
  .section-head{
    display:flex; justify-content:space-between; align-items:baseline;
    margin-bottom:1rem;
    border-bottom:1px solid var(--hairline);
    padding-bottom:0.5rem;
  }
  .section-head h2{
    font-family:'Fraunces', serif;
    font-weight:400;
    font-size:1.05rem;
  }
  .section-head span{
    font-family:'JetBrains Mono', monospace;
    font-size:0.7rem;
    color:var(--ink-soft);
  }
  .grid{
    column-count:4;
    column-gap:2px;
  }
  .tile{
    display:inline-block;
    width:100%;
    margin:0 0 2px;
    border-radius:0;
    overflow:hidden;
    background:#eae3d8;
    break-inside:avoid;
  }
  .tile img{
    display:block;
    width:100%;
    height:auto;
    object-fit:contain;
    object-position:center;
    background:#f2efe9;
  }
  .tile-img{
    width:100%; height:auto;
    display:block;
  }
  .tile-meta{
    display:none;
  }

  @media (max-width: 980px){
    .grid{column-count:2;}
  }

  @media (max-width: 640px){
    .grid{column-count:2; column-gap:3px;}
    .tile{margin:0 0 3px;}
  }

  /* ---------- ABOUT ---------- */
  .about{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1.8rem;
    padding:3rem 2.8vw;
    border-top:1px solid var(--hairline);
    align-items:start;
  }
  .about h2{
    font-family:'Fraunces', serif;
    font-weight:400;
    font-size:1.45rem;
    margin-bottom:0.8rem;
  }
  .about p{
    color:var(--ink-soft);
    line-height:1.6;
    font-size:0.82rem;
    max-width:48ch;
  }
  .about-stats{
    display:flex; flex-direction:column; gap:0.8rem;
    border-left:1px solid var(--hairline);
    padding-left:1.2rem;
  }
  .about-stats .row{display:flex; justify-content:space-between; font-size:0.74rem;}
  .about-stats .row span:first-child{color:var(--ink-soft); font-family:'JetBrains Mono', monospace; font-size:0.62rem;}

  /* ---------- FOOTER ---------- */
  footer{
    display:flex; justify-content:space-between; align-items:center;
    padding:1rem 2.8vw 1.5rem;
    border-top:1px solid var(--hairline);
    font-size:0.66rem;
    color:var(--ink-soft);
  }
  footer .contact-links{display:flex; gap:0.8rem;}
  footer a:hover{color:var(--ink);}

  @media (max-width:800px){
    .hero{height:60vh;}
    .grid{grid-template-columns:repeat(2,1fr);}
    .tile:nth-child(n){grid-column:span 1 !important;}
    .about{grid-template-columns:1fr; gap:2rem;}
    .about-stats{border-left:none; border-top:1px solid var(--hairline); padding-left:0; padding-top:1.5rem;}
    footer{flex-direction:column; gap:1rem; text-align:center;}
  }