/* Sections and Page Layouts */

/* Base section styles */
.section {
    padding: .1px 0
}

.section .section-header {
    background: transparent no-repeat 50% 50%;
    background-size: cover
}

/* Okladka naglowka. Adres obrazka pochodzi z bazy, wiec markup podaje go
   jako zmienna --section-cover, a arkusz decyduje o kadrowaniu i powtarzaniu. */
.section .section-header {
    background-image: var(--section-cover, none)
}

/* Terminarz: wyzszy naglowek z trescia przy lewej krawedzi. */
.section--with_cover .section-header.section-header--tall {
    padding: 8rem 0;
    text-align: left
}

.section .section-header nav {
    grid-column: 1/span 2
}

.section .section-header nav ul {
    list-style: none;
    margin-left: 0;
    margin-bottom: 0;
    margin-top: var(--space-4)
}

.section .section-header nav ul li {
    display: inline-block;
    margin: 0 var(--space-base) var(--space-4) 0
}

.section .section-header nav a {
    text-decoration: none;
    display: block;
    text-transform: uppercase;
    position: relative
}

.section .section-header nav a:after {
    position: absolute;
    bottom: 0;
    left: calc(50% - 1rem);
    width: 2rem;
    height: 3px;
    background: var(--color-primary)
}

.section .section-header nav .current a,
.section .section-header nav .current-cat a,
.section .section-header nav a:hover {
    color: var(--color-primary)
}

.section .section-header nav .current a:after,
.section .section-header nav .current-cat a:after {
    content: ''
}

.section .section-content {
    padding: var(--space-2) 0
}

.section-content .secondary {
    text-align: center
}

.section-content .secondary .box {
    text-align: left
}

.section-content .secondary a {
    color: var(--color-primary);
    text-decoration: none
}

.section-content .secondary a:hover {
    text-decoration: underline
}

.section-content ul:not(.list):not(.post-categories):not(.slick-dots) {
    list-style: none;
    margin-left: 0
}

.section-content ul:not(.list):not(.post-categories):not(.slick-dots) li {
    position: relative;
    padding-left: 2rem;
    margin-bottom: calc(.5 * var(--space-4))
}

.section-content ul:not(.list):not(.post-categories):not(.slick-dots):not(.list--slider) li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    display: block;
    width: 1.375rem;
    height: 1.375rem;
    /* Maska zamiast tla: ikona bierze kolor z tokenu. Wczesniej kazdy plik
       SVG niosl wlasna zielen (kropka #0A7A33, ikony kursu #14854E), wiec
       system mial trzy zielenie zamiast jednej. */
    -webkit-mask: url(../images/icons/list-dot.svg) no-repeat left top;
    mask: url(../images/icons/list-dot.svg) no-repeat left top;
    -webkit-mask-size: contain;
    mask-size: contain;
    background-color: var(--color-primary-600)
}

/* Section with cover */
.section--with_cover .section-header,
.section--with_cover .section-title {
    color: var(--color-white)
}

.section--with_cover .section-header {
    text-align: center;
    padding: calc(2 * var(--space-1)) 0;
    font: var(--text-2xl)
}

.section--with_cover .section-header .hint {
    font: var(--text-base)
}

.section--with_cover .section-header a {
    color: var(--color-white)
}

/* Page section */
.section--page {
    background: var(--color-white)
}

/* Courses category section */
.section--courses_category .section-header {
    background: var(--color-white);
    padding: var(--space-2) 0
}

.section--courses_category .section-header .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: var(--space-1)
}

.section--courses_category .section-footer {
    background: var(--color-white);
    padding: var(--space-2) 0
}

.section--courses_category .section-footer .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: var(--space-1)
}

.section--courses_category .course-cat-description {
    display: block;
    max-width: 800px;

}

.section--courses_category .section-title {
    margin-top: 0
}

/* Single course section */
.section--courses_single .section--checkout h2 {
    font: var(--text-4xl);
    margin: var(--space-base) 0 var(--space-base) 0
}

/**
 * Nagłówki sekcji na single kursu — jeden styl jak „Najbliższe terminy”
 * (odpowiednik font-display-2: max ~2.44rem; na wąskich ekranach mniejszy przez clamp)
 */
.section--courses_single .course-page-section-title,
.section--courses_single .section--checkout h2.course-page-section-title,
.section--courses_single #dodatki .tooltip > h2.course-page-section-title,
.section--courses_single .course-page-footer .course-page-footer__prose h2 {
    margin: 0 0 1rem 0;
    padding: 0;
    color: var(--color-secondary);
    font-family: Mukta, system-ui, sans-serif;
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: -0.015em;
    font-size: clamp(1.375rem, 0.88rem + 1.45vw, 2.44125rem)
}

/* Skrot font z .section--checkout h2 ustawia takze font-style, ktorego
   regula powyzej nie deklaruje. Reszte wlasciwosci ta regula juz podaje --
   z ta sama wartoscia i z tym samym selektorem na liscie. */
.section--courses_single .section--checkout h2.course-page-section-title {
    font-style: normal
}

.section--courses_single #najblizsze-terminy > .course-page-section-title {
    margin-bottom: 0
}

.section--courses_single .course-page-content.prose h2.course-page-section-title {
    margin-top: 2.5rem;
    margin-bottom: 1rem
}

.section--courses_single .course-page-content.prose > h2.course-page-section-title:first-of-type {
    margin-top: 0
}

/* Single course — Figma: wprowadzenie (opis + „Jak organizujemy”) na jasnym tle, bez karty */
.section--courses_single .course-page-intro__block .course-page-section-title {
    margin: 0 0 1.5rem 0
}

