/* UI v6 R6e: static pages (page-header, page-prose, and the page elements that follow). Colours and spacing come from
   the cz-site.css tokens; loaded only where an element renders. No sticky, no CSS uppercase. */

[data-cz-ui="6"] .cz-page-head {
    box-sizing: border-box;
    width: 100%;
    max-width: var(--cz-container);
    margin-inline: auto;
    padding: var(--cz-sp-8) var(--cz-gutter-v6) var(--cz-sp-6);
}

/* the first block under the v6 header: the header overlays the page (cz-header.css), so the title starts below it */
[data-cz-ui="6"] body.cz-has-header #brx-content > .cz-page-head:first-child {
    padding-top: calc(var(--cz-hdr-h, 72px) + var(--cz-sp-8));
}

[data-cz-ui="6"] .cz-page-head nav {
    margin-block-end: var(--cz-sp-4);
    font-size: 14px;
    line-height: 1.4;
}

[data-cz-ui="6"] .cz-page-head ol {
    display: flex;
    flex-wrap: wrap;
    gap: var(--cz-sp-1) var(--cz-sp-2);
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--cz-text-2);
}

[data-cz-ui="6"] .cz-page-head li + li::before {
    content: "/";
    margin-inline-end: var(--cz-sp-2);
    color: var(--cz-text-3);
}

[data-cz-ui="6"] .cz-page-head a {
    color: var(--cz-text-2);
    text-decoration: none;
}

[data-cz-ui="6"] .cz-page-head a:hover {
    color: var(--cz-text);
    text-decoration: underline;
}

[data-cz-ui="6"] .cz-page-head [aria-current="page"] {
    color: var(--cz-text);
}

[data-cz-ui="6"] .cz-page-head .czv-h1 {
    margin: 0;
    overflow-wrap: anywhere;
}

[data-cz-ui="6"] .cz-page-head .czv-lead {
    max-width: 60ch;
    margin: var(--cz-sp-3) 0 0;
}

[data-cz-ui="6"] .cz-prose {
    box-sizing: border-box;
    width: 100%;
    max-width: calc(72ch + 2 * var(--cz-gutter-v6));
    margin-inline: auto;
    padding: var(--cz-sp-6) var(--cz-gutter-v6);
    color: var(--cz-text);
    font-size: 16px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

[data-cz-ui="6"] .cz-prose__title {
    margin: 0 0 var(--cz-sp-4);
}

[data-cz-ui="6"] .cz-prose p,
[data-cz-ui="6"] .cz-prose ul,
[data-cz-ui="6"] .cz-prose ol {
    margin: 0 0 var(--cz-sp-4);
}

[data-cz-ui="6"] .cz-prose ul,
[data-cz-ui="6"] .cz-prose ol {
    padding-inline-start: 1.4em;
}

[data-cz-ui="6"] .cz-prose li + li {
    margin-block-start: var(--cz-sp-2);
}

[data-cz-ui="6"] .cz-prose h2,
[data-cz-ui="6"] .cz-prose h3 {
    margin: var(--cz-sp-7) 0 var(--cz-sp-3);
    color: var(--cz-text-max);
    line-height: 1.25;
}

[data-cz-ui="6"] .cz-prose h2 { font-size: 24px; }
[data-cz-ui="6"] .cz-prose h3 { font-size: 20px; }

[data-cz-ui="6"] .cz-prose a {
    color: var(--cz-red-text);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

[data-cz-ui="6"] .cz-prose a:focus-visible {
    outline: 2px solid var(--cz-red-text);
    outline-offset: 2px;
}

/* page-media-text: images and text, 1 : 1 from 1024 px, stacked (images first) below */
[data-cz-ui="6"] .cz-page-media__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--cz-sp-6);
    align-items: center;
}

[data-cz-ui="6"] .cz-page-media__images {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--cz-sp-4);
    min-width: 0;
}

[data-cz-ui="6"] .cz-page-media__figure {
    margin: 0;
    overflow: hidden;
    border-radius: var(--cz-r-card);
    background: var(--cz-surface);
}

[data-cz-ui="6"] .cz-page-media__figure img {
    display: block;
    width: 100%;
    height: auto;
}

[data-cz-ui="6"] .cz-page-media__text {
    min-width: 0;
    color: var(--cz-text);
    font-size: 16px;
    line-height: 1.65;
    overflow-wrap: anywhere;
}

[data-cz-ui="6"] .cz-page-media__title {
    margin: 0 0 var(--cz-sp-4);
}

[data-cz-ui="6"] .cz-page-media__text p,
[data-cz-ui="6"] .cz-page-media__text ul,
[data-cz-ui="6"] .cz-page-media__text ol {
    margin: 0 0 var(--cz-sp-4);
}

[data-cz-ui="6"] .cz-page-media__text ul,
[data-cz-ui="6"] .cz-page-media__text ol {
    padding-inline-start: 1.4em;
}

[data-cz-ui="6"] .cz-page-media__text h2,
[data-cz-ui="6"] .cz-page-media__text h3 {
    margin: var(--cz-sp-6) 0 var(--cz-sp-3);
    color: var(--cz-text-max);
    line-height: 1.25;
}

