/* KSTtim GmbH – Stylesheet
   Farben aus dem Logo (Orange, Rotorange) mit Dunkelblau und Schaltschrank-Grau.
   Schriften lokal gehostet (keine Google-Server). */

@font-face{font-family:"Barlow";font-weight:400;font-display:swap;src:url(barlow-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow";font-weight:400;font-display:swap;src:url(barlow-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow";font-weight:500;font-display:swap;src:url(barlow-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow";font-weight:500;font-display:swap;src:url(barlow-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow";font-weight:600;font-display:swap;src:url(barlow-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow";font-weight:600;font-display:swap;src:url(barlow-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(barlow-condensed-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-weight:600;font-display:swap;src:url(barlow-condensed-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(barlow-condensed-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Barlow Condensed";font-weight:700;font-display:swap;src:url(barlow-condensed-latin-ext-700-normal.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --paper:#F4F5F2;
  --cabinet:#E3E5E1;
  --rail:#C9CDC8;
  --ink:#16212E;
  --muted:#556170;
  --enzian:#1D4F86;
  --enzian-dark:#133A66;
  --night:#0F1E33;
  --night-2:#182C47;
  --signal:#F99300;
  --signal-dark:#E07F00;
  --brand-red:#F85520;
  --white:#FFFFFF;
  --line:#CFD3CE;
  --wrap:1200px;
  --gutter:clamp(16px,4vw,40px);
  --head:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --body:"Barlow","Segoe UI",Arial,sans-serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:1.0625rem;line-height:1.6}
img{max-width:100%;display:block}
a{color:var(--enzian)}
a:hover{color:var(--enzian-dark)}
:focus-visible{outline:3px solid var(--signal);outline-offset:2px}
h1,h2,h3{font-family:var(--head);font-weight:700;line-height:1.05;letter-spacing:-.005em;margin:0 0 .5em;color:var(--night)}
h1{font-size:clamp(2.5rem,6vw,4.6rem)}
h2{font-size:clamp(2rem,3.6vw,3rem)}
h3{font-size:1.6rem;font-weight:600}
p{margin:0 0 1em;max-width:68ch}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-9999px;top:0;background:var(--signal);color:var(--night);padding:.6em 1em;z-index:100}
.skip:focus{left:8px;top:8px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5em;font-family:var(--head);font-weight:600;font-size:1.2rem;letter-spacing:.01em;padding:.7em 1.3em;border:2px solid transparent;text-decoration:none;cursor:pointer;line-height:1.1;transition:background .15s,color .15s,border-color .15s}
.btn-primary{background:var(--signal);color:var(--night)}
.btn-primary:hover{background:var(--signal-dark);color:var(--night)}
.btn-ghost{border-color:currentColor;color:var(--white);background:transparent}
.btn-ghost:hover{background:var(--white);color:var(--night)}
.btn-dark{background:var(--night);color:var(--white)}
.btn-dark:hover{background:var(--enzian);color:var(--white)}
.btn svg{width:1.05em;height:1.05em;flex:none}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--white);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:24px;min-height:76px}
.brand{display:flex;align-items:center;text-decoration:none;color:var(--night);margin-right:auto}
.brand img{height:46px;width:auto}
@media (max-width:420px){.brand img{height:36px}}
.wordmark{display:flex;align-items:baseline;gap:.35em;font-family:var(--head);font-weight:700;font-size:1.9rem;line-height:1;border-left:6px solid var(--signal);padding-left:.4em}
.wordmark small{font-family:var(--body);font-weight:500;font-size:.9rem;color:var(--muted)}
.nav{display:flex;align-items:center;gap:4px}
.nav a,.nav .drop-toggle{font-family:var(--head);font-weight:600;font-size:1.15rem;color:var(--night);text-decoration:none;padding:.55em .8em;background:none;border:0;cursor:pointer;display:flex;align-items:center;gap:.3em}
.nav a:hover,.nav .drop-toggle:hover,.nav a[aria-current="page"]{color:var(--enzian)}
.nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--signal)}
.drop{position:relative}
.drop-toggle svg{width:.8em;height:.8em;transition:transform .15s}
.drop-menu{position:absolute;top:100%;left:0;min-width:240px;background:var(--white);border:1px solid var(--line);border-top:3px solid var(--signal);padding:6px 0;margin:0;list-style:none;display:none;box-shadow:0 12px 28px rgba(15,30,51,.12)}
.drop-menu a{padding:.5em 1em;font-size:1.1rem}
.drop:hover .drop-menu,.drop:focus-within .drop-menu,.drop.open .drop-menu{display:block}
.header-phone{white-space:nowrap}
.header-phone .btn{font-size:1.1rem;padding:.55em 1em}
.menu-toggle{display:none;background:none;border:2px solid var(--night);color:var(--night);width:46px;height:46px;align-items:center;justify-content:center;cursor:pointer}
.menu-toggle svg{width:24px;height:24px}

