/* ============================================================
   WERBX MEDIA – LEISTUNGSSEITEN
   Reihenfolge beibehalten: spätere Regeln überschreiben frühere.
   ============================================================ */

:root {
    --blue:#4c9ed7;
    --dark:#101318;
    --dark2:#1b222b;
    --light:#f5f6f7;
    --text:#17212c;
    --muted:#657381;
}

* {
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
}

body {
    margin:0;
    font:16px/1.65 Arial,Helvetica,sans-serif;
    background:var(--light);
    color:var(--text);
}

a {
    text-decoration:none;
    color:inherit;
}

button {
    font:inherit;
}

img {
    max-width:100%;
}

.wrap {
    width:min(1200px,calc(100% - 44px));
    margin:auto;
}

.site-header {
    position:sticky;
    top:0;
    z-index:20;
    background:#101318f7;
    color:white;
    border-bottom:1px solid #ffffff20;
}

.header-row {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:25px;
    min-height:78px;
}

.brand {
    font-size:26px;
    font-weight:900;
    letter-spacing:-1.5px;
    white-space:nowrap;
}

.brand span {
    color:var(--blue);
}

.nav {
    display:flex;
    align-items:center;
    gap:20px;
}

.nav a {
    font-size:13px;
    font-weight:700;
    color:#e5ebf0;
}

.nav a:hover,.nav a:focus-visible {
    color:var(--blue);
}

.nav .contact-link {
    background:var(--blue);
    color:#08121c;
    padding:10px 15px;
    border-radius:5px;
}

.menu-btn {
    display:none;
    color:white;
    border:1px solid #667;
    background:none;
    border-radius:5px;
    padding:8px 12px;
}

