/* ============================================================
   web.css — rules for the landing page, the CV one-pager and
   Equity Reports. Loaded AFTER site.css, which supplies the
   colour tokens, typography, nav and footer. Nothing in here
   redefines a token: the two palettes stay in one place.
   ============================================================ */

/* ---------- shared: a contact link on a light background ---------- */
.link-row{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;}
.link-item{display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:500;color:var(--ink-soft);transition:color .2s ease,gap .2s ease;}
.link-item svg{color:var(--accent);flex-shrink:0;}
a.link-item:hover{color:var(--accent-ink);gap:13px;}

/* ============================================================
   LANDING PAGE
   ============================================================ */
.lp{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;}
.lp-bar{padding-block:26px;border-bottom:1px solid var(--line);}
.lp-bar-inner{max-width:1180px;margin:0 auto;padding-inline:32px;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.lp-place{font-family:'IBM Plex Mono',monospace;font-size:11.5px;letter-spacing:.06em;color:var(--ink-faint);}

.lp-main{flex:1;display:flex;align-items:center;padding-block:clamp(44px,6vw,86px);}
.lp-grid{max-width:1180px;margin:0 auto;padding-inline:32px;width:100%;display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(44px,6vw,80px);align-items:center;}

.lp-byline{display:flex;align-items:center;gap:18px;margin-bottom:30px;}
.lp-byline img{width:80px;height:80px;border-radius:50%;object-fit:cover;object-position:center 18%;border:1.5px solid var(--accent);}
.lp-byline span{font-family:'Public Sans',sans-serif;font-size:13.5px;font-weight:600;color:var(--ink-faint);letter-spacing:.12em;text-transform:uppercase;}
.lp-intro h1{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:clamp(34px,4.6vw,54px);font-weight:600;letter-spacing:-0.022em;line-height:1.1;margin-bottom:20px;}
.lp-role{font-size:clamp(13px,1.35vw,14.5px);font-weight:600;letter-spacing:.02em;color:var(--accent-ink);margin-bottom:14px;}
.lp-lede{font-size:16.5px;line-height:1.68;color:var(--ink-soft);max-width:48ch;margin-bottom:0;}
/* the stations carry the credibility the doors cannot: names, not numbers */
.lp-stations{display:flex;flex-wrap:wrap;align-items:center;gap:9px 0;border-top:1px solid var(--line);margin-top:28px;padding-top:18px;}
.lp-stations span{font-family:'Public Sans',system-ui,sans-serif;font-size:12px;font-weight:700;letter-spacing:.05em;color:var(--ink-faint);line-height:1.2;padding-inline:14px;border-left:1px solid var(--line);}
.lp-stations span:first-child{padding-left:0;border-left:none;}
/* a station that has not happened yet is accent-coloured and carries its year,
   so it can never be read as somewhere he has already worked */
.lp-stations .is-upcoming{color:var(--accent-ink);}
.lp-stations em{font-style:normal;font-family:'IBM Plex Mono',monospace;font-weight:600;letter-spacing:.06em;margin-left:6px;opacity:.85;}
.lp-contact{margin-top:24px;padding-top:22px;border-top:1px solid var(--line);}

/* the three doors */
.lp-doors{display:flex;flex-direction:column;}
.lp-door{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:baseline;gap:0 22px;padding-block:26px;border-top:1px solid var(--line);position:relative;transition:padding-left .28s ease;}
.lp-door:last-child{border-bottom:1px solid var(--line);}
.lp-door::before{content:"";position:absolute;top:-1px;left:0;width:0;height:2px;background:var(--accent);transition:width .35s cubic-bezier(.2,.7,.3,1);}
.lp-door:hover::before,.lp-door:focus-visible::before{width:100%;}
.lp-door:hover,.lp-door:focus-visible{padding-left:10px;}
.lp-door .n{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.16em;color:var(--accent);padding-top:7px;}
.lp-door h2{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:clamp(21px,2.3vw,27px);font-weight:600;letter-spacing:-0.015em;line-height:1.2;margin-bottom:9px;transition:color .2s ease;}
.lp-door p{font-size:14.5px;line-height:1.6;color:var(--ink-soft);max-width:46ch;margin:0;}
.lp-door .arrow{color:var(--ink-faint);align-self:center;transition:transform .3s cubic-bezier(.2,.7,.3,1),color .2s ease;}
.lp-door:hover .arrow,.lp-door:focus-visible .arrow{transform:translateX(7px);color:var(--accent);}
.lp-door:hover h2,.lp-door:focus-visible h2{color:var(--accent-ink);}

.lp-foot{border-top:1px solid var(--line);padding-block:22px;}
.lp-foot-inner{max-width:1180px;margin:0 auto;padding-inline:32px;display:flex;justify-content:space-between;gap:10px 24px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-faint);}