/* Figma: „Jak organizujemy…” — text-2xl (~25px), nie jak główny nagłówek sekcji */
.section--courses_single .course-page-section-title--figma-sub {
    font-size: clamp(1.25rem, 0.95rem + 1.1vw, 1.5625rem);
    line-height: 1.552;
    letter-spacing: -0.01em
}

/* Blok „Szczegóły” — Figma: nagłówek 31.25px, podsekcje z ikoną 20px + tytuł 25px, listy w 2 kolumnach */
.section--courses_single .course-section-details > .course-page-section-title {
    margin-bottom: 0
}

.section--courses_single .course-section-details__block-heading {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: 1rem
}

.section--courses_single .course-section-details__icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    color: var(--color-primary)
}

.section--courses_single .course-section-details__icon svg {
    width: 1.75rem;
    height: 1.75rem
}

.section--courses_single .course-section-details__block-title {
    margin: 0;
    padding: 0;
    font-family: Mukta, system-ui, sans-serif;
    font-weight: 400;
    font-size: clamp(1.25rem, 0.95rem + 1.1vw, 1.5625rem);
    line-height: 1.552;
    letter-spacing: -0.01em;
    color: var(--color-secondary)
}

@media (min-width:768px) {
    .section--courses_single .course-section-details__block-body > ul {
        column-count: 2;
        column-gap: 2.5rem
    }
}

/* Program szkolenia — Figma: białe karty 8px, nagłówek wiersza semibold 16px var(--color-secondary-soft), chevron 16px, odstęp 8px między kartami */
.section--courses_single .course-programme-accordions__intro {
    margin-bottom: var(--space-5)
}

.section--courses_single .course-programme-accordions__list {
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.section--courses_single .course-programme-accordions__item {
    margin: 0;
    border-radius: var(--radius-lg);
    border: 1px solid var(--color-grey);
    background: var(--color-white);
    overflow: hidden
}

.section--courses_single .course-programme-accordions__summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: 1rem;
    cursor: pointer;
    list-style: none;
    font-family: Mukta, system-ui, sans-serif;
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--color-secondary-soft);
    -webkit-user-select: none;
    user-select: none
}

.section--courses_single .course-programme-accordions__summary::-webkit-details-marker {
    display: none
}

.section--courses_single .course-programme-accordions__summary-text {
    flex: 1;
    text-align: left
}

.section--courses_single .course-programme-accordions__chevron {
    flex-shrink: 0;
    width: 1rem;
    height: 1rem;
    position: relative;
    opacity: .9
}

.section--courses_single .course-programme-accordions__chevron::before {
    content: '';
    position: absolute;
    inset: 0;
    margin: auto;
    width: .35rem;
    height: .35rem;
    border-right: 2px solid var(--color-secondary);
    border-bottom: 2px solid var(--color-secondary);
    transform: rotate(45deg);
    transition: transform .2s ease
}

.section--courses_single .course-programme-accordions__item[open] .course-programme-accordions__chevron::before {
    transform: rotate(225deg)
}

.section--courses_single .course-programme-accordions__panel {
    padding: 0 1rem 1rem;
    margin-top: 0;
    font-size: 1rem;
    line-height: 1.55;
    letter-spacing: .022em;
    color: var(--color-secondary-soft)
}

.section--courses_single .course-programme-accordions__panel > *:first-child {
    margin-top: 0
}

.section--courses_single .course-programme-accordions__panel p,
.section--courses_single .course-programme-accordions__panel li {
    font-size: 1rem;
    color: var(--color-secondary-soft)
}

.section--courses_single .section-content ul:not(.list):not(.post-categories):not(.slick-dots):not(.list--slider) {
    list-style: disc;
    margin-left: 1.25rem
}

.section--courses_single .section-content ul:not(.list):not(.post-categories):not(.slick-dots):not(.list--slider) li {
    padding-left: 0
}

.section--courses_single .section-content ul:not(.list):not(.post-categories):not(.slick-dots):not(.list--slider) li:before {
    content: none
}

.section--courses_single .course-page-content.prose :is(ul, ol),
.section--courses_single .course-section-details__block-body.prose :is(ul, ol) {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    padding-inline-start: 1.5rem
}

.section--courses_single .course-page-content.prose :is(ul, ol) > li,
.section--courses_single .course-section-details__block-body.prose :is(ul, ol) > li {
    margin-top: .45rem;
    margin-bottom: .45rem
}

.section--courses_single .course-page-content.prose :is(ul, ol) > li::marker,
.section--courses_single .course-section-details__block-body.prose :is(ul, ol) > li::marker {
    color: var(--color-secondary-500)
}