.hero {
    background:linear-gradient(90deg,#0a1017ed 0%,#0a1017c0 44%,#0a101725 100%),url("titelbild.jpg") center 42%/cover;
    min-height:610px;
    color:white;
    display:flex;
    align-items:center;
}

.eyebrow {
    font-size:12px;
    font-weight:900;
    letter-spacing:2.3px;
    text-transform:uppercase;
    color:var(--blue);
}

h1,h2,h3 {
    line-height:1.12;
    letter-spacing:-.045em;
}

h1 {
    font-size:clamp(44px,7vw,91px);
    max-width:850px;
    margin:18px 0;
}

h1 em {
    font-style:normal;
    color:var(--blue);
}

.hero p {
    font-size:clamp(17px,2vw,21px);
    max-width:680px;
    color:#eef3f8;
}

.button {
    display:inline-flex;
    background:var(--blue);
    color:#071723;
    font-weight:800;
    padding:14px 23px;
    border-radius:5px;
    margin-top:20px;
}

.button:hover {
    background:#76b9e8;
}

.section {
    padding:86px 0;
}

.section h2 {
    font-size:clamp(34px,4.5vw,58px);
    margin:10px 0 22px;
}

.lead {
    max-width:830px;
    color:#4b5b69;
    font-size:18px;
}

.services {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin-top:36px;
}

.service {
    background:white;
    border:1px solid #dde5eb;
    border-radius:7px;
    min-height:240px;
    padding:25px 23px;
    display:flex;
    flex-direction:column;
    transition:.2s;
    box-shadow:0 8px 20px #11111108;
}

.service:hover,.service:focus-visible {
    transform:translateY(-5px);
    border-color:var(--blue);
    box-shadow:0 14px 35px #4c9ed726;
}

.service .num {
    color:var(--blue);
    font-weight:900;
    letter-spacing:2px;
}

.service h3 {
    font-size:24px;
    margin:26px 0 10px;
}

.service p {
    color:var(--muted);
    font-size:14px;
    margin:0 0 15px;
}

.service .more {
    color:#1975b6;
    font-weight:800;
    margin-top:auto;
}

.dark {
    background:var(--dark);
    color:white;
}

.dark .lead {
    color:#c4d0db;
}

.features {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
    margin-top:36px;
}

.feature {
    background:var(--dark2);
    padding:28px;
    border-top:3px solid var(--blue);
}

.feature h3 {
    font-size:23px;
}

.feature p {
    color:#cad2da;
}

.cta {
    background:var(--blue);
    padding:65px 0;
    color:#071723;
}

.cta h2 {
    font-size:clamp(36px,5vw,60px);
    margin:0 0 10px;
}

.cta .button {
    background:var(--dark);
    color:white;
}

.footer {
    background:#0e1116;
    color:#cbd2da;
    padding:30px 0;
}

.footer-inner {
    display:flex;
    gap:20px;
    flex-wrap:wrap;
    justify-content:space-between;
}

.footer a:hover {
    color:var(--blue);
}

.subhero {
    background:linear-gradient(110deg,#101318,#223344);
    color:white;
    padding:90px 0 85px;
    position:relative;
    overflow:hidden;
}

.subhero:after {
    content:"";
    position:absolute;
    right:-80px;
    top:-90px;
    width:390px;
    height:390px;
    border:65px solid #4c9ed728;
    border-radius:50%;
    pointer-events:none;
}

.subhero h1 {
    font-size:clamp(43px,6vw,78px);
    max-width:900px;
}

.subhero p {
    max-width:740px;
    font-size:19px;
    color:#d4e0eb;
}

.breadcrumb {
    font-size:13px;
    color:#afc0d1;
}

.breadcrumb a {
    text-decoration:underline;
}

.article {
    max-width:900px;
}

.article-block {
    padding:25px 0;
    border-bottom:1px solid #dbe3e9;
}

.article-block h2 {
    font-size:clamp(24px,3vw,36px);
    margin:0 0 13px;
}

.article-block p {
    font-size:17px;
    line-height:1.8;
    margin:0 0 13px;
    color:#3c4b58;
}

.article-block ul {
    margin:10px 0 0;
    padding-left:22px;
}

.article-block li {
    margin:9px 0;
}

.article-block li::marker {
    color:var(--blue);
}

.article-block strong {
    color:#142c3f;
}

.back {
    display:inline-block;
    color:#1472ae;
    font-weight:800;
    margin-top:35px;
}

.other-links {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:22px;
}

.other-links a {
    border:1px solid #c5d7e4;
    border-radius:5px;
    padding:8px 12px;
    font-size:13px;
}

.other-links a:hover {
    background:#e2f1fb;
}

.notice {
    font-size:13px;
    color:#536579;
    border-left:3px solid var(--blue);
    padding:12px 18px;
    background:#e8f1f7;
    margin-top:24px;
}

@media(max-width:1050px) {
    .services {
        grid-template-columns:repeat(2,1fr);
    }
    .nav {
        gap:12px;
    }
}

@media(max-width:760px) {
    .menu-btn {
        display:block;
    }
    .nav {
        display:none;
        position:absolute;
        top:78px;
        left:0;
        right:0;
        background:#101318;
        flex-direction:column;
        align-items:stretch;
        padding:18px 24px;
        max-height:calc(100vh - 78px);
        overflow:auto;
    }
    .nav.open {
        display:flex;
    }
    .nav a {
        padding:8px;
    }
    .hero {
        min-height:560px;
        background-position:62% center;
    }
    .features {
        grid-template-columns:1fr;
    }
    .section {
        padding:62px 0;
    }
}

@media(max-width:520px) {
    .services {
        grid-template-columns:1fr;
    }
    .service {
        min-height:185px;
    }
    .hero {
        background-position:67% center;
    }
    .wrap {
        width:min(1200px,calc(100% - 34px));
    }
}

/* Bildstarke, konsistente Layout-Erweiterung */
:root {
    --blue:#4c9ed7;
}

body {
    font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
    font-size:16px;
    line-height:1.7;
}

h1,h2,h3 {
    letter-spacing:-.035em;
}

p {
    max-width:76ch;
}

.header-row {
    min-height:80px;
}

.nav {
    gap:17px;
}

.nav .nav-dropdown {
    position:relative;
}

.nav .nav-dropdown>button {
    color:#e5ebf0;
    background:transparent;
    border:0;
    cursor:pointer;
    font-size:14px;
    font-weight:750;
    padding:14px 6px;
}

.nav .nav-dropdown>button:hover {
    color:var(--blue);
}

.nav-dropdown .dropdown-menu {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    width:290px;
    max-height:70vh;
    overflow:auto;
    background:#17212b;
    border:1px solid #ffffff24;
    padding:10px;
    border-radius:9px;
    box-shadow:0 18px 36px #0007;
}

.nav-dropdown.open .dropdown-menu,.nav-dropdown:focus-within .dropdown-menu {
    display:grid;
}

.dropdown-menu a {
    display:block;
    padding:9px 12px;
    border-radius:5px;
    font-size:13px;
}

.dropdown-menu a:hover {
    background:#ffffff16;
}

.service {
    padding:0;
    overflow:hidden;
    min-height:340px;
}

.service img {
    width:100%;
    height:175px;
    object-fit:cover;
    display:block;
}

.service-content {
    display:flex;
    flex:1;
    flex-direction:column;
    padding:19px 22px 24px;
}

.service h3 {
    font-size:clamp(19px,1.9vw,24px);
    margin:14px 0 8px;
}

.service .num {
    font-size:12px;
}

.service .more {
    font-size:14px;
}

.subhero {
    min-height:440px;
    display:flex;
    align-items:center;
    padding:70px 0;
    background-size:cover;
    background-position:center;
}

.subhero:after {
    display:none;
}

.subhero .wrap {
    position:relative;
    z-index:1;
}

.subhero h1 {
    font-size:clamp(42px,5.7vw,74px);
    max-width:840px;
}

.subhero p {
    font-size:clamp(17px,1.7vw,20px);
    line-height:1.65;
    max-width:650px;
}

.article {
    max-width:100%;
}

.article-block {
    max-width:880px;
    padding:25px 0;
}

.article-block h2 {
    font-size:clamp(23px,2.7vw,34px);
    line-height:1.25;
    margin:0 0 13px;
}

.article-block p {
    font-size:clamp(16px,1.5vw,18px);
    line-height:1.75;
}

.article-block li {
    font-size:17px;
    line-height:1.65;
}

.article-block:empty {
    display:none;
}

.detail-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 285px;
    gap:65px;
    align-items:start;
}

.detail-sidebar {
    position:sticky;
    top:105px;
    background:#e9f2f7;
    border-radius:12px;
    padding:24px;
}

.detail-sidebar h3 {
    margin:0 0 14px;
    font-size:20px;
}

.detail-sidebar a {
    display:block;
    padding:9px 0;
    border-bottom:1px solid #c8dce7;
    font-size:14px;
    font-weight:650;
}

.detail-sidebar a:hover,.detail-sidebar a[aria-current="page"] {
    color:#146999;
}

.section-visual {
    width:100%;
    max-width:880px;
    aspect-ratio:16/8;
    object-fit:cover;
    border-radius:12px;
    display:block;
    margin-bottom:18px;
}

.eyebrow {
    letter-spacing:1.8px;
}

.section {
    padding:76px 0;
}

.top-link {
    position:fixed;
    bottom:22px;
    right:20px;
    z-index:19;
    background:#4c9ed7;
    color:#071723;
    padding:10px 15px;
    border-radius:30px;
    font-size:13px;
    font-weight:800;
    box-shadow:0 8px 25px #0003;
}

.site-header .nav a[aria-current="page"] {
    color:#4c9ed7;
}

.visual-note {
    font-size:12px;
    color:#637786;
    margin:0 0 22px;
}

.hero {
    background-position:center 42%;
    min-height:650px;
}

.hero p {
    line-height:1.6;
}

.image-banner {
    position:relative;
    min-height:370px;
    background:linear-gradient(90deg,#101318ec,#10131845),url("titelbild.jpg") center 43%/cover;
    display:flex;
    align-items:center;
    color:white;
}

.image-banner h2 {
    font-size:clamp(35px,5vw,62px);
    max-width:720px;
}

.image-banner p {
    font-size:19px;
    max-width:650px;
    color:#e4f2fb;
}

.feature p {
    font-size:16px;
}

@media(max-width:1050px) {
    .detail-layout {
        grid-template-columns:1fr;
    }
    .detail-sidebar {
        position:static;
    }
    .detail-sidebar .sidebar-links {
        display:grid;
        grid-template-columns:repeat(2,1fr);
        column-gap:20px;
    }
}

@media(max-width:760px) {
    .nav-dropdown .dropdown-menu {
        position:static;
        display:grid;
        box-shadow:none;
        width:auto;
        max-height:none;
        padding:0 0 0 12px;
        background:transparent;
        border:0;
    }
    .nav .nav-dropdown>button {
        display:none;
    }
    .nav .nav-dropdown {
        display:block;
    }
    .nav-dropdown .dropdown-menu a {
        padding:8px 10px;
    }
    .nav {
        gap:5px;
    }
    .nav a {
        font-size:14px;
    }
    .hero {
        min-height:610px;
    }
    .service img {
        height:210px;
    }
    .detail-sidebar .sidebar-links {
        grid-template-columns:1fr;
    }
    .section {
        padding:56px 0;
    }
    .subhero {
        min-height:390px;
    }
}

@media(max-width:520px) {
    .service {
        min-height:0;
    }
    .service img {
        height:200px;
    }
    .section-visual {
        aspect-ratio:4/3;
    }
    .top-link {
        right:12px;
        bottom:12px;
    }
}

/* Redaktioneller Feinschliff – reduzierte Schriftschnitte, klare Listen */
body {
    font-size:16px;
    line-height:1.65;
}

h1,h2,h3 {
    font-weight:650;
    letter-spacing:-.025em;
}

h1 {
    font-weight:700;
}

.eyebrow {
    font-weight:650;
    letter-spacing:1.3px;
}

.nav a,.nav .nav-dropdown>button {
    font-weight:550;
}

.brand {
    font-weight:750;
}

.button {
    font-weight:650;
}

.section h2 {
    font-size:clamp(30px,3.3vw,46px);
    line-height:1.2;
}

.section .lead {
    font-size:17px;
    line-height:1.75;
}

.article {
    max-width:850px;
}

.article>div:not(.other-links):not(.article-block) h2 {
    font-size:clamp(21px,2.1vw,27px);
    line-height:1.3;
    margin:35px 0 11px;
    font-weight:650;
    color:#20384a;
}

.article>div:not(.other-links):not(.article-block) p {
    font-size:16px;
    line-height:1.78;
    color:#45535f;
    margin:0 0 16px;
}

.article>div:not(.other-links):not(.article-block) p.intro-copy {
    font-size:18px;
    color:#273b4c;
    margin:24px 0 25px;
}

.article ul {
    padding-left:24px;
    margin:12px 0 26px;
    list-style:disc;
}

.article li {
    font-size:16px;
    font-weight:400;
    line-height:1.7;
    margin:8px 0;
    color:#45535f;
    padding-left:4px;
}

.article li::marker {
    color:#4c9ed7;
}

.service h3 {
    font-weight:650;
    font-size:20px;
    margin:12px 0 7px;
}

.service .num,.service .more {
    font-weight:600;
}

.service img {
    height:200px;
    object-fit:cover;
}

.feature h3,.detail-sidebar h3 {
    font-weight:650;
}

.detail-sidebar a {
    font-weight:450;
}

.subhero h1 {
    font-size:clamp(38px,5vw,66px);
    font-weight:700;
}

.subhero p {
    font-size:18px;
}

.section-visual {
    aspect-ratio:16/9;
}

.hero p {
    max-width:580px;
}

.dark .lead {
    color:#d0dbe4;
}

#ueber-uns .features {
    margin-top:30px;
}

#ueber-uns .lead {
    font-size:16px;
    max-width:900px;
}

