/**
 * RPNL CSS MODULE: APPLICATION
 *
 * Dedykowana strona aplikacji RadioPolskaNL.
 *
 * Źródło: main.css z motywu RPNL v1.5.5.
 * Moduł nie jest jeszcze ładowany przez functions.php.
 */

/* =========================================================
   RadioPolskaNL App Landing
   Scope: .rpnl-app-page
   ========================================================= */

.rpnl-app-page {
    --rpnl-navy: #0B2D4D;
    --rpnl-red: #E30613;
    --rpnl-blue: #1677FF;
    --rpnl-bg: #f5f8fc;
    --rpnl-white: #ffffff;
    --rpnl-text: #162638;
    --rpnl-muted: #5f6f7f;
    --rpnl-border: rgba(11, 45, 77, .12);
    --rpnl-shadow: 0 18px 48px rgba(11, 45, 77, .10);
    --rpnl-radius: 24px;

    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: var(--rpnl-bg);
    color: var(--rpnl-text);
}

.rpnl-app-page *,
.rpnl-app-page *::before,
.rpnl-app-page *::after {
    box-sizing: border-box;
}

.rpnl-app-entry,
.rpnl-app-content {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

.rpnl-app-page .wp-block-group,
.rpnl-app-page .wp-block-columns {
    box-sizing: border-box;
}

.rpnl-app-page h1,
.rpnl-app-page h2,
.rpnl-app-page h3,
.rpnl-app-page p {
    text-wrap: pretty;
}

.rpnl-app-page h1,
.rpnl-app-page h2,
.rpnl-app-page h3 {
    color: var(--rpnl-navy);
}

.rpnl-app-page h1 {
    font-size: clamp(2.55rem, 6vw, 5.5rem);
    line-height: .98;
    letter-spacing: -.055em;
    font-weight: 900;
    max-width: 980px;
    margin-top: 0;
    margin-bottom: 28px;
}

.rpnl-app-page h2 {
    font-size: clamp(2rem, 4vw, 3.6rem);
    line-height: 1.05;
    letter-spacing: -.04em;
    font-weight: 850;
}

.rpnl-app-page h3 {
    font-size: clamp(1.2rem, 2vw, 1.55rem);
    line-height: 1.2;
    font-weight: 800;
}

/* ---------- HERO ---------- */

.rpnl-app-hero {
    position: relative;
    isolation: isolate;
    width: 100%;
    max-width: none !important;
    min-height: 650px;
    padding: clamp(76px, 9vw, 128px) 24px clamp(70px, 8vw, 110px);
    overflow: hidden;
    background:
        radial-gradient(
            circle at 88% 18%,
            rgba(22, 119, 255, .20),
            transparent 30%
        ),
        radial-gradient(
            circle at 12% 80%,
            rgba(227, 6, 19, .11),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f4f8fd 52%,
            #edf4fc 100%
        );
}

.rpnl-app-hero::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -170px;
    bottom: -190px;
    border-radius: 50%;
    border: 70px solid rgba(11, 45, 77, .035);
    z-index: -1;
}

.rpnl-app-hero > * {
    width: min(1180px, 100%);
    margin-left: auto;
    margin-right: auto;
}