[data-cz-ui="6"] .cz-page-media__text a {
    color: var(--cz-red-text);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

[data-cz-ui="6"] .cz-page-media__text a:focus-visible {
    outline: 2px solid var(--cz-red-text);
    outline-offset: 2px;
}

/* two pictures: side by side from 480 px in the same 3 : 4 frame, so two tall portraits do not tower over the text */
@media (min-width: 480px) {
    [data-cz-ui="6"] .cz-page-media--pair .cz-page-media__images {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    [data-cz-ui="6"] .cz-page-media--pair .cz-page-media__figure img {
        aspect-ratio: 3 / 4;
        height: auto;
        object-fit: cover;
    }
}

/* images only: one column of pictures, two side by side from 640 px */
@media (min-width: 640px) {
    [data-cz-ui="6"] .cz-page-media--gallery .cz-page-media__images {
        grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [data-cz-ui="6"] .cz-page-media:not(.cz-page-media--gallery):not(.cz-page-media--text) .cz-page-media__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--cz-sp-9);
    }

    [data-cz-ui="6"] .cz-page-media[data-side="right"] .cz-page-media__images {
        order: 2;
    }
}

/* page-cards: a ul grid, one column on a phone, then 2 / 3 as set */
[data-cz-ui="6"] .cz-cards__title {
    margin: 0 0 var(--cz-sp-3);
}

[data-cz-ui="6"] .cz-cards__lead {
    max-width: 60ch;
    margin: 0 0 var(--cz-sp-6);
}

[data-cz-ui="6"] .cz-cards {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--cz-sp-4);
    margin: 0;
    padding: 0;
    list-style: none;
}

[data-cz-ui="6"] .cz-card {
    box-sizing: border-box;
    min-width: 0;
    margin: 0;
    padding: var(--cz-sp-5);
    border: 1px solid var(--cz-line);
    border-radius: var(--cz-r-card);
    background: var(--cz-surface);
    color: var(--cz-text);
    overflow-wrap: anywhere;
}

[data-cz-ui="6"] .cz-card__media {
    margin-block-end: var(--cz-sp-4);
}

[data-cz-ui="6"] .cz-card__media--image {
    margin: calc(-1 * var(--cz-sp-5)) calc(-1 * var(--cz-sp-5)) var(--cz-sp-4);
    overflow: hidden;
    border-radius: var(--cz-r-card) var(--cz-r-card) 0 0;
}

[data-cz-ui="6"] .cz-card__media--image img {
    display: block;
    width: 100%;
    height: auto;
}

[data-cz-ui="6"] .cz-card__media .czv-icon {
    width: 32px;
    height: 32px;
    color: var(--cz-red-text);
}

[data-cz-ui="6"] .cz-card__title {
    margin: 0 0 var(--cz-sp-2);
}

[data-cz-ui="6"] .cz-card__text {
    margin: 0;
    color: var(--cz-text-2);
    font-size: 16px;
    line-height: 1.55;
}

@media (min-width: 640px) {
    [data-cz-ui="6"] .cz-cards[data-columns="2"],
    [data-cz-ui="6"] .cz-cards[data-columns="3"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    [data-cz-ui="6"] .cz-cards[data-columns="3"] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* page-offices: one card per office; the grid never forces a width, so five offices with long numbers fit 320 px */
[data-cz-ui="6"] .cz-page-offices__title {
    margin: 0 0 var(--cz-sp-6);
}

[data-cz-ui="6"] .cz-page-offices__list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: var(--cz-sp-4);
    margin: 0;
    padding: 0;
    list-style: none;
}

[data-cz-ui="6"] .cz-page-office {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--cz-sp-2);
    box-sizing: border-box;
    min-width: 0;
    margin: 0;
    padding: var(--cz-sp-5);
    border: 1px solid var(--cz-line);
    border-radius: var(--cz-r-card);
    background: var(--cz-surface);
    color: var(--cz-text);
    overflow-wrap: anywhere;
}

[data-cz-ui="6"] .cz-page-office__city {
    margin: 0;
}

[data-cz-ui="6"] .cz-page-office__country,
[data-cz-ui="6"] .cz-page-office__address,
[data-cz-ui="6"] .cz-page-office__hours {
    max-width: 100%;
    margin: 0;
    color: var(--cz-text-2);
    font-size: 16px;
    line-height: 1.5;
}

[data-cz-ui="6"] .cz-page-office__phone,
[data-cz-ui="6"] .cz-page-office__map {
    display: inline-flex;
    align-items: center;
    gap: var(--cz-sp-2);
    max-width: 100%;
    min-height: 44px;
    color: var(--cz-text);
    font-size: 16px;
    text-decoration: none;
}

[data-cz-ui="6"] .cz-page-office__phone span,
[data-cz-ui="6"] .cz-page-office__map span {
    min-width: 0;
    overflow-wrap: anywhere;
}

[data-cz-ui="6"] .cz-page-office__phone {
    font-weight: 600;
}

[data-cz-ui="6"] .cz-page-office__map {
    color: var(--cz-red-text);
}

[data-cz-ui="6"] .cz-page-office__phone:hover,
[data-cz-ui="6"] .cz-page-office__map:hover {
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

[data-cz-ui="6"] .cz-page-office__phone:focus-visible,
[data-cz-ui="6"] .cz-page-office__map:focus-visible {
    outline: 2px solid var(--cz-red-text);
    outline-offset: 2px;
}

[data-cz-ui="6"] .cz-page-office .czv-icon {
    flex: none;
    width: 20px;
    height: 20px;
}

[data-cz-ui="6"] .cz-page-offices__legal {
    margin-block-start: var(--cz-sp-7);
    padding: var(--cz-sp-5);
    border: 1px solid var(--cz-line);
    border-radius: var(--cz-r-card);
    color: var(--cz-text-2);
    overflow-wrap: anywhere;
}

[data-cz-ui="6"] .cz-page-offices__legal-title {
    margin: 0 0 var(--cz-sp-3);
    color: var(--cz-text);
}

[data-cz-ui="6"] .cz-page-offices__legal-list {
    display: grid;
    gap: var(--cz-sp-1);
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 16px;
    line-height: 1.5;
}