#ueber-uns h2 {
    font-size:clamp(30px,3.3vw,45px);
}

.top-link {
    font-weight:650;
}

@media(max-width:760px) {
    .article>div:not(.other-links):not(.article-block) h2 {
        margin-top:28px;
    }
    .service img {
        height:220px;
    }
}

/* Neue, scanbare Leistungsseiten */
.detail-layout {
    display:block;
}

.detail-layout .article {
    max-width:1120px;
    margin:0 auto;
}

.detail-sidebar {
    display:none;
}

.subhero {
    min-height:390px;
    display:flex;
    align-items:center;
}

.subhero .wrap {
    padding-top:54px;
    padding-bottom:54px;
}

.subhero p {
    max-width:700px;
}

.service-overview {
    margin:0 0 42px;
}

.service-overview h2,.benefits h2,.process h2 {
    font-size:clamp(26px,3vw,38px);
    font-weight:650;
    line-height:1.2;
    color:#162b3d;
    margin:0 0 12px;
}

.service-overview p {
    font-size:18px;
    color:#526272;
    max-width:800px;
    line-height:1.7;
}

.quicklinks {
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin:23px 0 0;
}

.quicklinks a {
    border:1px solid #d5e5ef;
    border-radius:40px;
    background:#f3f9fd;
    color:#1c526f;
    padding:9px 15px;
    text-decoration:none;
    font-weight:550;
    font-size:14px;
}

