@font-face{font-family:"Source Serif 4";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/source-serif-4-600.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-500.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-weight:600;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-sans-600.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:400;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-mono-400.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-style:normal;font-display:swap;src:url(fonts/ibm-plex-mono-500.woff2) format("woff2")}
:root{
  --paper:#f7f4ee; --paper-2:#efeadf; --card:#fffdf9;
  --ink:#092b5a; --ink-2:#44546a; --line:#d9d1c0;
  --copper:#cb0720; --copper-soft:#fbe3e6;
  --check:#c46a00; --check-bg:#fff1d6;
  --serif:"Source Serif 4",Georgia,serif;
  --sans:"IBM Plex Sans",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
@media(max-width:600px){.wrap{padding:0 16px}}

/* Header */
header{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:5}
.bar{display:flex;align-items:center;justify-content:space-between;gap:24px;height:76px}
.logo{text-decoration:none;display:flex;align-items:center;gap:16px}
.logo img{height:46px;width:auto;display:block}
.logo small{font:400 12px/1 var(--mono);letter-spacing:.04em;color:var(--ink-2);border-left:1px solid var(--line);padding-left:12px}
nav{display:flex;gap:26px;font-size:15px;align-items:center}
nav a{text-decoration:none;color:var(--ink-2)}
nav a:hover{color:var(--ink)}
nav .keep{color:var(--ink);font-weight:500}
@media(max-width:860px){nav a:not(.keep){display:none}.logo small{display:none}}

/* Hero */
.hero{padding:84px 0 72px}
.hero .grid{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.eyebrow{font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--copper);margin:0 0 22px}
h1{font:600 clamp(38px,5.4vw,64px)/1.06 var(--serif);letter-spacing:-.015em;margin:0 0 26px;text-wrap:balance}
.lead{font-size:20px;line-height:1.55;color:var(--ink-2);max-width:34em;margin:0 0 34px}
.btns{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-block;padding:14px 22px;border-radius:3px;text-decoration:none;font-weight:500;font-size:16px;border:1px solid var(--ink)}
.btn.p{background:var(--ink);color:var(--paper)}
.btn.p:hover{background:#061f42}
.btn:hover{background:var(--paper-2)}

.flow{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:26px 26px 10px}
.flow h2{font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--ink-2);margin:0 0 20px}
.flow ol{list-style:none;margin:0;padding:0}
.flow li{display:grid;grid-template-columns:28px 1fr;gap:14px;padding-bottom:22px;position:relative}
.flow li::before{content:"";width:11px;height:11px;border:2px solid var(--ink);border-radius:50%;margin:6px 0 0 6px;background:var(--card);position:relative;z-index:1}
.flow li.us::before{background:var(--copper);border-color:var(--copper)}
.flow li:not(:last-child)::after{content:"";position:absolute;left:13px;top:18px;bottom:-6px;width:1px;background:var(--line)}
.flow b{display:block;font-weight:600;line-height:1.35}
.flow span{font-size:14.5px;color:var(--ink-2);line-height:1.45;display:block;margin-top:2px}
@media(max-width:860px){.hero{padding:52px 0}.hero .grid{grid-template-columns:1fr;gap:40px}}

/* Fakten */
.facts{border-block:1px solid var(--line);background:var(--paper-2)}
.facts .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.facts .wrap>div{padding:22px 20px 22px 0;font-size:15px;color:var(--ink-2);line-height:1.4}
.facts .wrap>div+div{padding-left:20px;border-left:1px solid var(--line)}
.facts b{display:block;color:var(--ink);font:500 13px/1.3 var(--mono);margin-bottom:5px}
@media(max-width:860px){.facts .wrap{grid-template-columns:1fr 1fr}.facts .wrap>div{padding:16px 12px 16px 0!important;border-left:0!important}}

section{padding:88px 0}
@media(max-width:860px){section{padding:56px 0}}
h2.t{font:600 clamp(28px,3.4vw,40px)/1.15 var(--serif);letter-spacing:-.01em;margin:0 0 16px;text-wrap:balance}
.sub{color:var(--ink-2);max-width:40em;margin:0 0 44px;font-size:18px}

/* Geschäftsfelder */
.fields{display:grid;grid-template-columns:1.25fr 1fr;gap:20px}
.field{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:30px}
.field.main{border-top:3px solid var(--copper)}
.field h3{font:600 23px/1.2 var(--serif);margin:0 0 10px}
.field p{margin:0 0 18px;color:var(--ink-2);font-size:16px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.tags li{font:400 13px/1 var(--mono);padding:7px 10px;background:var(--paper-2);border-radius:2px}
.field a{font-size:15px;font-weight:500;color:var(--copper)}
@media(max-width:860px){.fields{grid-template-columns:1fr}}

/* Lieferanten */
.sup{background:var(--ink);color:#e9e4d8}
.sup .eyebrow{color:#ff9aa5}
.sup .sub{color:#aeb9c6}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid #2a4a78;counter-reset:s}
.step{padding:26px 22px 8px 0;counter-increment:s}
.step+.step{padding-left:22px;border-left:1px solid #2a4a78}
.step::before{content:"0" counter(s);font:500 13px/1 var(--mono);color:#ff9aa5;display:block;margin-bottom:16px}
.step h3{font:600 19px/1.25 var(--serif);margin:0 0 8px;color:#fff}
.step p{font-size:15px;line-height:1.5;color:#aeb9c6;margin:0}
.step.hl{background:#113768;margin-top:-1px;border-top:2px solid #ff9aa5}
.step.hl{padding-right:22px}
.promise{display:grid;grid-template-columns:1fr 1fr;gap:14px 48px;margin-top:56px;padding:0;list-style:none}
.promise li{padding-left:28px;position:relative;font-size:16px;color:#d5dae1}
.promise li::before{content:"";position:absolute;left:0;top:.55em;width:14px;height:2px;background:#ff9aa5}
.promise b{color:#fff;font-weight:600}
@media(max-width:860px){.steps{grid-template-columns:1fr}.step,.step+.step{padding:22px 0 18px;border-left:0;border-bottom:1px solid #2a4a78}.step.hl{padding:22px 16px 18px}.promise{grid-template-columns:1fr}}

/* Compliance */
.comp{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:start}
.rules{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.rules li{padding:20px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:150px 1fr;gap:20px}
.rules b{font:500 13px/1.5 var(--mono);color:var(--copper);text-transform:uppercase;letter-spacing:.06em}
.rules span{font-size:16px;color:var(--ink-2)}
@media(max-width:860px){.comp{grid-template-columns:1fr;gap:24px}.rules li{grid-template-columns:1fr;gap:4px}}

/* Unternehmen */
.about{background:var(--paper-2);border-block:1px solid var(--line)}
.about .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:64px}
.about p{color:var(--ink-2);margin:0 0 16px}
.people{display:grid;gap:14px;align-content:start}
.person{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:20px 22px}
.person b{display:block;font:600 19px/1.3 var(--serif)}
.person em{font-style:normal;font:400 13px/1.4 var(--mono);color:var(--copper);display:block;margin-bottom:8px}
.person>span{font-size:15px;color:var(--ink-2);display:block;overflow-wrap:anywhere}
@media(max-width:860px){.about .grid{grid-template-columns:1fr;gap:32px}}

/* Kontakt */
.contact{text-align:left}
.contact .box{border:1px solid var(--ink);border-radius:4px;padding:44px;display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;background:var(--card)}
.contact h2{margin-bottom:10px}
.contact p{margin:0;color:var(--ink-2)}
.contact dl{margin:0;font-size:16px;display:grid;grid-template-columns:auto 1fr;gap:6px 18px}
.contact dt{font:400 13px/1.9 var(--mono);color:var(--ink-2)}
.contact dd{margin:0;font-weight:500}
@media(max-width:860px){.contact .box{grid-template-columns:1fr;padding:26px}}

footer{border-top:1px solid var(--line);padding:30px 0 44px;font-size:13.5px;color:var(--ink-2)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 32px}
footer a{margin-left:18px;text-decoration:none}
footer a:first-child{margin-left:0}
footer .fl{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
footer .fl img{height:34px;width:auto}

/* Rechtstexte */
.legal{padding:64px 0 88px}
.legal .wrap{max-width:760px}
.legal h1{font-size:clamp(32px,4vw,44px)}
.legal h2{font:600 22px/1.3 var(--serif);margin:40px 0 10px}
.legal p,.legal li{color:var(--ink-2)}
.legal a{color:var(--copper)}
.todo{background:var(--check-bg);border-bottom:2px dotted var(--check);padding:0 3px}

/* Lagerverkauf */
.tech{padding:64px 0 88px}
.tech h1{font-size:clamp(30px,4vw,46px);max-width:20em}
.subnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 40px;font-size:14.5px}
.subnav a{text-decoration:none;padding:9px 14px;border:1px solid var(--line);border-radius:3px;background:var(--card);color:var(--ink-2)}
.subnav a:hover{border-color:var(--ink)}
.subnav a.on{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.kats{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.kat{background:var(--card);border:1px solid var(--line);border-radius:4px;padding:28px;text-decoration:none;display:block}
.kat:hover{border-color:var(--ink)}
.kat h2{font:600 24px/1.2 var(--serif);margin:10px 0 8px}
.kat p{color:var(--ink-2);font-size:16px;margin:0 0 16px}
.kat .more{font-size:15px;font-weight:500;color:var(--copper)}
.pnr{font:500 13px/1 var(--mono);color:var(--copper)}
.pos{background:var(--card);border:1px solid var(--line);border-radius:4px;margin:0 0 16px;scroll-margin-top:96px}
.pos-h{display:flex;align-items:baseline;gap:14px;padding:18px 24px;border-bottom:1px solid var(--line)}
.pos-h h2{font:600 20px/1.3 var(--serif);margin:0}
.pos-b{display:grid;grid-template-columns:220px 1fr;gap:24px;padding:20px 24px 22px}
.pos-b>div:only-child{grid-column:1/-1}
.pics{display:grid;gap:8px;align-content:start}
.pics img{width:100%;height:auto;display:block;border:1px solid var(--line);border-radius:3px;background:#fff}
.pos table{width:100%;border-collapse:collapse;font-size:15.5px}
.pos th{font:500 11.5px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);text-align:left;padding:0 12px 10px 0}
.pos td{padding:9px 12px 9px 0;border-top:1px solid var(--line);vertical-align:top;color:var(--ink-2)}
.pos td:first-child{white-space:nowrap;color:var(--ink);font-weight:500;width:6.5em}
.pos td:last-child,.pos th:last-child{text-align:right;white-space:nowrap;padding-right:0;color:var(--ink);font-variant-numeric:tabular-nums}
.hint{font-size:14.5px;color:var(--ink-2);margin:12px 0 0}
.ask{display:inline-block;margin-top:16px;font-size:15px;font-weight:500;color:var(--copper)}
.terms{margin:40px 0 0;padding-top:24px;border-top:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.terms a{color:var(--copper)}
@media(max-width:860px){.kats{grid-template-columns:1fr}.pos-b{grid-template-columns:1fr;padding:16px}.pos-h{padding:16px}.pics{grid-template-columns:1fr 1fr}.tech{padding:40px 0 64px}}