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

* {
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
}

body {
    margin:0;
    font:15px/1.5 Arial,Helvetica,sans-serif;
    color:#0b1d2c;
}

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

.head {
    background:#071a2beF;
    color:white;
    position:sticky;
    top:0;
    z-index:20;
}

.head-inner {
    display:flex;
    justify-content:space-between;
    align-items:center;
    min-height:66px;
    gap:22px;
}

.logo {
    color:#081a2b;
    text-decoration:none;
    font-size:32px;
    font-weight:900;
    line-height:.8;
    letter-spacing:-1px;
    display:flex;
    flex-direction:column;
    min-width:140px;
}

.logo span {
    color:#009ef2;
    font-size:40px;
}

.logo small {
    font-size:13px;
    letter-spacing:7px;
    margin:3px 0 0 4px;
}

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

.nav a {
    color:white;
    text-decoration:none;
    font-weight:750;
    font-size:12px;
}

.nav>a:hover,.drop>a:hover {
    color:#4c9ed7;
}

.nav .action {
    background:#009bf1;
    border-radius:5px;
    padding:13px 18px;
}

.drop {
    position:relative;
}

.drop-list {
    display:none;
    position:absolute;
    top:100%;
    left:-10px;
    background:#0b263a;
    padding:12px;
    min-width:255px;
    box-shadow:0 10px 20px #0004;
}

.drop:hover .drop-list,.drop:focus-within .drop-list {
    display:grid;
}

.drop-list a {
    padding:8px;
    font-size:13px;
}

.toggle {
    display:none;
}

.hero {
    min-height:490px;
    background:url("titelbild.jpg") center 42%/cover no-repeat;
    position:relative;
    color:white;
    display:flex;
    align-items:center;
}

.hero:before {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(1,8,16,.94) 0%,rgba(1,8,16,.83) 29%,rgba(1,8,16,.25) 61%,transparent 85%);
}

.hero-inner {
    position:relative;
    padding:60px 0;
}

.hero-text {
    max-width:600px;
}

.kicker {
    font-size:12px;
    font-weight:750;
    letter-spacing:1.1px;
}

.hero h1 {
    font-size:clamp(48px,6.6vw,105px);
    line-height:.9;
    font-weight:900;
    letter-spacing:-3px;
    margin:20px 0;
    color:white;
}

.hero h1 span {
    color:#009df2;
}

.hero h2 {
    font-size:21px;
    letter-spacing:2px;
    margin:0 0 12px;
    color:white;
}

.hero p {
    font-size:18px;
    max-width:490px;
    margin:0 0 23px;
    color:white;
}

.buttons {
    display:flex;
    gap:13px;
    flex-wrap:wrap;
}

.buttons a,.contact a {
    display:inline-block;
    background:#009af0;
    color:white;
    text-decoration:none;
    padding:14px 22px;
    border-radius:5px;
    font-size:12px;
    font-weight:750;
}

.buttons .outline {
    background:#09152288;
    border:1px solid white;
}

.about {
    background:white;
    padding:42px 0;
}

.about-grid {
    display:grid;
    grid-template-columns:1fr 1.55fr;
    gap:40px;
    align-items:center;
}

.label {
    font-size:12px;
    letter-spacing:1.4px;
    font-weight:800;
    color:#008fdf;
}

.about h2 {
    font-size:clamp(28px,2.5vw,38px);
    line-height:1.12;
    margin:7px 0 12px;
}

.about p {
    margin:0;
    color:#52616c;
}

.facts {
    display:grid;
    grid-template-columns:repeat(4,1fr);
}

.facts>div {
    border-left:1px solid #e0e8ee;
    padding:6px 15px;
    display:flex;
    align-items:center;
    flex-direction:column;
    gap:5px;
    text-align:center;
}

.facts b {
    background:#e6f4ff;
    color:#009af0;
    font-size:23px;
    width:47px;
    height:47px;
    border-radius:50%;
    display:grid;
    place-items:center;
    margin-bottom:6px;
}

