.pmv2 {
    --pm-accent: #e5a00d;
    --pm-bg: #101010;
    --pm-panel: #181818;
    --pm-text: #ffffff;
    --pm-muted: #aaa;
    width: 100%;
    color: var(--pm-text);
    font-family: inherit;
}

.pmv2 *,
.pmv2 *::before,
.pmv2 *::after {
    box-sizing: border-box;
}

.pmv2-featured,
.pmv2-section {
    width: min(1600px, calc(100vw - 34px));
    margin-left: 50%;
    transform: translateX(-50%);
}

.pmv2-featured {
    position: relative;
    min-height: clamp(440px, 58vh, 640px);
    margin-bottom: 54px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 20px;
    background: #151515;
    isolation: isolate;
    box-shadow: 0 24px 70px rgba(0,0,0,.48);
}

.pmv2-featured-bg {
    position: absolute;
    inset: 0;
    z-index: -4;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 24%;
    transform: scale(1.018);
}

.pmv2-featured::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -3;
    background:
        linear-gradient(
            90deg,
            rgba(5,5,5,.98) 0%,
            rgba(5,5,5,.90) 22%,
            rgba(5,5,5,.58) 48%,
            rgba(5,5,5,.15) 76%,
            rgba(5,5,5,.04) 100%
        ),
        linear-gradient(
            0deg,
            rgba(8,8,8,.95) 0%,
            rgba(8,8,8,.25) 43%,
            transparent 72%
        );
}

.pmv2-featured::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    z-index: -2;
    height: 26%;
    background: linear-gradient(0deg, var(--pm-bg), transparent);
}

.pmv2-featured-content {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: min(940px, 72%);
    min-height: inherit;
    padding: clamp(34px, 4.8vw, 72px);
}

.pmv2-kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    width: fit-content;
    margin-bottom: 18px;
    color: var(--pm-accent);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .14em;
    text-transform: uppercase;
    text-shadow: 0 3px 12px rgba(0,0,0,.55);
}

.pmv2-featured h1 {
    max-width: 18ch;
    margin: 0;
    color: #fff;
    font-size: clamp(48px, 5.35vw, 88px);
    font-weight: 900;
    line-height: .95;
    letter-spacing: -.055em;
    overflow-wrap: normal;
    word-break: keep-all;
    hyphens: none;
    text-wrap: balance;
    text-shadow: 0 5px 30px rgba(0,0,0,.82);
}

.pmv2-featured-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 9px 15px;
    margin-top: 21px;
    color: #ededed;
    font-size: clamp(14px, 1.3vw, 17px);
    font-weight: 750;
    text-shadow: 0 3px 12px rgba(0,0,0,.75);
}

.pmv2-meta-pill {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    background: rgba(0,0,0,.38);
    color: #f1f1f1;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 14px rgba(0,0,0,.22);
}

.pmv2-meta-pill.is-date {
    border-color: rgba(229,160,13,.55);
    color: #ffd36a;
}

.pmv2-featured-description {
    max-width: 630px;
    margin: 17px 0 0;
    color: #cfcfcf;
    font-size: clamp(14px, 1.35vw, 18px);
    line-height: 1.58;
    text-shadow: 0 3px 12px rgba(0,0,0,.75);
}

.pmv2-section {
    margin-bottom: 52px;
}

.pmv2-section-head {
    margin: 0 0 12px;
    padding-inline: 3px;
}

.pmv2-section-head h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(27px, 2.45vw, 39px);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -.03em;
}

.pmv2-section-head p {
    margin: 7px 0 0;
    color: var(--pm-muted);
    font-size: 14px;
    line-height: 1.45;
}

.pmv2-row-shell {
    position: relative;
    isolation: isolate;
}

.pmv2-row-shell::before,
.pmv2-row-shell::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 23px;
    z-index: 5;
    width: 62px;
    pointer-events: none;
    opacity: .92;
}

.pmv2-row-shell::before {
    left: 0;
    background: linear-gradient(90deg, var(--pm-bg), transparent);
}

.pmv2-row-shell::after {
    right: 0;
    background: linear-gradient(270deg, var(--pm-bg), transparent);
}

.pmv2-row {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: clamp(178px, 12.4vw, 205px);
    gap: clamp(15px, 1.35vw, 22px);
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-behavior: smooth;
    scroll-snap-type: inline mandatory;
    padding: 15px 8px 31px;
    scrollbar-width: none;
}

.pmv2-row::-webkit-scrollbar {
    display: none;
}

.pmv2-card {
    min-width: 0;
    color: #fff;
    outline: none;
    scroll-snap-align: start;
}

.pmv2-poster {
    position: relative;
    aspect-ratio: 2 / 3;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 12px;
    background: var(--pm-panel);
    box-shadow: 0 9px 25px rgba(0,0,0,.34);
    transform: translateZ(0);
    transition:
        transform .24s cubic-bezier(.2,.75,.3,1),
        box-shadow .24s ease,
        border-color .24s ease;
}

.pmv2-poster img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
        transform .36s cubic-bezier(.2,.75,.3,1),
        filter .32s ease;
}

.pmv2-poster-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(0,0,0,.97) 0%, rgba(0,0,0,.26) 51%, transparent 76%);
    opacity: .34;
    transition: opacity .25s ease;
}

.pmv2-card:hover .pmv2-poster,
.pmv2-card:focus-visible .pmv2-poster {
    z-index: 7;
    border-color: rgba(229,160,13,.9);
    transform: translateY(-9px) scale(1.055);
    box-shadow:
        0 24px 44px rgba(0,0,0,.76),
        0 0 0 2px rgba(229,160,13,.6),
        0 0 30px rgba(229,160,13,.18);
}

.pmv2-card:hover .pmv2-poster img,
.pmv2-card:focus-visible .pmv2-poster img {
    transform: scale(1.07);
    filter: brightness(.72) saturate(1.08);
}

.pmv2-card:hover .pmv2-poster-shade,
.pmv2-card:focus-visible .pmv2-poster-shade {
    opacity: 1;
}

.pmv2-badge,
.pmv2-date {
    position: absolute;
    z-index: 3;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .075em;
    box-shadow: 0 4px 14px rgba(0,0,0,.55);
}

