/* Doberman Capital — one stylesheet for the whole site.
   Typography carries the design. No images, no icons, no gradients.
   Unit: 8px. Rules (1px lines) are the only decorative device. */

@font-face{font-family:"DC Serif";src:url(/fonts/serif-display.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"DC Grotesk";src:url(/fonts/grotesk.woff2) format("woff2");font-weight:400 500;font-style:normal;font-display:swap}

:root{
  --unit:8px;
  --ground:#F4F0E8;
  --ink:#1C1917;
  --ink-2:#57514B;
  --ink-3:#6E6861;
  --rule:#D8D1C5;
  --accent:#1F3B63;
  --serif:"DC Serif",Georgia,"Times New Roman",serif;
  --sans:"DC Grotesk",-apple-system,"Helvetica Neue",Arial,sans-serif;
  --measure:34em;
  --gutter:clamp(20px,6vw,120px);
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root{
    --ground:#171412;
    --ink:#ECE6DC;
    --ink-2:#B3ABA1;
    --ink-3:#9A928A;
    --rule:#3A3531;
    --accent:#9DB6DE;
  }
}

*,*::before,*::after{box-sizing:border-box}
html{font-size:17px;-webkit-text-size-adjust:100%}
@media (min-width:48em){html{font-size:18px}}
body{
  margin:0;
  background:var(--ground);
  color:var(--ink);
  font-family:var(--sans);
  font-weight:400;
  line-height:1.6;
  font-feature-settings:"kern","liga","calt";
  text-rendering:optimizeLegibility;
}

/* Text */
h1,h2,h3{font-family:var(--serif);font-weight:400;margin:0;letter-spacing:-0.005em;text-wrap:balance}
h1{font-size:clamp(2rem,1.1rem + 3.5vw,3.625rem);line-height:1.08}
h2{font-size:clamp(1.5rem,1.15rem + 1.4vw,2.125rem);line-height:1.2}
h3{font-size:1.3125rem;line-height:1.3}
p,li{max-width:var(--measure)}
p{margin:0 0 calc(var(--unit)*2)}
p:last-child{margin-bottom:0}
strong{font-weight:500}
ul,ol{margin:0;padding:0}
small,.small{font-size:0.875rem;line-height:1.55}
.muted{color:var(--ink-2)}
.eyebrow{font-size:0.875rem;color:var(--ink-3);letter-spacing:0.01em;margin:0 0 calc(var(--unit)*3)}
.lead{font-size:1.1875rem;line-height:1.55}
@media (min-width:48em){.lead{font-size:1.25rem}}

a{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.18em;text-decoration-color:color-mix(in srgb,var(--accent) 55%,transparent);transition:text-decoration-color 160ms ease,color 160ms ease}
a:hover{text-decoration-color:currentColor}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:1px}
::selection{background:color-mix(in srgb,var(--accent) 22%,var(--ground))}

/* Frame */
.wrap{padding-inline:var(--gutter);max-width:1360px}
.skip{position:absolute;left:var(--gutter);top:-100px;background:var(--ground);padding:var(--unit) calc(var(--unit)*2);color:var(--accent);z-index:2}
.skip:focus{top:var(--unit)}

header.site{padding-block:calc(var(--unit)*2);border-bottom:1px solid var(--rule)}
@media (min-width:48em){header.site{padding-block:calc(var(--unit)*3)}}
header.site .row{display:flex;flex-wrap:wrap;align-items:baseline;gap:calc(var(--unit)*1.5) calc(var(--unit)*4)}
.wordmark{font-family:var(--serif);font-size:1.25rem;letter-spacing:0.005em;color:var(--ink);text-decoration:none;white-space:nowrap}
.wordmark:hover{color:var(--ink)}
nav.site ul{display:flex;flex-wrap:wrap;gap:calc(var(--unit)*1.5) calc(var(--unit)*2);list-style:none}
nav.site a{color:var(--ink-2);text-decoration:none;font-size:0.875rem}
@media (min-width:48em){nav.site ul{gap:calc(var(--unit)*2) calc(var(--unit)*3)}nav.site a{font-size:0.9375rem}}
nav.site a:hover{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.18em}
nav.site a[aria-current="page"]{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.18em}
@media (min-width:48em){header.site .row{justify-content:space-between}}

main{display:block}
section{padding-block:calc(var(--unit)*7)}
section + section{border-top:1px solid var(--rule)}
@media (min-width:48em){section{padding-block:calc(var(--unit)*10)}}
.wrap > h2{margin-bottom:calc(var(--unit)*4)}
.wrap > h1{margin-bottom:calc(var(--unit)*3)}
.people + p{margin-top:calc(var(--unit)*4)}

/* Home, first screen */
.hero{padding-block:calc(var(--unit)*4) calc(var(--unit)*7)}
.hero .eyebrow{margin-bottom:calc(var(--unit)*2)}
.hero h1{max-width:14em;margin-bottom:calc(var(--unit)*2)}
.hero .lead{max-width:30em;margin-bottom:calc(var(--unit)*3);font-size:1rem;line-height:1.55}
.links{display:flex;flex-wrap:wrap;gap:calc(var(--unit)*1.5) calc(var(--unit)*4);list-style:none}
.links li{max-width:none}
@media (min-width:48em){.hero{padding-block:calc(var(--unit)*12) calc(var(--unit)*14)}.hero .eyebrow{margin-bottom:calc(var(--unit)*3)}.hero h1{margin-bottom:calc(var(--unit)*3)}.hero .lead{margin-bottom:calc(var(--unit)*4);font-size:1.25rem}}

