:root{
    --ink:#0B0D10;
    --ink-2:#12171B;
    --ink-3:#181F24;
    --gravel:#4A4E54;
    --gravel-light:#8A8F97;
    --lake:#1B3B3F;
    --lake-bright:#7FB0B5;
    --brass:#B08A55;
    --brass-dim:#8A6E45;
    --paper:#ECE8DF;
    --paper-dim:#A7A29A;
    --rule: rgba(236,232,223,0.12);
    --rail-w: 84px;
  }

  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--ink);
    color:var(--paper);
    font-family:'Archivo', sans-serif;
    line-height:1.65;
    overflow-x:hidden;
  }
  ::selection{ background:var(--brass); color:var(--ink); }
  h1,h2,h3{ font-family:'Bodoni Moda', serif; font-weight:500; }
  a{ color:inherit; text-decoration:none; }

  .mono{
    font-family:'Space Mono', monospace;
    text-transform:uppercase;
    letter-spacing:0.12em;
    font-size:0.68rem;
  }

  /* ---------- side rail ---------- */
  .rail{
    position:fixed; top:0; left:0; bottom:0; width:var(--rail-w);
    border-right:1px solid var(--rule);
    display:flex; flex-direction:column; align-items:center; justify-content:space-between;
    padding:28px 0; z-index:20; background:var(--ink);
  }
  .rail .rail-mark{
    writing-mode:vertical-rl; transform:rotate(180deg);
    font-family:'Bodoni Moda', serif; font-size:1rem; letter-spacing:0.06em;
    color:var(--paper);
  }
  .rail .rail-mark b{ color:var(--brass); font-weight:500; }
  .rail-nav{ display:flex; flex-direction:column; gap:26px; align-items:center; }
  .rail-nav a{
    writing-mode:vertical-rl; color:var(--gravel-light); font-family:'Space Mono',monospace;
    font-size:0.64rem; letter-spacing:0.12em; text-transform:uppercase; transition:color .25s;
  }
  .rail-nav a:hover{ color:var(--lake-bright); }
  .rail-foot{ writing-mode:vertical-rl; color:var(--gravel); font-family:'Space Mono',monospace; font-size:0.6rem; letter-spacing:0.1em; }
  @media (max-width:760px){
    .rail{
      width:100%; height:auto; position:fixed; top:0; bottom:auto; flex-direction:row;
      padding:14px 20px; justify-content:space-between; border-right:none; border-bottom:1px solid var(--rule);
    }
    .rail .rail-mark, .rail-nav a, .rail-foot{ writing-mode:horizontal-tb; transform:none; }
    .rail-nav{ flex-direction:row; gap:16px; }
    .rail-foot{ display:none; }
  }

  main{ margin-left:var(--rail-w); position:relative; z-index:1; }
  @media (max-width:760px){ main{ margin-left:0; margin-top:56px; } }

  .wrap{ max-width:900px; padding:0 48px; }
  @media (max-width:760px){ .wrap{ padding:0 24px; } }

  /* ---------- hero ---------- */
  .hero{ position:relative; min-height:72vh; display:flex; align-items:flex-end; padding-bottom:90px; }
  .hero-inner{ position:relative; z-index:1; padding-top:60px; }
  .hero .mono{ color:var(--brass); display:block; margin-bottom:26px; }
  .hero h1{
    font-style:normal; font-weight:500;
    font-size:clamp(2.6rem, 8vw, 5.6rem); line-height:1.04; max-width:13ch;
  }
  .hero h1 em{ font-style:italic; font-weight:400; color:var(--lake-bright); }
  .hero p{ margin-top:32px; max-width:44ch; color:var(--paper-dim); font-size:1.02rem; }

  /* ---------- section scaffold ---------- */
  section{ padding:118px 0; border-top:1px solid var(--rule); }

  /* ---------- about ---------- */
  .about p{ max-width:60ch; color:var(--paper-dim); font-size:1.05rem; }
  .about p + p{ margin-top:16px; }
  .about h2{ font-weight:500; font-size:clamp(1.7rem,3.4vw,2.3rem); max-width:18ch; margin-bottom:28px; font-style:italic; }
  .stat-row{ display:flex; flex-wrap:wrap; gap:0; margin-top:54px; border-top:1px solid var(--rule); }
  .stat{ flex:1 1 180px; padding:22px 26px 0 0; border-right:1px solid var(--rule); }
  .stat:last-child{ border-right:none; }
  .stat .num{ font-family:'Bodoni Moda', serif; font-size:1.7rem; display:block; margin-bottom:4px; }
  .stat .lbl{ color:var(--gravel-light); }

  /* ---------- founder ---------- */
  .founder-layout{ display:grid; grid-template-columns:1fr; gap:44px; }
  .founder-portrait{
    width:220px; aspect-ratio:3/4;
    background:linear-gradient(155deg, var(--ink-3), var(--ink-2));
    border:1px solid var(--rule);
    clip-path: polygon(0 0, 100% 0, 100% 88%, 82% 100%, 0 100%);
    float:right; margin:0 0 20px 34px;
    position:relative; overflow:hidden;
  }
  .founder-portrait img{
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; object-position:50% 22%;
    filter:grayscale(1) contrast(1.08);
  }
  .founder-portrait::after{
    content:""; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(11,13,16,0.05) 0%, rgba(11,13,16,0.05) 45%, rgba(11,13,16,0.92) 100%);
  }
  .founder-portrait .cap{ position:relative; z-index:1; padding:18px; display:flex; flex-direction:column; justify-content:flex-end; height:100%; }
  .founder-portrait .mono{ color:var(--lake-bright); margin:0; }
  .founder-portrait .mono.role{ color:var(--gravel-light); margin-top:4px; }
  .founder h2{ font-weight:500; font-style:italic; font-size:clamp(1.7rem,3.4vw,2.3rem); margin-bottom:22px; }
  .founder p{ color:var(--paper-dim); max-width:64ch; }
  .founder p + p{ margin-top:16px; }
  /* ---------- slate ---------- */
  .slate-list{ }
  .slate-row{
    display:grid; grid-template-columns:64px 1fr auto; gap:24px; align-items:start;
    padding:36px 0; border-top:1px solid var(--rule);
  }
  .slate-row:last-child{ border-bottom:1px solid var(--rule); }
  .slate-row .numeral{ font-family:'Bodoni Moda', serif; font-style:italic; font-size:1.6rem; color:var(--brass); }
  .slate-row h3{ font-weight:500; font-size:clamp(1.3rem,2.4vw,1.8rem); margin-bottom:8px; }
  .slate-row p{ color:var(--paper-dim); font-size:0.95rem; max-width:56ch; }
  .slate-row .meta{ margin-top:10px; display:flex; flex-wrap:wrap; gap:4px 16px; }
  .slate-row .meta span{ font-family:'Space Mono', monospace; font-size:0.65rem; letter-spacing:0.08em; color:var(--gravel-light); text-transform:uppercase; }
  .status{
    justify-self:end; padding:5px 10px; border:1px solid var(--brass-dim); color:var(--brass);
    font-family:'Space Mono', monospace; font-size:0.6rem; letter-spacing:0.1em; text-transform:uppercase; white-space:nowrap;
  }
  .status.dev{ color:var(--lake-bright); border-color:var(--lake-bright); }
  @media (max-width:640px){
    .slate-row{ grid-template-columns:40px 1fr; }
    .status{ grid-column:1 / -1; justify-self:start; margin-top:6px; }
  }

  /* ---------- press ---------- */
  .press{ display:flex; gap:26px; }
  .press .rule{ width:2px; background:var(--brass-dim); flex-shrink:0; }
  .press blockquote{
    font-family:'Bodoni Moda', serif; font-style:italic; font-weight:400;
    font-size:clamp(1.5rem,3.2vw,2.2rem); line-height:1.42; max-width:26ch; color:var(--paper);
  }
  .press .attrib{ margin-top:20px; color:var(--gravel-light); }
  .press .attrib b{ color:var(--brass); font-weight:400; }

  /* ---------- contact ---------- */
  .contact h2{ font-weight:500; font-style:italic; font-size:clamp(2rem,5.5vw,3.2rem); max-width:15ch; margin-bottom:44px; }
  .contact-item{ padding:20px 0; border-top:1px solid var(--rule); }
  .contact-item:last-of-type{ border-bottom:1px solid var(--rule); }
  .contact-item .mono{ color:var(--brass); margin-bottom:8px; display:block; }
  .contact-item a.big{ font-family:'Bodoni Moda', serif; font-size:1.4rem; transition:color .2s; }
  .contact-item a.big:hover{ color:var(--lake-bright); }

  footer{
    padding:32px 48px; color:var(--gravel-light); font-family:'Space Mono', monospace; font-size:0.64rem;
    letter-spacing:0.06em; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px;
  }

