:root {
        --black: #111111;
        --dark: #191919;
        --gray: #6d6d6d;
        --light: #f4f4f2;
        --white: #ffffff;

        /* LOOPSTORE */
        --accent: #FFDD00;

        --border: #ddddda;
        --max-width: 1440px;
    }

    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    html {
        scroll-behavior: smooth;
    }

    body {
        font-family: Arial, Helvetica, sans-serif;
        color: var(--black);
        background: var(--white);
        line-height: 1.3;
    }

    a {
        color: inherit;
        text-decoration: none;
    }

    /* =========================
       NAVIGATION
    ========================== */

    nav {
        position: absolute;
        z-index: 10;
        top: 0;
        left: 0;
        width: 100%;
        padding: 28px 5%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: white;
    }

    .logo {
        font-size: 24px;
        font-weight: 700;
        letter-spacing: 1px;
    }

    .nav-links {
        display: flex;
        gap: 32px;
        align-items: center;
        font-size: 14px;
    }

    .nav-cta {
        background: var(--accent);
        color: var(--black);
        border: none;
        padding: 12px 20px;
        border-radius: 100px;
        font-weight: 600;
        transition: 0.25s ease;
    }

    .nav-cta:hover {
        transform: translateY(-2px);
    }

    /* =========================
       HERO
    ========================== */

    .hero {
        min-height: 100vh;
        position: relative;
        display: flex;
        align-items: center;
        overflow: hidden;
        color: white;

        background:
        linear-gradient(
            180deg,
            rgba(0,0,0,.62) 0%,
            rgba(0,0,0,.34) 48%,
            rgba(0,0,0,.48) 100%
        ),
        url("../images/4fbf8b0a2acaa304.png");

        background-size: cover;
        background-position: center;
    }

    .hero-content {
        width: 100%;
        max-width: var(--max-width);
        margin: auto;
        padding: 125px 5% 55px;
    }

    .eyebrow {
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 1.5px;
        opacity: .9;
        margin-bottom: 22px;
    }

    .hero .eyebrow {
        color: var(--accent);
    }

    .hero h1 {
        max-width: 760px;
        font-size: clamp(54px, 5.5vw, 86px);
        line-height: .98;
        letter-spacing: -3px;
        font-weight: 500;
        margin-bottom: 30px;
    }

    .hero-bottom {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 28px;
    }

    .hero-description {
        max-width: 520px;
        font-size: 19px;
        line-height: 1.45;
        color: rgba(255,255,255,.85);
    }

    .button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 17px 26px;
        border-radius: 100px;
        background: var(--accent);
        color: var(--black);
        font-size: 15px;
        font-weight: 700;
        transition: .25s ease;
        white-space: nowrap;
    }

    .button:hover {
        transform: translateY(-2px);
    }

    /* =========================
       INTRO
    ========================== */

    .intro {
        padding: 85px 5% 105px;
        max-width: var(--max-width);
        margin: auto;
    }

    .intro-grid {
        display: grid;
        grid-template-columns: .9fr 1.4fr;
        gap: 90px;
    }

    .section-label {
        font-size: 13px;
        text-transform: uppercase;
        letter-spacing: 1.2px;
        color: var(--gray);
    }

    .intro .section-label {
        color: #d6b900;
        font-weight: 700;
        padding-top: 24px;
        border-top: 1px solid var(--accent);
        max-width: 430px;
    }

    .intro h2,
    .section-title {
        font-size: clamp(38px, 4vw, 64px);
        line-height: 1;
        letter-spacing: -3px;
        font-weight: 500;
    }

    .intro-text {
        margin-top: 28px;
        max-width: 620px;
        font-size: 18px;
        line-height: 1.5;
        color: var(--gray);
    }

    /* =========================
       BIG STATEMENT
    ========================== */

    .statement {
        position: relative;
        color: white;
        padding: 160px 5%;
        min-height: 78vh;
        display: flex;
        align-items: flex-end;
        background:
            linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.58) 46%, rgba(0,0,0,.16) 100%),
            linear-gradient(180deg, rgba(0,0,0,.08) 35%, rgba(0,0,0,.48) 100%),
            url("../images/2481fe18e53f1535.jpg");
        background-size: cover;
        background-position: center;
    }

    .statement-inner {
        position: relative;
        z-index: 1;
        width: 100%;
        max-width: var(--max-width);
        margin: auto;
    }

    .statement h2 {
        max-width: 1100px;
        font-size: clamp(50px, 7vw, 105px);
        line-height: .95;
        letter-spacing: -4px;
        font-weight: 500;
    }

    .statement h2 span {
        color: var(--accent);
    }

    .statement p {
        margin-top: 50px;
        max-width: 540px;
        color: #bdbdbd;
        font-size: 20px;
        line-height: 1.5;
    }

    /* =========================
       BENEFITS / UNDER ONE ROOF
    ========================== */

    .benefits {
        padding: 150px 5%;
        background: var(--light);
    }

    .benefits-inner {
        max-width: var(--max-width);
        margin: auto;
    }

    .benefits-header {
        display: grid;
        grid-template-columns: .72fr 1.28fr;
        gap: 80px;
        align-items: end;
        margin-bottom: 75px;
    }

    .benefits-header h2 {
        font-size: clamp(48px, 6vw, 88px);
        line-height: .96;
        letter-spacing: -3.5px;
        font-weight: 500;
        max-width: 850px;
    }

    .benefits-lead {
        margin-top: 28px;
        max-width: 700px;
        color: var(--gray);
        font-size: 20px;
        line-height: 1.5;
    }

    .benefit-layout {
        display: grid;
        grid-template-columns: .82fr 1.7fr;
        gap: 2px;
    }

    .benefit-highlight {
        min-height: 500px;
        background: var(--accent);
        padding: 42px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .benefit-highlight .mini {
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 1.3px;
    }

    .benefit-highlight h3 {
        font-size: clamp(38px, 4vw, 62px);
        line-height: .98;
        letter-spacing: -2.5px;
        font-weight: 500;
    }

    .benefit-grid {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 2px;
    }

    .benefit {
        min-height: 249px;
        padding: 32px 34px;
        background: var(--white);
        display: flex;
        flex-direction: column;
        margin: 0;
        border: none;
    }

    .benefit-number {
        font-size: 13px;
        color: #a3a3a0;
        font-weight: 700;
        margin-bottom: auto;
    }

    .benefit h3 {
        font-size: 30px;
        line-height: 1.05;
        letter-spacing: -1.2px;
        font-weight: 500;
        margin-bottom: 14px;
    }

    .benefit p {
        max-width: 360px;
        color: var(--gray);
        font-size: 15px;
        line-height: 1.5;
    }

    /* =========================
       IMAGE STATEMENT
    ========================== */

    .image-statement {
        min-height: 85vh;
        position: relative;
        display: flex;
        align-items: flex-end;
        padding: 80px 5%;

        background:
        linear-gradient(
            90deg,
            rgba(0,0,0,.72) 0%,
            rgba(0,0,0,.38) 48%,
            rgba(0,0,0,.08) 100%
        ),
        url("../images/8859f3363cdbbc13.jpg");

        background-size: cover;
        background-position: center;
        color: white;
    }

    .image-statement-content {
        max-width: var(--max-width);
        width: 100%;
        margin: auto;
    }

    .image-statement h2 {
        max-width: 950px;
        font-size: clamp(48px, 6vw, 95px);
        line-height: .98;
        letter-spacing: -4px;
        font-weight: 500;
    }

    /* =========================
       PROCESS
    ========================== */

    .process {
        padding: 160px 5%;
        background: var(--light);
    }

    .process-inner {
        max-width: var(--max-width);
        margin: auto;
    }

    .process-header {
        display: grid;
        grid-template-columns: 1fr 1.5fr;
        gap: 80px;
        margin-bottom: 100px;
    }

    .process-description {
        max-width: 550px;
        font-size: 20px;
        color: var(--gray);
        margin-top: 25px;
    }

    .process-steps {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        border-top: 1px solid #cfcfca;
    }

    .step {
        padding: 35px 25px 0 0;
        min-height: 260px;
        border-right: 1px solid #cfcfca;
        margin-right: 25px;
    }

    .step:last-child {
        border-right: none;
    }

    .step-number {
        font-size: 14px;
        color: var(--accent);
        font-weight: 700;
        margin-bottom: 70px;
    }

    .step h3 {
        font-size: 26px;
        font-weight: 500;
        margin-bottom: 15px;
    }

    .step p {
        color: var(--gray);
        font-size: 15px;
        max-width: 220px;
    }

    /* =========================
       ONE SYSTEM
    ========================== */

    .one-system {
        padding: 160px 5%;
        max-width: var(--max-width);
        margin: auto;
    }

    .one-system-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 80px;
        align-items: center;
    }

    .system-visual {
        aspect-ratio: 1 / 1;
        background: #f4f4f2;
        position: relative;
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: 28px;
    }

    .system-visual::before {
        content: "PLATFORMA WCS";
        position: absolute;
        top: 34px;
        left: 36px;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 1.4px;
        color: #7b7b76;
        z-index: 10;
    }

    .system-center {
        position: absolute;
        width: 250px;
        height: 250px;
        border-radius: 50%;
        background: var(--accent);
        color: var(--black);
        left: 50%;
        top: 46%;
        transform: translate(-50%, -50%);
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        z-index: 8;
        box-shadow: 0 22px 60px rgba(0,0,0,.12);
    }

    .system-center small {
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 1.3px;
        margin-bottom: 9px;
        font-weight: 700;
    }

    .system-center strong {
        font-size: 28px;
        line-height: 1.05;
        letter-spacing: -1px;
        font-weight: 600;
    }

    .system-node {
        position: absolute;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-size: 13px;
        line-height: 1.15;
        font-weight: 600;
        padding: 16px;
        z-index: 3;
        border: 1px solid rgba(17,17,17,.08);
    }

    .node-1 {
        width: 190px;
        height: 190px;
        left: 8%;
        top: 20%;
        background: #242424;
        color: white;
    }

    .node-2 {
        width: 170px;
        height: 170px;
        right: 7%;
        top: 18%;
        background: #ffffff;
        color: var(--black);
    }

    .node-3 {
        width: 185px;
        height: 185px;
        left: 14%;
        bottom: 9%;
        background: #d9d9d4;
        color: var(--black);
    }

    .node-4 {
        width: 210px;
        height: 210px;
        right: 8%;
        bottom: 7%;
        background: #111111;
        color: white;
    }

    .node-5 {
        width: 128px;
        height: 128px;
        right: 3%;
        top: 43%;
        background: #ffffff;
        color: var(--black);
        z-index: 5;
    }

    .node-6 {
        width: 116px;
        height: 116px;
        left: 5%;
        top: 51%;
        background: #ffffff;
        color: var(--black);
        z-index: 5;
    }

    .system-content p {
        max-width: 540px;
        margin-top: 35px;
        color: var(--gray);
        font-size: 20px;
        line-height: 1.5;
    }

    /* =========================
       TECHNOLOGY
    ========================== */

    .technology {
        padding: 150px 5%;
        background: var(--black);
        color: white;
    }

    .technology-inner {
        max-width: var(--max-width);
        margin: auto;
    }

    .technology-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        gap: 40px;
        margin-bottom: 90px;
    }

    .technology p {
        max-width: 430px;
        color: #aaaaaa;
        font-size: 18px;
        line-height: 1.5;
    }

    .technology-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 2px;
    }

    .technology-card {
        min-height: 360px;
        padding: 35px;
        background: #202020;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        transition: .3s ease;
    }

    .technology-card:hover {
        background: var(--accent);
        color: var(--black);
    }

    .technology-card span {
        color: var(--accent);
        font-size: 13px;
        font-weight: 700;
        margin-bottom: 18px;
    }

    .technology-card:hover span {
        color: var(--black);
    }

    .technology-card h3 {
        font-size: 34px;
        font-weight: 500;
        letter-spacing: -1px;
    }

    /* =========================
       FINAL CTA
    ========================== */

    .final-cta {
        padding: 180px 5%;
        text-align: center;
        background: #FFDD00;
        color: #111111;
    }

    .final-cta h2 {
        max-width: 1000px;
        margin: auto;
        font-size: clamp(50px, 7vw, 105px);
        line-height: .95;
        letter-spacing: -4px;
        font-weight: 500;
    }

    .final-cta p {
        max-width: 500px;
        margin: 35px auto 45px;
        color: #333333;
        font-size: 19px;
        line-height: 1.5;
    }

    .final-cta .button {
        background: #111111;
        color: #ffffff;
    }

    /* =========================
       FOOTER
    ========================== */

    footer {
        padding: 50px 5%;
        background: var(--black);
        color: white;
        display: flex;
        justify-content: space-between;
        font-size: 14px;
    }

    /* =========================
       RESPONSIVE
    ========================== */

    @media (max-width: 900px) {

        nav {
            padding: 22px 6%;
        }

        .nav-links a:not(.nav-cta) {
            display: none;
        }

        .hero h1 {
            letter-spacing: -2px;
        }

        .hero-bottom {
            flex-direction: column;
            align-items: flex-start;
        }

        .intro,
        .statement,
        .benefits,
        .process,
        .one-system,
        .technology,
        .final-cta {
            padding-top: 100px;
            padding-bottom: 100px;
        }

        .intro-grid,
        .process-header,
        .one-system-grid {
            grid-template-columns: 1fr;
            gap: 40px;
        }

        .benefit-grid,
        .technology-grid {
            grid-template-columns: 1fr;
        }

        .benefits-header,
        .benefit-layout {
            grid-template-columns: 1fr;
            gap: 35px;
        }

        .benefit-highlight {
            min-height: 360px;
        }

        .benefit {
            min-height: 220px;
        }

        .benefit {
            margin-right: 0;
        }

        .benefit-number {
            margin-bottom: 45px;
        }

        .process-steps {
            grid-template-columns: 1fr 1fr;
        }

        .step {
            min-height: 220px;
        }

        .technology-header {
            flex-direction: column;
            align-items: flex-start;
        }

        footer {
            flex-direction: column;
            gap: 20px;
        }
    }

    @media (max-width: 600px) {

        .hero {
            min-height: 90vh;
        }

        .hero-content {
            padding-bottom: 45px;
        }

        .process-steps {
            grid-template-columns: 1fr;
        }

        .step {
            border-right: none;
            border-bottom: 1px solid #cfcfca;
            margin-right: 0;
            padding-bottom: 35px;
        }

        .step-number {
            margin-bottom: 40px;
        }

        .image-statement {
            min-height: 70vh;
        }

        .system-center {
            width: 180px;
            height: 180px;
        }

        .system-center strong {
            font-size: 22px;
        }

        .system-node {
            font-size: 10px;
            padding: 10px;
        }

        .node-1 { width: 130px; height: 130px; }
        .node-2 { width: 120px; height: 120px; }
        .node-3 { width: 125px; height: 125px; }
        .node-4 { width: 140px; height: 140px; }
        .node-5 { width: 90px; height: 90px; }
        .node-6 { width: 85px; height: 85px; }
    }


    .logo {
        display: inline-flex;
        align-items: center;
        width: 190px;
        line-height: 0;
    }

    .brand-logo {
        display: block;
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    nav .brand-logo {
        filter: drop-shadow(0 1px 5px rgba(255,255,255,.28))
                drop-shadow(0 2px 5px rgba(0,0,0,.18));
    }

    .footer-brand {
        width: 210px;
        line-height: 0;
    }

    footer {
        background: var(--light);
        color: var(--black);
        align-items: center;
    }

    @media (max-width: 600px) {
        .logo { width: 155px; }
        .footer-brand { width: 180px; }
    }


    /* ===== V10: Wszystko pod jednym dachem ===== */
    .benefits {
        background: var(--light);
    }

    .benefit-grid {
        gap: 18px;
        border-top: none;
        align-items: stretch;
    }

    .benefit {
        margin-right: 0;
        padding: 0;
        border: 1px solid #e1e1dc;
        border-radius: 24px;
        overflow: hidden;
        background: #fff;
        min-height: 340px;
        display: flex;
        flex-direction: column;
        transition: transform .3s ease, box-shadow .3s ease;
    }

    .benefit:hover {
        transform: translateY(-5px);
        box-shadow: 0 18px 45px rgba(0,0,0,.08);
    }

    .benefit-number {
        width: 52px;
        height: 34px;
        border-radius: 100px;
        background: var(--accent);
        color: var(--black);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 24px 24px 55px;
        font-size: 13px;
    }

    .benefit h3 {
        padding: 0 24px;
        margin-bottom: 12px;
        font-size: 29px;
    }

    .benefit p {
        padding: 0 24px 28px;
        max-width: none;
        margin-top: auto;
    }

    /* If the section contains the special yellow lead tile, preserve it as the anchor. */
    .benefit.lead-benefit,
    .benefit:first-child:has(.lead-copy) {
        background: var(--accent);
        color: var(--black);
        border-color: var(--accent);
    }

    .benefit.lead-benefit p,
    .benefit:first-child:has(.lead-copy) p {
        color: rgba(17,17,17,.72);
    }

    @media (max-width: 900px) {
        .benefit-grid { gap: 14px; }
        .benefit { min-height: 280px; }
    }
    @media (min-width: 1100px) {
        .benefits .benefit-grid {
            grid-template-columns: repeat(4, 1fr);
        }
    }


    /* ===== V12: visual capability cards ===== */
    .benefits .benefit-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 18px;
        border-top: 0;
        margin-top: 48px;
    }

    .cap-card {
        background: #fff;
        border: 1px solid #e2e2dd;
        border-radius: 24px;
        overflow: hidden;
        min-width: 0;
        transition: transform .3s ease, box-shadow .3s ease;
    }

    .cap-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 18px 45px rgba(0,0,0,.08);
    }

    .cap-image {
        height: 180px;
        position: relative;
        overflow: hidden;
        border-radius: 23px 23px 18px 18px;
        background: #ddd;
    }

    .cap-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .cap-number {
        position: absolute;
        top: 16px;
        left: 16px;
        min-width: 48px;
        height: 34px;
        padding: 0 14px;
        border-radius: 999px;
        background: var(--accent);
        color: var(--black);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 12px;
        font-weight: 700;
    }

    .cap-body {
        padding: 20px 20px 18px;
    }

    .cap-body h3 {
        font-size: 24px;
        line-height: 1.08;
        letter-spacing: -.7px;
        margin: 0 0 16px;
    }

    .cap-bottom {
        display: flex;
        gap: 14px;
        align-items: flex-end;
    }

    .cap-bottom p {
        color: var(--gray);
        font-size: 14px;
        line-height: 1.5;
        margin: 0;
        flex: 1;
    }

    .cap-arrow {
        width: 38px;
        height: 38px;
        flex: 0 0 38px;
        border-radius: 50%;
        border: 1px solid #deded8;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 20px;
        color: var(--black);
    }

    @media (max-width: 1050px) {
        .benefits .benefit-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    @media (max-width: 600px) {
        .benefits .benefit-grid {
            grid-template-columns: 1fr;
        }
        .cap-image { height: 210px; }
    }


    /* ===== V13: 2x2 square capability cards ===== */
    .benefits .benefit-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 22px;
        max-width: 980px;
        margin-left: auto;
        margin-right: auto;
    }

    .cap-card {
        min-height: 360px;
        aspect-ratio: 1.08 / 1;
        border-radius: 28px;
        position: relative;
        display: flex;
        flex-direction: column;
        background: #fff;
    }

    .cap-image {
        height: 52%;
        min-height: 180px;
        border-radius: 27px 27px 22px 22px;
    }

    .cap-body {
        padding: 22px 24px 24px;
        flex: 1;
        display: flex;
        flex-direction: column;
    }

    .cap-body h3 {
        font-size: 27px;
        margin-bottom: 12px;
    }

    .cap-bottom {
        margin-top: auto;
    }

    .cap-number {
        top: 18px;
        left: 18px;
    }

    /* Round the yellow "Od pierwszej koncepcji..." tile if it exists elsewhere on the page */
    .lead-benefit,
    .yellow-lead,
    .concept-card {
        border-radius: 28px !important;
        overflow: hidden;
    }

    @media (max-width: 760px) {
        .benefits .benefit-grid {
            grid-template-columns: 1fr;
            max-width: 520px;
        }
        .cap-card {
            aspect-ratio: auto;
            min-height: 420px;
        }
    }


    /* ===== V14: compact 2x2 cards with generated imagery ===== */
    .benefits .benefit-grid {
        max-width: 900px;
        gap: 16px;
    }

    .cap-card {
        min-height: 0;
        aspect-ratio: auto;
        border-radius: 24px;
    }

    .cap-image {
        height: 168px;
        min-height: 168px;
        border-radius: 23px 23px 18px 18px;
    }

    .cap-body {
        padding: 14px 18px 16px;
        min-height: 138px;
    }

    .cap-body h3 {
        font-size: 23px;
        line-height: 1.05;
        margin: 0 0 7px;
    }

    .cap-bottom {
        gap: 10px;
        align-items: flex-end;
    }

    .cap-bottom p {
        font-size: 13px;
        line-height: 1.38;
    }

    .cap-arrow {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
        font-size: 18px;
    }

    .cap-number {
        top: 13px;
        left: 13px;
        min-width: 44px;
        height: 30px;
        padding: 0 12px;
    }

    /* Yellow concept tile: same visual height/radius language as the compact cards. */
    .yellow-box {
        border-radius: 24px !important;
        min-height: 322px !important;
        height: auto !important;
        overflow: hidden;
    }

    @media (max-width: 760px) {
        .cap-card { min-height: 0; }
        .cap-image { height: 180px; min-height: 180px; }
        .yellow-box { min-height: 0 !important; }
    }


