@media (max-width: 1100px) {
    .main-navigation,
    .header-cta {
        display: none;
    }

    .navigation-toggle {
        display: block;
        margin-left: auto;
    }

    .hero-container {
        grid-template-columns: 1fr;
    }

    .hero-content {
        max-width: 850px;
    }

    .hero-visual {
        max-width: 680px;
    }
}

@media (max-width: 1100px) {
    /* ... deine bisherigen Regeln ... */

    .hero {
        padding-top: 50px; /* Verringert den Abstand auf Tablets */
        padding-bottom: 60px;
    }
}

@media (max-width: 700px) {
    .container {
        width: min(100% - 32px, var(--container-width));
    }

    .header-container {
        min-height: 76px;
    }

    .site-logo img {
        width: 300px;
    }

    .hero {
        padding: 30px 0 50px;
    }

    .hero-container {
        gap: 60px;
    }

    .hero-title {
        font-size: clamp(3rem, 15vw, 4.6rem);
    }

    .hero-lead {
        font-size: 1.3rem;
    }

    .hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .hero-actions .button {
        width: 100%;
    }

    .hero-trust {
        grid-template-columns: 1fr;
    }

    .commerce-system {
        padding: 24px;
        border-radius: 22px;
    }

    .system-output {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 1100px) {
    .partner-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .competence-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .partner-section,
    .competence-section {
        padding: 80px 0;
    }

    .section-intro {
        margin-bottom: 42px;
    }

    .section-title {
        font-size: clamp(2.25rem, 11vw, 3.4rem);
    }

    .partner-grid,
    .competence-grid {
        grid-template-columns: 1fr;
    }

    .partner-card {
        min-height: 110px;
    }

    .competence-card {
        min-height: 280px;
        padding: 28px;
    }
}
@media (max-width: 1000px) {
    .values-container {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .values-intro {
        position: static;
    }
}

@media (max-width: 700px) {
    .values-section {
        padding: 90px 0;
    }

    .values-grid {
        grid-template-columns: 1fr;
    }

    .value-card {
        min-height: 250px;
        padding: 26px;
    }

    .value-number {
        margin-bottom: 36px;
    }
}
@media (max-width: 700px) {
    .customer-logos-section {
        padding: 85px 0;
    }

    .customer-logo-card {
        width: 210px;
        height: 125px;
        padding: 22px;
    }

    .customer-logo-card img {
        max-width: 170px;
        max-height: 76px;
    }

    .customer-logo-track {
        animation-duration: 34s;
    }
}

/* Bewegungsreduzierung respektieren */

@media (prefers-reduced-motion: reduce) {
    .customer-logo-track {
        animation: none;
    }

    .customer-logo-marquee {
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .customer-logo-group[aria-hidden="true"] {
        display: none;
    }
}
@media (max-width:1100px){

.site-footer-grid{
grid-template-columns:1fr 1fr;
}

}

@media (max-width:700px){

.site-footer{
padding:80px 0 26px;
}

.site-footer-grid{
grid-template-columns:1fr;
gap:36px;
}

.site-footer-bottom{
flex-direction:column;
align-items:flex-start;
gap:18px;
}

.back-to-top{
right:18px;
bottom:18px;
width:48px;
height:48px;
}

}
@media (max-width: 900px) {
    .site-footer-statement {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .site-footer-statement-copy {
        max-width: 680px;
    }
}

@media (max-width: 640px) {
    .site-footer-statement {
        margin-bottom: 48px;
        padding-bottom: 48px;
    }

    .site-footer-statement h2 {
        font-size: clamp(2.3rem, 11vw, 3.4rem);
    }
}
@media (max-width:900px){

    .plentyone-partner-grid{

        grid-template-columns:1fr;

    }

}
@media (max-width: 1050px) {
    .plentyone-projects-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .plentyone-projects-section {
        padding: 40px 0;
    }

    .plentyone-projects-intro {
        margin-bottom: 34px;
    }

    .plentyone-projects-grid {
        grid-template-columns: 1fr;
    }

    .plentyone-project-card {
        min-height: auto;
        padding: 26px;
    }

    .plentyone-project-number {
        margin-bottom: 42px;
    }
}
@media (max-width: 1100px) {
    .shopify-hero {
        padding: 100px 0;
    }

    .shopify-hero-container {
        grid-template-columns: 1fr;
        gap: 70px;
    }

    .shopify-hero-content {
        max-width: 880px;
    }

    .shopify-hero-visual {
        min-height: 640px;
    }

    .shopify-store-window {
        right: 40px;
        left: 40px;
    }
}

@media (max-width: 700px) {
    .shopify-hero {
        padding: 40px 0;
    }

    .shopify-hero h1 {
        font-size: clamp(2.8rem, 13vw, 4.3rem);
    }

    .shopify-hero-lead {
        font-size: 1rem;
    }

    .shopify-hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .shopify-hero-actions .button {
        width: 100%;
        text-align: center;
    }

    .shopify-hero-trust {
        grid-template-columns: 1fr;
    }

    .shopify-hero-visual {
        min-height: 0;
        margin-top: 40px;
        transform: none;
    }

    .shopify-store-window {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 100%;
    }
}
    .shopify-store-window {
        top: 30px;
        right: 0;
        left: 0;
    }

    .shopify-store-content {
        padding: 16px;
    }

    .shopify-store-navigation {
        display: none;
    }

    .shopify-store-header {
        grid-template-columns: 1fr auto;
    }

    .shopify-product-layout {
        grid-template-columns: 1fr;
        min-height: auto;
    }

    .shopify-product-image {
        min-height: 300px;
    }

    .shopify-product-shape {
        width: 135px;
        height: 205px;
    }

    .shopify-product-content {
        padding: 26px;
    }

    .shopify-floating-conversion {
        top: 5px;
        right: 14px;
    }

    .shopify-floating-mobile {
        right: 10px;
        bottom: 30px;
    }

    .shopify-floating-systems {
        display: none;
    }

@media (max-width: 900px) {
    .shopify-partner-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .shopify-partner-section {
        padding: 40px 0;
    }

    .shopify-partner-intro {
        margin-bottom: 34px;
    }

    .shopify-partner-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
    }

    .shopify-partner-card {
        min-height: auto;
        padding: 28px;
    }

    .shopify-partner-card-header {
        margin-bottom: 38px;
    }
}
@media (max-width: 1050px) {
    .shopify-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .shopify-services-section {
        padding: 40px 0;
    }

    .shopify-services-intro {
        margin-bottom: 34px;
    }

    .shopify-services-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
    }

    .shopify-services-grid {
        grid-template-columns: 1fr;
    }

    .shopify-service-card {
        min-height: auto;
        padding: 28px;
    }

    .shopify-service-card-header {
        margin-bottom: 38px;
    }
}
@media (max-width: 1100px) {
    .shopify-experience-container {
        grid-template-columns: 1fr;
        gap: 56px;
    }

    .shopify-experience-copy {
        max-width: 780px;
    }

    .shopify-device-visual {
        min-height: 690px;
    }

    .shopify-device-desktop {
        right: 60px;
        left: 20px;
    }

    .shopify-device-mobile {
        right: 10px;
    }
}

@media (max-width: 700px) {
    .shopify-experience-section {
        padding: 40px 0;
    }

    .shopify-experience-copy h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
    }

    .shopify-device-visual {
        min-height: 610px;
    }

    .shopify-device-desktop {
        top: 34px;
        right: 0;
        left: 0;
    }

    .shopify-device-store {
        padding: 14px;
    }

    .shopify-device-store-header nav {
        display: none;
    }

    .shopify-device-store-header {
        grid-template-columns: 1fr auto;
    }

    .shopify-device-hero {
        grid-template-columns: 1fr;
    }

    .shopify-device-product {
        min-height: 220px;
    }

    .shopify-device-products {
        display: none;
    }

    .shopify-device-mobile {
        right: -10px;
        bottom: 0;
        width: 180px;
        min-height: 370px;
    }

    .shopify-mobile-screen {
        min-height: 338px;
    }

    .shopify-mobile-image {
        min-height: 120px;
    }

    .shopify-device-badge-speed {
        top: 6px;
        right: 10px;
    }

    .shopify-device-badge-mobile {
        bottom: 20px;
        left: 8px;
    }
}
@media (max-width: 1050px) {
    .shopify-projects-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .shopify-projects-section {
        padding: 40px 0;
    }

    .shopify-projects-intro {
        margin-bottom: 34px;
    }

    .shopify-projects-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
    }

    .shopify-projects-grid {
        grid-template-columns: 1fr;
    }

    .shopify-project-card {
        min-height: auto;
        padding: 28px;
    }

    .shopify-project-card-header {
        margin-bottom: 38px;
    }
}
/* =========================================================
   SHOPIFY PARTNERKARTEN – MOBILE FIX
   ========================================================= */

@media (max-width: 700px) {

    .shopify-partner-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .shopify-partner-card {
        width: 100%;
        min-width: 0;
        min-height: auto;
        padding: 28px;
    }

    .shopify-partner-card h3 {
        overflow-wrap: anywhere;
        font-size: 1.4rem;
        line-height: 1.2;
    }

    .shopify-partner-card p {
        font-size: 0.95rem;
        line-height: 1.7;
    }
}
/* =========================================================
   PLENTYONE HERO – MOBILE FIX
   ========================================================= */

