/* =====================================
HERO
===================================== */

.standort-hero{

    position:relative;
    height:620px;

    overflow:hidden;

    display:flex;
    align-items:center;

}

.standort-hero-bg{

    position:absolute;
    inset:0;

}

.standort-hero-bg img{

    width:100%;
    height:100%;

    object-fit:cover;

}

.standort-hero-overlay{

    position:absolute;
    inset:0;

    background:
    linear-gradient(
        90deg,
        rgba(8,18,45,.80) 0%,
        rgba(8,18,45,.58) 34%,
        rgba(8,18,45,.18) 65%,
        rgba(8,18,45,.05) 100%
    );

}

.standort-hero .container{

    position:relative;
    z-index:2;

}

.hero-breadcrumb{

    color:#fff;

    margin-bottom:65px;

    font-size:14px;

    display:flex;
    gap:14px;
    align-items:center;

    opacity:.85;

}

.hero-breadcrumb a{

    color:#fff;

}

.hero-badge{

    display:inline-flex;

    padding:7px 18px;

    border:1px solid rgba(255,255,255,.35);

    border-radius:50px;

    color:#fff;

    text-transform:uppercase;

    letter-spacing:.12em;

    font-size:12px;

    margin-bottom:22px;

}

.standort-hero-content{

    max-width:520px;

}

.standort-hero-content h1{

    color:#fff;

    font-size:78px;

    line-height:.95;

    margin-bottom:24px;

}

.standort-hero-content p{

    color:#fff;

    opacity:.92;

    font-size:24px;

    line-height:1.55;

    margin-bottom:45px;

}

.hero-buttons{

    display:flex;

    gap:16px;

}

.hero-buttons .btn{

    height:56px;

    padding:0 30px;

    display:inline-flex;

    align-items:center;

    gap:12px;

    border-radius:12px;

    font-weight:600;

}

.btn-primary{

    background:#3158ff;

    color:#fff;

}

.btn-secondary{

    background:rgba(255,255,255,.12);

    color:#fff;

    border:1px solid rgba(255,255,255,.25);

    backdrop-filter:blur(8px);

}

.btn-secondary:hover{

    background:#fff;
    color:#111;

}

@media(max-width:991px){

.standort-hero{

height:520px;

}

.standort-hero-content h1{

font-size:54px;

}

.standort-hero-content p{

font-size:18px;

}

.hero-breadcrumb{

margin-bottom:35px;

}

}

@media(max-width:768px){

.hero-buttons{

flex-direction:column;

}

.standort-hero{

height:460px;

}

.standort-hero-content h1{

font-size:44px;

}

}

/* ==========================================
INFO
========================================== */

.standort-info{

    padding:90px 0;

    background:#fff;

}

.info-card{

    background:#fff;

    border:1px solid #ECEEF5;

    border-radius:20px;

    overflow:hidden;

    display:grid;

    grid-template-columns:360px 1fr;

}

.info-sidebar{

    padding:55px 45px;

    border-right:1px solid #ECEEF5;

}

.info-sidebar h2{

    font-size:30px;

    margin-bottom:45px;

}

.info-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    margin-bottom:32px;

}

.info-icon{

    width:42px;

    height:42px;

    flex:0 0 42px;

    border-radius:50%;

    background:#F5F8FF;

    color:#3158ff;

    display:flex;

    align-items:center;

    justify-content:center;

}

.info-icon svg{

    width:20px;

    height:20px;

}

.info-item strong{

    display:block;

    font-size:15px;

    margin-bottom:8px;

    font-weight:700;

}

.info-item span{

    color:#6B7280;

    line-height:1.8;

    font-size:15px;

}

.info-item a{

    color:inherit;

}

.maps-button{

    margin-top:20px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    width:100%;

    height:56px;

    border:2px solid #3158ff;

    border-radius:12px;

    color:#3158ff;

    font-weight:600;

    transition:.3s;

}

.maps-button:hover{

    background:#3158ff;

    color:#fff;

}

.info-content{

    padding:55px 60px;

}

.info-content h2{

    font-size:30px;

    margin-bottom:35px;

}

.beschreibung{

    max-width:640px;

    color:#666;

    line-height:2;

    font-size:17px;

}

.beschreibung p{

    margin-bottom:22px;

}

@media(max-width:991px){

.info-card{

grid-template-columns:1fr;

}

.info-sidebar{

border-right:0;

border-bottom:1px solid #ECEEF5;

}

}

@media(max-width:768px){

.info-sidebar,

.info-content{

padding:35px;

}

}

/*====================================================
LEISTUNGEN
====================================================*/

.standort-services{

    padding:90px 0;

}

.section-title{

    font-size:40px;

    margin-bottom:50px;

}

.services-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:24px;

}

.service-card{

    display:flex;

    gap:24px;

    align-items:flex-start;

    padding:34px;

    background:#fff;

    border:1px solid #ECEEF5;

    border-radius:16px;

    transition:.25s;

}