.pmv2-badge {
    top: 9px;
    left: 9px;
    padding: 6px 8px;
    border: 1px solid rgba(255,255,255,.22);
    background: rgba(0,0,0,.86);
    color: #fff;
    backdrop-filter: blur(6px);
}

.pmv2-badge.is-rank {
    color: var(--pm-accent);
}

.pmv2-date {
    right: 9px;
    bottom: 9px;
    padding: 6px 8px;
    background: var(--pm-accent);
    color: #111;
}

.pmv2-hover {
    position: absolute;
    right: 14px;
    bottom: 15px;
    left: 14px;
    z-index: 4;
    display: grid;
    gap: 5px;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity .23s ease, transform .23s ease;
}

.pmv2-hover strong {
    color: #fff;
    font-size: 16px;
    line-height: 1.18;
}

.pmv2-hover span {
    color: #d1d1d1;
    font-size: 11px;
    line-height: 1.3;
}

.pmv2-card:hover .pmv2-hover,
.pmv2-card:focus-visible .pmv2-hover {
    opacity: 1;
    transform: translateY(0);
}

.pmv2-title {
    margin-top: 10px;
    overflow: hidden;
    color: #fff;
    font-size: 15px;
    font-weight: 820;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pmv2-meta {
    margin-top: 3px;
    overflow: hidden;
    color: var(--pm-muted);
    font-size: 12px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pmv2-arrow {
    position: absolute;
    top: 137px;
    z-index: 9;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    padding: 0 0 3px;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    background: rgba(0,0,0,.84);
    color: #fff;
    font-size: 33px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(0,0,0,.48);
    backdrop-filter: blur(7px);
    transition:
        background .18s ease,
        color .18s ease,
        transform .18s ease,
        border-color .18s ease;
}

.pmv2-arrow:hover,
.pmv2-arrow:focus-visible {
    border-color: var(--pm-accent);
    background: var(--pm-accent);
    color: #111;
    transform: scale(1.09);
    outline: none;
}

.pmv2-left {
    left: 5px;
}

.pmv2-right {
    right: 5px;
}

.pmv2-empty {
    margin: 14px 0 34px;
    color: var(--pm-muted);
    font-size: 14px;
}

@media (max-width: 1024px) {
    .pmv2-featured,
    .pmv2-section {
        width: min(100%, calc(100vw - 26px));
    }

    .pmv2-featured {
        min-height: 500px;
    }

    .pmv2-featured-content {
        width: min(800px, 78%);
    }

    .pmv2-row {
        grid-auto-columns: 180px;
    }

    .pmv2-arrow {
        top: 122px;
    }
}

@media (max-width: 767px) {
    .pmv2-featured,
    .pmv2-section {
        width: calc(100vw - 18px);
    }

    .pmv2-featured {
        min-height: 465px;
        margin-bottom: 41px;
        border-radius: 15px;
    }

    .pmv2-featured-bg {
        object-position: center 22%;
    }

    .pmv2-featured::before {
        background:
            linear-gradient(0deg, rgba(5,5,5,.99) 0%, rgba(5,5,5,.82) 45%, rgba(5,5,5,.17) 79%, rgba(5,5,5,.05) 100%),
            linear-gradient(90deg, rgba(5,5,5,.4), rgba(5,5,5,.03));
    }

    .pmv2-featured-content {
        width: 100%;
        padding: 28px 23px 36px;
    }

    .pmv2-kicker {
        margin-bottom: 13px;
        font-size: 11px;
    }

    .pmv2-featured h1 {
        max-width: 13ch;
        font-size: clamp(38px, 11.5vw, 56px);
        line-height: .96;
        letter-spacing: -.045em;
    }

    .pmv2-featured-meta {
        gap: 7px 10px;
        margin-top: 17px;
        font-size: 13px;
    }

    .pmv2-meta-pill {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 7px 12px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 999px;
    background: rgba(0,0,0,.38);
    color: #f1f1f1;
    font-size: 13px;
    font-weight: 800;
    line-height: 1;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 14px rgba(0,0,0,.22);
}

.pmv2-meta-pill.is-date {
    border-color: rgba(229,160,13,.55);
    color: #ffd36a;
}

.pmv2-featured-description {
        display: none;
    }

    .pmv2-section {
        margin-bottom: 42px;
    }

    .pmv2-section-head h2 {
        font-size: 27px;
    }

    .pmv2-section-head p {
        font-size: 13px;
    }

    .pmv2-row-shell::before,
    .pmv2-row-shell::after {
        width: 24px;
    }

    .pmv2-row {
        grid-auto-columns: clamp(142px, 42vw, 160px);
        gap: 14px;
        padding: 10px 2px 23px;
    }

    .pmv2-title {
        font-size: 13px;
    }

    .pmv2-meta {
        font-size: 11px;
    }

    .pmv2-arrow {
        display: none;
    }

    .pmv2-card:hover .pmv2-poster,
    .pmv2-card:focus-visible .pmv2-poster {
        transform: translateY(-4px) scale(1.025);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pmv2 *,
    .pmv2 *::before,
    .pmv2 *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}


/* =========================================================
 * Pleximania Core 2.3.1 — Stable interactive homepage
 * Keeps the approved 2.2.1 layout while retaining 2.3 features.
 * ========================================================= */

.pmv2-featured-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 11px !important;
    margin-top: 21px !important;
}

.pmv2 .pmv2-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 42px !important;
    margin: 0 !important;
    padding: 10px 17px !important;
    border: 1px solid rgba(255,255,255,.28) !important;
    border-radius: 999px !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    text-transform: none !important;
    box-shadow: 0 8px 22px rgba(0,0,0,.32) !important;
    transition:
        transform .18s ease,
        background .18s ease,
        color .18s ease,
        border-color .18s ease,
        box-shadow .18s ease !important;
}

.pmv2 .pmv2-action:hover,
.pmv2 .pmv2-action:focus-visible {
    transform: translateY(-2px) !important;
    outline: none !important;
}

.pmv2 .pmv2-action-primary {
    border-color: var(--pm-accent) !important;
    background: var(--pm-accent) !important;
    color: #111 !important;
}

.pmv2 .pmv2-action-primary:hover,
.pmv2 .pmv2-action-primary:focus-visible {
    background: #f1ad19 !important;
    color: #111 !important;
    box-shadow: 0 10px 26px rgba(229,160,13,.27) !important;
}

.pmv2 .pmv2-action-secondary {
    background: rgba(10,10,10,.68) !important;
    color: #fff !important;
    backdrop-filter: blur(8px);
}

.pmv2 .pmv2-action-secondary:hover,
.pmv2 .pmv2-action-secondary:focus-visible {
    border-color: var(--pm-accent) !important;
    background: rgba(25,25,25,.92) !important;
    color: var(--pm-accent) !important;
}

.pmv2 .pmv2-card-action {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: fit-content !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 4px 0 0 !important;
    padding: 5px 8px !important;
    border: 1px solid rgba(255,255,255,.27) !important;
    border-radius: 999px !important;
    background: rgba(0,0,0,.62) !important;
    color: #fff !important;
    font-family: inherit !important;
    font-size: 9px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    text-transform: none !important;
    box-shadow: none !important;
    backdrop-filter: blur(6px);
}

.pmv2 .pmv2-card-action:hover,
.pmv2 .pmv2-card-action:focus-visible {
    border-color: var(--pm-accent) !important;
    background: var(--pm-accent) !important;
    color: #111 !important;
    outline: none !important;
}

.pmv2-card {
    animation: pmv2-card-in .32s ease both;
}

.pmv2-card:nth-child(2) { animation-delay: 30ms; }
.pmv2-card:nth-child(3) { animation-delay: 60ms; }
.pmv2-card:nth-child(4) { animation-delay: 90ms; }
.pmv2-card:nth-child(5) { animation-delay: 120ms; }
.pmv2-card:nth-child(6) { animation-delay: 150ms; }

@keyframes pmv2-card-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.pmv2-featured-bg {
    animation: pmv2-hero-drift 20s ease-in-out infinite alternate;
}

@keyframes pmv2-hero-drift {
    from { transform: scale(1.018); }
    to { transform: scale(1.045); }
}

@media (max-width: 767px) {
    .pmv2-featured-actions {
        gap: 8px !important;
        margin-top: 18px !important;
    }

    .pmv2 .pmv2-action {
        flex: 1 1 auto !important;
        min-height: 41px !important;
        padding: 9px 13px !important;
        font-size: 12px !important;
    }

    .pmv2 .pmv2-card-action {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pmv2-card,
    .pmv2-featured-bg {
        animation: none !important;
    }
}


/* =========================================================
 * Pleximania Core 2.4.0
 * Separate Popular and Coming Soon pages
 * ========================================================= */

/* Keep popularity ranking clear of source/rating artwork. */
.pmv2 .pmv2-badge.is-rank {
    left: auto !important;
    right: 9px !important;
    top: 9px !important;
}

/* Give each destination a matching but subtly distinct hero accent. */
.pmv2-page-popular .pmv2-kicker::after {
    content: " • What's Popular";
}

.pmv2-page-coming .pmv2-kicker::after {
    content: " • Coming Soon";
}

@media (max-width: 767px) {
    .pmv2 .pmv2-badge.is-rank {
        right: 7px !important;
        top: 7px !important;
    }
}


/* Pleximania Core 2.4.1 — final rank badge placement */
.pmv2-page-popular .pmv2-badge.is-rank,
.pmv2 .pmv2-badge.is-rank {
    top: 9px !important;
    right: 9px !important;
    bottom: auto !important;
    left: auto !important;
    z-index: 8 !important;
}

@media (max-width: 767px) {
    .pmv2-page-popular .pmv2-badge.is-rank,
    .pmv2 .pmv2-badge.is-rank {
        top: 7px !important;
        right: 7px !important;
    }
}


/* =========================================================
 * Pleximania Core 3.0.0 — Curated Homepage
 * ========================================================= */

.pmv3-home .pmv2-featured {
    margin-bottom: 30px;
}

.pmv3-quick-links {
    width: min(1600px, calc(100vw - 34px));
    margin: 0 auto 54px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.pmv3-quick-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    min-height: 118px;
    padding: 24px 26px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 16px;
    background:
        linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
        #171717;
    color: #fff !important;
    text-decoration: none !important;
    box-shadow: 0 15px 36px rgba(0,0,0,.28);
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}

.pmv3-quick-card:hover,
.pmv3-quick-card:focus-visible {
    transform: translateY(-4px);
    border-color: rgba(229,160,13,.74);
    background:
        linear-gradient(135deg, rgba(229,160,13,.12), rgba(255,255,255,.025)),
        #1a1a1a;
    box-shadow:
        0 20px 42px rgba(0,0,0,.42),
        0 0 0 1px rgba(229,160,13,.2);
    outline: none;
}

.pmv3-quick-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 14px;
    background: rgba(229,160,13,.14);
    color: var(--pm-accent);
    font-size: 29px;
    font-weight: 900;
}

.pmv3-quick-copy {
    display: grid;
    gap: 7px;
}

.pmv3-quick-copy strong {
    color: #fff;
    font-size: clamp(18px, 1.7vw, 24px);
    line-height: 1.15;
}

.pmv3-quick-copy > span {
    color: #b9b9b9;
    font-size: 13px;
    line-height: 1.45;
}

.pmv3-quick-arrow {
    color: var(--pm-accent);
    font-size: 28px;
    transition: transform .2s ease;
}

.pmv3-quick-card:hover .pmv3-quick-arrow,
.pmv3-quick-card:focus-visible .pmv3-quick-arrow {
    transform: translateX(5px);
}

.pmv3-preview-section {
    width: min(1600px, calc(100vw - 34px));
    margin: 0 auto 52px;
}

.pmv3-preview-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 14px;
}

