/* Framheim Capital Partners, framheim.com
   Survey system: navy ink on white, hairline rules, one signal orange reserved for markers.
   Fonts are self-hosted (SIL Open Font License, see assets/fonts). */

@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:200 900;font-display:swap;src:url(/assets/fonts/source-serif-4-latin-opsz-normal.woff2) format("woff2")}
@font-face{font-family:"Source Serif 4";font-style:italic;font-weight:200 900;font-display:swap;src:url(/assets/fonts/source-serif-4-latin-opsz-italic.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(/assets/fonts/inter-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2")}

:root{
  /* colour */
  --ink:#0B2545;        /* headings, rules, navy bands */
  --text:#262833;       /* body */
  --muted:#5B6472;      /* labels, captions */
  --rule:#D9DCE3;       /* row separators */
  --paper:#F5F6F8;      /* tinted bands */
  --bg:#FFFFFF;
  --signal:#D9480F;     /* markers only: nodes, crosshairs, active nav, focus */
  --signal-text:#B8420A;/* the rare signal used as text: link underlines */
  --on-ink:#D0D8E3;     /* body on navy */
  --on-ink-strong:#FFFFFF;
  --on-ink-muted:#A9B6C8;
  --on-ink-rule:#5E7391;
  --on-ink-signal:#F08C4A;
  /* type */
  --f-display:"Source Serif 4",Georgia,"Times New Roman",serif;
  --f-body:"Inter",-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --t-h1:clamp(40px,5vw,68px);
  --t-h2:clamp(28px,3vw,40px);
  --t-h3:24px;
  --t-lead:18px;
  --t-body:16px;
  --t-small:15px;
  --t-label:11px;
  /* space */
  --s-1:8px;--s-2:16px;--s-3:24px;--s-4:48px;--s-5:72px;--s-6:96px;
  --gutter:clamp(16px,4vw,48px);
  --max:1280px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 var(--t-body)/1.55 var(--f-body);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--ink);text-decoration:none}
a:hover{color:var(--signal-text)}
a:focus-visible{outline:2px solid var(--signal);outline-offset:3px}
h1,h2,h3{font-family:var(--f-display);font-weight:500;color:var(--ink);margin:0;text-wrap:balance}
h1{font-size:var(--t-h1);line-height:1.04;letter-spacing:-.015em}
h2{font-size:var(--t-h2);line-height:1.12}
h3{font-size:var(--t-h3);line-height:1.2}
p{margin:0}
.num{font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:12px 16px;z-index:10}
.skip:focus{left:16px}

/* layout */
.wrap{max-width:var(--max);margin:0 auto;padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px))}
.section{padding-block:var(--s-5)}
.section.tight{padding-block:var(--s-4)}
.band-paper{background:var(--paper);border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.band-ink{background:var(--ink);color:var(--on-ink)}
.band-ink h1,.band-ink h2,.band-ink h3{color:var(--on-ink-strong)}
.rule-top{border-top:1px solid var(--ink)}
.split{display:flex;flex-wrap:wrap;gap:var(--s-4)}
.split>.side{flex:1 1 280px;min-width:0}
.split>.main{flex:2 1 560px;min-width:0}
/* two-column heads: the right column starts level with the heading, not the label above it */
@media (min-width:1000px){.split.head>.main{padding-top:calc(var(--t-label) * 1.4 + var(--s-3))}}
.stack{display:flex;flex-direction:column;gap:var(--s-2)}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:var(--s-3) var(--s-4)}

