/**
 * Onder Druk - Premium Print Stylesheet
 * 
 * Designed to transform the website into a high-end editorial magazine layout.
 * Optimizes typography, handles page breaks, and removes digital-only UI.
 */

@media print {
    /* 1. Reset & Global Print Setup */
    @page {
        margin: 2cm;
        size: auto;
    }

    html, body, section, main, div, article, p, blockquote {
        background: #fff !important;
        background-color: #fff !important;
        color: #261818 !important;
        font-size: 11pt !important;
        line-height: 1.6 !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    body {
        counter-reset: page;
    }

    /* 2. Hide Non-Print Elements */
    header, 
    nav, 
    footer, 
    .glass-nav,
    #video-container,
    #pip-anchor,
    #pip-drag-handle,
    .video-consent-wall,
    #cc-main,
    #cc-modal,
    .material-symbols-outlined,
    [onclick^="seekPlayer"],
    [onclick^="acceptVideoConsent"],
    .video-consent-btns,
    .platforms-section,
    .social-links,
    #back-to-top,
    button:not(.print-visible) {
        display: none !important;
        visibility: hidden !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* 3. Layout Normalization */
    main {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .max-w-screen-2xl, 
    .max-w-screen-xl, 
    .max-w-4xl, 
    .container {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    section.py-32, 
    section.py-40 {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .mb-24 {
        margin-bottom: 3rem !important;
    }

    /* 4. Hero Section Transformation (Digital to Print Header) */
    section.h-\[921px\] {
        height: auto !important;
        min-height: auto !important;
        background: transparent !important;
        margin-bottom: 2rem !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }

    section.h-\[921px\] .absolute.inset-0.z-0 {
        position: relative !important;
        height: 350px !important;
        width: 100% !important;
        overflow: hidden !important;
        margin-bottom: 2rem !important;
        border-radius: 1rem !important;
    }

    section.h-\[921px\] img {
        filter: none !important; /* Full color magazine feel */
        position: relative !important;
        height: 100% !important;
        width: 100% !important;
        object-fit: cover !important;
    }

    section.h-\[921px\] .bg-gradient-to-t {
        display: none !important;
    }

    section.h-\[921px\] .relative.z-20 {
        position: relative !important;
        padding: 0 !important;
        max-width: 100% !important;
    }

    h1 {
        font-size: 48pt !important;
        margin-bottom: 0.5rem !important;
        line-height: 1.1 !important;
        color: #261818 !important;
        font-style: italic !important;
    }

    .font-label.text-\[\#DD4250\], .text-brand-red {
        color: #DD4250 !important;
        font-size: 9pt !important;
        letter-spacing: 0.2em !important;
    }

    /* 5. Metadata (Sidebar converted to Header Bar) */
    .lg\:w-1\/4 {
        width: 100% !important;
        margin-bottom: 3rem !important;
        border-top: 1px solid #e1bebe !important;
        border-bottom: 1px solid #e1bebe !important;
        padding: 1.5rem 0 !important;
    }

    .lg\:w-1\/4 .sticky {
        position: relative !important;
        top: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 3rem !important;
        justify-content: flex-start !important;
    }

    .lg\:w-1\/4 .sticky > div {
        margin: 0 !important;
    }

    .lg\:w-1\/4 h4 {
        margin-bottom: 0.25rem !important;
    }

    /* 6. Transcript Body */
    .lg\:w-3\/4 {
        width: 100% !important;
        padding: 0 !important;
    }

    article.prose {
        max-width: 100% !important;
        color: #261818 !important;
    }

    p, li {
        color: #261818 !important;
        font-size: 11pt !important;
        text-align: justify !important;
        hyphens: auto !important;
        orphans: 3;
        widows: 3;
    }

    h3 {
        font-size: 11pt !important;
        line-height: 1.6 !important;
        margin-top: 3rem !important;
        margin-bottom: 0 !important;
        color: #261818 !important;
        font-family: 'Manrope', sans-serif !important;
        font-weight: 800 !important;
        page-break-after: avoid !important;
        break-after: avoid !important;
        border-left: none !important;
        padding-left: 0 !important;
    }

    h3.\!mt-0,
    h3.\!-mt-1\.5 {
        margin-top: 0 !important;
    }

    .columns-1, .md:columns-2 {
        column-gap: 2rem !important;
    }

    /* Drop Cap Refinement (Editorial Style) */
    .drop-cap::first-letter {
        font-family: 'Noto Serif', serif !important;
        font-size: 4.4rem !important;
        line-height: 0.9 !important;
        margin-top: -0.15rem !important; /* Pull up to align perfectly with top of text */
        margin-right: 0.6rem !important;
        padding: 0 !important;
        float: left !important;
        color: #DD4250 !important;
        font-style: normal !important;
    }

    /* 7. Pull Quotes (Magazine Style) */
    .quote-wrapper {
        margin: 3rem 0 !important;
        padding: 1.5rem 0 !important;
        border-top: 1px solid #DD4250 !important;
        border-bottom: 1px solid #DD4250 !important;
        page-break-inside: avoid !important;
    }

    .pull-quote-transcript {
        font-size: 28pt !important;
        line-height: 1.1 !important;
        color: #DD4250 !important;
        text-align: center !important;
        max-width: 80% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .pull-quote-intro {
        font-size: 28pt !important;
        line-height: 1.1 !important;
        color: #261818 !important;
        text-align: left !important;
        max-width: 100% !important;
        margin-bottom: 3rem !important;
    }

    /* 8. Links & References */
    a {
        color: #DD4250 !important;
        text-decoration: underline !important;
        font-weight: 600 !important;
    }

    /* Reference List Styling (intended for digital-to-print references) */
    .print-references {
        margin-top: 5rem !important;
        padding-top: 2rem !important;
        border-top: 1px solid #261818 !important;
        page-break-before: always !important;
    }

    .print-references h2 {
        font-family: 'Noto Serif', serif !important;
        font-style: italic !important;
        font-size: 24pt !important;
        margin-bottom: 2rem !important;
    }

    .print-references ol {
        list-style: decimal inside !important;
        column-count: 2 !important;
        gap: 2rem !important;
    }

    .print-references li {
        font-size: 9pt !important;
        margin-bottom: 0.5rem !important;
        word-break: break-all !important;
    }

    /* 9. Page Break Management */
    .mb-8 {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        margin-bottom: 1.5rem !important;
    }

    .mb-24, .mb-12 {
        page-break-inside: auto !important;
        break-inside: auto !important;
        margin-bottom: 2rem !important;
    }

    section {
        page-break-inside: auto !important;
    }

    /* 10. Multi-column preservation */
    .md\:columns-2 {
        column-count: 2 !important;
        gap: 3rem !important;
    }

    article.prose {
        margin-bottom: 1rem !important;
        page-break-after: auto !important;
    }

    .print-footer, .print-footer::after {
        display: none !important;
        content: none !important;
    }

    /* Branded Print Boxes (Start & End) */
    .print-about-box .bg-surface-container,
    .print-final-ad .bg-surface-container {
        display: block !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        max-width: 99% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        background-color: #fff !important;
        border: 1px solid #e1bebe !important;
        border-radius: 2rem !important;
        padding: 2.5rem !important;
        overflow: hidden !important;
    }

    .print-about-box {
        page-break-after: always !important;
        break-after: page !important;
        margin-bottom: 3rem !important;
    }

    .print-final-ad {
        display: inline-block !important; /* Forces the entire block to stay together */
        width: 100% !important;
        page-break-inside: avoid !important;
        break-inside: avoid !important;
        padding-top: 2rem !important;
        padding-bottom: 4rem !important;
        margin-top: 0 !important;
    }

    .print-about-markdown p,
    .print-footer-markdown p {
        font-family: 'Manrope', sans-serif !important;
        font-size: 11pt !important;
        line-height: 1.6 !important;
        color: #5a4040 !important;
        margin-bottom: 1.5rem !important;
        text-align: justify !important;
    }

    .print-about-box .bg-surface-container,
    .print-final-ad .bg-surface-container {
        background-color: #fff !important;
        border: 1px solid #e1bebe !important;
    }

    .page-break-after {
        page-break-after: always !important;
        height: 0 !important;
    }
}