.section--courses_single .course-knowledge-base {
    margin-top: 2rem;
    margin-bottom: 2.25rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.section--courses_single .course-knowledge-base__header {
    display: flex;
    flex-direction: column;
    gap: .25rem;
}

.section--courses_single .course-knowledge-base__title {
    margin: 0;
    color: var(--color-secondary);
    font-family: Mukta, system-ui, sans-serif;
    font-weight: 400;
    font-size: 1.953125rem;
    line-height: 1.5;
}

.section--courses_single .course-knowledge-base__description {
    margin: 0;
    color: var(--color-secondary);
    font-size: 1.125rem;
    line-height: 1.55;
}

.section--courses_single .course-knowledge-base__links {
    display: flex;
    flex-wrap: wrap;
    gap: .875rem 1.5rem;
}

.section--courses_single .course-knowledge-base__link {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    color: var(--color-primary);
    text-decoration: none;
    letter-spacing: .022em;
    font-size: 1rem;
    line-height: 1.55;
    white-space: nowrap;
}

.section--courses_single .course-knowledge-base__link:hover {
    text-decoration: underline;
}

.section--courses_single .course-knowledge-base__icon {
    width: 1.5rem;
    height: 1.5rem;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.section--courses_single .course-knowledge-base__icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

@media (max-width: 639px) {
    .section--courses_single .course-page-section-title,
    .section--courses_single .section--checkout h2.course-page-section-title,
    .section--courses_single #dodatki .tooltip > h2.course-page-section-title,
    .section--courses_single .course-page-footer .course-page-footer__prose h2 {
        line-height: 1.3
    }

    .section--courses_single .course-knowledge-base {
        margin-top: 1.5rem;
        margin-bottom: 1.75rem;
    }

    .section--courses_single .course-knowledge-base__title {
        font-size: 1.5625rem;
        line-height: 1.35;
    }

    .section--courses_single .course-knowledge-base__description {
        font-size: 1rem;
        line-height: 1.5;
    }

    .section--courses_single .course-knowledge-base__links {
        gap: .75rem;
    }

    .section--courses_single .course-knowledge-base__link {
        font-size: .95rem;
        white-space: normal;
    }
}

.section--courses_single .course-dates-filter .netto {
    color: var(--color-primary);
    font: var(--text-4xl)
}

.section--courses_single .course-dates-filter .brutto {
    font: var(--text-xl)
}

.section--courses_single .section--checkout .list .item>.box {
    padding: 1.125rem var(--space-4);
    width: 100%;
    display: block
}

.section--courses_single .section--courseaddons .tooltip {
    display: block
}

.section--courses_single .section--courseaddons .course-addons__subtitle {
    margin: 0;
    text-align: left;
    font-size: 1.125rem;
    line-height: 1.55;
    color: var(--color-secondary-soft)
}

.section--courses_single .section--courseaddons .addons-selector {
    display: flex;
    flex-direction: column;
    gap: 1rem
}

.section--courses_single .section--courseaddons .addons-selector > h3 {
    margin: 1rem 0 0 0;
    font-family: Mukta, system-ui, sans-serif;
    font-weight: 400;
    font-size: 1.25rem;
    line-height: 1.55;
    color: var(--color-secondary)
}

.section--courses_single .section--courseaddons .addons-selector > .list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.section--courses_single .section--courseaddons .addons-selector > .list > .item {
    margin: 0
}

.section--courses_single .section--courseaddons .addon-card__box {
    border: 1px solid var(--color-grey);
    border-radius: var(--radius-lg);
    background: var(--color-white);
    padding: 1rem;
    cursor: default;
    box-shadow: none !important
}

.section--courses_single .section--courseaddons .addon-card__box--selected {
    border-color: var(--color-primary)
}

.section--courses_single .section--courseaddons .addon-card__main {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    position: relative
}

.section--courses_single .section--courseaddons .addon-card__thumb {
    width: 6rem;
    height: 4.5rem;
    flex: 0 0 6rem;
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--color-grey);
    display: flex;
    align-items: center;
    justify-content: center
}

.section--courses_single .section--courseaddons .addon-card__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.section--courses_single .section--courseaddons .addon-card__thumb-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: var(--radius-full);
    background: rgb(var(--color-white-rgb) / .9);
    font-size: .875rem;
    font-weight: 700;
    color: var(--color-secondary-soft)
}

.section--courses_single .section--courseaddons .addon-card__copy {
    min-width: 0;
    flex: 1 1 auto
}

.section--courses_single .section--courseaddons .addon-card__title {
    margin: 0;
    font-family: Mukta, system-ui, sans-serif;
    font-weight: 400;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--color-secondary-950)
}

.section--courses_single .section--courseaddons .addon-card__subtitle,
.section--courses_single .section--courseaddons .addon-card__brutto {
    margin-top: .125rem;
    font-size: .875rem;
    line-height: 1.5;
    color: var(--color-secondary-soft)
}

.section--courses_single .section--courseaddons .addon-card__price {
    flex: 0 0 auto;
    min-width: 12.5rem;
    text-align: right;
    margin-left: auto
}

.section--courses_single .section--courseaddons .addon-card__netto {
    font-size: 1.125rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-primary)
}

.section--courses_single .section--courseaddons .addon-card__netto .price-item--current {
    color: inherit
}

.section--courses_single .section--courseaddons .addon-card__brutto .price-item--current {
    color: inherit
}

.section--courses_single .section--courseaddons .addon-card__control {
    flex: 0 0 auto;
    margin-left: .5rem;
    padding-top: .25rem;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    min-width: 1.5rem
}

.section--courses_single .section--courseaddons .addon-card__checkbox-wrap {
    position: relative;
    display: inline-flex;
    width: 1.25rem;
    height: 1.25rem
}

.section--courses_single .section--courseaddons .addon-card__checkbox-input {
    position: absolute;
    inset: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 2
}

.section--courses_single .section--courseaddons .addon-card__checkbox-icon {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: var(--radius);
    border: 1px solid var(--color-secondary-400);
    background: var(--color-white);
    position: relative;
    transition: border-color .15s ease, background-color .15s ease
}

.section--courses_single .section--courseaddons .addon-card__checkbox-input:checked + .addon-card__checkbox-icon {
    border-color: var(--color-primary);
    background: var(--color-primary)
}

.section--courses_single .section--courseaddons .addon-card__checkbox-input:checked + .addon-card__checkbox-icon::after {
    content: '';
    position: absolute;
    left: .38rem;
    top: .17rem;
    width: .28rem;
    height: .55rem;
    border: solid var(--color-white);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg)
}