.facts strong {
    font-size:14px;
}

.facts span {
    font-size:12px;
    color:#586774;
}

.services {
    background:#e9f1f7;
    padding:34px 0 48px;
}

.services h2 {
    font-size:clamp(27px,2.8vw,39px);
    line-height:1.15;
    margin:6px 0;
}

.services h2 em {
    color:#0095e8;
    font-style:normal;
}

.section-intro {
    margin:0 0 20px;
    color:#53636f;
}

.tiles {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:14px;
}

.tile {
    background:white;
    text-decoration:none;
    color:#102232;
    display:flex;
    flex-direction:column;
    border-radius:6px;
    overflow:hidden;
    box-shadow:0 3px 15px #173e5212;
    transition:transform .2s;
}

.tile:hover {
    transform:translateY(-5px);
}

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

.tile-content {
    padding:14px;
    display:flex;
    flex:1;
    flex-direction:column;
}

.tile h3 {
    font-size:17px;
    line-height:1.2;
    margin:0 0 9px;
    font-weight:750;
    min-height:40px;
}

.tile ul {
    margin:0 0 14px;
    padding-left:18px;
    flex:1;
}

.tile li {
    font-size:13px;
    line-height:1.55;
    color:#344858;
}

.tile li::marker {
    color:#009cf1;
}

.tile-button {
    background:#009af0;
    color:white;
    padding:10px 12px;
    text-align:center;
    border-radius:4px;
    font-size:11px;
    font-weight:750;
    text-transform:uppercase;
}

.notice {
    font-size:12px;
    color:#657480;
    margin:20px 0 0;
}

.contact {
    background:#102f47;
    color:white;
    padding:45px 0;
}

.contact-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;
}

.contact h2 {
    font-size:29px;
    margin:5px 0;
    color:white;
}

.contact p {
    margin:0;
    color:#d2e1eb;
}

.foot {
    background:#071a2b;
    color:#d6e3ed;
    padding:22px 0;
}

.foot-inner {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:25px;
}

.foot .logo {
    font-size:24px;
    min-width:105px;
}

.foot .logo span {
    font-size:30px;
}

.foot .logo small {
    font-size:10px;
    letter-spacing:5px;
}

.foot-inner>span {
    font-size:12px;
}

