/* Nid Partners journal — shares the design tokens of nidpartners.com */
:root{
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);

  --paper:#F2F3F0;
  --surface:#FBFBF9;
  --surface-2:#EDEEE9;
  --ink:#14201C;
  --ink-2:#4A554F;
  --ink-3:#78827B;
  --rule:#D9DBD3;
  --rule-strong:#B7BAB0;
  --green:#1C6A4E;
  --green-ink:#12503B;
  --green-soft:#E5EDE7;
  --red:#B23A2E;
  --focus:#1C6A4E;

  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Hanken Grotesk",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;

  --maxw:1120px;
  --gutter:clamp(20px,5vw,64px);
}
html{scroll-padding-top:calc(env(safe-area-inset-top,0px) + 84px);-webkit-text-size-adjust:100%;}
*,*::before,*::after{box-sizing:inherit;}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:17px;line-height:1.6;
  font-variant-numeric:lining-nums;-webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;overflow-x:hidden;
}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.1;letter-spacing:-.015em;margin:0;}
p{margin:0;}
a{color:inherit;text-decoration:none;}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:2px;}
.num{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1;}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter);}

/* ---------- nav ---------- */
header.nav{
  position:sticky;top:env(safe-area-inset-top,0px);z-index:50;
  background:color-mix(in srgb,var(--paper) 86%,transparent);
  backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid transparent;transition:border-color .3s ease;
}
header.nav.scrolled{border-bottom-color:var(--rule);}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:72px;}
.brand{display:inline-flex;align-items:baseline;gap:2px;white-space:nowrap;font-family:var(--serif);font-size:22px;font-weight:600;letter-spacing:-.02em;}
.brand .dot{color:var(--green);}
.brand-mark{position:relative;padding-bottom:5px;}
.brand-mark::after{content:"";position:absolute;left:0;right:14px;bottom:0;height:2px;background:var(--green);border-radius:2px;}
.brand-sub{margin-left:12px;font-family:var(--sans);font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);}
nav.links{display:flex;align-items:center;gap:34px;}
nav.links a{font-size:15px;color:var(--ink-2);position:relative;padding:4px 0;transition:color .2s ease;}
nav.links a::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1.5px;background:var(--green);transition:width .28s cubic-bezier(.2,.7,.2,1);}
nav.links a:hover{color:var(--ink);}
nav.links a:hover::after{width:100%;}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:15px;font-weight:600;line-height:1;padding:12px 20px;border-radius:999px;border:1px solid transparent;
  transition:transform .18s ease,background .2s ease,border-color .2s ease;white-space:nowrap;
}
.btn-primary{background:var(--ink);color:var(--surface);}
.btn-primary:hover{background:var(--green-ink);transform:translateY(-1px);}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--rule-strong);}
.btn-ghost:hover{border-color:var(--ink);transform:translateY(-1px);}
.nav-cta{display:flex;align-items:center;gap:14px;}

/* ---------- shared bits ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:14px;color:var(--ink-2);margin-bottom:22px;}
.eyebrow .pip{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px var(--green-soft);}
.tag{display:inline-block;font-size:12px;font-weight:700;color:var(--green-ink);background:var(--green-soft);padding:4px 10px;border-radius:999px;letter-spacing:.02em;}
.meta{font-size:14px;color:var(--ink-3);display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;}
.meta .sep{opacity:.5;}
section{padding:clamp(48px,7vw,84px) 0;}
.kicker{font-size:14px;color:var(--green);font-weight:600;margin-bottom:14px;}

/* ---------- blog hero ---------- */
.b-hero{padding:clamp(48px,8vw,92px) 0 clamp(20px,3vw,36px);}
.b-hero h1{font-size:clamp(38px,6vw,62px);letter-spacing:-.03em;max-width:15ch;}
.b-hero h1 em{font-style:italic;font-weight:400;color:var(--green-ink);}
.b-hero .sub{margin-top:24px;max-width:46ch;font-size:clamp(17px,2vw,19px);color:var(--ink-2);line-height:1.55;}

/* ---------- featured post ---------- */
.feature{
  display:grid;grid-template-columns:1.15fr .85fr;gap:0;
  background:var(--surface);border:1px solid var(--rule);border-radius:18px;overflow:hidden;
  box-shadow:0 1px 0 rgba(20,32,28,.03),0 24px 48px -32px rgba(20,32,28,.28);
  transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s ease;
}
.feature:hover{transform:translateY(-2px);box-shadow:0 1px 0 rgba(20,32,28,.03),0 30px 56px -30px rgba(20,32,28,.34);}
.feature-body{padding:clamp(26px,4vw,44px);display:flex;flex-direction:column;gap:16px;}
.feature h2{font-size:clamp(26px,3.6vw,38px);letter-spacing:-.025em;line-height:1.1;}
.feature p{color:var(--ink-2);font-size:17px;max-width:46ch;}
.feature .more{margin-top:auto;font-weight:600;color:var(--green-ink);display:inline-flex;gap:8px;align-items:center;}
.feature .more span{transition:transform .25s ease;}
.feature:hover .more span{transform:translateX(4px);}
.feature-art{background:var(--green-soft);padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;justify-content:center;gap:0;border-left:1px solid var(--rule);}

/* mini statement used as decorative art */
.mini .lrow{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:8px 0;font-size:15px;color:var(--ink-2);}
.mini .lrow b{font-weight:600;color:var(--ink);}
.mini .lrow .neg{color:var(--red);font-weight:600;}
.mini .lrow.subtotal{border-top:1px solid var(--rule-strong);margin-top:4px;}
.mini .lrow.subtotal span:first-child{color:var(--ink);font-weight:600;}
.mini .lrow.total{border-top:1px solid var(--rule-strong);padding-top:12px;margin-top:2px;}
.mini .lrow.total span:first-child{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink);}
.mini .lrow.total b{font-family:var(--serif);font-size:24px;color:var(--green-ink);}