.service-card:hover{

    border-color:#3158ff;

    transform:translateY(-4px);

}

.service-icon{

    width:62px;

    height:62px;

    flex:0 0 62px;

    border-radius:16px;

    background:#F6F8FF;

    display:flex;

    align-items:center;

    justify-content:center;

}

.service-icon img{

    width:30px;

    height:30px;

    object-fit:contain;

}

.service-text{

    flex:1;

}

.service-text h3{

    font-size:22px;

    margin-bottom:10px;

}

.service-text p{

    color:#7B8291;

    line-height:1.7;

    font-size:15px;

}

@media(max-width:1100px){

.services-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.services-grid{

grid-template-columns:1fr;

}

.section-title{

font-size:32px;

}

}

/*====================================================
LOCATION / MAP
====================================================*/


.standort-location{

    padding:0 0 90px;

}


.standort-location .section-title{

    margin-bottom:35px;

}


.map-box{

    position:relative;

    height:430px;

    overflow:hidden;

    border-radius:18px;

    border:1px solid #E9ECF4;

}


.map-frame{

    width:100%;

    height:100%;

}



.map-frame iframe{

    width:100%;

    height:100%;

    border:0;

    display:block;

}



.map-route-button{


    position:absolute;

    left:28px;

    bottom:28px;


    background:#fff;


    height:54px;

    padding:0 28px;


    border-radius:12px;


    display:flex;

    align-items:center;

    gap:14px;


    color:#3158ff;


    font-weight:600;


    box-shadow:
    0 10px 30px rgba(0,0,0,.12);


    transition:.25s;


}


.map-route-button:hover{


    background:#3158ff;

    color:#fff;


}



@media(max-width:768px){


.map-box{

height:320px;

}


.map-route-button{

left:15px;

bottom:15px;

height:48px;

padding:0 18px;

}


}

/*====================================================
CTA
====================================================*/


.standort-cta{

    padding:90px 0;

}



.cta-box{

    position:relative;

    min-height:330px;

    overflow:hidden;

    border-radius:24px;

    display:flex;

    align-items:center;

}



.cta-background{

    position:absolute;

    inset:0;

}



.cta-background img{

    width:100%;

    height:100%;

    object-fit:cover;

}



.cta-overlay{

    position:absolute;

    inset:0;


    background:

    linear-gradient(
        90deg,
        #3158ff 0%,
        #2448d9 45%,
        rgba(35,72,217,.65) 100%
    );

}



.cta-inner{


    position:relative;

    z-index:2;


    width:100%;


    padding:65px;


    display:flex;


    align-items:center;


    justify-content:space-between;


    gap:40px;


}



.cta-text{

    max-width:600px;

}



.cta-text h2{


    color:#fff;

    font-size:42px;

    line-height:1.15;

    margin-bottom:18px;


}



.cta-text p{


    color:#fff;

    opacity:.9;


    font-size:18px;


    line-height:1.7;


}



.cta-actions{


    display:flex;

    gap:15px;

    flex-wrap:wrap;


}



.cta-main-button{


    height:56px;


    padding:0 30px;


    border-radius:12px;


    background:#fff;


    color:#3158ff;


    display:flex;


    align-items:center;


    gap:12px;


    font-weight:700;


}



.cta-phone-button{


    height:56px;


    padding:0 28px;


    border-radius:12px;


    border:1px solid rgba(255,255,255,.5);


    color:#fff;


    display:flex;


    align-items:center;


    gap:12px;


    font-weight:600;


}



.cta-phone-button:hover{


    background:#fff;

    color:#3158ff;


}



@media(max-width:900px){


.cta-inner{

    flex-direction:column;

    align-items:flex-start;

    padding:40px;

}


.cta-text h2{

font-size:34px;

}


}



@media(max-width:600px){


.cta-inner{

padding:30px;

}


.cta-actions{

flex-direction:column;

width:100%;

}


.cta-main-button,
.cta-phone-button{

justify-content:center;

width:100%;

}


}

/*====================================================
WEITERE STANDORTE
====================================================*/


.other-locations{


    padding:90px 0 110px;

    background:#F7F8FC;


}



.locations-header{


    display:flex;

    align-items:center;

    justify-content:space-between;

    margin-bottom:45px;


}



.locations-header h2{


    font-size:40px;


}



.all-locations-link{


    display:flex;

    align-items:center;

    gap:10px;


    color:#3158ff;


    font-weight:600;


}



.locations-grid{


    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:24px;


}



.location-card{


    background:#fff;

    border-radius:18px;

    overflow:hidden;

    border:1px solid #E9ECF4;

    transition:.25s;


}



.location-card:hover{


    transform:translateY(-5px);

    box-shadow:
    0 20px 40px rgba(0,0,0,.08);


}



.location-image{


    height:220px;

    overflow:hidden;


}