.quicklinks a:hover {
    background:#e1f1fb;
}

.cards-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin:28px 0 55px;
}

.service-card {
    background:#fff;
    border:1px solid #e1e8ee;
    border-radius:14px;
    padding:27px 24px 25px;
    box-shadow:0 8px 26px #152a3a09;
}

.service-card .step {
    font-size:13px;
    font-weight:700;
    color:#4c9ed7;
    letter-spacing:.1em;
}

.service-card h3 {
    font-size:22px;
    line-height:1.3;
    font-weight:650;
    margin:13px 0 10px;
    color:#1a3144;
}

.service-card p {
    font-size:15px;
    color:#586978;
    line-height:1.65;
    margin:0 0 18px;
}

.service-card ul {
    list-style:none;
    padding:0;
    margin:0;
}

.service-card li {
    font-size:15px;
    color:#354c5c;
    margin:0;
    padding:9px 0 9px 20px;
    line-height:1.45;
    position:relative;
    border-top:1px solid #edf1f4;
}

.service-card li:before {
    content:"✓";
    position:absolute;
    left:0;
    top:9px;
    color:#318fcf;
    font-weight:700;
}

.benefits {
    background:#edf7fd;
    border-radius:16px;
    padding:30px;
    margin-bottom:50px;
}

.benefit-list {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px 30px;
    list-style:none;
    padding:0;
    margin:22px 0 0;
}