@media (max-width:980px){
  .lp-grid{grid-template-columns:1fr;gap:42px;}
  .lp-main{align-items:flex-start;}
}
@media (max-width:560px){
  /* the strip always wraps at this width, and a wrapped line must not start with
     a leftover separator — so drop the rules and space the names instead */
  .lp-stations{gap:9px 20px;}
  .lp-stations span{padding-inline:0;border-left:none;}
  .lp-bar-inner,.lp-grid,.lp-foot-inner{padding-inline:20px;}
  .lp-door{grid-template-columns:auto minmax(0,1fr);gap:0 16px;}
  .lp-door .arrow{display:none;}
  .lp-door p{font-size:14px;}
}
@media (prefers-reduced-motion:reduce){
  .lp-door,.lp-door::before,.lp-door .arrow{transition:none;}
}

/* ============================================================
   CV ONE-PAGER
   ============================================================ */
.cv-page{padding-block:54px 0;}
.cv-head{display:grid;grid-template-columns:1fr auto;gap:28px 40px;align-items:end;padding-bottom:30px;border-bottom:2px solid var(--accent);}
.cv-head h1{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:clamp(32px,4.4vw,48px);font-weight:600;letter-spacing:-0.022em;line-height:1.06;margin-bottom:12px;}
.cv-head .cv-role{font-size:15.5px;font-weight:600;color:var(--accent-ink);margin-bottom:22px;}
.cv-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}

.cv-profile p{font-size:16.5px;line-height:1.72;color:var(--ink-soft);max-width:none;}
/* the note under the CV rides the same content track as everything above it */
.cv-tail{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:52px;}
.cv-tail > *{grid-column:2;}

/* the two-track rail, reused from the case pages but tuned for a CV */
.cv-body{padding-block:10px 40px;}
.cv-block{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:52px;align-items:start;padding-block:38px;border-bottom:1px solid var(--line);}
.cv-block > h2{grid-column:1;font-family:'Public Sans',system-ui,sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);position:sticky;top:26px;margin:0;}
.cv-block > *:not(h2){grid-column:2;}

.cv-entry + .cv-entry{margin-top:34px;padding-top:34px;border-top:1px solid var(--line);}
.cv-entry-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px 24px;flex-wrap:wrap;margin-bottom:4px;}
.cv-org{font-family:'Public Sans',system-ui,sans-serif;font-size:17px;font-weight:700;letter-spacing:-0.01em;color:var(--ink);}
.cv-when{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--ink-faint);white-space:nowrap;font-variant-numeric:tabular-nums;}
/* same rule on the CV: an entry that lies in the future says so */
.cv-upcoming,.pill{display:inline-block;font-family:'Public Sans',system-ui,sans-serif;font-size:9.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);background:var(--accent-soft);border-radius:999px;padding:3px 9px;margin-left:9px;vertical-align:middle;}
@media print{.cv-upcoming,.pill{background:none;border:1px solid var(--line);}}
.cv-title{font-size:14.5px;font-weight:600;color:var(--accent-ink);margin-bottom:14px;}
.cv-entry ul li{position:relative;padding-left:19px;font-size:15px;line-height:1.66;color:var(--ink-soft);margin-bottom:9px;}
.cv-entry ul li:last-child{margin-bottom:0;}
.cv-entry ul li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:1px;background:var(--accent);}
.cv-entry ul li strong{color:var(--ink);font-weight:600;}

.cv-facts{display:grid;grid-template-columns:182px minmax(0,1fr);gap:14px 26px;}
.cv-facts dt{font-family:'Public Sans',system-ui,sans-serif;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);padding-top:2px;}
.cv-facts dd{margin:0;font-size:15px;line-height:1.62;color:var(--ink-soft);}
.cv-facts dd strong{color:var(--ink);font-weight:600;}

.cv-note{font-size:13.5px;color:var(--ink-faint);line-height:1.6;padding-block:26px 46px;max-width:70ch;}

@media (max-width:860px){
  .cv-head{grid-template-columns:1fr;align-items:start;}
  .cv-block{grid-template-columns:1fr;column-gap:0;}
  .cv-block > h2{position:static;margin-bottom:18px;}
  .cv-block > *:not(h2){grid-column:1;}
  .cv-facts{grid-template-columns:1fr;gap:4px 0;}
  .cv-facts dd{margin-bottom:12px;}
  .cv-tail{grid-template-columns:1fr;column-gap:0;}
  .cv-tail > *{grid-column:1;}
}