.rpnl-app-kicker {
    display: inline-flex;
    width: auto !important;
    padding: 9px 14px;
    border: 1px solid rgba(22, 119, 255, .20);
    border-radius: 999px;
    background: rgba(22, 119, 255, .08);
    color: var(--rpnl-blue);
    font-size: .82rem;
    font-weight: 850;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.rpnl-app-hero-lead {
    max-width: 800px !important;
    margin-left: 0 !important;
    font-size: clamp(1.08rem, 2vw, 1.35rem);
    line-height: 1.65;
    color: #40566b;
}

.rpnl-app-launch {
    margin-top: 28px !important;
    margin-left: 0 !important;
    color: var(--rpnl-red);
    font-size: clamp(1rem, 1.7vw, 1.2rem);
    font-weight: 850;
}

.rpnl-app-hero .wp-block-buttons {
    width: min(1180px, 100%);
    margin: 34px auto 0;
    gap: 12px;
}

.rpnl-app-page .wp-block-button__link {
    padding: 15px 22px;
    border-radius: 12px;
    font-weight: 800;
    text-decoration: none;
    transition:
        transform .18s ease,
        box-shadow .18s ease,
        opacity .18s ease;
}

.rpnl-app-page .wp-block-button__link:hover {
    transform: translateY(-2px);
}

.rpnl-app-page .rpnl-app-button-primary .wp-block-button__link {
    background: var(--rpnl-navy);
    color: #fff;
    box-shadow: 0 12px 30px rgba(11, 45, 77, .18);
}

.rpnl-app-page .rpnl-app-button-secondary .wp-block-button__link {
    background: #fff;
    color: var(--rpnl-navy);
    border: 1px solid var(--rpnl-border);
}

.rpnl-app-trustline {
    width: min(1180px, 100%);
    margin: 26px auto 0 !important;
    color: var(--rpnl-muted);
    font-weight: 700;
}

/* ---------- 100% FREE ---------- */

.rpnl-app-free-banner {
    width: 100%;
    max-width: none !important;
    padding: clamp(46px, 6vw, 72px) 24px;
    background: var(--rpnl-navy);
    text-align: center;
}

.rpnl-app-free-banner > * {
    width: min(1100px, 100%);
    margin-left: auto;
    margin-right: auto;
}

.rpnl-app-free-title {
    margin: 0 !important;
    color: #fff !important;
    font-size: clamp(2.7rem, 7vw, 6.1rem) !important;
    line-height: .95 !important;
    letter-spacing: -.055em !important;
    font-weight: 950 !important;
    text-shadow: 0 10px 35px rgba(0, 0, 0, .18);
}

.rpnl-app-free-line {
    margin: 22px auto 0 !important;
    color: rgba(255, 255, 255, .92);
    font-size: clamp(1rem, 2vw, 1.25rem);
    font-weight: 750;
}

/* ---------- STANDARD SECTIONS ---------- */

.rpnl-app-section {
    width: 100%;
    max-width: none !important;
    padding: clamp(72px, 9vw, 118px) 24px;
}

.rpnl-app-section > * {
    width: min(1180px, 100%);
    margin-left: auto;
    margin-right: auto;
}

.rpnl-app-section-heading {
    max-width: 820px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center;
}

.rpnl-app-section-intro {
    max-width: 780px !important;
    margin: 18px auto 48px !important;
    text-align: center;
    color: var(--rpnl-muted);
    font-size: 1.08rem;
    line-height: 1.7;
}

/* ---------- FEATURE CARDS ---------- */

.rpnl-app-feature-row {
    gap: 22px;
    align-items: stretch !important;
}

.rpnl-app-feature-row + .rpnl-app-feature-row {
    margin-top: 22px;
}

.rpnl-app-feature-card {
    height: 100%;
    padding: 28px;
    border: 1px solid var(--rpnl-border);
    border-radius: var(--rpnl-radius);
    background: #fff;
    box-shadow: 0 8px 28px rgba(11, 45, 77, .055);
}

.rpnl-app-feature-card h3 {
    margin-top: 0;
    margin-bottom: 12px;
}

.rpnl-app-feature-card p {
    margin-bottom: 0;
    color: var(--rpnl-muted);
    line-height: 1.65;
}

.rpnl-app-feature-label {
    display: inline-block;
    margin-bottom: 18px !important;
    padding: 7px 10px;
    border-radius: 9px;
    background: rgba(22, 119, 255, .09);
    color: var(--rpnl-blue) !important;
    font-size: .8rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: .05em;
}

/* ---------- SPLIT SECTIONS ---------- */

.rpnl-app-split {
    align-items: center !important;
    gap: clamp(34px, 6vw, 80px);
}

.rpnl-app-split-copy {
    padding: 6px 0;
}

.rpnl-app-split-copy h2 {
    margin-top: 0;
}

.rpnl-app-split-copy p,
.rpnl-app-split-copy li {
    color: var(--rpnl-muted);
    font-size: 1.05rem;
    line-height: 1.72;
}

.rpnl-app-visual-card {
    min-height: 360px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(34px, 5vw, 60px);
    border-radius: 30px;
    background:
        linear-gradient(
            145deg,
            var(--rpnl-navy),
            #123e65
        );
    color: #fff;
    box-shadow: var(--rpnl-shadow);
}

.rpnl-app-visual-card h3,
.rpnl-app-visual-card p {
    color: #fff;
}

.rpnl-app-visual-big {
    margin: 0 0 15px !important;
    color: #fff !important;
    font-size: clamp(3rem, 8vw, 6rem);
    font-weight: 950;
    line-height: .9;
    letter-spacing: -.05em;
}

.rpnl-app-visual-muted {
    color: rgba(255, 255, 255, .78) !important;
}

/* ---------- ALTERNATE BACKGROUND ---------- */

.rpnl-app-section-alt {
    background: #fff;
}

.rpnl-app-section-dark {
    background:
        linear-gradient(
            145deg,
            #08253f,
            var(--rpnl-navy)
        );
    color: #fff;
}

.rpnl-app-section-dark h2,
.rpnl-app-section-dark h3,
.rpnl-app-section-dark p,
.rpnl-app-section-dark li {
    color: #fff;
}

.rpnl-app-section-dark .rpnl-app-section-intro {
    color: rgba(255, 255, 255, .76);
}

/* ---------- PRIVACY / FREE PROOF ---------- */

.rpnl-app-check-list {
    padding-left: 0;
    list-style: none;
}

.rpnl-app-check-list li {
    position: relative;
    padding-left: 30px;
    margin: 12px 0;
}

.rpnl-app-check-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--rpnl-blue);
    font-weight: 950;
}