@media (max-width: 700px) {

    .plentyone-hero {
        overflow: hidden;
        padding: 40px 0;
    }

    .plentyone-hero-container {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 40px;
        }

    .plentyone-hero-content {
        width: 100%;
        max-width: none;
        min-width: 0;
    }

    .plentyone-hero-content .section-eyebrow {
        max-width: none;
        white-space: normal;
    }

    .plentyone-hero h1 {
        width: 100%;
        max-width: none;
        margin-bottom: 24px;
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .plentyone-hero-lead {
        width: 100%;
        max-width: none;
        font-size: 1rem;
        line-height: 1.75;
        overflow-wrap: normal;
        word-break: normal;
    }

    .plentyone-hero-actions {
        display: flex;
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        width: 100%;
    }

    .plentyone-hero-actions .button {
        width: 100%;
        white-space: normal;
        text-align: center;
    }

    .plentyone-hero-trust {
        grid-template-columns: 1fr;
        gap: 22px;
        width: 100%;
    }

    .plentyone-hero-visual {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        min-height: 0;
        margin: 0;
        transform: none;
    }

    .plentyone-hero-visual > * {
        max-width: 100%;
    }
}
@media (max-width: 700px) {
    .plentyone-system-visual,
    .plentyone-system-card {
        position: relative;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        margin: 0;
    }
}
/* =========================================================
   PLENTYONE LEISTUNGSKARTEN – MOBILE FIX
   ========================================================= */

@media (max-width: 700px) {

    .plentyone-services-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .plentyone-service-card {
        width: 100%;
        min-width: 0;
        min-height: auto;
        padding: 28px;
    }

    .plentyone-service-card h3 {
        font-size: 1.4rem;
        line-height: 1.2;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .plentyone-service-card p {
        font-size: 0.95rem;
        line-height: 1.7;
        overflow-wrap: normal;
        word-break: normal;
    }
}
@media (max-width: 1100px) {
    .integration-hero {
        padding: 100px 0;
    }

    .integration-hero-container {
        grid-template-columns: 1fr;
        gap: 68px;
    }

    .integration-hero-content {
        max-width: 880px;
    }

    .integration-hero-visual {
        min-height: 690px;
    }

    .integration-visual-stage {
        right: 30px;
        left: 30px;
    }
}

@media (max-width: 700px) {
    .integration-hero {
        padding: 40px 0;
    }

    .integration-hero h1 {
        font-size: clamp(2.8rem, 13vw, 4.3rem);
    }

    .integration-hero-lead {
        font-size: 1rem;
    }

    .integration-hero-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .integration-hero-actions .button {
        width: 100%;
        text-align: center;
    }

    .integration-hero-trust {
        grid-template-columns: 1fr;
    }

    .integration-hero-visual {
        min-height: 820px;
    }

    .integration-visual-stage {
        inset: 20px 0 0;
    }

    .integration-platform {
        width: calc(100% - 40px);
    }

    .integration-platform-shopify {
        top: 28px;
        left: 20px;
    }

    .integration-platform-plenty {
        right: 20px;
        bottom: 28px;
    }

    .integration-connector {
        width: 170px;
    }

    .integration-engine {
        width: 170px;
    }

    .integration-connector-line {
        height: 76px;
    }

    .integration-floating-orders {
        top: 240px;
        right: 12px;
    }

    .integration-floating-pos {
        right: 12px;
        bottom: 250px;
    }

    .integration-floating-stock {
        bottom: 12px;
        left: 12px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .integration-data-point {
        animation: none;
    }
}
@media (max-width: 1000px) {
    .integration-system-intro {
        grid-template-columns: 1fr;
        align-items: start;
        gap: 28px;
    }

    .integration-system-flow {
        grid-template-columns: 1fr;
        gap: 26px;
    }

    .integration-flow-connection {
        width: 2px;
        height: 72px;
        margin: 0 auto;
    }

    .integration-flow-connection::after {
        top: auto;
        right: auto;
        bottom: -1px;
        left: 50%;
        transform: translateX(-50%) rotate(135deg);
    }

    .integration-flow-connection span {
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        animation-name: integration-vertical-flow;
    }

    @keyframes integration-vertical-flow {
        from {
            top: 0;
            opacity: 0;
        }

        12% {
            opacity: 1;
        }

        88% {
            opacity: 1;
        }

        to {
            top: calc(100% - 7px);
            opacity: 0;
        }
    }
}

@media (max-width: 700px) {
    .integration-system-section {
        padding: 40px 0;
    }

    .integration-system-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
    }

    .integration-system-flow {
        padding: 28px;
    }

    .integration-flow-destinations {
        grid-template-columns: 1fr;
    }

    .integration-flow-destinations article {
        min-height: 72px;
    }

    .integration-data-strip {
        justify-content: flex-start;
    }
}

@media (prefers-reduced-motion: reduce) {
    .integration-flow-connection span {
        animation: none;
    }
}
@media (max-width: 900px) {
    .integration-benefits-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .integration-benefits-section {
        padding: 40px 0;
    }

    .integration-benefits-intro {
        margin-bottom: 34px;
    }

    .integration-benefits-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
    }

    .integration-benefit-card {
        min-height: auto;
        padding: 28px;
    }

    .integration-benefit-card-header {
        margin-bottom: 38px;
    }
}
/* =========================================================
   SHOPIFY × PLENTYONE PROJEKTE – RESPONSIVE
   ========================================================= */

@media (max-width: 1050px) {
    .combo-project-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .combo-projects {
        padding: 40px 0;
    }

    .combo-projects .section-intro {
        margin-bottom: 34px;
    }

    .combo-projects .section-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.04;
    }

    .combo-projects .section-intro h2 br {
        display: none;
    }

    .combo-projects .section-intro p {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .combo-project-grid {
        grid-template-columns: 1fr;
        gap: 22px;
        margin-top: 0;
    }

    .combo-project-card {
        width: 100%;
        min-width: 0;
        min-height: auto;
        padding: 28px;
    }

    .combo-project-card .card-icon {
        top: 26px;
        right: 26px;
    }

    .combo-project-card .card-icon svg {
        width: 28px;
        height: 28px;
    }

    .combo-project-card h3 {
        margin: 46px 0 14px;
        font-size: 1.4rem;
        line-height: 1.22;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: none;
    }

    .combo-project-card p {
        font-size: 0.95rem;
        line-height: 1.7;
        overflow-wrap: normal;
        word-break: normal;
    }
}
@media (max-width: 700px) {
    .combo-projects h2 br {
        display: none;
    }
}
/* =========================================================
   KOMBI-HERO – MOBILE FEINSCHLIFF
   ========================================================= */

@media (max-width: 700px) {

    .integration-hero {
        padding-top: 28px;
    }

    .integration-hero-content {
        padding-top: 0;
    }

    .integration-hero .section-eyebrow {
        margin-top: 0;
        margin-bottom: 20px;
        color: #d90000;
        font-size: 0.78rem;
        font-weight: 800;
        letter-spacing: 0.22em;
        line-height: 1.4;
        opacity: 1;
    }
}
@media (max-width: 700px) {
    .integration-hero {
        padding: 28px 0 40px;
    }

    .integration-hero-content {
        padding-top: 0;
    }
}
@media (max-width: 900px) {
    .shopify-partner-section,
    .shopify-services-section,
    .shopify-experience-section,
    .shopify-projects-section,

    .plentyone-services-section,
    .plentyone-experience-section,
    .plentyone-channels-section,
    .plentyone-projects-section,

    .integration-system-section,
    .integration-benefits-section,
    .combo-projects {
        padding-top: var(--section-space-tablet);
        padding-bottom: var(--section-space-tablet);
    }
}

@media (max-width: 700px) {
    .shopify-partner-section,
    .shopify-services-section,
    .shopify-experience-section,
    .shopify-projects-section,

    .plentyone-services-section,
    .plentyone-experience-section,
    .plentyone-channels-section,
    .plentyone-projects-section,

    .integration-system-section,
    .integration-benefits-section,
    .combo-projects {
        padding-top: var(--section-space-mobile);
        padding-bottom: var(--section-space-mobile);
    }

    .section-intro,
    .shopify-partner-intro,
    .shopify-services-intro,
    .shopify-projects-intro,
    .plentyone-services-intro,
    .plentyone-projects-intro,
    .integration-benefits-intro {
        margin-bottom: 36px;
    }

    .section-intro h2,
    .shopify-partner-intro h2,
    .shopify-services-intro h2,
    .shopify-projects-intro h2,
    .plentyone-services-intro h2,
    .plentyone-projects-intro h2,
    .integration-benefits-intro h2,
    .combo-projects .section-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .section-intro h2 br,
    .shopify-partner-intro h2 br,
    .shopify-services-intro h2 br,
    .shopify-projects-intro h2 br,
    .plentyone-services-intro h2 br,
    .plentyone-projects-intro h2 br,
    .integration-benefits-intro h2 br,
    .combo-projects .section-intro h2 br {
        display: none;
    }
}
/* =========================================================
   PLENTYONE HERO – TABLET FIX
   ========================================================= */

@media (min-width: 701px) and (max-width: 1100px) {

    .plentyone-hero {
        padding: 64px 0;
    }

    .plentyone-hero-container {
        grid-template-columns: 1fr;
        gap: 56px;
    }

    .plentyone-hero-content {
        max-width: 760px;
    }

    .plentyone-hero h1 {
        max-width: 720px;
        font-size: clamp(3.4rem, 7vw, 5rem);
    }

    .plentyone-hero-lead {
        max-width: 680px;
    }

    .plentyone-hero-visual {
        width: 100%;
        min-height: 520px;
    }

    .plentyone-system-card {
        inset: 0;
    }
}
@media (max-width: 900px) {
    .section-standard {
        padding-top: var(--section-space-tablet);
        padding-bottom: var(--section-space-tablet);
    }
}

@media (max-width: 700px) {
    .section-standard {
        padding-top: var(--section-space-mobile);
        padding-bottom: var(--section-space-mobile);
    }
}
@media (max-width: 700px) {
    .plentyone-projects-intro h2 {
        width: 100%;
        max-width: none;
        font-size: clamp(2.45rem, 11vw, 3.5rem);
        line-height: 1.04;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: manual;
    }
}
@media (max-width: 360px) {
    .plentyone-projects-intro h2 {
        font-size: 2.25rem;
    }
}
@media (min-width: 701px) and (max-width: 900px) {
    .plentyone-projects-intro h2 {
        font-size: clamp(2.6rem, 5.5vw, 3.6rem);
        hyphens: auto;
        overflow-wrap: break-word;
    }
}
@media (min-width: 701px) and (max-width: 900px) {
    .plentyone-projects-intro h2 {
        width: 100%;
        max-width: 820px;
        font-size: clamp(2.8rem, 6.5vw, 4rem);
        line-height: 1.03;
        overflow-wrap: normal;
        word-break: normal;
        hyphens: manual;
    }
}
/* =========================================================
   SHOPIFY × PLENTYONE HERO – TABLET KOMPAKTER
   ========================================================= */

@media (min-width: 701px) and (max-width: 1100px) {
    .integration-hero {
        padding: 56px 0 64px;
    }

    .integration-hero-container {
        grid-template-columns: 1fr;
        gap: 28px;
    }

    .integration-hero-content {
        max-width: 880px;
        padding-top: 0;
    }

    .integration-hero-visual {
        width: 100%;
        min-height: 620px;
        margin-top: 0;
    }

    .integration-visual-stage {
        inset: 0 15px;
    }
}
@media (max-width: 1100px) {
    .hero,
    .shopify-hero,
    .plentyone-hero,
    .integration-hero {
        padding-top: var(--hero-space-top-tablet);
        padding-bottom: var(--hero-space-bottom-tablet);
    }
}

@media (max-width: 700px) {
    .hero,
    .shopify-hero,
    .plentyone-hero,
    .integration-hero {
        padding-top: var(--hero-space-top-mobile);
        padding-bottom: var(--hero-space-bottom-mobile);
    }

    .hero-actions,
    .shopify-hero-actions,
    .plentyone-hero-actions,
    .integration-hero-actions {
        margin-top: 32px;
    }

    .hero-meta,
    .shopify-hero-trust,
    .plentyone-hero-trust,
    .integration-hero-trust {
        margin-top: 34px;
    }
}
@media (min-width: 701px) and (max-width: 1100px) {
    .integration-hero {
        padding-top: var(--hero-space-top-tablet);
        padding-bottom: var(--hero-space-bottom-tablet);
    }

    .integration-hero-container {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .integration-hero-content {
        padding-top: 0;
    }

    .integration-hero-visual {
        margin-top: 0;
    }

    .integration-visual-stage {
        inset: 0 20px;
    }
}
@media (max-width: 700px) {
    .integration-hero {
        padding-top: var(--hero-space-top-mobile);
        padding-bottom: var(--hero-space-bottom-mobile);
    }

    .integration-hero-content {
        padding-top: 0;
    }
}
.integration-hero-visual {
    display: flex;
    justify-content: center;
}
@media (max-width: 700px) {
    .integration-visual-stage {
        top: 20px;
        right: 16px;
        bottom: 0;
        left: 16px;
    }
}
@media (max-width: 700px) {
    .integration-visual-stage {
        left: 16px;
        right: 16px;
    }
}
@media (max-width: 700px) {
    .integration-floating-stock {
        right: 20px;
        left: 20px;
        width: auto;
    }
}
/* =========================================================
   REFERENZEN HERO – RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
    .references-hero {
        padding-top: var(--hero-space-top-tablet);
        padding-bottom: var(--hero-space-bottom-tablet);
    }

    .references-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .references-hero-content {
        max-width: 880px;
    }

    .references-hero-visual {
        min-height: 620px;
    }

    .references-project-stage {
        inset: 0 20px;
    }
}

@media (max-width: 700px) {
    .references-hero {
        padding-top: var(--hero-space-top-mobile);
        padding-bottom: var(--hero-space-bottom-mobile);
    }

    .references-hero h1 {
        font-size: clamp(2.8rem, 13vw, 4.2rem);
        line-height: 1;
    }

    .references-hero h1 br {
        display: none;
    }

    .references-hero-lead {
        font-size: 1rem;
        line-height: 1.75;
    }

    .references-hero-actions {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        margin-top: 32px;
    }

    .references-hero-actions .button {
        width: 100%;
        text-align: center;
    }

    .references-hero-trust {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-top: 34px;
        padding-top: 24px;
    }

    .references-hero-visual {
        min-height: 590px;
    }

    .references-project-stage {
        top: 0;
        right: 16px;
        bottom: 0;
        left: 16px;
    }

    .references-project-card-main {
        inset: 42px 0 86px;
        border-radius: 22px;
    }

    .references-project-preview {
        padding: 18px;
    }

    .references-project-preview-content {
        grid-template-columns: 1fr;
        min-height: 410px;
    }

    .references-project-preview-image {
        min-height: 210px;
    }

    .references-project-preview-copy {
        padding: 28px;
    }

    .references-project-preview-copy strong {
        font-size: 2rem;
    }

    .references-project-badge {
        min-width: 126px;
        padding: 13px 14px;
    }

    .references-project-badge-shopify {
        top: 0;
        right: 8px;
    }

    .references-project-badge-plenty {
        right: 0;
        bottom: 52px;
    }

    .references-project-badge-result {
        bottom: 0;
        left: 0;
        min-width: 190px;
    }

    .references-project-tags {
        display: none;
    }
}
@media (max-width:900px){

.references-approach-section{

    padding:80px 0;

}

.references-approach-grid{

    grid-template-columns:1fr;

}

.references-approach-intro{

    margin-bottom:50px;

}

}
@media (max-width: 900px) {
    .references-approach-section {
        padding: var(--section-space-tablet) 0;
    }

    .references-approach-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .references-approach-section {
        padding: var(--section-space-mobile) 0;
    }

    .references-approach-intro {
        margin-bottom: 36px;
    }

    .references-approach-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .references-card {
        min-height: auto;
        padding: 28px;
    }

    .references-number {
        margin-bottom: 38px;
    }
}
/* =========================================================
   REFERENZ-SHOWCASES – RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .references-showcases {
        padding-bottom: var(--section-space-tablet);
    }

    .references-showcases-container {
        gap: 86px;
    }

    .reference-showcase,
    .reference-showcase-reverse {
        grid-template-columns: 1fr;
        gap: 44px;
    }

    .reference-showcase-reverse .reference-showcase-visual,
    .reference-showcase-reverse .reference-showcase-content {
        order: initial;
    }

    .reference-showcase-content {
        max-width: 760px;
    }
}

@media (max-width: 700px) {

    .references-showcases {
        padding-top: 10px;
        padding-bottom: var(--section-space-mobile);
    }

    .references-showcases-container {
        gap: 72px;
    }

    .reference-showcase,
    .reference-showcase-reverse {
        gap: 32px;
    }

    .reference-browser-frame {
        border-radius: 18px;
    }

    .reference-browser-toolbar {
        min-height: 38px;
        padding: 0 12px;
    }

    .reference-browser-toolbar div {
        width: 58%;
        font-size: 0.62rem;
    }

    .reference-showcase-content h3 {
        font-size: clamp(2.45rem, 11vw, 3.6rem);
        line-height: 1.02;
    }

    .reference-showcase-lead {
        font-size: 1rem;
    }

    .reference-services ul {
        grid-template-columns: 1fr;
        gap: 11px;
    }

    .reference-tags span {
        padding: 8px 11px;
        font-size: 0.72rem;
    }
}
@media (max-width: 900px) {
    .references-overview {
        padding: var(--section-space-tablet) 0 60px;
    }

    .references-overview .container {
        display: block;
    }

    .references-overview h2 {
        max-width: 760px;
        margin-bottom: 28px;
    }

    .references-overview .section-intro {
        max-width: 760px;
        margin: 0;
    }
}

@media (max-width: 700px) {
    .references-overview {
        padding: var(--section-space-mobile) 0 48px;
    }

    .references-overview h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }
}
/* =========================================================
   AGENTUR-WERTE – RESPONSIVE
   ========================================================= */

@media (max-width: 900px) {
    .agency-values-section {
        padding: var(--section-space-tablet) 0;
    }

    .agency-values-grid {
        grid-template-columns: 1fr;
    }

    .agency-values-intro {
        max-width: 780px;
        margin-bottom: 44px;
    }

    .agency-value-card {
        min-height: 250px;
    }
}

@media (max-width: 700px) {
    .agency-values-section {
        padding: var(--section-space-mobile) 0;
    }

    .agency-values-intro {
        margin-bottom: 36px;
    }

    .agency-values-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .agency-values-intro h2 br {
        display: none;
    }

    .agency-values-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .agency-values-grid {
        gap: 22px;
    }

    .agency-value-card {
        min-height: auto;
        padding: 28px;
    }

    .agency-value-number {
        margin-bottom: 38px;
    }

    .agency-value-card h3 {
        font-size: 1.4rem;
        line-height: 1.2;
    }

    .agency-value-card p {
        font-size: 0.95rem;
        line-height: 1.7;
    }

    .agency-value-icon {
        top: 26px;
        right: 26px;
        width: 28px;
        height: 28px;
    }
}
@media (max-width: 700px) {
    .agency-value-card-header {
        margin-bottom: 38px;
    }

    .agency-value-icon {
        width: 28px;
        height: 28px;
    }
}
/* =========================================================
   AGENTUR-ARBEITSWEISE – RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
    .agency-process-section {
        padding: var(--section-space-tablet) 0;
    }

    .agency-process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .agency-process-card {
        min-height: 290px;
    }
}

@media (max-width: 700px) {
    .agency-process-section {
        padding: var(--section-space-mobile) 0;
    }

    .agency-process-intro {
        margin-bottom: 38px;
    }

    .agency-process-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .agency-process-intro h2 br {
        display: none;
    }

    .agency-process-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .agency-process-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .agency-process-card {
        min-height: auto;
        padding: 28px;
    }

    .agency-process-card-header {
        margin-bottom: 42px;
    }

    .agency-process-card h3 {
        font-size: 1.4rem;
    }

    .agency-process-card p {
        font-size: 0.95rem;
    }
}
/* =========================================================
   AGENTUR-LEISTUNGEN – RESPONSIVE
   ========================================================= */

@media (max-width: 1000px) {
    .agency-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .agency-services-intro {
        grid-template-columns: 1fr;
        row-gap: 26px;
        margin-bottom: 56px;
    }

    .agency-services-intro .section-eyebrow,
    .agency-services-intro h2,
    .agency-services-intro .section-intro {
        grid-column: 1;
        grid-row: auto;
    }

    .agency-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .agency-service {
        grid-template-columns: 64px minmax(210px, 0.75fr) minmax(0, 1.25fr);
        gap: 24px;
        padding: 32px 0;
    }
}

@media (max-width: 700px) {
    .agency-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .agency-services-intro {
        margin-bottom: 40px;
    }

    .agency-services-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .agency-services-intro h2 br {
        display: none;
    }

    .agency-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .agency-service {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 30px 0;
    }

    .agency-service:hover {
        padding-left: 0;
        background: transparent;
    }

    .agency-service-number {
        padding-top: 0;
        margin-bottom: 8px;
    }

    .agency-service-content {
        display: block;
    }

    .agency-service h3 {
        margin-bottom: 14px;
        font-size: clamp(1.8rem, 8vw, 2.5rem);
        line-height: 1.08;
    }

    .agency-service p {
        margin: 0;
        font-size: 0.96rem;
        line-height: 1.7;
    }
}
/* =========================================================
   AGENTUR – SYSTEME & TECHNOLOGIEN RESPONSIVE
   ========================================================= */

@media (max-width: 1000px) {
    .agency-technologies-section {
        padding: var(--section-space-tablet) 0;
    }

    .agency-technologies-intro {
        grid-template-columns: 1fr;
        row-gap: 26px;
        margin-bottom: 54px;
    }

    .agency-technologies-intro .section-eyebrow,
    .agency-technologies-intro h2,
    .agency-technologies-intro .section-intro {
        grid-column: 1;
        grid-row: auto;
    }

    .agency-technologies-intro .section-intro {
        max-width: 760px;
        padding-top: 0;
    }
}

@media (max-width: 760px) {
    .agency-technologies-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 700px) {
    .agency-technologies-section {
        padding: var(--section-space-mobile) 0;
    }

    .agency-technologies-intro {
        margin-bottom: 38px;
    }

    .agency-technologies-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .agency-technologies-intro h2 br {
        display: none;
    }

    .agency-technologies-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .agency-technology-group {
        min-height: auto;
        padding: 28px;
    }

    .agency-technology-group-header {
        margin-bottom: 38px;
    }

    .agency-technology-group h3 {
        font-size: 1.4rem;
    }

    .agency-technology-tags span {
        min-height: 36px;
        padding: 8px 12px;
        font-size: 0.84rem;
    }
}
/* =========================================================
   AGENTUR – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
    .agency-hero {
        padding: 66px 0 76px;
    }

    .agency-hero-container {
        grid-template-columns: minmax(0, 1fr) minmax(380px, 0.9fr);
        gap: 52px;
    }

    .agency-system-visual {
        min-height: 470px;
        padding: 34px;
    }

    .agency-system-core {
        width: 200px;
        height: 200px;
        margin: 64px auto 52px;
    }
}

@media (max-width: 900px) {
    .agency-hero {
        padding: 54px 0 68px;
    }

    .agency-hero-container {
        grid-template-columns: 1fr;
    }

    .agency-hero-content {
        max-width: 860px;
    }

    .agency-hero-visual {
        margin-top: 8px;
    }

    .agency-system-visual {
        width: min(100%, 720px);
    }
}

@media (max-width: 700px) {
    .agency-hero {
        padding: 42px 0 56px;
    }

    .agency-hero-container {
        gap: 40px;
    }

    .agency-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.4rem);
        line-height: 1;
    }

    .agency-hero-content h1 br {
        display: none;
    }

    .agency-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .agency-hero-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        margin-top: 28px;
    }

    .agency-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .agency-system-visual {
        min-height: auto;
        padding: 28px 22px 24px;
        border-radius: 24px;
    }

    .agency-system-label {
        max-width: 250px;
        font-size: 0.66rem;
    }

    .agency-system-core {
        width: 176px;
        height: 176px;
        margin: 58px auto 48px;
    }

    .agency-system-core span {
        font-size: 1.18rem;
    }

    .agency-system-connections {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .agency-system-connections span {
        min-height: 48px;
    }
}
@media (max-width: 900px) {
    .agency-technologies-section {
        padding-bottom: 20px;
    }

    .agency-references-section {
        margin-top: 20px;
    }
}
/* Desktop */
.agency-technologies-intro .section-intro {
    transform: translateY(-65px);
}

/* Tablet */
@media (max-width: 1024px) {
    .agency-technologies-intro .section-intro {
        transform: translateY(0);
    }
}

/* Mobil */
@media (max-width: 768px) {
    .agency-technologies-intro .section-intro {
        transform: none;
    }
}
/* =========================================================
   KONTAKT – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1050px) {
    .contact-hero {
        padding: 55px 0 76px;
    }

    .contact-hero-container {
        grid-template-columns: minmax(0, 1fr) minmax(360px, 0.85fr);
        gap: 52px;
    }

    .contact-direct-card {
        padding: 34px;
    }
}

@media (max-width: 900px) {
    .contact-hero-container {
        grid-template-columns: 1fr;
    }

    .contact-hero-content {
        max-width: 860px;
    }

    .contact-direct-card {
        max-width: 760px;
    }
}

@media (max-width: 700px) {
    .contact-hero {
        padding: 42px 0 56px;
    }

    .contact-hero-container {
        gap: 38px;
    }

    .contact-hero-content h1 {
        font-size: clamp(3rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .contact-hero-content h1 br {
        display: none;
    }

    .contact-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .contact-hero-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 12px;
        margin-top: 28px;
    }

    .contact-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .contact-direct-card {
        padding: 28px 22px;
    }

    .contact-direct-card h2 br {
        display: none;
    }

    .contact-direct-item {
        grid-template-columns: 38px minmax(0, 1fr);
        min-height: 70px;
        padding: 12px 14px;
    }
}
/* =========================================================
   KONTAKT – ZUSAMMENARBEIT
   ========================================================= */

.contact-process-section {
    position: relative;
    padding: var(--section-space-desktop) 0;
    background: var(--color-light);
}

.contact-process-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(420px, 0.9fr);
    column-gap: 100px;
    align-items: start;
    margin-bottom: 68px;
}

.contact-process-intro .section-eyebrow {
    grid-column: 1;
    margin-bottom: 22px;
}

.contact-process-intro h2 {
    grid-column: 1;
    max-width: 850px;
    margin: 0;
    color: var(--color-dark);
    font-family: var(--font-heading);
    font-size: clamp(2.8rem, 4.6vw, 4.9rem);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 1.02;
}

.contact-process-intro .section-intro {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: start;
    max-width: 680px;
    margin: 0;
    padding-top: 165px;
    color: var(--color-muted);
    font-size: 1.02rem;
    line-height: 1.75;
}


/* Prozesskarten */

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

.contact-process-card {
    position: relative;
    min-height: 355px;
    padding: 32px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);
    background: var(--color-white);
    transition:
        transform 280ms ease,
        border-color 280ms ease,
        box-shadow 280ms ease;
}