.pmv3-preview-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(27px, 2.45vw, 39px);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -.03em;
}

.pmv3-view-all {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex: 0 0 auto;
    color: var(--pm-accent) !important;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none !important;
}

.pmv3-view-all span {
    transition: transform .18s ease;
}

.pmv3-view-all:hover span,
.pmv3-view-all:focus-visible span {
    transform: translateX(4px);
}

.pmv3-preview-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: clamp(14px, 1.3vw, 21px);
}

.pmv3-preview-grid .pmv2-card {
    min-width: 0;
}

@media (max-width: 1180px) {
    .pmv3-preview-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .pmv3-preview-grid .pmv2-card:nth-child(n+5) {
        display: none;
    }
}

@media (max-width: 767px) {
    .pmv3-quick-links,
    .pmv3-preview-section {
        width: calc(100vw - 18px);
    }

    .pmv3-quick-links {
        grid-template-columns: 1fr;
        gap: 12px;
        margin-bottom: 40px;
    }

    .pmv3-quick-card {
        min-height: 102px;
        padding: 18px;
    }

    .pmv3-quick-icon {
        width: 50px;
        height: 50px;
        font-size: 24px;
    }

    .pmv3-preview-section {
        margin-bottom: 42px;
    }

    .pmv3-preview-heading h2 {
        font-size: 26px;
    }

    .pmv3-view-all {
        font-size: 12px;
    }

    .pmv3-preview-grid {
        display: grid;
        grid-auto-flow: column;
        grid-auto-columns: minmax(142px, 42vw);
        grid-template-columns: none;
        gap: 14px;
        overflow-x: auto;
        padding: 10px 2px 22px;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }

    .pmv3-preview-grid::-webkit-scrollbar {
        display: none;
    }

    .pmv3-preview-grid .pmv2-card {
        display: block !important;
        scroll-snap-align: start;
    }
}