.section--courses_single .section--courseaddons .addon-card__qty {
    font-size: .875rem;
    line-height: 1.5;
    color: var(--color-secondary-soft);
    font-weight: 400
}

@media (max-width: 767px) {
    .section--courses_single .section--courseaddons .addon-card__main {
        flex-direction: column;
        align-items: stretch
    }

    .section--courses_single .section--courseaddons .addon-card__thumb {
        width: 100%;
        flex-basis: auto
    }

    .section--courses_single .section--courseaddons .addon-card__price {
        min-width: 0;
        text-align: left;
        margin-left: 0
    }

    .section--courses_single .section--courseaddons .addon-card__control {
        margin-left: 0;
        padding-top: 0
    }
}

.section--courses_single .section-header {
    background: var(--color-white);
    padding: var(--space-2) 0;
    padding-bottom: 0
}

.section--courses_single .section-header.course-hero-header--single {
    background: linear-gradient(0deg, rgb(var(--color-white-rgb) / .18) 0%, rgb(var(--color-success-soft-rgb) / .18) 100%), var(--color-white)
}

.section--courses_single .course-hero-header--single .course-hero-header__container {
    display: flex;
    flex-direction: column;
    min-height: 0
}

.section--courses_single .course-hero-wrap--single {
    background: var(--color-white);
    padding-bottom: var(--space-2)
}

.section--courses_single .course-hero-header__main,
.section--courses_single .section-header .container:not(.course-hero-header__container) {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: var(--space-1);
    grid-row-gap: var(--space-2)
}

/* Okruszki na stronie szkolenia sa teraz tym samym pasem co na pozostalych
   podstronach - assets/css/components.css */

@media (min-width:1024px) {
    .section--courses_single .course-hero-wrap--single {
        display: flex;
        flex-direction: column;
        min-height: 28rem
    }

    .section--courses_single .course-hero-wrap--single .course-hero-header--single {
        flex: 1 1 auto
    }

    .section--courses_single .course-hero-header__main {
        flex: 1 1 auto
    }
}

.section--courses_single .section-title {
    margin-top: 0
}

.section--courses_single .course-hero-copy {
    display: flex;
    flex-direction: column;
    gap: 1rem
}

.section--courses_single .course-hero-copy > p {
    margin: 0 0 .75rem 0
}

.section--courses_single .course-hero-copy > ul {
    margin: 0 0 .875rem 1.5rem
}

.section--courses_single .course-hero-copy > :last-child {
    margin-bottom: 0
}

.section--courses_single .course-hero-subscription {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-top: .125rem;
    padding: .875rem 1.125rem;
    border: 1px solid var(--color-grey);
    border-radius: var(--radius-lg);
    background: linear-gradient(90deg, rgb(var(--color-success-soft-rgb) / .42) 0%, rgb(var(--color-white-rgb) / .96) 100%);
    text-decoration: none
}

.section--courses_single .course-hero-subscription:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px
}

.section--courses_single .course-hero-subscription__main {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    align-items: flex-start
}

.section--courses_single .course-hero-subscription__brand {
    font-family: Mukta, system-ui, sans-serif;
    font-size: 1.3125rem;
    line-height: 1;
    font-weight: 700;
    color: var(--color-secondary)
}

.section--courses_single .course-hero-subscription__brand span {
    color: var(--color-primary)
}

.section--courses_single .course-hero-subscription__text {
    margin: 0;
    font-size: .8125rem;
    line-height: 1.55;
    color: var(--color-secondary-soft)
}

.section--courses_single .course-hero-subscription__link {
    color: var(--color-primary);
    text-decoration: underline;
    text-underline-offset: .12em
}

.section--courses_single .course-hero-subscription:hover .course-hero-subscription__link {
    color: var(--color-primary)
}

.section--courses_single .course-hero-subscription__chevron {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    color: var(--color-success);
    opacity: .9;
    transition: transform .15s ease, color .15s ease;
    text-decoration: none
}

.section--courses_single .course-hero-subscription__chevron svg {
    width: 100%;
    height: 100%;
    display: block
}

.section--courses_single .course-hero-subscription:hover .course-hero-subscription__chevron {
    transform: translateX(2px);
    color: var(--color-primary)
}

/* Course single — hero facts: pionowe separatory między kolumnami */
.section--courses_single .course-hero-facts {
    grid-column: 1 / -1;
    width: 100%;
    padding-top: var(--space-2);
    padding-bottom: var(--space-2);
}

.section--courses_single .course-hero-facts__grid {
    display: flex;
    flex-direction: column;
    gap: 0
}

.section--courses_single .course-hero-facts__item {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    align-items: flex-start;
    padding: var(--space-4) 0;
    margin: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none
}

.section--courses_single .course-hero-facts__item:not(:last-child) {
    border-bottom: 1px solid var(--color-grey)
}

@media (min-width:640px) and (max-width:1199px) {
    .section--courses_single .course-hero-facts__grid {
        display: grid;
        grid-template-columns: 1fr 1fr}

    .section--courses_single .course-hero-facts__item {
        padding: var(--space-4);
        border-bottom: none}

    .section--courses_single .course-hero-facts__item:not(:last-child) {
        border-bottom: none
    }

    .section--courses_single .course-hero-facts__item:nth-child(2n) {
        border-left: 1px solid var(--color-grey)
    }

    .section--courses_single .course-hero-facts__item:nth-child(n+3) {
        border-top: 1px solid var(--color-grey)
    }
}

