/* ==========================================================================
   Unterseiten
   ========================================================================== */
.page-hero{position:relative;padding-block:clamp(2rem,5vw,3.75rem) clamp(2.25rem,5vw,4rem);color:#fff;background-color:var(--hero-bg);background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:80px 80px,80px 80px,16px 16px,16px 16px}
.page-hero h1{max-width:26ch;margin-bottom:.4em;color:#fff;font-size:clamp(2.25rem,1.4rem + 3vw,3.75rem)}
.page-hero__lead{max-width:44rem;margin:0;font-size:clamp(1.12rem,1.05rem + .4vw,1.3rem);line-height:1.5;color:#D5E4F3}
.page-hero__cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.75rem}

.layout{display:grid;grid-template-columns:minmax(0,1fr) 22rem;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.aside{position:sticky;top:calc(var(--header-h) + 1.5rem)}
.aside-card{padding:1.5rem;border:1px solid var(--line);border-radius:var(--r-l);background:var(--surface);box-shadow:var(--shadow-m)}
.aside-card h2{margin-bottom:.4rem;font-size:1.6rem}
.aside-card h3{margin-bottom:.75rem;font-size:1.2rem}
.aside-card > p{color:var(--muted)}
.aside-card .btn + .btn{margin-top:.6rem}
@media (max-width:1000px){.layout{grid-template-columns:1fr}.aside{position:static}}

.prose{max-width:46rem}
.prose > *:first-child{margin-top:0}
.prose h2{margin-top:2.2em;margin-bottom:.5em}
.prose h3{margin-top:1.6em}
.prose p,.prose li{max-width:68ch}
.prose ul:not(.linklist):not(.chips){display:grid;gap:.55rem;margin:0 0 1.25rem;list-style:none}
.prose ul:not(.linklist):not(.chips) > li{position:relative;padding-left:1.9rem}
.prose ul:not(.linklist):not(.chips) > li::before{content:"";position:absolute;left:.15rem;top:.42em;width:.95rem;height:.5rem;border-left:3px solid var(--ok);border-bottom:3px solid var(--ok);transform:rotate(-45deg)}
.prose .linklist,.prose .steps,.prose .faq,.prose .chips{margin-top:1rem}
.prose .steps{margin-bottom:1rem}
.prose table{width:100%;margin:1.25rem 0 1.5rem;border-collapse:collapse;background:var(--surface);border-radius:var(--r-m);overflow:hidden;font-size:1rem}
.prose th,.prose td{padding:.85rem 1rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose thead th{background:var(--surface-2);font:700 1.1rem/1.2 var(--font-display)}
.prose .callout{margin:1.5rem 0;padding:1.1rem 1.25rem;border-left:5px solid var(--signal);border-radius:0 var(--r-m) var(--r-m) 0;background:var(--surface)}
.prose .callout p:last-child{margin:0}

/* Checkliste (echte Reihenfolge) */
.checklist{display:grid;gap:1rem;list-style:none;counter-reset:c}
.checklist > li{max-width:none;counter-increment:c;position:relative;padding:1.4rem 1.5rem 1.4rem 5rem;border:1px solid var(--line);border-radius:var(--r-l);background:var(--surface)}
.checklist > li::before{content:counter(c);position:absolute;left:1.25rem;top:1.25rem;display:grid;place-items:center;width:2.9rem;height:2.9rem;border-radius:12px;background:var(--blau-800);color:#fff;font:700 1.5rem/1 var(--font-display)}
.checklist h3{margin:0 0 .35rem}
.checklist p{margin:0;color:var(--muted)}
.checklist__call{border-color:var(--signal)!important}
.checklist__call::before{background:var(--signal)!important;color:var(--ink-on-signal)!important}
@media (prefers-color-scheme:dark){.checklist > li::before{background:var(--blau-700)}}
@media (max-width:560px){.checklist > li{padding:1.25rem 1.25rem 1.25rem 1.25rem}.checklist > li::before{position:static;margin-bottom:.75rem}}

/* Übersicht */
.hublist{display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:1rem;list-style:none}
.hublist a{display:block;height:100%;padding:1.4rem 1.5rem;border:1px solid var(--line);border-radius:var(--r-l);background:var(--surface);color:var(--text);text-decoration:none}
.hublist a:hover{border-color:var(--blau-600)}
.hublist strong{display:block;margin-bottom:.35rem;font:700 1.4rem/1.15 var(--font-display)}
.hublist span{color:var(--muted)}

/* Leistungsübersicht */
.svc-group{margin-bottom:3rem}
.svc-group h2{margin-bottom:1rem;font-size:clamp(1.6rem,1.3rem + 1vw,2.1rem)}
.svc-group .linklist{grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:.75rem}

/* Kontakt */
.contact-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:3rem;list-style:none}
.contact-tiles a{display:flex;flex-direction:column;gap:.3rem;height:100%;padding:1.5rem;border:1px solid var(--line);border-radius:var(--r-l);background:var(--surface);color:var(--text);text-decoration:none}
.contact-tiles a:hover{border-color:var(--blau-600)}
.contact-tiles .icon{width:2rem;height:2rem;margin-bottom:.4rem;color:var(--icon)}
.contact-tiles small{color:var(--muted);font-size:.95rem}
.contact-tiles strong{font:700 1.7rem/1.1 var(--font-display)}
.contact-tiles__primary{border-color:var(--signal)!important;box-shadow:inset 0 -4px 0 var(--signal)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.contact-form-card{padding:clamp(1.4rem,3vw,2.2rem);border:1px solid var(--line);border-radius:var(--r-l);background:var(--surface);box-shadow:var(--shadow-m)}
@media (max-width:900px){.contact-tiles{grid-template-columns:1fr}.contact-grid{grid-template-columns:1fr}}

/* Über uns Person */
.person-page{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.person-page img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 18%;border-radius:var(--r-l);box-shadow:var(--shadow-l)}
@media (max-width:900px){.person-page{grid-template-columns:1fr}}

/* 404 / Danke */
.center-page{padding-block:clamp(4rem,10vw,8rem);text-align:center}
.center-page .lead{margin-inline:auto;max-width:34rem}
.center-page__actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:1.75rem}
.center-page h1{font-size:clamp(2.4rem,1.6rem + 3.5vw,4rem)}

/* Lexikon */
.lexikon{margin:2rem 0 1.5rem}
.lexikon dt{margin-top:1.6rem;font:700 1.4rem/1.2 var(--font-display);scroll-margin-top:calc(var(--header-h) + 1rem)}
.lexikon dd{margin:.35rem 0 0;max-width:62ch;color:var(--muted)}
mark{padding:.1em .35em;border-radius:4px;background:#FFE58A;color:#3B2F00}