/* =========================================================
 * Pleximania Core 3.1.0 — Curated Homepage Polish
 * Safe override layer: preserves all existing Popular and
 * Coming Soon styling while refining the Homepage module.
 * ========================================================= */

/* Keep all Homepage modules aligned to the same width. */
.pmv3-home .pmv2-featured,
.pmv3-home .pmv3-quick-links,
.pmv3-home .pmv3-preview-section {
    width: min(1600px, calc(100vw - 34px));
}

/* Give the Homepage hero more visual impact. */
.pmv3-home .pmv2-featured {
    min-height: clamp(520px, 66vh, 740px);
    margin-bottom: 34px;
}

.pmv3-home .pmv2-featured-content {
    width: min(980px, 74%);
    padding: clamp(42px, 5.4vw, 82px);
}

.pmv3-home .pmv2-featured h1 {
    max-width: 16ch;
    font-size: clamp(52px, 5.7vw, 94px);
}

.pmv3-home .pmv2-featured-description {
    max-width: 680px;
    font-size: clamp(15px, 1.4vw, 19px);
}

/* Quick-link cards. */
.pmv3-home .pmv3-quick-links {
    gap: 20px;
    margin-bottom: 68px;
}

.pmv3-home .pmv3-quick-card {
    position: relative;
    gap: 20px;
    min-height: 136px;
    padding: 28px 30px;
    overflow: hidden;
    border-radius: 18px;
    box-shadow: 0 17px 40px rgba(0,0,0,.32);
    isolation: isolate;
    transition:
        transform .22s cubic-bezier(.2,.75,.3,1),
        border-color .22s ease,
        box-shadow .22s ease,
        background .22s ease;
}

.pmv3-home .pmv3-quick-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(
            circle at 8% 50%,
            rgba(229,160,13,.15),
            transparent 39%
        );
    opacity: .56;
    transition: opacity .22s ease;
}

.pmv3-home .pmv3-quick-card:hover,
.pmv3-home .pmv3-quick-card:focus-visible {
    border-color: rgba(229,160,13,.82);
    transform: translateY(-5px);
    box-shadow:
        0 24px 50px rgba(0,0,0,.46),
        0 0 0 1px rgba(229,160,13,.22),
        0 0 32px rgba(229,160,13,.10);
}

.pmv3-home .pmv3-quick-card:hover::before,
.pmv3-home .pmv3-quick-card:focus-visible::before {
    opacity: 1;
}

.pmv3-home .pmv3-quick-icon {
    width: 66px;
    height: 66px;
    border: 1px solid rgba(229,160,13,.22);
    border-radius: 16px;
    font-size: 32px;
    box-shadow: inset 0 0 20px rgba(229,160,13,.05);
    transition:
        transform .22s ease,
        background .22s ease,
        border-color .22s ease;
}

.pmv3-home .pmv3-quick-card:hover .pmv3-quick-icon,
.pmv3-home .pmv3-quick-card:focus-visible .pmv3-quick-icon {
    border-color: rgba(229,160,13,.52);
    background: rgba(229,160,13,.20);
    transform: scale(1.06);
}

.pmv3-home .pmv3-quick-copy {
    gap: 8px;
    min-width: 0;
}

.pmv3-home .pmv3-quick-copy strong {
    color: #fff !important;
    font-size: clamp(20px, 1.8vw, 27px);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -.025em;
}

.pmv3-home .pmv3-quick-copy > span {
    max-width: 58ch;
    color: #bdbdbd !important;
    font-size: 14px;
    line-height: 1.5;
}

.pmv3-home .pmv3-quick-arrow {
    font-size: 31px;
    font-weight: 800;
}

/* Preview sections. */
.pmv3-home .pmv3-preview-section {
    margin-bottom: 66px;
}

.pmv3-home .pmv3-preview-heading {
    gap: 22px;
    margin-bottom: 18px;
    padding-inline: 2px;
}

.pmv3-home .pmv3-preview-heading h2 {
    font-size: clamp(29px, 2.55vw, 41px);
}

.pmv3-home .pmv3-view-all {
    min-height: 36px;
    padding: 7px 2px;
    font-size: 14px;
    font-weight: 900;
}

.pmv3-home .pmv3-view-all span {
    font-size: 18px;
}

.pmv3-home .pmv3-preview-grid {
    gap: clamp(16px, 1.15vw, 19px);
}

.pmv3-home .pmv3-preview-grid .pmv2-poster {
    border-radius: 13px;
}

.pmv3-home .pmv3-preview-grid .pmv2-title {
    margin-top: 11px;
    font-size: 15px;
}

@media (max-width: 1180px) {
    .pmv3-home .pmv2-featured,
    .pmv3-home .pmv3-quick-links,
    .pmv3-home .pmv3-preview-section {
        width: min(100%, calc(100vw - 26px));
    }

    .pmv3-home .pmv2-featured {
        min-height: 570px;
    }

    .pmv3-home .pmv2-featured-content {
        width: min(850px, 80%);
    }
}

