/** assets.mobile.05316f6d.css generated 2026-10-02 06:16:19.000000 **/


/*#region styles_mobile.css*/

/* =========================================================================
   Dürrschmidt GmbH – Responsive (Vorlagen liegen nur für 1920px vor,
   Breakpoints laut docs/RELAUNCH-PLAN.md Abschnitt 3.4)
   Eingebunden ab max-width 1439px
   ========================================================================= */

/* --- Tablet-Landscape / kleine Desktops ------------------------------ */
@media only screen and (max-width: 1439px) {
    :root {
        --container: calc(100% - 64px);
        --fs-h1: 56px;
        --lh-h1: 68px;
        --fs-h2: 32px;
        --lh-h2: 36px;
        --hero-home: 39.6vw;
        --hero-sub: 26.25vw;
        --section-pad: 88px;
        --section-pad-inner: 80px;
    }
    header .headContainer { max-width: calc(100% - 64px); }
    /* Navigation rechtsbuendig: Trennerabstand 70px und Box 300px, damit die mittige Flyout-Box weder Logo noch
       Nachbarpunkte ueberdeckt */
    nav#Navigation { --nav-gap: 70px; --nav-box: 300px; left: auto; right: 0; transform: none; }
    .instaglider .glide__arrow--left { left: 8px; }
    .instaglider .glide__arrow--right { right: 8px; }

    #Glider .glide__arrow--left { left: 16px; }
    #Glider .glide__arrow--right { right: 16px; }

    .short-article .article-inner { grid-template-columns: 1fr 1fr; column-gap: 48px; }
    .short-article.picture_left .article-inner { grid-template-columns: 1fr 1fr; }
    .short-slider { width: auto; margin: 0 56px; }
    .slider-arrow.prev { left: -56px; }
    .slider-arrow.next { right: -56px; }

    .teaser-overlay-box { flex-basis: 460px; padding: 40px 48px; }
    .teaser-overlay-box .teaser-topline { margin-bottom: 12px; }
    .teaser-overlay-box .Titel, .teaser-overlay-box h2 { margin-bottom: 16px; }
    .teaser-overlay-box .teaser-text { margin-bottom: 24px; }

    .iconband-inner { max-width: var(--container); }

    footer .footer-inner { max-width: var(--container); left: 0; grid-template-columns: 1.6fr 1fr 1fr 0.8fr; column-gap: 32px; }
}

/* --- Tablet ------------------------------------------------------------ */
@media only screen and (max-width: 1100px) {
    :root {
        --fs-nav: 18px;
        --hero-home: 52vw;
        --hero-sub: 34vw;
    }
    nav#Navigation { --nav-gap: 48px; --nav-box: 220px; }
    nav#Navigation ul.sub { padding-left: 16px; padding-right: 16px; }
    .social-section { padding: 80px 0 88px 0; }
    .boxgrid, .productgrid, .shop-grid { column-gap: 12px; }
    .shop-grid { column-gap: 24px; }
    .kpi-band { padding: 80px 0 64px 0; }
    .kpi-band .kpi-value { font-size: 40px; }
    .kpi-band .kpi-name { font-size: 20px; letter-spacing: .1em; }
    .iconband-circle { width: 128px; height: 128px; background-size: 52px 52px; }
    .iconband-label { font-size: 20px; }
    .form-box { padding: 40px 40px 80px 40px; }
    .Basket-Product { padding: 32px; }
    .Basket-Remove { right: 32px; }
}

