/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Oct 08 2026 | 10:08:17 */
/* =========================================================
   TESTIMONIALS
   FINAL
   ========================================================= */

.testimonials-section {
    --accent: #115cfa;
    --section-bg: #101216;
    --text-dark: #15171b;

    position: relative;
    overflow: hidden;

    padding-top: 110px;
    padding-bottom: 140px;

    background: var(--section-bg);
}


/* =========================================================
   SZEROKOŚĆ / SPACING UNCODE
   ========================================================= */

/*
 * Poziome odstępy są już ustawiane przez JS:
 *
 * full-width
 * exa-h-padding
 * col-double-gutter
 * double-internal-gutter
 *
 * Nie ustawiamy tutaj ręcznych padding-left/right.
 */

.testimonials-section > .row {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
}

.testimonials-section .sp-testimonial-free-wrapper,
.testimonials-section .sp-testimonial-free-section {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
}


/*
 * Celowo brak font-family.
 * Zostaje Instrument Sans przejmowany ze strony.
 */


/* =========================================================
   HEADER
   ========================================================= */

.testimonials-section
.sp-testimonial-free-section-title {
    max-width: 1100px;

    margin: 0 0 65px !important;
    padding: 0 !important;

    text-align: left !important;

    font-size: clamp(52px, 5.8vw, 88px) !important;
    line-height: .96 !important;

    font-weight: 300 !important;
    letter-spacing: -0.055em;

    color: #fff !important;
}


.testimonials-section
.sp-testimonial-free-section-title::before {
    content: none !important;
}


.testimonials-section
.sp-testimonial-free-section-title::after {
    content: "Kilka słów od osób, z którymi współpracuję i miałem okazję współpracować.";

    display: block;

    max-width: 600px;

    margin-top: 22px;

    font-size: 16px;
    line-height: 1.6;

    font-weight: 400;
    letter-spacing: 0;

    color: rgba(255, 255, 255, .48);
}


/* =========================================================
   GWIAZDKI — NIEWIDOCZNE
   ========================================================= */

.testimonials-section
.sp-testimonial-client-rating {
    display: none !important;
}


/* =========================================================
   GRID DESKTOP
   ========================================================= */

.testimonials-section
.tfree-grid-items {
    display: grid !important;

    grid-template-columns:
        repeat(12, minmax(0, 1fr));

    grid-auto-flow: row !important;

    gap: 24px !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    align-items: stretch;
}


/* reset klas kolumnowych pluginu */

.testimonials-section
.sp-testimonial-item {
    float: none !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   RANK 1 — FEATURED
   ========================================================= */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="1"] {
    grid-column: span 7;
    grid-row: span 2;
}


/* =========================================================
   RANK 2 / 3
   ========================================================= */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="2"],
.testimonials-section
.sp-testimonial-item[data-testimonial-rank="3"] {
    grid-column: span 5;
}


/* =========================================================
   ZWYKŁE OPINIE
   ========================================================= */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="0"] {
    grid-column: span 4;

    margin-top: 24px !important;
}


/* =========================================================
   KARTA — RESET PLUGINU
   ========================================================= */

.testimonials-section
.sp-testimonial-free {
    position: relative;

    display: flex !important;

    width: 100% !important;
    min-width: 0 !important;
    height: 100%;

    margin: 0 !important;

    padding: 42px 42px 38px !important;

    overflow: hidden;

    background: #fff !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    box-sizing: border-box !important;

    transition:
        transform .4s cubic-bezier(.2, .7, .2, 1),
        background-color .35s ease;
}


/* =========================================================
   FIX — TEKST W KARCIE
   ========================================================= */

/*
 * Plugin nakłada własne marginesy / paddingi.
 * Zerujemy je, żeby tekst zaczynał się dokładnie
 * od paddingu karty.
 */

.testimonials-section
.sp-testimonial-details {
    position: relative;
    z-index: 2;

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;
    min-width: 0 !important;
    height: 100%;

    margin: 0 !important;
    padding: 0 !important;

    text-align: left !important;

    box-sizing: border-box !important;
}


.testimonials-section
.sp-testimonial-title,

.testimonials-section
.sp-testimonial-post-title,