/* print: the page IS the PDF, so make it behave like one */
@media print{
  @page{margin:14mm 14mm 16mm;}
  :root{--bg:#FFFFFF;--surface:#FFFFFF;--surface-2:#FFFFFF;--ink:#000000;--ink-soft:#1E2622;--ink-faint:#4A534D;--line:#C9CFC9;--accent:#1F7A53;--accent-ink:#14563A;}
  html,body{background:#FFFFFF !important;color:#000 !important;}
  .no-print,.cv-actions,.cv-tail,.lp-foot,.site-footer{display:none !important;}
  .cv-page{padding-block:0 !important;}
  .cv-block{page-break-inside:avoid;padding-block:20px;}
  .cv-entry{page-break-inside:avoid;}
  .cv-block > h2{position:static !important;}
  .cv-head{padding-bottom:18px;}
  .cv-head h1{font-size:30px;}
  .cv-profile{padding-block:18px;}
  .cv-profile p,.cv-entry ul li,.cv-facts dd{font-size:11pt;line-height:1.45;}
  .cv-org{font-size:12.5pt;}
  .reveal-io,.reveal-io.pending{opacity:1 !important;transform:none !important;}
  a{text-decoration:none;color:inherit;}
}

/* ============================================================
   EQUITY REPORTS
   ============================================================ */
.eq-hero{padding-block:54px 40px;border-bottom:1px solid var(--line);}
.eq-hero-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:26px 56px;align-items:end;}
.eq-hero h1{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:clamp(30px,4.4vw,46px);font-weight:600;letter-spacing:-0.02em;line-height:1.1;margin-block:12px 0;max-width:20ch;}
.eq-hero .eq-lead{font-size:17px;line-height:1.66;color:var(--ink-soft);border-top:2px solid var(--accent);padding-top:18px;}
@media (max-width:860px){.eq-hero-grid{grid-template-columns:1fr;gap:22px;}}

.eq-method{padding-block:44px;border-bottom:1px solid var(--line);}
.eq-method-grid{display:grid;grid-template-columns:200px minmax(0,1fr);column-gap:52px;align-items:start;}
.eq-method-grid > h2{font-family:'Public Sans',system-ui,sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:0;}
.eq-method-intro{font-size:16px;line-height:1.72;color:var(--ink-soft);margin-bottom:26px;max-width:none;}
@media (max-width:860px){.eq-method-grid{grid-template-columns:1fr;}.eq-method-grid > h2{margin-bottom:18px;}}

.eq-list{padding-block:44px 20px;}
.eq-list-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px 24px;flex-wrap:wrap;margin-bottom:8px;}
.eq-list-head h2{font-family:'Public Sans',system-ui,sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);}
.eq-count{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--ink-faint);font-variant-numeric:tabular-nums;}

.eq-item{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:0 22px;align-items:baseline;padding-block:26px;border-top:1px solid var(--line);position:relative;transition:padding-left .28s ease;}
.eq-item:last-of-type{border-bottom:1px solid var(--line);}
.eq-item::before{content:"";position:absolute;top:-1px;left:0;width:0;height:2px;background:var(--accent);transition:width .35s cubic-bezier(.2,.7,.3,1);}
.eq-item:hover::before,.eq-item:focus-visible::before{width:100%;}
.eq-item:hover,.eq-item:focus-visible{padding-left:10px;}
.eq-item .n{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.16em;color:var(--accent);padding-top:6px;}
.eq-item h3{font-family:'Public Sans',system-ui,sans-serif;font-size:18px;font-weight:700;letter-spacing:-0.01em;margin-bottom:6px;transition:color .2s ease;}
.eq-item:hover h3,.eq-item:focus-visible h3{color:var(--accent-ink);}
.eq-item .eq-sub{font-size:14.5px;line-height:1.6;color:var(--ink-soft);max-width:56ch;margin:0;}
.eq-item .eq-tags{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:12px;}
.eq-tag{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);border:1px solid var(--line);border-radius:999px;padding:3px 10px;}
.eq-item .arrow{color:var(--ink-faint);align-self:center;transition:transform .3s cubic-bezier(.2,.7,.3,1),color .2s ease;}
.eq-item:hover .arrow,.eq-item:focus-visible .arrow{transform:translateX(7px);color:var(--accent);}

.eq-empty{border:1px dashed var(--line);border-radius:14px;padding:34px 30px;text-align:center;}
.eq-empty p{font-size:15px;line-height:1.66;color:var(--ink-soft);max-width:52ch;margin:0 auto;}

.eq-disclaimer{margin-top:52px;padding-block:28px 46px;border-top:1px solid var(--line);}
.eq-disclaimer h3{font-family:'Public Sans',system-ui,sans-serif;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:12px;}
.eq-disclaimer p{font-size:13.5px;line-height:1.66;color:var(--ink-faint);max-width:none;margin-bottom:10px;}
.eq-disclaimer p:last-child{margin-bottom:0;}

@media (max-width:560px){
  .eq-item{grid-template-columns:auto minmax(0,1fr);gap:0 16px;}
  .eq-item .arrow{display:none;}
}
@media (prefers-reduced-motion:reduce){
  .eq-item,.eq-item::before,.eq-item .arrow{transition:none;}
}

/* a report subpage reuses .case-* from site.css; these are the additions */
.report-tags{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:16px;}
.placeholder{background:var(--accent-soft);border-radius:3px;padding:0 4px;font-family:'IBM Plex Mono',monospace;font-size:.92em;color:var(--accent-ink);}

/* ============================================================
   CV — career spine
   The scroll-progressive timeline from the portfolio, moved here
   when Experience left that page. Progressive enhancement: without
   JS the grey spine and outlined dots are simply all visible.
   ============================================================ */