@media (min-width:1200px) {
    .section--courses_single .course-hero-facts__grid {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: stretch
    }

    .section--courses_single .course-hero-facts__item {
        flex: 1 1 0;
        min-width: 0;
        padding: .5rem 1.5rem;
        border-bottom: none
    }

    .section--courses_single .course-hero-facts__item:not(:last-child) {
        border-bottom: none
    }

    .section--courses_single .course-hero-facts__item:not(:first-child) {
        border-left: 1px solid var(--color-grey)
    }

    .section--courses_single .course-hero-facts__item:first-child {
        padding-left: 0
    }

    .section--courses_single .course-hero-facts__item:last-child {
        padding-right: 0
    }
}

.section--courses_single .course-hero-facts__icon {
    flex-shrink: 0;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0
}

.section--courses_single .course-hero-facts__icon-img {
    width: 1.5rem;
    height: 1.5rem;
    display: block
}

.section--courses_single .course-hero-facts__body {
    min-width: 0
}

.section--courses_single .course-hero-facts__label {
    font-size: .8125rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--color-secondary-soft);
    margin-bottom: .125rem
}

.section--courses_single .course-hero-facts__value {
    /* Krok nizej na skali Tailwinda: 1.1875rem lezalo miedzy text-lg a text-xl. */
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.4;
    color: var(--color-secondary)
}

.section--courses_single .course-hero-facts__accred-img {
    height: 48px;
    width: auto;
    object-fit: contain;
    display: block
}

/* Pasek zakładek: fixed steruje course-single-sticky.js + placeholder (bez CSS sticky) */
.section--courses_single .course-hero-tabs-bar__placeholder {
    display: none;
    width: 100%;
    flex-shrink: 0
}

.section--courses_single .course-hero-tabs-bar__placeholder.is-active {
    display: block
}

.section--courses_single .course-hero-tabs-bar--single {
    position: relative;
    z-index: 100000;
    width: 100%;
    flex-shrink: 0;
    margin-top: 0;
    background: var(--color-white);
    border-bottom: 1px solid var(--color-grey)
}

@media (max-width:1023px) {
    .section--courses_single .course-hero-tabs-bar--single,
    .section--courses_single .course-hero-tabs-bar__placeholder {
        display: none !important
    }

    .section--courses_single .course-hero-header__main {
        grid-template-columns: 1fr;
        gap: 1rem
    }

    .section--courses_single .course-hero-header__main > div:nth-child(2) {
        order: 1
    }

    .section--courses_single .course-hero-copy {
        order: 2
    }

    .section--courses_single .course-hero-facts {
        order: 3
    }

    .section--courses_single .course-hero-header__main > div:nth-child(2) img,
    .section--courses_single .course-hero-header__main > div:nth-child(2) iframe,
    .section--courses_single .course-hero-header__main > div:nth-child(2) video {
        width: 100%;
        height: auto;
        display: block;
        border-radius: var(--radius-lg)}

    .section--courses_single .course-hero-subscription {
        width: 100%
    }

    .section--courses_single .course-hero-tabs-bar--single .container {
        padding-left: 0;
        padding-right: 0
    }

    .section--courses_single .course-hero-tabs--single .course-hero-tabs__list {
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        gap: 1rem 1.25rem;
        padding-left: var(--space-3);
        padding-right: var(--space-3)
    }

    .section--courses_single .course-hero-tabs-bar--single .course-hero-tabs__list>li {
        flex: 0 0 auto
    }

}

.section--courses_single .course-hero-tabs-bar--single.is-fixed {
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    margin-top: 0;
    z-index: 100000
}

/* Nawigacja kotwic */
.section--courses_single .course-hero-tabs--single {
    width: 100%;
    align-self: stretch;
    flex-shrink: 0;
    padding: 0
}

.section--courses_single .course-hero-tabs--single .course-hero-tabs__list {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 1.5rem;
    list-style: none;
    margin: 0;
    padding: 0
}

.section--courses_single .course-hero-tabs-bar--single .course-hero-tabs__list>li {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    margin: 0
}

.section--courses_single .course-hero-tabs--single .course-hero-tabs__link:after,
.section--courses_single .course-hero-tabs--single .course-hero-tabs__link:hover:after,
.section--courses_single .course-hero-tabs--single .course-hero-tabs__link:focus:after {
    content: none !important;
    display: none !important
}

.section--courses_single .course-hero-tabs--single .course-hero-tabs__link {
    position: relative;
    display: block;
    padding: .5rem 0;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    letter-spacing: 0;
    font-weight: 400;
    font-size: 1.1rem;
    line-height: 1.55;
    white-space: nowrap;
    color: var(--color-secondary-soft)
}

.section--courses_single .course-hero-tabs--single .course-hero-tabs__link:hover,
.section--courses_single .course-hero-tabs--single .course-hero-tabs__link:focus,
.section--courses_single .course-hero-tabs--single .course-hero-tabs__item--active .course-hero-tabs__link {
    color: var(--color-primary)
}

.section--courses_single .course-hero-tabs--single .course-hero-tabs__mark {
    display: block;
    flex-shrink: 0;
    width: 2rem;
    height: 3px;
    margin-top: 0;
    border-radius: var(--radius-full);
    background: transparent
}

.section--courses_single .course-hero-tabs--single .course-hero-tabs__item--active .course-hero-tabs__mark {
    background: var(--color-primary)
}

.section--courses_single .section-content .container {
    display: flex
}

/* Tabela terminów full width, potem grid — .container bez flex-row (żeby terminy + siatka nie szły obok siebie) */
.section--courses_single .course-page--single.section-content .container {
    display: block;
    overflow: visible
}

.section--courses_single .course-page-main-grid {
    overflow: visible
}