.testimonials-section
.sp-testimonial-client-name,

.testimonials-section
.sp-testimonial-client-designation {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;

    text-align: left !important;

    box-sizing: border-box !important;

    word-break: normal !important;
    overflow-wrap: break-word;
}


/* =========================================================
   FEATURED
   ========================================================= */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="1"]
.sp-testimonial-free {
    min-height: 560px;

    padding: 54px 54px 48px !important;

    background: var(--accent) !important;
}


/* =========================================================
   DEKORACJA
   ========================================================= */

.testimonials-section
.sp-testimonial-free::before,

.testimonials-section
.sp-testimonial-free::after {
    content: "";

    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    transition:
        transform .6s cubic-bezier(.2, .7, .2, 1);
}


.testimonials-section
.sp-testimonial-free::before {
    width: 230px;
    height: 230px;

    top: -135px;
    right: -135px;

    border:
        1px solid rgba(17, 92, 250, .16);
}


.testimonials-section
.sp-testimonial-free::after {
    width: 145px;
    height: 145px;

    top: -86px;
    right: -86px;

    border:
        1px solid rgba(17, 92, 250, .10);
}


/* większe koła featured */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="1"]
.sp-testimonial-free::before {
    width: 390px;
    height: 390px;

    top: -220px;
    right: -210px;

    border-color:
        rgba(255, 255, 255, .17);
}


.testimonials-section
.sp-testimonial-item[data-testimonial-rank="1"]
.sp-testimonial-free::after {
    width: 260px;
    height: 260px;

    top: -145px;
    right: -140px;

    border-color:
        rgba(255, 255, 255, .11);
}


/* =========================================================
   HOVER
   ========================================================= */

@media (hover: hover) {

    .testimonials-section
    .sp-testimonial-free:hover {
        transform: translateY(-6px);
    }


    .testimonials-section
    .sp-testimonial-free:hover::before {
        transform: scale(1.08);
    }


    .testimonials-section
    .sp-testimonial-free:hover::after {
        transform: scale(.92);
    }

}


/* =========================================================
   TREŚĆ OPINII
   ========================================================= */

.testimonials-section
.sp-testimonial-client-designation {
    order: 1;

    margin-top: 0 !important;
    margin-bottom: 48px !important;

    font-size: 17px !important;
    line-height: 1.68 !important;

    font-weight: 400 !important;

    color: var(--text-dark) !important;
}


/* featured */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="1"]
.sp-testimonial-client-designation {
    max-width: 88% !important;

    font-size: clamp(21px, 1.6vw, 26px) !important;
    line-height: 1.55 !important;

    color: #fff !important;
}


/* =========================================================
   AUTOR
   ========================================================= */

.testimonials-section
.sp-testimonial-title {
    order: 2;

    margin-top: auto !important;
    margin-bottom: 0 !important;
}


.testimonials-section
.sp-testimonial-post-title {
    margin-top: 0 !important;
    margin-bottom: 0 !important;

    font-size: 18px !important;
    line-height: 1.25 !important;

    font-weight: 700 !important;
    letter-spacing: -.02em;

    color: var(--text-dark) !important;
}


.testimonials-section
.sp-testimonial-item[data-testimonial-rank="1"]
.sp-testimonial-post-title {
    font-size: 20px !important;

    color: #fff !important;
}


/* =========================================================
   FIRMA / STANOWISKO
   ========================================================= */

.testimonials-section
.sp-testimonial-client-name {
    order: 3;

    margin-top: 7px !important;
    margin-bottom: 0 !important;

    font-size: 12px !important;
    line-height: 1.4 !important;

    font-weight: 600 !important;

    letter-spacing: .055em;
    text-transform: uppercase;

    color: var(--accent) !important;
}


.testimonials-section
.sp-testimonial-item[data-testimonial-rank="1"]
.sp-testimonial-client-name {
    color: rgba(255, 255, 255, .68) !important;
}


/* =========================================================
   ZWYKŁE OPINIE — DOLNY GRID
   ========================================================= */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="0"]
