:root {
    --kp-block-paper: #f4f0e8;
    --kp-block-ink: #0d1012;
    --kp-block-line: rgba(13, 16, 18, 0.16);
    --kp-block-shell: min(92vw, 1480px);
    --kp-block-header-height: 93px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    background: var(--kp-block-paper);
    color: var(--kp-block-ink);
    margin: 0;
}

body.admin-bar {
    --kp-admin-offset: 32px;
}

.kp-skip-link {
    background: #0d1012;
    color: #fff;
    left: 16px;
    padding: 12px 16px;
    position: fixed;
    top: -100px;
    z-index: 10000;
}

.kp-skip-link:focus {
    top: calc(var(--kp-admin-offset, 0px) + 12px);
}

.wp-site-blocks,
.wp-site-blocks > *,
.kp-block-main,
.kp-block-main > .wp-block-post-content {
    margin-block-start: 0;
}

.kp-block-main,
.kp-block-main > .wp-block-post-content {
    max-width: none;
    padding: 0;
    width: 100%;
}

.kp-block-main > .wp-block-post-content > .wp-block-group,
.kp-block-main > .wp-block-post-content > main,
.kp-block-main > .wp-block-post-content > div {
    margin-block-start: 0;
    max-width: none;
}

.kp-home > .wp-block-group,
.kp-xp > .wp-block-group,
.kp-page-main > .wp-block-group {
    margin-block-start: 0;
}

:where(.kp-home, .kp-xp, .kp-page-main) > :where(.wp-block-group, .wp-block-html),
:where(.kp-home, .kp-xp, .kp-page-main) :where(.wp-block-group, .wp-block-html) {
    margin-block-end: 0;
    margin-block-start: 0;
}

.wp-block-image {
    margin: 0;
}

.wp-block-image img {
    display: block;
    height: auto;
    max-width: 100%;
}

/* Contrast raised from 3.98:1 to meet WCAG AA for the small step labels. */
.kp-details__list article > span {
    color: #555c61;
}

.kp-visit::before,
.kp-visit::after {
    content: "";
    inset: 0;
    position: absolute;
}

.kp-visit::before {
    background: url("/wp-content/uploads/2021/12/Pub-Klub-Pictures-12.jpg") center / cover no-repeat;
    z-index: -3;
}

.kp-visit::after {
    background: linear-gradient(90deg, rgba(5, 7, 10, 0.93), rgba(5, 7, 10, 0.59) 57%, rgba(5, 7, 10, 0.26));
    z-index: -2;
}