.benefit-list li {
    position:relative;
    padding:5px 0 5px 25px;
    margin:0;
    color:#24445c;
    font-size:16px;
}

.benefit-list li:before {
    content:"●";
    color:#4c9ed7;
    position:absolute;
    left:0;
}

.process {
    border-top:1px solid #e2eaf0;
    padding-top:30px;
    margin-bottom:32px;
}

.process p {
    font-size:16px;
    color:#526272;
    max-width:850px;
}

.photo-feature {
    display:grid;
    grid-template-columns:1.2fr .8fr;
    gap:24px;
    align-items:center;
    margin-bottom:48px;
}

.photo-feature img {
    width:100%;
    height:300px;
    object-fit:cover;
    border-radius:14px;
}

.photo-feature .photo-caption {
    font-size:13px;
    color:#627280;
    line-height:1.5;
}

.other-links {
    margin-bottom:20px;
}

@media(max-width:850px) {
    .cards-grid {
        grid-template-columns:1fr 1fr;
    }
    .photo-feature {
        grid-template-columns:1fr;
    }
}

@media(max-width:580px) {
    .cards-grid,.benefit-list {
        grid-template-columns:1fr;
    }
    .service-card {
        padding:23px;
    }
    .subhero {
        min-height:330px;
    }
    .benefits {
        padding:23px;
    }
    .photo-feature img {
        height:230px;
    }
}

/* Anklickbare Fotobeispiele je Leistung */
.card-gallery {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin:20px 0 8px;
}

.photo-open {
    display:block;
    overflow:hidden;
    border-radius:9px;
    background:#e4eaf0;
    aspect-ratio:4/3;
    outline-offset:3px;
}