.sp-testimonial-free {
    min-height: 290px;

    padding: 32px 32px 29px !important;

    background:
        rgba(255, 255, 255, .045) !important;

    border:
        1px solid rgba(255, 255, 255, .10) !important;
}


/* bez dekoracji */

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="0"]
.sp-testimonial-free::before,

.testimonials-section
.sp-testimonial-item[data-testimonial-rank="0"]
.sp-testimonial-free::after {
    display: none !important;
}


.testimonials-section
.sp-testimonial-item[data-testimonial-rank="0"]
.sp-testimonial-client-designation {
    margin-bottom: 34px !important;

    font-size: 14px !important;
    line-height: 1.65 !important;

    color:
        rgba(255, 255, 255, .72) !important;
}


.testimonials-section
.sp-testimonial-item[data-testimonial-rank="0"]
.sp-testimonial-post-title {
    font-size: 16px !important;

    color: #fff !important;
}


.testimonials-section
.sp-testimonial-item[data-testimonial-rank="0"]
.sp-testimonial-client-name {
    font-size: 11px !important;

    color:
        rgba(255, 255, 255, .42) !important;
}


/* =========================================================
   <= 959px
   WSZYSTKO JEDNA POD DRUGĄ
   ========================================================= */

@media (max-width: 959px) {

    .testimonials-section {
        padding-top: 85px;
        padding-bottom: 100px;
    }


    .testimonials-section
    .sp-testimonial-free-section-title {
        margin-bottom: 48px !important;

        font-size: clamp(46px, 8vw, 64px) !important;
    }


    /*
     * Najważniejsza zmiana:
     * od tego breakpointa jest tylko 1 kolumna.
     */

    .testimonials-section
    .tfree-grid-items {
        grid-template-columns:
            minmax(0, 1fr) !important;

        grid-auto-flow: row !important;

        gap: 18px !important;
    }


    .testimonials-section
    .sp-testimonial-item,

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="1"],

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="2"],

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="3"],

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="0"] {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;

        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
    }


    .testimonials-section
    .sp-testimonial-free,

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="1"]
    .sp-testimonial-free,

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="0"]
    .sp-testimonial-free {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
        height: auto !important;

        padding:
            36px 34px 32px !important;
    }


    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="1"]
    .sp-testimonial-client-designation {
        max-width: 100% !important;

        font-size: 19px !important;
        line-height: 1.6 !important;
    }


    .testimonials-section
    .sp-testimonial-client-designation {
        max-width: 100% !important;

        margin-bottom: 40px !important;

        font-size: 16px !important;
    }


    /*
     * Dolne zwykłe opinie pozostają ciemne,
     * ale mają teraz pełną szerokość.
     */

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="0"]
    .sp-testimonial-client-designation {
        font-size: 15px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 569px) {

    .testimonials-section {
        padding-top: 68px;
        padding-bottom: 78px;
    }


    .testimonials-section
    .sp-testimonial-free-section-title {
        margin-bottom: 36px !important;

        font-size: 45px !important;
        line-height: .98 !important;
    }


    .testimonials-section
    .sp-testimonial-free-section-title::after {
        max-width: 310px;

        margin-top: 17px;

        font-size: 14px;
        line-height: 1.55;
    }


    .testimonials-section
    .tfree-grid-items {
        gap: 14px !important;
    }


    .testimonials-section
    .sp-testimonial-free,

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="1"]
    .sp-testimonial-free,

    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="0"]
    .sp-testimonial-free {
        padding:
            28px 24px 26px !important;
    }


    .testimonials-section
    .sp-testimonial-client-designation {
        margin-bottom: 34px !important;

        font-size: 15px !important;
        line-height: 1.65 !important;
    }


    .testimonials-section
    .sp-testimonial-item[data-testimonial-rank="1"]
    .sp-testimonial-client-designation {
        font-size: 17px !important;
    }


    .testimonials-section
    .sp-testimonial-post-title {
        font-size: 16px !important;
    }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .testimonials-section
    .sp-testimonial-free,

    .testimonials-section
    .sp-testimonial-free::before,

    .testimonials-section
    .sp-testimonial-free::after {
        transition: none;
    }


    .testimonials-section
    .sp-testimonial-free:hover {
        transform: none;
    }

}