/* ============================================================
   Northheaven LLC — shared styles
   Fonts are self-hosted (no Google Fonts request, GDPR-safe)
   ============================================================ */

@font-face{
  font-family:'Fraunces';
  font-style:normal;
  font-display:swap;
  font-weight:100 900;
  src:url('fonts/fraunces-latin-full-normal.woff2') format('woff2-variations');
  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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Fraunces';
  font-style:italic;
  font-display:swap;
  font-weight:100 900;
  src:url('fonts/fraunces-latin-full-italic.woff2') format('woff2-variations');
  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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('fonts/inter-latin-400-normal.woff2') format('woff2');
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('fonts/inter-latin-500-normal.woff2') format('woff2');
}
@font-face{
  font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('fonts/inter-latin-600-normal.woff2') format('woff2');
}

:root{
  --paper:#FAF8F4;
  --paper-2:#F4F1EB;
  --ink:#14161A;
  --muted:#6A6E76;
  --faint:#9A9DA4;
  --line:#E3DFD7;
  --hair:#EDE9E2;
  --green:#1C3A33;
  --green-soft:rgba(28,58,51,.12);
  --max:1140px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-size:16.5px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:"kern" 1,"liga" 1;
}
.wrap{max-width:var(--max);margin:0 auto;padding:0 40px}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- nav ---------- */
nav{
  position:sticky;top:0;z-index:20;
  background:rgba(250,248,244,.86);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .3s;
}
nav.stuck{border-bottom-color:var(--hair)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:78px}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink)}
.logo svg{display:block;flex-shrink:0;transition:transform .5s cubic-bezier(.16,1,.3,1)}
.logo:hover svg{transform:rotate(45deg)}
.wordmark{font-weight:500;font-size:13.5px;letter-spacing:.26em;line-height:1;white-space:nowrap}
.wordmark em{font-style:normal;font-weight:400;color:var(--faint)}
.nav-links{display:flex;gap:34px}
.nav-links a{
  position:relative;color:var(--muted);text-decoration:none;
  font-size:14px;letter-spacing:.01em;padding:4px 0;
}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;
  width:100%;height:1px;background:var(--ink);
  transform:scaleX(0);transform-origin:right;
  transition:transform .45s cubic-bezier(.16,1,.3,1);
}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left}

/* ---------- hero ---------- */
header{position:relative;padding:148px 0 128px;overflow:hidden}
.watermark{position:absolute;right:-110px;top:40px;opacity:.045;pointer-events:none;user-select:none}
.eyebrow{
  display:flex;align-items:center;gap:14px;
  font-size:11.5px;text-transform:uppercase;letter-spacing:.18em;
  color:var(--faint);font-weight:500;margin-bottom:38px;
}
.eyebrow::before{content:"";width:36px;height:1px;background:var(--line)}
h1{
  font-family:'Fraunces',Georgia,serif;
  font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 1;
  font-weight:300;
  font-size:clamp(42px,6.6vw,76px);
  line-height:1.06;letter-spacing:-.028em;max-width:15ch;
}
h1 i{font-style:italic;font-weight:300;color:var(--green)}
.lede{margin-top:36px;max-width:50ch;font-size:18.5px;line-height:1.72;color:var(--muted)}
.meta{
  margin-top:72px;padding-top:30px;border-top:1px solid var(--hair);
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;max-width:720px;
}
.meta dt{
  font-size:11px;text-transform:uppercase;letter-spacing:.15em;
  color:var(--faint);font-weight:500;margin-bottom:7px;
}
.meta dd{font-size:15.5px;color:var(--ink);font-weight:400}

/* ---------- sections ---------- */
section{padding:104px 0;border-top:1px solid var(--hair)}
.cols{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:64px;align-items:start}
.label{
  font-size:11.5px;text-transform:uppercase;letter-spacing:.16em;
  color:var(--faint);font-weight:500;padding-top:12px;
}
h2{
  font-family:'Fraunces',Georgia,serif;
  font-variation-settings:"opsz" 72,"WONK" 1;
  font-weight:300;font-size:clamp(27px,3.2vw,38px);
  line-height:1.24;letter-spacing:-.02em;max-width:20ch;
}
.body-copy{margin-top:30px;max-width:58ch;color:var(--muted);font-size:17px}
.body-copy p + p{margin-top:20px}