.kp-block-header {
    align-items: center;
    background: rgba(244, 240, 232, 0.98);
    border-bottom: 1px solid rgba(13, 16, 18, 0.12);
    display: flex;
    height: var(--kp-block-header-height);
    inset: var(--kp-admin-offset, 0) 0 auto;
    margin: 0;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

.kp-block-header__inner {
    height: 100%;
    margin: 0 auto;
    max-width: var(--kp-block-shell) !important;
    padding: 0;
    width: var(--kp-block-shell);
}

.kp-block-header__logo {
    flex: 0 0 auto;
    margin: 0;
}

.kp-block-header__logo img,
.kp-block-header .custom-logo {
    display: block;
    filter: brightness(0);
    height: auto;
    max-height: none;
    max-width: 144px;
    width: clamp(128px, 10vw, 144px);
}

.kp-block-header__actions {
    gap: clamp(32px, 2.43vw, 42px);
    margin-right: 10px;
}

.kp-block-nav {
    font-size: 13px;
    font-weight: 560;
    gap: clamp(19px, 1.5vw, 26px);
    letter-spacing: -0.13px;
    line-height: 18.2px;
}

.kp-block-nav .wp-block-navigation-item__content {
    line-height: 18.2px;
    min-height: 48px;
    padding-block: 14px;
}

.kp-block-nav .wp-block-navigation__submenu-icon {
    height: 24px;
    margin-left: 6px;
    width: 24px;
}

.kp-block-nav .wp-block-navigation__submenu-icon svg {
    height: 10px;
    width: 10px;
}

.kp-block-nav .wp-block-navigation__submenu-container {
    background: var(--kp-block-paper) !important;
    border: 1px solid var(--kp-block-line) !important;
    min-width: 250px !important;
    padding: 12px !important;
}

.kp-block-header__phone {
    flex: 0 0 auto;
}

.kp-block-header__phone .wp-block-button__link {
    align-items: center;
    background: var(--kp-block-ink) !important;
    border: 1px solid var(--kp-block-ink) !important;
    color: #fff !important;
    display: flex;
    gap: 10px;
    min-height: 48px;
    padding: 0 21px;
    white-space: nowrap;
    width: 190.375px;
}

.kp-block-header__phone .wp-block-button__link:hover,
.kp-block-header__phone .wp-block-button__link:focus-visible {
    background: #252a2e !important;
    border-color: #252a2e !important;
    color: #fff !important;
}

.kp-block-header__phone small {
    font-size: 9px;
    font-weight: 600;
    opacity: 0.64;
    text-transform: none;
}

.kp-block-footer {
    background:
        radial-gradient(circle at 82% 12%, rgba(169, 217, 237, 0.035), transparent 28%),
        #080a0d;
    border-top: 1px solid rgba(255, 255, 255, 0.13);
    color: rgba(255, 255, 255, 0.58);
    font-family: "Bricolage Grotesque", Arial, sans-serif;
    margin: 0;
    min-height: 611px;
    max-width: none !important;
    padding: 0;
    width: 100% !important;
}

.kp-block-footer a {
    color: inherit;
}

.kp-legacy-footer__top,
.kp-legacy-footer__bottom {
    margin-inline: auto;
    max-width: var(--kp-block-shell) !important;
    width: var(--kp-block-shell);
}

.kp-legacy-footer__top {
    align-items: start;
    border-top: 1px solid transparent;
    display: grid !important;
    gap: 60px;
    grid-template-columns: minmax(0, 1.6fr) minmax(230px, 0.85fr) minmax(72px, 0.25fr) minmax(110px, 0.35fr);
    padding: 100px 0;
}

.kp-legacy-footer h2 {
    color: #fff;
    font-size: 12px;
    font-weight: 730;
    letter-spacing: 1.92px !important;
    line-height: 18px;
    margin: 0 0 24px;
    text-transform: uppercase;
}

.kp-legacy-footer p {
    color: rgba(255, 255, 255, 0.58);
    font-size: 15px;
    font-weight: 430;
    line-height: 27px;
    margin: 15px 0;
}

.kp-legacy-footer__about,
.kp-legacy-footer__address {
    display: block !important;
}

.kp-legacy-footer__text {
    display: flow-root;
    margin: 0 !important;
}

.kp-legacy-footer__about p {
    max-width: 470px;
}

.kp-legacy-footer__address strong {
    color: rgba(255, 255, 255, 0.74);
    display: inline;
    font-size: 15px;
    line-height: 27px;
    margin: 0;
}

.kp-legacy-footer__social {
    align-items: center;
    align-self: stretch;
    gap: 22px;
    justify-content: flex-end;
    justify-self: stretch;
    margin: 0 !important;
    min-height: 45px;
}

.kp-legacy-footer__social .wp-social-link {
    background: transparent !important;
}

.kp-legacy-footer__social .wp-social-link a {
    padding: 0 !important;
}

.kp-legacy-footer__social svg {
    height: 17px;
    width: 17px;
}

.kp-legacy-footer__bottom {
    align-items: flex-start;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
    column-gap: 30px;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-height: 176px;
    padding: 28px 0 42px;
    row-gap: 0;
}

.kp-legacy-footer__bottom p {
    color: rgba(255, 255, 255, 0.5);
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.48px;
    line-height: 27px;
    margin: 0;
}

.kp-legacy-footer__bottom p:first-child {
    max-width: 640px;
    min-height: 105px;
    padding: 12px 0;
}

.kp-legacy-footer__bottom p:last-child {
    display: block;
    min-height: 72px;
    padding-top: 15px;
    text-align: right;
}

.kp-block-article,
.kp-block-archive,
.kp-block-error {
    margin: 0 auto;
    max-width: var(--kp-block-shell);
    padding: calc(var(--kp-block-header-height) + 80px) 0 110px;
    width: var(--kp-block-shell);
}

.kp-block-article > .wp-block-post-title,
.kp-block-archive > h1,
.kp-block-error > h1 {
    font-size: clamp(52px, 7vw, 94px);
    margin: 40px 0;
}

.kp-block-card {
    background: rgba(255, 255, 255, 0.28);
    border: 1px solid var(--kp-block-line);
    height: 100%;
    overflow: hidden;
    padding: 0 0 34px;
    position: relative;
    transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.kp-block-card > *:not(.wp-block-post-featured-image) {
    margin-inline: clamp(24px, 3vw, 42px);
}

.kp-block-archive > h1 {
    font-size: clamp(62px, 8vw, 124px);
    letter-spacing: -0.065em;
    line-height: 0.9;
    margin: 54px 0 28px;
}

.kp-block-archive__lead {
    color: #555c61;
    font-size: clamp(18px, 1.5vw, 22px);
    line-height: 1.6;
    margin: 0 0 clamp(48px, 6vw, 82px);
    max-width: 720px;
}

.kp-block-archive .wp-block-post-template {
    align-items: stretch;
    gap: clamp(18px, 2vw, 30px);
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    margin: 0;
    padding: 0;
}

.kp-block-archive .wp-block-post {
    margin: 0;
    min-width: 0;
}

.kp-block-archive .wp-block-post:last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

.kp-block-archive .wp-block-post-featured-image {
    aspect-ratio: 16 / 9;
    margin: 0 0 34px;
    overflow: hidden;
}

.kp-block-archive .wp-block-post-featured-image a,
.kp-block-archive .wp-block-post-featured-image img {
    display: block;
    height: 100%;
    width: 100%;
}

.kp-block-archive .wp-block-post-featured-image img {
    object-fit: cover !important;
    transition: transform 420ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.kp-block-archive .wp-block-post-title {
    font-size: clamp(30px, 2.7vw, 46px) !important;
    letter-spacing: -0.05em;
    line-height: 0.98;
    margin-bottom: 20px;
    margin-top: 0;
    max-width: 780px;
}

.kp-block-archive .wp-block-post-title a {
    color: var(--kp-block-ink);
}

.kp-block-archive .wp-block-post-excerpt {
    color: #555c61;
    font-size: 17px;
    line-height: 1.65;
    margin-bottom: 0;
}

.kp-block-archive .wp-block-post-excerpt__excerpt {
    margin: 0;
    max-width: 720px;
}

.kp-block-archive .wp-block-post-excerpt__more-text {
    margin: 28px 0 0;
}

.kp-block-archive .wp-block-post-excerpt__more-link {
    align-items: center;
    color: var(--kp-block-ink);
    display: inline-flex;
    font-size: 12px;
    font-weight: 750;
    gap: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.kp-block-archive .wp-block-post-excerpt__more-link::after {
    border-right: 1.5px solid currentColor;
    border-top: 1.5px solid currentColor;
    content: "";
    height: 8px;
    transform: rotate(45deg);
    transition: transform 180ms ease;
    width: 8px;
}

.kp-block-archive .wp-block-post:not(.has-post-thumbnail) .kp-block-card {
    background:
        radial-gradient(circle at 87% 20%, rgba(169, 217, 237, 0.55), transparent 26%),
        #e8e1d6;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 330px;
    padding-top: 90px;
}

.kp-block-archive .kp-block-card:hover,
.kp-block-archive .kp-block-card:focus-within {
    border-color: rgba(13, 16, 18, 0.42);
    box-shadow: 0 22px 54px rgba(13, 16, 18, 0.08);
    transform: translateY(-3px);
}

.kp-block-archive .kp-block-card:hover .wp-block-post-featured-image img,
.kp-block-archive .kp-block-card:focus-within .wp-block-post-featured-image img {
    transform: scale(1.025);
}

.kp-block-archive .wp-block-post-excerpt__more-link:hover::after,
.kp-block-archive .wp-block-post-excerpt__more-link:focus-visible::after {
    transform: translateX(4px) rotate(45deg);
}

.kp-block-archive > h1,
.kp-block-archive > .kp-block-archive__lead,
.kp-block-archive > .wp-block-query {
    margin-left: 0 !important;
    margin-right: auto !important;
}

.kp-block-archive > .wp-block-query {
    max-width: none !important;
    width: 100% !important;
}

.kp-block-archive .kp-block-card > *:not(.wp-block-post-featured-image) {
    margin-left: clamp(24px, 3vw, 42px) !important;
    margin-right: clamp(24px, 3vw, 42px) !important;
}

.kp-native-price {
    background: var(--kp-block-paper);
    padding: calc(var(--kp-block-header-height) + 66px) 0 100px;
}

.kp-native-price__head,
.kp-native-price__categories {
    margin-inline: auto;
    max-width: 1180px !important;
    width: min(calc(100% - 48px), 1180px);
}

.kp-native-price__head {
    border-bottom: 1px solid var(--kp-block-line);
    padding: 40px 0 54px;
}

.kp-native-price__head h1 {
    font-size: clamp(54px, 8vw, 104px);
    margin: 0;
}

.kp-price-category {
    border-bottom: 1px solid var(--kp-block-line);
    padding: 46px 0;
}

.kp-price-category > h2 {
    font-size: clamp(28px, 3.4vw, 48px);
    margin: 0 0 28px;
}

.kp-price-row {
    align-items: baseline;
    border-top: 1px solid rgba(13, 16, 18, 0.1);
    display: grid !important;
    gap: 24px;
    grid-template-columns: minmax(0, 1fr) auto;
    padding: 14px 0;
}

.kp-price-row p {
    margin: 0;
}

.kp-price-row__name {
    font-weight: 560;
}

.kp-price-row__price {
    font-variant-numeric: tabular-nums;
    font-weight: 720;
    text-align: right;
}

.kp-native-contact {
    padding: calc(var(--kp-block-header-height) + 70px) 0 0;
}

.kp-native-contact__hero,
.kp-native-contact__details,
.kp-native-contact__form {
    margin-inline: auto;
    max-width: 1180px !important;
    width: min(calc(100% - 48px), 1180px);
}

.kp-native-contact__hero {
    display: grid !important;
    gap: clamp(40px, 8vw, 110px);
    grid-template-columns: 1.1fr 0.9fr;
    padding: 60px 0 80px;
}

.kp-native-contact__hero h1 {
    font-size: clamp(54px, 8vw, 104px);
    margin: 0;
}

.kp-native-contact__details {
    border-block: 1px solid var(--kp-block-line);
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
}

.kp-native-contact__details > .wp-block-group {
    border-left: 1px solid var(--kp-block-line);
    padding: 42px;
}

.kp-native-contact__details > .wp-block-group:first-child {
    border-left: 0;
}

.kp-native-map {
    background: #111;
    margin: 0 !important;
    min-height: 520px;
}

.kp-native-map iframe {
    border: 0;
    display: block;
    filter: grayscale(0.8) contrast(1.08);
    height: 520px;
    width: 100%;
}

.kp-native-contact__form {
    padding-block: 90px 110px;
}

.kp-native-contact__form h2 {
    font-size: clamp(42px, 6vw, 78px);
}

.kp-native-gallery {
    padding: calc(var(--kp-block-header-height) + 60px) 0 100px;
}

.kp-native-gallery > * {
    margin-inline: auto;
    max-width: 1320px;
    width: min(calc(100% - 48px), 1320px);
}

.kp-native-gallery h1 {
    font-size: clamp(54px, 8vw, 104px);
    margin: 14px 0 20px;
}

.kp-native-gallery__head > p:last-child {
    color: #555c61;
    font-size: clamp(17px, 1.5vw, 20px);
    line-height: 1.65;
    margin: 0 0 48px;
    max-width: 720px;
}

.kp-native-gallery__grid {
    display: grid !important;
    gap: 12px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.kp-native-gallery .wp-block-gallery {
    gap: 12px !important;
}

.kp-native-gallery .blocks-gallery-grid {
    display: grid !important;
    gap: 12px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    width: 100%;
}

.kp-native-gallery .blocks-gallery-item {
    margin: 0 !important;
    width: auto !important;
}

.kp-native-gallery .blocks-gallery-item figure,
.kp-native-gallery .blocks-gallery-item a,
.kp-native-gallery .blocks-gallery-item img {
    display: block;
    height: 100%;
    width: 100%;
}

.kp-native-gallery .blocks-gallery-item figure {
    aspect-ratio: 4 / 3;
}

.kp-native-gallery .blocks-gallery-item img {
    object-fit: cover;
}

.kp-native-journal {
    padding: calc(var(--kp-block-header-height) + 70px) 0 110px;
}

.kp-native-journal > * {
    margin-inline: auto;
    max-width: 1180px;
    width: min(calc(100% - 48px), 1180px);
}

.kp-native-journal h1 {
    font-size: clamp(54px, 8vw, 104px);
}

.kp-native-journal .wp-block-post-template {
    gap: 24px;
}

.kp-native-journal .wp-block-post {
    border: 1px solid var(--kp-block-line);
    padding-bottom: 28px;
}

.kp-native-journal .wp-block-post > *:not(.wp-block-post-featured-image) {
    margin-inline: 26px;
}

.kp-xp-button--text .wp-block-button__link {
    background: transparent !important;
    border: 0 !important;
    color: inherit !important;
}

.kp-inquiry--native {
    display: contents;
}

@media (max-width: 1050px) {
    .kp-block-header__phone {
        display: none !important;
    }

    .kp-block-header__logo img,
    .kp-block-header .custom-logo {
        max-width: 126px;
        width: 126px;
    }

    .kp-block-header__actions {
        gap: 0;
        margin-left: auto;
        margin-right: 0;
    }

    .kp-block-nav .wp-block-navigation__responsive-container:not(.is-menu-open) {
        display: none !important;
    }

    .kp-block-nav .wp-block-navigation__responsive-container-open {
        display: flex !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open {
        background: var(--kp-block-paper) !important;
        color: var(--kp-block-ink) !important;
        height: 100dvh;
        max-height: 100dvh;
        overflow-y: auto;
        padding: 0 20px calc(92px + env(safe-area-inset-bottom)) !important;
    }

    .kp-block-header__logo {
        position: relative;
        z-index: 100001;
    }

    .wp-block-navigation__responsive-container-close,
    .wp-block-navigation__responsive-container-open {
        align-items: center;
        background: var(--kp-block-ink);
        color: #fff;
        display: flex;
        height: 74px;
        justify-content: center;
        margin: 0;
        padding: 0;
        width: 74px;
    }

    .wp-block-navigation__responsive-container-close svg,
    .wp-block-navigation__responsive-container-open svg {
        display: block;
        height: 26px;
        margin: 0;
        width: 26px;
    }

    .wp-block-navigation__responsive-container-content {
        align-items: stretch !important;
        min-height: 0 !important;
        padding-top: 104px !important;
    }

    .wp-block-navigation__responsive-container .kp-block-nav,
    .wp-block-navigation__responsive-container .kp-block-nav > .wp-block-navigation-item,
    .wp-block-navigation__responsive-container .kp-block-nav .wp-block-navigation__submenu-container {
        align-items: stretch !important;
        flex-direction: column !important;
        gap: 0 !important;
        width: 100%;
    }

    .wp-block-navigation__responsive-container .kp-block-nav > .wp-block-navigation-item {
        border-bottom: 1px solid var(--kp-block-line);
        width: 100%;
    }

    .wp-block-navigation__responsive-container .kp-block-nav > .wp-block-navigation-item > .wp-block-navigation-item__content {
        font-size: 22px;
        letter-spacing: normal;
        line-height: 1.25;
        padding: 13px 2px !important;
        width: 100%;
    }

    .wp-block-navigation__responsive-container .kp-block-nav > .has-child > .wp-block-navigation-item__content {
        color: #5a6064;
        font-size: 10px;
        font-weight: 750;
        letter-spacing: 0.16em;
        padding-bottom: 12px !important;
        text-transform: uppercase;
    }

    .wp-block-navigation__responsive-container .kp-block-nav .wp-block-navigation__submenu-container {
        background: transparent !important;
        border: 0 !important;
        border-left: 1px solid var(--kp-block-line) !important;
        margin: 0 0 12px 2px !important;
        min-width: 0 !important;
        padding: 0 0 0 18px !important;
        position: static !important;
    }

    .wp-block-navigation__responsive-container .kp-block-nav .wp-block-navigation__submenu-container .wp-block-navigation-item {
        border-bottom: 1px solid var(--kp-block-line);
        width: 100%;
    }

    .wp-block-navigation__responsive-container .kp-block-nav .wp-block-navigation__submenu-container .wp-block-navigation-item:last-child {
        border-bottom: 0;
    }

    .wp-block-navigation__responsive-container .kp-block-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        font-size: 18px;
        justify-content: flex-start !important;
        line-height: 1.25;
        padding: 11px 2px !important;
        text-align: left !important;
        width: 100% !important;
    }

    .kp-legacy-footer__top,
    .kp-legacy-footer__bottom {
        width: var(--kp-block-shell);
    }

    .kp-legacy-footer__top {
        column-gap: 40px;
        grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
        padding: 71.68px 0;
        row-gap: 40px;
    }

    .kp-legacy-footer h2 {
        line-height: 14.4px;
    }

    .kp-legacy-footer__about,
    .kp-legacy-footer__address {
        margin-bottom: 30px !important;
    }

    .kp-legacy-footer__social {
        justify-content: flex-start;
    }

    .kp-legacy-footer__bottom {
        grid-template-columns: 1fr;
        min-height: 248px;
    }

    .kp-legacy-footer__bottom p:first-child {
        max-width: 470px;
    }

    .kp-legacy-footer__bottom p:last-child {
        text-align: left;
    }
}

@media (max-width: 782px) {
    :root {
        --kp-admin-offset: 46px;
        --kp-block-header-height: 75px;
    }

    .kp-block-header__inner {
        margin: 0;
        max-width: none !important;
        padding-left: 20px;
        width: 100%;
    }

    .kp-block-header__logo img,
    .kp-block-header .custom-logo {
        height: 34.1875px;
        max-height: 34.1875px;
        max-width: 112px;
        width: 112px;
    }

    .kp-block-header__actions {
        gap: 0;
        margin-left: auto;
    }

    .wp-block-navigation__responsive-container-close {
        background: var(--kp-block-ink) !important;
        color: #fff !important;
        height: 58px;
        right: 0 !important;
        top: 8px !important;
        width: 58px;
    }

    .wp-block-navigation__responsive-container-close svg {
        fill: currentColor;
        height: 24px;
        width: 24px;
    }

    .kp-block-footer {
        min-height: 0;
    }

    .kp-native-contact__hero,
    .kp-native-contact__details {
        grid-template-columns: 1fr;
    }

    .kp-native-contact__details > .wp-block-group {
        border-left: 0;
        border-top: 1px solid var(--kp-block-line);
        padding: 30px 0;
    }

    .kp-native-contact__details > .wp-block-group:first-child {
        border-top: 0;
    }

    .kp-native-map,
    .kp-native-map iframe {
        min-height: 430px;
    }

    .kp-native-gallery__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kp-native-gallery .blocks-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .kp-visit::after {
        background: linear-gradient(0deg, rgba(5, 7, 10, 0.95), rgba(5, 7, 10, 0.35));
    }
}

@media (max-width: 520px) {
    .kp-native-gallery__grid {
        grid-template-columns: 1fr;
    }

    .kp-native-gallery .blocks-gallery-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 680px) {
    .kp-legacy-footer__top,
    .kp-legacy-footer__bottom {
        width: var(--kp-block-shell);
    }

    .kp-legacy-footer__top {
        gap: 0;
        grid-template-columns: 1fr !important;
        padding: 52px 0 34px;
    }

    .kp-legacy-footer__about,
    .kp-legacy-footer__address {
        margin-bottom: 0 !important;
        padding-bottom: 30px;
    }

    .kp-legacy-footer__about p {
        max-width: none;
    }

    .kp-legacy-footer__about {
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    }

    .kp-legacy-footer__address {
        padding-top: 30px;
    }

    .kp-legacy-footer__spacer {
        display: none !important;
    }

    .kp-legacy-footer__social {
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        justify-self: start;
        min-height: 0;
        padding-top: 24px;
    }

    .kp-legacy-footer__bottom {
        align-items: flex-start;
        gap: 14px;
        grid-template-columns: 1fr;
        min-height: 0;
        padding: 26px 0 calc(96px + env(safe-area-inset-bottom));
    }

    .kp-legacy-footer__bottom p:first-child {
        max-width: none;
        min-height: 0;
        padding: 0;
    }

    .kp-legacy-footer__bottom p:last-child {
        min-height: 0;
        padding: 0;
        text-align: left;
    }
}

@media print {
    .kp-block-header,
    .kp-block-footer {
        display: none !important;
    }

    .kp-native-price {
        padding-top: 0;
    }

    .kp-price-category {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    .kp-price-row {
        break-inside: avoid;
    }
}
.kp-hero__media .wp-block-image,
.kp-xp-hero__media .wp-block-image,
.kp-native-gallery__grid .wp-block-image {
    width: 100%;
    height: 100%;
    min-height: 0 !important;
    margin: 0;
}

.kp-hero__media .wp-block-image img,
.kp-xp-hero__media .wp-block-image img,
.kp-native-gallery__grid .wp-block-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kp-native-gallery__grid .wp-block-image {
    aspect-ratio: 4 / 3;
    cursor: zoom-in;
}

.kp-gallery-lightbox {
    width: min(94vw, 1440px);
    height: min(92vh, 1000px);
    padding: 0;
    border: 0;
    background: #08090b;
    color: #fff;
}

.kp-gallery-lightbox::backdrop {
    background: rgb(0 0 0 / 88%);
    backdrop-filter: blur(8px);
}

.kp-gallery-lightbox img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.kp-gallery-lightbox__close {
    position: absolute;
    z-index: 2;
    top: 12px;
    right: 12px;
    width: 48px;
    height: 48px;
    border: 1px solid rgb(255 255 255 / 35%);
    border-radius: 0;
    background: rgb(8 9 11 / 82%);
    color: #fff;
    font: 400 34px/1 sans-serif;
    cursor: pointer;
}
/* The billiards CTA uses a pale green accent; dark text keeps WCAG contrast. */
body.kp-xp-page-bilard-na-bialolece .kp-xp-cta .kp-xp-kicker--light {
    color: #1d2723 !important;
}

body.kp-xp-page-bilard-na-bialolece .kp-xp .kp-xp-cta h2 {
    color: #101313 !important;
}

/* The tournament CTA uses a violet surface; the original muted label missed WCAG AA. */
body.kp-xp-page-turniej-bilardowy-warszawa .kp-xp-cta .kp-xp-kicker--light {
    color: #241b2c !important;
}

body.kp-xp-page-turniej-bilardowy-warszawa .kp-guide-section a,
body.kp-xp-page-turniej-bilardowy-warszawa .kp-cluster-inline p a {
    text-decoration-line: underline;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.16em;
}

/*
 * One visual axis for the full site. The homepage already uses this 1480 px
 * shell; header, service pages, supporting copy and footer now share it.
 */
.kp-xp-shell,
.kp-native-price__head,
.kp-native-price__categories,
.kp-native-contact__hero,
.kp-native-contact__details,
.kp-native-contact__form,
.kp-native-gallery > *,
.kp-native-journal > *,
.kp-price-tools,
.kpseo-content-section > .elementor-container {
    margin-inline: auto !important;
    max-width: var(--kp-block-shell) !important;
    width: var(--kp-block-shell) !important;
}

/* Legacy Elementor sections used their own fluid side padding. Removing only
 * the horizontal inset keeps their vertical rhythm while aligning their copy
 * with the Gutenberg shell, header and footer. */
body.kp-visual:not(.home).elementor-page .kpseo-content-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Contact does not need a photographic masthead. Keep only the space occupied
 * by the fixed header so the page title starts cleanly below navigation. */
body.kp-visual:not(.home).elementor-page.kp-page-kontakt .elementor > .elementor-section:first-child,
body.kp-visual:not(.home).elementor-page.kp-page-kontakt .elementor > .elementor-section:first-child > .elementor-container {
    background-color: var(--kp-block-paper) !important;
    background-image: none !important;
    height: var(--kp-block-header-height) !important;
    min-height: var(--kp-block-header-height) !important;
}

body.kp-visual:not(.home).elementor-page.kp-page-kontakt .elementor > .elementor-section:first-child::after,
body.kp-visual:not(.home).elementor-page.kp-page-kontakt .elementor > .elementor-section:first-child > .elementor-background-overlay {
    display: none !important;
}

.kpseo-content-section > .elementor-container > .elementor-column > .elementor-widget-wrap,
body.kp-page-cennik .elementor > .elementor-section:not(:first-child) > .elementor-container > .elementor-column > .elementor-widget-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.kp-legacy-footer__text > * {
    margin-left: 0 !important;
    margin-right: auto !important;
}

body.kp-page-cennik .elementor > .elementor-section:not(:first-child) > .elementor-container,
body.kp-page-kontakt .elementor > .elementor-section:not(:first-child) > .elementor-container {
    margin-inline: auto !important;
    max-width: var(--kp-block-shell) !important;
    width: var(--kp-block-shell) !important;
}

.kp-block-footer {
    border-top: 0;
    position: relative;
}

.kp-block-footer::before {
    background: linear-gradient(
        90deg,
        transparent,
        rgba(255, 255, 255, 0.08) 7%,
        rgba(255, 255, 255, 0.24) 50%,
        rgba(255, 255, 255, 0.08) 93%,
        transparent
    );
    content: "";
    height: 1px;
    left: 50%;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: var(--kp-block-shell);
}

/* Price values use the same ink as their product names, not an accent hue. */
body.kp-visual.kp-page-cennik .food-price {
    color: var(--kp-block-ink) !important;
}

/* The explanatory price copy is an editorial panel instead of loose SEO text. */
body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section {
    background: #e6dfd3 !important;
    color: var(--kp-block-ink) !important;
    margin-top: clamp(68px, 7vw, 112px);
    padding: clamp(70px, 8vw, 118px) 0 !important;
}

body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content {
    align-items: start;
    display: grid !important;
    gap: 0 clamp(52px, 8vw, 138px);
    grid-template-columns: minmax(300px, 0.82fr) minmax(0, 1.18fr);
}

body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content h2 {
    border: 0 !important;
    color: var(--kp-block-ink) !important;
    font-size: clamp(44px, 5vw, 76px);
    grid-row: 1 / span 3;
    letter-spacing: -0.055em;
    line-height: 0.96;
    margin: 0 !important;
    padding: 0 !important;
}

body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content h2::before {
    color: rgba(13, 16, 18, 0.58);
    content: "Dobrze wiedzieć";
    display: block;
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 0.14em;
    line-height: 1.3;
    margin-bottom: 24px;
    text-transform: uppercase;
}

body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content p {
    border-top: 1px solid rgba(13, 16, 18, 0.18);
    color: rgba(13, 16, 18, 0.7) !important;
    font-size: clamp(16px, 1.25vw, 18px);
    line-height: 1.72;
    margin: 0 !important;
    padding: 20px 0 28px;
}

body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content a,
body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content strong {
    color: var(--kp-block-ink) !important;
}

@media (max-width: 782px) {
    :root {
        --kp-block-shell: min(calc(100% - 40px), 1480px);
    }

    .kp-block-header__inner {
        padding-inline: 20px 0;
    }

    .kp-block-archive {
        padding-bottom: 80px;
        padding-top: calc(var(--kp-block-header-height) + 52px);
    }

    .kp-block-archive > h1 {
        font-size: clamp(54px, 17vw, 76px);
        margin: 36px 0 22px;
    }

    .kp-block-archive__lead {
        font-size: 17px;
        line-height: 1.55;
        margin-bottom: 42px;
    }

    .kp-block-archive .wp-block-post-template {
        grid-template-columns: 1fr !important;
    }

    .kp-block-archive .wp-block-post:last-child:nth-child(odd) {
        grid-column: auto;
    }

    .kp-block-archive .wp-block-post-featured-image {
        margin-bottom: 26px;
    }

    .kp-block-archive .wp-block-post-title {
        font-size: clamp(29px, 8.5vw, 38px) !important;
    }

    .kp-block-archive .wp-block-post-excerpt {
        font-size: 16px;
    }

    .kp-block-archive .wp-block-post:not(.has-post-thumbnail) .kp-block-card {
        min-height: 300px;
        padding-top: 70px;
    }

    body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content {
        display: block !important;
    }

    body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content h2 {
        font-size: clamp(42px, 12vw, 58px);
        margin-bottom: 40px !important;
    }

    body.kp-visual.kp-page-cennik.elementor-page .kpseo-content-section .kpseo-content p {
        font-size: 16px;
        padding: 18px 0 24px;
    }
}

/* ============================================================================
   KP — NAGŁÓWEK I MENU MOBILNE                       (Claude, audyt 2026-08-09)
   ----------------------------------------------------------------------------
   1) BŁĄD: --kp-admin-offset: 46px był ustawiony na :root dla WSZYSTKICH gości
      poniżej 782px. 46px to wysokość paska admina WordPressa, więc przyklejony
      nagłówek wisiał 46px poniżej krawędzi ekranu każdemu odwiedzającemu.
      Na desktopie ta sama zmienna jest poprawnie ograniczona do body.admin-bar.
   2) Hamburger był czarnym kwadratem 74x74. Zastąpiony przyciskiem 44x44
      i przeniesiony na prawą krawędź — telefon idzie przed nim.
   3) Menu po rozwinięciu było zwykłą listą: pionowa kreska przy podpunktach,
      separator w każdym wierszu, martwa przestrzeń u góry, brak domknięcia.
      Przebudowane na dwa czytelne poziomy + przyklejone CTA telefoniczne.
   4) Kolorowa belka rezerwacji usunięta (wyłączona w kp-visual-refresh.php).
   Zasada nadrzędna: zero zaokrągleń — serwis konsekwentnie ich nie używa.
   ============================================================================ */

/* --- 1. Nagłówek przyklejony do górnej krawędzi ---------------------------- */

@media (max-width: 782px) {
    :root {
        --kp-admin-offset: 0px;
        --kp-block-header-height: 68px;
    }

    body.admin-bar {
        --kp-admin-offset: 46px;
    }
}

@media (max-width: 1050px) {

    .kp-block-header {
        backdrop-filter: saturate(1.4) blur(14px);
        -webkit-backdrop-filter: saturate(1.4) blur(14px);
        background: rgba(244, 240, 232, 0.88);
        border-bottom: 1px solid rgba(13, 16, 18, 0.1);
    }

    .kp-block-header__inner {
        align-items: center;
        padding-right: 14px;
    }

    .kp-block-header__logo img,
    .kp-block-header .custom-logo {
        max-width: 116px;
        width: 116px;
    }

    /* --- 2. Prawa strona: telefon, a przy krawędzi hamburger -------------- */

    .kp-block-header__actions {
        align-items: center;
        gap: 6px;
    }

    /* hamburger skrajnie po prawej — telefon idzie przed nim */
    .kp-block-header__phone {
        display: block !important;
        order: -1;
    }

    /* Selektor trzyklasowy, żeby wygrać z body.kp-visual { border-radius: 0 } */
    .kp-block-header .kp-block-header__phone .wp-block-button__link {
        align-items: center;
        background: transparent !important;
        border: 1px solid rgba(13, 16, 18, 0.22) !important;
        color: var(--kp-block-ink) !important;
        display: flex;
        font-size: 0 !important;
        gap: 0;
        height: 44px;
        justify-content: center;
        min-height: 0;
        padding: 0;
        position: relative;
        transition: background-color 0.18s ease;
        width: 44px;
    }

    /* <small>Zadzwoń</small> ma własny font-size: 9px — zerujemy osobno.
       Tekst zostaje w DOM, więc czytniki ekranu odczytają pełną nazwę linku. */
    .kp-block-header .kp-block-header__phone .wp-block-button__link small {
        font-size: 0 !important;
        line-height: 0 !important;
    }

    .kp-block-header .kp-block-header__phone .wp-block-button__link::after {
        background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6A19.79 19.79 0 0 1 2.12 4.18 2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
        content: "";
        inset: 0;
        position: absolute;
    }

    .kp-block-header .kp-block-header__phone .wp-block-button__link:active {
        background: rgba(13, 16, 18, 0.07) !important;
    }

    /* hamburger i krzyżyk */
    .wp-block-navigation__responsive-container-open,
    .wp-block-navigation__responsive-container-close {
        background: transparent !important;
        border: 0;
        color: var(--kp-block-ink) !important;
        height: 44px;
        margin: 0;
        padding: 0;
        position: relative;
        width: 44px;
    }

    .wp-block-navigation__responsive-container-open svg,
    .wp-block-navigation__responsive-container-close svg {
        display: none !important;
    }

    .wp-block-navigation__responsive-container-open::before,
    .wp-block-navigation__responsive-container-open::after {
        background: currentColor;
        content: "";
        height: 1.6px;
        left: 50%;
        position: absolute;
        transform: translateX(-50%);
        width: 22px;
    }

    .wp-block-navigation__responsive-container-open::before { top: 17px; }
    .wp-block-navigation__responsive-container-open::after  { bottom: 17px; }

    .wp-block-navigation__responsive-container-close::before,
    .wp-block-navigation__responsive-container-close::after {
        background: currentColor;
        content: "";
        height: 1.6px;
        left: 50%;
        position: absolute;
        top: 50%;
        width: 22px;
    }

    .wp-block-navigation__responsive-container-close::before {
        transform: translate(-50%, -50%) rotate(45deg);
    }

    .wp-block-navigation__responsive-container-close::after {
        transform: translate(-50%, -50%) rotate(-45deg);
    }

    /* --- 3. Menu po rozwinięciu ------------------------------------------- */

    .wp-block-navigation__responsive-container.is-menu-open {
        background: var(--kp-block-paper) !important;
        padding: 0 !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content {
        align-items: stretch !important;
        display: flex !important;
        flex-direction: column !important;
        min-height: 100dvh !important;
        padding: calc(var(--kp-admin-offset, 0px) + var(--kp-block-header-height) + 22px)
                 22px calc(26px + env(safe-area-inset-bottom)) !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-close {
        left: auto !important;
        position: absolute !important;
        right: 12px !important;
        top: calc(var(--kp-admin-offset, 0px) + (var(--kp-block-header-height) - 44px) / 2) !important;
        z-index: 100002;
    }

    /* Przy otwartym menu zostaje logo (celowo nad overlayem) i krzyżyk.
       Uwaga: WordPress dopina klasę has-modal-open do <html>, nie do <body> —
       dlatego selektor obejmuje oba warianty. */
    html.has-modal-open .wp-block-navigation__responsive-container-open,
    html.has-modal-open .kp-block-header__phone,
    body.has-modal-open .wp-block-navigation__responsive-container-open,
    body.has-modal-open .kp-block-header__phone {
        visibility: hidden !important;
    }

    .wp-block-navigation__responsive-container .kp-block-nav {
        flex: 1 1 auto;
    }

    /* bez separatorów i pionowej kreski — rytm robi typografia i światło */
    .wp-block-navigation__responsive-container .kp-block-nav > .wp-block-navigation-item {
        border: 0 !important;
    }

    .wp-block-navigation__responsive-container
        .kp-block-nav > .wp-block-navigation-item > .wp-block-navigation-item__content {
        font-size: 28px;
        font-weight: 600;
        letter-spacing: -0.5px;
        line-height: 1.18;
        min-height: 0 !important;
        padding: 8px 0 !important;
        width: 100%;
    }

    /* „Atrakcje" to etykieta grupy, nie klikalna pozycja */
    .wp-block-navigation__responsive-container
        .kp-block-nav > .has-child > .wp-block-navigation-item__content {
        color: #7d8489;
        font-size: 10px !important;
        font-weight: 750;
        letter-spacing: 0.2em;
        line-height: 1;
        min-height: 0 !important;
        padding: 0 0 14px !important;
        pointer-events: none;
        text-transform: uppercase;
    }

    .wp-block-navigation__responsive-container
        .kp-block-nav > .has-child > .wp-block-navigation-item__content
        .wp-block-navigation__submenu-icon {
        display: none !important;
    }

    .wp-block-navigation__responsive-container
        .kp-block-nav .wp-block-navigation__submenu-container {
        background: transparent !important;
        border: 0 !important;
        margin: 0 0 22px !important;
        padding: 0 !important;
        position: static !important;
    }

    .wp-block-navigation__responsive-container
        .kp-block-nav .wp-block-navigation__submenu-container .wp-block-navigation-item {
        border: 0 !important;
    }

    .wp-block-navigation__responsive-container
        .kp-block-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        color: #2b3134;
        font-size: 20px;
        font-weight: 500;
        letter-spacing: -0.2px;
        min-height: 0 !important;
        padding: 11px 0 !important;
        width: 100%;
    }

    /* --- 4. CTA telefoniczne przyklejone do dołu menu --------------------- */

    .wp-block-navigation__responsive-container .kp-block-nav > .wp-block-navigation-item.kp-nav-cta {
        margin-top: 22px;
    }

    /* Selektor 5-klasowy: regula zerujaca min-height dla pozycji menu ma
       specyficznosc (0,0,4,0), wiec CTA musi ja przebic. */
    .wp-block-navigation__responsive-container .kp-block-nav
        > .wp-block-navigation-item.kp-nav-cta > .wp-block-navigation-item__content {
        align-items: center;
        background: var(--kp-block-ink);
        color: var(--kp-block-paper) !important;
        display: flex;
        font-size: 16px !important;
        font-weight: 650 !important;
        justify-content: center;
        letter-spacing: 0.06em !important;
        /* !important, bo regula dla pozycji menu zeruje min-height */
        min-height: 66px !important;
        padding: 0 20px !important;
        text-transform: uppercase;
        width: 100%;
    }

    /* w zwiniętym nagłówku CTA jest zbędne — tam stoi przycisk telefonu */
    .kp-block-header__actions .kp-nav-cta {
        display: none;
    }

    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-cta {
        display: block;
    }

    /* --- 5. Delikatne wejście pozycji ------------------------------------- */

    @media (prefers-reduced-motion: no-preference) {
        .wp-block-navigation__responsive-container.is-menu-open
            .kp-block-nav > .wp-block-navigation-item {
            animation: kp-nav-in 0.32s cubic-bezier(0.22, 0.8, 0.3, 1) both;
        }

        .wp-block-navigation__responsive-container.is-menu-open
            .kp-block-nav > .wp-block-navigation-item:nth-child(1) { animation-delay: 0.02s; }
        .wp-block-navigation__responsive-container.is-menu-open
            .kp-block-nav > .wp-block-navigation-item:nth-child(2) { animation-delay: 0.06s; }
        .wp-block-navigation__responsive-container.is-menu-open
            .kp-block-nav > .wp-block-navigation-item:nth-child(3) { animation-delay: 0.09s; }
        .wp-block-navigation__responsive-container.is-menu-open
            .kp-block-nav > .wp-block-navigation-item:nth-child(4) { animation-delay: 0.12s; }
        .wp-block-navigation__responsive-container.is-menu-open
            .kp-block-nav > .wp-block-navigation-item:nth-child(5) { animation-delay: 0.15s; }
        .wp-block-navigation__responsive-container.is-menu-open
            .kp-block-nav > .wp-block-navigation-item:nth-child(6) { animation-delay: 0.18s; }
    }

    @keyframes kp-nav-in {
        from { opacity: 0; transform: translateY(9px); }
        to   { opacity: 1; transform: none; }
    }

    .kp-block-header__logo {
        z-index: 100001;
    }
}

/* CTA telefoniczne dotyczy wyłącznie menu mobilnego */
@media (min-width: 1051px) {
    .kp-nav-cta {
        display: none !important;
    }
}


/* ============================================================================
   KP — DOMKNIĘCIE UKŁADU PO USUNIĘCIU BELKI I ZMIANIE WYSOKOŚCI NAGŁÓWKA
   ----------------------------------------------------------------------------
   1) body.kp-visual miało padding-bottom: 66px zarezerwowane pod przyklejoną
      belkę rezerwacji. Po jej usunięciu zostawał jasny pas pod stopką, który
      wyglądał jakby strona się nie kończyła.
   2) .kp-hero i .kp-xp-hero mają na mobile zaszyte na sztywno padding-top: 74px
      (pod stary nagłówek 75px). Nagłówek ma teraz 68px, więc między nim
      a zdjęciem hero powstawała szczelina 6px. Wiążemy offset ze zmienną,
      żeby nie rozjechał się przy kolejnej zmianie wysokości nagłówka.
   ============================================================================ */

@media (max-width: 767px) {
    body.kp-visual {
        padding-bottom: 0;
    }

    .kp-hero,
    .kp-xp-hero,
    .kp-xp-hero--reverse {
        padding-top: calc(var(--kp-admin-offset, 0px) + var(--kp-block-header-height));
    }
}


/* ============================================================================
   KP — ERGONOMIA MENU MOBILNEGO (obsługa jedną ręką)
   ----------------------------------------------------------------------------
   Pomiar przed zmianą (ekran 812px): 6 z 11 pozycji leżało powyżej granicy
   zasięgu kciuka, wszystkie „Atrakcje" w górnych 42% ekranu (Bilard na y=151),
   a 143px najłatwiejszego obszaru przy dole stało puste.

   Rozwiązanie: lista dosunięta do dołu przez margin-top:auto na PIERWSZEJ
   pozycji. Celowo nie justify-content:flex-end — tamto przy dłuższej liście
   ucina górę poza obszar przewijania, a margines automatyczny degraduje się
   poprawnie: na niskich ekranach po prostu znika i lista scrolluje normalnie.
   ============================================================================ */

@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .wp-block-navigation-item:first-child {
        margin-top: auto;
    }

    /* orientacja: która podstrona jest otwarta */
    .wp-block-navigation__responsive-container .kp-block-nav .kp-nav-current > .wp-block-navigation-item__content {
        text-decoration: underline;
        text-decoration-thickness: 2px;
        text-underline-offset: 6px;
    }
}

/* --- Informacje o lokalu w górnej, nieklikalnej części menu ---------------- */

.kp-nav-meta {
    display: none;
}

@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-meta {
        display: block;
        margin: 0 0 8px;
    }

    .kp-nav-meta p {
        margin: 0;
    }

    .kp-nav-meta__status {
        color: #7d8489;
        font-size: 10px;
        font-weight: 750;
        letter-spacing: 0.2em;
        text-transform: uppercase;
    }

    /* kropka sygnalizuje, że lokal jest otwarty w tej chwili */
    .kp-nav-meta__status.is-open {
        color: var(--kp-block-ink);
    }

    .kp-nav-meta__status.is-open::before {
        background: var(--kp-block-ink);
        content: "";
        display: inline-block;
        height: 6px;
        margin-right: 8px;
        vertical-align: 1px;
        width: 6px;
    }

    .kp-nav-meta__hours {
        font-size: 23px;
        font-weight: 600;
        letter-spacing: -0.4px;
        margin-top: 8px !important;
    }

    .kp-nav-meta__addr {
        color: #6f767b;
        font-size: 14px;
        margin-top: 4px !important;
    }
}

/* ============================================================================
   KP — MENU MOBILNE: SKANOWANIE ZAMIAST CZYTANIA
   ----------------------------------------------------------------------------
   Problem: menu było ścianą lewo-wyrównanego tekstu bez kotwic wizualnych —
   każdą pozycję trzeba było przeczytać, zamiast rozpoznać. Do tego cała lista
   leżała przy lewej krawędzi, czyli po przeciwnej stronie niż kciuk.

   Rozwiązanie: wyrównanie do prawej + kolumna ikon flush right. Ikona jest
   ostatnim elementem wiersza, więc ikony układają się w równą pionową kolumnę
   dokładnie tam, gdzie ląduje kciuk. Cały wiersz pozostaje klikalny (100%).
   Wybrano prawą, nie środek: przy centrowaniu lewa krawędź jest poszarpana
   i oko traci punkt zaczepienia przy skanowaniu listy.
   ============================================================================ */

@media (max-width: 1050px) {
    /* blok informacyjny na tej samej osi co lista */
    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-meta {
        text-align: right;
    }

    .wp-block-navigation__responsive-container .kp-block-nav .wp-block-navigation-item__content {
        align-items: center;
        display: flex;
        gap: 14px;
        justify-content: flex-end;
        text-align: right;
    }

    .wp-block-navigation__responsive-container .kp-block-nav .wp-block-navigation-item__content::after {
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        content: "";
        flex: 0 0 auto;
        height: 22px;
        width: 22px;
    }

    /* podpozycje: ikona nieco mniejsza, zgodnie ze skalą tekstu */
    .wp-block-navigation__responsive-container .kp-block-nav
        .wp-block-navigation__submenu-container .wp-block-navigation-item__content::after {
        height: 19px;
        width: 19px;
    }

    /* etykieta grupy nie jest pozycją — bez ikony i wyrównana do prawej */
    .wp-block-navigation__responsive-container
        .kp-block-nav > .has-child > .wp-block-navigation-item__content {
        justify-content: flex-end;
    }

    .wp-block-navigation__responsive-container
        .kp-block-nav > .has-child > .wp-block-navigation-item__content::after {
        display: none;
    }

    /* CTA zostaje wycentrowane — to przycisk, nie pozycja listy */
    .wp-block-navigation__responsive-container .kp-block-nav
        > .wp-block-navigation-item.kp-nav-cta > .wp-block-navigation-item__content {
        gap: 12px;
        justify-content: center;
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/bilard-na-bialolece/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/cocktailbar-bialoleka/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16l-8 8.5z'/%3E%3Cpath d='M12 13.5V19'/%3E%3Cpath d='M8.5 19h7'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/transmisje-sportowe/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='13' rx='1.8'/%3E%3Cpath d='M9 20.5h6'/%3E%3Cpath d='M10.6 8.2l4.4 2.3-4.4 2.3z'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/gry-planszowe/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.2' y='3.2' width='17.6' height='17.6' rx='3'/%3E%3Ccircle cx='8.6' cy='8.6' r='1.15'/%3E%3Ccircle cx='12' cy='12' r='1.15'/%3E%3Ccircle cx='15.4' cy='15.4' r='1.15'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/xbox/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.2' y='7.2' width='19.6' height='9.6' rx='4.8'/%3E%3Cpath d='M6.4 12h3.4M8.1 10.3v3.4'/%3E%3Ccircle cx='15.6' cy='11' r='.95'/%3E%3Ccircle cx='17.9' cy='13.4' r='.95'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/zorganizuj-impreze/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.8v2.6M12 18.6v2.6M2.8 12h2.6M18.6 12h2.6M5.5 5.5l1.9 1.9M16.6 16.6l1.9 1.9M18.5 5.5l-1.9 1.9M7.4 16.6l-1.9 1.9'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/artykuly/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4.2' y='3' width='15.6' height='18' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/cennik/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 13.3l-7.2 7.2a1.9 1.9 0 01-2.7 0l-7.1-7.1A1.9 1.9 0 013 12V4.4c0-.8.6-1.4 1.4-1.4H12c.5 0 1 .2 1.3.6l7.2 7.2c.8.7.8 1.9 0 2.5z'/%3E%3Ccircle cx='7.6' cy='7.6' r='1.25'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/kontakt/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s6.8-5.1 6.8-10.6a6.8 6.8 0 10-13.6 0C5.2 15.9 12 21 12 21z'/%3E%3Ccircle cx='12' cy='10.2' r='2.5'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container .kp-nav-cta .wp-block-navigation-item__content::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f4f0e8' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.5 16.8v2.7a1.8 1.8 0 01-2 1.8 17.8 17.8 0 01-7.8-2.8 17.5 17.5 0 01-5.4-5.4A17.8 17.8 0 013.5 5.3a1.8 1.8 0 011.8-2h2.7a1.8 1.8 0 011.8 1.6c.1.9.3 1.7.6 2.5a1.8 1.8 0 01-.4 1.9L8.9 10.4a15 15 0 005.4 5.4l1.1-1.1a1.8 1.8 0 011.9-.4c.8.3 1.6.5 2.5.6a1.8 1.8 0 011.7 1.9z'/%3E%3C/svg%3E");
    }

}

/* Podpozycje miały w oryginalnym arkuszu justify-content/text-align wymuszone
   przez !important przy specyficzności (0,0,4,0). Nadpisujemy tą samą
   specyficznością — decyduje kolejność, bo blocks.css ładuje się ostatni. */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container .kp-block-nav
        .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        justify-content: flex-end !important;
        text-align: right !important;
    }
}

/* Kompozycja: automatyczny margines przenosimy z pierwszej pozycji listy na
   blok informacyjny, żeby godziny i nawigacja tworzyły jeden zwarty blok przy
   dole, a puste światło zostało tylko u góry, pod logotypem. Wcześniej pustka
   lądowała POMIĘDZY nimi i wyglądała na przypadkową. */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-meta {
        margin-top: auto;
        margin-bottom: 26px;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .wp-block-navigation-item:first-child {
        margin-top: 0;
    }

    .wp-block-navigation__responsive-container .kp-block-nav {
        flex: 0 0 auto;
    }
}

/* ============================================================================
   KP — WYRÓWNANIE DO ŚRODKA (dostępność dla obu rąk)
   ----------------------------------------------------------------------------
   Wyrównanie do prawej optymalizowało wyłącznie kciuk prawej ręki i stawiało
   osoby leworęczne (oraz każdego, kto akurat trzyma telefon drugą ręką) przy
   najdalszej możliwej krawędzi. Środek jest jedynym wyrównaniem, które nie
   faworyzuje żadnej strony.

   Żeby centrowanie nie zniszczyło skanowania, nie centrujemy pojedynczych
   wierszy (to dałoby poszarpaną krawędź i rozbiło kolumnę ikon). Centrujemy
   BLOK o stałej szerokości, a w środku trzymamy siatkę [ikona | etykieta]:
   ikony układają się w równą kolumnę, etykiety mają czystą lewą krawędź,
   a całość leży na osi ekranu — w równym zasięgu obu kciuków.
   ============================================================================ */

@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-meta {
        text-align: center;
    }

    .wp-block-navigation__responsive-container .kp-block-nav
        > .wp-block-navigation-item:not(.kp-nav-cta) > .wp-block-navigation-item__content,
    .wp-block-navigation__responsive-container .kp-block-nav
        .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        align-items: center !important;
        display: grid !important;
        gap: 14px;
        grid-template-columns: 22px 1fr;
        justify-content: normal !important;
        justify-items: start;
        margin-inline: auto;
        text-align: left !important;
        width: min(272px, 100%);
    }

    /* ikona trafia do pierwszej komórki siatki */
    .wp-block-navigation__responsive-container .kp-block-nav
        .wp-block-navigation-item__content::after {
        order: -1;
    }

    /* etykieta grupy: bez ikony, ale kolumna zostaje, więc tekst trzyma tę samą oś */
    .wp-block-navigation__responsive-container
        .kp-block-nav > .has-child > .wp-block-navigation-item__content {
        justify-content: normal !important;
        text-align: left !important;
    }
}

/* Podpozycje miały width: 100% !important — bez !important nasza szerokość
   bloku nie wchodziła i wiersze rozjeżdżały się na pełną szerokość ekranu. */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container .kp-block-nav
        .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
        margin-inline: auto !important;
        width: min(272px, 100%) !important;
    }
}