/* ---------- project page additions ---------- */
.breadcrumb{ padding-top:150px; }
.breadcrumb a{ color:var(--gravel-light); transition:color .2s; }
.breadcrumb a:hover{ color:var(--lake-bright); }

.project-hero{ padding-top:20px; padding-bottom:70px; border-top:none; }
.project-hero .mono.eyebrow{ color:var(--brass); display:block; margin-bottom:22px; }
.project-hero h1{
  font-weight:500; font-size:clamp(2.4rem, 6vw, 4.4rem); line-height:1.04; max-width:16ch;
}
.project-hero .logline{
  margin-top:28px; font-family:'Bodoni Moda', serif; font-style:italic; font-weight:400;
  font-size:clamp(1.3rem,2.4vw,1.7rem); color:var(--paper-dim); max-width:38ch; line-height:1.4;
}

.fact-row{ display:flex; flex-wrap:wrap; margin-top:50px; border-top:1px solid var(--rule); }
.fact{ flex:1 1 200px; padding:20px 26px 0 0; border-right:1px solid var(--rule); }
.fact:last-child{ border-right:none; }
.fact .k{ color:var(--brass); display:block; margin-bottom:6px; }
.fact .v{ color:var(--paper); font-size:0.92rem; line-height:1.5; }

.synopsis p{ max-width:64ch; color:var(--paper-dim); font-size:1.05rem; }
.synopsis p + p{ margin-top:16px; }