.contact-process-card:hover {
    transform: translateY(-5px);
    border-color: rgba(196, 0, 0, 0.2);
    box-shadow: var(--shadow-card-hover);
}

.contact-process-card::after {
    position: absolute;
    right: -76px;
    bottom: -76px;
    width: 190px;
    height: 190px;
    content: "";
    border-radius: 50%;
    background: rgba(196, 0, 0, 0.035);
    pointer-events: none;
}

.contact-process-card-header {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 68px;
}

.contact-process-number {
    color: var(--color-primary);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    line-height: 1;
}

.contact-process-icon {
    width: 27px;
    height: 27px;
    color: var(--color-primary);
    opacity: 0.3;
    stroke-width: 1.7;
}

.contact-process-card h3 {
    position: relative;
    z-index: 1;
    margin: 0 0 16px;
    color: var(--color-dark);
    font-family: var(--font-heading);
    font-size: 1.45rem;
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.15;
}

.contact-process-card p {
    position: relative;
    z-index: 1;
    margin: 0;
    color: var(--color-muted);
    font-size: 0.95rem;
    line-height: 1.7;
}
/* =========================================================
   KONTAKT – WARUM MIT UNS RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .contact-trust-section {
        padding: var(--section-space-tablet) 0;
    }

    .contact-trust-intro {
        grid-template-columns: 1fr;
        row-gap: 26px;
        margin-bottom: 54px;
    }

    .contact-trust-intro .section-eyebrow,
    .contact-trust-intro h2,
    .contact-trust-intro .section-intro {
        grid-column: 1;
        grid-row: auto;
    }

    .contact-trust-intro .section-intro {
        max-width: 760px;
        padding-top: 0;
    }

    .contact-trust-card {
        grid-template-columns: 70px minmax(240px, 0.8fr) 1.2fr;
        column-gap: 28px;
    }
}


@media (max-width: 800px) {

    .contact-trust-card {
        grid-template-columns: 60px 1fr;
        row-gap: 16px;
        align-items: start;
    }

    .contact-trust-card p {
        grid-column: 2;
    }
}


@media (max-width: 700px) {

    .contact-trust-section {
        padding: var(--section-space-mobile) 0;
    }

    .contact-trust-intro {
        margin-bottom: 38px;
    }

    .contact-trust-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .contact-trust-intro h2 br {
        display: none;
    }

    .contact-trust-card {
        grid-template-columns: 1fr;
        gap: 16px;
        min-height: auto;
        padding: 28px 0;
    }

    .contact-trust-card:hover {
        padding-left: 0;
        background: transparent;
    }

    .contact-trust-card h3 {
        font-size: 1.7rem;
    }

    .contact-trust-card p {
        grid-column: 1;
    }
}
/* =========================================================
   KONTAKT – FORMULAR RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .contact-form-section {
        padding: var(--section-space-tablet) 0;
    }

    .contact-form-layout {
        grid-template-columns: minmax(0, 0.8fr) minmax(460px, 1.2fr);
        gap: 60px;
    }

    .contact-form-wrapper {
        padding: 38px;
    }
}


@media (max-width: 900px) {

    .contact-form-layout {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .contact-form-intro {
        position: static;
        max-width: 820px;
    }

    .contact-form-intro .section-intro {
        max-width: 760px;
    }

    .contact-form-wrapper {
        max-width: 820px;
    }
}


@media (max-width: 700px) {

    .contact-form-section {
        padding: var(--section-space-mobile) 0;
    }

    .contact-form-layout {
        gap: 36px;
    }

    .contact-form-intro h2 {
        font-size: clamp(2.6rem, 11vw, 3.8rem);
        line-height: 1.03;
    }

    .contact-form-intro h2 br {
        display: none;
    }

    .contact-form-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .contact-form-wrapper {
        padding: 28px 22px;
        border-radius: 18px;
    }

    .form-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .contact-form {
        gap: 24px;
    }

    .form-field input,
    .form-field select {
        min-height: 56px;
    }

    .form-field textarea {
        min-height: 170px;
    }

    .form-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .form-actions .btn,
    .form-actions .button {
        width: 100%;
    }

    .form-note {
        max-width: 100%;
    }
}
/* =========================================================
   KONTAKT – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .contact-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .contact-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 26px;
        margin-bottom: 54px;
    }

    .contact-faq-intro .section-eyebrow,
    .contact-faq-intro h2,
    .contact-faq-intro .section-intro {
        grid-column: 1;
        grid-row: auto;
    }

    .contact-faq-intro .section-intro {
        max-width: 760px;
        padding-top: 0;
    }
}


@media (max-width: 700px) {

    .contact-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .contact-faq-intro {
        margin-bottom: 38px;
    }

    .contact-faq-intro h2 {
        font-size: clamp(2.5rem, 11vw, 3.7rem);
        line-height: 1.03;
    }

    .contact-faq-intro h2 br {
        display: none;
    }

    .contact-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .faq-item summary {
        grid-template-columns: minmax(0, 1fr) 28px;
        gap: 18px;

        min-height: 94px;
        padding: 24px 0;

        font-size: 1.35rem;
    }

    .faq-item summary::after {
        width: 26px;
        height: 26px;
        font-size: 1.35rem;
    }

    .faq-item p {
        margin-top: -4px;
        padding: 0 42px 26px 0;

        font-size: 0.95rem;
        line-height: 1.7;
    }
}


/* Weniger Bewegung, falls im System gewünscht */