.photo-open img {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .25s ease;
}

.photo-open:hover img,.photo-open:focus-visible img {
    transform:scale(1.06);
}

.card-photo-caption {
    font-size:12px!important;
    color:#657481!important;
    margin:0!important;
    font-weight:400!important;
}

.photo-lightbox[hidden] {
    display:none!important;
}

.photo-lightbox {
    position:fixed;
    inset:0;
    z-index:9999;
    background:rgba(4,10,16,.94);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:65px 18px 24px;
}

.photo-lightbox img {
    max-width:min(1200px,95vw);
    max-height:76vh;
    width:auto;
    height:auto;
    object-fit:contain;
    border-radius:5px;
}

.photo-lightbox p {
    color:#f3f6f8;
    font-size:14px;
    text-align:center;
    margin:15px 0;
}

.lightbox-close {
    position:absolute;
    top:16px;
    right:25px;
    color:white;
    font-size:40px;
    line-height:1;
    background:transparent;
    border:0;
    cursor:pointer;
}

@media(max-width:480px) {
    .card-gallery {
        gap:7px;
    }
    .photo-lightbox {
        padding-inline:8px;
    }
}

/* Bilder in allen Leistungskarten auf einer einheitlichen unteren Linie */
.cards-grid {
    align-items:stretch;
}

.service-card {
    display:flex;
    flex-direction:column;
    min-width:0;
}

.service-card .card-gallery {
    margin-top:auto;
    padding-top:22px;
    margin-bottom:9px;
}

.service-card .card-photo-caption {
    margin-top:0!important;
}

.service-card .card-gallery .photo-open {
    aspect-ratio:4/3;
}

/* Galerie-Steuerung für Maus, Touch und Tastatur */
.photo-lightbox {
    padding-left:74px;
    padding-right:74px;
}

.lightbox-prev,.lightbox-next {
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    display:grid;
    place-items:center;
    width:52px;
    height:66px;
    border:1px solid #ffffff50;
    border-radius:9px;
    background:#17232bcc;
    color:white;
    font-size:30px;
    cursor:pointer;
    transition:background .2s;
}

.lightbox-prev {
    left:16px;
}

.lightbox-next {
    right:16px;
}

.lightbox-prev:hover,.lightbox-next:hover {
    background:#4c9ed7;
    color:#08151f;
}

.lightbox-prev:focus-visible,.lightbox-next:focus-visible,.lightbox-close:focus-visible {
    outline:3px solid #4c9ed7;
    outline-offset:4px;
}

@media(max-width:600px) {
    .photo-lightbox {
        padding-left:42px;
        padding-right:42px;
    }
    .lightbox-prev,.lightbox-next {
        width:34px;
        height:55px;
        font-size:23px;
    }
    .lightbox-prev {
        left:3px;
    }
    .lightbox-next {
        right:3px;
    }
}

/* Originalmarke auf allen Leistungs- und Rechteseiten */
.site-header a.brand {
    display:flex;
    align-items:center;
    background:#fff;
    border-radius:4px;
    padding:6px 10px;
    width:225px;
    min-width:190px;
    height:auto;
    line-height:1;
}

.site-header a.brand img {
    display:block;
    width:100%;
    height:auto;
    object-fit:contain;
}

@media(max-width:650px) {
    .site-header a.brand {
        width:180px;
        min-width:155px;
    }
}

/* Original-Logo: festes Seitenverhaeltnis der PDF-Grafik (2816:866), niemals verzerren */
a.logo, .head a.logo, .foot a.logo, .site-header a.brand {
    box-sizing:border-box!important;
    width:clamp(170px, 17vw, 258px)!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:auto!important;
    flex:0 0 auto!important;
    display:block!important;
    padding:5px 8px!important;
    background:#fff!important;
    line-height:normal!important;
}

a.logo img, .head a.logo img, .foot a.logo img, .site-header a.brand img {
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:2816 / 866!important;
    object-fit:contain!important;
    object-position:center!important;
    transform:none!important;
}