/* --- Ikony dla pozycji dodanych przy przebudowie menu (2026-08-12) --------- */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/turniej-bilardowy-warszawa/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 4h10v5a5 5 0 0 1-10 0z'/%3E%3Cpath d='M7 5.5H4.6a2.6 2.6 0 0 0 2.6 3.4M17 5.5h2.4a2.6 2.6 0 0 1-2.6 3.4'/%3E%3Cpath d='M12 14v3.2M9 20.5h6l-.6-3.3H9.6z'/%3E%3C/svg%3E");
    }
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/bar-bialoleka/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h6.4l1 5.6a3.7 3.7 0 0 1-3.6 4.4h-1.2A3.7 3.7 0 0 1 7 8.6z'/%3E%3Cpath d='M15 5h2.2a2.2 2.2 0 0 1 0 4.4h-1.4'/%3E%3Cpath d='M11 13v6.5M8.4 19.5h5.2'/%3E%3C/svg%3E");
    }
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/darty-warszawa/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='13' r='8'/%3E%3Ccircle cx='11' cy='13' r='4'/%3E%3Ccircle cx='11' cy='13' r='.9'/%3E%3Cpath d='M13.6 10.4 21 3M18.4 3H21v2.6'/%3E%3C/svg%3E");
    }
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/imprezy-firmowe-warszawa/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.6' y='7' width='18.8' height='13' rx='2'/%3E%3Cpath d='M8.6 7V5.4a1.8 1.8 0 0 1 1.8-1.8h3.2a1.8 1.8 0 0 1 1.8 1.8V7'/%3E%3Cpath d='M2.6 12.4h18.8'/%3E%3C/svg%3E");
    }
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/urodziny-dla-doroslych-warszawa/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20.6h16v-6a2 2 0 0 0-2-2H6a2 2 0 0 0-2 2z'/%3E%3Cpath d='M4 16.4c1.6 1.3 2.9 1.3 4 0s2.4-1.3 4 0 2.9 1.3 4 0 2.4-1.3 4 0'/%3E%3Cpath d='M8.5 12.6V9.4M12 12.6V8.6M15.5 12.6V9.4'/%3E%3Ccircle cx='8.5' cy='7.6' r='.9'/%3E%3Ccircle cx='12' cy='6.8' r='.9'/%3E%3Ccircle cx='15.5' cy='7.6' r='.9'/%3E%3C/svg%3E");
    }
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/wieczor-kawalerski-warszawa/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 8.2 8.2 5.4 12 3l3.8 2.4z'/%3E%3Cpath d='M12 8.2v3'/%3E%3Ccircle cx='8.6' cy='16.4' r='4.2'/%3E%3Ccircle cx='15.4' cy='16.4' r='4.2'/%3E%3C/svg%3E");
    }
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/wieczor-panienski-warszawa/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20.4S4.4 15.6 4.4 10.2a4.2 4.2 0 0 1 7.6-2.4 4.2 4.2 0 0 1 7.6 2.4c0 5.4-7.6 10.2-7.6 10.2z'/%3E%3C/svg%3E");
    }
    .wp-block-navigation__responsive-container .kp-block-nav a[href$="/galeria-zdjec/"]::after {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.6' y='5.6' width='18.8' height='14.4' rx='2'/%3E%3Cpath d='M8.4 5.6 9.8 3h4.4l1.4 2.6'/%3E%3Ccircle cx='12' cy='13' r='3.6'/%3E%3C/svg%3E");
    }
}