@media (prefers-reduced-motion: reduce) {

    .faq-item summary::after,
    .faq-item[open] p {
        animation: none;
        transition: none;
    }
}
/* =========================================================
   RECHTSTEXTE – RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .legal-content-section {
        padding: 76px 0 var(--section-space-tablet);
    }

    .legal-content-layout {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .legal-sidebar {
        position: static;
    }

    .legal-navigation {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
        border-top: 0;
    }

    .legal-navigation a {
        padding: 13px 15px;

        border: 1px solid var(--color-border);
        border-radius: 10px;

        background: var(--color-white);
    }

    .legal-navigation a::after {
        display: none;
    }

    .legal-navigation a:hover {
        padding-left: 15px;
        border-color: rgba(196, 0, 0, 0.2);
    }
}


@media (max-width: 700px) {

    .legal-hero {
        padding: 42px 0 58px;
    }

    .legal-hero h1 {
        font-size: clamp(3.4rem, 16vw, 5rem);
        line-height: 0.98;
    }

    .legal-hero-intro {
        margin-top: 24px;
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .legal-content-section {
        padding: 52px 0 var(--section-space-mobile);
    }

    .legal-content-layout {
        gap: 34px;
    }

    .legal-navigation {
        grid-template-columns: 1fr 1fr;
    }

    .legal-document {
        border-radius: 18px;
    }

    .legal-document-header {
        padding: 34px 24px 32px;
    }

    .legal-document-header h2 {
        font-size: clamp(2.5rem, 12vw, 3.8rem);
    }

    .legal-document-section {
        grid-template-columns: 1fr;
        gap: 16px;

        padding: 30px 24px;
        scroll-margin-top: 100px;
    }

    .legal-section-number {
        padding-top: 0;
    }

    .legal-section-content h3 {
        margin-bottom: 16px;
        font-size: 1.65rem;
    }

    .legal-section-content p,
    .legal-section-content address {
        font-size: 0.96rem;
        line-height: 1.75;
    }

    .legal-data-list > div {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .legal-document-note {
        grid-template-columns: 1fr;
        margin: 30px 24px 34px;
    }
}


@media (max-width: 480px) {

    .legal-navigation {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   DATENSCHUTZ – RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .privacy-rights-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 700px) {

    .privacy-hero h1 br {
        display: none;
    }

    .legal-callout {
        grid-template-columns: 1fr;
    }

    .privacy-rights-grid {
        grid-template-columns: 1fr;
    }

    .privacy-right-card {
        min-height: auto;
    }

    .legal-cookie-settings {
        width: 100%;
        justify-content: center;
    }
}
/* =========================================================
   SHOPWARE – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .shopware-hero {
        padding: 55px 0 76px;
    }

    .shopware-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }

    .shopware-system-card {
        min-height: 440px;
        padding: 32px;
    }

    .shopware-system-stage {
        width: 205px;
        height: 205px;
        margin: 46px auto 38px;
    }

    .shopware-system-core {
        width: 128px;
        height: 128px;
    }
}


@media (max-width: 900px) {

    .shopware-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .shopware-hero-content {
        max-width: 880px;
    }

    .shopware-hero-visual {
        justify-content: center;
    }

    .shopware-system-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .shopware-hero {
        padding: 42px 0 56px;
    }

    .shopware-hero-container {
        gap: 38px;
    }

    .shopware-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .shopware-hero-content h1 br {
        display: none;
    }

    .shopware-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .shopware-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .shopware-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .shopware-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .shopware-hero-trust > div,
    .shopware-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .shopware-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .shopware-system-card {
        min-height: auto;
        padding: 28px 22px 24px;
        border-radius: 24px;
    }

    .shopware-system-label {
        max-width: 260px;
        font-size: 0.64rem;
    }

    .shopware-system-stage {
        width: 180px;
        height: 180px;

        margin: 44px auto 38px;
    }

    .shopware-system-core {
        width: 112px;
        height: 112px;
    }

    .shopware-system-core span {
        font-size: 1.08rem;
    }

    .shopware-system-connections {
        grid-template-columns: 1fr;
    }

    .shopware-system-connections > span:not(.shopware-system-more) {
        min-height: 46px;
    }

    .shopware-system-more {
        grid-column: 1;
        margin-top: 6px;
    }
}
/* =========================================================
   SHOPWARE – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .shopware-benefits-intro {
        column-gap: 70px;
    }

    .shopware-benefits-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .shopware-benefit-card {
        min-height: 320px;
    }
}


@media (max-width: 900px) {

    .shopware-benefits-section {
        padding: var(--section-space-tablet) 0;
    }

    .shopware-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .shopware-benefits-intro .section-intro {
        align-self: auto;

        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .shopware-benefits-section {
        padding: var(--section-space-mobile) 0;
    }

    .shopware-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .shopware-benefits-heading .section-eyebrow {
        margin-bottom: 20px;
    }

    .shopware-benefits-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .shopware-benefits-heading h2 br {
        display: none;
    }

    .shopware-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .shopware-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .shopware-benefit-card {
        min-height: 300px;
        padding: 26px;
    }

    .shopware-benefit-card h3 {
        font-size: 1.55rem;
    }
}
/* =========================================================
   SHOPWARE – SERVICES KACHELN RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .shopware-services-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 700px) {

    .shopware-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .shopware-service-card {
        min-height: 285px;
        padding: 26px;
    }

    .shopware-service-card-header {
        margin-bottom: 52px;
    }

    .shopware-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SHOPWARE – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .shopware-process-intro {
        column-gap: 70px;
    }

    .shopware-process-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .shopware-process-card {
        min-height: 270px;
    }
}


@media (max-width: 900px) {

    .shopware-process-section {
        padding: var(--section-space-tablet) 0;
    }

    .shopware-process-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;
        margin-bottom: 54px;
    }

    .shopware-process-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .shopware-process-section {
        padding: var(--section-space-mobile) 0;
    }

    .shopware-process-intro {
        grid-template-columns: 1fr;
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .shopware-process-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .shopware-process-heading h2 br {
        display: none;
    }

    .shopware-process-intro .section-intro {
        max-width: none;
        margin: 0;
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .shopware-process-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .shopware-process-card {
        min-height: auto;
        padding: 26px;
    }

    .shopware-process-card-header {
        margin-bottom: 34px;
    }

    .shopware-process-card h3 {
        min-height: auto;
    }
}
/* =========================================================
   SHOPWARE – FAQ RESPONSIVE
   ========================================================= */

@media (max-width:900px){

    .shopware-faq-intro{

        grid-template-columns:1fr;
        gap:30px;

        margin-bottom:50px;
    }

    .shopware-faq-intro .section-intro{

        margin:0;
        max-width:760px;
    }

}


@media (max-width:700px){

    .shopware-faq-section{

        padding:var(--section-space-mobile) 0;
    }

    .shopware-faq-heading h2{

        font-size:clamp(2.7rem,12vw,4rem);
    }

    .shopware-faq-heading h2 br{

        display:none;
    }

    .faq-item summary{

        font-size:1.15rem;

        padding:22px 0;
    }

    .faq-answer{

        padding-bottom:22px;
    }

}
@media (max-width: 700px) {
    .deine-heading-klasse h2 br {
        display: none;
    }
}
/* =========================================================
   WARENWIRTSCHAFT – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .erp-hero {
        padding: 55px 0 76px;
    }

    .erp-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }

    .erp-system-card {
        min-height: 440px;
        padding: 32px;
    }

    .erp-system-stage {
        width: 205px;
        height: 205px;

        margin: 46px auto 38px;
    }
}


@media (max-width: 900px) {

    .erp-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .erp-hero-content {
        max-width: 880px;
    }

    .erp-hero-visual {
        justify-content: center;
    }

    .erp-system-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .erp-hero {
        padding: 42px 0 56px;
    }

    .erp-hero-container {
        gap: 38px;
    }

    .erp-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .erp-hero-content h1 br {
        display: none;
    }

    .erp-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .erp-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .erp-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .erp-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .erp-hero-trust > div,
    .erp-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .erp-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .erp-system-card {
        min-height: auto;

        padding: 28px 22px 24px;

        border-radius: 24px;
    }

    .erp-system-label {
        max-width: 260px;

        font-size: 0.64rem;
    }

    .erp-system-stage {
        width: 180px;
        height: 180px;

        margin: 44px auto 38px;
    }

    .erp-system-core {
        width: 150px;
        min-height: 100px;

        padding: 16px;
    }

    .erp-system-core-item {
        font-size: 0.84rem;
    }

    .erp-system-connections {
        grid-template-columns: 1fr;
    }

    .erp-system-connections > span:not(.erp-system-more) {
        min-height: 46px;
    }

    .erp-system-more {
        grid-column: 1;

        margin-top: 6px;
    }
}
/* =========================================================
   WARENWIRTSCHAFT – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .erp-benefits-intro {
        column-gap: 70px;
    }

    .erp-benefits-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .erp-benefits-section {
        padding:
            var(--section-space-tablet) 0;
    }

    .erp-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .erp-benefits-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .erp-benefits-section {
        padding:
            var(--section-space-mobile) 0;
    }

    .erp-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .erp-benefits-heading h2 {
        font-size:
            clamp(2.7rem, 12vw, 4rem);

        line-height: 1.02;
    }

    .erp-benefits-heading h2 br {
        display: none;
    }

    .erp-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .erp-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .erp-benefit-card {
        min-height: auto;
        padding: 26px;
    }

    .erp-benefit-card-header {
        margin-bottom: 40px;
    }

    .erp-benefit-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WARENWIRTSCHAFT – ERP SYSTEME RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .erp-systems-intro {
        column-gap: 70px;
    }

    .erp-system-panel {
        min-height: 640px;
        padding: 32px;
    }
}


@media (max-width: 900px) {

    .erp-systems-section {
        padding: var(--section-space-tablet) 0;
    }

    .erp-systems-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .erp-systems-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .erp-systems-grid {
        grid-template-columns: 1fr;
    }

    .erp-system-panel {
        min-height: auto;
    }
}


@media (max-width: 700px) {

    .erp-systems-section {
        padding: var(--section-space-mobile) 0;
    }

    .erp-systems-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .erp-systems-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .erp-systems-heading h2 br {
        display: none;
    }

    .erp-systems-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .erp-system-panel {
        padding: 26px;
    }

    .erp-system-panel-top {
        display: grid;
        gap: 18px;
    }

    .erp-system-panel-badge {
        width: fit-content;
    }

    .erp-system-panel h3 {
        font-size: 2.4rem;
    }

    .erp-system-panel-lead {
        margin: 26px 0 28px;

        font-size: 0.96rem;
    }

    .erp-system-panel-list > div {
        align-items: start;
    }

    .erp-system-panel-footer {
        padding-top: 26px;
    }

    .erp-systems-statement {
        grid-template-columns: 1fr;
        gap: 16px;

        margin-top: 42px;
    }

    .erp-systems-statement-line {
        display: none;
    }
}
/* =========================================================
   WARENWIRTSCHAFT – ERP FIT RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .erp-fit-intro {
        column-gap: 70px;
    }

    .erp-fit-row {
        grid-template-columns:
            60px
            minmax(240px, 0.8fr)
            minmax(0, 1.2fr);

        gap: 30px;
    }
}


@media (max-width: 900px) {

    .erp-fit-section {
        padding: var(--section-space-tablet) 0;
    }

    .erp-fit-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .erp-fit-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .erp-fit-row {
        grid-template-columns:
            56px
            minmax(0, 1fr);

        gap: 18px 28px;
    }

    .erp-fit-recommendation {
        grid-column: 2;
    }

    .erp-fit-statement {
        grid-template-columns: 1fr;

        gap: 30px;

        margin-top: 58px;
    }

    .erp-fit-statement > p {
        max-width: 760px;
    }
}


@media (max-width: 700px) {

    .erp-fit-section {
        padding: var(--section-space-mobile) 0;
    }

    .erp-fit-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .erp-fit-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .erp-fit-heading h2 br {
        display: none;
    }

    .erp-fit-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .erp-fit-row {
        grid-template-columns: 1fr;

        gap: 16px;

        padding: 28px 0;
    }

    .erp-fit-recommendation {
        grid-column: 1;
    }

    .erp-fit-topic h3 br {
        display: none;
    }

    .erp-fit-statement {
        margin-top: 42px;
        padding: 38px 0;
    }

    .erp-fit-statement h3 {
        font-size: clamp(2.4rem, 10vw, 3.5rem);
    }

    .erp-fit-statement h3 br {
        display: none;
    }
}
/* =========================================================
   WARENWIRTSCHAFT – SERVICES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .erp-services-intro {
        column-gap: 70px;
    }

    .erp-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .erp-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .erp-services-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .erp-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .erp-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .erp-services-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .erp-services-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .erp-services-heading h2 br {
        display: none;
    }

    .erp-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .erp-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .erp-service-card {
        min-height: auto;
        padding: 26px;
    }

    .erp-service-card-header {
        margin-bottom: 40px;
    }

    .erp-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WARENWIRTSCHAFT – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .erp-process-intro {
        column-gap: 70px;
    }

    .erp-process-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .erp-process-section {
        padding: var(--section-space-tablet) 0;
    }

    .erp-process-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .erp-process-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .erp-process-section {
        padding: var(--section-space-mobile) 0;
    }

    .erp-process-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .erp-process-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .erp-process-heading h2 br {
        display: none;
    }

    .erp-process-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .erp-process-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .erp-process-card {
        min-height: auto;
        padding: 26px;
    }

    .erp-process-card-header {
        margin-bottom: 38px;
    }

    .erp-process-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WARENWIRTSCHAFT – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .erp-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .erp-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .erp-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .erp-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .erp-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .erp-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .erp-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .erp-faq-heading h2 br {
        display: none;
    }

    .erp-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }


    /* FAQ */

    .erp-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .erp-faq-number {
        font-size: 0.7rem;
    }

    .erp-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .erp-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .erp-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .erp-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .erp-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
