/* ---------- Tokens ---------- */
  :root{
    --ink:#0e1116;
    --ink-soft:#161b22;
    --ink-soft-2:#1c222b;
    --ink-line:#2a323d;
    --paper:#f2ede3;
    --paper-dim:#b9b2a6;
    --paper-faint:#7c766c;
    --clay:#d0894f;
    --clay-soft:#e8b382;
    --teal:#4f8f8a;
    --teal-soft:#8fc0bb;
    --shadow: 0 30px 80px -20px rgba(0,0,0,.6);
    --wrap: 1240px;
    --serif: "Fraunces", "Iowan Old Style", Georgia, serif;
    --sans: "Work Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
    --mono: "IBM Plex Mono", "SFMono-Regular", Menlo, monospace;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
  }

  body{
    margin:0;
    background:var(--ink);
    color:var(--paper);
    font-family:var(--sans);
    font-size:16px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  img{max-width:100%; display:block;}
  a{color:inherit;}

  ::selection{background:var(--clay); color:var(--ink);}

  .wrap{max-width:var(--wrap); margin:0 auto; padding:0 clamp(20px,4vw,56px);}

  h1,h2,h3{font-family:var(--serif); font-weight:600; margin:0; text-wrap:balance;}

  .eyebrow{
    font-family:var(--mono);
    font-size:.72rem;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:var(--clay-soft);
  }

  .btn{
    display:inline-flex; align-items:center; gap:.5em;
    font-family:var(--mono);
    font-size:.78rem;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-decoration:none;
    padding:.95em 1.6em;
    border-radius:2px;
    border:1px solid transparent;
    cursor:pointer;
    transition:transform .35s cubic-bezier(.16,1,.3,1), background .3s ease, border-color .3s ease, color .3s ease;
  }
  .btn:hover{transform:translateY(-2px);}
  .btn:focus-visible{outline:2px solid var(--clay-soft); outline-offset:3px;}
  .btn-solid{background:var(--clay); color:var(--ink); border-color:var(--clay);}
  .btn-solid:hover{background:var(--clay-soft); border-color:var(--clay-soft);}
  .btn-ghost{background:transparent; color:var(--paper); border-color:rgba(242,237,227,.35);}
  .btn-ghost:hover{border-color:var(--paper); background:rgba(242,237,227,.06);}

  /* ---------- Progress + Header ---------- */
  #progress{
    position:fixed; top:0; left:0; height:2px; width:0%;
    background:linear-gradient(90deg,var(--clay),var(--teal));
    z-index:200; transition:width .12s linear;
  }

  header{
    position:fixed; top:0; left:0; right:0; z-index:190;
    padding:20px 0;
    background:linear-gradient(to bottom, rgba(14,17,22,.85), rgba(14,17,22,0));
    transition:background .4s ease, padding .4s ease, border-color .4s ease;
    border-bottom:1px solid transparent;
  }
  header.solid{
    background:rgba(14,17,22,.92);
    backdrop-filter:blur(10px);
    padding:14px 0;
    border-bottom-color:var(--ink-line);
  }
  header .row{display:flex; align-items:center; justify-content:space-between; gap:24px;}
  .wordmark{
    font-family:var(--serif); font-size:1.32rem; letter-spacing:.01em;
    text-decoration:none; color:var(--paper); display:flex; flex-direction:column; line-height:1.05;
  }
  .wordmark small{
    font-family:var(--mono); font-size:.6rem; letter-spacing:.28em; color:var(--paper-faint); margin-top:4px;
  }
  nav{display:flex; gap:clamp(18px,3vw,40px); align-items:center;}
  nav a{
    font-family:var(--mono); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase;
    text-decoration:none; color:var(--paper-dim); position:relative; padding-bottom:4px;
  }
  nav a::after{
    content:""; position:absolute; left:0; right:100%; bottom:0; height:1px; background:var(--clay-soft);
    transition:right .35s cubic-bezier(.16,1,.3,1);
  }
  nav a:hover{color:var(--paper);}
  nav a:hover::after{right:0;}
  .nav-toggle{display:none;}

  /* ---------- Hero ---------- */
  .hero{
    position:relative; min-height:100svh; display:flex; align-items:flex-end;
    overflow:hidden; isolation:isolate;
  }
  .hero__media{position:absolute; inset:0; z-index:-2;}
  .hero__media img{width:100%; height:100%; object-fit:cover; object-position:50% 42%;}
  .hero__media::after{
    content:""; position:absolute; inset:0;
    background:
      linear-gradient(to top, rgba(9,11,14,.96) 2%, rgba(9,11,14,.35) 42%, rgba(9,11,14,.15) 62%, rgba(9,11,14,.55) 100%),
      linear-gradient(to right, rgba(9,11,14,.35), rgba(9,11,14,0) 45%);
  }
  .grain{position:absolute; inset:0; z-index:-1; opacity:.05; mix-blend-mode:overlay; pointer-events:none;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

  .hero__content{position:relative; padding:0 0 clamp(56px,9vw,110px); width:100%;}
  .hero__content .wrap{display:flex; flex-direction:column; gap:22px; max-width:920px;}
  .hero h1{
    font-size:clamp(2.6rem, 6.4vw, 5.4rem);
    font-weight:560;
    color:var(--paper);
    letter-spacing:-.01em;
  }
  .hero h1 em{font-style:italic; color:var(--clay-soft);}
  .hero__tagline{
    font-family:var(--serif); font-style:italic; font-size:clamp(1.05rem,1.6vw,1.3rem);
    color:var(--paper-dim); letter-spacing:.02em;
  }
  .hero__cta{display:flex; gap:16px; flex-wrap:wrap; margin-top:8px;}

  .scrollcue{
    position:absolute; right:clamp(20px,4vw,56px); bottom:38px; z-index:2;
    display:flex; flex-direction:column; align-items:center; gap:10px;
    font-family:var(--mono); font-size:.66rem; letter-spacing:.22em; color:var(--paper-faint);
    writing-mode:vertical-rl;
  }
  .scrollcue .line{width:1px; height:52px; background:linear-gradient(var(--paper-faint), transparent); writing-mode:horizontal-tb;}

  /* ---------- Section shell ---------- */
  section{position:relative;}
  .section-pad{padding:clamp(72px,11vw,132px) 0;}
  .section-head{
    display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap;
    margin-bottom:clamp(36px,6vw,64px);
  }
  .section-head h2{font-size:clamp(2rem,4vw,3.1rem);}
  .section-head .eyebrow{margin-bottom:14px; display:block;}

  .reveal{opacity:0; transform:translateY(28px); transition:opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1);}
  .reveal.is-visible{opacity:1; transform:none;}

  /* ---------- Intro strip ---------- */
  .intro{border-top:1px solid var(--ink-line); border-bottom:1px solid var(--ink-line);}
  .intro .wrap{padding:clamp(40px,6vw,64px) 0; display:grid; grid-template-columns:auto 1fr; gap:clamp(24px,5vw,64px); align-items:center;}
  .intro__mark{font-family:var(--mono); font-size:.72rem; letter-spacing:.18em; color:var(--paper-faint); white-space:nowrap;}
  .intro p{
    font-family:var(--serif); font-size:clamp(1.2rem,2.4vw,1.7rem); font-weight:400; color:var(--paper);
    max-width:44ch; margin:0; text-wrap:balance;
  }

  /* ---------- Gallery ---------- */
  .filters{display:flex; gap:10px; flex-wrap:wrap;}
  .filter{
    font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase;
    background:transparent; border:1px solid var(--ink-line); color:var(--paper-dim);
    padding:.7em 1.2em; border-radius:2px; cursor:pointer; transition:all .3s ease;
  }
  .filter:hover{border-color:var(--paper-faint); color:var(--paper);}
  .filter.active{background:var(--paper); color:var(--ink); border-color:var(--paper);}

  .chapter{margin-top:clamp(48px,7vw,84px);}
  .chapter__head{display:flex; align-items:baseline; gap:18px; margin-bottom:22px; flex-wrap:wrap;}
  .chapter__num{font-family:var(--mono); color:var(--teal-soft); font-size:.82rem; letter-spacing:.12em;}
  .chapter__title{font-family:var(--serif); font-size:clamp(1.4rem,2.6vw,2rem); color:var(--paper);}
  .chapter__coords{font-family:var(--mono); font-size:.72rem; color:var(--paper-faint); letter-spacing:.06em; margin-left:auto;}

  .grid{display:grid; grid-template-columns:repeat(6,1fr); gap:14px;}
  .cell{position:relative; overflow:hidden; cursor:zoom-in; border-radius:2px; background:var(--ink-soft);}
  .cell img{width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.16,1,.3,1), filter .6s ease;}
  .cell::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(to top, rgba(9,11,14,.92), rgba(9,11,14,0) 55%);
    opacity:0; transition:opacity .45s ease;
  }
  .cell:hover img{transform:scale(1.06);}
  .cell:hover::after{opacity:1;}
  .cell:focus-visible{outline:2px solid var(--clay-soft); outline-offset:2px;}
  .cell__cap{
    position:absolute; left:14px; right:14px; bottom:12px; z-index:2;
    transform:translateY(10px); opacity:0; transition:transform .45s cubic-bezier(.16,1,.3,1), opacity .45s ease;
  }
  .cell:hover .cell__cap{transform:translateY(0); opacity:1;}
  .cell__cap .t{font-family:var(--serif); font-size:1rem; color:var(--paper);}
  .cell__cap .c{font-family:var(--mono); font-size:.64rem; letter-spacing:.08em; color:var(--teal-soft); text-transform:uppercase;}

  .s-w2{grid-column:span 2;} .s-w3{grid-column:span 3;} .s-w4{grid-column:span 4;}
  .s-h2{grid-row:span 2;}
  .ar-tall{aspect-ratio:3/4;} .ar-wide{aspect-ratio:16/9;} .ar-sq{aspect-ratio:1/1;}

  @media (max-width:980px){
    .grid{grid-template-columns:repeat(2,1fr);}
    .s-w2,.s-w3,.s-w4{grid-column:span 2;}
    .s-h2{grid-row:span 1;}
    .ar-tall{aspect-ratio:4/3;}
  }

  /* ---------- About ---------- */
  .about{background:var(--ink-soft); border-top:1px solid var(--ink-line); border-bottom:1px solid var(--ink-line);}
  .about__grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(40px,6vw,90px);}
  .about__intro h2{font-size:clamp(2.1rem,4.4vw,3.3rem); margin-bottom:22px;}
  .about__intro p{color:var(--paper-dim); font-size:1.06rem; max-width:42ch;}
  .about__intro .sig{font-family:var(--serif); font-style:italic; color:var(--clay-soft); font-size:1.25rem; margin-top:28px;}

  .values{display:flex; flex-direction:column;}
  .value{
    display:grid; grid-template-columns:60px 1fr; gap:20px;
    padding:22px 0; border-top:1px solid var(--ink-line);
  }
  .value:last-child{border-bottom:1px solid var(--ink-line);}
  .value__num{font-family:var(--mono); color:var(--teal-soft); font-size:.85rem; padding-top:3px;}
  .value h3{font-family:var(--sans); font-weight:600; font-size:1.05rem; color:var(--paper); margin-bottom:6px; letter-spacing:.01em;}
  .value p{margin:0; color:var(--paper-dim); font-size:.96rem; max-width:52ch;}

  /* ---------- Contact ---------- */
  .contact{position:relative; isolation:isolate; overflow:hidden;}
  .contact__media{position:absolute; inset:0; z-index:-2;}
  .contact__media img{width:100%; height:100%; object-fit:cover;}
  .contact__media::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(9,11,14,.88), rgba(9,11,14,.72) 45%, rgba(9,11,14,.94));}
  .contact .wrap{display:flex; justify-content:center;}
  .contact__card{
    max-width:560px; width:100%; text-align:center;
    padding:clamp(40px,6vw,64px) clamp(28px,5vw,56px);
    border:1px solid rgba(242,237,227,.18);
    background:rgba(14,17,22,.35); backdrop-filter:blur(6px);
    border-radius:2px;
  }
  .contact__card .eyebrow{justify-content:center; display:block; margin-bottom:16px;}
  .contact__card h2{font-size:clamp(2rem,4.4vw,2.8rem); margin-bottom:14px;}
  .contact__card > p{color:var(--paper-dim); margin:0 0 30px;}
  .contact__email{
    font-family:var(--serif); font-size:clamp(1.3rem,2.6vw,1.7rem); color:var(--clay-soft);
    text-decoration:none; border-bottom:1px solid rgba(208,137,79,.4); padding-bottom:3px;
  }
  .contact__email:hover{border-color:var(--clay-soft);}
  .social{display:flex; justify-content:center; gap:26px; margin-top:34px;}
  .social a{
    font-family:var(--mono); font-size:.74rem; letter-spacing:.1em; text-transform:uppercase;
    text-decoration:none; color:var(--paper-dim); border-bottom:1px solid transparent; padding-bottom:3px;
    transition:color .3s ease, border-color .3s ease;
  }
  .social a:hover{color:var(--paper); border-color:var(--paper-faint);}
  .geo{margin-top:30px; font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; color:var(--paper-faint);}

  footer{padding:26px 0; border-top:1px solid var(--ink-line);}
  footer .wrap{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;}
  footer p{margin:0; font-family:var(--mono); font-size:.7rem; letter-spacing:.06em; color:var(--paper-faint);}

  /* ---------- Lightbox ---------- */
  .lightbox{
    position:fixed; inset:0; z-index:300; background:rgba(9,11,14,.97);
    display:flex; align-items:center; justify-content:center; padding:48px;
    opacity:0; pointer-events:none; transition:opacity .35s ease;
  }
  .lightbox.open{opacity:1; pointer-events:auto;}
  .lightbox__inner{max-width:1100px; width:100%; text-align:center;}
  .lightbox img{max-height:76vh; margin:0 auto; width:auto; max-width:100%; box-shadow:var(--shadow);}
  .lightbox__cap{margin-top:18px; font-family:var(--serif); color:var(--paper); font-size:1.1rem;}
  .lightbox__loc{font-family:var(--mono); font-size:.68rem; letter-spacing:.12em; color:var(--teal-soft); text-transform:uppercase; margin-top:6px;}
  .lightbox__close, .lightbox__nav{
    position:absolute; background:transparent; border:1px solid rgba(242,237,227,.25); color:var(--paper);
    cursor:pointer; font-family:var(--mono); font-size:.9rem; border-radius:50%; width:46px; height:46px;
    display:flex; align-items:center; justify-content:center; transition:border-color .3s ease, background .3s ease;
  }
  .lightbox__close:hover, .lightbox__nav:hover{border-color:var(--paper); background:rgba(242,237,227,.08);}
  .lightbox__close{top:26px; right:clamp(20px,4vw,56px);}
  .lightbox__prev{left:clamp(12px,3vw,40px); top:50%; transform:translateY(-50%);}
  .lightbox__next{right:clamp(12px,3vw,40px); top:50%; transform:translateY(-50%);}

  @media (max-width:760px){
    nav{position:fixed; inset:0 0 0 auto; width:min(78vw,320px); background:var(--ink-soft);
      flex-direction:column; align-items:flex-start; padding:100px 32px 32px; gap:26px;
      transform:translateX(100%); transition:transform .45s cubic-bezier(.16,1,.3,1); border-left:1px solid var(--ink-line);}
    nav.open{transform:translateX(0);}
    nav a{font-size:.9rem;}
    .nav-toggle{
      display:flex; z-index:210; position:relative; width:36px; height:24px; flex-direction:column; justify-content:space-between;
      background:none; border:none; padding:0; cursor:pointer;
    }
    .nav-toggle span{display:block; height:1px; background:var(--paper); width:100%; transition:transform .3s ease, opacity .3s ease;}
    .nav-toggle.open span:nth-child(1){transform:translateY(9px) rotate(45deg);}
    .nav-toggle.open span:nth-child(2){opacity:0;}
    .nav-toggle.open span:nth-child(3){transform:translateY(-9px) rotate(-45deg);}
    .about__grid{grid-template-columns:1fr;}
    .intro .wrap{grid-template-columns:1fr;}
    .lightbox{padding:20px;}
    .lightbox__prev, .lightbox__next{width:40px; height:40px;}
  }