.cv-timeline{position:relative;padding-left:32px;}
.cv-timeline::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;background:var(--line);}
.cv-timeline .cv-rail{position:absolute;left:0;top:10px;width:2px;height:0;background:var(--accent);will-change:height;}
.cv-timeline .cv-entry{position:relative;}
.cv-timeline .dot{
  position:absolute;left:-37px;top:7px;width:12px;height:12px;border-radius:50%;
  background:var(--bg);border:2.5px solid var(--accent);
  transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,transform .35s ease;
}
.cv-timeline.rail-on .dot{border-color:var(--line);}
.cv-timeline.rail-on .dot.lit{border-color:var(--accent);background:var(--accent);box-shadow:0 0 0 5px var(--accent-soft);transform:scale(1.08);}
@media (prefers-reduced-motion:reduce){
  .cv-timeline .dot{transition:none;}
}
@media (max-width:700px){
  .cv-timeline{padding-left:0;}
  .cv-timeline::before,.cv-timeline .cv-rail,.cv-timeline .dot{display:none;}
}
@media print{
  .cv-timeline{padding-left:0 !important;}
  .cv-timeline::before,.cv-timeline .cv-rail,.cv-timeline .dot{display:none !important;}
  .njm,.brandbar{display:none !important;}
}

/* sub-heading inside a report section (e.g. "What decides the outcome") */
.case-subhead{font-family:'Public Sans',system-ui,sans-serif;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-faint);margin:26px 0 10px;}

/* ============================================================
   EQUITY — the structure as a spine you scroll through
   Same rail language as the CV timeline: a green line draws down
   as you read and each step lights up when the line reaches it.
   ============================================================ */
.eq-spine{position:relative;padding-left:32px;margin:0;list-style:none;}
.eq-spine::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px;background:var(--line);}
.eq-spine .eq-rail{position:absolute;left:0;top:12px;width:2px;height:0;background:var(--accent);will-change:height;}
.eq-step{position:relative;padding-block:17px;}
.eq-step + .eq-step{border-top:1px solid var(--line);}
.eq-step .dot{position:absolute;left:-38px;top:24px;width:11px;height:11px;border-radius:50%;background:var(--bg);border:2px solid var(--line);transition:border-color .3s ease,background .3s ease,box-shadow .3s ease,transform .3s ease;}
.eq-spine.rail-on .dot.lit{border-color:var(--accent);background:var(--accent);box-shadow:0 0 0 5px var(--accent-soft);transform:scale(1.08);}
.eq-step-head{display:flex;align-items:baseline;gap:14px;}
.eq-step-head .n{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.14em;color:var(--accent);}
.eq-step-head h3{font-family:'Public Sans',system-ui,sans-serif;font-size:15.5px;font-weight:700;letter-spacing:-0.01em;color:var(--ink);margin:0;}
.eq-step p{font-size:15px;line-height:1.66;color:var(--ink-soft);margin:7px 0 0 34px;max-width:none;}
@media (max-width:860px){
  .eq-step p{margin-left:0;}
  .eq-spine{padding-left:24px;}
  .eq-step .dot{left:-30px;}
}

/* blocks that arrive from the left instead of from below */
.reveal-io.slide-in.pending{opacity:0;transform:translateX(-22px);}
.reveal-io.slide-in.pending.visible{opacity:1;transform:translateX(0);}
.reveal-io.slide-in{transition:opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1);}
@media (prefers-reduced-motion:reduce){
  .reveal-io.slide-in,.reveal-io.slide-in.pending{opacity:1;transform:none;transition:none;}
}

/* landing: three figures that carry what the lede used to spell out */
.lp-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 26px;border-top:1px solid var(--line);margin-top:26px;padding-top:20px;}
.lp-stat-value{font-family:'Newsreader',Georgia,serif;font-size:clamp(24px,2.7vw,31px);font-weight:600;letter-spacing:-0.02em;color:var(--accent-ink);line-height:1.1;font-variant-numeric:tabular-nums;}
.lp-stat-label{font-size:12.5px;line-height:1.45;color:var(--ink-faint);margin-top:6px;max-width:26ch;}
@media (max-width:640px){
  .lp-stats{grid-template-columns:1fr;gap:14px;}
  .lp-stat-label{max-width:none;}
}

/* the landing figures carry the same accent rule as the portfolio metrics */
.lp-stat{position:relative;padding-top:16px;}
.lp-stat::before{content:"";position:absolute;top:0;left:0;width:34px;height:2px;background:var(--accent);}
.lp-stats{align-items:start;}

/* the three doors arrive from the right, staggered */
.reveal-io.slide-in-right.pending{opacity:0;transform:translateX(26px);}
.reveal-io.slide-in-right.pending.visible{opacity:1;transform:translateX(0);}
.reveal-io.slide-in-right{transition:opacity .55s ease, transform .6s cubic-bezier(.2,.7,.3,1);}
@media (prefers-reduced-motion:reduce){
  .reveal-io.slide-in-right,.reveal-io.slide-in-right.pending{opacity:1;transform:none;transition:none;}
}

/* ============================================================
   LANDING — dark hero
   The cover of the site: one big portrait, the claim, and the
   three figures that carry it. The dark tone is the one the
   portfolio footer already uses, so the two sites read as one.
   ============================================================ */