@media(max-width:700px) {
    a.logo,.head a.logo,.foot a.logo,.site-header a.brand {
        width:175px!important;
    }
}

/* KORREKTUR: Originaldatei transparent, ohne weiße Hintergrundbox; Bild und Text getrennt */
.head a.logo,.foot a.logo,.site-header a.brand,a.logo {
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    border-radius:0!important;
    padding:0!important;
    width:clamp(180px,21vw,330px)!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    aspect-ratio:auto!important;
    display:block!important;
    line-height:1!important;
}

.head a.logo img,.foot a.logo img,.site-header a.brand img,a.logo img {
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:100%!important;
    max-height:none!important;
    aspect-ratio:1000/285!important;
    object-fit:contain!important;
    transform:none!important;
}

.hero {
    background:#fff!important;
    min-height:clamp(510px,43vw,700px)!important;
    position:relative!important;
    overflow:hidden!important;
    color:#101923!important;
    isolation:isolate;
}

.hero::before {
    display:none!important;
}

.hero::after {
    content:"";
    position:absolute;
    inset:0 0 0 44%;
    background-image:url("bilder/hero-frau-farben.jpg");
    background-size:cover;
    background-position:center;
    z-index:-2;
    pointer-events:none;
}

.hero .hero-inner {
    pointer-events:auto!important;
    z-index:2!important;
    padding:80px 0!important;
}