/* Columns */
.cols{display:grid;gap:calc(var(--unit)*4);grid-template-columns:1fr}
.cols h3{margin-bottom:var(--unit)}
@media (min-width:48em){.cols{grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--unit)*6)}}

/* Two-column section: heading left, body right (principles, people) */
.split{display:grid;gap:calc(var(--unit)*3);grid-template-columns:1fr}
@media (min-width:60em){.split{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:calc(var(--unit)*8)}}

/* Principles */
.principles{list-style:none;counter-reset:p}
.principles li{max-width:none;padding-block:calc(var(--unit)*3);border-top:1px solid var(--rule);counter-increment:p}
.principles li:last-child{border-bottom:1px solid var(--rule)}
.principles h2{font-size:1.3125rem;line-height:1.3;margin-bottom:var(--unit)}
.principles h2::before{content:counter(p,decimal-leading-zero) " ";font-family:var(--sans);font-size:0.8125rem;color:var(--ink-3);letter-spacing:0.02em;display:block;margin-bottom:calc(var(--unit)*0.5)}
@media (min-width:60em){
  .principles li{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:calc(var(--unit)*8)}
  .principles h2{margin-bottom:0}
}

/* Numbered steps */
.steps{list-style:none;counter-reset:s}
.steps li{counter-increment:s;padding-block:calc(var(--unit)*2);border-top:1px solid var(--rule);display:grid;grid-template-columns:2.5em 1fr;gap:var(--unit)}
.steps li:last-child{border-bottom:1px solid var(--rule)}
.steps li::before{content:counter(s,decimal-leading-zero);font-size:0.8125rem;color:var(--ink-3);letter-spacing:0.02em;padding-top:0.3em}
.steps strong{display:block}

/* Plain lists */
.plain{list-style:none}
.plain li{padding-block:calc(var(--unit)*1.25);border-top:1px solid var(--rule)}
.plain li:last-child{border-bottom:1px solid var(--rule)}

/* Definition pairs (contact) */
.pairs{display:grid;grid-template-columns:1fr;gap:calc(var(--unit)*3);margin:0}
.pairs div{max-width:var(--measure)}
.pairs dt{color:var(--ink-3);font-size:0.875rem;margin-bottom:calc(var(--unit)*0.5)}
.pairs dd{margin:0}
@media (min-width:48em){.pairs{grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--unit)*5)}}

/* People */
.people{list-style:none;display:grid;gap:calc(var(--unit)*4);grid-template-columns:1fr}
.people li{max-width:none}
.people h3{margin-bottom:calc(var(--unit)*0.5)}
.people .role{color:var(--ink-2);margin-bottom:var(--unit)}
@media (min-width:48em){.people{grid-template-columns:repeat(3,minmax(0,1fr));gap:calc(var(--unit)*6)}}

.profiles{list-style:none}
.profiles > li{max-width:none;padding-block:calc(var(--unit)*5);border-top:1px solid var(--rule)}
.profiles > li:last-child{border-bottom:1px solid var(--rule)}
.profiles .role{color:var(--ink-2);margin-bottom:calc(var(--unit)*2)}
.profiles .bio p{max-width:var(--measure)}
.portrait{display:block;width:100%;max-width:280px;height:auto;aspect-ratio:4/5;object-fit:cover;margin-bottom:calc(var(--unit)*3);filter:grayscale(0.15) contrast(0.98)}
@media (min-width:60em){
  .profiles > li{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:calc(var(--unit)*8);align-items:start}
  .portrait{max-width:240px}
}

/* Footer */
footer.site{border-top:1px solid var(--rule);padding-block:calc(var(--unit)*5) calc(var(--unit)*8);color:var(--ink-2);font-size:0.875rem;line-height:1.55}
footer.site p{max-width:44em}
footer.site ul{list-style:none;display:flex;flex-wrap:wrap;gap:var(--unit) calc(var(--unit)*3);margin-top:calc(var(--unit)*2)}
footer.site li{max-width:none}
footer.site a{color:var(--ink-2)}
footer.site a:hover{color:var(--ink)}

/* Staging only: unresolved facts. Grep the built HTML for class="todo"; none may ship. */
.todo{border-bottom:1px dashed var(--accent);text-decoration:none}

/* Specimen page */
.swatches{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:calc(var(--unit)*2)}
.swatches li{max-width:none;border:1px solid var(--rule);padding:calc(var(--unit)*2)}
.swatches span{display:block;height:48px;margin-bottom:var(--unit)}
.sw-ground{background:var(--ground)}.sw-ink{background:var(--ink)}.sw-ink2{background:var(--ink-2)}.sw-ink3{background:var(--ink-3)}.sw-rule{background:var(--rule)}.sw-accent{background:var(--accent)}
.specimen-scale li{max-width:none;padding-block:calc(var(--unit)*2);border-top:1px solid var(--rule)}