/* =========================================================
   MARKTPLÄTZE – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .marketplace-hero {
        padding: 55px 0 76px;
    }

    .marketplace-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }

    .marketplace-network-card {
        min-height: 470px;
        padding: 32px;
    }
}


@media (max-width: 900px) {

    .marketplace-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .marketplace-hero-content {
        max-width: 880px;
    }

    .marketplace-hero-visual {
        justify-content: center;
    }

    .marketplace-network-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .marketplace-hero {
        padding: 42px 0 56px;
    }

    .marketplace-hero-container {
        gap: 38px;
    }

    .marketplace-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .marketplace-hero-content h1 br {
        display: none;
    }

    .marketplace-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .marketplace-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .marketplace-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .marketplace-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .marketplace-hero-trust > div,
    .marketplace-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .marketplace-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .marketplace-network-card {
        min-height: auto;

        padding: 28px 20px 24px;

        border-radius: 24px;
    }

    .marketplace-network-stage {
        width: 280px;
        height: 270px;

        margin: 40px auto 32px;
    }

    .marketplace-network-core {
        width: 104px;
        height: 104px;
    }

    .marketplace-node {
        padding: 7px 10px;

        font-size: 0.65rem;
    }

    .marketplace-network-bottom {
        grid-template-columns: 1fr;
    }

    .marketplace-network-more {
        grid-column: 1;
    }
}
/* =========================================================
   MARKTPLÄTZE – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .marketplace-benefits-intro {
        column-gap: 70px;
    }

    .marketplace-benefits-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .marketplace-benefits-section {
        padding: var(--section-space-tablet) 0;
    }

    .marketplace-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .marketplace-benefits-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .marketplace-benefits-section {
        padding: var(--section-space-mobile) 0;
    }

    .marketplace-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .marketplace-benefits-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .marketplace-benefits-heading h2 br {
        display: none;
    }

    .marketplace-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .marketplace-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .marketplace-benefit-card {
        min-height: auto;
        padding: 26px;
    }

    .marketplace-benefit-card-header {
        margin-bottom: 40px;
    }

    .marketplace-benefit-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   MARKTPLÄTZE – SERVICES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .marketplace-services-intro {
        column-gap: 70px;
    }

    .marketplace-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .marketplace-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .marketplace-services-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .marketplace-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .marketplace-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .marketplace-services-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .marketplace-services-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .marketplace-services-heading h2 br {
        display: none;
    }

    .marketplace-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .marketplace-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .marketplace-service-card {
        min-height: auto;
        padding: 26px;
    }

    .marketplace-service-card-header {
        margin-bottom: 40px;
    }

    .marketplace-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   MARKTPLÄTZE – PLATTFORMEN RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .marketplace-platforms-intro {
        column-gap: 70px;
    }

    .marketplace-platforms-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .marketplace-platforms-section {
        padding: var(--section-space-tablet) 0;
    }

    .marketplace-platforms-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .marketplace-platforms-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .marketplace-platforms-section {
        padding: var(--section-space-mobile) 0;
    }

    .marketplace-platforms-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .marketplace-platforms-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .marketplace-platforms-heading h2 br {
        display: none;
    }

    .marketplace-platforms-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .marketplace-platforms-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .marketplace-platform-card {
        min-height: auto;
        padding: 26px;
    }

    .marketplace-platform-number {
        margin-bottom: 34px;
    }
}
/* =========================================================
   MARKTPLÄTZE – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .marketplace-process-intro {
        column-gap: 70px;
    }

    .marketplace-process-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .marketplace-process-section {
        padding: var(--section-space-tablet) 0;
    }

    .marketplace-process-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .marketplace-process-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .marketplace-process-section {
        padding: var(--section-space-mobile) 0;
    }

    .marketplace-process-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .marketplace-process-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .marketplace-process-heading h2 br {
        display: none;
    }

    .marketplace-process-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .marketplace-process-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .marketplace-process-card {
        min-height: auto;
        padding: 26px;
    }

    .marketplace-process-card-header {
        margin-bottom: 38px;
    }

    .marketplace-process-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   MARKTPLÄTZE – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .marketplace-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .marketplace-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .marketplace-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .marketplace-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .marketplace-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .marketplace-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .marketplace-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .marketplace-faq-heading h2 br {
        display: none;
    }

    .marketplace-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }


    /* FAQ */

    .marketplace-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .marketplace-faq-number {
        font-size: 0.7rem;
    }

    .marketplace-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .marketplace-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .marketplace-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .marketplace-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .marketplace-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
/* =========================================================
   PAYMENT – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .payment-hero {
        padding: 55px 0 76px;
    }

    .payment-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }

    .payment-system-card {
        min-height: 470px;
        padding: 32px;
    }
}


@media (max-width: 900px) {

    .payment-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .payment-hero-content {
        max-width: 880px;
    }

    .payment-hero-visual {
        justify-content: center;
    }

    .payment-system-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .payment-hero {
        padding: 42px 0 56px;
    }

    .payment-hero-container {
        gap: 38px;
    }

    .payment-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .payment-hero-content h1 br {
        display: none;
    }

    .payment-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .payment-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .payment-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .payment-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .payment-hero-trust > div,
    .payment-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .payment-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .payment-system-card {
        min-height: auto;

        padding: 28px 20px 24px;

        border-radius: 24px;
    }

    .payment-system-stage {
        width: 280px;
        height: 260px;

        margin: 40px auto 28px;
    }

    .payment-system-core {
        width: 104px;
        height: 104px;
    }

    .payment-node {
        padding: 7px 10px;

        font-size: 0.65rem;
    }

    .payment-system-flow {
        grid-template-columns: 1fr;

        gap: 10px;
    }

    .payment-flow-arrow {
        transform: rotate(90deg);
    }

    .payment-system-flow > div {
        padding: 6px 0;
    }
}
/* =========================================================
   PAYMENT – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .payment-benefits-intro {
        column-gap: 70px;
    }

    .payment-benefits-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .payment-benefits-section {
        padding: var(--section-space-tablet) 0;
    }

    .payment-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .payment-benefits-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .payment-benefits-section {
        padding: var(--section-space-mobile) 0;
    }

    .payment-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .payment-benefits-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .payment-benefits-heading h2 br {
        display: none;
    }

    .payment-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .payment-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .payment-benefit-card {
        min-height: auto;
        padding: 26px;
    }

    .payment-benefit-card-header {
        margin-bottom: 40px;
    }

    .payment-benefit-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   PAYMENT – SERVICES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .payment-services-intro {
        column-gap: 70px;
    }

    .payment-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .payment-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .payment-services-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .payment-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .payment-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .payment-services-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .payment-services-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .payment-services-heading h2 br {
        display: none;
    }

    .payment-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .payment-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .payment-service-card {
        min-height: auto;
        padding: 26px;
    }

    .payment-service-card-header {
        margin-bottom: 40px;
    }

    .payment-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}

/* =========================================================
   PAYMENT – ANBIETER RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .payment-providers-intro {
        column-gap: 70px;
    }

    .payment-providers-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .payment-providers-section {
        padding: var(--section-space-tablet) 0;
    }

    .payment-providers-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .payment-providers-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .payment-providers-section {
        padding: var(--section-space-mobile) 0;
    }

    .payment-providers-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .payment-providers-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .payment-providers-heading h2 br {
        display: none;
    }

    .payment-providers-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .payment-providers-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .payment-provider-card {
        min-height: auto;
        padding: 26px;
    }

    .payment-provider-number {
        margin-bottom: 34px;
    }
}
/* =========================================================
   PAYMENT – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .payment-process-intro {
        column-gap: 70px;
    }

    .payment-process-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .payment-process-section {
        padding: var(--section-space-tablet) 0;
    }

    .payment-process-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .payment-process-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .payment-process-section {
        padding: var(--section-space-mobile) 0;
    }

    .payment-process-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .payment-process-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .payment-process-heading h2 br {
        display: none;
    }

    .payment-process-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .payment-process-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .payment-process-card {
        min-height: auto;
        padding: 26px;
    }

    .payment-process-card-header {
        margin-bottom: 38px;
    }

    .payment-process-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   PAYMENT – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .payment-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .payment-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .payment-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .payment-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .payment-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .payment-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .payment-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .payment-faq-heading h2 br {
        display: none;
    }

    .payment-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }


    /* FAQ */

    .payment-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .payment-faq-number {
        font-size: 0.7rem;
    }

    .payment-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .payment-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .payment-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .payment-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .payment-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
/* =========================================================
   SCHNITTSTELLEN – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .interfaces-hero {
        padding: 55px 0 76px;
    }

    .interfaces-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }

    .interfaces-network-card {
        min-height: 470px;
        padding: 32px;
    }
}


@media (max-width: 900px) {

    .interfaces-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .interfaces-hero-content {
        max-width: 880px;
    }

    .interfaces-hero-visual {
        justify-content: center;
    }

    .interfaces-network-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .interfaces-hero {
        padding: 42px 0 56px;
    }

    .interfaces-hero-container {
        gap: 38px;
    }

    .interfaces-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .interfaces-hero-content h1 br {
        display: none;
    }

    .interfaces-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .interfaces-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .interfaces-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .interfaces-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .interfaces-hero-trust > div,
    .interfaces-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .interfaces-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .interfaces-network-card {
        min-height: auto;

        padding: 28px 20px 24px;

        border-radius: 24px;
    }

    .interfaces-network-stage {
        width: 280px;
        height: 270px;

        margin: 40px auto 32px;
    }

    .interfaces-network-core {
        width: 104px;
        height: 104px;
    }

    .interfaces-node {
        padding: 7px 10px;

        font-size: 0.64rem;
    }

    .interfaces-network-bottom {
        grid-template-columns: 1fr;
    }

    .interfaces-network-more {
        grid-column: 1;
    }
}
/* =========================================================
   SCHNITTSTELLEN – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .interfaces-benefits-intro {
        column-gap: 70px;
    }

    .interfaces-benefits-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .interfaces-benefits-section {
        padding: var(--section-space-tablet) 0;
    }

    .interfaces-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .interfaces-benefits-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .interfaces-benefits-section {
        padding: var(--section-space-mobile) 0;
    }

    .interfaces-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .interfaces-benefits-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .interfaces-benefits-heading h2 br {
        display: none;
    }

    .interfaces-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .interfaces-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .interfaces-benefit-card {
        min-height: auto;
        padding: 26px;
    }

    .interfaces-benefit-card-header {
        margin-bottom: 40px;
    }

    .interfaces-benefit-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SCHNITTSTELLEN – SERVICES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .interfaces-services-intro {
        column-gap: 70px;
    }

    .interfaces-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .interfaces-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .interfaces-services-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .interfaces-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .interfaces-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .interfaces-services-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .interfaces-services-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .interfaces-services-heading h2 br {
        display: none;
    }

    .interfaces-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .interfaces-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .interfaces-service-card {
        min-height: auto;
        padding: 26px;
    }

    .interfaces-service-card-header {
        margin-bottom: 40px;
    }

    .interfaces-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SCHNITTSTELLEN – INTEGRATIONEN RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .interfaces-integrations-intro {
        column-gap: 70px;
    }

    .interfaces-integrations-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .interfaces-integrations-section {
        padding: var(--section-space-tablet) 0;
    }

    .interfaces-integrations-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .interfaces-integrations-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .interfaces-integrations-section {
        padding: var(--section-space-mobile) 0;
    }

    .interfaces-integrations-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .interfaces-integrations-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .interfaces-integrations-heading h2 br {
        display: none;
    }

    .interfaces-integrations-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .interfaces-integrations-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .interfaces-integration-card {
        min-height: auto;
        padding: 26px;
    }

    .interfaces-integration-number {
        margin-bottom: 34px;
    }
}
/* =========================================================
   SCHNITTSTELLEN – DATEN RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .interfaces-data-intro {
        column-gap: 70px;
    }

    .interfaces-data-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .interfaces-data-section {
        padding: var(--section-space-tablet) 0;
    }

    .interfaces-data-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .interfaces-data-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .interfaces-data-section {
        padding: var(--section-space-mobile) 0;
    }

    .interfaces-data-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .interfaces-data-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .interfaces-data-heading h2 br {
        display: none;
    }

    .interfaces-data-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .interfaces-data-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .interfaces-data-card {
        min-height: auto;
        padding: 26px;
    }

    .interfaces-data-card-header {
        margin-bottom: 34px;
    }

    .interfaces-data-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SCHNITTSTELLEN – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .interfaces-process-intro {
        column-gap: 70px;
    }

    .interfaces-process-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .interfaces-process-section {
        padding: var(--section-space-tablet) 0;
    }

    .interfaces-process-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .interfaces-process-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .interfaces-process-section {
        padding: var(--section-space-mobile) 0;
    }

    .interfaces-process-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .interfaces-process-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .interfaces-process-heading h2 br {
        display: none;
    }

    .interfaces-process-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .interfaces-process-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .interfaces-process-card {
        min-height: auto;
        padding: 26px;
    }

    .interfaces-process-card-header {
        margin-bottom: 38px;
    }

    .interfaces-process-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SCHNITTSTELLEN – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .interfaces-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .interfaces-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .interfaces-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .interfaces-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .interfaces-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .interfaces-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .interfaces-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .interfaces-faq-heading h2 br {
        display: none;
    }

    .interfaces-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }


    /* FAQ */

    .interfaces-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .interfaces-faq-number {
        font-size: 0.7rem;
    }

    .interfaces-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .interfaces-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .interfaces-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .interfaces-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .interfaces-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
