@charset "UTF-8";

.page-onas {
    --offer-lines-gora:  0;
    --offer-lines-dol:   auto;
    --offer-lines-lewo:  auto;
    --offer-lines-prawo: 0;
    --offer-lines-szer:  100%;
    --offer-lines-h:     52rem;
    --offer-lines-kolor: rgba(var(--rgb-ink-footer-lt), 0.2);
    --offer-lines-skala: 100% 100%;
    --offer-lines-wygas: linear-gradient(#000, #000);
    --offer-lines-img: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%20480%20352%27%20preserveAspectRatio%3D%27none%27%20fill%3D%27none%27%20stroke-width%3D%271.25%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20gradientUnits%3D%27userSpaceOnUse%27%20x1%3D%27480%27%20y1%3D%270%27%20x2%3D%270%27%20y2%3D%27352%27%3E%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23000%27%20stop-opacity%3D%270%27%2F%3E%3Cstop%20offset%3D%270.14%27%20stop-color%3D%27%23000%27%20stop-opacity%3D%270.08%27%2F%3E%3Cstop%20offset%3D%270.4%27%20stop-color%3D%27%23000%27%20stop-opacity%3D%271%27%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%27gx%27%20gradientUnits%3D%27userSpaceOnUse%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%27480%27%20y2%3D%270%27%3E%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23000%27%2F%3E%3Cstop%20offset%3D%270.09%27%20stop-color%3D%27%23fff%27%2F%3E%3C%2FlinearGradient%3E%3ClinearGradient%20id%3D%27gy%27%20gradientUnits%3D%27userSpaceOnUse%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%270%27%20y2%3D%27352%27%3E%3Cstop%20offset%3D%270.84%27%20stop-color%3D%27%23fff%27%2F%3E%3Cstop%20offset%3D%270.99%27%20stop-color%3D%27%23000%27%2F%3E%3C%2FlinearGradient%3E%3Cmask%20id%3D%27mx%27%20maskUnits%3D%27userSpaceOnUse%27%20x%3D%27-20%27%20y%3D%27-20%27%20width%3D%27520%27%20height%3D%27392%27%3E%3Crect%20x%3D%27-20%27%20y%3D%27-20%27%20width%3D%27520%27%20height%3D%27392%27%20fill%3D%27url%28%23gx%29%27%2F%3E%3C%2Fmask%3E%3Cmask%20id%3D%27my%27%20maskUnits%3D%27userSpaceOnUse%27%20x%3D%27-20%27%20y%3D%27-20%27%20width%3D%27520%27%20height%3D%27392%27%3E%3Crect%20x%3D%27-20%27%20y%3D%27-20%27%20width%3D%27520%27%20height%3D%27392%27%20fill%3D%27url%28%23gy%29%27%2F%3E%3C%2Fmask%3E%3Cpath%20id%3D%27f%27%20vector-effect%3D%27non-scaling-stroke%27%20stroke%3D%27url%28%23g%29%27%20d%3D%27M492%20-6%20C%20360%2014%2C%20170%20118%2C%20-14%20356%27%2F%3E%3C%2Fdefs%3E%3Cg%20mask%3D%27url%28%23mx%29%27%3E%3Cg%20mask%3D%27url%28%23my%29%27%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%289%29%20scale%281%29%20translate%28-480%200%29%27%20stroke-opacity%3D%271%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%286.8%29%20scale%281.05%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.94%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%284.6%29%20scale%281.1%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.88%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%282.4%29%20scale%281.15%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.82%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%280.2%29%20scale%281.2%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.76%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%28-2%29%20scale%281.25%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.7%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%28-4.2%29%20scale%281.3%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.64%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%28-6.4%29%20scale%281.35%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.58%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%28-8.6%29%20scale%281.4%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.52%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%28-10.8%29%20scale%281.45%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.46%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%28-13%29%20scale%281.5%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.4%27%2F%3E%3Cuse%20href%3D%27%23f%27%20transform%3D%27translate%28480%200%29%20rotate%28-15.2%29%20scale%281.55%29%20translate%28-480%200%29%27%20stroke-opacity%3D%270.34%27%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");
}

.page-onas .page-main {
    --onas-sekcja:        var(--sp-12);
    --onas-sekcja-mala:   var(--sp-8);
    --onas-grid-kolumny:  4;
    --onas-grid-odstep:   var(--sp-6);
    --onas-wartosci-kolumny: 3;
    --onas-wartosci-odstep:  var(--sp-9);
    --onas-wartosci-linia-odstep: var(--sp-6);
    --c-onas-numer:       rgba(var(--rgb-test-proof-accent), 0.55);
    --c-onas-ikona-tlo:   rgba(var(--rgb-test-proof-accent), 0.06);
    --c-onas-pas-linia:   rgba(var(--rgb-ink-footer-lt), 0.08);
    --onas-ikona-kafel:   3rem;
    --onas-tekst-od-zdjecia: calc(var(--onas-grid-odstep) * 2);
    --onas-glowka-max:    44rem;
    --onas-historia-kadr: 50% 30%;

    --c-onas-zloto:       var(--c-demo-gold);
    --c-onas-ink:         var(--c-ink-footer-lt);

    --onas-zdjecie-szerokie: 5 / 4;
    --t-onas-foto:        0.7s;
    --t-onas-foto-awaria: 3s;

    --onas-cytat-kreska:  3px;
}

.about__btn-main,
.about__btn-main:hover,
.about__btn-main:focus-visible {
    background: var(--c-onas-zloto);
    border-color: var(--c-onas-zloto);
    color: var(--c-onas-ink);
}

.about__btn-main:hover,
.about__btn-main:focus-visible { filter: brightness(1.1); }

.about__head {
    max-width: var(--onas-glowka-max);
    margin: 0 auto var(--sp-10);
    text-align: center;
}

.about__title {
    margin-bottom: var(--sp-6);
    font-size: var(--fs-h2);
    line-height: var(--lh-tight);
    font-weight: 700;
    letter-spacing: var(--ls-tight);
    color: var(--c-text-strong);
}

.about__lead {
    margin-bottom: var(--sp-5);
    font-size: var(--fs-lead);
    line-height: var(--lh-text);
    color: var(--c-text-85);
}

.about__text {
    margin-bottom: var(--sp-5);
    font-size: var(--fs-body);
    line-height: var(--lh-text);
    color: var(--c-text-60);
}

.about__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-4);
    margin-top: var(--sp-7);
}

