/* Instrument Serif — self-hosted via Fontsource 5.2.8 */
/* instrument-serif-latin-ext-400-normal */
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/instrument-serif-latin-ext-400-normal.woff2) format('woff2'), url(../fonts/instrument-serif-latin-ext-400-normal.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* instrument-serif-latin-400-normal */
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/instrument-serif-latin-400-normal.woff2) format('woff2'), url(../fonts/instrument-serif-latin-400-normal.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

/* instrument-serif-latin-ext-400-italic */
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/instrument-serif-latin-ext-400-italic.woff2) format('woff2'), url(../fonts/instrument-serif-latin-ext-400-italic.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* instrument-serif-latin-400-italic */
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-display: swap;
  font-weight: 400;
  src: url(../fonts/instrument-serif-latin-400-italic.woff2) format('woff2'), url(../fonts/instrument-serif-latin-400-italic.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
    --bg:#0a0908;
    --bg-soft:#100e0c;
    --accent:#ff6a13;
    --accent-bright:#ff8a45;
    --ink:#eceae4;
    --body:#bdbbb4;
    --muted:#6d6862;
    --line:rgba(255,255,255,.08);
    --serif:"Instrument Serif",Georgia,serif;
    --sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    background:var(--bg);
    color:var(--body);
    font-family:var(--sans);
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
    overflow-x:hidden;
    line-height:1.6;
  }
  .wrap{max-width:1360px;margin:0 auto;padding:0 clamp(1.4rem,4vw,4.5rem)}

  /* ---------- eyebrow label ---------- */
  .eyebrow{
    display:flex;align-items:center;gap:.9rem;
    font-family:var(--mono);font-weight:500;font-size:.72rem;
    letter-spacing:.22em;text-transform:uppercase;color:var(--accent);
    margin-bottom:1.6rem;
  }
  .eyebrow::before{content:"";width:38px;height:1px;background:var(--accent);flex:none}
  .label{
    font-family:var(--mono);font-weight:400;font-size:.7rem;
    letter-spacing:.18em;text-transform:uppercase;color:var(--muted);
  }

  /* ---------- header ---------- */
  header{
    position:absolute;top:0;left:0;right:0;z-index:5;
    display:flex;align-items:center;justify-content:space-between;
    padding:clamp(1.3rem,2.4vw,2.1rem) clamp(1.4rem,4vw,4.5rem);
  }
  .brand{display:flex;align-items:center;gap:.6rem}
  .brand-icon{height:1.7rem;width:auto;display:block;flex:none}
  .brand .name{font-family:var(--serif);font-weight:400;font-size:1.42rem;color:var(--ink);letter-spacing:.01em}

  /* ---------- hero ---------- */
  .hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;isolation:isolate}
  .hero__media{position:absolute;inset:0 0 0 auto;width:58%;z-index:-1}
  .hero__media img{width:100%;height:100%;object-fit:cover;object-position:50% 8%;display:block}
  .hero__media::before{content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,var(--bg) 4%,rgba(10,9,8,.65) 34%,transparent 62%)}
  .hero__media::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,var(--bg) 0%,transparent 22%,transparent 66%,var(--bg) 100%)}

  .hero__copy{position:relative;z-index:2;width:100%;max-width:1360px;margin:0 auto;
    padding-top:0;padding-inline:clamp(1.4rem,4vw,4.5rem);padding-bottom:clamp(4.5rem,9vh,8rem)}
  .quote{
    font-family:var(--serif);font-weight:400;color:var(--ink);
    font-size:clamp(2.55rem,6vw,5rem);line-height:1.02;letter-spacing:-.01em;
    margin-bottom:2rem;max-width:32rem;
  }
  .quote em{font-style:italic;color:var(--accent);font-weight:400}
  .lede{font-size:clamp(1rem,1.15vw,1.12rem);color:var(--body);max-width:34rem}

  /* ---------- impact band ---------- */
  .impact{padding:clamp(3.5rem,7vw,6.5rem) 0 clamp(2.5rem,4vw,3.5rem)}
  .impact__grid{display:grid;grid-template-columns:1.55fr 1fr;gap:clamp(2.5rem,7vw,7rem)}
  .impact__body p{font-size:1.05rem;color:var(--body);margin-bottom:1.35rem;max-width:40rem}
  .impact__body .em{color:var(--ink);font-weight:500}
  .tagline{
    font-family:var(--serif);font-style:italic;font-weight:400;
    font-size:clamp(1.3rem,1.9vw,1.6rem);color:var(--ink);line-height:1.35;
    margin-top:2.1rem;max-width:34rem;
  }
  .contact .org{font-family:var(--serif);font-weight:400;font-size:1.35rem;color:var(--ink);margin-bottom:1.15rem}
  .contact a{display:block;font-family:var(--sans);color:var(--ink);text-decoration:none;font-size:1rem;width:max-content;transition:color .2s}
  .contact a+a{margin-top:.35rem}
  .contact a:hover{color:var(--accent-bright)}

  /* ---------- baseline ---------- */
  .baseline{
    border-top:1px solid var(--line);margin-top:clamp(3rem,6vw,5rem);
    padding:clamp(1.8rem,3vw,2.4rem) 0 clamp(2.2rem,4vw,3rem);
    display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;flex-wrap:wrap;
  }
  .baseline .who .signed{font-family:var(--serif);font-weight:400;font-size:1.2rem;color:var(--ink);margin-bottom:.5rem}

  /* ---------- load motion ---------- */
  .rise{opacity:0;transform:translateY(18px);animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards}
  .d1{animation-delay:.05s}.d2{animation-delay:.16s}.d3{animation-delay:.27s}.d4{animation-delay:.38s}
  @keyframes rise{to{opacity:1;transform:none}}

  /* ---------- responsive ---------- */
  @media (max-width:860px){
    header{position:relative;padding-top:1.35rem;padding-bottom:1.35rem}
    .brand-icon{height:1.45rem}.brand .name{font-size:1.22rem}
    .nav-meta{display:none}
    .hero{flex-direction:column;min-height:auto;align-items:stretch}
    .hero__media{position:relative;width:100%;height:auto;aspect-ratio:1/1;z-index:0;order:-1}
    .hero__media::before{display:none}
    .hero__media::after{background:linear-gradient(180deg,transparent 55%,var(--bg) 100%)}
    .hero__copy{padding-top:2.4rem;padding-bottom:0}
    .quote{font-size:clamp(2rem,8.5vw,2.7rem);max-width:none}
    .quote em{display:inline}
    .impact{padding-top:2.8rem}
    .impact__grid{grid-template-columns:1fr;gap:2.6rem}
    .contact{border-top:1px solid var(--line);padding-top:2.2rem}
    .baseline{flex-direction:column;align-items:flex-start;gap:1.4rem}
  }
  @media (prefers-reduced-motion:reduce){
    .rise{animation:none;opacity:1;transform:none}
    html{scroll-behavior:auto}
  }