@media (max-width: 900px) {
    .pmv3-home .pmv3-quick-links {
        gap: 14px;
    }

    .pmv3-home .pmv3-quick-card {
        gap: 15px;
        min-height: 122px;
        padding: 22px;
    }

    .pmv3-home .pmv3-quick-icon {
        width: 56px;
        height: 56px;
        border-radius: 14px;
        font-size: 27px;
    }

    .pmv3-home .pmv3-quick-copy strong {
        font-size: 20px;
    }

    .pmv3-home .pmv3-quick-copy > span {
        font-size: 13px;
    }
}

@media (max-width: 767px) {
    .pmv3-home .pmv2-featured,
    .pmv3-home .pmv3-quick-links,
    .pmv3-home .pmv3-preview-section {
        width: calc(100vw - 18px);
    }

    .pmv3-home .pmv2-featured {
        min-height: 500px;
        margin-bottom: 24px;
    }

    .pmv3-home .pmv2-featured-content {
        width: 100%;
        padding: 30px 23px 38px;
    }

    .pmv3-home .pmv2-featured h1 {
        max-width: 13ch;
        font-size: clamp(39px, 11.5vw, 57px);
    }

    .pmv3-home .pmv3-quick-links {
        gap: 13px;
        margin-bottom: 48px;
    }

    .pmv3-home .pmv3-quick-card {
        gap: 14px;
        min-height: 108px;
        padding: 18px;
        border-radius: 15px;
    }

    .pmv3-home .pmv3-quick-icon {
        width: 52px;
        height: 52px;
        border-radius: 13px;
        font-size: 25px;
    }

    .pmv3-home .pmv3-quick-copy {
        gap: 5px;
    }

    .pmv3-home .pmv3-quick-copy strong {
        font-size: 18px;
    }

    .pmv3-home .pmv3-quick-copy > span {
        display: -webkit-box;
        overflow: hidden;
        font-size: 12px;
        line-height: 1.4;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

    .pmv3-home .pmv3-quick-arrow {
        font-size: 25px;
    }

    .pmv3-home .pmv3-preview-section {
        margin-bottom: 48px;
    }

    .pmv3-home .pmv3-preview-heading {
        align-items: center;
        gap: 12px;
        margin-bottom: 11px;
    }

    .pmv3-home .pmv3-preview-heading h2 {
        font-size: 26px;
    }

    .pmv3-home .pmv3-view-all {
        min-height: 32px;
        font-size: 12px;
        white-space: nowrap;
    }

    .pmv3-home .pmv3-view-all span {
        font-size: 15px;
    }

    .pmv3-home .pmv3-preview-grid {
        grid-auto-columns: minmax(148px, 42vw);
        overscroll-behavior-inline: contain;
        padding-bottom: 23px;
        scroll-behavior: smooth;
    }

    .pmv3-home .pmv3-preview-grid .pmv2-title {
        font-size: 13px;
    }

    .pmv3-home .pmv3-preview-grid .pmv2-meta {
        font-size: 11px;
    }
}

@media (max-width: 420px) {
    .pmv3-home .pmv3-quick-card {
        grid-template-columns: 46px minmax(0, 1fr) 18px;
        gap: 12px;
        min-height: 102px;
        padding: 15px;
    }

    .pmv3-home .pmv3-quick-icon {
        width: 46px;
        height: 46px;
        font-size: 22px;
    }

    .pmv3-home .pmv3-quick-copy strong {
        font-size: 17px;
    }

    .pmv3-home .pmv3-preview-heading h2 {
        font-size: 23px;
    }

    .pmv3-home .pmv3-preview-grid {
        grid-auto-columns: minmax(140px, 44vw);
    }
}

@media (prefers-reduced-motion: reduce) {
    .pmv3-home .pmv3-quick-card,
    .pmv3-home .pmv3-quick-card::before,
    .pmv3-home .pmv3-quick-icon,
    .pmv3-home .pmv3-quick-arrow,
    .pmv3-home .pmv3-view-all span {
        transition: none !important;
    }
}

/* =========================================================
 * Pleximania Core 3.1.0 — Final Homepage Polish
 * ========================================================= */

/* Show more of the featured artwork and reduce the zoomed-in feel. */
.pmv3-home .pmv2-featured-bg {
    object-position: center 20%;
    transform: scale(1.005);
    animation: pmv3-home-hero-drift 22s ease-in-out infinite alternate;
}

@keyframes pmv3-home-hero-drift {
    from { transform: scale(1.005); }
    to   { transform: scale(1.022); }
}

/* Move the hero copy closer to the left edge while keeping breathing room. */
.pmv3-home .pmv2-featured-content {
    padding-left: clamp(34px, 4vw, 62px);
}

/* Increase separation between the hero and quick-link cards. */
.pmv3-home .pmv2-featured {
    margin-bottom: 48px;
}

/* Slightly taller, darker quick-link cards with a stronger hover glow. */
.pmv3-home .pmv3-quick-card {
    min-height: 144px;
    background:
        linear-gradient(
            135deg,
            rgba(255,255,255,.045),
            rgba(255,255,255,.012)
        ),
        #141414;
}

.pmv3-home .pmv3-quick-card:hover,
.pmv3-home .pmv3-quick-card:focus-visible {
    background:
        linear-gradient(
            135deg,
            rgba(229,160,13,.145),
            rgba(255,255,255,.022)
        ),
        #181818;
    box-shadow:
        0 26px 54px rgba(0,0,0,.50),
        0 0 0 1px rgba(229,160,13,.30),
        0 0 42px rgba(229,160,13,.18);
}

@media (max-width: 1180px) {
    .pmv3-home .pmv2-featured-content {
        padding-left: clamp(30px, 4vw, 52px);
    }
}

@media (max-width: 767px) {
    .pmv3-home .pmv2-featured-bg {
        object-position: center 18%;
    }

    .pmv3-home .pmv2-featured-content {
        padding-left: 23px;
    }

    .pmv3-home .pmv2-featured {
        margin-bottom: 32px;
    }

    .pmv3-home .pmv3-quick-card {
        min-height: 112px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .pmv3-home .pmv2-featured-bg {
        animation: none !important;
    }
}

/* =========================================================
 * Pleximania Core 3.2.0 — Self-contained responsive hero
 * New class namespace intentionally avoids legacy 3.1.x rules.
 * ========================================================= */

/* Prevent Elementor/Astra shortcode wrappers from imposing height. */
.elementor-widget-shortcode:has(.pmv3-home),
.elementor-widget-shortcode:has(.pmv3-home) > .elementor-widget-container,
.entry-content:has(.pmv3-home) {
    min-height: 0 !important;
    height: auto !important;
}

.pmv3-home .pmv32-hero {
    container-type: inline-size;
    container-name: pmv32hero;
    position: relative;
    display: grid;
    width: min(
        1600px,
        calc(100vw - 34px),
        calc((100svh - 150px) * 2048 / 1365)
    );
    aspect-ratio: 2048 / 1365;
    min-height: 0;
    margin: 0 auto 48px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 20px;
    background: #090909;
    box-shadow: 0 24px 70px rgba(0,0,0,.48);
    isolation: isolate;
}

.pmv3-home .pmv32-hero-media {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    line-height: 0;
}

.pmv3-home .pmv32-hero-image {
    display: block;
    width: 100%;
    height: 100%;
    margin: 0;
    object-fit: contain;
    object-position: center;
    background: #090909;
}

.pmv3-home .pmv32-hero-shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(5,5,5,.90) 0%, rgba(5,5,5,.60) 24%, rgba(5,5,5,.15) 48%, transparent 66%),
        linear-gradient(0deg, rgba(5,5,5,.70) 0%, rgba(5,5,5,.18) 24%, transparent 48%);
    pointer-events: none;
}