/* --- CTA przyklejone do dołu przy przewijanym menu (2026-08-12) ------------
   Po rozbudowie menu do 20 pozycji lista przewija się na wszystkich telefonach,
   przez co przycisk telefoniczny wypadał poniżej krawędzi ekranu. Sticky trzyma
   go zawsze w zasięgu, niezależnie od pozycji przewinięcia. Tło jest potrzebne,
   żeby pozycje menu nie prześwitywały pod spodem. */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .wp-block-navigation-item.kp-nav-cta {
        background: var(--kp-block-paper);
        bottom: 0;
        margin-top: 26px;
        padding-bottom: 4px;
        padding-top: 10px;
        position: sticky;
        z-index: 3;
    }
}

/* --- Korekta: CTA na stałe przy dolnej krawędzi overlayu ------------------
   position: sticky nie zadziałało, bo element przyklejony przesuwa się tylko
   w obrębie swojego rodzica — a CTA jest ostatnim dzieckiem listy, więc nie ma
   zakresu do przyklejenia. Zamiast tego pozycjonujemy je stale względem okna
   i rezerwujemy miejsce paddingiem, żeby nie zasłaniało ostatnich pozycji. */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .wp-block-navigation-item.kp-nav-cta {
        background: transparent;
        bottom: calc(18px + env(safe-area-inset-bottom));
        left: 22px;
        margin: 0;
        padding: 0;
        position: fixed;
        right: 22px;
        z-index: 5;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content {
        padding-bottom: calc(104px + env(safe-area-inset-bottom)) !important;
    }
}

