/* lecs.de – statisches Stylesheet, keine externen Abhängigkeiten */
:root{
  --ink:#1b262b; --muted:#56666d; --bg:#f3f6f7; --paper:#ffffff;
  --petrol:#0e3a46; --rule:#cfdadf; --signal:#1f8a70;
  --serif:"Iowan Old Style","Charter","Bitstream Charter","Sitka Text",Cambria,Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --w:62rem;
}
@media (prefers-color-scheme:dark){
  :root{--ink:#e3ebee;--muted:#9fb0b7;--bg:#0f1b20;--paper:#152329;--petrol:#0a2c35;--rule:#2b3e45;--signal:#4cc3a3}
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:1rem/1.6 var(--sans)}
a{color:var(--signal)}
a:focus-visible{outline:2px solid var(--signal);outline-offset:2px}
img{max-width:100%;height:auto;display:block}
.skip{position:absolute;left:-999px}
.skip:focus{left:1rem;top:1rem;background:var(--paper);padding:.5rem 1rem;z-index:10}

/* Kopf */
header.site{background:var(--petrol);color:#fff}
header.site .bar,header.site nav ul{max-width:var(--w);margin:0 auto;padding:0 1.25rem}
.bar{display:flex;align-items:baseline;gap:1.25rem;padding-top:1.1rem!important}
.brand{font:700 1.6rem/1 var(--serif);color:#fff;text-decoration:none;letter-spacing:.01em}
.brand span{color:#8fd3c1}
.bar .mail{margin-left:auto;color:#cfe3e8;font-size:.9rem}
.bar .lang{color:#fff;font-size:.9rem;border:1px solid #5d8791;border-radius:3px;padding:.1rem .5rem;text-decoration:none}
.bar .lang:hover{background:#ffffff1a}
nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:.25rem 1.5rem;padding-top:.8rem!important;padding-bottom:.9rem!important;margin:0}
nav a{color:#dcebef;text-decoration:none;padding:.2rem 0;border-bottom:2px solid transparent}
nav a:hover{color:#fff}
nav a[aria-current=page]{color:#fff;border-bottom-color:#8fd3c1}

/* Inhalt */
main{max-width:var(--w);margin:0 auto;padding:2.5rem 1.25rem 3rem}
h1,h2,h3,h4{font-family:var(--serif);line-height:1.25;color:var(--ink)}
h1{font-size:2.2rem;margin:0 0 .4rem}
h2{font-size:1.35rem;margin:2rem 0 .6rem}
h3{font-size:1.1rem;margin:1.4rem 0 .4rem}
h4{font-size:1rem;margin:1rem 0 .3rem;font-style:italic;font-weight:400}
.lead{color:var(--muted);font-size:1.15rem;max-width:44rem;margin:0 0 1.5rem}
ul{padding-left:1.2rem;margin:.3rem 0}
li{margin:.15rem 0}
.block{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:.4rem 1.4rem 1.2rem;margin:0 0 1.25rem}
.block h2{margin-top:1rem}
dl.kv{display:grid;grid-template-columns:max-content 1fr;gap:.2rem 1.2rem;margin:.4rem 0}
dl.kv dt{color:var(--muted)}
dl.kv dd{margin:0}

/* Startseite */
.hero{border-left:4px solid var(--signal);padding:.2rem 0 .2rem 1.2rem;margin-bottom:2rem}
.hero h1{font-size:clamp(2rem,5vw,3.1rem);max-width:18ch}
.welcome{font-size:1.6rem}
.intro{display:grid;grid-template-columns:minmax(0,20rem) 1fr;gap:2.5rem;align-items:start}
.portrait{margin:0}
.portrait img{border-radius:4px;border:1px solid var(--rule)}
.portrait figcaption{font-style:italic;color:var(--muted);margin-top:.4rem}
.ccie img{max-width:16rem;margin-bottom:1rem}
.ccie p{font-size:1.1rem;max-width:32rem}
.rent{font:600 1.35rem/1.3 var(--serif)!important;color:var(--signal)}

/* Zeitachse (Profil, Vita) */
.timeline{list-style:none;padding:0;margin:1.5rem 0 0;position:relative}
.timeline::before{content:"";position:absolute;left:8.25rem;top:.4rem;bottom:0;width:2px;background:var(--rule)}
.entry{display:grid;grid-template-columns:7.5rem 1fr;gap:0 1.75rem;margin:0 0 1.75rem;position:relative}
.entry::before{content:"";position:absolute;left:calc(8.25rem - 4px);top:.55rem;width:10px;height:10px;background:var(--paper);border:2px solid var(--signal);border-radius:2px}
.when{font:600 .95rem/1.4 var(--sans);font-variant-numeric:tabular-nums;color:var(--petrol);margin:.25rem 0 0;text-align:right;white-space:nowrap}
@media (prefers-color-scheme:dark){.when{color:#8fd3c1}}
.what{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:.9rem 1.2rem;min-width:0}
.role{font-weight:600;margin:0 0 .4rem}
.tasks{margin-bottom:.6rem}
dl.specs{margin:.6rem 0 0;border-top:1px solid var(--rule);padding-top:.5rem;font-size:.93rem}
dl.specs dt{color:var(--muted);margin-top:.45rem}
dl.specs dd{margin:0}
dl.specs dd ul{margin:.1rem 0}

/* Fuß */
footer.site{background:var(--petrol);color:#9fbfc7;font-size:.9rem}
footer.site .foot{max-width:var(--w);margin:0 auto;padding:1.25rem;display:flex;flex-wrap:wrap;gap:.5rem 2rem;align-items:baseline}
footer.site .copy{margin:0}
.legal-links{list-style:none;display:flex;gap:1.5rem;margin:0 0 0 auto;padding:0}
.legal-links a{color:#dcebef;text-decoration:none;border-bottom:1px solid #5d8791}
.legal-links a:hover{color:#fff}
.legal-links a[aria-current=page]{color:#fff;border-bottom-color:#8fd3c1}
.legal h2{font-size:1.1rem}
.legal p,.legal ul{max-width:44rem}

@media (max-width:40rem){
  .bar{flex-wrap:wrap}
  .bar .mail{margin-left:0;order:3;width:100%}
  .intro{grid-template-columns:1fr}
  .portrait{max-width:16rem}
  .timeline::before,.entry::before{display:none}
  .entry{grid-template-columns:1fr}
  .when{text-align:left;margin-bottom:.3rem}
  dl.kv{grid-template-columns:1fr;gap:0}
  dl.kv dd{margin-bottom:.4rem}
  .legal-links{margin-left:0}
}
@media print{header.site nav,.bar .lang{display:none}.what,.block{break-inside:avoid}}
.what ul{list-style:disc}.what ul ul{list-style:circle}
@media (min-width:52rem){
  dl.specs{display:grid;grid-template-columns:13rem 1fr;gap:.35rem 1.25rem}
  dl.specs dt{margin-top:0}
}
dl.specs dd>ul{margin:0}