.rpnl-app-section-dark .rpnl-app-check-list li::before {
    color: #75b4ff;
}

/* ---------- STORE / LAUNCH ---------- */

.rpnl-app-store-section {
    text-align: center;
}

.rpnl-app-store-section .wp-block-buttons {
    justify-content: center;
    margin-top: 34px;
}

.rpnl-app-store-note {
    max-width: 720px !important;
    margin: 22px auto 0 !important;
    color: var(--rpnl-muted);
}

/* ---------- FAQ ---------- */

.rpnl-app-faq {
    max-width: 900px !important;
    margin: 38px auto 0 !important;
}

.rpnl-app-faq details {
    margin: 12px 0;
    padding: 20px 22px;
    border: 1px solid var(--rpnl-border);
    border-radius: 16px;
    background: #fff;
}

.rpnl-app-faq summary {
    cursor: pointer;
    color: var(--rpnl-navy);
    font-weight: 800;
}

.rpnl-app-faq details p {
    margin-bottom: 0;
    color: var(--rpnl-muted);
    line-height: 1.65;
}

/* ---------- FINAL CTA ---------- */

.rpnl-app-final {
    width: 100%;
    max-width: none !important;
    padding: clamp(76px, 10vw, 130px) 24px;
    text-align: center;
    background:
        radial-gradient(
            circle at 15% 0%,
            rgba(22, 119, 255, .14),
            transparent 30%
        ),
        #fff;
}

.rpnl-app-final > * {
    width: min(900px, 100%);
    margin-left: auto;
    margin-right: auto;
}

.rpnl-app-final h2 {
    margin-top: 0;
}

.rpnl-app-final-tagline {
    color: var(--rpnl-red) !important;
    font-size: clamp(1.25rem, 2.6vw, 1.65rem);
    font-weight: 900;
}

/* ---------- MOBILE ---------- */

