@media print {
    /* hide elements */
    .hero {
        height: 50vh !important;
        &:before,
        &:after {
            background: none !important;
        }
    }

    .content-block + .content-block {
        margin-top: 3rem;
    }

    .ratio:before {
        background: unset;
    }

    /* page breaks */
    h1,
    h2,
    h3,
    h4{
        page-break-after: avoid;
    }

    tr,
    img,
    .teaser,
    footer {
        page-break-inside: avoid;
    }

    /* reset bootstrap default stuff */
    a[href]:after,
    abbr[title]:after,
    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }


    /* reset mobile grid */
    .col-md-12 {
        width: 100%;
    }
    .col-md-11 {
        width: 91.66666667%;
    }
    .col-md-10 {
        width: 83.33333333%;
    }
    .col-md-9 {
        width: 75%;
    }
    .col-md-8 {
        width: 66.66666667%;
    }
    .col-md-7 {
        width: 58.33333333%;
    }
    .col-md-6 {
        width: 50%;
    }
    .col-md-5 {
        width: 41.66666667%;
    }
    .col-md-4 {
        width: 33.33333333%;
    }
    .col-md-3 {
        width: 25%;
    }
    .col-md-2 {
        width: 16.66666667%;
    }
    .col-md-1 {
        width: 8.33333333%;
    }

    .content-visibility--auto {
        content-visibility: visible !important;
    }

    .control-center__toast-container,
    #control-center-nav,
    #ccm-special-settings-summoner{
        display: none!important;
    }
    .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm{
        padding-left: 15px;
        padding-right: 15px;
        margin-right: 15px;
        margin-left: 15px;
        max-width: 100%;
    }
    .teaser-slider-area{
        page-break-before: always;
        page-break-inside: avoid;
    }
    .weather-area{
        page-break-inside: avoid;
    }
    #map{
        page-break-before: always;
        page-break-inside: avoid;
    }

    /* === HEADER: position:fixed → static, sonst überlagert er den Seiteninhalt und die Tour-Überschrift verschwindet === */
    .header {
        position: static !important;
        transform: none !important;
        background: transparent !important;
        box-shadow: none !important;
        min-height: auto !important;
        display: flex !important;
    }
    .header::before {
        display: none !important;
    }
    .header__cta {
        display: none !important;
    }

    /* === TITLE BLOCKS: explizite Farbe statt CSS-Variable, die im Druck ggf. nicht auflöst === */
    .title-block,
    .title-block__title,
    .title-block__sub-title,
    .title-block__top-title {
        color: #1a1a1a !important;
    }

    /* === SECTION ABSTÄNDE: Wettervorhersage + Touren in der Umgebung === */
    .weather-area.content-block,
    .tour-slider-area.content-block {
        margin-top: 3rem !important;
        padding-top: 0.5rem;
    }

    /* === BESTE JAHRESZEITEN: aktive Monate klar hervorheben === */
    .tour-details__month {
        color: #888 !important;
    }
    .tour-details__month.active {
        background-color: #61756d !important;
        color: #fff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
    }

    /* === KARTE: interaktiven Kartenbereich verstecken, Print-Komponente einblenden === */
    .tour-details__map-interactive,
    .tour-details__map iframe,
    .tour-details__map-legend,
    #controlCenter,
    .contwise-maps,
    .alert{
        display: none !important;
    }
    #resource-print-view {
        width: 100% !important;
    }
    body {
        background-color: #fff!important;
    }

    /* === FOOTER: Riesige Abstände reduzieren, auf neuer Seite beginnen === */
    footer.footer {
        padding: 1.5rem 0 1rem !important;
        page-break-before: always;
    }

    .footer__claim.ratio::before {
        padding-top: 0 !important;
    }
    .footer__claim.ratio {
        height: 60px !important;
        max-height: 60px !important;
    }
    .footer__claim-image {
        margin-top: 20px;
        height: 60px !important;
        object-fit: contain;
        object-position: left center;
    }
}