/* ===== V15 FINAL OVERRIDE — compact cards, 2x2 ===== */

.benefit-layout{
    display:grid !important;
    grid-template-columns:minmax(250px,.72fr) minmax(0,2fr) !important;
    gap:18px !important;
    align-items:start !important;
}

/* Yellow card — same height and corner radius as one white card */
.benefit-highlight{
    min-height:292px !important;
    height:292px !important;
    border-radius:24px !important;
    overflow:hidden !important;
    padding:26px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:space-between !important;
    box-sizing:border-box !important;
}

.benefit-highlight h3{
    margin:0 !important;
    font-size:34px !important;
    line-height:1.04 !important;
    letter-spacing:-1.4px !important;
}

.benefit-highlight .mini{
    margin:0 !important;
}

/* Four cards, exactly 2 x 2 */
.benefits .benefit-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:16px !important;
    max-width:none !important;
    width:100% !important;
    margin:0 !important;
}

/* Compact card */
.benefits .cap-card{
    min-height:292px !important;
    height:292px !important;
    aspect-ratio:auto !important;
    border-radius:24px !important;
    overflow:hidden !important;
    display:flex !important;
    flex-direction:column !important;
    background:#fff !important;
}

/* Image sits directly above the copy */
.benefits .cap-image{
    height:154px !important;
    min-height:154px !important;
    flex:0 0 154px !important;
    margin:0 !important;
    border-radius:23px 23px 17px 17px !important;
    overflow:hidden !important;
}

