/* =========================================================
   DRAMALAND 2.0 — STRONA GŁÓWNA JAK OPOWIEŚĆ, NIE STOS KART
========================================================= */

.dl-home {
    --dl-home-bg: #071920;
    --dl-home-deep: #04161c;
    --dl-home-surface: #0d3139;
    --dl-home-gold: #d9a441;
    --dl-home-gold-light: #ffd485;
    --dl-home-cream: #fee9ce;
    --dl-home-line: rgba(217, 164, 65, 0.22);
    overflow: hidden;
    color: #f7efe4;
    background: var(--dl-home-bg);
}

.dl-home-flow-section {
    position: relative;
    isolation: isolate;
    padding: clamp(68px, 8vw, 112px) 20px;
}

.dl-home-flow-section::before,
.dl-home-flow-section::after {
    content: "";
    position: absolute;
    z-index: -1;
    pointer-events: none;
}

.dl-home-flow-section::before {
    inset: 0;
    background: linear-gradient(180deg, transparent, rgba(255,255,255,.012), transparent);
}

.dl-home-flow-section::after {
    left: 50%;
    bottom: 0;
    width: min(880px, 70vw);
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, var(--dl-home-line), transparent);
}

.dl-home-flow-section--continue {
    padding-top: clamp(38px, 5vw, 64px);
    background:
        radial-gradient(circle at 86% 10%, rgba(217,164,65,.09), transparent 30%),
        linear-gradient(180deg, #071920, #081d24);
}

.dl-home-flow-section--recommendations {
    background:
        radial-gradient(circle at 8% 50%, rgba(46,103,111,.26), transparent 34%),
        linear-gradient(135deg, #081d24, #06181e 70%);
}

.dl-home-flow-section--episodes {
    background:
        linear-gradient(110deg, rgba(217,164,65,.035), transparent 40%),
        #071920;
}

.dl-home-flow-section--feature {
    padding-block: clamp(42px, 5vw, 68px);
    background: #06171d;
}

.dl-home-flow-section--search {
    background:
        radial-gradient(circle at 75% 20%, rgba(217,164,65,.08), transparent 32%),
        linear-gradient(180deg, #06171d, #0a242c);
}

.dl-home-flow-section--recent {
    background: linear-gradient(180deg, #0a242c, #071920);
}

.dl-home-flow-section--ranking {
    background:
        radial-gradient(circle at 5% 5%, rgba(217,164,65,.12), transparent 28%),
        linear-gradient(135deg, #06171d, #0b2931);
}

.dl-home-flow-section--birthdays {
    background:
        linear-gradient(90deg, rgba(254,233,206,.035), transparent 40%),
        #081d24;
}

.dl-home-flow-section--moods {
    background: linear-gradient(180deg, #081d24, #06171d);
}

.dl-home-flow-section--soon {
    background:
        radial-gradient(circle at 85% 40%, rgba(72,126,134,.18), transparent 32%),
        #06171d;
}

.dl-home-flow-section--chronicle {
    padding-block: clamp(48px, 6vw, 80px);
    background: linear-gradient(180deg, #06171d, #041216);
}

.dl-home-section-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--dl-home-gold-light);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.dl-home-section-kicker > span {
    color: var(--dl-home-gold);
    font-size: 15px;
}

.dl-home-section-heading,
.dl-home-editorial-heading {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 28px;
    margin-bottom: clamp(28px, 4vw, 48px);
}

.dl-home-section-heading h2,
.dl-home-editorial-heading h2,
.dl-home-search-copy h2,
.dl-home-feature-copy h2,
.dl-home-chronicle-inner h2 {
    margin: 9px 0 0;
    color: var(--dl-home-cream);
    font-size: clamp(32px, 4.6vw, 58px);
    line-height: 1.04;
    letter-spacing: -.035em;
}

.dl-home-section-description,
.dl-home-editorial-heading p,
.dl-home-search-copy p,
.dl-home-feature-copy p,
.dl-home-chronicle-inner p {
    max-width: 720px;
    margin: 12px 0 0;
    color: rgba(247,239,228,.68);
    font-size: 15px;
    line-height: 1.75;
}

.dl-home-editorial-heading {
    align-items: center;
}

.dl-home-editorial-mark {
    flex: 0 0 auto;
    color: rgba(217,164,65,.18);
    font-family: Georgia, serif;
    font-size: clamp(76px, 11vw, 150px);
    line-height: .7;
}

.dl-home-title-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: clamp(14px, 2vw, 24px);
}

.dl-home-title-grid--editorial > *:first-child {
    grid-column: span 2;
}

.dl-home-title-grid--editorial > *:not(:first-child) {
    align-self: end;
}

/* Karty nadal są wspólne, ale nie wyglądają jak zamknięte pudełka. */
.dl-home .dl-title-card,
.dl-home .dl-drama-card,
.dl-home .dl-card-drama {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.dl-home .dl-title-card img,
.dl-home .dl-drama-card img,
.dl-home .dl-card-drama img {
    border: 1px solid rgba(217,164,65,.18);
    box-shadow: 0 18px 42px rgba(0,0,0,.28);
}

.dl-home .dl-title-card:hover img,
.dl-home .dl-drama-card:hover img,
.dl-home .dl-card-drama:hover img {
    border-color: rgba(255,212,133,.55);
    box-shadow: 0 24px 58px rgba(0,0,0,.42);
}

/* Kontynuuj — pozostaje wysoko i ma jeden szeroki, kinowy kształt. */
.dl-continue-home-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(150px, 220px) minmax(0, 1fr);
    min-height: 310px;
    overflow: hidden;
    background: #0a252d;
    border: 1px solid var(--dl-home-line);
    border-radius: 28px;
    box-shadow: 0 28px 70px rgba(0,0,0,.32);
}

.dl-continue-home-backdrop {
    position: absolute;
    inset: 0;
    opacity: .2;
    background-image: linear-gradient(90deg, #071920 12%, rgba(7,25,32,.52), #071920), var(--dl-continue-background);
    background-size: cover;
    background-position: center;
}

.dl-continue-home-poster,
.dl-continue-home-content {
    position: relative;
    z-index: 1;
}

.dl-continue-home-poster img {
    width: 100%;
    height: 100%;
    min-height: 310px;
    object-fit: cover;
}

.dl-continue-home-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(28px, 5vw, 58px);
}

.dl-continue-home-content h3 {
    margin: 8px 0 12px;
    color: var(--dl-home-cream);
    font-size: clamp(28px, 4vw, 48px);
}

.dl-continue-home-eyebrow,
.dl-continue-home-episode { color: rgba(247,239,228,.72); }
.dl-continue-progress { max-width: 620px; margin-top: 22px; }
.dl-continue-progress-top { display:flex; justify-content:space-between; margin-bottom:8px; font-size:12px; }
.dl-continue-progress-track { height:6px; overflow:hidden; background:rgba(255,255,255,.1); border-radius:999px; }
.dl-continue-progress-bar { display:block; height:100%; background:linear-gradient(90deg,var(--dl-home-gold),var(--dl-home-gold-light)); border-radius:inherit; }
.dl-continue-fox-message { display:flex; gap:12px; align-items:flex-start; margin-top:20px; color:rgba(247,239,228,.7); }
.dl-continue-fox-message p { margin:3px 0 0; }
.dl-home-symbol { display:grid; place-items:center; width:34px; height:34px; color:var(--dl-home-gold-light); border:1px solid var(--dl-home-line); border-radius:50%; }
.dl-continue-home-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }

/* Quiz miesiąca — pojedynczy editorial strip zamiast kolejnej karty. */
.dl-home-feature-strip {
    display: grid;
    grid-template-columns: 76px minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(18px, 3vw, 40px);
    padding: clamp(26px, 4vw, 46px) 0;
    border-top: 1px solid var(--dl-home-line);
    border-bottom: 1px solid var(--dl-home-line);
}

.dl-home-feature-symbol {
    color: var(--dl-home-gold);
    font-size: 56px;
    text-align: center;
}

.dl-home-feature-copy h2 { font-size: clamp(28px, 4vw, 48px); }
.dl-home-feature-button,
.dl-home-section-link {
    color: var(--dl-home-gold-light);
    font-weight: 800;
    text-decoration: none;
}
.dl-home-feature-button { padding:14px 20px; border:1px solid var(--dl-home-line); border-radius:999px; }
.dl-home-feature-button.is-disabled { opacity:.55; }

/* Wyszukiwarka — pełna szerokość, bez Landusia jako emoji. */
.dl-home-search-panel--streamlined {
    padding: clamp(28px, 5vw, 56px);
    background: rgba(4,22,28,.58);
    border: 1px solid var(--dl-home-line);
    border-radius: 30px;
    backdrop-filter: blur(12px);
}
.dl-home-search-copy { margin-bottom:28px; }
.dl-home-search-field { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; padding:8px 8px 8px 16px; background:#06171d; border:1px solid var(--dl-home-line); border-radius:18px; }
.dl-home-search-field input { min-width:0; color:#fff; background:transparent; border:0; outline:0; }
.dl-home-search-field button,.dl-home-filter-submit { min-height:44px; padding:10px 20px; color:#071920; font-weight:900; background:var(--dl-home-gold-light); border:0; border-radius:12px; }
.dl-home-filter-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:16px; }
.dl-home-filter label { display:block; margin:0 0 7px; color:rgba(247,239,228,.62); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.dl-home-filter select { width:100%; min-height:46px; color:#f7efe4; background:#081d24; border:1px solid rgba(217,164,65,.18); border-radius:12px; }
.dl-home-filter-actions { display:flex; align-items:center; gap:14px; margin-top:18px; }
.dl-home-filter-reset { color:rgba(247,239,228,.62); }

/* Ranking jest listą redakcyjną, a nie siatką kart. */
.dl-home-ranking-list { display:grid; gap:0; margin:0; padding:0; list-style:none; border-top:1px solid var(--dl-home-line); }
.dl-home-ranking-item { display:grid; grid-template-columns:76px 70px minmax(0,1fr) 44px; align-items:center; gap:18px; min-height:104px; border-bottom:1px solid rgba(217,164,65,.14); transition:background .2s ease, padding .2s ease; }
.dl-home-ranking-item:hover { padding-inline:12px; background:rgba(255,255,255,.018); }
.dl-home-ranking-number { color:rgba(217,164,65,.46); font-family:Georgia,serif; font-size:40px; }
.dl-home-ranking-poster { width:54px; height:76px; overflow:hidden; border-radius:8px; }
.dl-home-ranking-poster img { width:100%; height:100%; object-fit:cover; }
.dl-home-ranking-copy { display:grid; gap:6px; }
.dl-home-ranking-copy a { color:var(--dl-home-cream); font-size:18px; text-decoration:none; }
.dl-home-ranking-copy span { color:rgba(247,239,228,.56); font-size:13px; }
.dl-home-ranking-arrow { display:grid; place-items:center; color:var(--dl-home-gold-light); text-decoration:none; }

/* Urodziny tłumaczy — pozioma linia osób, bez pudełek. */
.dl-home-birthday-line { display:flex; flex-wrap:wrap; gap:clamp(24px,4vw,52px); padding:26px 0 8px; border-top:1px solid var(--dl-home-line); }
.dl-home-birthday-person { display:flex; align-items:center; gap:14px; color:inherit; text-decoration:none; }
.dl-home-birthday-avatar { display:grid; place-items:center; width:58px; height:58px; overflow:hidden; color:var(--dl-home-gold-light); background:#0a252d; border:1px solid var(--dl-home-line); border-radius:50%; }
.dl-home-birthday-avatar img { width:100%; height:100%; object-fit:cover; }
.dl-home-birthday-person strong,.dl-home-birthday-person small { display:block; }
.dl-home-birthday-person small { margin-top:3px; color:rgba(247,239,228,.56); }
.dl-home-empty-note { display:flex; align-items:center; gap:16px; padding:24px 0; color:rgba(247,239,228,.65); border-top:1px solid var(--dl-home-line); border-bottom:1px solid var(--dl-home-line); }
.dl-home-empty-note > span { color:var(--dl-home-gold); font-size:28px; }
.dl-home-empty-note p { margin:0; }

/* Nastroje — spokojniejsze symbole, bez kolorowych emoji. */
.dl-home-moods-panel { padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
.dl-home-moods-header { margin-bottom:34px; }
.dl-home-moods-grid--refined { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--dl-home-line); border:1px solid var(--dl-home-line); }
.dl-home-moods-grid--refined .dl-home-mood-card { min-height:190px; padding:26px; background:#071920 !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; }
.dl-home-moods-grid--refined .dl-home-mood-card:hover { background:#0a252d !important; transform:none !important; }
.dl-home-moods-grid--refined .dl-home-mood-emoji-wrap { width:38px; height:38px; color:var(--dl-home-gold-light); background:transparent; border:1px solid var(--dl-home-line); }
.dl-home-moods-grid--refined .dl-home-mood-emoji { font-size:18px; }

/* Kronika — zamknięcie strony jak wpis w dzienniku. */
.dl-home-chronicle-inner { display:grid; grid-template-columns:110px minmax(0,1fr) 90px; align-items:center; gap:30px; }
.dl-home-chronicle-date { color:rgba(217,164,65,.5); font-family:Georgia,serif; font-size:42px; }
.dl-home-chronicle-symbol { color:rgba(217,164,65,.18); font-size:84px; text-align:right; }
.dl-home-chronicle-inner a { color:var(--dl-home-gold-light); }

@media (max-width: 1100px) {
    .dl-home-title-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
    .dl-home-title-grid--editorial > *:first-child { grid-column:auto; }
    .dl-home-filter-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .dl-home-moods-grid--refined { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 760px) {
    .dl-home-flow-section { padding:58px 16px; }
    .dl-home-section-heading,.dl-home-editorial-heading { align-items:flex-start; flex-direction:column; }
    .dl-home-editorial-mark { display:none; }
    .dl-home-title-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
    .dl-continue-home-card { grid-template-columns:110px minmax(0,1fr); min-height:250px; border-radius:20px; }
    .dl-continue-home-poster img { min-height:250px; }
    .dl-continue-home-content { padding:22px 18px; }
    .dl-continue-home-content h3 { font-size:26px; }
    .dl-continue-fox-message { display:none; }
    .dl-home-feature-strip { grid-template-columns:44px minmax(0,1fr); }
    .dl-home-feature-button { grid-column:2; justify-self:start; }
    .dl-home-feature-symbol { font-size:34px; }
    .dl-home-search-panel--streamlined { padding:24px 18px; border-radius:20px; }
    .dl-home-filter-grid { grid-template-columns:1fr; }
    .dl-home-ranking-item { grid-template-columns:48px 52px minmax(0,1fr) 28px; gap:10px; min-height:88px; }
    .dl-home-ranking-number { font-size:28px; }
    .dl-home-ranking-poster { width:44px; height:62px; }
    .dl-home-moods-grid--refined { grid-template-columns:1fr; }
    .dl-home-moods-grid--refined .dl-home-mood-card { min-height:150px; }
    .dl-home-chronicle-inner { grid-template-columns:1fr; }
    .dl-home-chronicle-date,.dl-home-chronicle-symbol { display:none; }
}

@media (max-width: 480px) {
    .dl-home-title-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .dl-continue-home-card { grid-template-columns:92px minmax(0,1fr); }
    .dl-continue-home-content { padding:18px 14px; }
    .dl-continue-home-actions { flex-direction:column; align-items:stretch; }
    .dl-home-search-field { grid-template-columns:auto minmax(0,1fr); }
    .dl-home-search-field button { grid-column:1/-1; width:100%; }
    .dl-home-filter-actions { align-items:stretch; flex-direction:column; }
}


/* =========================================================
   KOREKTA KOŃCOWA — LANDUŚ + KOMPAKTOWE NOWE ODCINKI
   Bazuje na wyglądzie „Dramaland 2.0 — kompletna wersja”.
========================================================= */

.dl-home-editorial-heading--with-landus {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 220px;
    align-items: center;
}

.dl-home-recommendations-landus,
.dl-home-search-landus {
    min-width: 0;
}

.dl-home-recommendations-landus-component {
    justify-content: center;
}

.dl-home-recommendations-landus-component .dl-landus-visual {
    width: 205px;
    max-width: 205px;
}

.dl-home-search-intro--with-landus {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 460px);
    align-items: center;
    gap: 30px;
    margin-bottom: 26px;
}

.dl-home-search-landus-component .dl-landus {
    gap: 14px;
}

.dl-home-search-landus-component .dl-landus-visual {
    width: 145px;
    max-width: 145px;
}

.dl-home-search-landus-component .dl-landus-message {
    flex-basis: 245px;
    width: 245px;
    min-width: 190px;
    padding: 15px 17px;
}

.dl-home-latest-translations.is-single {
    padding-top: clamp(46px, 5vw, 66px);
    padding-bottom: clamp(52px, 6vw, 74px);
}

.dl-home-latest-translations.is-single .dl-home-section-heading {
    margin-bottom: 28px;
}

.dl-home-latest-translations.is-single .dl-home-title-grid--episodes {
    grid-template-columns: minmax(190px, 225px);
}

.dl-home-latest-translations.is-single .dl-title-card {
    max-width: 225px;
}

.dl-search-results-landus-component,
.dl-search-empty-landus-component {
    justify-content: center;
}

.dl-search-results-landus-component .dl-landus-visual {
    width: 225px;
    max-width: 225px;
}

.dl-search-empty-landus {
    display: flex;
    justify-content: center;
    margin-bottom: 8px;
}

.dl-search-empty-landus-component .dl-landus-visual {
    width: 210px;
    max-width: 210px;
}

@media (max-width: 900px) {
    .dl-home-editorial-heading--with-landus,
    .dl-home-search-intro--with-landus {
        grid-template-columns: 1fr;
    }

    .dl-home-recommendations-landus {
        display: none;
    }

    .dl-home-search-landus {
        max-width: 560px;
    }
}

@media (max-width: 600px) {
    .dl-home-search-landus-component .dl-landus {
        flex-direction: column;
    }

    .dl-home-search-landus-component .dl-landus-visual {
        width: 150px;
        max-width: 150px;
    }

    .dl-home-search-landus-component .dl-landus-message {
        width: min(100%, 340px);
        max-width: 340px;
        min-width: 0;
    }

    .dl-home-latest-translations.is-single .dl-home-title-grid--episodes {
        grid-template-columns: minmax(0, 260px);
        justify-content: center;
    }
}
/* =========================================
   POLECANE DLA CIEBIE — RÓWNE KARTY
========================================= */

.dl-home-recommendations .dl-home-title-grid--editorial {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
    align-items: start;
}

.dl-home-recommendations
.dl-home-title-grid--editorial > *:first-child {
    grid-column: auto;
}

.dl-home-recommendations
.dl-home-title-grid--editorial > * {
    align-self: start;
    min-width: 0;
}

.dl-home-recommendations
.dl-title-card-poster,
.dl-home-recommendations
.dl-drama-card-poster,
.dl-home-recommendations
.dl-card-drama-poster {
    width: 100%;
    aspect-ratio: 2 / 3;
    overflow: hidden;
}

.dl-home-recommendations
.dl-title-card-poster img,
.dl-home-recommendations
.dl-drama-card-poster img,
.dl-home-recommendations
.dl-card-drama-poster img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dl-home-recommendations
.dl-title-card h3,
.dl-home-recommendations
.dl-drama-card h3,
.dl-home-recommendations
.dl-card-drama h3 {
    min-height: 54px;
}

@media (max-width: 1100px) {
    .dl-home-recommendations .dl-home-title-grid--editorial {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .dl-home-recommendations .dl-home-title-grid--editorial {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
    }

    .dl-home-recommendations
    .dl-title-card h3,
    .dl-home-recommendations
    .dl-drama-card h3,
    .dl-home-recommendations
    .dl-card-drama h3 {
        min-height: 48px;
    }
}

@media (max-width: 420px) {
    .dl-home-recommendations .dl-home-title-grid--editorial {
        grid-template-columns: 1fr;
    }

    .dl-home-recommendations
    .dl-title-card h3,
    .dl-home-recommendations
    .dl-drama-card h3,
    .dl-home-recommendations
    .dl-card-drama h3 {
        min-height: 0;
    }
}