/* =========================================================
   MIGRATION – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .migration-hero {
        padding: 55px 0 76px;
    }

    .migration-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }

    .migration-system-card {
        min-height: 470px;
        padding: 32px;
    }

    .migration-flow {
        grid-template-columns:
            minmax(0, 1fr)
            120px
            minmax(0, 1fr);
    }
}


@media (max-width: 900px) {

    .migration-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .migration-hero-content {
        max-width: 880px;
    }

    .migration-hero-visual {
        justify-content: center;
    }

    .migration-system-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .migration-hero {
        padding: 42px 0 56px;
    }

    .migration-hero-container {
        gap: 38px;
    }

    .migration-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .migration-hero-content h1 br {
        display: none;
    }

    .migration-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .migration-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .migration-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .migration-hero-trust > div,
    .migration-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .migration-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .migration-system-card {
        min-height: auto;

        padding: 28px 20px 24px;

        border-radius: 24px;
    }

    .migration-flow {
        grid-template-columns: 1fr;
        gap: 18px;

        margin: 42px 0 36px;
    }

    .migration-flow-center {
        flex-direction: column;
        gap: 0;
    }

    .migration-flow-line {
        width: 1px;
        height: 24px;
        flex: 0 0 24px;
    }

    .migration-flow-core {
        width: 86px;
        height: 86px;
    }

    .migration-data-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .migration-data-more {
        grid-column: 1 / -1;
    }
}
/* =========================================================
   MIGRATION – WARUM MIGRIEREN? RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .migration-reasons-intro {
        column-gap: 70px;
    }

    .migration-reasons-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .migration-reasons-section {
        padding: var(--section-space-tablet) 0;
    }

    .migration-reasons-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .migration-reasons-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .migration-reasons-section {
        padding: var(--section-space-mobile) 0;
    }

    .migration-reasons-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .migration-reasons-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .migration-reasons-heading h2 br {
        display: none;
    }

    .migration-reasons-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-reasons-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .migration-reason-card {
        min-height: auto;
        padding: 26px;
    }

    .migration-reason-card-header {
        margin-bottom: 40px;
    }

    .migration-reason-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   MIGRATION – DATEN RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .migration-data-intro {
        column-gap: 70px;
    }

    .migration-data-cards {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .migration-data-section {
        padding: var(--section-space-tablet) 0;
    }

    .migration-data-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .migration-data-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .migration-data-section {
        padding: var(--section-space-mobile) 0;
    }

    .migration-data-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .migration-data-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .migration-data-heading h2 br {
        display: none;
    }

    .migration-data-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-data-cards {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .migration-data-card {
        min-height: auto;
        padding: 26px;
    }

    .migration-data-card-header {
        margin-bottom: 34px;
    }

    .migration-data-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   MIGRATION – ROUTES RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .migration-routes-intro {
        column-gap: 70px;
    }

    .migration-route-custom {
        gap: 60px;
    }
}


@media (max-width: 900px) {

    .migration-routes-section {
        padding: var(--section-space-tablet) 0;
    }

    .migration-routes-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .migration-routes-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .migration-routes-grid {
        grid-template-columns: 1fr;
    }

    .migration-route-custom {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}


@media (max-width: 700px) {

    .migration-routes-section {
        padding: var(--section-space-mobile) 0;
    }

    .migration-routes-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .migration-routes-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .migration-routes-heading h2 br {
        display: none;
    }

    .migration-routes-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-route-card {
        min-height: auto;
        padding: 26px;
    }

    .migration-route-flow {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .migration-route-arrow {
        width: 86px;
    }

    .migration-route-system strong {
        font-size: 1.8rem;
    }

    .migration-route-custom {
        padding: 28px;
    }

    .migration-route-custom h3 {
        font-size: 2rem;
    }
}
/* =========================================================
   MIGRATION – PROZESSE RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .migration-processes-intro {
        column-gap: 70px;
    }

    .migration-processes-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .migration-processes-section {
        padding: var(--section-space-tablet) 0;
    }

    .migration-processes-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .migration-processes-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .migration-processes-section {
        padding: var(--section-space-mobile) 0;
    }

    .migration-processes-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .migration-processes-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .migration-processes-heading h2 br {
        display: none;
    }

    .migration-processes-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-processes-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .migration-process-card {
        min-height: auto;
        padding: 26px;
    }

    .migration-process-card-header {
        margin-bottom: 38px;
    }

    .migration-process-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }

    .migration-processes-statement {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 42px;
    }

    .migration-processes-statement-line {
        display: none;
    }
}
/* =========================================================
   MIGRATION – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .migration-project-intro {
        column-gap: 70px;
    }

    .migration-project-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .migration-project-section {
        padding: var(--section-space-tablet) 0;
    }

    .migration-project-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .migration-project-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .migration-project-section {
        padding: var(--section-space-mobile) 0;
    }

    .migration-project-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .migration-project-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .migration-project-heading h2 br {
        display: none;
    }

    .migration-project-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-project-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .migration-project-card {
        min-height: auto;
        padding: 26px;
    }

    .migration-project-card-header {
        margin-bottom: 38px;
    }

    .migration-project-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   MIGRATION – SEO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .migration-seo-intro {
        column-gap: 70px;
    }

    .migration-seo-layout {
        grid-template-columns:
            minmax(0, 0.9fr)
            minmax(380px, 1.1fr);
    }

    .migration-seo-main {
        padding: 34px;
    }
}


@media (max-width: 900px) {

    .migration-seo-section {
        padding: var(--section-space-tablet) 0;
    }

    .migration-seo-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .migration-seo-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .migration-seo-layout {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .migration-seo-main {
        min-height: auto;
    }
}


@media (max-width: 700px) {

    .migration-seo-section {
        padding: var(--section-space-mobile) 0;
    }

    .migration-seo-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .migration-seo-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .migration-seo-heading h2 br {
        display: none;
    }

    .migration-seo-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-seo-main {
        padding: 28px;

        border-radius: 24px;
    }

    .migration-seo-main h3 {
        font-size: clamp(2.4rem, 10vw, 3.5rem);
    }

    .migration-seo-main h3 br {
        display: none;
    }

    .migration-seo-route {
        grid-template-columns: 1fr;
        gap: 14px;

        margin-top: 38px;
    }

    .migration-seo-route-arrow {
        width: 90px;
    }

    .migration-seo-check {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 14px;
    }

    .migration-seo-statement {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 42px;
    }

    .migration-seo-statement-line {
        display: none;
    }
}
/* =========================================================
   MIGRATION – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .migration-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .migration-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .migration-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .migration-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .migration-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .migration-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .migration-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .migration-faq-heading h2 br {
        display: none;
    }

    .migration-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .migration-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .migration-faq-number {
        font-size: 0.7rem;
    }

    .migration-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .migration-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .migration-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .migration-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .migration-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
/* =========================================================
   WEBHOSTING – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .hosting-hero {
        padding: 55px 0 76px;
    }

    .hosting-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }

    .hosting-system-card {
        min-height: 470px;
        padding: 32px;
    }
}


@media (max-width: 900px) {

    .hosting-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .hosting-hero-content {
        max-width: 880px;
    }

    .hosting-hero-visual {
        justify-content: center;
    }

    .hosting-system-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .hosting-hero {
        padding: 42px 0 56px;
    }

    .hosting-hero-container {
        gap: 38px;
    }

    .hosting-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .hosting-hero-content h1 br {
        display: none;
    }

    .hosting-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .hosting-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .hosting-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .hosting-hero-trust > div,
    .hosting-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .hosting-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .hosting-system-card {
        min-height: auto;

        padding: 28px 20px 24px;

        border-radius: 24px;
    }

    .hosting-system-stack {
        margin: 38px 0 30px;
    }

    .hosting-system-partners {
        grid-template-columns: 1fr;
    }

    .hosting-system-bottom {
        grid-template-columns: 1fr;
    }

    .hosting-system-more {
        grid-column: 1;
    }
}
/* =========================================================
   WEBHOSTING – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .hosting-benefits-intro {
        column-gap: 70px;
    }

    .hosting-benefits-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .hosting-benefits-section {
        padding: var(--section-space-tablet) 0;
    }

    .hosting-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .hosting-benefits-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .hosting-benefits-section {
        padding: var(--section-space-mobile) 0;
    }

    .hosting-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .hosting-benefits-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .hosting-benefits-heading h2 br {
        display: none;
    }

    .hosting-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hosting-benefit-card {
        min-height: auto;
        padding: 26px;
    }

    .hosting-benefit-card-header {
        margin-bottom: 40px;
    }

    .hosting-benefit-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WEBHOSTING – SERVICES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .hosting-services-intro {
        column-gap: 70px;
    }

    .hosting-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .hosting-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .hosting-services-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .hosting-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .hosting-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .hosting-services-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .hosting-services-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .hosting-services-heading h2 br {
        display: none;
    }

    .hosting-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hosting-service-card {
        min-height: auto;
        padding: 26px;
    }

    .hosting-service-card-header {
        margin-bottom: 40px;
    }

    .hosting-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WEBHOSTING – PARTNER RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .hosting-partners-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .hosting-partners-section {
        padding: var(--section-space-tablet) 0;
    }

    .hosting-partners-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .hosting-partners-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .hosting-partners-grid {
        grid-template-columns: 1fr;
    }

    .hosting-partner-panel {
        min-height: 460px;
    }
}


@media (max-width: 700px) {

    .hosting-partners-section {
        padding: var(--section-space-mobile) 0;
    }

    .hosting-partners-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .hosting-partners-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .hosting-partners-heading h2 br {
        display: none;
    }

    .hosting-partners-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-partner-panel {
        min-height: auto;
        padding: 28px;
    }

    .hosting-partner-panel-top {
        margin-bottom: 42px;
    }

    .hosting-partner-content h3 {
        font-size: 2.5rem;
    }

    .hosting-partner-features {
        grid-template-columns: 1fr;
    }

    .hosting-partners-statement {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 42px;
    }

    .hosting-partners-statement-line {
        display: none;
    }
}
/* =========================================================
   WEBHOSTING – SYSTEME RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .hosting-systems-intro {
        column-gap: 70px;
    }

    .hosting-systems-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .hosting-systems-section {
        padding: var(--section-space-tablet) 0;
    }

    .hosting-systems-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .hosting-systems-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .hosting-systems-section {
        padding: var(--section-space-mobile) 0;
    }

    .hosting-systems-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .hosting-systems-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .hosting-systems-heading h2 br {
        display: none;
    }

    .hosting-systems-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-systems-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hosting-system-type-card {
        min-height: auto;
        padding: 26px;
    }

    .hosting-system-type-header {
        margin-bottom: 38px;
    }

    .hosting-system-type-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WEBHOSTING – MANAGED RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .hosting-managed-intro {
        column-gap: 70px;
    }

    .hosting-managed-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .hosting-managed-section {
        padding: var(--section-space-tablet) 0;
    }

    .hosting-managed-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .hosting-managed-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .hosting-managed-section {
        padding: var(--section-space-mobile) 0;
    }

    .hosting-managed-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .hosting-managed-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .hosting-managed-heading h2 br {
        display: none;
    }

    .hosting-managed-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-managed-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hosting-managed-card {
        min-height: auto;
        padding: 26px;
    }

    .hosting-managed-card-header {
        margin-bottom: 38px;
    }

    .hosting-managed-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }

    .hosting-managed-statement {
        grid-template-columns: 1fr;

        gap: 14px;

        margin-top: 42px;
    }

    .hosting-managed-statement-line {
        display: none;
    }
}
/* =========================================================
   WEBHOSTING – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .hosting-project-intro {
        column-gap: 70px;
    }

    .hosting-project-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .hosting-project-section {
        padding: var(--section-space-tablet) 0;
    }

    .hosting-project-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .hosting-project-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .hosting-project-section {
        padding: var(--section-space-mobile) 0;
    }

    .hosting-project-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .hosting-project-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .hosting-project-heading h2 br {
        display: none;
    }

    .hosting-project-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-project-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hosting-project-card {
        min-height: auto;
        padding: 26px;
    }

    .hosting-project-card-header {
        margin-bottom: 38px;
    }

    .hosting-project-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WEBHOSTING – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .hosting-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .hosting-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .hosting-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .hosting-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .hosting-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .hosting-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .hosting-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .hosting-faq-heading h2 br {
        display: none;
    }

    .hosting-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .hosting-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .hosting-faq-number {
        font-size: 0.7rem;
    }

    .hosting-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .hosting-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .hosting-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .hosting-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .hosting-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
@media (max-width: 900px) {

    .reference-showcase {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .reference-showcase-left .reference-showcase-content,
    .reference-showcase-right .reference-showcase-content {
        order: 1;
    }

    .reference-showcase-left .reference-showcase-visual,
    .reference-showcase-right .reference-showcase-visual {
        order: 2;
    }
}
/* =========================================================
   REFERENZEN – EINHEITLICHE SCREENSHOTS
   ========================================================= */