/* ---------- post list as ledger lines ---------- */
.sec-head{margin-bottom:clamp(24px,4vw,40px);}
.sec-head h2{font-size:clamp(26px,4vw,38px);letter-spacing:-.025em;}
.posts{border-top:1px solid var(--rule);}
.post-row{
  display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:clamp(16px,4vw,48px);
  padding:26px 4px;border-bottom:1px solid var(--rule);
  transition:padding-left .3s cubic-bezier(.2,.7,.2,1),background .3s ease;
}
.post-row:hover{background:linear-gradient(90deg,var(--surface),transparent 70%);padding-left:14px;}
.post-row .idx{font-family:var(--serif);font-size:15px;color:var(--ink-3);}
.post-row h3{font-family:var(--serif);font-size:clamp(20px,2.6vw,25px);font-weight:600;letter-spacing:-.01em;}
.post-row p{margin-top:7px;color:var(--ink-2);font-size:16px;max-width:58ch;}
.post-row .tag{margin-bottom:10px;}
.post-row .when{font-size:15px;color:var(--ink-2);text-align:right;white-space:nowrap;}
.post-row .when b{display:block;font-family:var(--serif);font-size:17px;font-weight:600;color:var(--ink);}

/* ---------- cta ---------- */
.cta{background:var(--ink);color:var(--surface);border-radius:22px;padding:clamp(34px,5vw,56px);display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;}
.cta h2{font-size:clamp(26px,3.6vw,38px);letter-spacing:-.025em;max-width:18ch;}
.cta p{margin-top:12px;color:#AFBAB2;max-width:44ch;font-size:17px;}
.cta .btn-primary{background:var(--surface);color:var(--ink);}
.cta .btn-primary:hover{background:var(--green-soft);}

/* ---------- article ---------- */
.article-head{padding-block:clamp(40px,6vw,72px) clamp(20px,3vw,32px);}
.back{font-size:15px;color:var(--ink-2);display:inline-flex;gap:8px;align-items:center;margin-bottom:28px;}
.back:hover{color:var(--ink);}
.article-head h1{font-size:clamp(34px,5.4vw,56px);letter-spacing:-.03em;max-width:20ch;margin:16px 0 20px;}
.lede{font-size:clamp(18px,2.2vw,21px);color:var(--ink-2);max-width:52ch;line-height:1.55;margin-bottom:22px;}
.prose{max-width:680px;padding-bottom:clamp(28px,4vw,48px);}
.prose p{font-size:18px;line-height:1.72;color:var(--ink-2);margin-bottom:22px;}
.prose h2{font-size:clamp(24px,3vw,30px);letter-spacing:-.02em;margin:44px 0 16px;color:var(--ink);}
.prose ul,.prose ol{margin:0 0 24px;padding-left:22px;color:var(--ink-2);font-size:18px;line-height:1.65;}
.prose li{margin-bottom:8px;padding-left:4px;}
.prose li::marker{color:var(--green);font-weight:700;}
.prose strong{color:var(--ink);font-weight:600;}
.prose blockquote{margin:36px 0;padding:4px 0 4px 24px;border-left:3px solid var(--green);font-family:var(--serif);font-size:clamp(21px,2.8vw,26px);line-height:1.35;letter-spacing:-.01em;color:var(--ink);}
.figure{margin:32px 0 36px;background:var(--surface);border:1px solid var(--rule);border-radius:16px;padding:clamp(20px,3vw,28px);}
.figure .cap{font-size:13px;color:var(--ink-3);margin-top:14px;padding-top:12px;border-top:1px dashed var(--rule);}
.figure .mini .lrow{font-size:16px;}

.more-posts{border-top:1px solid var(--rule);padding-top:clamp(32px,5vw,52px);}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);padding:44px 0 40px;margin-top:clamp(28px,4vw,48px);}
.foot-in{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;}
.foot-links{display:flex;gap:26px;font-size:14px;color:var(--ink-2);flex-wrap:wrap;}
.foot-links a:hover{color:var(--ink);}
.foot-meta{font-size:13px;color:var(--ink-3);}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .feature{grid-template-columns:1fr;}
  .feature-art{border-left:none;border-top:1px solid var(--rule);}
  nav.links{display:none;}
}
@media(max-width:560px){
  body{font-size:16px;}
  .post-row{grid-template-columns:auto 1fr;}
  .post-row .when{grid-column:2;text-align:left;}
  .post-row .when b{display:inline;margin-right:6px;}
  .nav-cta .btn-ghost{display:none;}
  .brand-sub{display:none;}
  .prose p,.prose ul,.prose ol{font-size:17px;}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important;scroll-behavior:auto !important;}
}

/* ---------- dark viewer ---------- */
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0F1512;--surface:#161D19;--surface-2:#1F2823;
    --ink:#ECEEE8;--ink-2:#A6AFA8;--ink-3:#7C857E;
    --rule:#28312B;--rule-strong:#3A443D;
    --green:#5CB994;--green-ink:#8FD3B6;--green-soft:#18271F;--red:#E4867A;--focus:#5CB994;
  }
  :root:not([data-theme="light"]) .btn-primary{color:#0F1512;}
  :root:not([data-theme="light"]) .cta{background:#182019;}
  :root:not([data-theme="light"]) .cta .btn-primary{background:var(--ink);color:#0F1512;}
}