.about-grid {
    display: grid;
    grid-template-columns: repeat(var(--onas-grid-kolumny), minmax(0, 1fr));
    gap: var(--sp-10) var(--onas-grid-odstep);
    align-items: center;
    padding-bottom: var(--onas-sekcja);
}

.about-grid__lewa  { grid-column: 1 / span 2; }
.about-grid__prawa { grid-column: 3 / span 2; }

.offer-hero + .about-grid { padding-top: var(--onas-sekcja-mala); }

.about-intro__text { padding-right: var(--onas-tekst-od-zdjecia); }

.about-story__text { padding-left: var(--onas-tekst-od-zdjecia); }

.photo-slot {
    position: relative;
    margin: 0;
    border-radius: var(--r-lg);
    overflow: hidden;
}

.photo-slot--tall { align-self: stretch; }
.photo-slot--wide { aspect-ratio: var(--onas-zdjecie-szerokie); }

.photo-slot__img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.js .photo-slot__img[data-fade] {
    opacity: 0;
    transition: opacity var(--t-onas-foto) var(--ease);
    animation: onasFotoAwaryjnie 1ms var(--t-onas-foto-awaria) forwards;
}

.js .photo-slot__img[data-fade].is-widoczny { opacity: 1; }

@keyframes onasFotoAwaryjnie {
    to { opacity: 1; }
}

.about-values {
    margin-bottom: var(--onas-sekcja);
    padding-block: var(--onas-sekcja);
    border-block: 1px solid var(--c-onas-pas-linia);
    background: rgb(var(--rgb-test-proof-lit));
}

.about-values__uklad {
    display: grid;
    grid-template-columns: repeat(var(--onas-wartosci-kolumny), minmax(0, 1fr));
    column-gap: var(--onas-wartosci-odstep);
    row-gap: var(--sp-8);
    align-items: start;
}

.about-values__uklad > .about__head {
    margin: 0;
    padding-top: var(--onas-wartosci-linia-odstep);
    text-align: left;
}

.about-values__grid {
    grid-column: 2 / -1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--sp-10) var(--onas-wartosci-odstep);
}