.reference-showcase-visual {
    width: 100%;
    min-width: 0;
}

.reference-browser-frame {
    width: 100%;
    overflow: hidden;
}
@media (max-width: 900px) {

    .reference-showcase {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .reference-browser-frame {
        aspect-ratio: 16 / 10;
    }


    /* Mobile immer Text zuerst */

    .reference-showcase-left .reference-showcase-content,
    .reference-showcase-right .reference-showcase-content {
        order: 1;
    }

    .reference-showcase-left .reference-showcase-visual,
    .reference-showcase-right .reference-showcase-visual {
        order: 2;
    }
}


@media (max-width: 700px) {

    .reference-browser-frame {
        aspect-ratio: 16 / 11;
    }
}
/* =========================================================
   WORDPRESS – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .wordpress-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(370px, 0.82fr);

        gap: 52px;
    }
}


@media (max-width: 900px) {

    .wordpress-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .wordpress-hero-visual {
        justify-content: center;
    }

    .wordpress-system-card {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .wordpress-hero {
        padding: 42px 0 56px;
    }

    .wordpress-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .wordpress-hero-content h1 br {
        display: none;
    }

    .wordpress-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .wordpress-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
        margin-top: 28px;
    }

    .wordpress-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .wordpress-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;

        margin-top: 36px;
        padding-top: 24px;
    }

    .wordpress-hero-trust > div,
    .wordpress-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .wordpress-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .wordpress-system-card {
        min-height: auto;
        padding: 26px 20px 24px;

        border-radius: 24px;
    }

    .wordpress-browser-layout {
        grid-template-columns: 1fr;
    }

    .wordpress-browser-image {
        min-height: 180px;
    }

    .wordpress-system-badge {
        display: none;
    }
}
/* =========================================================
   WORDPRESS – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .wordpress-benefits-intro {
        column-gap: 70px;
    }

    .wordpress-benefits-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .wordpress-benefits-section {
        padding: var(--section-space-tablet) 0;
    }

    .wordpress-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .wordpress-benefits-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .wordpress-benefits-section {
        padding: var(--section-space-mobile) 0;
    }

    .wordpress-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .wordpress-benefits-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .wordpress-benefits-heading h2 br {
        display: none;
    }

    .wordpress-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .wordpress-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .wordpress-benefit-card {
        min-height: auto;
        padding: 26px;
    }

    .wordpress-benefit-card-header {
        margin-bottom: 40px;
    }

    .wordpress-benefit-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WORDPRESS – SERVICES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .wordpress-services-intro {
        column-gap: 70px;
    }

    .wordpress-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .wordpress-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .wordpress-services-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .wordpress-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .wordpress-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .wordpress-services-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .wordpress-services-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .wordpress-services-heading h2 br {
        display: none;
    }

    .wordpress-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .wordpress-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .wordpress-service-card {
        min-height: auto;
        padding: 26px;
    }

    .wordpress-service-card-header {
        margin-bottom: 40px;
    }

    .wordpress-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }

    .wordpress-services-statement {
        grid-template-columns: 1fr;
        gap: 14px;

        margin-top: 42px;
    }

    .wordpress-services-statement-line {
        display: none;
    }
}
/* =========================================================
   WORDPRESS – CASES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .wordpress-cases-intro {
        column-gap: 70px;
    }

    .wordpress-case {
        gap: 55px;
    }
}


@media (max-width: 900px) {

    .wordpress-cases-section {
        padding: var(--section-space-tablet) 0;
    }

    .wordpress-cases-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 64px;
    }

    .wordpress-cases-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .wordpress-cases-list {
        gap: 76px;
    }

    .wordpress-case {
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .wordpress-case-content {
        max-width: 720px;
    }

    .wordpress-case-reverse
    .wordpress-case-content {
        order: 2;
    }

    .wordpress-case-reverse
    .wordpress-case-visual {
        order: 1;
    }
}


@media (max-width: 700px) {

    .wordpress-cases-section {
        padding: var(--section-space-mobile) 0;
    }

    .wordpress-cases-intro {
        row-gap: 24px;
        margin-bottom: 46px;
    }

    .wordpress-cases-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .wordpress-cases-heading h2 br {
        display: none;
    }

    .wordpress-cases-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .wordpress-cases-list {
        gap: 62px;
    }

    .wordpress-case {
        gap: 28px;
    }

    .wordpress-case-browser {
        border-radius: 16px;
    }

    .wordpress-case-toolbar {
        min-height: 40px;
        padding: 0 12px;
    }

    .wordpress-case-content h3 {
        font-size: 2.35rem;
    }

    .wordpress-case-lead {
        font-size: 1rem !important;
    }

    .wordpress-cases-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 58px;
    }

    .wordpress-cases-statement-line {
        display: none;
    }
}
/* =========================================================
   WORDPRESS – WARTUNG RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .wordpress-maintenance-intro {
        column-gap: 70px;
    }

    .wordpress-maintenance-layout {
        grid-template-columns:
            minmax(0, 0.9fr)
            minmax(380px, 1.1fr);
    }
}


@media (max-width: 900px) {

    .wordpress-maintenance-section {
        padding: var(--section-space-tablet) 0;
    }

    .wordpress-maintenance-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .wordpress-maintenance-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .wordpress-maintenance-layout {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .wordpress-maintenance-main {
        min-height: 520px;
    }
}


@media (max-width: 700px) {

    .wordpress-maintenance-section {
        padding: var(--section-space-mobile) 0;
    }

    .wordpress-maintenance-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .wordpress-maintenance-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .wordpress-maintenance-heading h2 br {
        display: none;
    }

    .wordpress-maintenance-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .wordpress-maintenance-main {
        min-height: 500px;
        padding: 28px;

        border-radius: 24px;
    }

    .wordpress-maintenance-main h3 {
        font-size: clamp(2.4rem, 10vw, 3.5rem);
    }

    .wordpress-maintenance-main h3 br {
        display: none;
    }

    .wordpress-maintenance-status {
        left: 28px;
        right: 28px;
        bottom: 28px;
    }

    .wordpress-maintenance-item {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 14px;
    }

    .wordpress-maintenance-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .wordpress-maintenance-statement-line {
        display: none;
    }
}
/* =========================================================
   WORDPRESS – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .wordpress-project-intro {
        column-gap: 70px;
    }

    .wordpress-project-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .wordpress-project-section {
        padding: var(--section-space-tablet) 0;
    }

    .wordpress-project-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .wordpress-project-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .wordpress-project-section {
        padding: var(--section-space-mobile) 0;
    }

    .wordpress-project-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .wordpress-project-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .wordpress-project-heading h2 br {
        display: none;
    }

    .wordpress-project-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .wordpress-project-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .wordpress-project-card {
        min-height: auto;
        padding: 26px;
    }

    .wordpress-project-card-header {
        margin-bottom: 38px;
    }

    .wordpress-project-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   WORDPRESS – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .wordpress-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .wordpress-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .wordpress-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .wordpress-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .wordpress-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .wordpress-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .wordpress-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .wordpress-faq-heading h2 br {
        display: none;
    }

    .wordpress-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .wordpress-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .wordpress-faq-number {
        font-size: 0.7rem;
    }

    .wordpress-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .wordpress-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .wordpress-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .wordpress-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .wordpress-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
@media (max-width: 900px) {

    .seo-hero-container {
        grid-template-columns: 1fr;
        gap: 48px;
    }

    .seo-hero-visual {
        justify-content: center;
    }

    .seo-system-card {
        width: min(100%, 700px);
    }
}

@media (max-width: 700px) {

    .seo-hero {
        padding: 42px 0 56px;
    }

    .seo-hero-content h1 {
        font-size: clamp(2.9rem, 12vw, 4.5rem);
        line-height: 1;
    }

    .seo-hero-content h1 br {
        display: none;
    }

    .seo-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .seo-system-grid {
        grid-template-columns: 1fr;
    }
}
/* =========================================================
   SEO & GOOGLE – BENEFITS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .seo-benefits-intro {
        column-gap: 70px;
    }

    .seo-benefits-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .seo-benefits-section {
        padding: var(--section-space-tablet) 0;
    }

    .seo-benefits-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .seo-benefits-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .seo-benefits-section {
        padding: var(--section-space-mobile) 0;
    }

    .seo-benefits-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .seo-benefits-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .seo-benefits-heading h2 br {
        display: none;
    }

    .seo-benefits-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .seo-benefits-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .seo-benefit-card {
        min-height: auto;
        padding: 26px;
    }

    .seo-benefit-card-header {
        margin-bottom: 40px;
    }

    .seo-benefit-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SEO & GOOGLE – SERVICES RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .seo-services-intro {
        column-gap: 70px;
    }

    .seo-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .seo-services-section {
        padding: var(--section-space-tablet) 0;
    }

    .seo-services-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .seo-services-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .seo-services-section {
        padding: var(--section-space-mobile) 0;
    }

    .seo-services-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .seo-services-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .seo-services-heading h2 br {
        display: none;
    }

    .seo-services-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .seo-services-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .seo-service-card {
        min-height: auto;
        padding: 26px;
    }

    .seo-service-card-header {
        margin-bottom: 40px;
    }

    .seo-service-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SEO & GOOGLE – PARTNER RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .seo-partner-intro {
        column-gap: 70px;
    }

    .seo-partner-layout {
        grid-template-columns:
            minmax(0, 1fr)
            54px
            minmax(0, 1fr);

        gap: 12px;
    }

    .seo-partner-panel {
        padding: 30px;
    }
}


@media (max-width: 900px) {

    .seo-partner-section {
        padding: var(--section-space-tablet) 0;
    }

    .seo-partner-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .seo-partner-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .seo-partner-layout {
        grid-template-columns: 1fr;
    }

    .seo-partner-connection {
        height: 64px;

        flex-direction: column;
    }

    .seo-partner-connection > span {
        width: 1px;
        height: auto;

        flex: 1;
    }

    .seo-partner-trust {
        grid-template-columns: 180px 1fr;

        gap: 40px;
    }
}


@media (max-width: 700px) {

    .seo-partner-section {
        padding: var(--section-space-mobile) 0;
    }

    .seo-partner-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .seo-partner-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .seo-partner-heading h2 br {
        display: none;
    }

    .seo-partner-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .seo-partner-panel {
        min-height: auto;
        padding: 26px;
    }

    .seo-partner-content h3 br {
        display: none;
    }

    .seo-partner-features {
        grid-template-columns: 1fr;
    }

    .seo-partner-trust {
        grid-template-columns: 1fr;

        gap: 28px;
        padding: 28px;
    }

    .seo-partner-trust-value {
        padding: 0 0 24px;

        border-right: 0;
        border-bottom: 1px solid var(--color-border);
    }

    .seo-partner-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .seo-partner-statement-line {
        display: none;
    }
}
/* =========================================================
   SEO & GOOGLE – TECHNISCHE SEO RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .seo-technical-intro {
        column-gap: 70px;
    }

    .seo-technical-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .seo-technical-section {
        padding: var(--section-space-tablet) 0;
    }

    .seo-technical-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .seo-technical-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .seo-technical-section {
        padding: var(--section-space-mobile) 0;
    }

    .seo-technical-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .seo-technical-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .seo-technical-heading h2 br {
        display: none;
    }

    .seo-technical-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .seo-technical-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .seo-technical-card {
        min-height: auto;
        padding: 26px;
    }

    .seo-technical-card-header {
        margin-bottom: 34px;
    }

    .seo-technical-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SEO & GOOGLE – PROJEKTABLAUF RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .seo-project-intro {
        column-gap: 70px;
    }

    .seo-project-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .seo-project-section {
        padding: var(--section-space-tablet) 0;
    }

    .seo-project-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .seo-project-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .seo-project-section {
        padding: var(--section-space-mobile) 0;
    }

    .seo-project-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .seo-project-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .seo-project-heading h2 br {
        display: none;
    }

    .seo-project-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .seo-project-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .seo-project-card {
        min-height: auto;
        padding: 26px;
    }

    .seo-project-card-header {
        margin-bottom: 38px;
    }

    .seo-project-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }
}
/* =========================================================
   SEO & GOOGLE – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .seo-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .seo-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .seo-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .seo-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .seo-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .seo-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .seo-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .seo-faq-heading h2 br {
        display: none;
    }

    .seo-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .seo-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .seo-faq-number {
        font-size: 0.7rem;
    }

    .seo-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .seo-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .seo-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .seo-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .seo-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}
/* =========================================================
   404 – RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .error-page-layout {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(360px, 0.85fr);

        gap: 60px;
    }

}


@media (max-width: 900px) {

    .error-page {
        min-height: auto;

        padding: 90px 0 60px;
    }

    .error-page-layout {
        grid-template-columns: 1fr;

        gap: 60px;
    }

    .error-page-content {
        max-width: 760px;
    }

    .error-status {
        max-width: 700px;
    }

    .error-page-statement {
        margin-top: 60px;
    }

}


@media (max-width: 600px) {

    .error-page {
        padding: 70px 0 45px;
    }

    .error-page-code {
        font-size: clamp(6rem, 30vw, 9rem);
    }

    .error-page h1 {
        margin-top: 26px;

        font-size: clamp(2.6rem, 12vw, 4rem);
    }

    .error-page h1 br {
        display: none;
    }

    .error-page-lead {
        font-size: 1rem;
    }

    .error-page-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .error-page-actions .btn {
        width: 100%;
    }

    .error-status-body {
        padding: 6px 20px;
    }

    .error-status-row {
        grid-template-columns: 1fr;

        gap: 8px;

        padding: 20px 0;
    }

    .error-status-header,
    .error-status-footer {
        padding-left: 20px;
        padding-right: 20px;
    }

    .error-page-statement {
        align-items: flex-start;

        gap: 16px;

        margin-top: 45px;
    }

    .error-page-statement > span {
        width: 32px;

        margin-top: 9px;
    }

}
/* =========================================================
   LEISTUNGEN – HERO RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .services-hero-container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(390px, 0.84fr);

        gap: 56px;
    }

    .services-hero-links {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .services-hero-links a:nth-child(3n) {
        border-right: 1px solid var(--color-border);
    }
}


@media (max-width: 900px) {

    .services-hero-container {
        grid-template-columns: 1fr;

        gap: 48px;
    }

    .services-hero-visual {
        justify-content: center;
    }

    .services-system-map {
        width: min(100%, 700px);
    }
}


@media (max-width: 700px) {

    .services-hero {
        padding: 42px 0 28px;
    }

    .services-hero-content h1 {
        font-size: clamp(3rem, 12vw, 4.7rem);
        line-height: 0.99;
    }

    .services-hero-content h1 br {
        display: none;
    }

    .services-hero-lead {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-hero-actions {
        display: grid;
        grid-template-columns: 1fr;

        gap: 12px;
    }

    .services-hero-actions .button {
        width: 100%;
        justify-content: center;
    }

    .services-hero-trust {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .services-hero-trust > div,
    .services-hero-trust > div:not(:first-child) {
        padding: 0;
    }

    .services-hero-trust > div:not(:last-child)::after {
        display: none;
    }

    .services-system-map {
        min-height: auto;

        padding: 28px 20px 24px;

        border-radius: 24px;
    }

    .services-hero-links {
        grid-template-columns: 1fr;

        margin-top: 38px;
    }

    .services-hero-links a,
    .services-hero-links a:first-child {
        border-left: 1px solid var(--color-border);
        border-right: 1px solid var(--color-border);
        border-bottom: 1px solid var(--color-border);
    }

    .services-hero-links a:last-child {
        border-bottom: 0;
    }
}
/* =========================================================
   LEISTUNGEN – SYSTEMLANDSCHAFT RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-landscape-intro {
        column-gap: 70px;
    }

}


@media (max-width: 900px) {

    .services-landscape-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-landscape-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-landscape-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-landscape-layout {
        grid-template-columns: 1fr;
    }

    .services-landscape-card {
        min-height: 390px;
    }

}


@media (max-width: 700px) {

    .services-landscape-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-landscape-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-landscape-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-landscape-heading h2 br {
        display: none;
    }

    .services-landscape-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-landscape-layout {
        gap: 16px;
    }

    .services-landscape-card {
        min-height: auto;

        padding: 26px;
    }

    .services-landscape-card-top {
        margin-bottom: 34px;
    }

    .services-landscape-card h3 {
        font-size: 2rem;
    }

    .services-landscape-links {
        padding-top: 28px;
    }

    .services-landscape-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-landscape-statement-line {
        display: none;
    }

}
/* =========================================================
   LEISTUNGEN – SHOPSYSTEME RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .services-shops-intro {
        column-gap: 70px;
    }

    .services-shops-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .services-shop-card:last-child {
        grid-column: 1 / -1;
    }
}


@media (max-width: 900px) {

    .services-shops-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-shops-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-shops-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .services-shops-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-shops-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-shops-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-shops-heading h2 br {
        display: none;
    }

    .services-shops-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-shops-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .services-shop-card,
    .services-shop-card:last-child {
        grid-column: auto;

        min-height: auto;
        padding: 26px;
    }

    .services-shop-card-top {
        margin-bottom: 38px;
    }

    .services-shop-content h3 {
        font-size: 2.1rem;
    }

    .services-shop-link {
        margin-top: 30px;
        padding-top: 0;
    }
}
/* =========================================================
   LEISTUNGEN – ERP RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-erp-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .services-erp-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-erp-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-erp-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-erp-grid {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 700px) {

    .services-erp-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-erp-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-erp-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-erp-heading h2 br {
        display: none;
    }

    .services-erp-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-erp-grid {
        gap: 16px;
    }

    .services-erp-card {
        min-height: auto;
        padding: 26px;
    }

    .services-erp-card-top {
        margin-bottom: 36px;
    }

    .services-erp-content h3 {
        font-size: 2.05rem;
    }

    .services-erp-link {
        margin-top: 30px;
        padding-top: 0;
    }
}
/* =========================================================
   LEISTUNGEN – VERTRIEB RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-sales-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .services-sales-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-sales-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-sales-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-sales-grid {
        grid-template-columns: 1fr;
    }
}


@media (max-width: 700px) {

    .services-sales-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-sales-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-sales-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-sales-heading h2 br {
        display: none;
    }

    .services-sales-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-sales-grid {
        gap: 16px;
    }

    .services-sales-panel {
        min-height: auto;
        padding: 26px;
    }

    .services-sales-panel-top {
        margin-bottom: 38px;
    }

    .services-sales-content h3 {
        font-size: 2.05rem;
    }

    .services-sales-link {
        margin-top: 30px;
        padding-top: 0;
    }

    .services-sales-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-sales-statement-line {
        display: none;
    }
}
/* =========================================================
   LEISTUNGEN – SCHNITTSTELLEN RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-integrations-intro {
        column-gap: 70px;
    }

    .services-integrations-footer {
        gap: 60px;
    }
}


@media (max-width: 900px) {

    .services-integrations-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-integrations-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-integrations-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-integrations-layout {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .services-integrations-main {
        min-height: 500px;
    }

    .services-integrations-footer {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}


@media (max-width: 700px) {

    .services-integrations-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-integrations-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-integrations-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-integrations-heading h2 br {
        display: none;
    }

    .services-integrations-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-integrations-main {
        min-height: auto;
        padding: 28px;

        border-radius: 24px;
    }

    .services-integrations-main h3 {
        font-size: clamp(2.4rem, 10vw, 3.5rem);
    }

    .services-integrations-main h3 br {
        display: none;
    }

    .services-integrations-flow {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .services-integrations-flow-arrow {
        width: 90px;
    }

    .services-integrations-example {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 14px;
    }

    .services-integrations-footer {
        padding: 28px;
    }

    .services-integrations-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-integrations-statement-line {
        display: none;
    }
}
/* =========================================================
   LEISTUNGEN – MIGRATION RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-migration-intro {
        column-gap: 70px;
    }

    .services-migration-footer {
        gap: 60px;
    }
}


@media (max-width: 900px) {

    .services-migration-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-migration-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-migration-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-migration-layout {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .services-migration-main {
        min-height: 500px;
    }

    .services-migration-footer {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}


@media (max-width: 700px) {

    .services-migration-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-migration-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-migration-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-migration-heading h2 br {
        display: none;
    }

    .services-migration-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-migration-main {
        min-height: auto;
        padding: 28px;

        border-radius: 24px;
    }

    .services-migration-main h3 {
        font-size: clamp(2.4rem, 10vw, 3.5rem);
    }

    .services-migration-main h3 br {
        display: none;
    }

    .services-migration-route {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .services-migration-route-arrow {
        width: 90px;
    }

    .services-migration-example {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 14px;
    }

    .services-migration-footer {
        padding: 28px;
    }

    .services-migration-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-migration-statement-line {
        display: none;
    }
}
/* =========================================================
   LEISTUNGEN – TECHNISCHE BASIS RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-foundation-intro {
        column-gap: 70px;
    }

    .services-foundation-note {
        gap: 60px;
    }
}


@media (max-width: 900px) {

    .services-foundation-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-foundation-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-foundation-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-foundation-grid {
        grid-template-columns: 1fr;
    }

    .services-foundation-note {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}


@media (max-width: 700px) {

    .services-foundation-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-foundation-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-foundation-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-foundation-heading h2 br {
        display: none;
    }

    .services-foundation-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-foundation-grid {
        gap: 16px;
    }

    .services-foundation-panel {
        min-height: auto;
        padding: 26px;
    }

    .services-foundation-panel-top {
        margin-bottom: 38px;
    }

    .services-foundation-content h3 {
        font-size: 2.05rem;
    }

    .services-foundation-link {
        margin-top: 30px;
        padding-top: 0;
    }

    .services-foundation-note {
        padding: 28px;
    }

    .services-foundation-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-foundation-statement-line {
        display: none;
    }
}
/* =========================================================
   LEISTUNGEN – BETREUUNG RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-support-intro {
        column-gap: 70px;
    }

    .services-support-footer {
        gap: 60px;
    }
}


@media (max-width: 900px) {

    .services-support-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-support-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-support-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-support-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .services-support-footer {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}


@media (max-width: 700px) {

    .services-support-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-support-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-support-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-support-heading h2 br {
        display: none;
    }

    .services-support-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-support-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .services-support-card {
        min-height: auto;
        padding: 26px;
    }

    .services-support-card-header {
        margin-bottom: 38px;
    }

    .services-support-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }

    .services-support-footer {
        padding: 28px;
    }

    .services-support-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-support-statement-line {
        display: none;
    }
}
/* =========================================================
   LEISTUNGEN – PROZESS RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .services-process-intro {
        column-gap: 70px;
    }

    .services-process-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 900px) {

    .services-process-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-process-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-process-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .services-process-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-process-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-process-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-process-heading h2 br {
        display: none;
    }

    .services-process-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-process-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .services-process-card {
        min-height: auto;
        padding: 26px;
    }

    .services-process-card-header {
        margin-bottom: 38px;
    }

    .services-process-card h3 {
        min-height: auto;
        font-size: 1.5rem;
    }

    .services-process-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-process-statement-line {
        display: none;
    }
}
/* =========================================================
   LEISTUNGEN – ORIENTIERUNG RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {

    .services-needs-intro {
        column-gap: 70px;
    }

    .services-needs-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .services-needs-card:last-child {
        grid-column: 1 / -1;
    }

    .services-needs-bottom {
        gap: 60px;
    }
}


@media (max-width: 900px) {

    .services-needs-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-needs-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-needs-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }

    .services-needs-bottom {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}


@media (max-width: 700px) {

    .services-needs-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-needs-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-needs-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-needs-heading h2 br {
        display: none;
    }

    .services-needs-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-needs-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .services-needs-card,
    .services-needs-card:last-child {
        grid-column: auto;

        min-height: auto;
        padding: 26px;
    }

    .services-needs-card-top {
        margin-bottom: 36px;
    }

    .services-needs-card h3 {
        font-size: 2rem;
    }

    .services-needs-path {
        margin-top: 30px;
        padding-top: 0;
    }

    .services-needs-bottom {
        padding: 28px;
    }

    .services-needs-statement {
        grid-template-columns: 1fr;

        gap: 14px;
        margin-top: 42px;
    }

    .services-needs-statement-line {
        display: none;
    }
}
/* =========================================================
   LEISTUNGEN – FAQ RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {

    .services-faq-intro {
        column-gap: 70px;
    }
}


@media (max-width: 900px) {

    .services-faq-section {
        padding: var(--section-space-tablet) 0;
    }

    .services-faq-intro {
        grid-template-columns: 1fr;
        row-gap: 30px;

        margin-bottom: 54px;
    }

    .services-faq-intro .section-intro {
        max-width: 760px;
        margin: 0;
    }
}


@media (max-width: 700px) {

    .services-faq-section {
        padding: var(--section-space-mobile) 0;
    }

    .services-faq-intro {
        row-gap: 24px;
        margin-bottom: 38px;
    }

    .services-faq-heading h2 {
        font-size: clamp(2.7rem, 12vw, 4rem);
        line-height: 1.02;
    }

    .services-faq-heading h2 br {
        display: none;
    }

    .services-faq-intro .section-intro {
        font-size: 0.98rem;
        line-height: 1.7;
    }

    .services-faq-item summary {
        grid-template-columns:
            42px
            minmax(0, 1fr)
            38px;

        gap: 12px;

        min-height: 82px;
        padding: 18px 0;
    }

    .services-faq-number {
        font-size: 0.7rem;
    }

    .services-faq-question {
        font-size: 1.1rem;
        line-height: 1.3;
    }

    .services-faq-toggle {
        width: 36px;
        height: 36px;
    }

    .services-faq-toggle i {
        width: 16px;
        height: 16px;
    }

    .services-faq-answer {
        grid-template-columns:
            42px
            minmax(0, 1fr);

        gap: 12px;

        padding: 0 0 26px;
    }

    .services-faq-answer p {
        grid-column: 2;

        font-size: 0.94rem;
        line-height: 1.7;
    }
}