.benefits .cap-image img{
    width:100% !important;
    height:100% !important;
    display:block !important;
    object-fit:cover !important;
}

/* Much smaller image-to-text spacing */
.benefits .cap-body{
    padding:10px 16px 13px !important;
    min-height:0 !important;
    flex:1 !important;
    display:flex !important;
    flex-direction:column !important;
}

.benefits .cap-body h3{
    margin:0 0 5px !important;
    padding:0 !important;
    font-size:21px !important;
    line-height:1.05 !important;
    letter-spacing:-.55px !important;
}

.benefits .cap-bottom{
    margin-top:0 !important;
    gap:8px !important;
    align-items:flex-end !important;
    flex:1 !important;
}

.benefits .cap-bottom p{
    margin:0 !important;
    padding:0 !important;
    font-size:12.5px !important;
    line-height:1.32 !important;
}

.benefits .cap-arrow{
    width:31px !important;
    height:31px !important;
    flex:0 0 31px !important;
    font-size:16px !important;
}

.benefits .cap-number{
    top:12px !important;
    left:12px !important;
    min-width:42px !important;
    height:29px !important;
    padding:0 11px !important;
}

/* Responsive */
@media(max-width:1000px){
    .benefit-layout{
        grid-template-columns:1fr !important;
    }
    .benefit-highlight{
        width:100% !important;
        height:auto !important;
        min-height:220px !important;
    }
}