/* labels and captions: mono, grey; orange is not a label colour */
.label{font:500 var(--t-label)/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.band-ink .label{color:var(--on-ink-muted)}
.kicker{margin-bottom:var(--s-3)}
.lead{font-size:var(--t-lead);line-height:1.6;max-width:36em}
.small{font-size:var(--t-small)}
.caption{font:400 var(--t-label)/1.5 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-top:1px solid var(--rule);padding-top:10px}
.band-ink .caption{color:var(--on-ink-muted);border-top-color:var(--on-ink-rule)}
.source{font:400 var(--t-label)/1.6 var(--f-mono);letter-spacing:.04em;color:var(--muted)}

/* header */
.site-head{border-bottom:1px solid var(--ink)}
.site-head .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-2) var(--s-4);padding-block:22px}
.fcp-nav{display:flex;flex-wrap:wrap;gap:var(--s-1) 28px;font:500 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}
.fcp-nav a{padding:14px 0}
.fcp-nav a[aria-current="page"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--signal)}
.fcp-logo{display:block;width:clamp(120px,13vw,176px);aspect-ratio:480/97;max-width:100%;background:var(--ink);-webkit-mask:url(/assets/fcp-logo.png) top right/contain no-repeat;mask:url(/assets/fcp-logo.png) top right/contain no-repeat}
.fcp-logo.on-ink{background:#FFFFFF}
@media (max-width:640px){
  .site-head .wrap{flex-direction:column-reverse;align-items:flex-end;gap:var(--s-1)}
  .fcp-nav{align-self:stretch;justify-content:space-between;gap:0;font-size:11px}
}

/* buttons and text links */
.actions{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;min-height:48px;padding:0 24px;font-weight:500;font-size:var(--t-small);border:1px solid var(--ink)}
.btn.solid{background:var(--ink);color:#fff}
.btn.line{color:var(--ink)}
.band-ink .btn.line{border-color:var(--on-ink-muted);color:#fff}
.textlink{display:inline-block;padding:10px 0;font-weight:500;border-bottom:1px solid var(--signal-text)}
.band-ink .textlink{color:#fff;border-bottom-color:var(--on-ink-signal)}

/* hero */
.hero{display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center;padding-block:clamp(40px,6vw,88px) var(--s-4)}
.hero>.text{flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:28px}
.hero>.figure{flex:1 1 420px;min-width:0;margin:0;display:flex;flex-direction:column;gap:12px}
.hero h1{max-width:15em}
.page-hero{padding-block:clamp(40px,6vw,88px) var(--s-4)}
.page-hero h1{max-width:16em;margin-bottom:var(--s-3)}

/* specification table: mono label, serif value, sans detail */
.spec{border-top:1px solid var(--ink);margin:0}
.spec>div{display:flex;flex-wrap:wrap;gap:var(--s-1) 32px;padding:20px 0;border-bottom:1px solid var(--rule)}
.spec dt{flex:0 0 180px;padding-top:5px}
.spec dd{flex:1 1 300px;min-width:0;margin:0}
.spec .value{font-family:var(--f-display);font-size:22px;color:var(--ink);line-height:1.3}
.spec .detail{font-size:var(--t-small);margin-top:2px}

/* network schematic */
.network{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--s-4) 28px}
.network .line-head{border-top:2px solid var(--ink);padding-top:14px}
.network .line-name{font-family:var(--f-display);font-size:22px;color:var(--ink);margin:2px 0 18px}
.fcp-line{position:relative;border-left:2px solid var(--ink);margin:0 0 0 4px;padding:2px 0 2px 16px;list-style:none;display:flex;flex-direction:column;gap:20px}
/* markers sit on the line: line centre is 1px inside the ul edge; li starts 18px in; 10px marker */
.fcp-line>li{position:relative;font-size:var(--t-small);line-height:1.5;font-weight:500;color:var(--ink)}
.fcp-line>li::before{content:"";position:absolute;left:-22px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--bg);border:2px solid var(--signal)}
.fcp-line>li.open{font-weight:400;color:var(--muted);font-size:14px;line-height:1.5}
.fcp-line>li.open::before{border:2px dashed #8A93A3}
@media (max-width:640px){.network{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4) 20px}}

/* drawing sheets (playbooks) */
.sheets{border-top:1px solid var(--on-ink-rule)}
.sheet{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-4);padding:36px 0;border-bottom:1px solid var(--on-ink-rule);transition:background-color .25s ease}
.sheet .mark{flex:0 0 200px;display:flex;flex-direction:column;gap:14px}
.sheet .mark svg{width:140px;height:auto;stroke:var(--on-ink-signal);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.sheet .body{flex:1 1 440px;min-width:0;display:flex;flex-direction:column;gap:12px}
.sheet .body p{max-width:40em}
.sheet .fit{flex:0 0 200px}
.sheet .fit .value{color:#fff;font:400 var(--t-label)/1.8 var(--f-mono);letter-spacing:.1em;text-transform:uppercase}
.sheet:hover{background-color:rgba(255,255,255,.03)}
.sheets.compact .sheet{padding:28px 0}
.sheets.compact .sheet .fit{display:none}

/* operating levers */
.levers{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--s-4) 28px}
.levers li{position:relative;border-top:2px solid var(--ink);padding-top:22px;display:flex;flex-direction:column;gap:10px}
.levers li::before{content:"";position:absolute;top:-6px;left:0;width:10px;height:10px;border-radius:50%;background:var(--bg);border:2px solid var(--signal)}
.levers .name{font-family:var(--f-display);font-size:22px;color:var(--ink)}
@media (max-width:640px){
  .levers{grid-template-columns:1fr;gap:28px;border-left:2px solid var(--ink);margin-left:6px;padding-left:22px}
  .levers li{border-top:0;padding-top:0}
  .levers li::before{top:3px;left:-28px}
}

/* figures and photos */
.photo img{width:100%;height:clamp(240px,32vw,460px);object-fit:cover}
.photo{margin:0;display:flex;flex-direction:column;gap:10px}
.fcp-map{width:100%;max-width:560px;height:auto;align-self:center}
.fcp-map .fcp-city text{font-family:var(--f-mono)}
.fcp-route{width:100%;max-width:560px;height:auto;align-self:center}
.fcp-route text{font-family:var(--f-mono)}
@media (max-width:640px){.fcp-map text{font-size:15px}}

/* figures with their sources */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:0 32px;border-top:1px solid var(--ink)}
.plans>div{padding:24px 0;border-bottom:1px solid var(--rule);display:flex;flex-direction:column;gap:10px}
.plans .figure-num{font-family:var(--f-display);font-size:clamp(28px,2.4vw,34px);line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}

/* timeline */
.timeline{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}
.timeline li{display:flex;gap:var(--s-3);padding:18px 0;border-bottom:1px solid var(--rule)}
.timeline .when{flex:0 0 120px}
.timeline .what{color:var(--ink)}

/* team */
.person{display:flex;flex-wrap:wrap;gap:var(--s-3) var(--s-4);border-top:1px solid var(--ink);padding-top:32px}
.person>img{flex:0 1 320px;min-width:240px;height:400px;object-fit:cover}
.person .about{flex:1 1 480px;min-width:0;display:flex;flex-direction:column;gap:14px}
.person h2{font-size:40px;line-height:1.1}
.person .bio{font-size:17px;line-height:1.65;max-width:38em}
.career{width:100%;max-width:38em;border-collapse:collapse;font-size:var(--t-small)}
.career th,.career td{text-align:left;padding:9px 16px 9px 0;border-bottom:1px solid var(--rule);vertical-align:top}
.career th{font:500 var(--t-label)/1.4 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink);width:45%}
.contacts{display:flex;flex-wrap:wrap;gap:4px 32px;border-top:1px solid var(--rule);padding-top:8px}
.contacts a{padding:10px 0;font-size:var(--t-small)}
.mini-people{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:32px}
.mini{display:flex;flex-wrap:wrap;gap:20px;border-top:1px solid var(--ink);padding-top:20px}
.mini img{flex:0 0 160px;width:160px;height:200px;object-fit:cover}
.mini .about{flex:1 1 200px;min-width:0;display:flex;flex-direction:column;gap:6px}