@media (min-width:1024px) {
    .section--courses_single .course-page-main-grid {
        align-items: stretch
    }
}

/* Dolna ramka bloku treści; bez border-top — linia jest na fixed tabs (box-shadow) lub wystarczy tło */
.section--courses_single.section {
    overflow: visible
}

.section--courses_single .section-content.course-page--single {
    border-top: none;
    border-bottom: 1px solid var(--color-grey);
    overflow: visible
}

/* Kotwice pod sticky tabs — cele nie chowają się pod paskiem */
.section--courses_single .course-page--single section[id],
.section--courses_single .course-page--single h2[id],
.section--courses_single .course-section-details h3[id],
.section--courses_single #course-section-training-details,
.section--courses_single #course-section-description,
.section--courses_single #course-section-certification,
.section--courses_single #course-section-programme {
    scroll-margin-top: 6.5rem
}

/* Tabela terminów: tylko linie poziome między wierszami */
.section--courses_single #najblizsze-terminy table.course-schedule-table {
    font-size: 1.0625rem;
    line-height: 1.5
}

.section--courses_single #najblizsze-terminy table.course-schedule-table thead th {
    font-size: 1.0625rem
}

.section--courses_single #najblizsze-terminy table.course-schedule-table tbody td {
    border-bottom: 1px solid var(--color-grey);
    vertical-align: middle
}

.section--courses_single #najblizsze-terminy .course-schedule-table__date-link {
    text-decoration: none;
    font-weight: 400
}

.section--courses_single #najblizsze-terminy .course-schedule-table__date-link:hover {
    color: var(--color-primary);
    text-decoration: none
}

.section--courses_single #najblizsze-terminy .course-schedule-table__date-link:focus-visible {
    color: var(--color-primary);
    text-decoration: none;
    outline: 2px solid var(--color-primary);
    outline-offset: 2px
}

.section--courses_single #najblizsze-terminy .course-schedule-table__mode {
    display: inline-flex;
    align-items: center;
    gap: .5rem
}

.section--courses_single #najblizsze-terminy .course-schedule-table__mode-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--color-secondary);
    opacity: .9
}

/* CTA pod tabelą terminów — wygląd z .button (buttons.css); tu tylko układ + chevron */
.section--courses_single .course-schedule__cta-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-top: var(--space-4)
}

.section--courses_single .course-schedule__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-6);
    width: 100%;
    max-width: 22rem;
    text-decoration: none;
    color: var(--color-primary)
}

.section--courses_single .course-schedule__cta:hover {
    color: var(--color-primary)
}

.section--courses_single .course-schedule__cta-icon {
    flex-shrink: 0;
    width: 1.125rem;
    height: 1.125rem
}

.section--courses_single .course-schedule-mobile {
    display: none
}

.section--courses_single .course-schedule-mobile__card {
    background: var(--color-white);
    border: 1px solid var(--color-grey);
    border-radius: var(--radius-lg);
    overflow: hidden
}

.section--courses_single .course-schedule-mobile__card + .course-schedule-mobile__card {
    margin-top: 1rem
}

.section--courses_single .course-schedule-mobile__section {
    padding: 1rem
}

.section--courses_single .course-schedule-mobile__section + .course-schedule-mobile__section {
    border-top: 1px solid var(--color-grey)
}

.section--courses_single .course-schedule-mobile__date-link {
    display: block;
    text-decoration: none;
    color: var(--color-secondary);
    font-weight: 400;
    font-size: 2rem;
    line-height: 1.25
}

.section--courses_single .course-schedule-mobile__status {
    display: inline-flex;
    align-items: center;
    margin-top: .625rem;
    padding: .25rem .5rem;
    border-radius: var(--radius);
    background: var(--color-primary-100);
    color: var(--color-primary-700);
    font-size: .875rem;
    line-height: 1.5
}

.section--courses_single .course-schedule-mobile__section--meta {
    display: flex;
    flex-direction: column;
    gap: .75rem
}

.section--courses_single .course-schedule-mobile__meta-row {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--color-secondary);
    font-size: 1rem;
    line-height: 1.55
}

.section--courses_single .course-schedule-mobile__meta-icon {
    display: inline-flex;
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    color: var(--color-primary-600)
}

.section--courses_single .course-schedule-mobile__section--cta {
    display: flex;
    flex-direction: column;
    gap: .5rem
}

.section--courses_single .course-schedule-mobile__price {
    text-align: center;
    color: var(--color-primary-600);
    font-size: 1.25rem;
    line-height: 1.55;
    font-weight: 400
}

.section--courses_single .course-schedule-mobile__price .price {
    color: inherit
}

.section--courses_single .course-schedule-mobile__button {
    width: 100%;
    text-transform: none;
    margin: 0
}

/* #page-wrap ma globalnie overflow:hidden (layout-utilities.css); inny niż visible na przodku przerywa position:sticky */
body.single-course #page-wrap,
body.single-course #main {
    overflow: visible
}

/* Kolumna prawa: ta sama linia siatki co treść (col-start-2), w środku wrapper sticky — karta + kontakt przyklejone przy scrollu */
.section--courses_single .course-sidebar {
    position: relative;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    width: 100%;
    min-height: 0;
    z-index: 10
}

@media (min-width:1024px) {
    .section--courses_single .course-sidebar__sticky {
        position: -webkit-sticky;
        position: sticky;
        top: calc(var(--course-sticky-sidebar-top, 5rem) + 24px);
        align-self: flex-start;
        width: 100%;
        max-height: calc(100vh - var(--course-sticky-sidebar-top, 5rem) - 24px - 1rem);
        overflow-x: visible;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch
    }
}

