:root {
    --srp-blue: #246197;
    --srp-ink: #29485e;
    --srp-teal: #246b77;
    --srp-paper: #f6f9fb;
    --srp-line: #dce6ed;

    /* Nazwy używane przez aktualną Cassiopeię. */
    --template-link-color: var(--srp-teal);
    --template-link-hover-color: #174f60;
    --link-color: var(--srp-teal);
    --link-color-rgb: 36, 107, 119;
    --link-hover-color: #174f60;
    --link-hover-color-rgb: 23, 79, 96;
    --body-color: #344653;
    --body-color-rgb: 52, 70, 83;
    --body-bg: var(--srp-paper);
    --body-bg-rgb: 246, 249, 251;

    /* Zgodność z dotychczasowymi własnymi stylami. */
    --cassiopeia-color-primary: var(--srp-blue);
    --cassiopeia-color-link: var(--srp-teal);
    --cassiopeia-color-hover: #174f60;
}

body.site {
    background-color: var(--srp-paper);
    color: var(--body-color);
    line-height: 1.65;
}

/* Nagłówek: zachowana niebieska identyfikacja, subtelna głębia. */
.container-header {
    background: linear-gradient(115deg, #205782, #2c6b9a);
    box-shadow: 0 3px 14px rgb(24 57 81 / 9%);
}

.container-header .navbar-brand {
    padding-block: .35rem;
}

.container-header .brand-logo {
    color: #fff;
    font-size: clamp(1.25rem, 1rem + .65vw, 1.85rem);
    font-weight: 500;
    line-height: 1.3;
    letter-spacing: .005em;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.container-header .brand-logo:hover,
.container-header .brand-logo:focus-visible {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: .2em;
}

.container-header .mod-menu > li > a {
    color: #fff;
    text-decoration: none;
    text-underline-offset: .35em;
    text-decoration-thickness: 2px;
}

.container-header .mod-menu > li > a:hover,
.container-header .mod-menu > li > a:focus-visible,
.container-header .mod-menu > li.active > a,
.container-header .mod-menu > li > a[aria-current="page"] {
    text-decoration: underline;
    text-decoration-color: #c1e1ec;
}

/* Hero: naturalna proporcja, bez kadrowania napisu i rozciągania obrazu.
 * Selektor dotyczy konkretnego modułu widocznego w tej instalacji.
 */
.container-banner:has(#mod-custom110) {
    background: linear-gradient(180deg, #eaf2f8, var(--srp-paper));
    padding-block: 1rem 1.5rem;
    padding-inline: 1rem;
    margin-bottom: 1rem;
}

.container-banner #mod-custom110 p {
    margin: 0;
}

.container-banner #mod-custom110 img {
    display: block;
    max-width: 100%;
    height: auto;
    margin-inline: auto;
    border-radius: 14px;
    box-shadow: 0 8px 26px rgb(28 67 96 / 12%);
}

/* Ścieżka nawigacji: lżejsza i mniej podobna do szarego paska formularza. */
.mod-breadcrumbs__wrapper .breadcrumb {
    background: transparent;
    padding-block: .6rem;
    border-bottom: 1px solid var(--srp-line);
    border-radius: 0;
    color: #607481;
    font-size: .875rem;
}

/* Typografia poza stroną główną też pozostaje czytelna. */
h1, h2, h3 {
    color: var(--srp-ink);
    line-height: 1.25;
}

main a:not(.btn) {
    text-decoration-thickness: 1px;
    text-underline-offset: .16em;
}

.item-image {
    margin: 1em;
}

/* Wyłącznie trzy artykuły otwierające stronę główną.
 * Cassiopeia nadal ustala masonry, liczbę kolumn i breakpointy.
 */
body.view-featured .blog-featured .blog-item {
    background: #fff;
    border: 1px solid var(--srp-line);
    border-radius: 14px;
    box-shadow: 0 4px 16px rgb(33 65 87 / 4%);
    padding: 1.1rem;
    break-inside: avoid;
    min-width: 0;
}

body.view-featured .blog-featured .blog-item > .item-image {
    margin: 0 0 1rem;
    text-align: center;
}

body.view-featured .blog-featured .item-image img {
    max-width: 100%;
    height: auto;
    border-radius: 9px;
}

body.view-featured .blog-featured .item-title {
    margin: 0 0 .8rem;
    font-size: clamp(1.35rem, 1.15rem + .45vw, 1.7rem);
    font-weight: 650;
    line-height: 1.25;
}

body.view-featured .blog-featured .item-title a {
    color: var(--srp-ink);
    text-decoration: none;
}

body.view-featured .blog-featured .item-title a:hover,
body.view-featured .blog-featured .item-title a:focus-visible {
    color: var(--srp-teal);
    text-decoration: underline;
}

body.view-featured .blog-featured .item-content p {
    margin-bottom: 1rem;
}

body.view-featured .blog-featured .item-content ul {
    padding-inline-start: 1.25rem;
}

body.view-featured .blog-featured .item-content li + li {
    margin-top: .4rem;
}

body.view-featured .blog-featured .readmore {
    margin-top: 1.2rem;
    margin-bottom: 0;
}

body.view-featured .blog-featured .readmore .btn {
    color: #205d72;
    background: #eff6f8;
    border: 1px solid #cbdfe5;
    border-radius: 8px;
    padding: .55rem .8rem;
    font-size: .9rem;
    line-height: 1.5;
    white-space: normal;
    text-align: start;
}

body.view-featured .blog-featured .readmore .btn:hover,
body.view-featured .blog-featured .readmore .btn:focus-visible {
    color: #fff;
    background: #246b77;
    border-color: #246b77;
}

.container-footer {
    background: #205782;
    margin-top: 2rem;
}

/* Widoczny fokus dla osób poruszających się klawiaturą. */
body.site a:focus-visible,
body.site button:focus-visible {
    outline: 3px solid #b87930;
    outline-offset: 3px;
}