.hero .hero-inner::before {
    content:"";
    position:absolute;
    top:0;
    bottom:0;
    left:-5vw;
    width:min(64vw,940px);
    background:linear-gradient(90deg,#fff 0%,#fff 67%,rgba(255,255,255,.88) 82%,rgba(255,255,255,0) 100%);
    z-index:-1;
    pointer-events:none;
}

.hero .hero-text {
    max-width:min(51vw,690px)!important;
}

.hero .kicker {
    color:#0e6fae!important;
    text-shadow:none!important;
    font-size:14px!important;
    font-weight:700!important;
    letter-spacing:2px!important;
}

.hero h1 {
    color:#111827!important;
    font-size:clamp(42px,5.1vw,80px)!important;
    line-height:.97!important;
    letter-spacing:-2px!important;
    text-shadow:none!important;
    margin:24px 0!important;
}

.hero h1 span {
    color:#4c9ed7!important;
}

.hero p {
    color:#283746!important;
    text-shadow:none!important;
    font-size:clamp(16px,1.5vw,20px)!important;
    line-height:1.55!important;
    max-width:590px!important;
}

.hero .buttons {
    position:relative;
    z-index:4;
}

.hero .buttons a {
    pointer-events:auto!important;
}

@media(max-width:760px) {
    .head a.logo,.foot a.logo,.site-header a.brand,a.logo {
        width:clamp(160px,43vw,245px)!important;
    }
    .hero {
        min-height:680px!important;
        align-items:flex-start!important;
    }
    .hero::after {
        inset:42% 0 0 0;
        background-position:center 30%;
    }
    .hero .hero-inner {
        padding:36px 0 0!important;
    }
    .hero .hero-inner::before {
        left:-15px;
        top:0;
        bottom:auto;
        height:370px;
        width:calc(100% + 30px);
        background:linear-gradient(#fff 78%,rgba(255,255,255,0));
    }
    .hero .hero-text {
        max-width:100%!important;
    }
    .hero h1 {
        font-size:clamp(38px,9vw,58px)!important;
        margin:15px 0!important;
    }
    .hero p {
        font-size:15px!important;
    }
    .hero .kicker {
        font-size:11px!important;
    }
}

.site-header a.brand {
    background:transparent!important;
    padding:0!important;
    max-width:240px;
    min-width:170px;
    height:auto!important;
}

.site-header a.brand img {
    width:100%;
    height:auto!important;
    object-fit:contain;
}

/* Finale Korrektur: dunkle Navigation, Original-Logo, Hauptgrafik ohne Beschnitt */
.head,.site-header {
    background:#081a2b!important;
    color:#fff!important;
}

.head .nav>a,.head .drop>a,.site-header nav a {
    color:#fff!important;
}

.head .nav .action {
    color:#fff!important;
}

.head .drop-list {
    background:#102d43!important;
}

.head .drop-list a {
    color:#fff!important;
}

.head a.logo,.foot a.logo,.site-header a.brand {
    background:rgba(225,239,248,.94)!important;
    border-radius:5px!important;
    padding:7px 11px!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    width:clamp(205px,24vw,355px)!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    aspect-ratio:auto!important;
}

.head a.logo img,.foot a.logo img,.site-header a.brand img {
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:1000 / 285!important;
    object-fit:contain!important;
}

.hero.hero-as-image {
    background:none!important;
    display:block!important;
    min-height:0!important;
    height:auto!important;
    padding:0!important;
    overflow:visible!important;
}

.hero.hero-as-image::before,.hero.hero-as-image::after {
    display:none!important;
}

.hero.hero-as-image img.hero-full-image {
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    object-fit:contain!important;
    object-position:center!important;
    aspect-ratio:2048 / 684!important;
}

@media(max-width:720px) {
    .head a.logo,.site-header a.brand {
        width:clamp(175px,45vw,270px)!important;
        padding:5px 7px!important;
    }
    .hero.hero-as-image {
        min-height:0!important;
        height:auto!important;
    }
}

/* Drei Leistungen mit jeweils einem Bild pro Leistungspunkt */
body:has(.card-gallery[data-single-photo]) .card-gallery[data-single-photo]{grid-template-columns:1fr}

.card-gallery[data-single-photo="true"]{grid-template-columns:minmax(0,1fr)}
.card-gallery[data-single-photo="true"] .photo-open{aspect-ratio:16/9}

/* Logo oben und unten: ohne farbigen, abgerundeten Hintergrundrahmen. */
.head a.logo, .foot a.logo, .site-header a.brand, a.logo {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 0 !important;
}
.head a.logo img, .foot a.logo img, .site-header a.brand img, a.logo img {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
}

/* Navigation: weiße Texte auf dunklem Hintergrund – alle Seiten */
.head .nav > a,
.head .drop > a,
.head .drop > button,
.head .drop-list a,
.site-header .nav > a,
.site-header .nav .nav-dropdown > button,
.site-header .nav .dropdown-menu a,
.site-header .nav a,
.site-header .menu-btn {
    color: #ffffff !important;
}
.site-header .nav > a:hover,
.site-header .nav .nav-dropdown > button:hover,
.head .nav > a:hover {
    color: #ffffff !important;
}
/* Bildansicht: kein leerer Untertitelbereich */
#photo-lightbox p { display: none !important; }

/* Folienbeschriftung: jeweils ein Referenzfoto über die volle Kartenbreite. */
body:has(.gallery-full-width) .service-card .gallery-full-width {
    display: grid;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    align-self: stretch;
}
body:has(.gallery-full-width) .service-card .gallery-full-width .photo-open {
    width: 100%;
    aspect-ratio: 16 / 9;
}
body:has(.gallery-full-width) .service-card .gallery-full-width .photo-open img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Telefon rechts neben dem Original-Logo – alle Seiten */
.header-brand-contact { display:flex; align-items:center; gap:clamp(12px,2vw,32px); min-width:0; flex-shrink:0; }
.header-brand-contact .header-phone { display:inline-block; color:#fff !important; font-size:clamp(17px,1.65vw,26px); font-weight:800; line-height:1.2; white-space:nowrap; letter-spacing:.01em; text-decoration:none; background:transparent !important; border:0 !important; padding:0 !important; box-shadow:none !important; }
.header-brand-contact .header-phone:hover,.header-brand-contact .header-phone:focus-visible { color:#7bc5f2 !important; }
@media (max-width:1150px) { .header-brand-contact .header-phone { font-size:18px; } .header-brand-contact { gap:12px; } }
@media (max-width:760px) { .header-brand-contact .header-phone { font-size:clamp(13px,3vw,17px); } .header-brand-contact { gap:8px; } }
@media (max-width:390px) { .header-brand-contact .header-phone { font-size:12px; } }