/* ---------- approach ---------- */
.items{display:grid;gap:0}
.item{
  display:grid;grid-template-columns:52px minmax(0,1fr);
  gap:28px;padding:34px 0;border-top:1px solid var(--hair);
  transition:padding-left .5s cubic-bezier(.16,1,.3,1);
}
.item:first-child{border-top:none;padding-top:4px}
.item:hover{padding-left:10px}
.item .idx{
  font-family:'Fraunces',Georgia,serif;font-variation-settings:"opsz" 9;
  font-size:13px;color:var(--green);opacity:.65;padding-top:4px;letter-spacing:.04em;
}
.item h3{font-size:19px;font-weight:500;letter-spacing:-.012em;margin-bottom:9px}
.item p{font-size:16px;color:var(--muted);max-width:52ch;line-height:1.68}

/* ---------- contact ---------- */
.mailto{
  display:inline-block;margin-top:26px;
  font-family:'Fraunces',Georgia,serif;
  font-variation-settings:"opsz" 72,"WONK" 1;
  font-weight:300;font-size:clamp(25px,3.8vw,40px);
  letter-spacing:-.022em;color:var(--green);text-decoration:none;
  position:relative;padding-bottom:6px;
}
.mailto::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;
  background:var(--green-soft);transition:background .35s;
}
.mailto:hover::after{background:var(--green)}

/* ---------- legal pages ---------- */
.legal{padding:88px 0 40px}
.legal .back{
  display:inline-block;font-size:13px;color:var(--muted);
  text-decoration:none;margin-bottom:34px;letter-spacing:.01em;
}
.legal .back:hover{color:var(--ink)}
.legal h1{
  font-size:clamp(32px,4.6vw,50px);
  font-variation-settings:"opsz" 96,"WONK" 1;
  max-width:22ch;margin-bottom:12px;
}
.legal .updated{font-size:13px;color:var(--faint);letter-spacing:.02em}
.legal-body{max-width:68ch;margin-top:56px;padding-bottom:88px}
.legal-body h2{
  font-size:clamp(20px,2.4vw,25px);
  margin-top:52px;margin-bottom:14px;max-width:34ch;
}
.legal-body h2:first-child{margin-top:0}
.legal-body h3{
  font-size:16px;font-weight:600;letter-spacing:-.008em;
  margin-top:30px;margin-bottom:8px;
}
.legal-body p{color:var(--muted);margin-bottom:14px;font-size:16px}
.legal-body ul{color:var(--muted);margin:0 0 16px 20px;font-size:16px}
.legal-body li{margin-bottom:6px}
.legal-body a{color:var(--green);text-decoration:none;border-bottom:1px solid var(--green-soft)}
.legal-body a:hover{border-color:var(--green)}
.legal-body address{
  font-style:normal;color:var(--muted);line-height:1.75;
  margin-bottom:16px;font-size:16px;
}
.legal-body strong{color:var(--ink);font-weight:500}
.callout{
  border-left:2px solid var(--green);padding:4px 0 4px 20px;
  margin:22px 0;color:var(--muted);font-size:15.5px;
}

/* ---------- footer ---------- */
footer{padding:72px 0 88px;border-top:1px solid var(--hair);background:var(--paper-2)}
.foot-top{
  display:flex;align-items:center;gap:13px;
  padding-bottom:40px;margin-bottom:40px;border-bottom:1px solid var(--line);
}
.foot-top .wordmark{font-size:14.5px;color:var(--ink)}
.foot-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;font-size:14px;color:var(--muted)}
.foot-grid h4{
  font-size:11px;text-transform:uppercase;letter-spacing:.15em;
  color:var(--faint);font-weight:500;margin-bottom:12px;
}
.foot-grid address{font-style:normal;line-height:1.75}
.foot-grid a{color:var(--muted);text-decoration:none;border-bottom:1px solid var(--line)}
.foot-grid a:hover{color:var(--ink);border-color:var(--muted)}
.foot-links{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.foot-links a{border-bottom:none}
.foot-links a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.copy{
  margin-top:52px;padding-top:26px;border-top:1px solid var(--line);
  font-size:12.5px;color:var(--faint);
  display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;
}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .cols{grid-template-columns:1fr;gap:26px}
  .label{padding-top:0}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:620px){
  .wrap{padding:0 24px}
  header{padding:88px 0 76px}
  section{padding:70px 0}
  .legal{padding:56px 0 24px}
  .legal-body{margin-top:40px}
  .nav-links{gap:22px}
  .nav-links a:first-child{display:none}
  .meta{grid-template-columns:1fr;gap:22px;margin-top:52px}
  .watermark{right:-180px;top:auto;bottom:-60px;opacity:.035}
  .item{grid-template-columns:1fr;gap:10px}
  .item .idx{padding-top:0}
  .foot-grid{grid-template-columns:1fr;gap:30px}
  .wordmark{letter-spacing:.2em;font-size:12.5px}
}