/* ==========================================================================
   Manawa Flow — optymalizacja Full HD (1920×1080)
   Nakładka dla wszystkich serwisów marki. Na ekranach 2K+ pozostaje szerszy
   układ (1400px); na Full HD i mniejszych desktopach — 1200px + mniejsze odstępy.
   ========================================================================== */

/* --- Szerokość: widok do 1920px --- */
@media screen and (max-width: 1920px) {
    :root {
        --layout-max: 1200px;
        --layout-gutter: 24px;
        --page-breathe: 24px;
        --page-inline: 24px;
        --nav-offset: 76px;
        --section-y: 72px;
        --hero-pad-top: 108px;
        --hero-pad-bottom: 48px;
        --content-max: 1200px;
        --shell-max: 1200px;
        --ca-shell-max: 1080px;
        --ca-workspace-max: 960px;
        --kolo-w: 1080px;
    }

    .nav-box,
    .navbar .nav-box {
        max-width: 1200px;
        padding-left: 0;
        padding-right: 0;
    }

    .navbar {
        padding-left: var(--layout-gutter, 24px);
        padding-right: var(--layout-gutter, 24px);
    }

    .container {
        max-width: 1080px;
    }

    .container-narrow {
        max-width: 760px;
    }

    .footer-inner,
    .footer-grid-wrap,
    .footer-content {
        max-width: 1200px;
    }

    .landing-nav-inner,
    .landing-nav .landing-nav-inner {
        max-width: 1200px;
    }

    .cookie-alert-content,
    .mf-cookie-inner {
        max-width: 1200px;
    }

    .intro-wrapper,
    .intro-brand {
        max-width: 1200px;
    }

    .legal-page-wrap {
        width: min(1080px, calc(100% - 48px));
    }

    .shop-main,
    .product-view,
    .cart-view,
    .checkout-view {
        width: min(var(--layout-max, 1200px), calc(100% - 2 * var(--layout-gutter, 24px)));
    }

    .blog-article {
        max-width: 900px;
    }

    .library-wrap {
        max-width: 900px;
    }

    .thank-you-wrapper-wide {
        max-width: 1200px;
    }

    .offer-shell,
    .program-layout {
        max-width: 1200px;
    }
}

/* --- Wysokość: ekrany 1080p (ograniczona przestrzeń pionowa) --- */
@media screen and (max-height: 1080px) and (min-width: 993px) {
    :root {
        --page-breathe: 20px;
        --section-y: 64px;
        --hero-pad-top: 96px;
        --hero-pad-bottom: 40px;
        --nav-offset: 72px;
    }

    .hero,
    .hero-brand-welcome,
    .hero-rich,
    .brand-hero-rich,
    .brand-page .brand-hero-rich,
    .coaching-hero,
    .page-hero {
        min-height: auto;
        max-height: none;
        padding-top: var(--hero-pad-top);
        padding-bottom: var(--hero-pad-bottom);
    }

    .hero:not(.shop-hero) {
        min-height: min(72vh, 780px);
    }

    /* Platforma — landing */
    .landing-page .hero,
    body > .hero:first-of-type {
        min-height: auto;
        padding-top: 110px;
        padding-bottom: 56px;
    }

    .hero-visual {
        min-height: 320px;
    }

    body > .hero,
    main > .hero:first-child {
        min-height: min(72vh, 780px);
    }

    .section,
    .section-padding,
    .competence-section {
        padding-top: var(--section-y);
        padding-bottom: var(--section-y);
    }

    h1 {
        font-size: clamp(2rem, 3.8vw, 2.75rem);
        margin-bottom: 1.1rem;
    }

    h2 {
        font-size: clamp(1.65rem, 3vw, 2.1rem);
        margin-bottom: 1.2rem;
    }

    body {
        font-size: 16px;
    }

    .nav-links {
        gap: 16px;
    }

    .nav-item {
        font-size: 0.8rem;
    }

    .btn-nav-light,
    .btn-nav-dark {
        padding: 10px 18px;
        min-width: 108px;
        font-size: 0.7rem;
    }

    .brand-logo {
        height: 42px;
    }

    .shop-hero-inner {
        padding: 32px 36px 28px;
    }

    .shop-hero-title {
        font-size: clamp(1.85rem, 3.5vw, 2.5rem);
    }

    .bento-grid {
        gap: 20px;
    }

    .card-bento {
        padding: 28px 22px;
    }

    .content-area {
        padding: 20px 24px;
    }

    .sidebar {
        width: 240px;
    }

    .offer-page-wrap,
    .panel-login-split {
        min-height: auto;
    }

    .intro-wrapper {
        min-height: auto;
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .gateway-grid {
        gap: 20px;
    }

    .kolo-hero {
        padding-top: 108px;
        padding-bottom: 36px;
    }
}

/* --- Bezpieczeństwo layoutu na Full HD --- */
@media screen and (max-width: 1920px) {
    html {
        overflow-x: clip;
    }

    body {
        overflow-x: clip;
    }

    .bento-grid,
    .products-grid,
    .blog-grid,
    .footer-grid,
    .gateway-grid {
        gap: clamp(16px, 2vw, 24px);
    }

    .nav-actions {
        gap: 8px;
        margin-left: 12px;
    }

    .product-card-grid,
    .shop-catalog-grid {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    }
}

/* --- Wąskie desktopy tuż pod Full HD (1280–1366px) --- */
@media screen and (max-width: 1366px) and (min-width: 993px) {
    :root {
        --layout-max: 1120px;
        --layout-gutter: 20px;
    }

    .nav-box {
        max-width: 1120px;
    }

    .container {
        max-width: 1020px;
    }

    .nav-links {
        gap: 12px;
    }

    .nav-item {
        font-size: 0.75rem;
        letter-spacing: 0.6px;
    }
}