@media (max-width:1023px) {
    .section--courses_single .course-schedule-desktop {
        display: none
    }

    .section--courses_single .course-schedule-mobile {
        display: block
    }

    .section--courses_single .course-schedule-mobile__date-link {
        font-size: 1.75rem
    }

    .section--courses_single .course-sidebar {
        z-index: auto
    }

    .section--courses_single .course-sidebar__sticky {
        position: static;
        top: auto;
        max-height: none;
        overflow: visible
    }

    .section--courses_single .course-price-card {
        overflow: hidden
    }
}

.section--courses_single .course-price-card {
    border-radius: var(--radius-2xl);
    border: 1px solid var(--color-grey);
    background: var(--color-white);
    box-shadow: none
}

.section--courses_single .course-price-card .course-dates-filter {
    padding: 1rem
}

.section--courses_single .course-price-card__body {
    gap: .75rem
}

.section--courses_single .course-price-card__label,
.section--courses_single .course-price-card__addon-label {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: .01em;
    text-transform: none;
    color: var(--color-secondary-soft)
}

.section--courses_single .course-price-card__label {
    opacity: 1
}

.section--courses_single .course-price-card__amount .course-price-card__prices {
    display: flex;
    flex-direction: column;
    gap: .125rem
}

.section--courses_single .course-price-card__amount--course {
    display: flex;
    align-items: baseline;
    gap: .5rem
}

.section--courses_single .course-price-card__from {
    font-size: 1rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-primary);
    align-self: auto;
    margin-top: 0;
    margin-bottom: 0;
    transform: none
}

.section--courses_single .course-price-card .course-price-card__amount .netto {
    font-size: 2.44125rem;
    line-height: 1.45;
    font-weight: 400;
    color: var(--color-primary)
}

.section--courses_single .course-price-card .course-price-card__amount .netto .price-item--current {
    color: inherit
}

.section--courses_single .course-price-card .course-price-card__netto-label {
    font-size: 1rem;
    font-weight: 400;
    vertical-align: baseline
}

.section--courses_single .course-price-card .course-price-card__amount .brutto {
    font-size: 1.125rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-secondary);
    opacity: 1
}

.section--courses_single .course-price-card .course-price-card__amount .brutto .price-item--current {
    color: inherit
}

.section--courses_single .course-price-card__hint {
    margin: 0;
    font-size: 1rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-secondary);
    opacity: 1
}

.section--courses_single .course-price-card hr.border-grey {
    margin: .625rem 0 .5rem;
    border-color: var(--color-grey)
}

.section--courses_single .course-price-card__submit.button {
    width: 100%;
    justify-content: center
}

.section--courses_single .course-price-card__addon-name {
    margin: 0;
    font-size: 1.5625rem;
    line-height: 1.4;
    font-weight: 400;
    color: var(--color-secondary-soft)
}

.section--courses_single .course-price-card__addon-amount .netto {
    font-size: 1.5625rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-primary)
}

.section--courses_single .course-price-card__addon-amount .brutto {
    font-size: 1.125rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-secondary-soft)
}

.section--courses_single .course-price-card__addon-hint {
    margin: 0;
    font-size: 1rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-secondary-soft)
}

.section--courses_single .course-price-card__actions {
    margin-top: var(--space-4)
}

.section--courses_single .course-price-card__submit.button {
    min-height: 3rem;
    border-radius: var(--radius-lg);
    font-size: 1.125rem;
    line-height: 1.55;
    font-weight: 400
}

.section--courses_single .course-price-card__contact {
    margin-top: var(--space-4);
    padding: 0 var(--space-4);
    text-align: center;
    font-size: 1rem;
    line-height: 1.55;
    font-weight: 400;
    color: var(--color-secondary);
    opacity: 1
}

.section--courses_single .course-price-card__contact-link {
    font-weight: 600;
    color: var(--color-primary);
    text-decoration: underline;
    text-underline-offset: .12em
}

.section--courses_single .course-price-card__contact-link:hover {
    color: var(--color-primary);
    opacity: .85
}

.section--courses_single .section-content .primary {
    width: calc(66.6666666666% - var(--space-2))
}

.section--courses_single .section-content .secondary {
    width: calc(33.3333333333% - var(--space-2));
    margin-left: var(--space-2)
}

.section--courses_single .course-details {
    display: flex;
    flex-wrap: wrap
}

.section--courses_single .course-details>li {
    flex: 0 0 50%
}

.section--courses_single .course-custom-props-below {
    margin-bottom: var(--space-3)
}

.section--courses_single .filter-field label:before {
    vertical-align: -10%;
    width: 1.125rem;
    height: 1.125rem;
    margin-right: .5rem;
    display: inline-block;
    /* Maska: kolor ikony bierze sie z tokenu, nie z wnetrza pliku SVG. */
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: left 50%;
    mask-position: left 50%;
    -webkit-mask-size: contain;
    mask-size: contain;
    background-color: var(--color-primary-600)
}

.section--courses_single .filter-field--type label:before {
    content: '';
    -webkit-mask-image: url("../images/icons/calendar%203.svg");
    mask-image: url("../images/icons/calendar%203.svg")
}

.section--courses_single .filter-field--language label:before {
    content: '';
    -webkit-mask-image: url("../images/icons/chat-bubble-square.svg");
    mask-image: url("../images/icons/chat-bubble-square.svg")
}

.section--courses_single .filter-field--location label:before {
    content: '';
    -webkit-mask-image: url("../images/icons/map-pin.svg");
    mask-image: url("../images/icons/map-pin.svg")
}