/* --- Dlaczego CTA nie trzymało się dołu ekranu ----------------------------
   Overlay menu jest zagnieżdżony w .kp-block-header, a ten ma backdrop-filter.
   Filtr tworzy nowy blok zawierający, przez co position:fixed odnosi się do
   nagłówka zamiast do okna i element przesuwa się przy przewijaniu.
   Przy otwartym menu rozmycie i tak jest niewidoczne (overlay zasłania stronę),
   więc wyłączamy je na czas otwarcia — to przywraca poprawne zachowanie fixed. */
@media (max-width: 1050px) {
    html.has-modal-open .kp-block-header,
    body.has-modal-open .kp-block-header {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

/* --- Sedno problemu z CTA -------------------------------------------------
   WordPress animuje otwarcie overlayu transformem na .is-menu-open. Każdy
   transform tworzy nowy blok zawierający, więc position:fixed wewnątrz odnosiło
   się do overlayu, a nie do okna — i CTA jeździło przy przewijaniu.
   Zerujemy transform (ruch zapewnia nasza własna animacja pozycji menu). */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open {
        animation: none !important;
        transform: none !important;
    }
}

/* --- Pas u góry overlayu --------------------------------------------------
   Logo i krzyżyk są nieruchome nad overlayem, więc przy przewijaniu pozycje
   menu przesuwały się widocznie pod logotypem. Nieprzezroczysty pas o wysokości
   nagłówka sprawia, że treść znika czysto, zamiast nachodzić na logo. */
@media (max-width: 1050px) {
    .wp-block-navigation__responsive-container.is-menu-open::before {
        background: var(--kp-block-paper);
        content: "";
        height: calc(var(--kp-admin-offset, 0px) + var(--kp-block-header-height));
        left: 0;
        position: fixed;
        right: 0;
        top: 0;
        z-index: 100000;
    }
}

/* ============================================================================
   KP — MODUŁ GODZIN PRZED STOPKĄ                              (2026-08-12)
   ----------------------------------------------------------------------------
   Informacja "dziś czynne" przeniesiona z overlayu menu na dół każdej podstrony,
   razem z możliwością wykonania połączenia. Utrzymana w języku wizualnym
   serwisu: bez zaokrągleń, hairline zamiast ramek, tusz na papierze.
   ============================================================================ */

.kp-hours-bar {
    background: var(--kp-block-paper, #f4f0e8);
    border-top: 1px solid rgba(13, 16, 18, 0.14);
    padding: 34px 0 38px;
}

.kp-hours-bar__inner {
    align-items: center;
    display: flex;
    gap: 28px;
    justify-content: space-between;
    margin: 0 auto;
    max-width: var(--kp-block-shell, min(92vw, 1480px));
    width: var(--kp-block-shell, min(92vw, 1480px));
}

.kp-hours-bar__info p {
    margin: 0;
}

.kp-hours-bar__status {
    color: #6f767b;
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.2em;
    text-transform: uppercase;
}

/* kropka pojawia się tylko wtedy, gdy lokal jest otwarty w tej chwili */
.kp-hours-bar__status.is-open {
    color: var(--kp-block-ink, #0d1012);
}

.kp-hours-bar__status.is-open::before {
    background: var(--kp-block-ink, #0d1012);
    content: "";
    display: inline-block;
    height: 6px;
    margin-right: 8px;
    vertical-align: 1px;
    width: 6px;
}

.kp-hours-bar__hours {
    font-size: clamp(26px, 3.4vw, 34px);
    font-weight: 600;
    letter-spacing: -0.6px;
    line-height: 1.1;
    margin-top: 8px !important;
}

.kp-hours-bar__addr {
    color: #6f767b;
    font-size: 15px;
    margin-top: 6px !important;
}

.kp-hours-bar__cta {
    align-items: center;
    background: var(--kp-block-ink, #0d1012);
    color: var(--kp-block-paper, #f4f0e8) !important;
    display: inline-flex;
    flex: 0 0 auto;
    gap: 14px;
    min-height: 62px;
    padding: 0 30px;
    text-decoration: none !important;
    transition: background-color 0.18s ease;
}

.kp-hours-bar__cta:hover,
.kp-hours-bar__cta:focus-visible {
    background: #252a2e;
}

.kp-hours-bar__cta-label {
    font-size: 10px;
    font-weight: 750;
    letter-spacing: 0.18em;
    opacity: 0.66;
    text-transform: uppercase;
}

.kp-hours-bar__cta-num {
    font-size: 19px;
    font-weight: 650;
    letter-spacing: -0.2px;
}

@media (max-width: 767px) {
    .kp-hours-bar {
        padding: 28px 0 30px;
    }

    .kp-hours-bar__inner {
        align-items: stretch;
        flex-direction: column;
        gap: 20px;
    }

    .kp-hours-bar__cta {
        justify-content: center;
        min-height: 58px;
        width: 100%;
    }
}

/* --- Blok informacyjny znika z overlayu menu — jest teraz na dole strony --- */
.kp-nav-meta {
    display: none !important;
}

/* --- Zwijane podmenu w menu mobilnym -------------------------------------- */
@media (max-width: 1050px) {
    /* podmenu widoczne wyłącznie po rozwinięciu przyciskiem */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav .wp-block-navigation-submenu > button[aria-expanded="false"]
        + .wp-block-navigation__submenu-container {
        display: none !important;
    }

    /* etykieta grupy staje się klikalnym przyciskiem — musi na to wyglądać */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation-submenu__toggle {
        align-items: center;
        background: transparent;
        border: 0;
        color: #7d8489;
        cursor: pointer;
        display: grid !important;
        font-size: 10px !important;
        font-weight: 750;
        gap: 14px;
        grid-template-columns: 22px 1fr auto;
        letter-spacing: 0.2em;
        margin-inline: auto;
        min-height: 0 !important;
        padding: 18px 0 12px !important;
        pointer-events: auto !important;
        text-align: left !important;
        text-transform: uppercase;
        width: min(272px, 100%);
    }

    /* strzałka rozwijania po prawej stronie bloku */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation-submenu__toggle
        .wp-block-navigation__submenu-icon {
        display: block !important;
        grid-column: 3;
        transition: transform 0.2s ease;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > button[aria-expanded="true"]
        .wp-block-navigation__submenu-icon {
        transform: rotate(180deg);
    }
}

/* ============================================================================
   KP — NAPRAWA MENU (2026-08-12, v8)
   ----------------------------------------------------------------------------
   Przyczyny ustalone pomiarowo w przeglądarce, nie „na oko".

   1) „Prostokąt pod napisami przy najechaniu". Etykiety grup to <button>, więc
      łapały styl przycisku z motywu Kadence:
      box-shadow: rgba(0,0,0,.1) 0 15px 25px -7px.
      Cień przesunięty o 15px w dół wygląda dokładnie jak prostokąt pod tekstem.
      W spoczynku ten sam cień jest przezroczysty (0 0 0 -7px), dlatego nie było
      go widać w kodzie na pierwszy rzut oka.

   2) Podmenu nie zwijało się na telefonie. WordPress wstawia
      <span class="wp-block-navigation__submenu-icon"> POMIĘDZY przycisk a <ul>:
         button → span.submenu-icon → ul.submenu-container
      Selektor używał „+" (rodzeństwo bezpośrednie), więc nie trafiał nigdy —
      querySelectorAll zwracał 0 elementów. Musi być „~".

   3) Strzałka rozwijania była niewidoczna na telefonie: z tego samego powodu
      celowałem w nią jak w potomka przycisku, a jest jego rodzeństwem.

   4) Przycisk „Zadzwoń" wychodził poza prawą krawędź. Element jest
      position:fixed z left:22px i right:22px, ale motyw narzucał width:100%.
      Jawna szerokość unieważnia wyliczenie z left/right — 375px zamiast 331px.

   5) Na desktopie podmenu przestało otwierać się najechaniem — skutek uboczny
      przełączenia bloku na „otwieraj kliknięciem" (konieczne dla zwijania na
      telefonie). Przywracamy hover. Bez :focus-within, bo po kliknięciu
      zostawiałby drugi panel otwarty.

   6) Strzałki na desktopie stały za wysoko: SVG 10×10 leżał przy górnej
      krawędzi pola 24×24, więc środek wypadał 7px nad linią tekstu.

   7) Grupy (Atrakcje, Imprezy) wyglądają teraz jak pozostałe pozycje główne:
      ikona 22px, tekst 28px/600, strzałka przy prawej krawędzi bloku.
      Wcześniej „IMPREZY" czytało się jak nagłówek nad Cennikiem i Galerią.

   8) Moduł godzin zastąpił przycisk telefoniczny na dole menu mobilnego.
   ========================================================================= */

/* --- 1. Przyciski nagłówka nie są przyciskami motywu ---------------------- */

.kp-block-header .wp-block-navigation-submenu__toggle,
.kp-block-header .wp-block-navigation-submenu__toggle:hover,
.kp-block-header .wp-block-navigation-submenu__toggle:focus,
.kp-block-header .wp-block-navigation-submenu__toggle:active,
.kp-block-header .wp-block-navigation__responsive-container-open,
.kp-block-header .wp-block-navigation__responsive-container-open:hover,
.kp-block-header .wp-block-navigation__responsive-container-open:focus,
.kp-block-header .wp-block-navigation__responsive-container-close,
.kp-block-header .wp-block-navigation__responsive-container-close:hover,
.kp-block-header .wp-block-navigation__responsive-container-close:focus {
    -webkit-tap-highlight-color: transparent;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transform: none !important;
}

.kp-block-header .wp-block-navigation-submenu__toggle:focus-visible,
.kp-block-header .wp-block-navigation__responsive-container-open:focus-visible,
.kp-block-header .wp-block-navigation__responsive-container-close:focus-visible {
    outline: 2px solid var(--kp-block-ink);
    outline-offset: 4px;
}

/* --- 6. Strzałka wyśrodkowana w swoim polu -------------------------------- */

.kp-block-nav .wp-block-navigation__submenu-icon {
    align-items: center;
    display: flex;
    justify-content: center;
    line-height: 0;
}

/* --- 5. Desktop: podmenu znów otwiera się najechaniem --------------------- */

@media (min-width: 1051px) {
    .kp-block-nav > .has-child:hover > .wp-block-navigation__submenu-container {
        height: auto;
        opacity: 1;
        overflow: visible;
        visibility: visible;
        width: auto;
    }

    .kp-block-nav > .has-child > .wp-block-navigation__submenu-container {
        transition: opacity 0.16s ease;
    }
}

/* --- Moduł godzin: poza otwartym menu mobilnym nie istnieje --------------- */

.kp-nav-hours {
    display: none;
}

/* --- Telefon -------------------------------------------------------------- */

@media (max-width: 1050px) {

    /* 2. Podmenu widoczne wyłącznie po rozwinięciu przyciskiem.
       Sterujemy własnym atrybutem data-kp-open na <li>, a nie aria-expanded:
       ten drugi jest w WordPressie związany ze stanem bloku
       (data-wp-bind--aria-expanded) i bywa nadpisywany przy przerysowaniu. */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child:not([data-kp-open])
        > .wp-block-navigation__submenu-container {
        display: none !important;
    }

    /* 3. samodzielny span ze strzałką stoi poza siatką etykiety */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation__submenu-icon {
        display: none !important;
    }

    /* 7. grupa wygląda jak pozycja główna: ikona | tekst | strzałka --------- */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation-submenu__toggle {
        align-items: center;
        color: var(--kp-block-ink) !important;
        display: grid !important;
        font-size: 28px !important;
        font-weight: 600 !important;
        gap: 14px;
        grid-template-columns: 22px 1fr auto !important;
        letter-spacing: -0.5px !important;
        line-height: 1.18 !important;
        margin-inline: auto;
        min-height: 0 !important;
        padding: 4px 0 !important;
        text-align: left !important;
        text-transform: none !important;
        width: min(272px, 100%);
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation-submenu__toggle
        .wp-block-navigation-item__label {
        grid-area: 1 / 2;
    }

    /* ikona grupy — ::before, bo ::after rysuje strzałkę */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation-submenu__toggle::before {
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
        content: "";
        grid-area: 1 / 1;
        height: 22px;
        width: 22px;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > button[aria-label="Atrakcje"]::before,
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child.kp-group-atrakcje > .wp-block-navigation-submenu__toggle::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.2' y='3.2' width='7.4' height='7.4' rx='1.7'/%3E%3Crect x='13.4' y='3.2' width='7.4' height='7.4' rx='1.7'/%3E%3Crect x='3.2' y='13.4' width='7.4' height='7.4' rx='1.7'/%3E%3Crect x='13.4' y='13.4' width='7.4' height='7.4' rx='1.7'/%3E%3C/svg%3E");
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child.kp-group-imprezy > .wp-block-navigation-submenu__toggle::before {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8.4 3.4h7.2l-1.1 6.3a2.5 2.5 0 0 1-5 0z'/%3E%3Cpath d='M12 12v6.6'/%3E%3Cpath d='M8.9 20.6h6.2'/%3E%3Cpath d='M18.4 4.6 20 3.4'/%3E%3Cpath d='M19.6 8.5l2.1-.4'/%3E%3C/svg%3E");
    }

    /* strzałka rozwijania w trzeciej kolumnie
       (ikony pozycji menu mają order:-1 — bez order:0 strzałka ląduje przed tekstem) */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation-submenu__toggle::after {
        align-self: center;
        background: var(--kp-block-ink) !important;
        content: "" !important;
        display: block !important;
        grid-area: 1 / 3;
        height: 10px;
        justify-self: end;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.6 6 6.4l5-4.8' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.6 6 6.4l5-4.8' fill='none' stroke='%23000' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
        opacity: 0.5;
        order: 0 !important;
        transition: transform 0.22s ease;
        width: 14px;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child[data-kp-open]
        > .wp-block-navigation-submenu__toggle::after {
        transform: rotate(180deg);
    }

    /* pozycje podmenu odsunięte, żeby czytały się jako zawartość grupy */
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav .wp-block-navigation__submenu-container {
        margin-bottom: 8px !important;
    }

    /* Całe menu ma mieścić się bez przewijania także na 375×812 (iPhone SE/13
       mini). Po powiększeniu grup do rozmiaru pozycji głównych brakowało 50px —
       odzyskujemy je z odstępów, nie z pól dotykowych. */
    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content {
        padding-top: 84px !important;
    }

    /* 8. moduł godzin zamiast przycisku telefonicznego ---------------------- */
    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-cta {
        display: none !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-hours {
        background: var(--kp-block-paper);
        border-top: 1px solid rgba(13, 16, 18, 0.14);
        bottom: 0;
        display: block;
        left: 0;
        padding: 12px 22px calc(14px + env(safe-area-inset-bottom));
        position: fixed;
        right: 0;
        z-index: 5;
    }

    .kp-nav-hours__status {
        align-items: center;
        color: #7d8489;
        display: flex;
        font-size: 10px;
        font-weight: 750;
        gap: 7px;
        letter-spacing: 0.2em;
        margin: 0;
        text-transform: uppercase;
    }

    .kp-nav-hours__status.is-open {
        color: #2f7d52;
    }

    .kp-nav-hours__status.is-open::before {
        background: #2f7d52;
        border-radius: 50%;
        content: "";
        height: 7px;
        width: 7px;
    }

    .kp-nav-hours__meta {
        color: var(--kp-block-ink);
        display: flex;
        flex-wrap: wrap;
        font-size: 15px;
        gap: 4px 10px;
        letter-spacing: -0.1px;
        margin: 4px 0 10px;
    }

    .kp-nav-hours__meta b {
        font-weight: 650;
    }

    .kp-nav-hours__meta span {
        color: #5a6064;
    }

    .kp-nav-hours__cta {
        align-items: center;
        background: var(--kp-block-ink);
        color: var(--kp-block-paper) !important;
        display: flex;
        font-size: 16px;
        font-weight: 650;
        gap: 10px;
        justify-content: center;
        letter-spacing: 0.06em;
        min-height: 62px;
        text-decoration: none;
        text-transform: uppercase;
        width: 100%;
    }

    .kp-nav-hours__cta::before {
        background: var(--kp-block-paper);
        content: "";
        height: 19px;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.5 16.9v2.8a1.9 1.9 0 0 1-2.1 1.9 18.8 18.8 0 0 1-8.2-2.9 18.5 18.5 0 0 1-5.7-5.7A18.8 18.8 0 0 1 2.6 4.7 1.9 1.9 0 0 1 4.5 2.6h2.8a1.9 1.9 0 0 1 1.9 1.6c.1.9.3 1.8.7 2.6a1.9 1.9 0 0 1-.4 2L8.3 10a15.2 15.2 0 0 0 5.7 5.7l1.2-1.2a1.9 1.9 0 0 1 2-.4c.8.4 1.7.6 2.6.7a1.9 1.9 0 0 1 1.7 1.9z'/%3E%3C/svg%3E") center / contain no-repeat;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.5 16.9v2.8a1.9 1.9 0 0 1-2.1 1.9 18.8 18.8 0 0 1-8.2-2.9 18.5 18.5 0 0 1-5.7-5.7A18.8 18.8 0 0 1 2.6 4.7 1.9 1.9 0 0 1 4.5 2.6h2.8a1.9 1.9 0 0 1 1.9 1.6c.1.9.3 1.8.7 2.6a1.9 1.9 0 0 1-.4 2L8.3 10a15.2 15.2 0 0 0 5.7 5.7l1.2-1.2a1.9 1.9 0 0 1 2-.4c.8.4 1.7.6 2.6.7a1.9 1.9 0 0 1 1.7 1.9z'/%3E%3C/svg%3E") center / contain no-repeat;
        width: 19px;
    }

    /* miejsce pod modułem, żeby nie zasłaniał ostatnich pozycji przy przewijaniu */
    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content {
        padding-bottom: calc(178px + env(safe-area-inset-bottom)) !important;
    }
}

/* ============================================================================
   KP — MENU MA SIĘ MIEŚCIĆ BEZ PRZEWIJANIA
   ----------------------------------------------------------------------------
   Na oknie 375×812 treść menu miała 830px — "Kontakt" wypadał poniżej krawędzi.
   Na prawdziwym telefonie jest gorzej: pasek adresu przeglądarki zabiera ~90px
   widocznej wysokości, choć okno nadal raportuje pełne 812.

   Odzyskujemy ~80px z odstępów, nie z pól dotykowych — po zmianie wiersz
   pozycji głównej ma 45px, a podmenu 43px wysokości.
   ========================================================================= */

@media (max-width: 1050px) {

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content {
        /* Pozycje wyśrodkowane w pionie między logo a modułem godzin.
           Kontener ma pełną wysokość overlayu, więc wystarczy justify-content —
           wolna przestrzeń rozkłada się po równo nad listą i pod nią. */
        justify-content: center !important;
        padding-top: 72px !important;
        /* rezerwa pod modułem godzin — trzymana blisko jego realnej wysokości */
        padding-bottom: calc(152px + env(safe-area-inset-bottom)) !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .wp-block-navigation-item:not(.kp-nav-cta)
        > .wp-block-navigation-item__content:not(.wp-block-navigation-submenu__toggle) {
        padding: 6px 0 !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav .wp-block-navigation__submenu-container
        .wp-block-navigation-item__content {
        padding: 9px 2px !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav .wp-block-navigation__submenu-container {
        margin-bottom: 6px !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-hours {
        padding: 10px 22px calc(12px + env(safe-area-inset-bottom));
    }

    .kp-nav-hours__meta {
        margin: 3px 0 9px;
    }
}

/* --- Niskie ekrany: kompaktowy wariant ------------------------------------
   Na iPhonie SE (375×667) pełna typografia daje 750px treści — "Kontakt"
   wpadał pod moduł godzin. Zbijamy stopnie pisma i odstępy tylko tam, gdzie
   to konieczne; telefony 812px i wyższe zachowują poprzedni wygląd.
   ========================================================================= */

@media (max-width: 1050px) and (max-height: 780px) {

    .wp-block-navigation__responsive-container.is-menu-open
        .wp-block-navigation__responsive-container-content {
        padding-top: 62px !important;
        padding-bottom: calc(140px + env(safe-area-inset-bottom)) !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .wp-block-navigation-item:not(.kp-nav-cta)
        > .wp-block-navigation-item__content:not(.wp-block-navigation-submenu__toggle),
    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav > .has-child > .wp-block-navigation-submenu__toggle {
        font-size: 24px !important;
        line-height: 1.15 !important;
        padding: 5px 0 !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open
        .kp-block-nav .wp-block-navigation__submenu-container
        .wp-block-navigation-item__content {
        font-size: 18px !important;
        padding: 8px 2px !important;
    }

    .wp-block-navigation__responsive-container.is-menu-open .kp-nav-hours {
        padding: 9px 22px calc(10px + env(safe-area-inset-bottom));
    }

    .kp-nav-hours__cta {
        min-height: 54px;
    }
}

/* --- Wieczór kawalerski: nowa ikona ---------------------------------------
   Poprzednia (dwa splecione pierścienie z diamentem nad nimi) w skali 22px
   czytała się dwuznacznie: pionowa kreska z dwoma kółkami u dołu. Muszka jest
   jednoznaczna, czytelna przy tym rozmiarze i od razu mówi „pan młody".
   ========================================================================= */

.wp-block-navigation__responsive-container
    .kp-block-nav a[href$="/wieczor-kawalerski-warszawa/"]::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230d1012' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.2 12 3.2 8.1v7.8z'/%3E%3Cpath d='M13.8 12l7-3.9v7.8z'/%3E%3Crect x='10.1' y='9.6' width='3.8' height='4.8' rx='1.2'/%3E%3C/svg%3E");
}

/* ========================================================================== */
/* PILOT TREŚCI BILARDOWYCH — HUBY WIEDZY                                    */
/* ========================================================================== */

.kp-guide,
.kp-rules,
.kp-journal--knowledge {
    background: var(--kp-block-paper);
    color: var(--kp-block-ink);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0;
    overflow: clip;
}

.kp-guide-shell {
    margin-inline: auto !important;
    max-width: var(--kp-block-shell) !important;
    width: var(--kp-block-shell);
}

.kp-guide-breadcrumb {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    font-weight: 650;
    gap: 9px;
    letter-spacing: 0.04em;
    margin-inline: auto;
    max-width: var(--kp-block-shell);
    padding: calc(var(--kp-block-header-height) + 28px) 0 22px;
    text-transform: uppercase;
    width: var(--kp-block-shell);
}

.kp-guide-breadcrumb--xp {
    padding-bottom: 12px;
}

.kp-guide-breadcrumb a {
    color: #555c61;
    text-decoration: none;
}

.kp-guide-breadcrumb a:hover,
.kp-guide-breadcrumb a:focus-visible {
    color: var(--kp-block-ink);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.kp-guide-breadcrumb span[aria-hidden="true"] {
    color: #8c8f91;
}

.kp-guide-kicker,
.kp-guide-index,
.kp-journal-card__meta,
.kp-cluster-card__index {
    font-size: 11px;
    font-weight: 760;
    letter-spacing: 0.16em;
    line-height: 1.35;
    margin: 0;
    text-transform: uppercase;
}

.kp-guide-link {
    align-items: center;
    border-bottom: 1px solid currentColor;
    color: var(--kp-block-ink);
    display: inline-flex;
    font-size: 13px;
    font-weight: 720;
    gap: 9px;
    padding-bottom: 5px;
    text-decoration: none;
}

.kp-guide-link::after {
    content: "";
    width: 0.75rem;
    height: 0.75rem;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center / contain no-repeat;
    flex: 0 0 auto;
}

.kp-guide-link:hover,
.kp-guide-link:focus-visible {
    opacity: 0.62;
}

.kp-guide-link--light {
    color: #fff;
}

.kp-guide-hero {
    padding: 10px 0 clamp(76px, 8vw, 132px);
}

.kp-guide-hero__grid {
    align-items: end;
    display: grid;
    gap: clamp(42px, 7vw, 120px);
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
}

.kp-guide-hero__copy {
    padding-bottom: clamp(0px, 2vw, 34px);
}

.kp-guide-hero h1,
.kp-rules-hero h1,
.kp-journal__intro h1 {
    font-size: clamp(50px, 5vw, 88px);
    font-weight: 540;
    letter-spacing: -0.065em;
    line-height: 0.91;
    margin: 24px 0 30px;
    max-width: 13.5ch;
}

.kp-guide-hero__lead,
.kp-rules-hero__lead,
.kp-rules-section__lead {
    font-size: clamp(19px, 1.55vw, 26px);
    letter-spacing: -0.025em;
    line-height: 1.46;
    margin: 0;
    max-width: 760px;
}

.kp-guide-meta {
    border-top: 1px solid var(--kp-block-line);
    display: flex;
    flex-wrap: wrap;
    gap: 10px 26px;
    margin-top: 38px;
    padding-top: 16px;
}

.kp-guide-meta p {
    color: #5c6265;
    font-size: 12px;
    margin: 0;
}

.kp-guide-hero__image {
    align-self: stretch;
    margin: 0;
    min-height: 590px;
    position: relative;
}

.kp-guide-hero__image img {
    height: 100%;
    inset: 0;
    object-fit: cover;
    position: absolute;
    width: 100%;
}

.kp-guide-hero__image figcaption {
    background: rgba(13, 16, 18, 0.9);
    bottom: 0;
    color: #fff;
    font-size: 12px;
    left: 0;
    margin: 0;
    max-width: 310px;
    padding: 15px 18px;
    position: absolute;
}

.kp-guide-quick {
    background: #a9d9ed;
    padding: clamp(70px, 7vw, 112px) 0;
}

.kp-guide-quick h2,
.kp-guide-section h2,
.kp-guide-practice h2,
.kp-guide-next h2,
.kp-cluster-bridge h2,
.kp-cluster-inline h2,
.kp-rules-section h2,
.kp-rules-answer h2 {
    font-size: clamp(40px, 5vw, 78px);
    font-weight: 540;
    letter-spacing: -0.06em;
    line-height: 0.96;
    margin: 17px 0 40px;
}

.kp-guide-steps {
    border-left: 1px solid rgba(13, 16, 18, 0.32);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.kp-guide-step {
    border-bottom: 1px solid rgba(13, 16, 18, 0.32);
    border-right: 1px solid rgba(13, 16, 18, 0.32);
    border-top: 1px solid rgba(13, 16, 18, 0.32);
    min-height: 210px;
    padding: 24px;
}

.kp-guide-step__number,
.kp-rules-article__number {
    color: #4d5559;
    display: block;
    font-size: 11px;
    font-weight: 760;
    letter-spacing: 0.14em;
    margin-bottom: 54px;
}

.kp-guide-step > p:not(.kp-guide-step__number) {
    font-size: clamp(17px, 1.25vw, 21px);
    font-weight: 600;
    line-height: 1.35;
    margin: 0;
}

.kp-guide-note {
    border-left: 3px solid var(--kp-block-ink);
    font-size: 15px;
    line-height: 1.6;
    margin: 34px 0 0;
    max-width: 890px;
    padding: 4px 0 4px 20px;
}

.kp-guide-section,
.kp-rules-section {
    padding: clamp(86px, 9vw, 152px) 0;
}

.kp-guide-section__grid {
    display: grid;
    gap: clamp(54px, 9vw, 154px);
    grid-template-columns: minmax(260px, 0.78fr) minmax(0, 1.22fr);
}

.kp-guide-section__aside {
    align-self: start;
    position: sticky;
    top: calc(var(--kp-block-header-height) + 28px);
}

.kp-guide-section__aside h2 {
    font-size: clamp(42px, 4.4vw, 72px);
    margin-bottom: 0;
    max-width: 9ch;
}

.kp-guide-section__aside h3 {
    font-size: clamp(34px, 3.6vw, 58px);
    font-weight: 560;
    letter-spacing: -0.05em;
    line-height: 1;
    margin: 0;
    max-width: 10ch;
}

.kp-tournament-prep {
    margin-top: clamp(58px, 7vw, 96px);
}

.kp-guide-index {
    color: #555c61;
    margin-bottom: 50px;
}

.kp-guide-prose {
    font-size: clamp(17px, 1.2vw, 20px);
    line-height: 1.72;
}

.kp-guide-prose > p {
    margin: 0 0 24px;
}

.kp-guide-prose h3,
.kp-rules-section h3 {
    font-size: clamp(28px, 2.6vw, 44px);
    font-weight: 560;
    letter-spacing: -0.045em;
    line-height: 1.03;
    margin: 54px 0 20px;
}

.kp-guide-checklist {
    border-top: 1px solid var(--kp-block-line);
    list-style: none;
    margin: 40px 0 0;
    padding: 0;
}

.kp-guide-checklist li {
    border-bottom: 1px solid var(--kp-block-line);
    padding: 15px 8px 15px 34px;
    position: relative;
}

.kp-guide-checklist li::before {
    content: "✓";
    font-weight: 800;
    left: 5px;
    position: absolute;
}

.kp-guide-section--ink,
.kp-rules-section--ink {
    background: #0d1012;
    color: #fff;
}

.kp-guide-section--ink .kp-guide-kicker,
.kp-guide-section--ink .kp-guide-index,
.kp-rules-section--ink .kp-guide-kicker {
    color: #a9d9ed;
}

.kp-guide-section__head {
    max-width: 960px;
}

.kp-guide-section__head h2 {
    max-width: 12ch;
}

.kp-guide-section__head > p:last-child {
    color: #c8cbcd;
    font-size: 20px;
    line-height: 1.6;
    max-width: 700px;
}

.kp-guide-technique-grid {
    border-left: 1px solid rgba(255, 255, 255, 0.2);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 70px;
}

.kp-guide-technique {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    border-right: 1px solid rgba(255, 255, 255, 0.2);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    min-height: 330px;
    padding: 28px 24px;
}

.kp-guide-technique__number {
    color: #a9d9ed;
    font-size: 12px;
    font-weight: 780;
}

.kp-guide-technique h3 {
    font-size: 29px;
    letter-spacing: -0.04em;
    line-height: 1.03;
    margin: 90px 0 16px;
}

.kp-guide-technique p {
    color: #c8cbcd;
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
}

.kp-guide-note--dark {
    border-left-color: #a9d9ed;
    color: #d7d9da;
}

.kp-aim-diagram {
    margin: 44px 0;
}

.kp-aim-diagram__table {
    aspect-ratio: 1.85 / 1;
    background: #668f70;
    border: 15px solid #39291d;
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.22);
    overflow: hidden;
    position: relative;
}

.kp-aim-diagram__pocket {
    background: #0d1012;
    border-radius: 50%;
    height: 42px;
    position: absolute;
    right: -18px;
    top: -18px;
    width: 42px;
}

.kp-aim-diagram__object,
.kp-aim-diagram__cue,
.kp-aim-diagram__ghost {
    border-radius: 50%;
    height: 48px;
    position: absolute;
    width: 48px;
    z-index: 2;
}

.kp-aim-diagram__object {
    align-items: center;
    background: #c34c39;
    color: #fff;
    display: flex;
    font-size: 12px;
    font-weight: 800;
    justify-content: center;
    right: 25%;
    top: 25%;
}

.kp-aim-diagram__cue {
    background: #fff;
    bottom: 22%;
    left: 23%;
}

.kp-aim-diagram__ghost {
    border: 2px dashed rgba(255,255,255,.8);
    right: calc(25% + 43px);
    top: calc(25% + 43px);
}

.kp-aim-diagram__line {
    height: 2px;
    position: absolute;
    transform-origin: left center;
}

.kp-aim-diagram__line--target {
    background: rgba(255,255,255,.85);
    left: 72%;
    top: 34%;
    transform: rotate(-35deg);
    width: 29%;
}

.kp-aim-diagram__line--cue {
    border-top: 2px dashed rgba(255,255,255,.8);
    bottom: 30%;
    left: 29%;
    transform: rotate(-29deg);
    width: 49%;
}

.kp-aim-diagram figcaption,
.kp-rack-diagram figcaption {
    color: #5b6063;
    font-size: 13px;
    line-height: 1.55;
    margin-top: 12px;
}

.kp-guide-section--tint {
    background: #e7dfd2;
}

.kp-guide-section__lead {
    font-size: clamp(18px, 1.55vw, 25px);
    line-height: 1.5;
    margin: -8px 0 54px;
    max-width: 900px;
}

.kp-guide-sequence {
    counter-reset: none;
}

.kp-guide-sequence article {
    align-items: start;
    border-top: 1px solid var(--kp-block-line);
    display: grid;
    gap: clamp(24px, 5vw, 80px);
    grid-template-columns: 54px minmax(0, 1fr);
    padding: 27px 0 31px;
}

.kp-guide-sequence article:last-child {
    border-bottom: 1px solid var(--kp-block-line);
}

.kp-guide-sequence__number {
    font-size: 12px;
    font-weight: 780;
    letter-spacing: 0.14em;
}

.kp-guide-sequence h3 {
    font-size: clamp(25px, 2.2vw, 38px);
    margin: 0 0 11px;
}

.kp-guide-sequence__copy > p {
    color: #4f5558;
    font-size: 16px;
    line-height: 1.62;
    margin: 0;
    max-width: 820px;
}

.kp-guide-table {
    margin: 48px 0 0;
    overflow-x: auto;
}

.kp-guide-table table {
    border-collapse: collapse;
    min-width: 760px;
    width: 100%;
}

.kp-guide-table th,
.kp-guide-table td {
    border: 0;
    border-bottom: 1px solid var(--kp-block-line);
    padding: 18px 17px;
    text-align: left;
    vertical-align: top;
}

.kp-guide-table th {
    font-size: 11px;
    font-weight: 780;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.kp-guide-table td {
    font-size: 15px;
    line-height: 1.5;
}

.kp-guide-practice {
    background: #a9d9ed;
    padding: clamp(80px, 8vw, 132px) 0;
}

.kp-guide-practice__grid {
    display: grid;
    gap: clamp(50px, 9vw, 150px);
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
}

.kp-guide-practice p {
    font-size: 17px;
    line-height: 1.62;
}

.kp-guide-timeline {
    list-style: none;
    margin: 0;
    padding: 0;
}

.kp-guide-timeline li {
    border-top: 1px solid rgba(13,16,18,.32);
    font-size: 17px;
    line-height: 1.55;
    padding: 20px 0;
}

.kp-guide-timeline li:last-child {
    border-bottom: 1px solid rgba(13,16,18,.32);
}

.kp-guide-next {
    padding: clamp(86px, 9vw, 150px) 0;
}

.kp-guide-next__grid {
    border-left: 1px solid var(--kp-block-line);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.kp-guide-next__grid article {
    border-bottom: 1px solid var(--kp-block-line);
    border-right: 1px solid var(--kp-block-line);
    border-top: 1px solid var(--kp-block-line);
    min-height: 310px;
    padding: 30px;
}

.kp-guide-next__grid h3 {
    font-size: clamp(29px, 3vw, 48px);
    margin: 68px 0 24px;
    max-width: 12ch;
}

.kp-guide-sources {
    border-top: 1px solid var(--kp-block-line);
    padding: 54px 0 72px;
}

.kp-guide-sources h2 {
    font-size: 25px;
    margin: 0 0 18px;
}

.kp-guide-sources p {
    color: #565c5f;
    font-size: 14px;
    line-height: 1.68;
    margin: 0;
    max-width: 960px;
}

.kp-guide-sources a {
    text-decoration: underline;
    text-underline-offset: 3px;
}

.kp-guide-cta {
    background: #0d1012;
    color: #fff;
    padding: clamp(76px, 8vw, 130px) 0;
}

.kp-guide-cta__grid {
    align-items: end;
    display: grid;
    gap: clamp(50px, 9vw, 150px);
    grid-template-columns: minmax(0, 1.3fr) minmax(300px, 0.7fr);
}

.kp-guide-cta .kp-guide-kicker {
    color: #a9d9ed;
}

.kp-guide-cta h2 {
    font-size: clamp(45px, 6vw, 92px);
    margin: 18px 0 0;
    max-width: 12ch;
}

.kp-guide-cta p {
    color: #d0d3d4;
    line-height: 1.6;
}

.kp-guide-button {
    background: #fff;
    color: #0d1012 !important;
    display: inline-flex;
    font-size: 13px;
    font-weight: 760;
    letter-spacing: 0.04em;
    padding: 18px 22px;
    text-decoration: none;
    text-transform: uppercase;
}

.kp-guide-button:hover,
.kp-guide-button:focus-visible {
    background: #a9d9ed;
}

/* Most między landingiem a wiedzą */

.kp-cluster-bridge {
    background: #d8e3d6;
    padding: clamp(82px, 8vw, 132px) 0;
}

.kp-cluster-bridge__grid {
    display: grid;
    gap: clamp(52px, 8vw, 130px);
    grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
}

.kp-cluster-bridge h2 {
    max-width: 9ch;
}

.kp-cluster-bridge p {
    line-height: 1.65;
}

.kp-cluster-bridge__cards {
    border-left: 1px solid rgba(13,16,18,.2);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.kp-cluster-card {
    border-bottom: 1px solid rgba(13,16,18,.2);
    border-right: 1px solid rgba(13,16,18,.2);
    border-top: 1px solid rgba(13,16,18,.2);
    min-height: 390px;
    padding: 28px;
}

.kp-cluster-card h3 {
    font-size: clamp(31px, 3vw, 49px);
    margin: 82px 0 19px;
}

.kp-cluster-card p:not(.kp-cluster-card__index) {
    font-size: 15px;
}

.kp-cluster-inline {
    background: #a9d9ed;
    padding: clamp(64px, 6vw, 96px) 0;
}

.kp-cluster-inline--compact {
    background: #e7dfd2;
}

.kp-cluster-inline__grid {
    align-items: start;
    display: grid;
    gap: 28px clamp(40px, 7vw, 110px);
    grid-template-columns: minmax(220px, .65fr) minmax(0, 1.1fr) minmax(280px, 1.25fr);
}

.kp-cluster-inline h2 {
    font-size: clamp(36px, 3.8vw, 60px);
    margin: 0;
}

.kp-cluster-inline p:last-child {
    font-size: 17px;
    line-height: 1.65;
    margin: 0;
}

/* Rules — osobna kompozycja, bez kopiowania przewodnika */

.kp-rules-hero {
    background: #0d1012;
    color: #fff;
    padding: clamp(72px, 6vw, 108px) 0 clamp(78px, 7vw, 118px);
    position: relative;
}

.kp-rules-hero .kp-guide-shell {
    position: relative;
}

.kp-rules-hero h1 {
    font-size: clamp(52px, 5.2vw, 92px);
    max-width: 16.5ch;
}

.kp-rules-hero .kp-guide-kicker {
    color: #d5b969;
}

.kp-rules-hero__lead {
    color: #d2d5d6;
    max-width: 960px;
}

.kp-rules-hero__stamp {
    align-items: center;
    border: 1px solid rgba(255,255,255,.28);
    display: flex;
    gap: 14px;
    padding: 12px 16px;
    position: absolute;
    right: 0;
    top: 0;
}

.kp-rules-hero__mark {
    color: #d5b969;
    font-size: 24px;
    font-weight: 800;
}

.kp-rules-hero__stamp p {
    color: #cdd0d1;
    font-size: 10px;
    line-height: 1.35;
    margin: 0;
    text-transform: uppercase;
}

.kp-guide-meta--dark {
    border-top-color: rgba(255,255,255,.2);
}

.kp-guide-meta--dark p {
    color: #aeb3b5;
}

.kp-rules-nav {
    background: #d5b969;
    border-bottom: 1px solid rgba(13,16,18,.22);
}

.kp-rules-nav__inner {
    align-items: center;
    display: flex;
    gap: 32px;
    min-height: 72px;
}

.kp-rules-nav__inner > p {
    font-size: 11px;
    font-weight: 780;
    letter-spacing: .12em;
    margin: 0;
    text-transform: uppercase;
}

.kp-rules-nav ul {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 26px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.kp-rules-nav a {
    font-size: 13px;
    font-weight: 650;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.kp-rules-answer {
    padding: 68px 0;
}

.kp-rules-answer__grid {
    border-bottom: 1px solid var(--kp-block-line);
    display: grid;
    gap: clamp(40px, 8vw, 130px);
    grid-template-columns: minmax(220px, .6fr) minmax(0, 1.4fr);
    padding-bottom: 68px;
}

.kp-rules-answer h2 {
    font-size: clamp(34px, 3.2vw, 54px);
    margin: 0;
}

.kp-rules-answer p {
    font-size: clamp(18px, 1.45vw, 24px);
    line-height: 1.6;
    margin: 0;
}

.kp-rules-section > .kp-guide-shell > h2 {
    max-width: 13ch;
}

.kp-rules-section__lead {
    margin: -8px 0 52px;
    max-width: 880px;
}

.kp-rules-family {
    border-left: 1px solid var(--kp-block-line);
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: 54px 0 88px;
}

.kp-rules-family article {
    border-bottom: 1px solid var(--kp-block-line);
    border-right: 1px solid var(--kp-block-line);
    border-top: 1px solid var(--kp-block-line);
    min-height: 310px;
    padding: 28px;
}

.kp-rules-family__label {
    color: #6c7173;
    font-size: 11px;
    font-weight: 780;
    letter-spacing: .14em;
    margin: 0;
    text-transform: uppercase;
}

.kp-rules-family h3 {
    font-size: clamp(31px, 3vw, 46px);
    margin-top: 72px;
}

.kp-rules-family article > p:last-child {
    color: #555b5e;
    font-size: 15px;
    line-height: 1.6;
}

.kp-rules-section--paper {
    background: #e7dfd2;
}

.kp-rules-title-row {
    align-items: start;
    display: flex;
    justify-content: space-between;
}

.kp-rules-title-row h2 {
    max-width: 11ch;
}

.kp-rules-title-row__number {
    align-items: center;
    background: #0d1012;
    border-radius: 50%;
    color: #fff;
    display: flex;
    flex: 0 0 auto;
    font-size: clamp(44px, 6vw, 92px);
    font-weight: 750;
    height: clamp(96px, 11vw, 176px);
    justify-content: center;
    width: clamp(96px, 11vw, 176px);
}

.kp-rules-rack {
    align-items: center;
    border-bottom: 1px solid var(--kp-block-line);
    border-top: 1px solid var(--kp-block-line);
    display: grid;
    gap: clamp(40px, 7vw, 110px);
    grid-template-columns: minmax(330px, .9fr) minmax(0, 1.1fr);
    margin-top: 55px;
    padding: 48px 0;
}

.kp-rack-diagram {
    margin: 0;
}

.kp-rack-diagram__triangle {
    height: 330px;
    margin: 0 auto;
    position: relative;
    width: 360px;
}

.kp-rack-diagram .ball {
    align-items: center;
    background: #f5f1e9;
    border: 2px solid rgba(13,16,18,.28);
    border-radius: 50%;
    display: flex;
    font-size: 11px;
    font-weight: 800;
    height: 56px;
    justify-content: center;
    position: absolute;
    width: 56px;
}

.kp-rack-diagram .ball--eight { background:#0d1012; color:#fff; }
.kp-rack-diagram .ball--corner-a { background:#d5b969; }
.kp-rack-diagram .ball--corner-b { background:#a9d9ed; }
.kp-rack-diagram .ball--apex {left:152px;top:0}.kp-rack-diagram .ball--a{left:123px;top:56px}.kp-rack-diagram .ball--b{left:181px;top:56px}.kp-rack-diagram .ball--c{left:94px;top:112px}.kp-rack-diagram .ball--eight{left:152px;top:112px}.kp-rack-diagram .ball--d{left:210px;top:112px}.kp-rack-diagram .ball--e{left:65px;top:168px}.kp-rack-diagram .ball--f{left:123px;top:168px}.kp-rack-diagram .ball--g{left:181px;top:168px}.kp-rack-diagram .ball--h{left:239px;top:168px}.kp-rack-diagram .ball--corner-a{left:36px;top:224px}.kp-rack-diagram .ball--i{left:94px;top:224px}.kp-rack-diagram .ball--j{left:152px;top:224px}.kp-rack-diagram .ball--k{left:210px;top:224px}.kp-rack-diagram .ball--corner-b{left:268px;top:224px}

.kp-rules-rack__copy h3 {
    margin-top: 0;
}

.kp-rules-rack__copy p {
    font-size: 17px;
    line-height: 1.67;
}

.kp-rules-articles {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 56px;
}

.kp-rules-articles article {
    border-bottom: 1px solid var(--kp-block-line);
    min-height: 320px;
    padding: 34px clamp(24px, 4vw, 60px) 38px 0;
}

.kp-rules-articles article:nth-child(odd) {
    border-right: 1px solid var(--kp-block-line);
}

.kp-rules-articles article:nth-child(even) {
    padding-left: clamp(24px, 4vw, 60px);
}

.kp-rules-articles h3 {
    font-size: clamp(29px, 2.8vw, 45px);
    margin: 0 0 17px;
}

.kp-rules-articles p:not(.kp-rules-article__number) {
    color: #4e5558;
    font-size: 16px;
    line-height: 1.64;
}

.kp-guide-table--dark th,
.kp-guide-table--dark td {
    border-bottom-color: rgba(255,255,255,.2);
    color: #fff;
}

.kp-guide-table--dark td {
    color: #d0d3d4;
}

.kp-rules-myths {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: 58px;
}

.kp-rules-myths article {
    border-bottom: 1px solid var(--kp-block-line);
    min-height: 230px;
    padding: 30px clamp(24px, 4vw, 55px) 34px 0;
}

.kp-rules-myths article:nth-child(odd) {
    border-right: 1px solid var(--kp-block-line);
}

.kp-rules-myths article:nth-child(even) {
    padding-left: clamp(24px, 4vw, 55px);
}

.kp-rules-myths__claim {
    font-size: clamp(24px, 2.4vw, 38px);
    font-weight: 600;
    letter-spacing: -0.04em;
    line-height: 1.1;
    margin: 0 0 30px;
}

.kp-rules-myths article > p:last-child {
    color: #555b5e;
    font-size: 15px;
    line-height: 1.62;
}

.kp-rules-agreement {
    background: #d5b969;
    margin-top: 76px;
    padding: clamp(34px, 5vw, 74px);
}

.kp-rules-agreement h3 {
    margin-top: 0;
    max-width: 14ch;
}

.kp-rules-agreement ol {
    font-size: 17px;
    line-height: 1.6;
    margin: 30px 0;
    padding-left: 22px;
}

.kp-rules-section--split {
    background: #a9d9ed;
}

.kp-rules-split {
    align-items: center;
    display: grid;
    gap: clamp(55px, 9vw, 150px);
    grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr);
}

.kp-rules-split h2 {
    max-width: 10ch;
}

.kp-rules-split p {
    font-size: 17px;
    line-height: 1.65;
    max-width: 650px;
}

.kp-rules-split figure {
    margin: 0;
}

.kp-rules-split img {
    aspect-ratio: 4/3;
    object-fit: cover;
    width: 100%;
}

.kp-guide-cta--rules .kp-guide-kicker {
    color: #d5b969;
}

/* Listing wiedzy */

.kp-journal--knowledge {
    padding: calc(var(--kp-block-header-height) + clamp(62px, 7vw, 108px)) 0 clamp(90px, 9vw, 150px);
}

.kp-journal__intro,
.kp-journal__grid--pilot {
    margin-inline: auto !important;
    max-width: var(--kp-block-shell) !important;
    width: var(--kp-block-shell);
}

.kp-journal__intro {
    border-bottom: 1px solid var(--kp-block-line);
    padding-bottom: 64px;
}

.kp-journal__intro h1 {
    max-width: 12ch;
}

.kp-journal__intro > p:last-child {
    font-size: clamp(18px, 1.55vw, 25px);
    line-height: 1.5;
    max-width: 760px;
}

.kp-journal__grid--pilot {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
}

.kp-journal-card {
    border-bottom: 1px solid var(--kp-block-line);
    border-right: 1px solid var(--kp-block-line);
    padding: 30px;
}

.kp-journal-card--lead {
    grid-row: span 2;
    padding-left: 0;
}

.kp-journal-card--service {
    background: #a9d9ed;
}

.kp-journal-card figure {
    margin: 0 0 28px;
}

.kp-journal-card img {
    aspect-ratio: 16/9;
    object-fit: cover;
    width: 100%;
}

.kp-journal-card--lead img {
    aspect-ratio: 5/4;
}

.kp-journal-card h2 {
    font-size: clamp(30px, 3.3vw, 54px);
    margin: 27px 0 19px;
}

.kp-journal-card > p:not(.kp-journal-card__meta) {
    color: #50575a;
    font-size: 15px;
    line-height: 1.62;
}

.kp-journal-more {
    border-top: 1px solid var(--kp-block-line);
    padding-top: clamp(72px, 7vw, 112px);
}

.kp-journal-more > h2 {
    font-size: clamp(42px, 5vw, 76px);
    letter-spacing: -0.055em;
    line-height: 0.96;
    margin: 0 0 24px;
    max-width: 12ch;
}

@media (max-width: 980px) {
    .kp-guide-hero__grid,
    .kp-guide-section__grid,
    .kp-guide-practice__grid,
    .kp-guide-cta__grid,
    .kp-cluster-bridge__grid,
    .kp-rules-rack,
    .kp-rules-split {
        grid-template-columns: 1fr;
    }

    .kp-guide-hero__image {
        min-height: 520px;
    }

    .kp-guide-section__aside {
        position: static;
    }

    .kp-guide-section__aside h2 {
        max-width: 13ch;
    }

    .kp-guide-section__aside h3 {
        max-width: 14ch;
    }

    .kp-guide-steps,
    .kp-guide-technique-grid,
    .kp-rules-family {
        grid-template-columns: repeat(2, 1fr);
    }

    .kp-cluster-inline__grid,
    .kp-rules-answer__grid {
        grid-template-columns: 1fr;
    }

    .kp-rules-title-row__number {
        height: 110px;
        width: 110px;
    }
}

@media (max-width: 680px) {
    .kp-guide-breadcrumb {
        font-size: 10px;
        padding-top: calc(var(--kp-block-header-height) + 18px);
    }

    .kp-guide-hero,
    .kp-guide-section,
    .kp-rules-section {
        padding-bottom: 74px;
        padding-top: 74px;
    }

    .kp-guide-hero h1,
    .kp-rules-hero h1,
    .kp-journal__intro h1 {
        font-size: clamp(45px, 14vw, 66px);
        line-height: .93;
    }

    .kp-guide-hero__lead,
    .kp-rules-hero__lead,
    .kp-rules-section__lead {
        font-size: 18px;
    }

    .kp-guide-hero__image {
        min-height: 410px;
    }

    .kp-guide-quick h2,
    .kp-guide-section h2,
    .kp-guide-practice h2,
    .kp-guide-next h2,
    .kp-cluster-bridge h2,
    .kp-rules-section h2 {
        font-size: clamp(38px, 11vw, 54px);
    }

    .kp-guide-steps,
    .kp-guide-technique-grid,
    .kp-guide-next__grid,
    .kp-cluster-bridge__cards,
    .kp-rules-family,
    .kp-rules-articles,
    .kp-rules-myths,
    .kp-journal__grid--pilot {
        grid-template-columns: 1fr;
    }

    .kp-guide-step {
        min-height: 160px;
    }

    .kp-guide-step__number {
        margin-bottom: 32px;
    }

    .kp-guide-technique {
        min-height: 260px;
    }

    .kp-guide-technique h3 {
        margin-top: 52px;
    }

    .kp-aim-diagram__table {
        border-width: 10px;
    }

    .kp-aim-diagram__object,
    .kp-aim-diagram__cue,
    .kp-aim-diagram__ghost {
        height: 34px;
        width: 34px;
    }

    .kp-guide-sequence article {
        grid-template-columns: 34px 1fr;
    }

    .kp-cluster-card {
        min-height: 310px;
    }

    .kp-cluster-card h3 {
        margin-top: 52px;
    }

    .kp-rules-hero {
        padding-top: 136px;
    }

    .kp-rules-hero__stamp {
        left: 0;
        right: auto;
        top: -96px;
    }

    .kp-rules-nav {
        overflow-x: auto;
    }

    .kp-rules-nav__inner {
        align-items: flex-start;
        display: block;
        padding: 20px 0;
    }

    .kp-rules-nav ul {
        flex-wrap: nowrap;
        margin-top: 12px;
        min-width: max-content;
    }

    .kp-rules-title-row__number {
        font-size: 42px;
        height: 76px;
        width: 76px;
    }

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

    .kp-rack-diagram__triangle {
        transform: scale(.78);
        transform-origin: left top;
        width: 360px;
    }

    .kp-rack-diagram {
        height: 310px;
        overflow: hidden;
    }

    .kp-rules-articles article,
    .kp-rules-articles article:nth-child(even),
    .kp-rules-myths article,
    .kp-rules-myths article:nth-child(even) {
        border-right: 0;
        min-height: 0;
        padding: 28px 0;
    }

    .kp-journal-card,
    .kp-journal-card--lead {
        border-right: 0;
        padding: 28px 0;
    }
}