/* --- Mobile Navigation + 2-spaltige Raster ---------------------------- */
@media only screen and (max-width: 900px) {
    :root {
        --container: calc(100% - 32px);
        --header-height: 72px;
        --fs-h1: 40px;
        --lh-h1: 48px;
        --fs-h2: 28px;
        --lh-h2: 32px;
        --fs-label: 18px;
        --fs-body: 16px;
        --lh-body: 24px;
        --fs-card-title: 20px;
        --lh-card-title: 26px;
        --hero-home: 100vw;
        --hero-sub: 56vw;
        --section-pad: 64px;
        --section-pad-inner: 56px;
    }
    header .headContainer { max-width: calc(100% - 32px); }
    header .logo { left: 0; top: 0; width: auto; height: var(--header-height); padding: 8px 12px; }
    header .logo img { width: 168px; }
    #NavigationToggle { display: block; }

    nav#Navigation {
        position: fixed;
        left: 0; right: 0;
        top: var(--header-height);
        transform: none;
        height: auto;
        max-height: 0;
        overflow: hidden;
        background: var(--col-white);
        transition: max-height .35s ease;
        box-shadow: 0 8px 16px rgba(0, 0, 0, .08);
    }
    nav#Navigation.open { max-height: calc(100vh - var(--header-height)); overflow-y: auto; }
    nav#Navigation > ul { display: block; height: auto; padding: 8px 16px 16px 16px; }
    nav#Navigation > ul > li { display: block; height: auto; border-bottom: 1px solid var(--col-bg-grey); }
    nav#Navigation > ul > li + li { margin-left: 0; }
    nav#Navigation > ul > li + li:before { display: none; }
    nav#Navigation > ul > li > a { line-height: 52px; }
    nav#Navigation > ul > li.open > a { color: var(--col-blue); }
    nav#Navigation ul.sub, nav#Navigation > ul > li.open > ul.sub { position: static; display: block; width: auto; margin: 0; padding: 0 0 12px 16px; background: transparent; }
    nav#Navigation ul.sub a { color: var(--col-text); }
    nav#Navigation ul.sub a:before { background-image: url("https://www.duerrschmidt-gmbh.de/./images/layout/icons/arrow_right.svg"); }
    nav#Navigation ul.Mobile { display: block; margin: 0; padding: 0 16px 24px 16px; list-style: none; }
    nav#Navigation ul.Mobile li a { display: block; line-height: 44px; font-weight: 600; }

    /* Kontakt statt seitlicher Flyouts: Icons im Header + Kontaktblock im Menue (initMobileContact in fx.js) */
    nav#NavigationSide { display: none; }
    header .header-contact { display: flex; position: absolute; right: 64px; top: 50%; transform: translateY(-50%); gap: 8px; z-index: 5; }
    header .header-contact a { display: block; width: 40px; height: 40px; border: 1px solid var(--col-blue); border-radius: 50%; background: no-repeat center / 18px 18px; transition: background-color .2s ease; }
    header .header-contact a:active { background-color: var(--col-bg-light); }
    nav#Navigation .nav-contact { display: block; margin: 0 16px; padding: 20px 0 28px 0; border-top: 1px solid var(--col-bg-grey); list-style: none; }
    nav#Navigation .nav-contact li + li { margin-top: 12px; }
    nav#Navigation .nav-contact a { display: flex; align-items: center; gap: 14px; font-size: 16px; line-height: 22px; font-weight: 600; color: var(--col-text); }
    nav#Navigation .nav-contact .nav-contact-icon { flex: 0 0 40px; height: 40px; border-radius: 50%; background: var(--col-blue) no-repeat center / 18px 18px; }
    #PageTop { right: 16px; bottom: 16px; }

    /* News-Slider als Karte: Bild oben, Text darunter, Steuerleiste mit Pfeilen und Punkten */
    .news-slider-section { padding: 56px 0; }
    .news-slider-section .short-slider { padding-bottom: 64px; }
    .news-slider-section .glide__slide { display: flex; }
    .news-slider-section .short-article { display: flex; width: 100%; }
    .news-slider-section .short-article .article-inner { display: flex; flex-direction: column; width: 100%; row-gap: 0; }
    .news-slider-section .short-article .image-wrapper { order: -1; aspect-ratio: 16 / 10; }
    .news-slider-section .short-article .text-wrapper { display: flex; flex-direction: column; flex: 1 1 auto; padding: 24px 24px 28px 24px; background: var(--col-bg-light); }
    .news-slider-section .short-article .text-wrapper .section-label { margin: 0 0 10px 0; font-size: 15px; line-height: 20px; color: var(--col-blue); }
    .news-slider-section .short-article .text-wrapper .Titel { margin: 0 0 12px 0; font-size: 22px; line-height: 27px; }
    .news-slider-section .short-article .text-wrapper .intro-text { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; margin: 0 0 24px 0; }
    .news-slider-section .short-article .button-container { margin-top: auto; }
    .news-slider-section .slider-arrow { bottom: 0; width: 44px; height: 44px; border: 1px solid var(--col-blue); border-radius: 50%; background-size: 20px auto; }
    .news-slider-section .glide__bullets { display: flex; position: absolute; left: 60px; right: 60px; bottom: 0; height: 44px; justify-content: center; align-items: center; gap: 10px; }
    .news-slider-section .glide__bullet { width: 10px; height: 10px; padding: 0; border: 1px solid var(--col-blue); border-radius: 50%; background: transparent; cursor: pointer; transition: background-color .2s ease, width .2s ease; }
    .news-slider-section .news-all { margin-top: 32px; }
    .news-slider-section .news-all .Button { width: 100%; min-width: 0; }
    .news-slider-section .glide__bullet--active { width: 24px; border-radius: 5px; background: var(--col-blue); }

    /* Hero waechst mit dem Text (feste Hoehe schnitt Titel und Button ab) */
    #Glider, body.home #Glider, #Glider .glide__track, #Glider .glide__slides { height: auto; }
    #Glider .glide__slide { height: auto; min-height: var(--hero-sub); display: flex; align-items: center; justify-content: center; }
    body.home #Glider .glide__slide { min-height: var(--hero-home); }
    #Glider .glide__content, #Glider .glide__content.left, #Glider .glide__content.right { position: relative; left: auto; right: auto; top: auto; transform: none; margin: 0 auto; }
    #Glider .glider__title, #Glider .glider__title h1, #Glider .glider__title h2 { overflow-wrap: break-word; hyphens: auto; }

    #Glider .glide__content { max-width: 100%; padding: 48px 56px; }
    #Glider .glider__topline { font-size: 18px; line-height: 24px; margin-bottom: 12px; }
    #Glider .glider__subtitle, #Glider .glider__text { font-size: 16px; line-height: 24px; }
    #Glider .glide__arrow { width: 24px; background-size: 24px auto; }

    .boxgrid, .productgrid, .shop-grid { grid-template-columns: repeat(2, 1fr); row-gap: 32px; }
    .product-card { min-height: 0; }
    .product-card .product-card-body { padding: 24px; }

    .kpi-band .kpi-grid { flex-wrap: wrap; gap: 32px; justify-content: center; }
    .kpi-band .kpi, .kpi-band .kpi:nth-child(2), .kpi-band .kpi:nth-child(3) { flex: 1 1 40%; text-align: center; }

    .short-section { padding: 64px 0; }
    .short-article .article-inner, .short-article.picture_left .article-inner { grid-template-columns: 1fr; row-gap: 32px; }
    .short-article.picture_left .image-wrapper { order: 0; }
    .slider-arrow { top: auto; bottom: -56px; margin: 0; }
    .short-slider { margin: 0; }
    .slider-arrow.prev { left: 0; }
    .slider-arrow.next { right: 0; }
    .short-slider { padding-bottom: 64px; }

    /* mobil: Bild oben (immer 16:9, ohne Parallax), blaue Box mit Text darunter */
    .teaser-outer { display: block; aspect-ratio: auto; padding: 0; }
    .teaser-outer .teaser-bg { position: relative; inset: auto; aspect-ratio: 16 / 9; transform: none !important; will-change: auto; }
    .teaser-overlay-box { width: 100%; padding: 40px 24px 48px 24px; }

    .iconband { padding: 64px 0; }
    .iconband-inner { flex-wrap: wrap; row-gap: 40px; }
    .iconband-item { flex: 1 1 33%; }

    .intro-section { padding: 80px 0 64px 0; }
    .team-grid { grid-template-columns: 1fr; }

    .shop-head { text-align: left; padding-right: 80px; }
    .shop-head.no-heading { padding-right: 0; }
    .shop-head .section-heading { text-align: left; }
    .shop-cart-btn { width: 52px; height: 52px; background-size: 26px; }
    .shop-group + .shop-group { margin-top: 32px; }
    .shop-group.accordeon_box h2.toggle { padding: 22px 48px 22px 0; }
    .shop-group.accordeon_box .toggle-content, .shop-group-open { padding-bottom: 40px; }
    .shop-detail-inner.Product { grid-template-columns: 1fr; gap: 24px; padding: 48px 24px 24px 24px; }
    .shop-detail .Button { width: 100%; }

    .Basket-Product { grid-template-columns: 72px 1fr; row-gap: 24px; margin-bottom: 16px; }
    .Basket-Image { width: 72px; height: 72px; }
    .Basket-Details { padding-top: 0; }
    .Basket-Remove { position: static; }
    .Basket-Actions { grid-column: 1 / -1; display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 16px; padding-top: 0; }
    .Basket-Formular-Wrapper { margin-top: 64px; }

    .form-box { padding: 24px 24px 56px 24px; }
    form.formular .form-fields { grid-template-columns: 1fr; }
    form.formular .form-submit { margin-top: 40px; }

    .detail-head { grid-template-columns: 1fr; gap: 24px; }
    .detail-block { margin-bottom: 48px; }
    .detail-gallery { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .detail-videos { grid-template-columns: 1fr; }
    .detail-accordion .toggle-content { padding-right: 0; }
    .detail-accordion .detail-columns { grid-template-columns: 1fr; gap: 24px; }
    .detail-downloads { grid-template-columns: 1fr; gap: 12px; }
    .detail-table thead th, .detail-table tbody th, .detail-table tbody td { padding: 10px 14px; }
    .detail-more .more-toggle { min-width: 0; width: 100%; }
    .fancybox_fullcontainer { max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px); }
    .fancybox_fullcontainer > .fancybox_inner { padding: 64px 24px 24px 24px; }
    .fancybox_fullcontainer .news-detail-section .news-detail .news-detail-body { padding: 32px 24px 32px 24px; }
    .news-detail-footer { margin-top: 32px; padding-top: 24px; }
    .fancybox-slide--html { padding: 16px 12px; }
    .fancybox-slide--html .fancybox-close-small { top: 10px; right: 10px; width: 40px; height: 40px; }
    .fancybox_fullcontainer.social-terms > .fancybox_inner { padding: 56px 24px 24px 24px; }
    .social-terms-actions .Button { flex: 1 1 100%; }
    .fancybox-slide--image { padding: 72px 12px; }
    .fancybox-toolbar { top: 12px; right: 12px; }
    .fancybox-toolbar .fancybox-button { width: 40px; height: 40px; padding: 10px; }
    .fancybox-infobar { top: 16px; left: 12px; }
    .fancybox-navigation .fancybox-button { width: 44px; height: 44px; top: calc(50% - 22px); }
    .fancybox-navigation .fancybox-button div { padding: 12px; }
    .fancybox-navigation .fancybox-button--arrow_left { left: 8px; }
    .fancybox-navigation .fancybox-button--arrow_right { right: 8px; }

    footer { padding: 56px 0; }
    footer .footer-inner { grid-template-columns: 1fr 1fr; row-gap: 32px; }
    footer .footer-logo { margin-left: 0; }
    .social-section { padding: 56px 0 64px 0; }
    footer .footer-col-brand { grid-column: 1 / -1; }
}