.section--courses_single .filter-field--date label:before {
    content: '';
    -webkit-mask-image: url("../images/icons/calendar%203.svg");
    mask-image: url("../images/icons/calendar%203.svg")
}

.section--courses_single .buttons :last-child {
    margin-bottom: 0
}

.course-programme {
    padding:4rem 0 ;
    display: flex;
    flex-wrap: wrap;
    gap: 0rem;
    flex-direction: column
}

.course-programme .titles {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    align-content: center;
    align-items: center
}

/* Schedule section */
.section--schedule .section-header {
    background-color: var(--color-white)
}

.section--schedule.with_cover .section-header {
    background: 0 0
}

/* Experts single section */
.section--experts_single .section-header {
    background: var(--color-white);
    padding: var(--space-2) 0
}

.section--experts_single .section-header .container {
    width: 850px
}

.section--experts_single .section-header:after {
    content: '';
    clear: both;
    display: block
}

.section--experts_single .section-header .section-title {
    margin-top: 0
}

.section--experts_single .section-header .thumbnail {
    width: 160px;
    float: left;
    margin-right: var(--space-base);
    border-radius: var(--radius-lg);
    overflow: hidden
}

.section--experts_single .section-header .list--expert_certificates {
    clear: both
}

.section--experts_single .section-content .container {
    width: 630px
}

/* Testimonials section */
.section--testimonials h2 {
    border-top: 1px solid var(--color-grey);
    margin-top: var(--space-1);
    padding-top: var(--space-1)
}

.section--testimonials h2:first-child {
    border-top: 0;
    margin-top: 0
}

/* Search section */
.section--search .section-header {
    background: var(--color-white);
    padding: var(--space-2) 0
}

/* Message box sections */
.section--messagebox {
    padding: var(--space-1) 0
}

.section--messagebox .section-header {
    text-align: center;
    background: 0 0
}

.section--messagebox .section-title {
    font: var(--text-4xl)
}

.section--messagebox .section-title:before {
    content: none;
    width: 7rem;
    height: 7rem;
    display: block;
    margin: var(--space-base) auto;
    background: transparent no-repeat 50% 50%;
    background-size: contain
}

.section--messagebox_success .section-title:before {
    content: '';
    background-image: url(../images/icons/icon-checkmark.png)
}

.section--messagebox_error .section-title:before {
    content: '';
    background-image: url(../images/icons/negative.svg)
}

.section--404 .section-title:before {
    content: '';
    background-image: url(../images/icons/icon-404.png)
}

.section--no-filter-results .section-title:before {
    content: '';
    background-image: url(../images/icons/icon-no-filter-results.png)
}

.section--no-search-results .section-title:before {
    content: '';
    background-image: url(../images/icons/icon-404.png)
}

/* Widgets section */
#main .section--widgets .widget {
    margin: var(--space-2) auto
}

.inprogress_widget_offer {
    padding: var(--space-1) var(--space-base);
    background: var(--color-secondary);
    border-radius: var(--radius-2xl);
    text-align: center;
    color: var(--color-white);
    font: var(--text-xl)
}

.inprogress_widget_offer .widget-title {
    color: var(--color-white);
    font: var(--text-4xl);
    margin-top: 0
}

/* Special sections */
.section-green {
    background: var(--color-primary);
    color: var(--color-white);
    text-align: center;
    padding: 4rem 0
}

.section-green h1,
.section-green h2,
.section-green h3,
.section-green h4,
.section-green h5 {
    color: var(--color-white)
}

.section-green a {
    color: var(--color-white)
}

ul.icons {
    display: flex;
    flex-wrap: wrap;
    margin: 0
}

ul.icons h4 {
    color: var(--color-white);
    margin: 1rem 0 0 0
}

ul.icons li {
    list-style: none;
    flex: 1 0 20%;
    margin: 5px
}

.steper {
    border-radius: var(--radius-full);
    display: block;
    margin: 0 auto;
    font-size: 1.25em;
    padding: .25rem 0 0 0;
    background: var(--color-primary);
    color: var(--color-white);
    width: 40px;
    height: 40px
}

.align-center {
    text-align: center
}

.row {
    display: flex;
    flex-wrap: nowrap
}

/* Special InProgressPlus sections */
.section--self-development {
    padding: 0 0rem
}

.section--self-development ul.advantages-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-flow: dense;
    align-items: start
}

.section--self-development .pricing-section h2 {
    color: var(--color-primary);
    margin: 0
}

.section--self-development .pricings-buttons {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center
}

.section--self-development .pricings-buttons .single {
    margin: .5rem 1rem;
    width: auto
}

.inprogressplus--logos {
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.inprogressplus--logos img {
    margin: 0 .5rem;
    max-height: 48px;
    width: auto
}

ul.menu--landingpage {
    padding: 2rem 0 0rem 0
}

ul.menu--landingpage li {
    list-style: none;
    display: inline;
    margin: 0;
    padding: 0 !important
}

ul.menu--landingpage li:before {
    display: none !important
}

ul.menu--landingpage li a {
    color: var(--color-white);
    background-color: rgb(var(--color-secondary-rgb) / .6);
    border: 1px solid rgb(var(--color-grey-rgb) / .16);
    box-sizing: border-box;
    padding: .5rem 1rem;
    text-decoration: none;
    margin-right: -5px
}

ul.menu--landingpage li:first-child a {
    border-radius: var(--radius-lg) 0 0 var(--radius-lg)}

ul.menu--landingpage li:last-child a {
    border-radius: 0 var(--radius-lg) var(--radius-lg) 0}

ul.menu--landingpage li.current-menu-item a {
    background: var(--color-primary)
}