/* 7. Mobile-Breakpoints
   ------------------------------------------------------------ */

@media (min-width: 721px) and (max-width: 900px) {
    .site-nav i {
        display: none;
    }
    .site-header-news .site-nav ul {
        gap: 0.2rem;
        padding: 0.28rem;
    }
    .site-nav a {
        padding: 0.4rem 0.6rem;
        font-size: 0.86rem;
    }
    .header-inner {
        gap: var(--sp-3);
    }
}

@media (max-width: 1000px) {
    .lp-pain-grid-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 860px) {
    .lp-pain-grid-3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lp-form-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--sp-5);
    }

    .lp-form-reasons {
        padding-top: 0;
    }
}

@media (max-width: 960px) {
    .post-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--sp-4);
    }
    .toc { display: none; }
}

@media (max-width: 720px) {
    :root {
        --fs-3xl: 1.85rem;
        --fs-2xl: 1.6rem;
    }
    .menu-toggle { display: inline-flex; }   /* flex, damit Icon + Label ausgerichtet sind */
    .site-nav { display: none; }
    .site-nav.is-open {
        display: block;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--bg-card);
        border-bottom: 1px solid var(--border);
        padding: var(--sp-3) var(--sp-5) var(--sp-4);
    }
    .site-nav.is-open ul {
        flex-direction: column;
        gap: var(--sp-3);
    }
    .site-header-news .site-nav ul {
        padding: 0;
        background: none;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }
    .site-footer {
        padding-top: var(--sp-5);
    }

    .footer-inner {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--sp-4) var(--sp-5);
    }
    .footer-about {
        grid-column: 1 / -1;
    }
    .footer-desc {
        display: none;
    }
    .footer-links {
        gap: var(--sp-2);
    }
    /* Unten nur noch die vier Links, mittig - Copyright-Zeile entfaellt mobil. */
    .footer-bottom {
        flex-direction: column;
        align-items: center;
        margin-top: var(--sp-5);
        gap: var(--sp-2);
    }
    .footer-copy {
        display: none;
    }
    .footer-bottom-links {
        justify-content: center;
    }
    .about-content-grid,
    .about-contact-panel,
    .contact-layout {
        grid-template-columns: 1fr;
    }
    .article-grid {
        grid-template-columns: 1fr;
    }
    main {
        padding: var(--sp-5) var(--sp-4) var(--sp-7);
    }
    .header-inner,
    .ribbon-inner {
        padding-inline: var(--sp-4);
    }
    .calendar-card {
        grid-template-columns: 70px 1fr;
        gap: var(--sp-3);
    }
    /* Icon ueber den Text: nebeneinander blieben auf 390 px nur rund 220 px Textspalte. */
    .listing-intro-panel {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--sp-3);
    }
    .calendar-detail {
        padding: var(--sp-4);
    }
    .calendar-facts {
        grid-template-columns: 1fr;
        gap: var(--sp-2);
    }
    .calendar-facts dt {
        margin-top: var(--sp-2);
    }
    .calendar-facts dt:first-child {
        margin-top: 0;
    }
    .lp-hero-title {
        font-size: 1.8rem;
    }
    .lp-pain-grid-3,
    .lp-pain-grid-4 {
        grid-template-columns: 1fr;
    }
    .lp-section {
        padding-inline: var(--sp-4);
    }
    .lp-pain-card {
        padding: var(--sp-4);
    }
    .lp-timeline {
        --timeline-size: 40px;
        --timeline-pad: var(--sp-3);
        --timeline-indent: var(--sp-3);
    }
    .lp-timeline-step {
        gap: var(--sp-3);
        padding-left: var(--timeline-pad);
    }
    .timeline-marker {
        margin-top: 0;
    }

    .lp-hero {
        padding: var(--sp-5) var(--sp-4);
    }
    .lp-hero-inner {
        display: flex;
        flex-direction: column;
    }
    .lp-hero-bullets {
        order: 1;
        margin-bottom: 0;
    }
    .lp-hero-trigger {
        order: 0;
    }
    .lp-hero-cta {
        margin-top: 0;
        margin-bottom: 0;
    }
    .lp-hero .lp-notice {
        margin-bottom: var(--sp-5);
    }
    .lp-hero-text {
        font-size: var(--fs-base);
    }

    .lp-form {
        padding: var(--sp-4);
    }
    .lp-form .btn-primary {
        width: 100%;
    }

    main.lp-page {
        padding-bottom: var(--sp-6);
    }
    .tree-paths li {
        grid-template-columns: 1fr;
        gap: var(--sp-1);
    }
    .lp-tree-outcomes dl {
        grid-template-columns: 1fr;
    }
}

/* 8. Print-Styles
   ------------------------------------------------------------ */
@media print {
    :root {
        --bg: #fff;
        --bg-card: #fff;
    }
    .site-header,
    .site-footer,
    .toc,
    .cross-reference,
    .pagination,
    .menu-toggle,
    .post-categories,
    .lp-sticky-cta {
        display: none !important;
    }
    body {
        font-size: 11pt;
        color: #000;
        background: #fff;
        line-height: 1.5;
    }
    main {
        max-width: none;
        padding: 0;
    }
    .post-layout {
        display: block;
    }
    .post {
        max-width: none;
    }
    a {
        color: #000;
        text-decoration: underline;
    }
    .post-body a[href^="http"]::after {
        content: " (" attr(href) ")";
        font-size: 9pt;
        color: #555;
    }
    .post-title {
        font-size: 22pt;
    }
    .post-body h2 {
        font-size: 14pt;
        page-break-after: avoid;
    }
    .post-body h3 {
        font-size: 12pt;
        page-break-after: avoid;
    }
    .tldr {
        border: 1px solid #888;
        background: #f5f5f5;
        page-break-inside: avoid;
    }
    .author-block {
        page-break-inside: avoid;
    }
}