@media (max-width: 781px) {

    .rpnl-app-hero {
        min-height: auto;
        padding-left: 20px;
        padding-right: 20px;
    }

    .rpnl-app-section,
    .rpnl-app-free-banner,
    .rpnl-app-final {
        padding-left: 20px;
        padding-right: 20px;
    }

    .rpnl-app-page h1 {
        font-size: clamp(2.55rem, 12vw, 4rem);
    }

    .rpnl-app-feature-row {
        gap: 16px;
    }

    .rpnl-app-feature-row + .rpnl-app-feature-row {
        margin-top: 16px;
    }

    .rpnl-app-feature-card {
        padding: 24px;
    }

    .rpnl-app-visual-card {
        min-height: 280px;
    }

    .rpnl-app-page .wp-block-buttons {
        width: 100%;
    }

    .rpnl-app-page .wp-block-button {
        width: 100%;
    }

    .rpnl-app-page .wp-block-button__link {
        display: block;
        width: 100%;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .rpnl-app-page *,
    .rpnl-app-page *::before,
    .rpnl-app-page *::after {
        scroll-behavior: auto !important;
        transition: none !important;
        animation: none !important;
    }
}

/* === RPNL APP VISUAL DEPTH START === */

/* ---------------------------------------------------------
   NAGŁÓWKI — większa głębia i czytelność
   --------------------------------------------------------- */

.rpnl-app-page h1 {
    text-shadow:
        0 2px 0 rgba(255,255,255,.65),
        0 5px 12px rgba(11,45,77,.14);
}

.rpnl-app-page h2 {
    text-shadow:
        0 2px 0 rgba(255,255,255,.55),
        0 4px 10px rgba(11,45,77,.12);
}

.rpnl-app-page h3 {
    text-shadow:
        0 1px 0 rgba(255,255,255,.70),
        0 3px 7px rgba(11,45,77,.10);
}

/* Nagłówki na ciemnym tle wymagają innego cienia */
.rpnl-app-page .rpnl-app-section-dark h1,
.rpnl-app-page .rpnl-app-section-dark h2,
.rpnl-app-page .rpnl-app-section-dark h3,
.rpnl-app-page .rpnl-app-visual-card h1,
.rpnl-app-page .rpnl-app-visual-card h2,
.rpnl-app-page .rpnl-app-visual-card h3 {
    text-shadow:
        0 2px 2px rgba(0,0,0,.22),
        0 6px 18px rgba(0,0,0,.20);
}


/* ---------------------------------------------------------
   JASNE KAFELKI — nie czysta biel
   --------------------------------------------------------- */

.rpnl-app-page .rpnl-app-feature-card {
    background:
        linear-gradient(
            145deg,
            #f9fbff 0%,
            #eef5fc 100%
        );

    border:
        1px solid rgba(22,119,255,.18);

    box-shadow:
        0 4px 0 rgba(11,45,77,.08),
        0 12px 24px rgba(11,45,77,.10),
        0 24px 48px rgba(11,45,77,.06);

    transition:
        transform .22s ease,
        box-shadow .22s ease,
        border-color .22s ease;
}


/* ---------------------------------------------------------
   FAQ — ten sam język wizualny
   --------------------------------------------------------- */

.rpnl-app-page .rpnl-app-faq details {
    background:
        linear-gradient(
            145deg,
            #f9fbff 0%,
            #eef5fc 100%
        );

    border:
        1px solid rgba(22,119,255,.18);

    box-shadow:
        0 3px 0 rgba(11,45,77,.07),
        0 10px 22px rgba(11,45,77,.08);

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}


/* ---------------------------------------------------------
   GRANATOWE KAFELKI 0 / 12 / 30s / LIVE
   --------------------------------------------------------- */

.rpnl-app-page .rpnl-app-visual-card {
    border:
        1px solid rgba(255,255,255,.10);

    box-shadow:
        0 7px 0 rgba(6,30,52,.18),
        0 18px 38px rgba(11,45,77,.20),
        0 32px 65px rgba(11,45,77,.13);

    transition:
        transform .22s ease,
        box-shadow .22s ease;
}


/* ---------------------------------------------------------
   WSZYSTKIE PRZYCISKI
   --------------------------------------------------------- */

.rpnl-app-page .wp-block-button__link {
    position: relative;

    border:
        1px solid rgba(11,45,77,.13);

    box-shadow:
        0 4px 0 rgba(11,45,77,.16),
        0 10px 22px rgba(11,45,77,.13);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        background-color .18s ease,
        border-color .18s ease;
}


/* Główny granatowy */
.rpnl-app-page .rpnl-app-button-primary .wp-block-button__link {
    background:
        linear-gradient(
            180deg,
            #124675 0%,
            #0B2D4D 100%
        );

    color: #ffffff;

    border:
        1px solid rgba(3,24,42,.35);

    box-shadow:
        0 5px 0 #061f36,
        0 13px 26px rgba(11,45,77,.25);
}


/* Jasny przycisk — zamiast czystej bieli */
.rpnl-app-page .rpnl-app-button-secondary .wp-block-button__link {
    background:
        linear-gradient(
            180deg,
            #f7fbff 0%,
            #e8f2fc 100%
        );

    color: var(--rpnl-navy);

    border:
        1px solid rgba(22,119,255,.22);

    box-shadow:
        0 5px 0 rgba(11,45,77,.11),
        0 12px 24px rgba(11,45,77,.12);
}


/* ---------------------------------------------------------
   LABELKI
   --------------------------------------------------------- */

.rpnl-app-page .rpnl-app-feature-label {
    background:
        linear-gradient(
            180deg,
            #e7f2ff 0%,
            #dcecff 100%
        );

    border:
        1px solid rgba(22,119,255,.10);

    box-shadow:
        0 2px 0 rgba(22,119,255,.08),
        0 5px 12px rgba(22,119,255,.08);
}


/* ---------------------------------------------------------
   HOVER 3D — tylko urządzenia z prawdziwym hover
   --------------------------------------------------------- */

@media (hover: hover) and (pointer: fine) {

    .rpnl-app-page .rpnl-app-feature-card:hover {
        transform: translateY(-5px);

        border-color:
            rgba(22,119,255,.30);

        box-shadow:
            0 6px 0 rgba(11,45,77,.08),
            0 18px 34px rgba(11,45,77,.14),
            0 30px 60px rgba(11,45,77,.08);
    }

    .rpnl-app-page .rpnl-app-visual-card:hover {
        transform: translateY(-5px);

        box-shadow:
            0 9px 0 rgba(6,30,52,.18),
            0 24px 45px rgba(11,45,77,.24),
            0 38px 70px rgba(11,45,77,.15);
    }

    .rpnl-app-page .rpnl-app-faq details:hover {
        transform: translateY(-2px);

        border-color:
            rgba(22,119,255,.28);

        box-shadow:
            0 4px 0 rgba(11,45,77,.08),
            0 14px 28px rgba(11,45,77,.11);
    }

    .rpnl-app-page .wp-block-button__link:hover {
        transform: translateY(-3px);
    }

    .rpnl-app-page .rpnl-app-button-primary .wp-block-button__link:hover {
        box-shadow:
            0 7px 0 #061f36,
            0 17px 30px rgba(11,45,77,.28);
    }

    .rpnl-app-page .rpnl-app-button-secondary .wp-block-button__link:hover {
        background:
            linear-gradient(
                180deg,
                #ffffff 0%,
                #e3effb 100%
            );

        border-color:
            rgba(22,119,255,.34);

        box-shadow:
            0 7px 0 rgba(11,45,77,.11),
            0 16px 28px rgba(11,45,77,.15);
    }
}


/* ---------------------------------------------------------
   ACTIVE — efekt fizycznego wciśnięcia przycisku
   --------------------------------------------------------- */

.rpnl-app-page .wp-block-button__link:active {
    transform: translateY(2px);
}

.rpnl-app-page .rpnl-app-button-primary .wp-block-button__link:active {
    box-shadow:
        0 2px 0 #061f36,
        0 6px 14px rgba(11,45,77,.20);
}

.rpnl-app-page .rpnl-app-button-secondary .wp-block-button__link:active {
    box-shadow:
        0 2px 0 rgba(11,45,77,.11),
        0 6px 14px rgba(11,45,77,.10);
}


/* ---------------------------------------------------------
   MOBILE — trochę spokojniejsze cienie
   --------------------------------------------------------- */

@media (max-width: 781px) {

    .rpnl-app-page h1 {
        text-shadow:
            0 2px 0 rgba(255,255,255,.55),
            0 4px 9px rgba(11,45,77,.12);
    }

    .rpnl-app-page h2,
    .rpnl-app-page h3 {
        text-shadow:
            0 1px 0 rgba(255,255,255,.50),
            0 3px 7px rgba(11,45,77,.10);
    }

    .rpnl-app-page .rpnl-app-feature-card {
        box-shadow:
            0 3px 0 rgba(11,45,77,.07),
            0 10px 22px rgba(11,45,77,.10);
    }

    .rpnl-app-page .rpnl-app-visual-card {
        box-shadow:
            0 5px 0 rgba(6,30,52,.16),
            0 14px 28px rgba(11,45,77,.18);
    }
}

/* === RPNL APP VISUAL DEPTH END === */

/* === RPNL APP HEADING SHADOWS START === */

/*
 * Wszystkie nagłówki landingu.
 * Celowo większa specyficzność + !important,
 * aby style motywu / Gutenberga ich nie nadpisywały.
 */

body .rpnl-app-page h1,
body .rpnl-app-page h2,
body .rpnl-app-page h3,
body .rpnl-app-page .wp-block-heading {
    text-shadow:
        0 2px 0 rgba(255,255,255,.80),
        0 4px 7px rgba(11,45,77,.16),
        0 9px 20px rgba(11,45,77,.11) !important;
}


/* H1 — trochę mocniejszy */
body .rpnl-app-page h1 {
    text-shadow:
        0 2px 0 rgba(255,255,255,.85),
        0 5px 8px rgba(11,45,77,.19),
        0 12px 26px rgba(11,45,77,.14) !important;
}


/* H2 */
body .rpnl-app-page h2 {
    text-shadow:
        0 2px 0 rgba(255,255,255,.75),
        0 4px 7px rgba(11,45,77,.16),
        0 9px 18px rgba(11,45,77,.11) !important;
}


/* H3 */
body .rpnl-app-page h3 {
    text-shadow:
        0 1px 0 rgba(255,255,255,.85),
        0 3px 5px rgba(11,45,77,.15),
        0 7px 14px rgba(11,45,77,.10) !important;
}


/*
 * Nagłówki na granatowym tle:
 * tutaj biały highlight wyglądałby źle,
 * więc używamy ciemnego cienia.
 */

body .rpnl-app-page .rpnl-app-section-dark h1,
body .rpnl-app-page .rpnl-app-section-dark h2,
body .rpnl-app-page .rpnl-app-section-dark h3,
body .rpnl-app-page .rpnl-app-visual-card h1,
body .rpnl-app-page .rpnl-app-visual-card h2,
body .rpnl-app-page .rpnl-app-visual-card h3 {
    text-shadow:
        0 2px 2px rgba(0,0,0,.30),
        0 5px 10px rgba(0,0,0,.24),
        0 12px 24px rgba(0,0,0,.18) !important;
}


/* 100% ZA DARMO — najmocniejszy efekt */
body .rpnl-app-page .rpnl-app-free-title {
    text-shadow:
        0 3px 2px rgba(0,0,0,.25),
        0 8px 18px rgba(0,0,0,.22),
        0 16px 36px rgba(0,0,0,.16) !important;
}


/* Mobile — trochę spokojniej */
@media (max-width: 781px) {

    body .rpnl-app-page h1,
    body .rpnl-app-page h2,
    body .rpnl-app-page h3,
    body .rpnl-app-page .wp-block-heading {
        text-shadow:
            0 1px 0 rgba(255,255,255,.75),
            0 3px 6px rgba(11,45,77,.15),
            0 7px 14px rgba(11,45,77,.10) !important;
    }

    body .rpnl-app-page .rpnl-app-section-dark h1,
    body .rpnl-app-page .rpnl-app-section-dark h2,
    body .rpnl-app-page .rpnl-app-section-dark h3,
    body .rpnl-app-page .rpnl-app-visual-card h1,
    body .rpnl-app-page .rpnl-app-visual-card h2,
    body .rpnl-app-page .rpnl-app-visual-card h3 {
        text-shadow:
            0 2px 2px rgba(0,0,0,.27),
            0 5px 11px rgba(0,0,0,.20) !important;
    }
}

/* === RPNL APP HEADING SHADOWS END === */