.pmv3-home .pmv32-hero-content {
    position: absolute;
    left: clamp(28px, 3.4vw, 52px);
    bottom: clamp(46px, 5vw, 78px);
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    width: min(500px, 42%);
    max-width: 500px;
    min-height: 0;
    margin: 0;
    padding: 0;
    transform: translateY(60px);
}

.pmv3-home .pmv32-hero-kicker {
    margin: 0;
    color: var(--pm-accent);
    font-size: clamp(16px, 1.5vw, 21px);
    font-weight: 900;
    line-height: 1.2;
    letter-spacing: .05em;
    text-transform: uppercase;
    text-shadow: 0 3px 14px rgba(0,0,0,.9);
}

.pmv3-home .pmv32-hero-content p {
    max-width: 500px;
    margin: 0;
    color: #e1e1e1;
    font-size: clamp(15px, 1.35vw, 18px);
    font-weight: 650;
    line-height: 1.55;
    text-shadow: 0 3px 14px rgba(0,0,0,.95);
}

.pmv3-home .pmv32-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
    margin-top: 3px;
}

@media (max-width: 1180px) and (min-width: 768px) {
    .pmv3-home .pmv32-hero {
        width: min(
            calc(100vw - 26px),
            calc((100svh - 135px) * 2048 / 1365)
        );
    }

    .pmv3-home .pmv32-hero-content {
        left: 30px;
        bottom: 44px;
        width: min(450px, 46%);
        transform: translateY(44px);
        /* Fix: tighten vertical spacing so the shortened content column
           fits below the logo baked into the hero artwork instead of
           climbing up into it at this width. */
        gap: 8px !important;
    }

    /* Was previously hidden entirely at this width because the content
       column was too tall to fit below the logo without overlapping it.
       Bringing it back here, shrunk and clamped to 2 lines, so it still
       shows but takes up less vertical space. NEEDS a live visual check
       at ~870px after deploying — if it still overlaps, the next step
       is dropping -webkit-line-clamp to 1 or reducing font-size further. */
    .pmv3-home .pmv32-hero-content p {
        display: -webkit-box !important;
        overflow: hidden !important;
        margin: 0 !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    .pmv3-home .pmv32-hero-actions-grid {
        margin-top: 6px !important;
    }
}

@media (max-width: 767px) {
    .pmv3-home .pmv32-hero {
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
        width: calc(100vw - 18px) !important;
        aspect-ratio: auto !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 auto 32px !important;
        border-radius: 15px !important;
    }

    .pmv3-home .pmv32-hero-media {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: 2048 / 1365 !important;
    }

    .pmv3-home .pmv32-hero-image {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
    }

    .pmv3-home .pmv32-hero-shade {
        display: none !important;
    }

    .pmv3-home .pmv32-hero-content {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 18px 22px 28px !important;
        gap: 10px !important;
        background: #090909 !important;
        transform: none !important;
    }

    .pmv3-home .pmv32-hero-kicker {
        font-size: 14px !important;
    }

    .pmv3-home .pmv32-hero-actions {
        gap: 8px !important;
        margin-top: 3px !important;
    }
}

/* =========================================================
 * Pleximania Core 3.3.4 — Visible homepage hero action polish
 * Locked scope: hero buttons and desktop content position only.
 * ========================================================= */

/* Move only the desktop hero copy/action group upward by 20px. */
@media (min-width: 768px) {
    .pmv3-home .pmv32-hero-content {
        bottom: 86px !important;
        /* Fix: reset the leftover translateY(44px)/translateY(60px) offset
           inherited from earlier rules (the base .pmv32-hero-content rule
           and the 768–1180px block above) so the hero content doesn't get
           pushed further down and overlap the hero artwork/heading at
           narrower desktop/tablet-landscape widths (e.g. ~870px).
           !important guarantees this wins regardless of cascade order. */
        transform: translateY(0) !important;
    }
}

/* Fix: the 86px bottom offset above is sized for full desktop width,
   where the hero is tall enough to absorb it. At 768–1180px the hero is
   much shorter and the content box (kicker + 2-line description +
   buttons) grows upward from that bottom anchor far enough to overlap
   the logo baked into the artwork. This rule runs AFTER the 86px rule
   above (same specificity, later in source = wins) so it can pull the
   anchor down closer to the bottom edge for just this narrower range,
   giving the taller content room to grow without reaching the logo. */
@media (max-width: 1180px) and (min-width: 768px) {
    .pmv3-home .pmv32-hero-content {
        bottom: 22px !important;
    }
}

.pmv3-home .pmv32-hero-actions-grid {
    display: grid;
    grid-template-columns: repeat(2, 210px);
    gap: 10px 16px;
    justify-content: start;
    width: 436px;
    max-width: 100%;
    margin: 16px 0 0;
}

.pmv3-home .pmv32-hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    width: 210px;
    min-width: 0;
    min-height: 48px;
    padding: 10px 18px;
    border: 1px solid #ffffff;
    border-radius: 999px;
    background: rgba(10,10,10,.90);
    box-shadow: 0 9px 24px rgba(0,0,0,.34);
    color: #fff !important;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.1;
    text-align: left;
    text-decoration: none !important;
    white-space: nowrap;
    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease,
        background .18s ease;
}

