/* ── Block: Mapa strony ──────────────────────────────────────────────── */

.sitemap-block {
    padding: 48px 0 64px;
    background: var(--wp--preset--color--white);
}

.sitemap-block .cm-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 48px;
}

.sitemap-block .cm-header__left {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.sitemap-block .cm-header__right {
    flex-shrink: 0;
}

.sitemap-block .cm-header__btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
}

.sitemap-block .cm-header__btn svg {
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .sitemap-block .cm-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        margin-bottom: 24px;
    }

    .sitemap-block .cm-header__right {
        display: none;
    }
}

/* ── Section ─────────────────────────────────────────────────────────── */

.sitemap-section {
    margin-bottom: 48px;
}

.sitemap-section:last-child {
    margin-bottom: 0;
}

.sitemap-section__title {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--wp--preset--color--neutral-300);
    margin: 0 0 24px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e4e4ea;
}

/* ── 2-column grid ───────────────────────────────────────────────────── */

.sitemap-grid {
    columns: 2;
    column-gap: 80px;
}

/* ── Single item ─────────────────────────────────────────────────────── */

.sitemap-item {
    break-inside: avoid;
    padding-bottom: 28px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* ── Parent link ─────────────────────────────────────────────────────── */

.sitemap-item__parent {
    font-size: 20px;
    font-weight: 300;
    line-height: 1.3;
    color: var(--wp--preset--color--black);
    text-decoration: none;
    transition: color 0.15s;
}

.sitemap-item__parent:hover {
    color: var(--wp--preset--color--purple-500);
}

/* ── Children list ───────────────────────────────────────────────────── */

.sitemap-item__children {
    list-style: none;
    margin: 0;
    padding: 0 0 0 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sitemap-item__child {
    font-size: 14px;
    font-weight: 300;
    line-height: 1.5;
    color: var(--wp--preset--color--neutral-300);
    text-decoration: none;
    transition: color 0.15s;
}

.sitemap-item__child:hover {
    color: var(--wp--preset--color--black);
}

/* ── Mobile ──────────────────────────────────────────────────────────── */

@media (max-width: 767px) {
    .sitemap-block {
        padding: 32px 0 48px;
    }

    .sitemap-grid {
        columns: 1;
    }

    .sitemap-item__parent {
        font-size: 18px;
    }
}

/* ── Dark mode ──────────────────────────────────────────────────────────── */

html[data-theme="dark"] .sitemap-block {
    background: var(--wp--preset--color--black, #1A1A25);
}

html[data-theme="dark"] .sitemap-block .sec-headline,
html[data-theme="dark"] .sitemap-block .sec-headline-icon {
    color: var(--wp--preset--color--yellow, #FFE500);
}

html[data-theme="dark"] .sitemap-block .sec-title {
    color: var(--wp--preset--color--white);
}

html[data-theme="dark"] .sitemap-block .sec-desc {
    color: rgba(255, 255, 255, .65);
}

html[data-theme="dark"] .sitemap-block .cm-header__btn.btn-primary {
    border-color: var(--wp--preset--color--white);
    color: var(--wp--preset--color--white);
}

html[data-theme="dark"] .sitemap-block .cm-header__btn.btn-primary:hover,
html[data-theme="dark"] .sitemap-block .cm-header__btn.btn-primary:active {
    background: var(--wp--preset--color--white);
    color: var(--wp--preset--color--black, #1A1A25);
}

html[data-theme="dark"] .sitemap-section__title {
    color: rgba(255, 255, 255, .5);
    border-bottom-color: rgba(255, 255, 255, .12);
}

html[data-theme="dark"] .sitemap-item__parent {
    color: var(--wp--preset--color--white);
}

html[data-theme="dark"] .sitemap-item__parent:hover {
    color: var(--wp--preset--color--yellow, #FFE500);
}

html[data-theme="dark"] .sitemap-item__child {
    color: rgba(255, 255, 255, .65);
}

html[data-theme="dark"] .sitemap-item__child:hover {
    color: var(--wp--preset--color--white);
}