.location-image img{


    width:100%;

    height:100%;

    object-fit:cover;


}



.location-body{


    padding:28px;


}



.location-body h3{


    font-size:22px;

    margin-bottom:12px;


}



.location-body p{


    color:#707887;

    line-height:1.7;

    font-size:15px;

    margin-bottom:25px;


}



.location-more{


    display:flex;

    align-items:center;

    gap:10px;


    color:#3158ff;


    font-weight:600;

    font-size:14px;


}



@media(max-width:1200px){


.locations-grid{

grid-template-columns:repeat(2,1fr);

}


}



@media(max-width:768px){


.locations-header{


flex-direction:column;

align-items:flex-start;

gap:20px;


}



.locations-header h2{

font-size:32px;

}



.locations-grid{

grid-template-columns:1fr;

}


.location-image{

height:200px;

}


}

/* =====================================================
   SINGLE STANDORT
   FINAL FINETUNING
===================================================== */


/* =========================
   GLOBAL
========================= */

.single-standort {

    background:#fff;

    color:#111827;

}


.single-standort .container {

    max-width:1240px;

    margin:0 auto;

    padding-left:20px;

    padding-right:20px;

}



/* =========================
   TYPOGRAPHY
========================= */


.single-standort h1,
.single-standort h2,
.single-standort h3 {

    font-family:inherit;

    color:#101828;

    font-weight:700;

    letter-spacing:-0.03em;

}


.single-standort p {

    margin-top:0;

}



/* =========================
   BUTTON SYSTEM
========================= */


.single-standort .btn {

    text-decoration:none;

    transition:.25s ease;

}


.single-standort a {

    text-decoration:none;

}



/* =========================
   SECTION SPACING
========================= */


.standort-services,
.standort-location,
.other-locations {

    position:relative;

}



/* =========================
   HERO POLISH
========================= */


.standort-hero-content h1 {

    color:#fff;

    font-weight:800;

    letter-spacing:-0.045em;

}


.standort-hero-content p {

    max-width:470px;

}



.hero-buttons .btn-primary:hover {

    background:#2448dc;

    transform:translateY(-2px);

}


.hero-buttons .btn-secondary:hover {

    transform:translateY(-2px);

}



/* =========================
   INFO CARD POLISH
========================= */


.info-card {

    box-shadow:

    0 20px 60px rgba(16,24,40,.06);

}



.info-sidebar {

    background:#fff;

}



.info-content {

    background:#fff;

}



.info-content h2,
.info-sidebar h2 {

    color:#111827;

    letter-spacing:-.035em;

}



/* =========================
   SERVICES POLISH
========================= */


.service-card {

    min-height:150px;

}



.service-card h3 {

    color:#111827;

}



.service-card:hover h3 {

    color:#3158ff;

}



/* =========================
   MAP POLISH
========================= */


.map-box {

    box-shadow:

    0 25px 70px rgba(16,24,40,.08);

}



.map-route-button {

    z-index:5;

}



/* =========================
   CTA POLISH
========================= */


.cta-box {

    box-shadow:

    0 25px 70px rgba(16,24,40,.15);

}



.cta-text h2 {

    color:#fff;

    letter-spacing:-.04em;

}



.cta-main-button {

    transition:.25s ease;

}


.cta-main-button:hover {

    transform:translateY(-2px);

}



.cta-phone-button {

    transition:.25s ease;

}


.cta-phone-button:hover {

    transform:translateY(-2px);

}



/* =========================
   LOCATION CARDS
========================= */


.location-card {

    background:#fff;

}



.location-card h3 {

    letter-spacing:-.025em;

}


.location-more svg {

    transition:.25s;

}



.location-card:hover .location-more svg {

    transform:translateX(5px);

}



/* =========================
   RESPONSIVE FINAL
========================= */


@media(max-width:1200px){


    .standort-hero-content h1 {

        font-size:64px;

    }


}



@media(max-width:991px){


    .standort-hero-content h1 {

        font-size:54px;

    }


    .standort-info,
    .standort-services,
    .standort-location,
    .standort-cta,
    .other-locations {

        padding-top:70px;

        padding-bottom:70px;

    }


}



@media(max-width:768px){


    .single-standort .container {

        padding-left:16px;

        padding-right:16px;

    }



    .standort-hero {

        height:auto;

        min-height:520px;

        padding:60px 0;

    }



    .standort-hero-content h1 {

        font-size:42px;

    }



    .standort-hero-content p {

        font-size:17px;

    }



    .hero-breadcrumb {

        font-size:13px;

        flex-wrap:wrap;

    }



    .section-title {

        font-size:32px;

    }



    .info-card {

        border-radius:16px;

    }



    .service-card {

        padding:25px;

    }



}



@media(max-width:480px){


    .hero-buttons .btn {

        width:100%;

        justify-content:center;

    }



    .cta-text h2 {

        font-size:30px;

    }



}