@media(max-width:700px){
    .benefits .benefit-grid{
        grid-template-columns:1fr !important;
    }
    .benefits .cap-card{
        height:auto !important;
        min-height:280px !important;
    }
}


/* ===== V16 — EXACT "Wszystko pod jednym dachem" MOCKUP LAYOUT ===== */
.roof-section{
    padding:110px 4% !important;
    background:#f5f5f3 !important;
}
.roof-layout{
    max-width:1420px;
    margin:0 auto;
    display:grid;
    grid-template-columns:440px minmax(0,1fr);
    gap:26px;
    align-items:stretch;
}
.roof-left{
    display:grid;
    grid-template-rows:1fr 390px;
    gap:22px;
}
.roof-intro{
    padding:24px 0 0;
}
.roof-intro .eyebrow{
    font-size:12px;
    letter-spacing:3.2px;
    color:#747474;
    margin-bottom:28px;
}
.roof-intro h2{
    margin:0;
    font-size:58px;
    line-height:1.03;
    letter-spacing:-2.8px;
    font-weight:650;
}
.roof-intro p{
    margin:30px 0 0;
    color:#737373;
    font-size:21px;
    line-height:1.42;
}
.roof-yellow-card{
    background:#ffdd00;
    border-radius:24px;
    padding:28px 30px 28px;
    display:flex;
    flex-direction:column;
    box-sizing:border-box;
    min-height:390px;
}
.roof-yellow-number{
    font-size:18px;
    font-weight:700;
    margin-bottom:14px;
}
.roof-yellow-card h3{
    margin:0;
    font-size:36px;
    line-height:1.04;
    letter-spacing:-1.4px;
    font-weight:650;
}
.roof-yellow-bottom{
    margin-top:auto;
    display:flex;
    gap:18px;
    align-items:flex-end;
}
.roof-yellow-bottom p{
    margin:0;
    max-width:310px;
    font-size:15px;
    line-height:1.48;
}
.roof-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:repeat(2,390px);
    gap:22px;
}
.roof-card{
    background:#fff;
    border-radius:24px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    min-width:0;
    box-shadow:0 12px 35px rgba(0,0,0,.025);
}
.roof-photo{
    position:relative;
    height:255px;
    flex:0 0 255px;
    overflow:hidden;
    border-radius:24px 24px 18px 18px;
}
.roof-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.roof-badge{
    position:absolute;
    top:20px;
    left:20px;
    min-width:72px;
    height:50px;
    padding:0 18px;
    box-sizing:border-box;
    border-radius:999px;
    background:#ffdd00;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    font-weight:700;
}
.roof-copy{
    padding:17px 24px 20px;
    display:flex;
    flex-direction:column;
    flex:1;
}
.roof-copy h3{
    margin:0 0 7px;
    font-size:25px;
    line-height:1.05;
    letter-spacing:-.8px;
}
.roof-card-bottom{
    display:flex;
    gap:14px;
    align-items:flex-end;
    margin-top:auto;
}
.roof-card-bottom p{
    margin:0;
    color:#666;
    font-size:15px;
    line-height:1.35;
    max-width:330px;
}
.roof-arrow{
    width:52px;
    height:52px;
    flex:0 0 52px;
    border:1px solid #cfcfcb;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:31px;
    line-height:1;
    color:#111;
}
.roof-yellow-card .roof-arrow{
    border-color:rgba(17,17,17,.3);
}
@media(max-width:1150px){
    .roof-layout{grid-template-columns:1fr;}
    .roof-left{grid-template-columns:1fr 1fr;grid-template-rows:auto;}
    .roof-grid{grid-template-rows:repeat(2,360px);}
    .roof-yellow-card{min-height:360px;}
}
@media(max-width:760px){
    .roof-section{padding:70px 5% !important;}
    .roof-left{grid-template-columns:1fr;}
    .roof-intro h2{font-size:44px;}
    .roof-intro p{font-size:18px;}
    .roof-grid{grid-template-columns:1fr;grid-template-rows:none;}
    .roof-card{min-height:360px;}
    .roof-photo{height:220px;flex-basis:220px;}
    .roof-yellow-card{min-height:350px;}
}


/* ===== V19 — yellow final CTA ===== */
.yellow-cta{
    background:#ffdd00 !important;
    color:#111 !important;
}
.yellow-cta h2,
.yellow-cta h3,
.yellow-cta p,
.yellow-cta .eyebrow{
    color:#111 !important;
}
.yellow-cta .btn,
.yellow-cta .cta-button,
.yellow-cta a[class*="btn"]{
    background:#111 !important;
    color:#fff !important;
    border-color:#111 !important;
}


/* ===== V21 — final transparent LoopStore logos ===== */
.logo{
    width:190px !important;
    display:inline-flex !important;
    align-items:center !important;
    line-height:0 !important;
}
.header-logo-img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    object-fit:contain !important;
    filter:none !important;
    background:transparent !important;
}
.footer-brand{
    width:140px !important; /* approx. 2/3 smaller than previous footer logo */
    line-height:0 !important;
}
.footer-logo-img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    object-fit:contain !important;
    filter:none !important;
    background:transparent !important;
}
@media(max-width:600px){
    .logo{width:155px !important;}
    .footer-brand{width:120px !important;}
}