/* contact */
.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;align-self:flex-start;border-top:1px solid var(--on-ink-rule)}
.contact-card{display:flex;flex-direction:column;gap:2px;padding:24px 0;border-bottom:1px solid var(--on-ink-rule)}
.contact-card .label{margin-bottom:6px}
.contact-card .who{font-family:var(--f-display);font-size:24px;color:#fff;margin-bottom:8px}
.contact-card a{color:#fff;padding:6px 0;width:fit-content}
@media (max-width:640px){.contact-grid{grid-template-columns:1fr}}

/* levers on navy, and the names-only row on the homepage */
.band-ink .levers li{border-top-color:#fff}
.band-ink .levers li::before{background:var(--ink);border-color:var(--on-ink-signal)}
.band-ink .levers .name{color:#fff}
.band-ink .levers p{color:var(--on-ink)}
.levers.names{gap:var(--s-3) 28px}
.levers.names .name{font-size:20px}
@media (max-width:640px){.band-ink .levers{border-left-color:#fff}.levers.names{gap:18px}}
.btn.solid.on-ink{background:#fff;color:var(--ink);border-color:#fff}
.btn.solid.on-ink:hover{background:#E8ECF2;color:var(--ink)}

/* homepage partner strip */
a.mini{color:inherit}
a.mini:hover .who{color:var(--signal-text)}
.mini .who{font-family:var(--f-display);font-size:24px;color:var(--ink);transition:color .2s ease}
.mini .about p{margin-top:6px}

/* footer */
.site-foot{background:var(--ink);color:var(--on-ink);border-top:1px solid var(--on-ink-rule)}
.site-foot .wrap{display:flex;flex-wrap:wrap;gap:32px 64px;align-items:flex-start;justify-content:space-between;padding-block:48px}
.site-foot .cols{display:flex;flex-wrap:wrap;gap:32px 64px}
.site-foot .col{display:flex;flex-direction:column;gap:4px;font-size:14px}
.site-foot .label{color:var(--on-ink-muted);margin-bottom:4px}
.site-foot a{color:#fff}
.site-foot .end{display:flex;flex-direction:column;align-items:flex-end;gap:16px}
.site-foot .legal{font:400 var(--t-label)/1.6 var(--f-mono);color:var(--on-ink-muted);text-align:right}
.site-foot .legal a{color:var(--on-ink-muted);border-bottom:1px solid var(--on-ink-rule)}

/* legal page */
.prose{max-width:40em;display:flex;flex-direction:column;gap:var(--s-2)}
.prose h2{font-size:28px;margin-top:var(--s-3)}
.prose ul{margin:0;padding-left:20px}

/* hover motion respects reduced-motion preferences */
.btn{transition:background-color .2s ease,color .2s ease,transform .2s ease}
.btn.solid:hover{background:#13315C;color:#fff}
.btn.line:hover{background:var(--ink);color:#fff}
.fcp-nav a{background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-position:0 calc(100% - 10px);background-size:0 1px;transition:background-size .3s ease,color .2s ease}
.fcp-nav a:hover{background-size:100% 1px}
@media (prefers-reduced-motion:no-preference){
  .btn:hover{transform:translateY(-1px)}
  .sheet:hover .mark svg{transform:translateX(6px)}
}