/* --- Smartphone -------------------------------------------------------- */
@media only screen and (max-width: 600px) {
    :root {
        --fs-h1: 32px;
        --lh-h1: 38px;
        --fs-h2: 24px;
        --lh-h2: 28px;
        --fs-kpi: 36px;
    }
    .boxgrid, .productgrid, .shop-grid { grid-template-columns: 1fr; }
    .shop-card h2, .shop-card .Product-Title { min-height: 0; }
    .kpi-band .kpi, .kpi-band .kpi:nth-child(2), .kpi-band .kpi:nth-child(3) { flex: 1 1 100%; }
    .iconband-item { flex: 1 1 100%; }
    .team-card { flex-direction: column; }
    .team-card-image { width: 100%; height: auto; aspect-ratio: 1 / 1; flex-basis: auto; }
    .Basket-Product { grid-template-columns: 1fr; }
    .Basket-Image { width: 92px; height: 92px; }
    .Basket-Actions { flex-direction: column; align-items: flex-start; }
    footer .footer-inner { grid-template-columns: 1fr; }
    #Glider .glide__content { padding: 40px 44px; }
    #BasketInfo { left: 16px; right: 16px; width: auto; }
    .detail-table thead th, .detail-table tbody th, .detail-table tbody td { padding: 10px 8px; }
    .detail-table thead th { white-space: normal; }
}

/* --- Kleine Smartphones: im Header nur das Telefon-Icon ------------------- */
@media only screen and (max-width: 374px) {
    header .header-contact a:nth-child(n+2) { display: none; }
}


/*#endregion styles_mobile.css*/