@media (max-width:980px){
  .menu-toggle{display:inline-flex}
  .header-phone .btn span{display:none}
  .header-phone .btn{padding:.55em .7em}
  .nav{position:absolute;left:0;right:0;top:100%;background:var(--white);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:8px var(--gutter) 16px;display:none;max-height:calc(100vh - 76px);overflow:auto}
  .nav.open{display:flex}
  .nav a,.nav .drop-toggle{font-size:1.3rem;padding:.6em 0;width:100%}
  .drop-menu{position:static;display:block;border:0;box-shadow:none;padding:0 0 0 1em;min-width:0}
  .drop-toggle svg{display:none}
  .nav a[aria-current="page"]{box-shadow:none;color:var(--enzian)}
}

/* ---------- Photo slots (Platzhalter, bis Fotos in /images liegen) ---------- */
.ph{position:relative;overflow:hidden;background:
  repeating-linear-gradient(135deg,rgba(15,30,51,.06) 0 12px,transparent 12px 24px),var(--cabinet);margin:0}
.ph::after{content:attr(data-file);position:absolute;left:12px;bottom:10px;font:500 .8rem/1.2 var(--body);color:var(--muted);background:rgba(255,255,255,.85);padding:.2em .5em}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
.ph.dark{background:repeating-linear-gradient(135deg,rgba(255,255,255,.05) 0 12px,transparent 12px 24px),var(--night-2)}

