/* --- OPOWIEŚCI CHRUMCIA - MOBILE --- */
/* Tylko wygląd mobilny. Bez zmian logiki formularza, odcinków i wysyłki. */

@media (max-width: 900px) {
    .chrumcio-hero {
        width: calc(100% - 24px) !important;
        min-height: 0 !important;
        margin: 0 auto 10px !important;
        padding: 30px 0 22px !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        text-align: center !important;
    }

    .chrumcio-hero::before {
        inset: 10px -8px 14px -8px !important;
        border-radius: 0 0 34px 34px !important;
    }

    .chrumcio-hero-character,
    .chrumcio-hero-logo {
        justify-content: center !important;
    }

    .chrumcio-hero-character img {
        width: min(170px, 44vw) !important;
    }

    .chrumcio-hero-logo img {
        width: min(230px, 58vw) !important;
    }

    .chrumcio-hero-text {
        max-width: 620px !important;
        margin: 4px auto 0 !important;
        padding: 26px 22px !important;
        border-radius: 28px !important;
        text-align: center !important;
    }

    .chrumcio-hero-text h1 {
        font-size: clamp(31px, 8.6vw, 44px) !important;
        line-height: 1.08 !important;
    }

    .chrumcio-hero-text p {
        font-size: clamp(16px, 4.1vw, 18px) !important;
        line-height: 1.5 !important;
    }

    .ask-chrumcio-wrap {
        width: calc(100% - 24px) !important;
        max-width: 720px !important;
        margin: 22px auto 0 !important;
        padding: 0 !important;
    }

    .ask-chrumcio-btn {
        width: min(100%, 360px) !important;
        min-height: 54px !important;
        padding: 15px 20px !important;
        font-size: 15px !important;
        letter-spacing: .3px !important;
    }

    .ask-chrumcio-subtext {
        max-width: 100% !important;
        padding: 14px 14px !important;
        font-size: 15px !important;
        line-height: 1.55 !important;
    }

    .chrumcio-section {
        width: calc(100% - 24px) !important;
        max-width: 760px !important;
        padding: 28px 0 52px !important;
    }

    .chrumcio-card {
        max-width: 100% !important;
        padding: 30px 20px !important;
        border-radius: 28px !important;
    }

    .chrumcio-card h1 {
        font-size: clamp(28px, 7.5vw, 36px) !important;
    }

    .chrumcio-card h2 {
        margin-bottom: 20px !important;
        font-size: clamp(19px, 5vw, 23px) !important;
        line-height: 1.25 !important;
    }

    .chrumcio-card p {
        font-size: 16px !important;
        line-height: 1.62 !important;
        text-align: left !important;
    }

    .chrumcio-subscribe-box {
        margin: 24px 0 8px !important;
        padding: 18px 14px !important;
        font-size: 16px !important;
        line-height: 1.55 !important;
    }

    .chrumcio-subscribe-box a {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 14px 18px !important;
        font-size: 15px !important;
        line-height: 1.25 !important;
    }

    .chrumcio-videos-grid {
        margin-top: 28px !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    .chrumcio-video-card {
        border-radius: 18px !important;
    }

    .chrumcio-video-title {
        opacity: 1 !important;
        transform: none !important;
        padding: 30px 10px 12px !important;
        font-size: 13px !important;
        line-height: 1.2 !important;
    }

    #askChrumcioModal {
        padding: 14px !important;
        align-items: center !important;
    }

    .ask-chrumcio-panel {
        max-width: 620px !important;
        max-height: calc(100vh - 28px) !important;
        overflow-y: auto !important;
        border-radius: 24px !important;
    }

    .ask-chrumcio-head {
        padding: 18px 56px 16px 18px !important;
    }

    .ask-chrumcio-head h3 {
        font-size: 20px !important;
        line-height: 1.25 !important;
    }

    .ask-chrumcio-body {
        padding: 16px 18px 20px !important;
    }

    .ask-row {
        grid-template-columns: 1fr !important;
        gap: 0 !important;
    }

    .ask-actions {
        flex-direction: column-reverse !important;
    }

    .ask-send,
    .ask-cancel {
        width: 100% !important;
        min-height: 48px !important;
    }

    #ytModal {
        padding: 20px 12px 88px !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
    }

    #ytModal .yt-modal-inner {
        width: 94vw !important;
        max-width: 94vw !important;
        position: static !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-end !important;
        gap: 18px !important;
    }

    #ytIframe {
        width: 94vw !important;
        height: calc(94vw * .5625) !important;
        max-height: calc(100vh - 150px) !important;
        border-radius: 18px !important;
    }

    .yt-modal-close {
        position: static !important;
        width: auto !important;
        min-width: 48px !important;
        height: 48px !important;
        padding: 0 16px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        border: 1px solid rgba(255,255,255,.78) !important;
        border-radius: 999px !important;
        background: rgba(255,255,255,.94) !important;
        color: #06305f !important;
        font-family: 'Nunito', sans-serif !important;
        font-size: 14px !important;
        line-height: 1 !important;
        font-weight: 900 !important;
        box-shadow: 0 16px 40px rgba(0,0,0,.28) !important;
    }
}

@media (max-width: 560px) {
    .chrumcio-hero {
        width: calc(100% - 20px) !important;
        padding: 24px 0 18px !important;
    }

    .chrumcio-hero-character img {
        width: min(145px, 42vw) !important;
    }

    .chrumcio-hero-logo img {
        width: min(205px, 60vw) !important;
    }

    .chrumcio-hero-text {
        padding: 24px 18px !important;
    }

    .ask-chrumcio-wrap,
    .chrumcio-section {
        width: calc(100% - 20px) !important;
    }

    .chrumcio-card {
        padding: 28px 16px !important;
    }

    .chrumcio-videos-grid {
        grid-template-columns: 1fr !important;
        gap: 14px !important;
    }

    .chrumcio-video-title {
        font-size: 13px !important;
    }

    .ask-chrumcio-panel {
        border-radius: 22px !important;
    }
}

@media (max-width: 380px) {
    .chrumcio-hero-text h1 {
        font-size: 29px !important;
    }

    .chrumcio-card h1 {
        font-size: 27px !important;
    }

    .chrumcio-video-title {
        font-size: 12px !important;
    }
}