.lp-hero{background:#17160F;color:#EDE8DC;padding-block:clamp(26px,3vw,40px) 0;overflow:hidden;}
.lp-hero-bar{max-width:1180px;margin:0 auto;padding-inline:32px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding-bottom:clamp(26px,4vw,44px);}
.lp-hero .lp-place{color:#8C8A7C;}
.lp-hero .njm{color:#EDE8DC;}
.lp-hero-grid{max-width:1180px;margin:0 auto;padding-inline:32px;display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(34px,5vw,72px);align-items:center;}
.lp-name{font-family:'Public Sans',system-ui,sans-serif;font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#9CC4AC;margin-bottom:18px;}
.lp-hero .lp-role{color:#A9BFB0;margin-bottom:14px;}
.lp-hero h1{font-family:'Newsreader',Georgia,'Times New Roman',serif;font-size:clamp(34px,4.9vw,58px);font-weight:600;letter-spacing:-0.024em;line-height:1.05;color:#FBF7EE;margin-bottom:20px;}
.lp-hero .lp-lede{font-size:16.5px;line-height:1.66;color:#C9C6B6;max-width:52ch;margin:0;}

/* the portrait: large, softly lit, breathing */
.lp-photo{position:relative;}
.lp-photo::after{content:"";position:absolute;inset:-14% -10% -10% -14%;border-radius:50%;background:radial-gradient(closest-side, rgba(156,196,172,.20), transparent 72%);filter:blur(6px);z-index:0;}
.lp-photo-frame{position:relative;z-index:1;border-radius:20px;overflow:hidden;border:1px solid #2F2D23;aspect-ratio:4/4.3;max-width:340px;margin-left:auto;}
.lp-photo-frame img{width:100%;height:100%;object-fit:cover;object-position:center 16%;display:block;transform:scale(1.02);animation:lpBreathe 18s ease-in-out infinite alternate;}
@keyframes lpBreathe{from{transform:scale(1.02) translate3d(0,0,0);}to{transform:scale(1.09) translate3d(0,-1.2%,0);}}

/* the three figures sit on the dark band */
.lp-hero .lp-stats{max-width:1180px;margin:clamp(30px,4vw,52px) auto 0;padding:0 32px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #2F2D23;gap:0;}
.lp-hero .lp-stat{padding:24px 26px 30px;border-right:1px solid #2F2D23;}
.lp-hero .lp-stat:first-child{padding-left:0;}
.lp-hero .lp-stat:last-child{border-right:none;}
.lp-hero .lp-stat::before{background:#9CC4AC;left:26px;}
.lp-hero .lp-stat:first-child::before{left:0;}
.lp-hero .lp-stat-value{font-family:'Newsreader',Georgia,serif;font-size:clamp(28px,3.8vw,44px);color:#FBF7EE;margin-bottom:10px;}
.lp-hero .lp-stat-label{color:#8C8A7C;font-size:13px;max-width:28ch;}

/* cream below the fold */
.lp-body{background:var(--bg);}
.lp-body-inner{max-width:1180px;margin:0 auto;padding:clamp(30px,4vw,44px) 32px 0;}
.lp-body .lp-stations{border-top:none;margin-top:0;padding-top:0;padding-bottom:28px;border-bottom:1px solid var(--line);}
.lp-body .lp-door p{max-width:68ch;}
.lp-body .lp-doors{padding-bottom:34px;}
.lp-contact{padding-block:24px 40px;border-top:1px solid var(--line);}

@media (max-width:980px){
  .lp-hero-grid{grid-template-columns:1fr;gap:30px;}
  .lp-photo-frame{aspect-ratio:4/3;max-width:420px;margin-inline:0;}
  .lp-hero .lp-stats{grid-template-columns:1fr;}
  .lp-hero .lp-stat{border-right:none;border-bottom:1px solid #2F2D23;padding-inline:0;}
  .lp-hero .lp-stat::before,.lp-hero .lp-stat:first-child::before{left:0;}
  .lp-hero .lp-stat:last-child{border-bottom:none;}
}
@media (max-width:560px){
  .lp-hero-bar,.lp-hero-grid,.lp-hero .lp-stats,.lp-body-inner{padding-inline:20px;}
}
@media (prefers-reduced-motion:reduce){
  .lp-photo-frame img{animation:none;transform:none;}
}

/* the CV is the detail layer: not a numbered door but a quiet utility row
   with a direct PDF link — the portfolio sells, the CV is for checking */
.lp-cv{display:flex;align-items:center;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;margin:6px 0 34px;padding:18px 22px;border:1px solid var(--line);border-radius:14px;background:var(--surface,#FFFDF8);}
.lp-cv-text{display:flex;flex-direction:column;gap:3px;}
.lp-cv-label{font-family:'Public Sans',system-ui,sans-serif;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);}
.lp-cv-sub{font-size:14.5px;color:var(--ink-soft);}
.lp-cv-actions{display:flex;gap:10px;flex-wrap:wrap;}
.lp-cv-actions .btn{display:inline-flex;align-items:center;gap:7px;}
.lp-body .lp-doors{padding-bottom:18px;}

/* mobile: the hero photo crops to the face, not the building behind it */
@media (max-width:980px){
  .lp-photo-frame{aspect-ratio:1/1;max-width:340px;}
  .lp-photo-frame img{animation:none;transform:scale(1.28);transform-origin:47% 42%;object-position:center 30%;}
}
@media (max-width:560px){
  .lp-photo-frame{max-width:none;aspect-ratio:5/4;}
  .lp-photo-frame img{transform:scale(1.12);transform-origin:47% 45%;}
}
.lp-role .role-short{display:none;}@media (max-width:560px){.lp-role .role-long{display:none;}.lp-role .role-short{display:inline;}}

/* headline in two beats, as on the LinkedIn banner */
.lp-hero h1 .h1-accent{display:block;font-style:italic;font-weight:500;color:#9CC4AC;}

/* availability: 13 months, Jan 2027 – Jan 2028 */
.lp-avail{margin:0 0 34px;padding:18px 22px 20px;border:1px solid var(--line);border-radius:14px;background:var(--surface,#fff);}
.av-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px;}
.av-head h2{margin:0;}
.av-legend{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-faint);}
.av-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-left:8px;}
.av-legend i:first-child{margin-left:0;}
.av-legend i.is-open{background:var(--accent);}
.av-legend i.is-busy{background:var(--surface-2);border:1px solid var(--line);}
.av-bar{display:grid;grid-template-columns:repeat(13,1fr);gap:4px;}
.av-seg{grid-column:span var(--m);min-height:62px;border-radius:9px;padding:10px 12px;display:flex;flex-direction:column;justify-content:center;gap:3px;overflow:hidden;}
.av-seg.is-open{background:var(--accent);color:#fff;}
.av-seg.is-busy{background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line);}
.av-when{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.02em;opacity:.9;white-space:nowrap;}
.av-what{font-size:13.5px;font-weight:600;line-height:1.3;}
.av-ticks{display:grid;grid-template-columns:repeat(13,1fr);gap:4px;margin-top:6px;font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--ink-faint);text-align:center;}
.av-years{display:grid;grid-template-columns:12fr 1fr;gap:4px;font-family:'IBM Plex Mono',monospace;font-size:10.5px;color:var(--ink-faint);margin-top:2px;}
.av-years span:last-child{text-align:center;}
.av-note{margin:14px 0 0;font-size:14.5px;color:var(--ink-soft);}
.lp-avail.reveal-io.pending .av-seg{transform:scaleX(.6);transform-origin:left;opacity:0;}
.lp-avail.reveal-io.pending.visible .av-seg{transform:none;opacity:1;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .6s ease;}
.lp-avail.reveal-io.pending.visible .av-seg:nth-child(2){transition-delay:.12s}
.lp-avail.reveal-io.pending.visible .av-seg:nth-child(3){transition-delay:.24s}
.lp-avail.reveal-io.pending.visible .av-seg:nth-child(4){transition-delay:.36s}
@media (max-width:700px){
  .av-bar{grid-template-columns:1fr;gap:6px;}
  .av-seg{grid-column:auto;min-height:0;flex-direction:row;justify-content:space-between;align-items:center;}
  .av-ticks,.av-years{display:none;}
}
@media (prefers-reduced-motion:reduce){.lp-avail.reveal-io.pending .av-seg{transform:none;opacity:1;}}
@media (max-width:700px){.av-seg{flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;padding:10px 14px;}}

/* hero photo: pre-cropped (hair near the top edge, eyes above centre, first button in frame), brightened */
.lp-photo-frame img{object-position:center top;}
@media (max-width:980px){
  .lp-photo-frame{aspect-ratio:4/4.3;max-width:360px;}
  .lp-photo-frame img{transform:none;object-position:center top;}
}
@media (max-width:560px){
  .lp-photo-frame{aspect-ratio:4/4.3;max-width:none;}
  .lp-photo-frame img{transform:none;}
}


/* ── calmer type (2026-09-23): three families, italics once, no bold inside running text ── */
/* Archivo is gone — kickers, tags and labels are set in Public Sans (replaced above) */
/* mono is for numbers and dates only */
.lp-place,.lp-stations em,.eq-tag,.mini-check .ph,.cs-r,.mx-axes,.mx-name,.field-title,.fn-t{font-family:'Public Sans',system-ui,sans-serif;}
.lp-place{letter-spacing:.02em;font-size:12.5px;}
.lp-stations em{font-weight:500;letter-spacing:.02em;}
/* italics: only the second beat of the landing headline */
em,i,.case-note,.motto p,.cs-period em{font-style:normal;}
.lp-hero h1 .h1-accent{font-style:italic;}
/* no bold words inside running text */
p strong,li strong,.case-section p strong,.case-section li strong,.case-callout strong,td strong{font-weight:inherit;color:inherit;}
.cv-entry ul li strong,.cv-facts dd strong{font-weight:inherit;color:inherit;}

/* availability scale Jan 2027 – Mar 2028: 15 months, year labels centred under their months */
.av-bar,.av-ticks{grid-template-columns:repeat(15,1fr);}
.av-ticks span.yr-start{border-left:1px solid var(--line);}
.av-years{grid-template-columns:12fr 3fr;gap:4px;margin-top:6px;font-size:13px;font-weight:600;color:var(--ink-soft);}
.av-years span{text-align:center;border-top:1px solid var(--line);padding-top:5px;}
.av-years span:last-child{text-align:center;border-left:1px solid var(--line);}

/* stations: four equal fields across the width, each a link */
.lp-stations-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;}
.lp-stations-grid .st{display:flex;flex-direction:column;gap:3px;padding:4px 18px 4px;border-left:1px solid var(--line);color:var(--ink);transition:color .2s ease;}
.lp-stations-grid .st:first-child{border-left:none;padding-left:0;}
.lp-stations-grid .st b{font-size:14px;font-weight:700;letter-spacing:.02em;}
.lp-stations-grid .st span{font-size:12.5px;color:var(--ink-faint);font-weight:500;letter-spacing:0;padding:0;border:none;}
.lp-stations-grid .st.is-upcoming b{color:var(--accent-ink);}
.lp-stations-grid .st:hover b{color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px;}
@media (max-width:700px){.lp-stations-grid{grid-template-columns:1fr 1fr;row-gap:14px;}.lp-stations-grid .st:nth-child(3){border-left:none;padding-left:0;}}
/* impact statements instead of bare figures */
.lp-impact .lp-stat-value{font-size:clamp(24px,2.6vw,32px);letter-spacing:-0.015em;}
.lp-impact .lp-stat-label{max-width:32ch;}

/* lede in paragraphs + availability full-time tag (round 3) */
.lp-lede-block{max-width:52ch;display:grid;gap:12px;}
.lp-hero .lp-lede-block .lp-lede{margin:0;}
.lp-hero .lp-lede.lp-lede-first{font-size:18.5px;line-height:1.5;color:#EDEAE0;}
.lp-hero .lp-lede.lp-lede-aside{font-size:14.5px;color:#9E9B8C;padding-top:10px;border-top:1px solid rgba(255,255,255,.12);}
.av-title-wrap{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;}
.av-ft{font-size:13px;font-weight:600;color:var(--accent-ink);padding:3px 10px;border-radius:999px;background:var(--surface-2);}
@media (max-width:700px){.av-bar{grid-template-columns:1fr;}.av-ticks,.av-years{display:none;}.av-title-wrap{gap:10px;}}
/* wider lede (14:41) */
.lp-lede-block{max-width:none;}
.lp-hero .lp-lede-block .lp-lede{max-width:none;text-wrap:pretty;}

/* Career path in the dark band (replaces the three figures, 15:50) */
.lp-path{max-width:1180px;margin:clamp(30px,4vw,52px) auto 0;padding:26px 32px 4px;border-top:1px solid #2F2D23;position:relative;}
.path-track{position:absolute;left:32px;right:32px;top:32px;height:2px;pointer-events:none;}
.path-track::before{content:"";position:absolute;left:5px;width:75%;top:0;height:2px;background:#2F2D23;}
.path-fill{position:absolute;left:5px;top:0;height:2px;width:50%;background:#9CC4AC;transform-origin:left;}
.path-next{position:absolute;left:calc(50% + 5px);top:0;height:2px;width:25%;background:repeating-linear-gradient(90deg,#9CC4AC 0 6px,transparent 6px 12px);opacity:.75;}
.path-stops{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));}
.path-stops .stop{display:flex;flex-direction:column;gap:3px;padding-right:18px;color:#EDEAE0;text-decoration:none;}
.path-stops .dot{width:12px;height:12px;border-radius:50%;background:#9CC4AC;box-shadow:0 0 0 4px #17160F;margin-bottom:12px;}
.path-stops .is-next .dot{background:#17160F;border:2px solid #9CC4AC;}
.path-stops .yr{font-size:12px;color:#8F8C7E;letter-spacing:.04em;}
.path-stops b{font-size:17px;font-weight:600;color:#F4F1E8;}
.path-stops .role{font-size:13px;color:#A9A696;}
.path-stops .is-next b{color:#9CC4AC;}
.path-stops .stop:hover b{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;}
/* animation: line draws, stops light up in turn */
.lp-path.reveal-io.pending .path-fill{transform:scaleX(0);}
.lp-path.reveal-io.pending .path-next{opacity:0;}
.lp-path.reveal-io.pending .path-stops li{opacity:.25;}
.lp-path.reveal-io.pending .path-stops .dot{transform:scale(.4);}
.lp-path.reveal-io.pending.visible .path-fill{transform:scaleX(1);transition:transform 1.3s cubic-bezier(.4,.1,.2,1) .15s;}
.lp-path.reveal-io.pending.visible .path-next{opacity:.75;transition:opacity .6s ease 1.5s;}
.lp-path.reveal-io.pending.visible .path-stops li{opacity:1;transition:opacity .5s ease calc(.15s + var(--i) * .43s);}
.lp-path.reveal-io.pending.visible .path-stops .dot{transform:none;transition:transform .45s cubic-bezier(.3,1.6,.5,1) calc(.15s + var(--i) * .43s);}
.lp-path.reveal-io.pending{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.lp-path.reveal-io.pending .path-fill{transform:none}.lp-path.reveal-io.pending .path-next,.lp-path.reveal-io.pending .path-stops li{opacity:1}.lp-path.reveal-io.pending .path-stops .dot{transform:none}}
@media (max-width:700px){
  .lp-path{padding:22px 20px 0;}
  .path-track{left:20px;right:auto;top:22px;bottom:18px;width:2px;height:auto;}
  .path-track::before{left:5px;top:5px;width:2px;height:75%;}
  .path-fill{left:5px;top:5px;width:2px;height:50%;transform-origin:top;}
  .path-next{left:5px;top:calc(50% + 5px);width:2px;height:25%;background:repeating-linear-gradient(180deg,#9CC4AC 0 6px,transparent 6px 12px);}
  .lp-path.reveal-io.pending .path-fill{transform:scaleY(0);}
  .lp-path.reveal-io.pending.visible .path-fill{transform:scaleY(1);}
  .path-stops{grid-template-columns:1fr;gap:18px;}
  .path-stops .stop{display:grid;grid-template-columns:12px auto 1fr;column-gap:14px;align-items:baseline;padding:0;}
  .path-stops .dot{grid-row:1 / span 2;margin:3px 0 0;align-self:start;}
  .path-stops .yr{grid-column:2;grid-row:1 / span 2;align-self:start;padding-top:1px;}
  .path-stops b{grid-column:3;}
  .path-stops .role{grid-column:3;}
}
@media (max-width:700px){
  .path-track{display:none;}
  .path-stops li{position:relative;}
  .path-stops li:not(:last-child)::after{content:"";position:absolute;left:5px;top:17px;width:2px;height:calc(100% + 6px);background:#9CC4AC;transform-origin:top;}
  .path-stops li:nth-child(3)::after{background:repeating-linear-gradient(180deg,#9CC4AC 0 5px,transparent 5px 10px);opacity:.8;}
  .lp-path.reveal-io.pending .path-stops li::after{transform:scaleY(0);}
  .lp-path.reveal-io.pending.visible .path-stops li::after{transform:scaleY(1);transition:transform .45s ease calc(.35s + var(--i) * .43s);}
}
.lp-path{padding-bottom:clamp(34px,4vw,48px);}
@media (max-width:700px){.lp-path{padding-bottom:30px;}}
/* the solid line runs to today (late 2026); only the last stretch to RÖDL stays dashed */
.path-fill{width:71%;}
.path-next{left:calc(71% + 5px);width:4%;}
@media (max-width:700px){
  .path-stops li:nth-child(3)::after{background:linear-gradient(180deg,#9CC4AC 0 72%,transparent 72%),repeating-linear-gradient(180deg,#9CC4AC 0 4px,transparent 4px 8px);opacity:1;}
}

/* audit 21:15 — the band's top rule starts and ends with the content, not the padding */
.lp-path{border-top:0;background:linear-gradient(#2F2D23,#2F2D23) 0 0/100% 1px no-repeat;background-origin:content-box;background-position:0 -26px;}
@media (min-width:701px){
  /* RÖDL sits at the right edge, so the line spans the full width */
  .path-stops{grid-template-columns:repeat(3,minmax(0,1fr)) 130px;}
  .path-track{left:37px;right:auto;width:calc(100% - 64px - 130px);}
  .path-track::before{left:0;width:100%;}
  .path-fill{left:0;width:92%;}
  .path-next{left:92%;width:8%;}
}
@media (max-width:700px){.lp-path{background-position:0 -22px;}}
/* equity: breathing room between the empty-reports box and the CV box */
.eq-empty{margin-bottom:28px;}

/* site.css is now a straight copy of the portfolio master; keep the CV layout as it was */
.cv-timeline.spine{margin:0;}
.cv-role{text-wrap:balance;}
.eq-legal{margin-top:18px;font-size:12.5px;}
.eq-legal a,.cv-note a,.lp-foot a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;}
/* language switch DE | EN */
.lp-bar-right{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:flex-end;}
.lang-switch{display:inline-flex;align-items:center;gap:7px;font-family:'Public Sans',system-ui,sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.04em;}
.lang-switch b{font-weight:700;color:var(--ink);}
.lang-switch a{color:var(--ink-faint);text-decoration:none;}
.lang-switch a:hover{color:var(--accent-ink);}
.lang-switch span{color:var(--line);}
.lp-hero .lang-switch b{color:#F4F1E8;}
.lp-hero .lang-switch a{color:#8C8A7C;}
.lp-hero .lang-switch a:hover{color:#9CC4AC;}
.lp-hero .lang-switch span{color:#3A382E;}
.brandbar .lang-switch{margin-left:18px;}
.pill.pill-lang{background:transparent;border:1px solid var(--line);color:var(--ink-faint);}
@media (max-width:700px){.lp-bar-right{gap:10px;}}
@media print{.lang-switch{display:none;}}
.brandbar .back-link{margin-left:auto;}