.foot-inner>div {
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.foot a:not(.logo) {
    color:#d6e3ed;
    font-size:12px;
    text-decoration:none;
}

@media(min-width:1350px) {
    .tiles {
        grid-template-columns:repeat(8,minmax(0,1fr));
        gap:9px;
    }
    .tile img {
        height:120px;
    }
    .tile-content {
        padding:10px;
    }
    .tile h3 {
        font-size:14px;
        min-height:37px;
    }
    .tile li {
        font-size:11px;
    }
    .tile-button {
        font-size:10px;
        padding:9px 5px;
    }
}

@media(max-width:970px) {
    .nav {
        gap:12px;
    }
    .nav a {
        font-size:11px;
    }
    .about-grid {
        grid-template-columns:1fr;
    }
    .tiles {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:720px) {
    .wrap {
        width:calc(100% - 30px);
    }
    .toggle {
        display:block;
        background:#10364e;
        border:1px solid #3d6075;
        color:white;
        padding:10px;
        border-radius:4px;
    }
    .nav {
        display:none;
        position:absolute;
        top:66px;
        left:0;
        right:0;
        background:#0a2639;
        padding:17px;
        flex-direction:column;
        align-items:stretch;
    }
    .nav.open {
        display:flex;
    }
    .drop-list {
        display:grid;
        position:static;
        box-shadow:none;
        background:#15374c;
    }
    .hero {
        min-height:560px;
        background-position:56% center;
    }
    .hero:before {
        background:linear-gradient(90deg,#06121bea,#06121b90 80%,#06121b33);
    }
    .hero h1 {
        letter-spacing:-2px;
    }
    .hero h2 {
        font-size:16px;
    }
    .hero p {
        font-size:16px;
    }
    .facts {
        grid-template-columns:repeat(2,1fr);
        gap:12px;
    }
    .facts>div {
        border:0;
        background:#f2f8fc;
        border-radius:6px;
        padding:13px;
    }
    .tile img {
        height:125px;
    }
    .tile h3 {
        font-size:15px;
    }
    .tile-content {
        padding:10px;
    }
    .tile li {
        font-size:12px;
    }
    .contact-inner,.foot-inner {
        flex-direction:column;
        align-items:flex-start;
    }
}

@media(max-width:420px) {
    .tiles {
        grid-template-columns:1fr;
    }
    .tile img {
        height:200px;
    }
}

.head .logo,.foot .logo {
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:218px;
    max-width:240px;
    background:#fff;
    padding:7px 10px;
    border-radius:4px;
}

.head .logo img,.foot .logo img {
    width:100%;
    height:auto;
    display:block;
    object-fit:contain;
}

.foot .logo {
    max-width:205px;
    min-width:185px;
}

.hero {
    min-height:610px;
    background-image:url("bilder/startseite-hero-originalfarben.jpg");
    background-position:center;
    background-size:cover;
}

.hero:before {
    background:linear-gradient(90deg,rgba(2,10,18,.52) 0%,rgba(2,10,18,.17) 42%,transparent 70%);
}

.hero-text {
    max-width:670px;
}

.hero h1 {
    font-size:clamp(52px,6.4vw,103px);
    text-shadow:0 3px 13px rgba(0,0,0,.35);
}

.hero h2,.hero p,.kicker {
    text-shadow:0 2px 8px rgba(0,0,0,.6);
}

@media(max-width:720px) {
    .head .logo {
        min-width:170px;
        max-width:195px;
    }
    .hero {
        min-height:590px;
        background-position:55% center;
    }
    .hero:before {
        background:linear-gradient(90deg,rgba(2,10,18,.82),rgba(2,10,18,.32));
    }
}

/* 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:#081A2B!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;
    }
}

.hero {
    background-image:url("bilder/startseite-hero-originalfarben.png")!important;
    background-position:center!important;
    background-size:cover!important;
}

.hero:before {
    background:transparent!important;
}

.hero {
    min-height:clamp(330px,32.5vw,730px)!important;
}

.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;
    }
}

/* Neue Bildversion: Originalgrafik vollständig, keine Überlagerung */
.head .logo,.foot .logo {
    background:transparent!important;
    padding:0!important;
    max-width:245px;
    min-width:180px;
    display:flex;
    align-items:center;
}

.head .logo img,.foot .logo img {
    width:100%;
    height:auto!important;
    max-height:none!important;
    object-fit:contain;
    display:block;
}

.head {
    background:#fff;
    color:#101b26;
}

.nav a {
    color:#101b26;
}

.nav .action {
    color:white;
}

.drop-list a {
    color:white;
}

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

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

.hero-full-image {
    width:100%;
    height:auto!important;
    max-height:none!important;
    display:block;
    object-fit:contain!important;
}

.hero-as-image a.hotspot-services,.hero-as-image a.hotspot-contact {
    position:absolute;
    display:block;
    top:82%;
    height:10%;
    z-index:2;
}

.hero-as-image a.hotspot-services {
    left:4%;
    width:16%;
}

.hero-as-image a.hotspot-contact {
    left:21%;
    width:14%;
}

@media(max-width:700px) {
    .head .logo {
        min-width:155px;
        max-width:185px;
    }
    .hero.hero-as-image {
        min-height:0!important;
    }
    .hero-as-image a.hotspot-services,.hero-as-image a.hotspot-contact {
        top:81%;
        height:12%;
    }
}

/* 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: #081A2B!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;
    }
}

/* Startseiten-Hero: separates Original-Logo und echte HTML-Texte neben dem Bild */
.hero.hero-split {
    background:#fff!important;
    display:block!important;
    min-height:0!important;
    height:auto!important;
    color:#101b29!important;
    padding:0!important;
    overflow:hidden!important;
}

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

.hero-split-inner {
    display:grid;
    grid-template-columns:44% 56%;
    width:100%;
    min-height:520px;
    align-items:stretch;
}

.hero-split-copy {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    padding:40px 2vw 45px max(26px,calc((100vw - 1440px)/2));
    z-index:1;
    background:#fff;
}

.hero-brand-logo {
    width:min(100%,580px);
    height:auto!important;
    aspect-ratio:auto!important;
    object-fit:contain;
    display:block;
    margin-bottom:25px;
}

.hero-split-copy h1 {
    font-size:clamp(38px,4.1vw,76px)!important;
    line-height:1.04!important;
    font-weight:900!important;
    letter-spacing:-1.9px!important;
    color:#0a1620!important;
    margin:0 0 18px!important;
    text-shadow:none!important;
    max-width:680px;
}

.hero-split-copy .hero-subtitle {
    font-size:clamp(12px,1.05vw,17px)!important;
    font-weight:700;
    letter-spacing:2.2px;
    color:#142636!important;
    margin:0 0 16px!important;
    text-shadow:none!important;
}

.hero-split-copy .hero-description {
    font-size:clamp(15px,1.2vw,19px)!important;
    line-height:1.55!important;
    color:#2e3b45!important;
    margin:0 0 25px!important;
    text-shadow:none!important;
    max-width:580px;
}

.hero-buttons {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.hero-buttons .hero-btn {
    padding:14px 19px;
    background:#4c9ed7;
    color:#fff;
    text-decoration:none;
    border-radius:5px;
    font-size:12px;
    font-weight:750;
    white-space:nowrap;
}

.hero-buttons .hero-btn-outline {
    background:#fff;
    color:#0b2233;
    border:1px solid #142a3a;
}

.hero-split-art {
    min-width:0;
    display:flex;
    align-items:stretch;
    background:#fff;
}

.hero-split-art img {
    width:100%;
    height:100%;
    max-height:none;
    object-fit:contain;
    object-position:center center;
    display:block;
}

@media(max-width:900px) {
    .hero-split-inner {
        grid-template-columns:1fr;
    }
    .hero-split-copy {
        padding:38px 24px 30px;
    }
    .hero-brand-logo {
        max-width:470px;
    }
    .hero-split-art img {
        height:auto;
        width:100%;
        object-fit:contain;
    }
    .hero-split-art {
        display:block;
    }
    .hero-split-copy h1 {
        font-size:clamp(36px,7vw,62px)!important;
    }
}

.head a.logo img,.foot a.logo img {
    aspect-ratio: auto!important;
    width: 100%!important;
    height: auto!important;
    object-fit: contain!important;
    color: #081A2B;
}

/* Leistungsübersicht: vier große Kacheln je Reihe, zwei Reihen */
@media (min-width: 971px) {
    .tiles {
        grid-template-columns:repeat(4,minmax(0,1fr)) !important;
        gap:22px !important;
    }
    .tile img {
        height:245px !important;
        width:100%;
        object-fit:cover;
    }
    .tile-content {
        padding:22px !important;
    }
    .tile h3 {
        font-size:22px !important;
        min-height:0 !important;
        margin-bottom:14px;
    }
    .tile li {
        font-size:15px !important;
        line-height:1.7;
    }
    .tile-button {
        font-size:13px !important;
        padding:13px 16px !important;
    }
}

@media (min-width: 721px) and (max-width: 970px) {
    .tiles {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:18px;
    }
    .tile img {
        height:225px !important;
    }
}

@media (max-width:720px) {
    .tiles {
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
        gap:12px;
    }
    .tile img {
        height:160px !important;
    }
}

@media (max-width:480px) {
    .tiles {
        grid-template-columns:1fr !important;
    }
    .tile img {
        height:250px !important;
    }
}

/* ================================================================
   STARTSEITE 2026: Original-Hauptgrafik vollständig sichtbar.
   Keine Bildbeschneidung, kein zusätzliches Hintergrundmotiv.
   ================================================================ */
.hero.hero-split{
    display:block !important;
    min-height:0 !important;
    background:none !important;
    padding:0 !important;
    position:relative;
    color:#102232;
}
.hero.hero-split::before{display:none !important;}
.hero-split .hero-split-inner{
    display:grid !important;
    grid-template-columns:1fr !important;
    max-width:none !important;
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    position:relative;
    min-height:0 !important;
}
.hero-split .hero-split-art{
    display:block !important;
    grid-row:1;
    grid-column:1;
    width:100% !important;
    position:relative !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
}
.hero-split .hero-split-art img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center !important;
}
.hero-split .hero-split-copy{
    grid-row:1;
    grid-column:1;
    z-index:2;
    align-self:center;
    justify-self:start;
    width:43%;
    max-width:760px;
    padding:clamp(20px,3vw,65px) clamp(16px,4vw,75px) !important;
    position:relative !important;
    background:none !important;
}
.hero-split .hero-split-copy h1{
    color:#0a2032 !important;
    text-shadow:none !important;
    font-size:clamp(27px,3.1vw,64px) !important;
    line-height:1.08 !important;
}
.hero-split .hero-split-copy p{color:#273c4b !important;text-shadow:none !important;}
.hero-split .hero-split-copy .hero-subtitle{color:#087ec1 !important;}
@media(max-width:800px){
    .hero-split .hero-split-copy{
        grid-row:2;
        grid-column:1;
        width:100%;
        max-width:none;
        background:#f5f9fc !important;
        padding:28px 22px 34px !important;
    }
    .hero-split .hero-split-copy h1{font-size:clamp(29px,6vw,46px) !important;}
}

/* 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; }

/* ============================================================
   KONTAKT – Anfrageformular auf der Startseite
   ============================================================ */
.contact { padding: 76px 0; }
.contact .inquiry-layout { display:grid; grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr); gap:clamp(28px,5vw,80px); align-items:start; }
.contact .inquiry-intro h2 { margin:16px 0 22px; }
.contact .inquiry-intro p { line-height:1.7; max-width:510px; }
.contact .inquiry-contact { display:flex; flex-direction:column; gap:12px; margin-top:28px; }
.contact .inquiry-contact a { color:inherit; text-decoration:underline; }
.contact .inquiry-card { background:#fff; color:#152a3c; border:1px solid #d9e6ef; border-radius:18px; box-shadow:0 16px 42px rgba(9,34,57,.12); padding:clamp(22px,3vw,38px); }
.contact .inquiry-card h3 { font-size:clamp(22px,2vw,29px); margin:0 0 25px; color:#102b43; }
.contact .inquiry-form { display:flex; flex-direction:column; gap:18px; }
.contact .inquiry-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px; }
.contact .inquiry-form label { display:flex; flex-direction:column; gap:8px; font-size:14px; font-weight:650; color:#253c4f; }
.contact .inquiry-form label > span[aria-hidden] { display:inline; }
.contact .inquiry-form input:not([type=checkbox]), .contact .inquiry-form select, .contact .inquiry-form textarea { box-sizing:border-box; display:block; width:100%; min-width:0; border:1px solid #c9d7e2; border-radius:9px; padding:13px 14px; background:#f8fbfd; color:#142d43; font:inherit; font-size:15px; outline-offset:3px; }
.contact .inquiry-form textarea { resize:vertical; min-height:135px; }
.contact .inquiry-form input:focus, .contact .inquiry-form select:focus, .contact .inquiry-form textarea:focus { border-color:#4c9ed7; }
.contact .inquiry-form .inquiry-consent { display:flex; flex-direction:row; align-items:flex-start; gap:11px; line-height:1.5; font-weight:400; }
.contact .inquiry-consent input { margin-top:4px; accent-color:#287db7; }
.contact .inquiry-consent a { color:#136ba7; text-decoration:underline; }
.contact .inquiry-submit { display:block; width:100%; cursor:pointer; border:0; border-radius:10px; background:#2589c6; color:#fff; font:inherit; font-weight:750; padding:16px 22px; transition:background .2s; }
.contact .inquiry-submit:hover { background:#136a9d; }
.contact .inquiry-hint { font-size:12px; line-height:1.6; color:#64788a; margin:0; }
@media(max-width:850px){ .contact .inquiry-layout { grid-template-columns:1fr; } }
@media(max-width:520px){ .contact .inquiry-row { grid-template-columns:1fr; } .contact { padding:48px 0; } }

/* Kontakt: dezentes Formular rechts, Anschrift und Kontaktdaten links */
.contact { padding: 66px 0; }
.contact .inquiry-layout { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(30px, 5vw, 75px); align-items: start; }
.contact .inquiry-card { background: #fff; border: 1px solid #e0e6eb; border-radius: 10px; box-shadow: none; padding: clamp(20px, 2.6vw, 30px); }
.contact .inquiry-card h3 { font-size: 22px; margin-bottom: 20px; }
.contact .inquiry-form { gap: 14px; }
.contact .inquiry-form label { font-weight: 500; font-size: 13px; }
.contact .inquiry-form input:not([type=checkbox]), .contact .inquiry-form select, .contact .inquiry-form textarea { background: #fff; border: 1px solid #d9e0e6; border-radius: 5px; padding: 10px 12px; font-size: 14px; }
.contact .inquiry-form textarea { min-height: 105px; }
.contact .inquiry-submit { background: #276e9b; border-radius: 5px; padding: 13px 18px; font-size: 14px; font-weight: 600; }
.contact .inquiry-submit:hover { background: #1a567d; }
.contact .inquiry-contact-details { margin-top: 30px; padding-top: 24px; border-top: 1px solid rgba(120, 155, 180, .35); }
.contact .inquiry-contact-details h3 { font-size: 19px; margin: 0 0 20px; }
.contact .inquiry-contact-details address { font-style: normal; display: flex; flex-direction: column; gap: 18px; }
.contact .contact-detail { display: flex; flex-direction: column; gap: 5px; line-height: 1.55; }
.contact .contact-detail strong { font-size: 13px; font-weight: 700; }
.contact .contact-detail a { text-decoration: none; }
.contact .contact-detail a:hover { text-decoration: underline; }
@media (max-width: 850px) { .contact .inquiry-layout { grid-template-columns: 1fr; } }

/* Kontakt: Telefon und E-Mail ohne hinterlegte Balken / Flächen */
.contact .inquiry-contact-details .contact-detail a[href^="tel:"],
.contact .inquiry-contact-details .contact-detail a[href^="mailto:"] {
    display: inline !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    color: inherit !important;
    text-decoration: none;
}
.contact .inquiry-contact-details .contact-detail a:hover { text-decoration: underline; }
/* Datenschutz-Link: weiße Schrift auf kontrastreichem, dunklem Hintergrund */
.contact .inquiry-consent a[href="datenschutz.html"] {
    display: inline-block;
    padding: 2px 7px;
    color: #ffffff !important;
    background: #1b547a !important;
    border-radius: 4px;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.contact .inquiry-consent a[href="datenschutz.html"]:hover,
.contact .inquiry-consent a[href="datenschutz.html"]:focus-visible {
    color: #ffffff !important;
    background: #103d5d !important;
}
/* Sprung zum Formular: Platz für die fixierte Navigation */
#projektanfrage { scroll-margin-top: 115px; }

/* 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; } }