.value-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    align-content: start;
    padding-top: var(--onas-wartosci-linia-odstep);
    border-top: 1px solid var(--c-border-soft);
}

.value-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    grid-column: 1;
    grid-row: 1;
    justify-self: start;
    width: var(--onas-ikona-kafel);
    height: var(--onas-ikona-kafel);
    border-radius: var(--r-sm);
    background: var(--c-onas-ikona-tlo);
    color: var(--c-accent);
}

.value-card__n {
    grid-column: 2;
    grid-row: 1;
    font-size: var(--fs-micro);
    font-weight: 600;
    letter-spacing: var(--ls-label);
    color: var(--c-onas-numer);
    font-variant-numeric: tabular-nums;
}

.value-card__title {
    grid-column: 1 / -1;
    margin: var(--sp-5) 0 var(--sp-4);
    font-size: var(--fs-md);
    line-height: var(--lh-tight);
    font-weight: 700;
    letter-spacing: var(--ls-tight);
    color: var(--c-text-strong);
}

.value-card__text {
    grid-column: 1 / -1;
    font-size: var(--fs-desc);
    line-height: var(--lh-text);
    color: var(--c-text-60);
}

.about-story__quote {
    margin: var(--sp-7) 0 0;
    padding-left: var(--sp-6);
    border-left: var(--onas-cytat-kreska) solid var(--c-onas-zloto);
    font-size: var(--fs-md);
    line-height: var(--lh-text);
    font-weight: 600;
    color: var(--c-text-strong);
}

@media (min-width: 860.02px) and (min-height: 500.02px) and (max-height: 900px) {
    .page-onas { --offer-hero-dol: 0rem; }

    .page-onas .page-main {
        --onas-sekcja:      4.5rem;
        --onas-sekcja-mala: 2rem;
    }

    .about-story .photo-slot--wide {
        align-self: stretch;
        aspect-ratio: auto;
    }

    .about-story .photo-slot__img { object-position: var(--onas-historia-kadr); }
}

@media (max-width: 1080px), (orientation: landscape) and (max-height: 500px) {
    .page-onas .page-main {
        --onas-sekcja:         var(--sp-11);
    }

    .about-values__uklad { grid-template-columns: minmax(0, 1fr); }

    .about-values__uklad > .about__head {
        margin-inline: auto;
        padding-top: 0;
        text-align: center;
    }

    .about-values__grid { grid-column: 1 / -1; }
}

@media (min-width: 860.02px) and (min-height: 500.02px) and (max-width: 1080px) and (max-height: 900px) {
    .page-onas .page-main { --onas-sekcja: 3.5rem; }
}

@media (min-width: 860.02px) and (min-height: 500.02px) and (max-width: 1080px) {
    .about-intro__text > .eyebrow--strong,
    .about-story__text > .eyebrow--strong { display: block; }

    .about-intro__text > .eyebrow--strong::before,
    .about-intro__text > .eyebrow--strong::after,
    .about-story__text > .eyebrow--strong::before,
    .about-story__text > .eyebrow--strong::after { display: none; }
}

@media (max-width: 860px), (orientation: landscape) and (max-height: 500px) {
    .page-onas .page-main {
        --onas-sekcja:      var(--sp-10);
        --onas-sekcja-mala: var(--sp-8);
    }

    .about-grid { grid-template-columns: minmax(0, 1fr); }

    .about-grid__lewa,
    .about-grid__prawa { grid-column: 1 / -1; }

    .about-intro__text,
    .about-story__text { padding-inline: 0; }

    .photo-slot--tall,
    .photo-slot--wide { aspect-ratio: var(--onas-zdjecie-szerokie); }

    .photo-slot--tall { align-self: auto; }

    .about-story .photo-slot { order: 2; }

    .about__head { margin-bottom: var(--sp-8); }

    .about__head,
    .about-intro__text > .about__title,
    .about-story__text > .about__title { text-align: center; }
}

@media (max-width: 560px), (orientation: landscape) and (max-height: 500px) {
    .page-onas .page-main {
        --onas-sekcja: var(--sp-9);
        --offer-lines-szer: 100%;
        --offer-lines-h:    46rem;
    }

    .about__actions .btn { flex: 1 1 100%; }

    .about-values__grid {
        grid-template-columns: minmax(0, 1fr);
        row-gap: var(--sp-8);
    }
}