/* V23 — WCS: obecna wizualizacja + komunikat + screen platformy */
.one-system-v23{max-width:1500px!important;padding:150px 4%!important}
.wcs-v23-grid{display:grid;grid-template-columns:minmax(300px,.9fr) minmax(280px,.72fr) minmax(500px,1.55fr);gap:22px;align-items:stretch}
.wcs-v23-old,.wcs-v23-copy,.wcs-v23-screen{min-height:500px;border-radius:28px;overflow:hidden}
.wcs-v23-old .system-visual{width:100%;height:100%;min-height:500px;aspect-ratio:auto}
.wcs-v23-copy{background:#ffdd00;padding:42px 34px;display:flex;flex-direction:column;justify-content:center}
.wcs-v23-copy .section-label{color:#111!important}
.wcs-v23-copy .section-title{font-size:40px;line-height:1.04;margin-bottom:25px}
.wcs-v23-copy p{color:#222;font-size:16px;line-height:1.55}
.wcs-v23-screen{margin:0;background:#f4f4f2;display:flex;flex-direction:column}
.wcs-v23-screen img{width:100%;height:100%;flex:1;min-height:0;object-fit:cover;display:block}
.wcs-v23-screen figcaption{padding:13px 18px;background:#f4f4f2;color:#666;font-size:12px}
@media(max-width:1200px){.wcs-v23-grid{grid-template-columns:1fr 1fr}.wcs-v23-screen{grid-column:1/-1;min-height:520px}}
@media(max-width:760px){.wcs-v23-grid{grid-template-columns:1fr}.wcs-v23-screen{grid-column:auto;min-height:340px}.wcs-v23-old,.wcs-v23-copy{min-height:360px}}


/* V24 — show full WCS screenshot, including left menu */
.wcs-v23-screen{
    background:#f4f4f2 !important;
}
.wcs-v23-screen img{
    width:100% !important;
    height:auto !important;
    flex:none !important;
    object-fit:contain !important;
    object-position:center center !important;
    display:block !important;
}
.wcs-v23-screen{
    justify-content:center !important;
}


/* V25 — WCS: only message + real platform screen */
.wcs-v23-old{
    display:none !important;
}
.wcs-v23-grid{
    grid-template-columns:minmax(300px,.62fr) minmax(620px,1.6fr) !important;
    gap:22px !important;
}
.wcs-v23-copy{
    min-height:500px !important;
}
.wcs-v23-screen{
    min-height:500px !important;
}
.wcs-v23-screen img{
    width:100% !important;
    height:auto !important;
    object-fit:contain !important;
    object-position:center center !important;
}
@media(max-width:1000px){
    .wcs-v23-grid{
        grid-template-columns:1fr !important;
    }
    .wcs-v23-copy{
        min-height:330px !important;
    }
    .wcs-v23-screen{
        min-height:0 !important;
    }
}


/* v39: Produkujemy — zdjęcie wypełnia kadr bez białych pasów */
@media (min-width: 769px) {
  .roof-section .roof-grid > .roof-card:nth-child(2) .roof-photo img {
    object-fit: cover !important;
    object-position: center center !important;
    transform: scale(1.035) !important;
  }
}
@media (max-width: 768px) {
  .roof-section .roof-grid > .roof-card:nth-child(2) .roof-photo img {
    object-fit: cover !important;
    object-position: center center !important;
  }
}


.language-switch {display:inline-flex;align-items:center;padding:3px;border:1px solid rgba(255,255,255,.45);border-radius:100px;gap:2px;flex-shrink:0;}
.language-switch a {padding:7px 10px;border-radius:100px;font-size:12px;font-weight:700;line-height:1;transition:background .2s,color .2s;}
.language-switch a[aria-current="page"] {background:var(--accent);color:var(--black);}
.language-switch a:hover {background:white;color:var(--black);}
.footer-meta {display:flex;align-items:center;gap:24px;flex-wrap:wrap;}
.footer-copyright {white-space:nowrap;font-size:13px;}
.footer-social {display:flex;align-items:center;gap:10px;}
.social-link {display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid currentColor;border-radius:50%;}
.social-link svg {width:18px;height:18px;fill:currentColor;}
.social-link[href]:hover {background:var(--accent);color:var(--black);border-color:var(--accent);}
nav a:focus-visible,footer a:focus-visible {outline:2px solid var(--accent);outline-offset:4px;}
@media (max-width:1000px) {nav {gap:18px;flex-wrap:wrap;} .nav-links {gap:18px;flex-wrap:wrap;justify-content:flex-end;} footer {gap:24px;flex-wrap:wrap;}}
@media (max-width:600px) {nav {padding:20px 5%;} .nav-links {width:100%;justify-content:flex-start;gap:12px 16px;font-size:13px;} .nav-cta {padding:10px 14px;} .language-switch a {padding:7px 8px;} .hero-content {padding-top:210px;} .footer-meta {gap:18px;}}


.nav-social {display:flex;align-items:center;gap:8px;flex-shrink:0;}
.nav-social .social-link {width:34px;height:34px;color:inherit;}
.nav-social .social-link svg {width:16px;height:16px;}
.nav-social .social-link[href]:hover {background:var(--accent);color:var(--black);border-color:var(--accent);}


.social-link,
.nav-social .social-link {
    appearance:none;display:inline-flex;align-items:center;justify-content:center;
    width:42px;height:42px;padding:0;border:1px solid var(--accent);
    border-radius:12px;background:var(--accent);color:var(--black);
    cursor:pointer;box-shadow:0 2px 5px rgba(0,0,0,.12);
    transition:background .2s,transform .2s,box-shadow .2s;
}
.social-link:hover,
.nav-social .social-link:hover {background:#ffe84d;border-color:#ffe84d;transform:translateY(-2px);box-shadow:0 4px 9px rgba(0,0,0,.2);}
.social-link:active,
.nav-social .social-link:active {transform:translateY(0);box-shadow:none;}
.social-link:focus-visible {outline:2px solid currentColor;outline-offset:4px;}
.social-link svg,
.nav-social .social-link svg {width:19px;height:19px;fill:currentColor;}


/* LoopStore v31 — roof section rebuilt from v30; images displayed without cropping */
.roof-section {padding:clamp(64px,8vw,112px) max(24px,calc((100vw - 1320px)/2)) !important;display:flex !important;flex-direction:column !important;gap:32px !important;background:#f4f4f2 !important;}
.roof-section>.roof-intro{max-width:940px !important;margin:0 0 12px !important;}
.roof-section>.roof-intro h2{margin:12px 0 16px !important;}
.roof-section>.roof-intro p{max-width:690px !important;line-height:1.55 !important;}
.roof-section .roof-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:24px !important;width:100% !important;}
.roof-section .roof-card{display:flex !important;flex-direction:column !important;overflow:hidden !important;min-width:0 !important;border-radius:22px !important;background:white !important;box-shadow:none !important;height:auto !important;}
.roof-section .roof-photo{height:auto !important;min-height:0 !important;aspect-ratio:auto !important;display:flex !important;align-items:center !important;justify-content:center !important;background:#ededeb !important;overflow:visible !important;padding:16px !important;}
.roof-section .roof-photo img{display:block !important;position:static !important;width:100% !important;height:auto !important;max-height:390px !important;object-fit:contain !important;object-position:center !important;transform:none !important;filter:none !important;border-radius:10px !important;}
.roof-section .roof-card-content{display:flex !important;gap:18px !important;align-items:flex-start !important;padding:24px 28px 30px !important;}
.roof-section .roof-number{flex:0 0 auto !important;position:static !important;margin-top:3px !important;}
.roof-section .roof-copy{padding:0 !important;display:block !important;flex:1 !important;}
.roof-section .roof-copy h3{margin:0 0 9px !important;font-size:clamp(21px,2vw,28px) !important;line-height:1.2 !important;}
.roof-section .roof-card-bottom{position:static !important;margin:0 !important;padding:0 !important;}
.roof-section .roof-card-bottom p{margin:0 !important;line-height:1.55 !important;}
.roof-section>.roof-yellow-card{width:100% !important;min-height:0 !important;display:grid !important;grid-template-columns:minmax(240px,1fr) 1.3fr !important;align-items:center !important;gap:32px !important;padding:34px 44px !important;border-radius:22px !important;background:#ffdd00 !important;}
.roof-section>.roof-yellow-card h3{margin:0 !important;font-size:clamp(24px,2.5vw,36px) !important;line-height:1.14 !important;}
.roof-section>.roof-yellow-card .roof-yellow-bottom{position:static !important;margin:0 !important;padding:0 !important;}
.roof-section>.roof-yellow-card p{margin:0 !important;line-height:1.55 !important;}
@media(max-width:760px){.roof-section .roof-grid{grid-template-columns:1fr !important;}.roof-section>.roof-yellow-card{grid-template-columns:1fr !important;padding:28px !important;}.roof-section .roof-card-content{padding:22px !important;}}


/* v32: full illustrations, no cropped photos or numbering */
.roof-section .roof-badge{display:none!important}
.roof-section .roof-photo{display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;background:#f2f2f0!important;height:auto!important;min-height:220px!important;aspect-ratio: 1.65 / 1!important}
.roof-section .roof-photo img{width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;display:block!important}
.roof-section .roof-copy{padding:22px 24px 26px!important}
.roof-section .roof-copy h3{margin:0 0 12px!important}


/* v33 — sekcja Wszystko pod jednym dachem */
.roof-section{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(260px,.68fr)!important;gap:24px 42px!important;align-items:center!important}
.roof-section>.roof-intro{grid-column:1!important;grid-row:1!important;margin:0!important;padding:0!important;max-width:none!important}
.roof-section>.roof-yellow-card-inline{grid-column:2!important;grid-row:1!important;min-height:0!important;height:auto!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:30px 34px!important;margin:0!important;border-radius:22px!important}
.roof-section>.roof-yellow-card-inline h3{font-size:clamp(23px,2.7vw,40px)!important;line-height:1.12!important;margin:0!important;letter-spacing:-.7px!important}
.roof-section>.roof-header-end{display:none!important}
.roof-section>.roof-grid{grid-column:1/-1!important;grid-row:2!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:auto!important;gap:24px!important;margin:16px 0 0!important}
.roof-section .roof-card{height:auto!important;min-height:0!important;border-radius:20px!important;overflow:hidden!important;background:#fff!important;display:flex!important;flex-direction:column!important}
.roof-section .roof-photo{height:auto!important;min-height:0!important;aspect-ratio:auto!important;overflow:hidden!important;display:block!important;padding:0!important;background:#f4f4f2!important;border-radius:20px 20px 0 0!important;flex:none!important}
.roof-section .roof-photo img{width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;display:block!important;position:static!important;transform:none!important}
.roof-section .roof-copy{display:grid!important;grid-template-columns:minmax(120px,.72fr) 2px minmax(0,1.28fr)!important;align-items:center!important;gap:18px!important;padding:22px 24px!important;min-height:92px!important}
.roof-section .roof-copy h3{font-size:clamp(20px,1.7vw,27px)!important;line-height:1.12!important;margin:0!important;letter-spacing:-.6px!important}
.roof-section .roof-copy .roof-divider{width:2px!important;height:56px!important;min-height:42px!important;background:#ffdd00!important}
.roof-section .roof-copy p{font-size:clamp(13px,1vw,16px)!important;line-height:1.42!important;margin:0!important;color:#555!important}
@media(max-width:850px){.roof-section{grid-template-columns:1fr!important}.roof-section>.roof-intro,.roof-section>.roof-yellow-card-inline,.roof-section>.roof-grid{grid-column:1!important;grid-row:auto!important}.roof-section>.roof-grid{grid-template-columns:1fr!important}.roof-section .roof-copy{grid-template-columns:minmax(110px,.7fr) 2px 1.3fr!important}}
@media(max-width:480px){.roof-section .roof-copy{gap:12px!important;padding:18px!important}.roof-section .roof-copy h3{font-size:19px!important}.roof-section .roof-copy p{font-size:13px!important}}


/* v34: clean, image-first presentation of four stages */
.roof-section{display:block!important;max-width:none!important;padding:100px max(5%,calc((100% - 1440px)/2))!important;background:#f5f5f3!important}
.roof-section>.roof-intro{display:block!important;max-width:900px!important;margin:0 0 42px!important;padding:0!important}
.roof-section>.roof-intro h2{font-size:clamp(42px,5vw,70px)!important;line-height:1.05!important}
.roof-section>.roof-intro p{max-width:760px!important;margin-top:18px!important;font-size:clamp(17px,1.5vw,22px)!important;line-height:1.4!important}
.roof-section>.roof-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:auto!important;gap:26px!important;width:100%!important;max-width:1440px!important;margin:0 auto!important;align-items:start!important}
.roof-section .roof-card{display:flex!important;flex-direction:column!important;min-width:0!important;min-height:0!important;height:auto!important;background:#fff!important;border:1px solid #e6e6e2!important;border-radius:18px!important;overflow:hidden!important;box-shadow:none!important}
.roof-section .roof-photo{width:100%!important;height:auto!important;min-height:0!important;aspect-ratio:unset!important;flex:none!important;padding:0!important;display:block!important;overflow:hidden!important;border-radius:0!important;background:#f1f1ee!important}
.roof-section .roof-photo img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center!important;position:static!important;transform:none!important;border-radius:0!important}
.roof-section .roof-copy{display:grid!important;grid-template-columns:minmax(135px,.85fr) 2px minmax(0,1.35fr)!important;align-items:center!important;gap:22px!important;padding:25px 28px!important;min-height:100px!important;box-sizing:border-box!important}
.roof-section .roof-copy h3{font-size:clamp(21px,1.8vw,28px)!important;line-height:1.15!important;letter-spacing:-.7px!important;margin:0!important;font-weight:650!important}
.roof-section .roof-copy .roof-divider{display:block!important;width:2px!important;height:54px!important;background:#ffdd00!important;min-height:0!important}
.roof-section .roof-copy p{font-size:clamp(14px,1.05vw,16px)!important;line-height:1.5!important;margin:0!important;color:#555!important;max-width:none!important}
.roof-section .roof-badge,.roof-section .roof-number,.roof-section .roof-arrow{display:none!important}
@media(max-width:900px){.roof-section{padding:72px 5%!important}.roof-section>.roof-grid{grid-template-columns:1fr!important;gap:22px!important}.roof-section .roof-copy{grid-template-columns:minmax(125px,.7fr) 2px minmax(0,1.3fr)!important}}
@media(max-width:480px){.roof-section .roof-copy{grid-template-columns:1fr!important;gap:12px!important;padding:20px!important}.roof-section .roof-copy .roof-divider{width:55px!important;height:2px!important}.roof-section .roof-copy h3{font-size:23px!important}}

/* v35 — ujednolicona typografia według sekcji WCS */
.roof-section .roof-intro h2{font-size:40px!important;line-height:1.04!important;letter-spacing:-2px!important;font-weight:500!important;margin:12px 0 25px!important;}
.roof-section .roof-intro p{font-size:18px!important;line-height:1.55!important;font-weight:400!important;letter-spacing:normal!important;margin:0!important;}
.roof-section .roof-copy h3{font-size:23px!important;line-height:1.15!important;letter-spacing:-.6px!important;font-weight:500!important;}
.roof-section .roof-card-bottom p{font-size:15px!important;line-height:1.55!important;font-weight:400!important;letter-spacing:normal!important;}
@media(max-width:650px){.roof-section .roof-intro h2{font-size:36px!important;letter-spacing:-1.6px!important;}.roof-section .roof-copy h3{font-size:21px!important;}}


/* v36 — naprzemienne sekcje zdjęcie / tekst */
.roof-section .roof-grid{display:flex!important;flex-direction:column!important;grid-template-columns:none!important;gap:36px!important;max-width:1360px!important;margin:35px auto 0!important;width:100%!important}
.roof-section .roof-card{display:grid!important;grid-template-columns:minmax(0,1.22fr) minmax(300px,.78fr)!important;align-items:center!important;gap:clamp(24px,4vw,70px)!important;padding:0!important;min-height:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;overflow:visible!important}
.roof-section .roof-card:nth-child(even){grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr)!important}
.roof-section .roof-card:nth-child(even) .roof-photo{grid-column:2!important;grid-row:1!important}
.roof-section .roof-card:nth-child(even) .roof-copy{grid-column:1!important;grid-row:1!important}
.roof-section .roof-photo{width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;flex:none!important;aspect-ratio:auto!important;border-radius:18px!important;overflow:hidden!important;background:#f5f5f3!important}
.roof-section .roof-photo img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center!important;aspect-ratio:auto!important}
.roof-section .roof-copy{display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:flex-start!important;gap:16px!important;padding:12px 0!important;min-height:0!important;max-width:430px!important;background:transparent!important}
.roof-section .roof-copy h3{font-size:clamp(28px,3vw,43px)!important;line-height:1.09!important;letter-spacing:-.045em!important;font-weight:750!important;margin:0!important}
.roof-section .roof-copy .roof-divider{display:block!important;width:58px!important;height:4px!important;background:#ffdd00!important;flex:none!important}
.roof-section .roof-card-bottom{display:block!important;margin:0!important;padding:0!important}
.roof-section .roof-copy p{font-size:clamp(16px,1.35vw,19px)!important;line-height:1.55!important;margin:0!important;max-width:36ch!important}
@media(max-width:760px){.roof-section .roof-grid{gap:36px!important}.roof-section .roof-card,.roof-section .roof-card:nth-child(even){display:flex!important;flex-direction:column!important;gap:14px!important}.roof-section .roof-card:nth-child(even) .roof-photo,.roof-section .roof-card:nth-child(even) .roof-copy{grid-column:auto!important;grid-row:auto!important}.roof-section .roof-card:nth-child(even) .roof-photo{order:0!important}.roof-section .roof-card:nth-child(even) .roof-copy{order:1!important}.roof-section .roof-copy{max-width:none!important;width:100%!important;padding:12px 3px!important}.roof-section .roof-copy h3{font-size:29px!important}}



/* v37 — wspólna oś zdjęć, spójna typografia ze wzorcem intro */
.roof-section>.roof-intro{max-width:1360px!important;margin:0 auto 46px!important;width:100%!important}
.roof-section>.roof-intro h2{font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(38px,4vw,64px)!important;line-height:1!important;letter-spacing:-3px!important;font-weight:500!important;margin:12px 0 25px!important}
.roof-section>.roof-intro p{font-size:18px!important;line-height:1.5!important;font-weight:400!important;letter-spacing:normal!important}
.roof-section .roof-grid{gap:42px!important;max-width:1360px!important;margin:0 auto!important}
.roof-section .roof-card,.roof-section .roof-card:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:clamp(28px,5vw,72px)!important;align-items:center!important}
.roof-section .roof-photo{width:100%!important;height:390px!important;min-height:390px!important;max-height:390px!important;display:flex!important;align-items:center!important;justify-content:center!important;background:#fff!important;border-radius:16px!important;overflow:hidden!important}
.roof-section .roof-photo img{width:100%!important;height:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center center!important}
.roof-section .roof-copy{max-width:480px!important;gap:16px!important;padding:0!important;font-family:Arial,Helvetica,sans-serif!important}
.roof-section .roof-copy h3{font-family:Arial,Helvetica,sans-serif!important;font-size:clamp(30px,3vw,40px)!important;line-height:1.08!important;letter-spacing:-1.5px!important;font-weight:500!important}
.roof-section .roof-copy p{font-family:Arial,Helvetica,sans-serif!important;font-size:18px!important;line-height:1.5!important;font-weight:400!important;letter-spacing:normal!important;color:#6d6d6d!important}
@media(max-width:760px){
.roof-section>.roof-intro h2{font-size:clamp(38px,8vw,52px)!important;letter-spacing:-2px!important}
.roof-section .roof-card,.roof-section .roof-card:nth-child(even){display:flex!important;flex-direction:column!important;gap:16px!important}
.roof-section .roof-photo{height:clamp(220px,60vw,370px)!important;min-height:0!important;max-height:none!important}
.roof-section .roof-copy{width:100%!important;max-width:none!important;padding:0 2px!important}
.roof-section .roof-copy h3{font-size:30px!important}
.roof-section .roof-copy p{font-size:17px!important}
}


/* v38 — równe marginesy i kolumny sekcji, nowe zdjęcia */
.roof-section{box-sizing:border-box!important;padding-left:clamp(24px,5vw,80px)!important;padding-right:clamp(24px,5vw,80px)!important}
.roof-section>.roof-intro,.roof-section>.roof-grid{width:100%!important;max-width:1320px!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box!important}
.roof-section .roof-card,.roof-section .roof-card:nth-child(even){display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;column-gap:clamp(28px,5vw,72px)!important;width:100%!important;box-sizing:border-box!important}
.roof-section .roof-card>.roof-photo,.roof-section .roof-card>.roof-card-content{min-width:0!important;width:100%!important;box-sizing:border-box!important}
.roof-section .roof-card>.roof-card-content{display:flex!important;align-items:center!important;justify-content:flex-start!important;padding:0!important;margin:0!important}
.roof-section .roof-card:nth-child(odd)>.roof-photo{grid-column:1!important;grid-row:1!important}
.roof-section .roof-card:nth-child(odd)>.roof-card-content{grid-column:2!important;grid-row:1!important}
.roof-section .roof-card:nth-child(even)>.roof-card-content{grid-column:1!important;grid-row:1!important}
.roof-section .roof-card:nth-child(even)>.roof-photo{grid-column:2!important;grid-row:1!important}
.roof-section .roof-card:nth-child(even)>.roof-card-content{justify-content:flex-start!important}
.roof-section .roof-photo{padding:0!important}
.roof-section .roof-photo img{object-fit:contain!important}
@media(max-width:760px){
.roof-section .roof-card,.roof-section .roof-card:nth-child(even){display:flex!important;flex-direction:column!important;gap:16px!important}
.roof-section .roof-card>.roof-photo,.roof-section .roof-card:nth-child(even)>.roof-photo{order:0!important}
.roof-section .roof-card>.roof-card-content,.roof-section .roof-card:nth-child(even)>.roof-card-content{order:1!important}
}


/* Career content only: header, footer, logos and social controls retain v39 styles. */
.career-hero{min-height:100svh;background:#ffdd00!important;color:#111;isolation:isolate;}
.career-machines{pointer-events:none;user-select:none;position:absolute;z-index:-1;right:0;bottom:3%;width:78%;height:85%;object-fit:contain;object-position:right center;mix-blend-mode:multiply;}
.career-hero .hero-content{position:relative;z-index:1;padding-top:180px;padding-bottom:70px;user-select:text;-webkit-user-select:text;}
.career-hero h1{font-size:clamp(52px,5.7vw,86px);max-width:50%;}
.career-hero h1 span,.career-hero .eyebrow{color:#111;}
.career-hero .hero-description{color:#282600;max-width:43%;font-size:18px;line-height:1.6;}
.career-hero .hero-description+p{margin-top:18px;}
.career-hero .button{background:#111;color:#fff;}
.career-actions{display:flex;align-items:center;gap:26px;margin-top:34px;flex-wrap:wrap;}
.career-more{font-size:14px;text-decoration:underline;text-underline-offset:5px;}
.career-more span{margin-left:8px;}
.career-people{background:#f4f4f2;min-height:90svh;display:flex;align-items:center;padding:110px 5%;}
.career-inner{width:100%;max-width:1296px;margin:auto;}
.career-people .eyebrow{color:#111;margin-bottom:38px;}
.career-people h2{font-size:clamp(52px,5.7vw,86px);line-height:1;letter-spacing:-3px;font-weight:500;max-width:1100px;}
.career-people h2 span{display:block;}
.career-copy{display:grid;grid-template-columns:1fr 1fr;gap:60px;border-top:1px solid rgba(17,17,17,.28);padding-top:30px;margin-top:55px;}
.career-copy p{max-width:560px;font-size:18px;line-height:1.55;color:#333;}
@media(max-width:900px){.career-hero .hero-content{padding-top:230px;padding-bottom:540px;}.career-hero h1,.career-hero .hero-description{max-width:100%;}.career-machines{width:100%;height:480px;bottom:25px;}.career-hero{min-height:1100px;}.career-copy{grid-template-columns:1fr;gap:22px;}.career-people{padding:85px 6%;}}
@media(max-width:600px){.career-hero h1,.career-people h2{font-size:49px;letter-spacing:-2px;}.career-hero .hero-content{padding-bottom:390px;padding-left:6%;padding-right:6%;}.career-machines{width:130%;max-width:none;height:370px;right:0;bottom:15px;}.career-hero{min-height:100svh;}.career-copy{margin-top:35px;}}


/* V7: team illustration and menu contrast on the yellow hero. */
nav{color:#873600;}
nav .language-switch{border-color:currentColor;}
.career-team{margin:48px 0 0;width:100%;}
.career-team img{display:block;width:100%;height:auto;mix-blend-mode:multiply;opacity:.74;}


/* V8: full-section team illustration behind selectable HTML copy. */
.career-people{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;}
.career-people .career-inner{position:relative;z-index:0;}
.career-people .career-inner{position:static;}
.career-team{position:absolute;inset:0;margin:0;width:100%;height:100%;z-index:-1;pointer-events:none;}
.career-team img{width:100%;height:100%;object-fit:cover;object-position:center;opacity:.16;mix-blend-mode:multiply;}
.career-people .eyebrow,.career-people h2,.career-people .career-copy{position:relative;z-index:1;}
.career-copy p{color:#333;}
@media(max-width:760px){.career-team img{object-position:center;opacity:.12;}}

#aplikuj .contact-wrap{max-width:1440px;margin:auto;padding:68px 5% 90px}#aplikuj .contact-top{padding-bottom:44px;border-bottom:1px solid #444}#aplikuj .contact-top .eyebrow{color:#ffdd00}#aplikuj .contact-top .application-title{font-weight:500;font-size:clamp(44px,5.7vw,82px);line-height:1.02;letter-spacing:-.045em}#aplikuj .contact-top .application-title span{color:#ffdd00}#aplikuj .contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(36px,6vw,90px);padding-top:48px}#aplikuj .contact-intro h2{font-size:clamp(28px,3vw,42px);font-weight:500;line-height:1.1;letter-spacing:-.035em}#aplikuj .contact-intro p{font-size:18px;color:#bdbdbd;line-height:1.6;margin-top:22px;max-width:410px}#aplikuj .contact-note{margin-top:42px;padding-top:24px;border-top:1px solid #444}#aplikuj .contact-note span{color:#ffdd00;font-size:12px;text-transform:uppercase;letter-spacing:1.4px}#aplikuj .contact-note p{font-size:15px}#aplikuj .contact-form{background:#f4f4f2;color:#111;border-radius:16px;padding:clamp(22px,3.3vw,48px)}#aplikuj .contact-form h2{font-size:28px;font-weight:500;letter-spacing:-1px;margin-bottom:10px}#aplikuj .form-intro{color:#6d6d6d;font-size:14px;line-height:1.5;margin-bottom:28px}#aplikuj .fields{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px}#aplikuj .field{min-width:0}#aplikuj .field.full{grid-column:1/-1}#aplikuj .field label{display:block;font-size:13px;font-weight:600;margin-bottom:9px}#aplikuj .optional{font-weight:400;color:#6d6d6d}#aplikuj input,#aplikuj select,#aplikuj textarea{width:100%;font:inherit;font-size:15px;color:#111;background:white;border:1px solid #d3d3ce;border-radius:8px;padding:14px;min-height:49px}#aplikuj textarea{resize:vertical;min-height:150px;line-height:1.5}#aplikuj input:focus-visible,#aplikuj select:focus-visible,#aplikuj textarea:focus-visible{outline:2px solid #111;outline-offset:2px}#aplikuj .form-bottom{margin-top:24px}#aplikuj .form-bottom p{font-size:12px;color:#6d6d6d;line-height:1.5;margin-bottom:20px}#aplikuj .contact-form button{border:0;cursor:pointer;font-family:inherit;gap:28px}#aplikuj .contact-form button:focus-visible,#aplikuj a:focus-visible{outline:2px solid #c7ab00;outline-offset:5px}#aplikuj .form-status{margin-top:18px;font-size:14px;line-height:1.5}#aplikuj .next-step{background:#ffdd00;color:#111;padding:64px 5%}#aplikuj .next-inner{max-width:1296px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}#aplikuj .next-step h2{font-size:clamp(32px,3.8vw,52px);font-weight:500;line-height:1.04;letter-spacing:-.04em}#aplikuj .next-step p{font-size:18px;line-height:1.55}@media(max-width:850px){#aplikuj .contact-grid,#aplikuj .next-inner{grid-template-columns:1fr}#aplikuj .contact-intro p{max-width:600px}#aplikuj .contact-note{margin-top:24px}#aplikuj .contact-wrap{padding-top:48px}#aplikuj .next-inner{gap:24px}}@media(max-width:520px){#aplikuj .fields{grid-template-columns:1fr}#aplikuj .field.full{grid-column:auto}#aplikuj .contact-wrap{padding-bottom:48px}#aplikuj .nav-links{gap:12px}#aplikuj .nav-cta{padding:12px 15px;font-size:12px}#aplikuj .next-step{padding:44px 5%}}
@media(min-width:901px){#aplikuj .contact-wrap{flex:1;width:100%;padding:22px 5%;display:flex;align-items:center}#aplikuj .contact-grid{width:100%;padding:0;gap:clamp(32px,5vw,72px);align-items:center}#aplikuj .contact-top{padding:0;border:0}#aplikuj .contact-top .eyebrow{margin-bottom:16px;font-size:12px}#aplikuj .contact-top .application-title{font-size:clamp(36px,3.7vw,58px);line-height:1.03;max-width:530px}#aplikuj .contact-intro p{font-size:15px;line-height:1.5;margin-top:18px;max-width:475px}#aplikuj .contact-note{margin-top:24px;padding-top:18px;max-width:475px}#aplikuj .contact-note p{font-size:13px;margin-top:10px}#aplikuj .contact-form{padding:24px 28px;border-radius:14px}#aplikuj .contact-form h2{font-size:24px;line-height:1.12;margin-bottom:6px}#aplikuj .form-intro{font-size:12px;margin-bottom:15px}#aplikuj .fields{gap:12px 16px}#aplikuj .field label{font-size:12px;margin-bottom:5px}#aplikuj input,#aplikuj select,#aplikuj textarea{padding:10px 12px;min-height:39px;font-size:14px;border-radius:6px}#aplikuj textarea{min-height:80px;height:80px}#aplikuj .form-bottom{margin-top:13px;display:flex;align-items:center;gap:18px;justify-content:space-between}#aplikuj .form-bottom p{font-size:10px;line-height:1.4;margin:0;max-width:270px}#aplikuj .contact-form .button{padding:12px 19px;font-size:13px;gap:16px;flex-shrink:0}#aplikuj .form-status:empty{display:none}#aplikuj .form-status{margin-top:10px;font-size:12px}#aplikuj .next-step{padding:20px 5%;flex:0 0 auto}#aplikuj .next-inner{grid-template-columns:1fr 1fr;gap:42px}#aplikuj .next-step h2{font-size:clamp(26px,2.5vw,36px);line-height:1.06}#aplikuj .next-step h2 br{display:none}#aplikuj .next-step p{font-size:14px;line-height:1.45}}@media(min-width:901px) and (max-height:740px){#aplikuj .contact-wrap{padding-top:14px;padding-bottom:14px}#aplikuj .contact-top .application-title{font-size:40px}#aplikuj .contact-form{padding:18px 24px}#aplikuj .contact-form h2{font-size:22px}#aplikuj .fields{gap:9px 14px}#aplikuj .form-intro{margin-bottom:10px}#aplikuj textarea{min-height:65px;height:65px}#aplikuj .contact-note{margin-top:18px;padding-top:14px}#aplikuj .next-step{padding-top:15px;padding-bottom:15px}}@media(max-width:900px){#aplikuj .contact-top{padding-bottom:0;border:0}#aplikuj .contact-top .application-title{font-size:clamp(36px,6vw,56px);max-width:620px}#aplikuj .contact-grid{padding-top:0}#aplikuj .contact-wrap{padding-top:32px}}
#aplikuj{background:#111;color:white;scroll-margin-top:24px;}#aplikuj .contact-wrap{padding-top:80px;padding-bottom:80px;}#aplikuj .contact-top .application-title{font-size:clamp(36px,3.7vw,58px);}#aplikuj .button{background:#ffdd00;color:#111;}