/* Deger Automation GmbH – Stylesheet (konsolidiert)
   Schriften lokal eingebunden (keine externen Server, DSGVO-freundlich) */
@font-face{font-family:"Barlow";src:url("fonts/barlow-latin-400-normal.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-latin-500-normal.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Barlow";src:url("fonts/barlow-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Semi Condensed";src:url("fonts/barlow-semi-condensed-latin-600-normal.woff2") format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Barlow Semi Condensed";src:url("fonts/barlow-semi-condensed-latin-700-normal.woff2") format("woff2");font-weight:700;font-display:swap}

/* ---------- Farben und Maße ---------- */
:root{
  --navy:#2000b6;      /* Logo-Blau */
  --navy-dark:#15077a;
  --cyan:#00cefa;      /* Logo-Cyan, nur Linien und Flächen */
  --link:#2000b6;
  --ink:#1b2733;
  --muted:#5a6876;
  --line:#dfe5eb;
  --steel:#f3f6f9;
  --paper:#ffffff;
  --bg:#ffffff;
  --band:#15077a; --band-ink:#ffffff; --band-muted:#c9ccf2;
  --shadow:0 1px 2px rgba(16,24,40,.05),0 8px 24px -12px rgba(16,24,40,.12);
  --r:10px;            /* Karten, Bilder */
  --r-sm:6px;          /* Buttons, Felder */
  --display:"Barlow Semi Condensed","Arial Narrow",Arial,sans-serif;
  --text:"Barlow","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --wrap:74rem;
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --link:#7fe3ff; --ink:#e6edf3; --muted:#a3b2c1; --line:#2a3b4f; --steel:#152335; --paper:#0f1b29; --bg:#0f1b29;
    --band:#120660; --band-muted:#bcc0ee; --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px -12px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"]{
  --link:#7fe3ff; --ink:#e6edf3; --muted:#a3b2c1; --line:#2a3b4f; --steel:#152335; --paper:#0f1b29; --bg:#0f1b29;
  --band:#120660; --band-muted:#bcc0ee; --shadow:0 1px 2px rgba(0,0,0,.3),0 8px 24px -12px rgba(0,0,0,.5);
}

/* ---------- Grundlagen ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5.5rem}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.65 var(--text);-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;height:auto}
a{color:var(--link);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{color:var(--navy-dark)}
:focus-visible{outline:3px solid var(--cyan);outline-offset:3px;border-radius:2px}
h1,h2,h3{font-family:var(--display);color:var(--ink);line-height:1.12;margin:0 0 .55em;letter-spacing:-.005em}
h1{font-size:clamp(2.2rem,1.5rem + 2.8vw,3.4rem);font-weight:700}
h2{font-size:clamp(1.7rem,1.35rem + 1.3vw,2.3rem);font-weight:700}
h3{font-size:1.35rem;font-weight:600;line-height:1.2}
p{margin:0 0 1em;max-width:68ch}
strong{font-weight:600}
figure{margin:0}
figcaption{font-size:.9rem;color:var(--muted);margin-top:.6rem}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 1.5rem}
.skip{position:absolute;left:-999px}
.skip:focus{left:1rem;top:1rem;background:var(--paper);padding:.5rem 1rem;z-index:10}

/* einheitlicher Weiterlesen-Link */
.more,.service a,a.more{display:inline-block;margin-top:.4rem;color:var(--link);font-weight:600;text-decoration:none}
.more:hover,.service a:hover{text-decoration:underline}

/* ---------- Kopf ---------- */
.site-head{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 90%,transparent);backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line)}
.site-head .wrap{display:flex;align-items:center;gap:1.5rem;min-height:4.5rem}
.brand{display:flex;align-items:center;text-decoration:none;margin-right:auto}
.brand img{display:block;height:3.4rem;width:auto}
.nav ul{list-style:none;margin:0;padding:0;display:flex;gap:1.4rem}
.nav a{text-decoration:none;color:var(--ink);font-weight:500;font-size:.98rem;padding:.35rem 0;border-bottom:2px solid transparent}
.nav a:hover,.nav a[aria-current]{border-color:var(--cyan);color:var(--ink)}
.head-call{font-weight:600;text-decoration:none;white-space:nowrap;color:var(--link)}
.menu{display:none}
@media (max-width:62rem){
  .nav,.head-call{display:none}
  .menu{display:block;position:relative}
  .menu summary{list-style:none;cursor:pointer;font-weight:600;padding:.5rem .9rem;border:1px solid var(--line);border-radius:var(--r-sm)}
  .menu summary::-webkit-details-marker{display:none}
  .menu ul{position:absolute;right:0;top:calc(100% + .5rem);list-style:none;margin:0;padding:.5rem 0;min-width:15rem;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
  .menu a{display:block;padding:.6rem 1.1rem;text-decoration:none;color:var(--ink)}
}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.4rem;font:600 1rem/1 var(--text);padding:.95rem 1.4rem;border-radius:var(--r-sm);text-decoration:none;border:2px solid var(--navy);background:var(--navy);color:#fff;cursor:pointer;transition:background .15s,border-color .15s}
.btn:hover{background:var(--navy-dark);border-color:var(--navy-dark);color:#fff}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--navy);color:var(--ink)}
.actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.75rem}

/* ---------- Abschnitte ---------- */
.section{padding:clamp(3.5rem,6vw,5.5rem) 0}
.section.alt{background:var(--steel)}
.intro{max-width:46rem;margin-bottom:2.5rem}
.intro p,.page-head p,.lead{color:var(--muted);font-size:1.15rem}
.intro p:last-child{margin-bottom:0}
.page-head{padding:clamp(2.75rem,5vw,4rem) 0 2.25rem;border-bottom:1px solid var(--line)}
.page-head p{max-width:58ch}
.crumbs{font-size:.9rem;color:var(--muted);margin-bottom:1rem}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.crumbs li+li::before{content:"/";margin-right:.35rem;color:var(--line)}
.crumbs a{color:var(--muted);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.prose > *{max-width:48rem}
.prose ul{padding-left:1.2rem}
.prose li{margin-bottom:.4rem}
.prose h2{margin-top:2.2rem}
.prose h2:first-child{margin-top:0}
.twocol{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:3rem;align-items:start}
@media (max-width:56rem){.twocol{grid-template-columns:1fr;gap:2rem}}

/* einheitliche Bilder */
.ba img,.gallery img,.pair img,.single img,.twocol figure img,.process figure img,.pillar>img,.hero-figure img,.portrait img{display:block;width:100%;object-fit:cover;border-radius:var(--r);background:var(--steel)}
.twocol figure img{aspect-ratio:4/3}

/* ---------- Hero ---------- */
.hero{padding:clamp(3rem,6vw,5.5rem) 0;border-bottom:1px solid var(--line)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);align-items:center}
.hero .lead{max-width:56ch}
@media (max-width:56rem){.hero .wrap{grid-template-columns:1fr}}
.hero-figure{position:relative}
.hero-figure img{aspect-ratio:4/3;box-shadow:0 24px 50px -28px rgba(21,7,122,.5)}
.hero-figure figcaption{position:absolute;left:1rem;right:1rem;bottom:1rem;margin:0;width:max-content;max-width:calc(100% - 2rem);background:rgba(255,255,255,.95);color:#1b2733;padding:.45rem .8rem;border-radius:var(--r-sm);font-size:.86rem}
.keyfacts{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin:1.6rem 0 0;padding:0;list-style:none;font-weight:500;color:var(--muted)}
.keyfacts li::before{content:"";display:inline-block;width:.5rem;height:.5rem;background:var(--cyan);margin-right:.55rem;transform:rotate(45deg) translateY(-2px)}

/* ---------- Karten (eine Familie) ---------- */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
@media (max-width:52rem){.pillars{grid-template-columns:1fr}}
.pillar,.card,.fnode,.mini>div,.migrate .col,.form,.plate,.callout{background:var(--paper);border:1px solid var(--line);border-radius:var(--r)}
.pillar,.card{box-shadow:var(--shadow);transition:border-color .15s,transform .15s}
.pillar{display:flex;flex-direction:column;overflow:hidden;text-decoration:none;color:var(--ink)}
.pillar>img{aspect-ratio:16/9;border-radius:0}
.pillar>div{padding:1.5rem 1.6rem 1.7rem;display:flex;flex-direction:column;flex:1}
.pillar h3{font-size:1.5rem;margin-bottom:.5rem}
.pillar p{color:var(--muted)}
.pillar .checks{margin-bottom:1.2rem}
.pillar .more{margin-top:auto}
.pillar:hover,.card:hover{border-color:var(--navy);color:var(--ink)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(16.5rem,1fr));gap:1.25rem}
.card{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);padding:1.4rem 1.5rem}
.card h3{margin-bottom:.4rem}
.card p{margin:0;color:var(--muted);font-size:.98rem}
.card .more{margin-top:auto;padding-top:.9rem}

/* Häkchenliste */
.checks{list-style:none;padding:0;margin:0 0 1rem}
.checks li{padding:.5rem 0 .5rem 1.75rem;position:relative;border-bottom:1px solid var(--line)}
.checks li:last-child{border-bottom:0}
.checks li::before{content:"";position:absolute;left:.2rem;top:1rem;width:.7rem;height:.38rem;border-left:2px solid var(--navy);border-bottom:2px solid var(--navy);transform:rotate(-45deg)}

/* Leistungszeilen */
.services{border-top:2px solid var(--ink)}
.service{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:1rem 3rem;padding:1.8rem 0;border-bottom:1px solid var(--line)}
.service h3{margin:0;font-size:1.45rem}
.service p{margin-bottom:.4rem}
@media (max-width:48rem){.service{grid-template-columns:1fr}}

/* Band (dunkel) */
.band{background:var(--band);color:var(--band-ink)}
.band h2,.band h3,.band h3 a{color:#fff}
.band h3 a{text-decoration:none}
.band h3 a:hover{text-decoration:underline}
.band p,.band li{color:var(--band-muted)}
.band .intro p{color:var(--band-muted)}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:2rem 2.5rem}
.cols>div{border-left:3px solid var(--cyan);padding-left:1.1rem}
.cols p{margin:0}
.band .btn{background:#fff;color:var(--navy);border-color:#fff}
.band .btn:hover{background:var(--cyan);border-color:var(--cyan);color:#0b0440}
.band .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.band .btn.ghost:hover{border-color:#fff;color:#fff}

/* Tags */
.tags{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;margin:0;list-style:none}
.tags li{border:1px solid var(--line);border-radius:999px;padding:.35rem .9rem;font-weight:500;font-size:.95rem;background:var(--paper)}

/* Referenzen */
.refs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(12.5rem,1fr));gap:1rem}
.refs a{display:flex;align-items:center;justify-content:center;height:6.5rem;padding:1rem 1.4rem;background:#fff;border:1px solid var(--line);border-radius:var(--r)}
.refs a:hover{border-color:var(--navy)}
.refs img{max-height:3.6rem;max-width:100%;width:auto;object-fit:contain;filter:grayscale(1);opacity:.75;transition:filter .2s,opacity .2s}
.refs a:hover img,.refs a:focus-visible img{filter:none;opacity:1}

/* Abschluss-CTA */
.cta{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:2rem;align-items:end}
.cta .actions{margin-top:0;justify-content:flex-end}
@media (max-width:48rem){.cta{grid-template-columns:1fr}.cta .actions{justify-content:flex-start}}
.callout{padding:1.6rem 1.8rem;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem 2rem;align-items:center;border-left:4px solid var(--navy)}
.callout p{margin:0;color:var(--muted)}
.callout h2{font-size:1.5rem;margin-bottom:.35rem}
@media (max-width:48rem){.callout{grid-template-columns:1fr}}

/* Vorher/Nachher, Galerie, Projekte */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:2rem}
.ba img{aspect-ratio:4/3}
.ba.tall img{aspect-ratio:3/4}
.ba figcaption::before{content:"";display:inline-block;width:.6rem;height:.6rem;border-radius:50%;margin-right:.45rem;background:#9aa6b2}
.ba figure:last-child figcaption::before{background:var(--cyan)}
@media (max-width:40rem){.ba{grid-template-columns:1fr}}
.case{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:2.5rem;align-items:start;padding:2rem 0;border-top:1px solid var(--line)}
.case:first-of-type{border-top:2px solid var(--ink)}
.case .ba{margin:0}
.case h3{font-size:1.5rem}
.case dl{margin:0 0 1rem;display:grid;grid-template-columns:auto 1fr;gap:.5rem 1rem}
.case dt{font-weight:600}
.case dd{margin:0;color:var(--muted)}
@media (max-width:56rem){.case{grid-template-columns:1fr}}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.gallery img{aspect-ratio:4/3}
.gallery .wide,.gallery .strip{grid-column:span 3}
.gallery .wide img{aspect-ratio:auto;max-height:30rem;object-fit:contain;background:#fff;border:1px solid var(--line)}
.gallery .strip img{aspect-ratio:auto}
@media (max-width:48rem){.gallery{grid-template-columns:1fr}.gallery .wide,.gallery .strip{grid-column:auto}}
.pair{display:grid;grid-template-columns:3fr 2fr;gap:1rem;padding-top:2.25rem}
.pair img{aspect-ratio:16/10;height:100%}
@media (max-width:40rem){.pair{grid-template-columns:1fr}}
.single{margin:1.5rem 0 0}
.single img{aspect-ratio:16/10}
.portrait img{max-width:26rem;aspect-ratio:4/5;box-shadow:var(--shadow)}
.contact-person .portrait img{max-width:14rem}

/* Datenblatt (ehemals Typenschild) */
.plate{position:relative;padding:1.6rem 1.7rem;box-shadow:var(--shadow);border-top:4px solid var(--navy)}
.plate .r1,.plate .r2{display:none}
.plate h2{font-size:1.25rem;margin:0 0 1rem;padding-bottom:.7rem;border-bottom:1px solid var(--line)}
.plate dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.6rem 1.2rem;font-size:.97rem}
.plate dt{font-weight:600}
.plate dd{margin:0;color:var(--muted)}
.plate .foot{margin:1.1rem 0 0;font-size:.88rem;color:var(--muted)}

/* Migrationspfad */
.migrate{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:1.25rem;align-items:center}
.migrate .col{padding:1.3rem 1.5rem}
.migrate .col h3{font-size:1.15rem;margin-bottom:.8rem}
.migrate ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.migrate li{display:flex;justify-content:space-between;gap:1rem;border-bottom:1px dashed var(--line);padding-bottom:.4rem}
.migrate li:last-child{border:0;padding:0}
.migrate li span{color:var(--muted);font-size:.92rem;text-align:right}
.migrate .col.to{border-color:var(--navy);box-shadow:inset 4px 0 0 var(--cyan)}
.migrate .arrow{width:3rem;height:3rem}
@media (max-width:48rem){.migrate{grid-template-columns:1fr}.migrate .arrow{transform:rotate(90deg);justify-self:center}}

/* Ablauf in Schritten (kompakt) */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1.25rem;counter-reset:s}
.steps li{counter-increment:s;padding-top:1rem;border-top:3px solid var(--navy)}
.steps li::before{content:counter(s);display:block;font:700 2rem/1 var(--display);color:var(--navy);margin-bottom:.5rem}
.steps strong{display:block;margin-bottom:.3rem}
.steps span{color:var(--muted);font-size:.95rem}
@media (max-width:56rem){.steps{grid-template-columns:1fr 1fr}}

/* Ablaufdiagramm */
.flow{--fl:var(--navy);max-width:46rem;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.fi{flex:none;display:grid;place-items:center;width:4rem;height:4rem;border-radius:50%;background:var(--steel);color:var(--navy)}
.fi svg{width:2.6rem;height:2.6rem}
.fnode{width:100%;display:flex;gap:1.1rem;align-items:center;padding:1rem 1.25rem}
.fnode h3{font-size:1.25rem;margin:0 0 .2rem}
.fnode p{margin:0;color:var(--muted);font-size:.97rem}
.vl{display:block;width:2px;min-height:1.6rem;background:var(--fl)}
.vl.grow{flex:1}
.fdecide{display:flex;align-items:center;gap:.9rem;padding:.8rem 1.4rem;border:2px dashed var(--fl);border-radius:999px;background:var(--paper);font-weight:600}
.fdecide p{margin:0}
.fdecide .fi{width:3rem;height:3rem;background:transparent}
.fdecide .fi svg{width:2.4rem;height:2.4rem}
.branch{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.branch::before,.branch::after{content:"";position:absolute;left:25%;right:25%;height:2px;background:var(--fl)}
.branch::before{top:0}.branch::after{bottom:0}
.branch + .fnode{margin-top:1.6rem;position:relative}
.branch + .fnode::before{content:"";position:absolute;top:-1.6rem;left:50%;width:2px;height:1.6rem;background:var(--fl)}
.lane{display:flex;flex-direction:column;align-items:center;padding:0 .6rem;text-align:center}
.lane .fnode{flex-direction:column;text-align:center;gap:.6rem;padding:1rem}
.lane .fnode h3{font-size:1.1rem}
.chip{display:inline-block;font-weight:600;font-size:.9rem;padding:.3rem .85rem;border-radius:999px;border:2px solid var(--fl);background:var(--paper)}
.chip.yes{border-color:#2e9e5b;color:#1f7a44}
.chip.no{border-color:#c77d12;color:#9a5d05}
.bypass{font-size:.95rem;color:var(--muted);padding:.5rem .4rem;max-width:13rem;background:var(--paper)}
.usp{border:2px solid var(--cyan) !important;box-shadow:0 10px 30px -18px rgba(0,180,230,.7)}
.usp .fi{background:color-mix(in srgb,var(--cyan) 22%,var(--paper))}
.badge{display:inline-block;font-size:.78rem;font-weight:600;color:#06324a;background:var(--cyan);padding:.15rem .55rem;border-radius:4px;margin-bottom:.35rem}
@media (max-width:36rem){
  .fnode{gap:.8rem;padding:.85rem}
  .fi{width:3.2rem;height:3.2rem}.fi svg{width:2.1rem;height:2.1rem}
  .lane{padding:0 .25rem}
  .lane .fnode p{display:none}
  .fdecide{border-radius:12px;padding:.7rem 1rem;font-size:.95rem}
}

/* Prozessliste */
.process{list-style:none;margin:0;padding:0}
.process>li{display:grid;grid-template-columns:5rem minmax(0,6fr) minmax(0,4fr);gap:1.25rem 2rem;padding:2rem 0;border-top:1px solid var(--line)}
.process h3{font-size:1.45rem;margin-bottom:.5rem}
.process .out{margin:.9rem 0 0;padding:.85rem 1rem;background:var(--steel);border-left:3px solid var(--cyan);border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:.97rem}
.process .out strong{display:block;font-size:.85rem;color:var(--muted);margin-bottom:.15rem}
.process figure img{aspect-ratio:4/3}
.process>li.usp{border-radius:var(--r);padding:2rem 1.25rem;margin:.5rem 0}
@media (max-width:56rem){.process>li{grid-template-columns:3.6rem minmax(0,1fr)}.process>li .fi{width:3.4rem;height:3.4rem}.process figure{grid-column:2}}

.mini{display:grid;gap:1rem}
.mini>div{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 1.25rem}
.mini h3{font-size:1.2rem;margin:0 0 .2rem}
.mini p{margin:0;color:var(--muted)}

/* FAQ */
.faq details{border-bottom:1px solid var(--line);padding:1.05rem 0}
.faq summary{cursor:pointer;font-weight:600;font-size:1.08rem;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:600 1.4rem/1 var(--text);color:var(--navy);transition:transform .15s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:.75rem 0 0;color:var(--muted)}

/* Kontakt */
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:2rem}
.contact h3{margin-bottom:.3rem}
.contact p{margin:0}
.big{font:600 1.45rem/1.3 var(--display)}
.big a{text-decoration:none}

/* Formular */
.form{position:relative;display:grid;gap:1rem;padding:1.6rem;box-shadow:var(--shadow)}
.form .row{display:grid;gap:.35rem}
.form .row.two{grid-template-columns:1fr 1fr;gap:1rem}
.form .row.two>div{display:grid;gap:.35rem}
@media (max-width:36rem){.form .row.two{grid-template-columns:1fr}}
.form label{font-weight:600;font-size:.95rem}
.form input,.form textarea{font:inherit;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-sm);padding:.75rem .85rem;width:100%}
.form input:focus,.form textarea:focus{outline:3px solid color-mix(in srgb,var(--cyan) 55%,transparent);outline-offset:0;border-color:var(--navy)}
.form textarea{resize:vertical;min-height:8rem}
.form .hint{margin:0;font-size:.9rem;color:var(--muted)}
.form .btn{justify-self:start}
.form .btn:disabled{opacity:.6;cursor:wait}
.form .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.status{padding:.8rem 1rem;border-radius:var(--r-sm);font-weight:500}
.status.err{background:#fdecea;color:#8a1c12;border:1px solid #f3b8b1}
.status.ok{background:#e7f6ec;color:#17603a;border:1px solid #a9dcbc}

/* ---------- Fuß ---------- */
.site-foot{background:var(--steel);border-top:1px solid var(--line);padding:3rem 0 2rem;font-size:.95rem;color:var(--muted)}
.site-foot .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1.75rem}
.site-foot strong{color:var(--ink);display:inline-block;margin-bottom:.35rem}
.site-foot ul{list-style:none;padding:0;margin:0}
.site-foot li{margin-bottom:.3rem}
.site-foot a{color:var(--muted);text-decoration:none}
.site-foot a:hover{color:var(--ink);text-decoration:underline}
.site-foot .legal{grid-column:1/-1;border-top:1px solid var(--line);padding-top:1.1rem;display:flex;flex-wrap:wrap;gap:1.25rem}

@media (prefers-reduced-motion:reduce){*{transition:none !important}}
.section .wrap>.ba.tall{max-width:46rem}
.prose ul.checks,.prose ul.tags{padding-left:0}
.hero .wrap{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
@media (max-width:56rem){.hero .wrap{grid-template-columns:1fr}}
.hero h1{font-size:clamp(2.2rem,1.4rem + 2.6vw,3.25rem)}
.twocol .portrait img,.portrait img{aspect-ratio:4/5;object-position:50% 20%}
.refs img[src*="ref-taktil"]{max-height:4.4rem}

/* Kundenkarte */
.map{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1rem;overflow:hidden}
.map img{display:block;width:100%;height:auto}
.map-eu{margin-top:1.5rem;align-items:center}
.legend{list-style:none;padding:0;margin:1rem 0}
.legend li{display:flex;align-items:center;gap:.7rem;padding:.35rem 0;color:var(--muted)}
.lg-dot,.lg-ring,.lg-land{flex:none;display:inline-block;width:.9rem;height:.9rem;border-radius:50%}
.lg-dot{background:#2000b6;border:2px solid #fff;box-shadow:0 0 0 1px #2000b6}
.lg-ring{border:3px solid #00cefa;background:transparent}
.lg-land{border-radius:3px;background:#c9c2f3}
.hint{font-size:.9rem;color:var(--muted)}

/* Ersatzteil-Katalog */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.ptools{display:grid;gap:1rem;margin-bottom:1.75rem}
.psearch input{font:inherit;width:100%;max-width:34rem;padding:.85rem 1rem;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink)}
.psearch input:focus{outline:3px solid color-mix(in srgb,var(--cyan) 55%,transparent);border-color:var(--navy)}
.chips-f{display:flex;flex-wrap:wrap;gap:.5rem}
.chip-f{font:500 .95rem var(--text);padding:.45rem .95rem;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer}
.chip-f:hover{border-color:var(--navy)}
.chip-f.on{background:var(--navy);border-color:var(--navy);color:#fff}
.pcount{margin:0;color:var(--muted);font-size:.95rem}
.plist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1rem}
.pcard{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.pcard[hidden]{display:none}
.pcard:hover{border-color:var(--navy)}
.pcard-link{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 1.2rem;text-decoration:none;color:var(--ink);flex:1}
.ppic{flex:none;display:grid;place-items:center;width:3.6rem;height:3.6rem;border-radius:var(--r-sm);background:var(--steel);color:var(--navy)}
.ppic svg{width:2.3rem;height:2.3rem}
.ppic.big{width:9rem;height:9rem;border-radius:var(--r)}
.ppic.big svg{width:5.5rem;height:5.5rem}
.pbody{display:flex;flex-direction:column;gap:.2rem;min-width:0}
.pbody strong{font:600 1.12rem/1.25 var(--display);overflow-wrap:anywhere}
.pfam{font-size:.82rem;color:var(--muted);font-weight:500;margin:0}
.pmeta{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.35rem}
.pcond{font-size:.8rem;font-weight:600;padding:.12rem .5rem;border-radius:4px;background:var(--steel);color:var(--muted)}
.pcond.c-neu{background:#e7f6ec;color:#17603a}
.pcond.c-generalueberholt{background:#e9e6fb;color:#2000b6}
.pprice{font-weight:600}
.pprice.big{font:700 2rem/1 var(--display);margin:1.2rem 0 .3rem}
.btn.ebay{border-radius:0;justify-content:center;padding:.8rem 1rem;font-size:.95rem}
.pcard .btn.ebay{border:0;border-top:1px solid var(--line);background:var(--steel);color:var(--navy)}
.pcard .btn.ebay:hover{background:var(--navy);color:#fff}
.pdetail .btn.ebay{border-radius:var(--r-sm)}
.pdetail{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2rem;align-items:start;margin-top:.5rem}
@media (max-width:40rem){.pdetail{grid-template-columns:1fr}.ppic.big{width:6rem;height:6rem}.ppic.big svg{width:3.6rem;height:3.6rem}}
.pdetail h1{font-size:clamp(1.9rem,1.4rem + 1.8vw,2.7rem)}
.pfacts{display:grid;grid-template-columns:auto 1fr;gap:.45rem 1.2rem;margin:0}
.pfacts dt{font-weight:600}
.pfacts dd{margin:0;color:var(--muted)}
.pempty{margin-top:1rem}
.ptax{margin-top:2rem}
.page-head .pprice.big{color:var(--ink);font-size:2rem}
.page-head .hint{font-size:.9rem;margin:0}
.page-head .pfam{font-size:.9rem;margin:0 0 .3rem}
.pdetail .actions+p{margin-top:1.25rem;font-size:1rem}
/* Katalog mit Fotos */
.pcard-link{flex-direction:column;gap:0;padding:0}
.pimg{display:block;aspect-ratio:4/3;background:#fff;border-bottom:1px solid var(--line)}
.pimg img{width:100%;height:100%;object-fit:contain;display:block}
.pimg.ppic{width:auto;height:auto;border-radius:0;display:grid;place-items:center;background:var(--steel)}
.pimg.ppic svg{width:3.5rem;height:3.5rem}
.pbody{padding:1rem 1.2rem 1.1rem}
.psub{font-size:.92rem;color:var(--muted);line-height:1.35}
.pbtns{display:grid;grid-template-columns:1fr auto;border-top:1px solid var(--line)}
.pcard .btn.ebay{border-top:0}
.btn.mailq{border:0;border-left:1px solid var(--line);border-radius:0;background:var(--paper);color:var(--ink);padding:.8rem 1rem;font-size:.95rem;justify-content:center}
.btn.mailq:hover{background:var(--steel);color:var(--navy)}
.plist{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr))}
.pdetail{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:2.5rem}
@media (max-width:48rem){.pdetail{grid-template-columns:1fr}}
.pgal-main img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:var(--r);display:block}
.pgal-thumbs{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.6rem}
.pgal-thumbs button{padding:0;border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;cursor:pointer;width:4.5rem;height:3.4rem;overflow:hidden}
.pgal-thumbs button:hover{border-color:var(--navy)}
.pgal-thumbs img{width:100%;height:100%;object-fit:contain}
.pdesc{margin-top:1.5rem}
.pdesc h2{font-size:1.2rem;margin-bottom:.4rem}
.pdesc p{margin:0 0 .3rem;color:var(--ink);font-size:1rem}
.pempty.callout{margin-top:1rem}
.pimg{aspect-ratio:auto}
.pimg img{aspect-ratio:4/3;height:auto;width:100%;object-fit:contain;background:#fff}
.pimg.ppic{aspect-ratio:4/3}
/* Hervorgehobener Artikel */
.feat-sec{padding-bottom:0}
.feat{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:2.5rem;align-items:center;background:var(--paper);border:2px solid var(--cyan);border-radius:var(--r);padding:1.75rem;box-shadow:0 18px 40px -24px rgba(0,180,230,.6)}
@media (max-width:48rem){.feat{grid-template-columns:1fr;gap:1.5rem}}
.feat-img{display:block}
.feat-img img{width:100%;aspect-ratio:4/3;object-fit:contain;background:#fff;border-radius:var(--r-sm);display:block}
.feat-body h2{margin:.4rem 0 .6rem}
.feat-body h2 a{color:var(--ink);text-decoration:none}
.feat-body h2 a:hover{text-decoration:underline}
.feat-body p{color:var(--muted)}
.feat .pprice.big{color:var(--ink);margin:1rem 0 .2rem}
.feat .hint{margin:0}
.plist-h{margin-bottom:1.25rem}
.twocol .portrait img,.portrait img{max-width:20rem}

/* Vereinheitlichung Typografie: zwei h3-Größen, eine Kleingröße für Karten */
.service h3,.pillar h3,.case h3,.process h3,.card h3,.cols h3,.feat-body h3{font-size:1.35rem}
.fnode h3,.lane .fnode h3,.mini h3,.migrate .col h3,.contact h3{font-size:1.15rem}
.callout h2,.plate h2,.pdesc h2,.feat-body h2{font-size:1.5rem}
.card p,.fnode p,.process .out,.steps span,.pcount,.psub,.tags li,.btn.ebay,.btn.mailq,.chip-f{font-size:.95rem}
.hint,figcaption,.crumbs,.plate .foot,.hero-figure figcaption,.pfam,.badge{font-size:.9rem}
.badge{font-size:.8rem}
.pdetail .btn.ebay{font-size:1rem;padding:.95rem 1.4rem}
.hero h1{font-size:clamp(2.2rem,1.5rem + 2.8vw,3.4rem)}
.pdesc p{font-size:1.0625rem}
/* Sprachumschaltung */
.lang{font:600 .85rem/1 var(--text);padding:.45rem .6rem;border:1px solid var(--line);border-radius:var(--r-sm);text-decoration:none;color:var(--ink);letter-spacing:.04em}
.lang:hover{border-color:var(--navy);color:var(--navy)}
@media (max-width:62rem){.lang{order:0}}