/* materials request form */
.request-form{ max-width:560px; }
.field{ margin-bottom:20px; }
.field label{ display:block; margin-bottom:8px; color:var(--brass); }
.field input[type="text"],
.field input[type="email"]{
  width:100%; background:transparent; border:none; border-bottom:1px solid var(--rule);
  color:var(--paper); font-family:'Archivo', sans-serif; font-size:0.98rem; padding:10px 2px;
  transition:border-color .2s;
}
.field input[type="text"]:focus,
.field input[type="email"]:focus{ outline:none; border-color:var(--lake-bright); }
.field input::placeholder{ color:var(--gravel); }

.check-group{ display:flex; flex-wrap:wrap; gap:10px 26px; }
.check-item{ display:flex; align-items:center; gap:8px; }
.check-item input[type="checkbox"]{
  appearance:none; width:15px; height:15px; border:1px solid var(--gravel-light);
  background:transparent; cursor:pointer; position:relative; flex-shrink:0;
}
.check-item input[type="checkbox"]:checked{ background:var(--brass); border-color:var(--brass); }
.check-item label{ color:var(--paper-dim); font-size:0.92rem; cursor:pointer; }

.submit-btn{
  margin-top:8px; background:transparent; border:1px solid var(--brass); color:var(--brass);
  font-family:'Space Mono', monospace; font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase;
  padding:14px 28px; cursor:pointer; transition:background .2s, color .2s;
}
.submit-btn:hover{ background:var(--brass); color:var(--ink); }

.form-note{ margin-top:16px; color:var(--gravel-light); font-size:0.8rem; }
.slate-row h3 a{ color:inherit; border-bottom:1px solid transparent; transition:border-color .2s, color .2s; }
.slate-row h3 a:hover{ color:var(--lake-bright); border-color:var(--lake-bright); }

/* ---------- spacing adjustments ---------- */
section.press-section{ padding:150px 0; }
.press blockquote{ margin:6px 0; }
#about{ padding-top:150px; }
#founder{ padding-top:170px; }
#slate{ padding-top:170px; }