.pmv3-home .pmv32-hero-button-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    color: #e5a00d;
}

.pmv3-home .pmv32-hero-button-icon svg {
    display: block;
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pmv3-home .pmv32-hero-button:nth-child(3) .pmv32-hero-button-icon svg {
    fill: currentColor;
    stroke: none;
    transform: scale(1.25);
}

.pmv3-home .pmv32-hero-button:hover,
.pmv3-home .pmv32-hero-button:focus-visible {
    border-color: #e5a00d;
    background: rgba(18,18,18,.97);
    box-shadow:
        0 0 0 1px rgba(229,160,13,.32),
        0 0 28px rgba(229,160,13,.38),
        0 12px 28px rgba(0,0,0,.42);
    color: #fff !important;
    outline: none;
    transform: translateY(-2px);
}

@media (max-width: 620px) {
    .pmv3-home .pmv32-hero-actions-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 10px;
        width: 100%;
        margin-top: 18px;
    }

    .pmv3-home .pmv32-hero-button {
        width: 100%;
        min-height: 48px;
        padding: 10px;
        gap: 11px;
        font-size: 12.5px;
        white-space: normal;
    }

    .pmv3-home .pmv32-hero-button-icon,
    .pmv3-home .pmv32-hero-button-icon svg {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
    }
}

@media (max-width: 390px) {
    .pmv3-home .pmv32-hero-actions-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
 * Calendar page — hide the page title entirely.
 * Only the nav bar and Organizr calendar should show.
 * ========================================================= */
#post-955 .entry-title {
    display: none;
}

/* =========================================================
 * Featured card "Request" button — match the Plex Requests
 * hero button style so it looks the same on Coming Soon and
 * Popular pages as it does on the homepage.
 * ========================================================= */
.pmv2-featured-actions .pmv32-hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 16px;
    width: auto;
    min-width: 0;
    min-height: 48px;
    padding: 10px 18px;
    border: 1px solid #ffffff;
    border-radius: 999px;
    background: rgba(10,10,10,.90);
    box-shadow: 0 9px 24px rgba(0,0,0,.34);
    color: #fff !important;
    font-size: 15px;
    font-weight: 850;
    line-height: 1.1;
    text-align: left;
    text-decoration: none !important;
    white-space: nowrap;
    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease,
        background .18s ease;
}

.pmv2-featured-actions .pmv32-hero-button-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 24px;
    width: 24px;
    height: 24px;
    color: #e5a00d;
}