/* ---------- Hero ---------- */
.hero{background:var(--night);color:var(--white);position:relative}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);min-height:min(78vh,680px)}
.hero-text{padding:clamp(48px,8vw,104px) var(--gutter) clamp(48px,7vw,88px) max(var(--gutter),calc((100vw - var(--wrap))/2 + var(--gutter)));display:flex;flex-direction:column;justify-content:center}
.hero h1{color:var(--white);max-width:13ch}
.hero .lead{font-size:clamp(1.1rem,1.6vw,1.3rem);color:#C9D3E0;max-width:46ch;margin-bottom:2em}
.hero-kicker{font-weight:500;color:var(--signal);margin:0 0 1em;font-size:1.05rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.hero .ph{min-height:320px}
.hero .ph::before{content:"";position:absolute;left:0;top:0;bottom:0;width:10px;background:var(--signal);z-index:2}
@media (max-width:860px){
  .hero-grid{grid-template-columns:1fr}
  .hero .ph{min-height:260px;order:-1}
  .hero .ph::before{width:auto;height:8px;right:0;bottom:auto}
}

/* Page hero (Unterseiten) */
.page-hero{background:var(--night);color:var(--white);padding:clamp(48px,7vw,88px) 0 clamp(40px,6vw,72px);border-bottom:8px solid var(--signal)}
.page-hero h1{color:var(--white);margin-bottom:.3em}
.page-hero p{color:#C9D3E0;font-size:1.2rem;max-width:56ch;margin:0}
.crumbs{font-size:.95rem;margin:0 0 1.2em;color:#9FB0C6}
.crumbs a{color:#C9D3E0;text-decoration:none}
.crumbs a:hover{color:var(--white);text-decoration:underline}

/* ---------- Sections ---------- */
.section{padding:clamp(64px,9vw,112px) 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:40px}
.section-head h2{margin:0}
.section-head p{margin:0;color:var(--muted);max-width:52ch}
.bg-cabinet{background:var(--cabinet)}
.bg-white{background:var(--white)}

/* ---------- Klemmleiste (Leistungen) ---------- */
.rail{position:relative;padding-top:22px}
.rail::before{content:"";position:absolute;left:calc(-1 * var(--gutter));right:calc(-1 * var(--gutter));top:0;height:22px;
  background:repeating-linear-gradient(90deg,transparent 0 22px,rgba(15,30,51,.18) 22px 34px),linear-gradient(#D9DCD7,#B9BEB8);
  border-top:1px solid #A9AEA8;border-bottom:1px solid #A9AEA8}
.terminals{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-left:1px solid var(--rail)}
.terminal{background:var(--white);border-right:1px solid var(--rail);border-bottom:1px solid var(--rail);display:flex;flex-direction:column;text-decoration:none;color:var(--ink);transition:background .15s}
.terminal:hover{background:#FBFBF9;color:var(--ink)}
.terminal .cap{height:10px;background:var(--signal)}
.terminal:nth-child(2n) .cap{background:var(--brand-red)}
.terminal .ph{aspect-ratio:4/3}
.terminal-body{padding:20px 20px 24px;display:flex;flex-direction:column;flex:1}
.terminal h3{margin:0 0 .35em;font-size:1.55rem}
.terminal p{font-size:1rem;color:var(--muted);margin:0 0 1.2em}
.terminal .more{margin-top:auto;font-weight:600;color:var(--enzian);display:inline-flex;align-items:center;gap:.35em}
.terminal:hover .more{text-decoration:underline}
@media (max-width:1060px){.terminals{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:680px){.terminals{grid-template-columns:1fr}.terminal{flex-direction:row}.terminal .cap{height:auto;width:8px;flex:none}.terminal .ph{aspect-ratio:auto;width:120px;flex:none}.terminal-body{padding:16px}.terminal p{margin-bottom:.6em}}

/* ---------- Split / Partner ---------- */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:start}
@media (max-width:860px){.split{grid-template-columns:1fr}}
.checklist{list-style:none;padding:0;margin:0;border-top:2px solid var(--night)}
.checklist li{display:grid;grid-template-columns:36px 1fr;gap:12px;padding:18px 0;border-bottom:1px solid var(--line)}
.checklist svg{width:28px;height:28px;color:var(--enzian)}
.checklist strong{display:block;font-family:var(--head);font-size:1.35rem;font-weight:600;color:var(--night);line-height:1.2;margin-bottom:.15em}
.checklist span{color:var(--muted)}

/* Partner band */
.partner{background:var(--night-2);color:var(--white)}
.partner h2{color:var(--white)}
.partner p{color:#C9D3E0}
.partner-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:center}
.partner-facts{border-left:4px solid var(--signal);padding-left:24px}
.partner-facts dt{font-family:var(--head);font-weight:600;font-size:1.3rem;color:var(--white)}
.partner-facts dd{margin:0 0 1em;color:#C9D3E0}
@media (max-width:860px){.partner-grid{grid-template-columns:1fr}}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.gallery .ph{aspect-ratio:1/1}
.gallery .ph.wide{grid-column:span 2;aspect-ratio:auto}
@media (max-width:760px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery .ph.wide{grid-column:span 2;aspect-ratio:2/1}}

/* Career band */
.career{background:var(--signal);color:var(--night)}
.career-inner{display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;padding:clamp(40px,6vw,64px) 0}
.career h2{margin:0 0 .2em}
.career p{margin:0;font-size:1.15rem}

/* ---------- Kontakt ---------- */
.contact-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,80px)}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}
.contact-list{list-style:none;padding:0;margin:0 0 24px}
.contact-list li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--line)}
.contact-list svg{width:26px;height:26px;color:var(--enzian);margin-top:2px}
.contact-list .k{display:block;font-size:.95rem;color:var(--muted)}
.contact-list a,.contact-list .v{font-family:var(--head);font-weight:600;font-size:1.45rem;color:var(--night);text-decoration:none;line-height:1.25}
.contact-list a:hover{color:var(--enzian);text-decoration:underline}
.form{background:var(--white);border-top:6px solid var(--night);padding:clamp(24px,4vw,40px)}
.form h3{margin-bottom:.8em}
.field{margin-bottom:18px}
.field label{display:block;font-weight:600;margin-bottom:6px}
.field input,.field textarea,.field select{width:100%;font:inherit;color:var(--ink);background:var(--paper);border:1px solid #B8BEB7;border-radius:0;padding:.7em .8em}
.field input:focus,.field textarea:focus{outline:3px solid var(--signal);outline-offset:0;border-color:var(--night)}
.field textarea{min-height:150px;resize:vertical}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:560px){.field-row{grid-template-columns:1fr}}
.consent{display:grid;grid-template-columns:22px 1fr;gap:10px;font-size:.95rem;color:var(--muted);margin:6px 0 22px}
.consent input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--enzian)}
.req{color:#B3261E}
.form-note{font-size:.9rem;color:var(--muted);margin:14px 0 0}
.hidden{display:none}

/* ---------- Content pages ---------- */
.prose h2{margin-top:1.4em}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:1.2em}
.prose ul{padding-left:1.2em;max-width:68ch}
.prose li{margin-bottom:.4em}
.scope{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px;border-top:2px solid var(--night)}
.scope li{padding:14px 0 14px 28px;border-bottom:1px solid var(--line);position:relative}
.scope li::before{content:"";position:absolute;left:0;top:22px;width:14px;height:6px;background:var(--signal)}
@media (max-width:680px){.scope{grid-template-columns:1fr}}
.aside-card{background:var(--night);color:#C9D3E0;padding:32px}
.aside-card h3{color:var(--white)}
.aside-card .btn{margin-top:8px}
.aside-card a.tel{color:var(--white);font-family:var(--head);font-weight:600;font-size:1.6rem;text-decoration:none;display:block;margin:.2em 0 .6em}
.service-layout{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(32px,6vw,72px);align-items:start}
@media (max-width:900px){.service-layout{grid-template-columns:1fr}}
.related{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.related a{display:inline-block;border:2px solid var(--night);padding:.45em .9em;font-family:var(--head);font-weight:600;font-size:1.1rem;color:var(--night);text-decoration:none}
.related a:hover{background:var(--night);color:var(--white)}
.legal{max-width:820px}
.legal h2{font-size:1.9rem;margin-top:1.6em}
.legal h3{font-size:1.35rem;margin-top:1.2em}
.legal dl{display:grid;grid-template-columns:220px 1fr;gap:6px 24px;margin:0 0 1em}
.legal dt{font-weight:600}
.legal dd{margin:0}
@media (max-width:600px){.legal dl{grid-template-columns:1fr}.legal dd{margin-bottom:.6em}}
.todo{background:#FFF1C2;outline:2px dashed var(--signal-dark);padding:0 .3em}

/* ---------- Footer ---------- */
.site-footer{background:var(--night);color:#9FB0C6;padding:64px 0 28px;font-size:1rem}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.footer-grid{grid-template-columns:1fr}}
.site-footer h3{color:var(--white);font-size:1.3rem;margin-bottom:.8em}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{margin-bottom:.45em}
.site-footer a{color:#C9D3E0;text-decoration:none}
.site-footer a:hover{color:var(--white);text-decoration:underline}
.footer-logo{height:42px;width:auto;margin-bottom:18px}
.footer-bottom{border-top:1px solid #24395A;margin-top:48px;padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.92rem}

/* Galerie-Zoom & Lightbox */
.zoom{position:absolute;inset:0;display:block;cursor:zoom-in}
.zoom img{transition:transform .25s}
.zoom:hover img{transform:scale(1.04)}
.gallery-full{grid-template-columns:repeat(4,minmax(0,1fr))}
.gallery-full .ph{aspect-ratio:4/3}
@media (max-width:760px){.gallery-full{grid-template-columns:repeat(2,minmax(0,1fr))}}
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(10,18,30,.94);display:none;align-items:center;justify-content:center;padding:56px 64px}
.lightbox.open{display:flex}
.lightbox img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 10px 40px rgba(0,0,0,.5)}
.lb-btn{position:absolute;background:none;border:0;color:#fff;font:600 2.4rem/1 var(--head);cursor:pointer;padding:12px 16px}
.lb-btn:hover{color:var(--signal)}
.lb-close{top:8px;right:12px}
.lb-prev{left:6px;top:50%;transform:translateY(-50%)}
.lb-next{right:6px;top:50%;transform:translateY(-50%)}
.lb-count{position:absolute;bottom:14px;left:0;right:0;text-align:center;color:#9FB0C6;font-size:.95rem}
@media (max-width:600px){.lightbox{padding:56px 12px}.lb-prev,.lb-next{top:auto;bottom:4px;transform:none}}