@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/Archivo-500-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/Archivo-500-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/Archivo-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/Archivo-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/Archivo-700-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/Archivo-700-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/fonts/Archivo-800-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url('/assets/fonts/Archivo-800-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/SourceSans3-400-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/SourceSans3-400-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/SourceSans3-600-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Source Sans 3';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/SourceSans3-600-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

/* Layout: sachliche B2B-Seite, dunkle Bänder im Wechsel mit hellem Grund, Prologi-Gelb nur für Aktionen und Markierungen */
:root{
  color-scheme: light;
  --ink:#1c1e20;          /* Text, dunkle Bänder */
  --ink-2:#2a2d30;
  --steel:#5d646b;        /* Nebentext */
  --line:#dcdfe2;
  --paper:#f4f5f5;        /* heller Grund mit leichtem Stahlton */
  --white:#ffffff;
  --signal:#f7b626;       /* Prologi-Gelb */
  --signal-ink:#1c1e20;
  --on-dark:#eef0f1;
  --on-dark-2:#a9b0b6;
  --todo-bg:#fff6d6;
  --todo-line:#c99a1c;
  --f-display:"Archivo", "Helvetica Neue", Arial, sans-serif;
  --f-body:"Source Sans 3", "Segoe UI", Arial, sans-serif;
  --wrap:1180px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6}
h1,h2,h3{font-family:var(--f-display);line-height:1.15;text-wrap:balance;margin:0;letter-spacing:-.01em}
h2{font-size:clamp(28px,3.4vw,40px);font-weight:700}
h3{font-size:20px;font-weight:600}
p{margin:0}
a{color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.band{padding-block:clamp(56px,8vw,96px)}
.dark{background:var(--ink);color:var(--on-dark)}
.dark .muted{color:var(--on-dark-2)}
.muted{color:var(--steel)}
.kicker{font-family:var(--f-display);font-size:14px;font-weight:600;color:var(--steel);margin-bottom:12px;display:flex;align-items:center;gap:10px}
.kicker::before{content:"";width:22px;height:3px;background:var(--signal)}
.dark .kicker{color:var(--on-dark-2)}
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:600;font-size:16px;padding:14px 22px;border-radius:3px;text-decoration:none;border:2px solid transparent;cursor:pointer}
.btn-primary{background:var(--signal);color:var(--signal-ink)}
.btn-primary:hover{background:#e3a31f}
.btn-ghost{border-color:currentColor;color:inherit}
.btn:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--signal);outline-offset:3px}
.todo{background:var(--todo-bg);border:1px dashed var(--todo-line);color:#5b4508;padding:1px 6px;border-radius:2px;font-size:.92em;white-space:normal}
.dark .todo{background:#3a3220;color:#f5dc96;border-color:#a8822a}

/* Entwurfsleiste */
.draftbar{background:#fffbea;border-bottom:1px solid #ecd58a;font-size:15px}
.draftbar .wrap{padding-block:12px;display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline}
.draftbar strong{font-family:var(--f-display)}
.draftbar details{flex-basis:100%}
.draftbar summary{cursor:pointer;font-weight:600}
.draftbar ul{margin:10px 0 4px;padding-left:20px;columns:2 320px;column-gap:40px}
.draftbar li{break-inside:avoid;margin-bottom:4px}

/* Kopf */
header.site{background:var(--white);border-bottom:1px solid var(--line);position:sticky;top:env(safe-area-inset-top,0px);z-index:20}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--white)}
.headrow{display:flex;align-items:center;gap:28px;min-height:76px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.logo-mark{width:38px;height:38px;border:3px solid var(--ink);border-radius:8px;display:grid;place-items:center;font-family:var(--f-display);font-weight:800;font-size:15px}
.logo-text{font-family:var(--f-display);line-height:1}
.logo-text b{display:block;font-weight:800;font-size:21px;letter-spacing:.02em}
.logo-text span{font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--steel)}
nav.main{display:flex;gap:26px;margin-left:auto;font-family:var(--f-display);font-weight:500;font-size:15px}
nav.main a{text-decoration:none}
nav.main a:hover{color:#9a6c00}
.logo-img{height:48px;width:auto;max-width:none}
@media (max-width:560px){.logo-img{height:38px}}
.headcta{display:flex;align-items:center;gap:18px}
.headcta .tel{font-size:15px;color:var(--steel)}
.head-cta{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:600;font-size:14.5px;text-decoration:none;color:var(--white);background:var(--ink);padding:11px 18px;border-radius:2px;white-space:nowrap;transition:background .2s,color .2s}
.head-cta::after{content:"";width:7px;height:7px;border-top:2px solid var(--signal);border-right:2px solid var(--signal);transform:rotate(45deg);transition:border-color .2s}
.head-cta:hover{background:var(--signal);color:var(--ink)}
.head-cta:hover::after{border-color:var(--ink)}
.headcta .tel{white-space:nowrap}
@media (max-width:1180px){.headcta .tel{display:none}}
@media (max-width:900px){
 .headrow{flex-wrap:wrap;gap:0 20px;min-height:0;padding-top:12px}
 .headcta{margin-left:auto}
 nav.main{order:3;flex-basis:100%;margin:12px 0 0;padding:2px 0;border-top:1px solid var(--line);gap:24px;overflow-x:auto;scrollbar-width:none}
 nav.main::-webkit-scrollbar{display:none}
 nav.main a{padding-block:12px;white-space:nowrap}
}
@media (max-width:560px){
 nav.main{justify-content:space-between;gap:8px;font-size:14px}
 .head-cta{padding:9px 13px;font-size:14px}
 .hide-s{display:none}
 .logo-text b{font-size:18px}.logo-mark{width:34px;height:34px}
}

/* Hero */
.hero{position:relative;background:var(--ink);color:var(--white);overflow:hidden}
.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.42}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,30,32,.92) 0%,rgba(28,30,32,.6) 55%,rgba(28,30,32,.15) 100%)}
.hero .wrap{position:relative;z-index:1;padding-block:clamp(72px,11vw,140px)}
.hero h1{font-size:clamp(34px,5.2vw,62px);font-weight:800;max-width:16ch}
.hero .lead{font-size:clamp(18px,1.6vw,21px);max-width:56ch;margin-top:22px;color:#dfe3e6}
.hero .actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero .for{margin-top:44px;padding-top:20px;border-top:1px solid rgba(255,255,255,.22);font-size:15px;color:#c3c9ce;max-width:640px}
.hero .credit{position:absolute;right:12px;bottom:8px;z-index:1;font-size:11px;color:#9aa1a7}

/* Leistungen */
.head-split{display:grid;grid-template-columns:1.1fr 1fr;gap:24px 60px;align-items:end;margin-bottom:44px}
.head-split > *{min-width:0}
@media (max-width:820px){.head-split{grid-template-columns:1fr}}
.svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.svc{position:relative;min-height:250px;background:var(--white);border:1px solid var(--line);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;text-decoration:none;color:var(--ink);isolation:isolate}
.svc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s ease, transform .6s ease;transform:scale(1.04);z-index:-2}
.svc::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,22,24,.9) 0%,rgba(20,22,24,.35) 70%);opacity:0;transition:opacity .35s ease;z-index:-1}
.svc .cat{font-family:var(--f-display);font-size:13px;font-weight:600;color:var(--steel);margin-bottom:auto}
.svc h3{margin-top:28px}
.svc p{font-size:15px;color:var(--steel);margin-top:8px}
.svc .more{font-family:var(--f-display);font-weight:600;font-size:14px;margin-top:16px;display:inline-flex;gap:8px;align-items:center}
.svc .more::after{content:"";width:18px;height:2px;background:var(--signal)}
@media (hover:hover){
  .svc:hover img,.svc:focus-visible img{opacity:1;transform:scale(1)}
  .svc:hover::before,.svc:focus-visible::before{opacity:1}
  .svc:hover,.svc:focus-visible{color:var(--white);border-color:var(--ink)}
  .svc:hover p,.svc:hover .cat,.svc:focus-visible p,.svc:focus-visible .cat{color:#d5dadd}
}
@media (hover:none){
  .svc{padding-top:190px}
  .svc img{opacity:1;transform:none;height:170px;bottom:auto}
  .svc::before{display:none}
}
.svc-cta{background:var(--ink);color:var(--on-dark);border-color:var(--ink)}
.svc-cta p{color:var(--on-dark-2)}
.svc-cta .btn{margin-top:18px;align-self:flex-start}

/* Ablauf */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;border-top:1px solid #3c4045}
.step{padding:26px 26px 6px 0;min-width:0}
.step + .step{padding-left:26px;border-left:1px solid #3c4045}
.step .n{font-family:var(--f-display);font-weight:800;font-size:15px;color:var(--signal)}
.step h3{margin-top:10px;font-size:19px}
.step p{margin-top:8px;font-size:15.5px}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr}.step:nth-child(3){border-left:0;padding-left:0}.step:nth-child(n+3){border-top:1px solid #3c4045}}
@media (max-width:520px){.steps{grid-template-columns:1fr}.step + .step{border-left:0;padding-left:0;border-top:1px solid #3c4045}}

/* Projekte */
.proj-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:900px){.proj-grid{grid-template-columns:1fr}}
.proj{background:var(--white);border:1px solid var(--line);border-radius:4px;overflow:hidden;display:flex;flex-direction:column}
.proj .ph{aspect-ratio:16/10;max-width:100%;background:repeating-linear-gradient(135deg,#eceeef 0 14px,#e4e7e9 14px 28px);display:grid;place-items:center;text-align:center;padding:16px;color:var(--steel);font-size:14px}
.proj .body{padding:22px;display:grid;gap:10px}
.proj dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:6px 0 0;font-size:15px}
.proj dt{color:var(--steel)}
.proj dd{margin:0;min-width:0}

/* FAQ */
.faq-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:40px 70px}
.faq-grid > *{min-width:0}
@media (max-width:900px){.faq-grid{grid-template-columns:1fr}}
.faq details{border-bottom:1px solid #3c4045}
.faq details:first-child{border-top:1px solid #3c4045}
.faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;position:relative;font-family:var(--f-display);font-weight:600;font-size:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:16px;font-size:26px;font-weight:500;color:var(--signal)}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 22px;color:var(--on-dark-2);max-width:62ch}

/* Ratgeber */
.guide-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:20px}
.guide-grid > *{min-width:0}
@media (max-width:900px){.guide-grid{grid-template-columns:1fr}}
.guide-feature{background:var(--white);border:1px solid var(--line);border-radius:4px;overflow:hidden}
.guide-feature img{width:100%;aspect-ratio:16/9;object-fit:cover}
.guide-feature .body{padding:24px;display:grid;gap:10px}
.tag{font-family:var(--f-display);font-size:13px;font-weight:600;color:#8a6200}
.guide-list{display:grid;gap:0;border-top:1px solid var(--line)}
.guide-item{display:grid;grid-template-columns:92px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none;align-items:start}
.guide-item img{width:92px;height:68px;object-fit:cover;border-radius:3px}
.guide-item .noimg{width:92px;height:68px;border-radius:3px;background:#e7eaec}
.guide-item h3{font-size:17px}
.guide-item p{font-size:14.5px;color:var(--steel);margin-top:4px}
.kw{font-size:13px;color:var(--steel);margin-top:6px}

/* CTA */
.cta-row{display:flex;flex-wrap:wrap;gap:28px 60px;align-items:center;justify-content:space-between}
.cta-row h2{max-width:20ch}
.cta-row .side{display:grid;gap:12px;min-width:0}
.cta-row .side .muted{font-size:15px}

/* Fuß */
footer{background:#141618;color:var(--on-dark-2);font-size:15px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px;padding-block:60px 40px}
.foot > *{min-width:0}
@media (max-width:900px){.foot{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot{grid-template-columns:1fr}}
.foot h4{font-family:var(--f-display);color:var(--on-dark);font-size:16px;margin:0 0 14px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.foot a{text-decoration:none}
.foot a:hover{color:var(--white)}
.foot .logo{color:var(--on-dark)}
.foot .logo-mark{border-color:var(--on-dark)}
.foot .logo-text span{color:var(--on-dark-2)}
.legal{border-top:1px solid #2c3034;padding-block:20px;font-size:13.5px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
.credits{font-size:12.5px;color:#7d858c;padding-bottom:28px}



/* Referenzen */
.ref-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:1000px){.ref-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.ref-grid{grid-template-columns:1fr}}
.ref{background:var(--white);border:1px solid var(--line);border-radius:4px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.ref-img{position:relative}
.ref-img img{width:100%;aspect-ratio:16/10;object-fit:cover}
.img-badge{position:absolute;left:12px;top:12px;background:rgba(20,22,24,.78);color:#fff;font-family:var(--f-display);font-size:12px;font-weight:600;padding:4px 9px;border-radius:2px}
.ref:not(:has(.ref-img)) .body{border-top:4px solid var(--signal)}
.ref .body{padding:22px;display:grid;gap:8px;align-content:start;flex:1}
.ref h3{font-size:20px}
.ref-ort{font-size:15px;color:var(--steel);margin-top:-2px}
.ref .muted{font-size:15.5px}
.ref-bh{font-size:14.5px;border-top:1px solid var(--line);padding-top:10px;margin-top:6px}
.ref-bh span{font-family:var(--f-display);font-weight:600;margin-right:6px}
.credit{font-size:12px;color:#8a9097;line-height:1.45}
.credit a{color:inherit}
.ref-names{list-style:none;padding:0;margin:0;display:grid;gap:0;border-top:1px solid var(--line);width:100%}
.ref-names li{padding:9px 0;border-bottom:1px solid var(--line);font-family:var(--f-display);font-weight:500;font-size:15.5px}
/* Startseite im Aufbau der alten Seite */
.hero-slider .slides{position:absolute;inset:0}
.hero-slider .slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s ease}
.hero-slider .slide.is-on{opacity:.5}
.slide-kicker{font-family:var(--f-display);font-weight:600;color:var(--signal);font-size:17px;margin-bottom:16px;min-height:1.4em}
.slide-dots{display:flex;gap:10px;margin-top:40px}
.slide-dots button{width:34px;height:4px;border:0;padding:0;background:rgba(255,255,255,.35);cursor:pointer}
.slide-dots button.is-on{background:var(--signal)}
.btn-ghost{color:inherit}
.about-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:40px 64px;align-items:center}
.about-grid > *{min-width:0}
.about-text{display:grid;gap:18px}
.actions-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.about-img{margin:0}
.about-img img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
@media (max-width:900px){.about-grid{grid-template-columns:1fr}}
.steps{margin-top:64px}
.proj-home{display:grid;grid-template-columns:.85fr 1.15fr;gap:40px 64px;align-items:start}
.proj-home > *{min-width:0}
.proj-home-text{display:grid;gap:18px;justify-items:start;position:sticky;top:calc(env(safe-area-inset-top,0px) + 110px)}
@media (max-width:900px){.proj-home{grid-template-columns:1fr}.proj-home-text{position:static}}
.proj-stack{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.proj-tile{position:relative;display:block;border-radius:4px;overflow:hidden;aspect-ratio:4/3;max-width:100%}
.proj-tile.big{grid-column:1 / -1;aspect-ratio:16/9}
.proj-tile img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.proj-tile:hover img{transform:scale(1.04)}
.proj-tile .cap{position:absolute;left:0;right:0;bottom:0;padding:40px 16px 14px;background:linear-gradient(0deg,rgba(20,22,24,.85),rgba(20,22,24,0));color:var(--white);display:grid;gap:4px;font-size:15px}
.tag-l{font-family:var(--f-display);font-weight:600;font-size:13px;color:var(--signal)}
@media (max-width:520px){.proj-stack{grid-template-columns:1fr}}
.faq-home{display:grid;grid-template-columns:1fr 1.25fr;gap:40px 70px;align-items:start}
.faq-home > *{min-width:0}
.faq-img{margin:0}
.faq-img img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px}
@media (max-width:900px){.faq-home{grid-template-columns:1fr}.faq-img img{aspect-ratio:16/9}}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:900px){.post-grid{grid-template-columns:1fr}}
.post{background:var(--white);border:1px solid var(--line);border-radius:4px;overflow:hidden;text-decoration:none;color:var(--ink);display:flex;flex-direction:column}
.post img{width:100%;aspect-ratio:16/10;object-fit:cover}
.post .body{padding:22px;display:grid;gap:10px}
.post h3{font-size:19px}
.post .more{font-family:var(--f-display);font-weight:600;font-size:14px;display:inline-flex;gap:8px;align-items:center}
.post .more::after{content:"";width:18px;height:2px;background:var(--signal)}
.post:hover h3{color:#7a5600}
.cta-photo{position:relative;background:var(--ink);color:var(--white);overflow:hidden}
.cta-photo > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.3}
.cta-photo .wrap{position:relative;padding-block:clamp(64px,8vw,104px)}
.cta-photo .muted{color:#c9cfd3}
@media (prefers-reduced-motion:reduce){.hero-slider .slide{transition:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
[hidden]{display:none!important}

/* Unterseiten */
nav.main a.active{color:#9a6c00;box-shadow:inset 0 -3px 0 var(--signal)}
nav.main a{padding-block:6px}
.page-hero{position:relative;background:var(--ink);color:var(--white);overflow:hidden}
.page-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.38}
.page-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(28,30,32,.94) 0%,rgba(28,30,32,.65) 60%,rgba(28,30,32,.25) 100%)}
.page-hero .wrap{position:relative;z-index:1;padding-block:clamp(48px,7vw,88px)}
.page-hero.slim .wrap{padding-block:clamp(40px,5vw,64px)}
.page-hero h1{font-size:clamp(30px,4.2vw,50px);font-weight:800;max-width:22ch}
.page-hero .lead{font-size:clamp(17px,1.5vw,20px);max-width:60ch;margin-top:18px;color:#dfe3e6}
.crumbs{font-size:14px;color:#b9c0c5;margin-bottom:18px;display:flex;flex-wrap:wrap;gap:6px}
.crumbs a{color:#e7eaec}
.with-aside{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;align-items:start}
@media (max-width:960px){.with-aside{grid-template-columns:1fr}}
.split-2{display:grid;grid-template-columns:1fr 1.3fr;gap:28px 60px;align-items:start}
.split-2 > *{min-width:0}
@media (max-width:860px){.split-2{grid-template-columns:1fr}}
.prose{max-width:72ch;min-width:0}
.prose > * + *{margin-top:16px}
.prose h2{font-size:clamp(23px,2.3vw,28px);margin-top:40px}
.prose h2:first-child{margin-top:0}
.prose.on-dark p{color:var(--on-dark-2)}
.checks{list-style:none;padding:0;display:grid;gap:10px}
.checks li{position:relative;padding-left:30px}
.checks li::before{content:"";position:absolute;left:2px;top:.55em;width:14px;height:8px;border-left:3px solid var(--signal);border-bottom:3px solid var(--signal);transform:rotate(-45deg)}
.flow{padding-left:0;list-style:none;counter-reset:f;display:grid;gap:12px}
.flow li{counter-increment:f;position:relative;padding-left:44px}
.flow li::before{content:counter(f);position:absolute;left:0;top:0;width:28px;height:28px;border-radius:2px;background:var(--ink);color:var(--signal);font-family:var(--f-display);font-weight:700;font-size:14px;display:grid;place-items:center}
.small-flow li{font-size:15px}
.small{font-size:14px}
.faq.light details{border-bottom:1px solid var(--line)}
.faq.light details:first-child{border-top:1px solid var(--line)}
.faq.light details p{color:var(--steel)}
.faq.light summary{font-size:17px}
.aside{display:grid;gap:18px;position:sticky;top:calc(env(safe-area-inset-top,0px) + 96px)}
@media (max-width:960px){.aside{position:static}}
.aside-box{background:var(--white);border:1px solid var(--line);border-radius:4px;padding:24px;display:grid;gap:12px}
.aside-box h3{font-size:18px}
.dark-box{background:var(--ink);color:var(--on-dark);border-color:var(--ink)}
.dark-box p{color:var(--on-dark-2)}
.dark-box .btn{justify-self:start}
.aside-links{list-style:none;padding:0;margin:0;display:grid;gap:0}
.aside-links li{border-top:1px solid var(--line);padding:9px 0;font-size:15px}
.aside-links a{text-decoration:none}
.aside-links a:hover{color:#9a6c00}
.note{background:var(--todo-bg);border-left:4px solid var(--todo-line);padding:16px 20px;font-size:15.5px;color:#4d3b08;border-radius:2px}
.svc-list,.art-list{display:grid;gap:0;border-top:1px solid var(--line)}
.art-list{margin-top:32px}
.svc-row,.art-row{display:grid;grid-template-columns:260px minmax(0,1fr);gap:28px;padding:26px 0;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);align-items:center}
.svc-row img,.art-row img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:3px}
.svc-row h2,.art-row h2{font-size:clamp(20px,2vw,25px)}
.svc-row p{margin-top:8px;max-width:62ch}
.svc-row .more{font-family:var(--f-display);font-weight:600;font-size:14px;margin-top:14px;display:inline-flex;gap:8px;align-items:center}
.svc-row .more::after{content:"";width:18px;height:2px;background:var(--signal)}
.svc-row:hover h2,a.art-row:hover h2{color:#7a5600}
@media (max-width:640px){.svc-row,.art-row{grid-template-columns:1fr;gap:14px}}
.art-row .tag{display:block;margin-bottom:6px}
.status{display:inline-block;margin-top:10px;font-size:13px;font-family:var(--f-display);font-weight:600;padding:3px 9px;border-radius:2px;background:#e7eaec;color:var(--steel)}
.status.ok{background:#e3f1e3;color:#28612b}
div.art-row{opacity:.85}
.values{display:grid;gap:4px 0}
.values dt{font-family:var(--f-display);font-weight:600;font-size:18px;margin-top:14px}
.values dd{margin:0;color:var(--steel)}
.person{display:grid;grid-template-columns:220px minmax(0,1fr);gap:28px;align-items:center}
.person-photo{width:220px;height:auto;border-radius:4px;background:#e6e7ea}
@media (max-width:560px){.person{grid-template-columns:1fr}.person-photo{width:100%;max-width:300px}}
.ph-round{width:84px;height:84px;border-radius:50%;flex:none;background:repeating-linear-gradient(135deg,#eceeef 0 10px,#e2e5e7 10px 20px);display:grid;place-items:center;font-size:13px;color:var(--steel)}
.contact-list{display:grid;grid-template-columns:auto 1fr;gap:14px 28px;margin:0;font-size:17px}
.contact-list dt{font-family:var(--f-display);font-weight:600}
.contact-list dd{margin:0;min-width:0}
.form{display:grid;gap:16px;background:var(--white);border:1px solid var(--line);border-radius:4px;padding:clamp(20px,3vw,34px);min-width:0}
.form h2{font-size:22px}
.form h2:not(:first-child){margin-top:12px}
.form label{display:grid;gap:6px;font-size:15px;font-weight:600}
.form input:not([type=checkbox]),.form select,.form textarea{font:inherit;font-weight:400;font-size:16px;padding:11px 12px;border:1px solid #c5cacf;border-radius:3px;background:var(--white);color:var(--ink);width:100%}
.form input:focus,.form select:focus,.form textarea:focus{outline:2px solid var(--signal);outline-offset:1px;border-color:var(--ink)}
.row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.row2 > *,.form label{min-width:0}
.form input,.form select,.form textarea{min-width:0;max-width:100%}
.contact-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:40px 64px;align-items:start}
@media (max-width:900px){.contact-grid{grid-template-columns:1fr}}
@media (max-width:600px){.row2{grid-template-columns:1fr}}
.form fieldset{border:0;padding:0;margin:0;min-width:0}
.form legend{font-size:15px;font-weight:600;margin-bottom:8px}
.checks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:8px 18px}
.form label.check{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.form label.check input{margin-top:5px;width:18px;height:18px;accent-color:#c48a00;flex:none}
.form .btn{justify-self:start}
.form-msg{font-size:15px;color:#28612b}
.form-msg:empty{display:none}

.note-box{background:var(--white);border:1px solid var(--line);border-left:4px solid var(--signal);padding:16px 20px;font-size:15.5px;border-radius:2px;margin-top:28px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg.err{color:#a3261b}
.form-msg:empty{display:none}
.art-row .more-link{font-family:var(--f-display);font-weight:600;font-size:14px;display:inline-flex;gap:8px;align-items:center;margin-top:10px}
.art-row .more-link::after{content:"";width:18px;height:2px;background:var(--signal)}
.art-row h2{margin-top:2px}