.pmv2-featured-actions .pmv32-hero-button-icon svg {
    display: block;
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pmv2-featured-actions .pmv32-hero-button:hover,
.pmv2-featured-actions .pmv32-hero-button:focus-visible {
    border-color: #e5a00d;
    background: rgba(18,18,18,.97);
    box-shadow:
        0 0 0 1px rgba(229,160,13,.32),
        0 0 28px rgba(229,160,13,.38),
        0 12px 28px rgba(0,0,0,.42);
    color: #fff !important;
    outline: none;
    transform: translateY(-2px);
}

@media (max-width: 767px) {
    .pmv2-featured-actions .pmv32-hero-button {
        min-height: 41px;
        padding: 9px 14px;
        font-size: 12px;
        gap: 11px;
    }

    .pmv2-featured-actions .pmv32-hero-button-icon,
    .pmv2-featured-actions .pmv32-hero-button-icon svg {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
    }
}

/* =========================================================
 * Universal short-viewport fix — placed at the true end of this
 * file on purpose so it always wins the cascade over every rule
 * above, regardless of which width-based rule also matches.
 *
 * ROOT CAUSE (confirmed across landscape phone, landscape tablet,
 * and a regular desktop monitor with a shorter browser window):
 * .pmv32-hero's width has always been capped by a formula based on
 * viewport HEIGHT (100svh) — not just width — meant to keep the
 * hero from getting too tall on narrow/tall screens:
 *   width: min(1600px, calc(100vw - 34px), calc((100svh - Npx) * 2048 / 1365))
 * Whenever the browser window's HEIGHT is moderate or short — a
 * landscape phone, a landscape tablet, or simply a desktop browser
 * window that isn't very tall — that formula silently shrinks the
 * whole hero box down. The heading, description, and buttons don't
 * shrink to match, so they overflow the box and overlap the artwork.
 * This happens at ANY width; it was never actually a tablet-width
 * problem specifically.
 *
 * CORRECTION: an earlier version of this fix switched to the plain
 * stacked layout (image on top, black bar below) for almost every
 * window size below 1633px wide. That eliminated the overlap but
 * also threw away the intended overlay design (text sitting directly
 * on the artwork) for most normal browsing, which wasn't the goal —
 * only the overlap needed fixing, not the whole look.
 *
 * REAL FIX BELOW: instead of fixed pixel values (which only ever fit
 * one specific hero size), content position, spacing, and font sizes
 * now scale as PERCENTAGES/vw relative to the hero's own rendered
 * size. Since the hero's height is itself derived from its width via
 * a fixed image aspect ratio, sizing the content the same way keeps
 * it proportional to the artwork at every size in between — no more
 * whack-a-mole per breakpoint. The overlay design is preserved at
 * every size except genuinely extreme ones (handled by the narrow
 * true-emergency fallback further below), where scaling down to fit
 * would make text unreadably small — plain stacked layout is the
 * safer choice only in that narrow edge case.
 * ========================================================= */
@media (min-width: 768px) {
    .pmv3-home .pmv32-hero-content {
        left: 4% !important;
        bottom: 6% !important;
        width: min(540px, 42%) !important;
        transform: none !important;
        gap: clamp(6px, 1.1cqw, 14px) !important;
    }

    .pmv3-home .pmv32-hero-kicker {
        font-size: clamp(14px, 1.6cqw, 21px) !important;
    }

    .pmv3-home .pmv32-hero-content p {
        display: -webkit-box !important;
        overflow: hidden !important;
        margin: 0 !important;
        font-size: clamp(11px, 1.05cqw, 17px) !important;
        line-height: 1.4 !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
    }

    .pmv3-home .pmv32-hero-actions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: min(460px, 100%) !important;
        gap: clamp(8px, 0.9cqw, 16px) !important;
        margin-top: clamp(4px, 0.7cqw, 16px) !important;
    }

    .pmv3-home .pmv32-hero-button {
        width: 100% !important;
        min-height: clamp(36px, 4.2cqw, 48px) !important;
        padding: clamp(7px, 0.9cqw, 10px) clamp(8px, 1cqw, 16px) !important;
        gap: clamp(6px, 0.7cqw, 12px) !important;
        font-size: clamp(10.5px, 1cqw, 15px) !important;
        /* Fix: was "normal" (allowed wrapping) — real-world testing
           showed button labels wrapping mid-word at widths that were
           expected to have enough room. Rather than keep chasing the
           exact pixel width where wrapping starts, this guarantees it
           never happens on any desktop width from 768px up: text
           stays on one line and truncates cleanly with "…" in the
           rare case it's genuinely too tight, instead of wrapping. */
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* Fix: at narrower widths (roughly tablet-and-below), button labels
   like "Plex Requests" and "Release Dates" don't have enough room in
   the 2-column grid and were wrapping awkwardly mid-word.
   IMPORTANT: switching to a single column (tried first) makes the
   button block taller, which pushes the whole content box further
   upward into the logo artwork — trading the wrapping problem for a
   worse overlap problem, since content height and overlap risk are
   directly linked here. This version keeps the shorter 2-column
   layout (no added height) and instead: shrinks button text/padding
   further, uses a text-overflow ellipsis as a safety net so any
   remaining tight fit truncates cleanly instead of wrapping, and
   actively shrinks the kicker/description/spacing to reduce the
   content block's total height — which is what actually creates
   real clearance from the logo, regardless of the button layout. */
/* Scoped to desktop/mouse browsers only (pointer:fine + hover:hover)
   so this never applies to a touchscreen device — tablet or phone,
   even in landscape at this same pixel width — regardless of width.
   Width-only media queries can't tell a desktop window apart from a
   tablet at the same size; this explicitly can. */
@media (min-width: 768px) and (max-width: 1100px) and (pointer: fine) and (hover: hover) {
    .pmv3-home .pmv32-hero-content {
        bottom: 2.5% !important;
        gap: clamp(4px, 0.8cqw, 8px) !important;
    }

    .pmv3-home .pmv32-hero-kicker {
        display: -webkit-box !important;
        overflow: hidden !important;
        font-size: clamp(13px, 1.4cqw, 16px) !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 1 !important;
    }

    /* At this hero size there is not enough vertical room below the
       logo artwork for kicker + description + two rows of buttons
       together, even at minimum readable font sizes — this isn't a
       styling choice, it's a hard physical space constraint at this
       specific size. Hiding the description here (same tradeoff
       already used at true mobile widths) is what actually frees up
       enough room for the buttons to clear the artwork. */
    .pmv3-home .pmv32-hero-content p {
        display: none !important;
    }

    .pmv3-home .pmv32-hero-actions-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: clamp(5px, 0.7cqw, 8px) !important;
        margin-top: clamp(3px, 0.5cqw, 6px) !important;
    }

    .pmv3-home .pmv32-hero-button {
        gap: 6px !important;
        min-height: clamp(30px, 3.4cqw, 36px) !important;
        padding: 6px 8px !important;
        font-size: clamp(10px, 1cqw, 12px) !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .pmv3-home .pmv32-hero-button-icon {
        flex: 0 0 16px !important;
        width: 16px !important;
        height: 16px !important;
    }

    .pmv3-home .pmv32-hero-button-icon svg {
        width: 16px !important;
        height: 16px !important;
    }
}

/* =========================================================
 * True emergency fallback — extreme sizes only.
 * If the hero is so small (very short landscape phone, or a
 * genuinely tiny window) that even the fluid scaling above would
 * make text unreadable, fall back to the safe stacked layout. This
 * is intentionally a narrow trigger — most real-world sizes,
 * including a moderate desktop window, now stay on the fluid
 * overlay design above instead of dropping into this fallback.
 * ========================================================= */
@media (max-height: 420px) {
    .pmv3-home .pmv32-hero {
        position: relative !important;
        display: flex !important;
        flex-direction: column !important;
        width: calc(100vw - 18px) !important;
        aspect-ratio: auto !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        margin: 0 auto 24px !important;
        border-radius: 15px !important;
    }

    .pmv3-home .pmv32-hero-media {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: 2048 / 1365 !important;
    }

    .pmv3-home .pmv32-hero-image {
        width: 100% !important;
        height: 100% !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
    }

    .pmv3-home .pmv32-hero-shade {
        display: none !important;
    }

    .pmv3-home .pmv32-hero-content {
        position: relative !important;
        inset: auto !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 16px 20px 24px !important;
        gap: 6px !important;
        background: #090909 !important;
        transform: none !important;
    }

    .pmv3-home .pmv32-hero-kicker {
        font-size: 14px !important;
    }

    .pmv3-home .pmv32-hero-content p {
        display: -webkit-box !important;
        overflow: hidden !important;
        margin: 0 !important;
        font-size: 13px !important;
        line-height: 1.4 !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
    }

    .pmv3-home .pmv32-hero-actions,
    .pmv3-home .pmv32-hero-actions-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
        gap: 8px !important;
        margin-top: 4px !important;
    }

    .pmv3-home .pmv32-hero-button {
        width: 100% !important;
        min-height: 44px !important;
        padding: 9px 12px !important;
        font-size: 12px !important;
        white-space: normal !important;
    }
}