/* =========================================================
   01. ZMIENNE I BAZA
   ========================================================= */

:root {
    --blue-light: #bbd9ee;
    --blue-lighter: #f8fafc;
    --blue-mid: #ddecf6;
    --gray-custom: #f1f1f1;
    --blue-custom: #191919;
    --blue-custom-light: #e4eef6;
    --blue-custom-lighter: #56656f;
    --orange: #ff7600;
    --border-entry: #d3e0e9;
    --bg-entry: #ffffff;
    --bg-tag: #f3f6fa;
    --link-color: #153752;
}

/* =========================================================
   02. BODY / GLOBALNE USTAWIENIA
   ========================================================= */
html, body {
    max-width: 100%;
    overflow-x: hidden; /* Blokuje uciekanie elementów na boki */
}
body {
    background-color: #ffffff;
    overflow-x: hidden;
    width: 100%;
}
.cnr-offcanvas-menu,
.cnr-offcanvas-menu *,
.cnr-manifest-box,

#main {
    padding: 0;
}

/* =========================================================
   06. FOOTER
   ========================================================= */

.cnr-footer {
    box-sizing: border-box;
}
@media (max-width: 767px) {
    .cnr-footer-grid {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 20px 0; /* Odstęp pionowy między wierszami */
    }

    .cnr-footer-grid .cnr-f-col{
        width: 100% !important; /* Rozciąga się na całą szerokość */
        text-align: left;     /* Wyśrodkowanie tekstu dla lepszego wyglądu */
    }
}
/* =========================================================
   03. NAWIGACJA I HEADER
   ========================================================= */

.cnr-main-nav {
    width: 100%;
    height: 60px;
    background-color: var(--blue-custom);
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1000;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.cnr-nav-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cnr-brand-block {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 60px;
}
.cnr-logo-img-wrapper {
    display: block;
    width: 65px;
    height: 75px;
    position: relative;
    top: 8px;
    z-index: 1010;
    overflow: hidden;
}
.cnr-logo-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}
.cnr-logo-text {
    font-family: inherit;
    font-weight: 300;
    font-size: 1.5rem;
    color: #ffffff;
    text-decoration: none;
    letter-spacing: 2px;
    line-height: 1;
}
.cnr-logo-text span {
    color: var(--orange);
    font-weight: 400;
}
.cnr-menu-toggle {
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 26px;
    height: 18px;
    padding: 0;
}
.cnr-bar {
    width: 100%;
    height: 2px;
    background-color: #ffffff;
}
.cnr-menu-footer-links {
    display: flex;
    align-items: center;
    gap: 16px;
    box-sizing: border-box;
    padding: 16px 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.cnr-user-logged-menu {
    display: flex;
    align-items: center;
    gap: 12px; /* Oddech między kołem fotki a tekstem wyloguj */
}

/* --- PERFEKCYJNE KOŁO AWATARA W MENU --- */
.cnr-menu-avatar-wrapper {
    width: 32px;
    height: 32px;
    border-radius: 50%; /* Wymuszenie idealnego okręgu */
    overflow: hidden;
    background-color: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #ffffff; /* Biała, butikowa ramka wokół fotki */
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08); /* Miękki, delikatny cień */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cnr-menu-avatar-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Gwarancja, że fotka nie zostanie spłaszczona ani zniekształcona */
}

.cnr-menu-avatar-placeholder {
    font-size: 0.95rem;
    line-height: 1;
}

/* Efekt uniesienia awatara po najechaniu myszką */
.cnr-menu-avatar-link:hover .cnr-menu-avatar-wrapper {
    transform: scale(1.05);
    box-shadow: 0 4px 10px rgba(255, 118, 0, 0.15); /* Cień rozświetla się w barwie marki */
}

/* --- STYLIZACJA LINKU WYLOGOWANIA --- */
.cnr-menu-logout-btn {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--blue-custom-lighter); /* Szlachetny grafit w spoczynku */
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 6px 12px;
    border-radius: 4px;
    background-color: transparent;
    transition: all 0.2s ease;
    border: none;
}

/* Hover wylogowania – link dyskretnie podświetla się na lekki błąd, sygnalizując wyjście */
.cnr-menu-logout-btn:hover {
    background-color: rgba(239, 68, 68, 0.06); /* Subtelna czerwona mgiełka */
    color: var(--orange);
}

/* Zapobiegawcza stylizacja tradycyjnego buttona logowania (gdyby nie był ostylowany wyżej) */
.cnr-menu-login-btn {
    font-size: 0.82rem;
    font-weight: 700;
    color: #ffffff;
    background-color: var(--orange);
    padding: 8px 16px;
    border-radius: 4px;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    transition: background-color 0.2s;
}
.cnr-menu-login-btn:hover {
    background-color: #e06700;
}

/* --- RESPONSYWNOŚĆ MOBILNA W MENU --- */
@media (max-width: 768px) {
    .cnr-user-logged-menu {
        gap: 8px;
    }
    .cnr-menu-logout-btn {
        font-size: 0.75rem;
        padding: 4px 8px;
    }
}

/* =========================================================
   04. HERO / PANORAMA / MANIFEST
   ========================================================= */

.cnr-hero-wrapper {
    background-color: #242d30;
    position: relative;
    width: 100%;
}
.cnr-panorama {
    position: relative;
    width: 100%;
    max-width: none;
    margin: 0 auto;
    aspect-ratio: 21 / 9;
    min-height: 480px;
    max-height: 650px;
    background: transparent url("../img/header/just_ride.webp") no-repeat center 25% / cover;
    display: flex;
    align-items: flex-end;
    z-index: 2;
}

.cnr-loader-svg {
    position: absolute;
    top: 38%; /* Zmniejszenie z 50% na 38% podnosi cały element do góry */
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    max-width: 600px;
    height: auto;
    pointer-events: none;
    z-index: 1;
}

.cnr-manifest-overlay {
    width: 100%;
    background: linear-gradient(to bottom,
            rgba(25, 25, 25, 0) 0%,
            rgba(25, 25, 25, 0.4) 40%,
            rgba(25, 25, 25, 0.95) 100%);
    padding: 60px 20px 20px 20px;
    text-align: center;
    box-sizing: border-box;
    z-index: 2;
    position: relative;
}

.cnr-path-anim {
    fill: none;
    stroke: #f39200;
    stroke-width: 10;
    stroke-linecap: round;
    stroke-dasharray: 25 15;
    stroke-dashoffset: 1000;
    animation: cnrDrive 20s linear infinite;
}

@keyframes cnrDrive {
    to {
        stroke-dashoffset: 0;
    }
}
.cnr-manifest-box {
    width: 100%;
    padding: 24px 20px;
    text-align: center;
    background-color: var(--blue-custom);
}
.cnr-container {
    max-width: 950px;
    margin: 0 auto;
}
.cnr-title {
    font-family: inherit;
    font-size: 2.8rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 12px;
    color: #ffffff;
    line-height: 1.1;
    text-shadow:
        0 2px 12px rgba(0, 0, 0, 0.7),
        0 4px 25px rgba(0, 0, 0, 0.4);
}
.cnr-title span {
    color: var(--orange);
    font-weight: 700;
}
.cnr-text {
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1.65;
    color: #ffffff;
    margin-bottom: 0px;
    text-wrap: nowrap;
    text-shadow:
        0 1px 3px rgba(0, 0, 0, 0.6),
        0 4px 12px rgba(0, 0, 0, 0.5),
        0 10px 30px rgba(0, 0, 0, 0.3);
}
.cnr-manifest-mobile-only {
    display: none;
}

@media (max-width: 768px) {
     .cnr-loader-svg {
        top: 20% !important; /* Przesuwa góry mocno pod samą belkę nawigacji */
        max-width: 90%;      /* Delikatnie zwęża rysunek, żeby zmieścił się na ekranie telefonu */
    }
    .cnr-panorama {
        aspect-ratio: 16 / 10;
        min-height: auto;
        max-height: none;
        height: auto;
        display: block;
        background: url("../img/header/just_ride.webp") no-repeat center 25% / cover;
    }
    .cnr-desktop-only {
        display: none;
    }
    .cnr-manifest-mobile-only {
        display: block;
        background-color: #191919;
        padding: 30px 20px 35px 20px;
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
    .cnr-manifest-mobile-only .cnr-title {
        display: block;
        font-family: inherit;
        font-size: 1.8rem;
        font-weight: 300;
        text-transform: uppercase;
        letter-spacing: 2px;
        margin-bottom: 12px;
        color: #ffffff;
        text-shadow: none;
    }
    .cnr-manifest-mobile-only .cnr-title span {
        color: var(--orange);
        font-weight: 700;
    }
    .cnr-manifest-mobile-only .cnr-text {
        display: block;
        font-size: 0.98rem;
        line-height: 1.55;
        color: rgba(255, 255, 255, 0.85);
        text-wrap: balance;
        white-space: normal;
        text-shadow: none;
    }
    .cnr-intro-block {
        padding: 35px 15px 15px 15px;
    }
    .cnr-intro-sub {
        font-size: 0.95rem;
        line-height: 1.55;
    }
    .cnr-intro-sub br {
        display: none;
    }
    .cnr-grid-stream {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 0 15px;
        margin-bottom: 40px;
    }
    .cnr-grid-stream .cnr-post-card {
        grid-column: span 1;
        width: 100%;
    }
    .cnr-grid-stream-featured .cnr-post-card:nth-child(-n+3) .cnr-entry {
        flex-direction: column;
        height: auto;
    }
    .cnr-grid-stream .cnr-post-card .cnr-entry-media,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(-n+3) .cnr-entry-media {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 10;
    }
    .cnr-grid-stream .cnr-post-card .cnr-entry-content,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(-n+3) .cnr-entry-content {
        width: 100%;
        padding: 20px;
    }
    .cnr-entry-title {
        font-size: 1.2rem;
    }
    .cnr-entry-excerpt {
        font-size: 0.92rem;
        margin-bottom: 16px;
    }
}
.cnr-grid-equal {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto 40px auto;
    padding: 0;
    width: 100%;
    box-sizing: border-box;
}
.cnr-grid-equal .cnr-post-card {
    display: flex;
    grid-column: span 1;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.cnr-grid-equal .cnr-entry {
    background: var(--bg-entry);
    border: 1px solid var(--border-entry);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}
.cnr-grid-equal .cnr-entry:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(211, 224, 233, 0.4);
}
.cnr-grid-equal .cnr-entry-media {
    width: 100%;
    max-width: 100%;
    height: 200px;
    overflow: hidden;
    flex-shrink: 0;
    box-sizing: border-box;
}
.cnr-grid-equal .cnr-entry-media img {
    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.cnr-grid-equal .cnr-entry-content {
    width: auto;
    padding: 24px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    min-width: 0;
}
.cnr-grid-equal .cnr-entry-title {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 12px;
    min-height: 3.5rem;
}
.cnr-grid-equal .cnr-entry-excerpt {
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--blue-custom-lighter);
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cnr-grid-equal .cnr-entry-footer {
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid var(--bg-tag);
    width: 100%;
}
.cnr-grid-equal .cnr-entry-meta,
.cnr-related-grid-clean .cnr-entry-meta {
    font-size: 0.82rem;
    color: var(--blue-custom-lighter);
    margin-bottom: 14px;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 6px 8px;
    width: auto;
}
.cnr-grid-equal .cnr-badge-start-place,
.cnr-related-grid-clean .cnr-badge-start-place {
    flex-shrink: 0;
    margin-right: 2px;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 4px 8px 2px;
    border-radius: 4px;
    display: inline-block;
    line-height: 1;
    background-color: #f1f1f1;
    color: var(--link-color);
    border: 1px solid rgba(0, 0, 0, 0.02);
    transition: all 0.2s ease;
}

.cnr-related-grid-clean .cnr-badge-start-place.cnr-zoom-location {
    background-color: var(--orange);
    color: #ffffff;
}
.cnr-grid-equal .cnr-meta-divider,
.cnr-related-grid-clean .cnr-meta-divider {
    align-self: center;
    line-height: 1;
}
.cnr-grid-equal .cnr-author,
.cnr-grid-equal .cnr-date,
.cnr-related-grid-clean .cnr-author,
.cnr-related-grid-clean .cnr-date {
    display: inline-block;
    line-height: 1.4;
}
.cnr-intro-block {
    width: auto;
    background-color: #ffffff;
    padding: 50px 20px 20px 20px;
    text-align: center;
}
.cnr-intro-sub {
    font-size: 1.05rem;
    color: var(--blue-custom-lighter);
    font-weight: 300;
    line-height: 1.6;
}

/* =========================================================
   05. MENU MOBILNE / OFFCANVAS
   ========================================================= */

.cnr-offcanvas-menu {
    position: fixed;
    top: 0;
    right: 0;
    width: 340px;
    height: 100vh;
    background-color: var(--blue-custom);
    z-index: 2000;
    transition:
        transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.4s ease;
    transform: translateX(100%);
    display: flex;
    flex-direction: column;
    padding: 0px;
    box-shadow: -5px 0 25px rgba(0, 0, 0, 0);
}
.cnr-offcanvas-menu.active {
    right: 0;
    transform: translateX(0);
    box-shadow: -5px 0 25px rgba(0, 0, 0, 0.35);
}
.cnr-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    padding: 16px 24px;
}
.cnr-menu-header h3 {
    color: #ffffff;
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
}
.cnr-menu-close {
    background: none;
    border: none;
    color: #ffffff;
    font-size: 2rem;
    cursor: pointer;
    line-height: 1;
    opacity: 0.6;
}
.cnr-menu-close:hover {
    opacity: 1;
}
.cnr-menu-body {
    display: flex;
    flex-direction: column;
    gap: 30px;
    height: 100%;
    padding: 16px 24px;
}
.cnr-menu-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.cnr-main-link {
    font-size: 1.4rem;
    font-weight: 700;
    color: #ffffff;
    text-decoration: none;
}
.cnr-main-link:hover {
    color: var(--orange);
}
.cnr-pills-container {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.cnr-pill {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--blue-light);
    background-color: rgba(255, 255, 255, 0.05);
    padding: 6px 14px;
    border-radius: 20px;
    text-decoration: none;
    border: 1px solid rgba(255, 255, 255, 0.03);
}
.cnr-pill:hover {
    color: #ffffff;
    background-color: var(--orange);
    border-color: var(--orange);
}
.cnr-login-btn {
    display: block;
    width: 100%;
    text-align: center;
    padding: 12px;
    background-color: transparent;
    border: 1px solid var(--orange);
    color: var(--orange);
    font-weight: 600;
    text-decoration: none;
    border-radius: 4px;
}
.cnr-login-btn:hover {
    background-color: var(--orange);
    color: #ffffff;
}
.cnr-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1500;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
.cnr-menu-overlay.active {
    opacity: 1;
    pointer-events: auto;
}
.cnr-grid-stream {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 35px;
    max-width: 1200px;
    margin: 0 auto 60px auto;
    padding: 0 20px;
    background-color: #ffffff;
    width: 100%;
    box-sizing: border-box;
}
.cnr-post-card {
    display: flex;
    width: 100%;
    box-sizing: border-box;
}
.cnr-entry {
    background: var(--bg-entry);
    border: 1px solid var(--border-entry);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    width: 100%;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
    position: relative;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.01);
}
.cnr-entry:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(211, 224, 233, 0.4);
}
.cnr-entry-media {
    width: 100%;
    height: 200px;
    overflow: hidden;
    position: relative;
}
.cnr-entry-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}
.cnr-entry:hover .cnr-entry-media img {
    transform: scale(1.04);
}
.cnr-entry-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.cnr-entry-meta {
    font-size: 0.82rem;
    color: var(--blue-custom-lighter);
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.cnr-badge {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 4px 8px 2px;
    border-radius: 4px;
    display: inline-block;
    line-height: 1;
}
.cnr-badge-trasa {
    background-color: #54a4de;
    color: #ffffff;
}
.cnr-badge-article{
    background-color: #f1f1f1;
    color: #153752;
}
.cnr-badge-blog {
    background-color: var(--orange);
    color: #ffffff;
}
.cnr-is-blog .cnr-content-type {
    color: var(--orange);
}
.cnr-grid-stream .cnr-post-card:not(.cnr-is-blog) .cnr-content-type {
    color: #54a4de;
}
.cnr-meta-divider {
    color: var(--border-entry);
    font-size: 0.9rem;
}
.cnr-author {
    color: var(--link-color);
    text-decoration: none;
    font-weight: 600;
}
.cnr-author:hover {
    color: var(--orange);
}
.cnr-date {
    color: var(--blue-custom-lighter);
    font-weight: 400;
}
.cnr-entry-title {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 12px;
}
.cnr-entry-title a {
    color: var(--link-color);
    text-decoration: none;
}
.cnr-entry-title a:hover {
    color: var(--orange);
}
.cnr-entry-excerpt {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--blue-custom-lighter);
    margin-bottom: 24px;
}
.cnr-entry-footer {
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid var(--bg-tag);
}
.cnr-read-more {
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--link-color);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.cnr-read-more:hover {
    color: var(--orange);
}
.sponsored .cnr-badge-article {
    background-color: #636363;
    color: #cdcdcd;
    font-size: 0;
    padding: 3px 8px;
    display: inline-block;
}
.sponsored .cnr-badge-article::after {
    content: "Art. sponsorowany";
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1;
}
.cnr-entry.sponsored {
    border: 1px solid #e2e8f0;
    background-color: #fcfdfe;
}
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1),
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2),
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) {
    grid-column: span 3;
}
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry {
    flex-direction: row;
    min-height: 380px;
    height: 380px;
}
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-media,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry-media,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry-media {
    width: 60%;
    height: 100%;
}
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-content,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry-content,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry-content {
    width: 40%;
    display: flex;
    flex-direction: column;
    padding: 35px 30px;
    justify-content: center;
}
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-title,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry-title,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry-title {
    font-size: 1.65rem;
    margin-bottom: 14px;
    line-height: 1.3;
}
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-excerpt,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry-excerpt,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry-excerpt {
    font-size: 0.98rem;
    line-height: 1.6;
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-footer,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry-footer,
.cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry-footer {
    margin-top: auto;
    padding-top: 15px;
    border-top: 1px solid var(--bg-tag);
    width: 100%;
}
@media (max-width: 850px) {
    .cnr-grid-stream {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }
    .cnr-grid-stream .cnr-post-card {
        grid-column: span 1;
    }
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1),
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2),
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) {
        grid-column: span 2;
    }
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry {
        flex-direction: column;
        height: auto;

    }
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-media,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry-media,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry-media {
        width: 100%;
        height: 220px;
    }
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-content,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+2) .cnr-entry-content,
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+3) .cnr-entry-content {
        width: 100%;
        padding: 24px;
    }
}

.cnr-footer {
    width: 100%;
    background-color: var(--blue-custom);
    padding: 60px 20px 30px 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.03);
    font-family: inherit;
}
.cnr-footer-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.cnr-footer-grid {
    display: grid;
    grid-template-columns: 2fr 1.5fr 1fr;
    gap: 40px;
}
.cnr-f-col {
    display: flex;
    flex-direction: column;
}
.cnr-footer-logo {
    font-size: 1.4em;
    font-weight: 800;
    color: #ffffff;
    letter-spacing: -0.5px;
    margin-bottom: 12px;
}
.cnr-footer-logo span {
    color: var(--orange);
}
.cnr-f-about {
    font-size: 0.95rem;
    font-weight: 300;
    line-height: 1.6;
    color: var(--blue-light);
    margin-bottom: 20px;
    max-width: 380px;
}
.cnr-f-about .cnr-f-highlight {
    color: var(--orange);
    font-weight: 500;
    letter-spacing: 0.5px;
}
.cnr-f-title {
    color: #ffffff;
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 16px;
}
.cnr-f-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 0.9rem;
    color: var(--blue-light);
}
.cnr-f-links a {
    color: var(--blue-mid);
    text-decoration: none;
}
.cnr-f-links a:hover {
    color: var(--orange);
}
.cnr-footer-socials {
    display: flex;
    gap: 24px;
    margin-top: 15px;
}
.cnr-social-link-clean {
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--blue-light);
    text-decoration: none;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    transition:
        color 0.25s ease,
        border-color 0.25s ease;
    display: inline-block;
}
.cnr-social-link-clean:hover {
    color: var(--orange);
    border-color: var(--orange);
}
.cnr-footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    padding-top: 20px;
    text-align: center;
}
.cnr-footer-bottom p {
    font-size: 0.8rem;
    color: var(--blue-custom-lighter);
}
#cnr-cookies-alert {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    z-index: 99999;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
#cnr-cookies-alert .cnr-cookie-banner,
#cnr-cookies-alert .alert.alert-block {
    width: 100%;
    box-sizing: border-box;
    background-color: #f1f1f1;
    border: none;
    border-top: 1px solid var(--border-entry);
    box-shadow: 0 -8px 30px rgba(0, 0, 0, 0.08);
    padding: 16px 20px;
    margin: 0;
    border-radius: 0;
}
#cnr-cookies-alert .cnr-cookie-container,
#cnr-cookies-alert .alert.alert-block {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 40px;
}
#cnr-cookies-alert .alert.alert-block p,
#cnr-cookies-alert .cnr-cookie-text {
    font-size: 0.85rem;
    color: var(--blue-custom-lighter);
    line-height: 1.5;
    margin: 0;
    text-align: left;
    flex-grow: 1;
}
#cnr-cookies-alert .alert.alert-block p a,
#cnr-cookies-alert .cnr-cookie-text a {
    color: var(--orange);
    text-decoration: underline;
    font-weight: 600;
}
#cnr-cookies-alert button.cnr-cookie-btn,
#cnr-cookies-alert .alert.alert-block button.close {
    float: none;
    opacity: 1;
    text-shadow: none;
    background-color: #191919;
    color: #ffffff;
    border: none;
    padding: 12px 28px;
    font-size: 0.85rem;
    font-weight: 600;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}
#cnr-cookies-alert button.cnr-cookie-btn:hover,
#cnr-cookies-alert .alert.alert-block button.close:hover {
    background-color: var(--orange);
    color: #ffffff;
}
@media (max-width: 768px) {
    #cnr-cookies-alert .alert.alert-block {
        flex-direction: column;
        text-align: center;
        gap: 16px;
        padding: 20px 15px;
    }
    #cnr-cookies-alert .alert.alert-block p,
    #cnr-cookies-alert .cnr-cookie-text {
        text-align: center;
    }
    #cnr-cookies-alert button.cnr-cookie-btn,
    #cnr-cookies-alert .alert.alert-block button.close {
        width: 100%;
    }
    .cookie-banner, #cookie-notice, .cookies-wrapper {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box; /* Wlicza padding do szerokości */
        padding: 15px;
        background: #fff;       /* Upewnij się, że ma tło */
        z-index: 999999;        /* Musi być na samej górze strony */
        box-shadow: 0 -2px 10px rgba(0,0,0,0.15);
    }

    /* Układ przycisków w cookies na telefonie - też pionowo, by łatwiej było klikać */
    .cookie-banner .buttons-wrapper, .cookie-buttons {
        display: flex;
        flex-direction: column;
        gap: 10px;
        width: 100%;
        margin-top: 10px;
    }

    .cookie-banner button, .cookie-btn {
        width: 100% !important; /* Przyciski na całą szerokość ekranu */
        padding: 12px;          /* Większy obszar kliknięcia (wygoda na dotyk) */
    }
}

#map_global.cnr-wide-route-map-section {
    position: relative;
    width: 100%;
    height: 440px;
    background-color: var(--gray-custom);
    border-bottom: 1px solid var(--border-entry);
    margin-bottom: 0px;
    overflow: hidden;
}
#map_global .map-box,
#map_global #globalMapContent {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
}
#globalMapContent {
    z-index: 1;
}
.cnr-wide-route-map-section {
    position: relative;
    width: 100%;
    height: 440px;
    background-color: var(--gray-custom);
    border-bottom: 1px solid var(--border-entry);
    margin-bottom: 30px;
}
#track-map {
    width: 100%;
    height: 100%;
    display: block;
}
.cnr-mapy-logo {
    position: absolute;
    top: 12px;
    right: 52px;
    z-index: 500;
    display: none;
    line-height: 0;
}
.cnr-mapy-logo img {
    display: block;
    width: auto;
    height: 32px;
}
.track-mapy-attribution {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 5;
    display: none;
    align-items: center;
    gap: 8px;
    padding: 4px 6px;
    background: rgba(255, 255, 255, 0.9);
    font-size: 11px;
    line-height: 1;
}
.track-mapy-attribution img {
    display: block;
    width: auto;
    height: 32px;
}
.cnr-route-elevation-overlay.cnr-hidden {
    display: none;
    opacity: 0;
    pointer-events: none;
}
.cnr-fade-in {
    display: block;
    animation: cnrSlideUpFade 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}
@keyframes cnrSlideUpFade {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
.cnr-map-loader {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--gray-custom);
    z-index: 2000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 14px;
    color: var(--blue-custom-lighter);
    font-size: 0.9rem;
    font-weight: 500;
}
.cnr-spinner {
    width: 28px;
    height: 28px;
    border: 2px solid rgba(0, 0, 0, 0.05);
    border-top: 2px solid var(--orange);
    border-radius: 50%;
    animation: cnrSpin 0.7s linear infinite;
}
@keyframes cnrSpin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
#elevation-chart,
.cnr-wide-route-map-section .cnr-route-elevation-overlay {
    position: absolute;
    bottom: 5px;
    left: 5px;
    width: 325px;
    height: 125px;
    z-index: 1000;
    background: #f8fafc;
    background-color: #f8fafc8c;
    border: 1px solid var(--border-entry);
    border-radius: 6px;
    padding: 0;
    box-sizing: border-box;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}
#elevation-chart .elevation-control,
#elevation-chart .elevation,
#elevation-chart .lightblue-theme {
    background: transparent;
    background-color: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
}
#elevation-chart svg.background {
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    top: 0;
    left: 0;
    background: transparent;
    background-color: transparent;
}
#elevation-chart svg .axis,
#elevation-chart svg .tick,
#elevation-chart svg text {
    display: block;
    opacity: 0.9;
    font-size: 10px;
    font-family: inherit;
    fill: var(--link-color);
}
#elevation-chart svg .grid {
    display: none;
}
#elevation-chart svg .area {
    fill: #54a4de;
    fill-opacity: 0.28;
}
#elevation-chart svg .line {
    stroke: #54a4de;
    stroke-width: 2.5px;
}
.view-trasa-container {
    max-width: 1200px;
    margin: 0 auto 60px auto;
    padding: 0 20px;
    display: flex;
    gap: 40px;
    box-sizing: border-box;
}

/* =========================================================
   07. TRASA / ROUTE
   ========================================================= */

.cnr-route-main {
    width: 68%;
    display: flex;
    flex-direction: column;
}
.cnr-route-title {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--link-color);
    margin-bottom: 8px;
    line-height: 1.25;
}
.cnr-route-author-line {
    font-size: 0.9rem;
    color: var(--blue-custom-lighter);
    margin-bottom: 30px;
}
.cnr-author-link {
    color: var(--orange);
    text-decoration: none;
    font-weight: 600;
}
.cnr-date-divider {
    color: var(--border-entry);
    margin: 0 6px;
}
.cnr-route-story {
    font-size: 1.05rem;
    line-height: 1.75;
    color: #444444;
}
.cnr-route-story p {
    margin-bottom: 24px;
}
.cnr-route-story q.cite {
    display: inline;
    color: var(--link-color);
    font-style: italic;
    font-weight: 500;
    quotes: "\201C" "\201D";
}
.cnr-route-story q.cite::before {
    content: open-quote;
}
.cnr-route-story q.cite::after {
    content: close-quote;
}
.cnr-route-story blockquote {
    margin: 24px 0;
    padding: 16px 20px;
    border-left: 4px solid var(--orange);
    border-radius: 0 6px 6px 0;
    background-color: var(--blue-lighter);
    color: var(--link-color);
    font-size: 1.05em;
    font-style: italic;
}
.cnr-route-story a[href^="http"]:not([href*="czasnarower"]) {
    color: #a84d00;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px dotted currentColor;
}
.cnr-route-story a[href^="http"]:not([href*="czasnarower"])::after {
    content: " \2197";
    display: inline-block;
    font-size: 0.78em;
    font-style: normal;
    vertical-align: super;
}
.cnr-route-story a[href^="http"]:not([href*="czasnarower"]):hover {
    color: var(--orange);
    border-bottom-style: solid;
}
.cnr-route-story figure.photo,
.cnr-route-story .photo.mid-text,
.cnr-route-story figure:has(.view_photo) {
    display: block;
    width: 900px;
    max-width: 100%;
    margin: 25px auto;
    padding: 0;
    box-sizing: border-box;
}
.cnr-route-story figure img,
.cnr-route-story .view_photo,
.cnr-route-story img.view_photo {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 100%;
    height: auto;
    object-fit: cover;
    margin: 0 auto;
    border-radius: 6px 6px 0 0;
    box-sizing: border-box;
}
.cnr-route-story figcaption.description,
.cnr-route-story .photo.mid-text .description {
    display: block;
    width: 100%;
    box-sizing: border-box;
    background-color: #f8fafc;
    border: 1px solid var(--border-entry);
    border-top: none;
    border-radius: 0 0 6px 6px;
    padding: 12px 18px;
    margin: 0;
    font-size: 0.86rem;
    line-height: 1.5;
    color: var(--blue-custom-lighter);
    font-weight: 400;
    text-align: left;
}
@media (max-width: 940px) {
    .cnr-route-story figure.photo,
    .cnr-route-story .photo.mid-text,
    .cnr-route-story figure:has(.view_photo) {
        width: 100%;
    }
}
.cnr-route-tags {
    margin-top: 45px;
    padding-top: 24px;
    border-top: 1px solid var(--border-entry);
    width: 100%;
    box-sizing: border-box;
}
.cnr-tags-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.cnr-tag-pill, .cnr-active-tag-pill {
    display: inline-flex;
    align-items: center;
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--blue-custom-lighter);
    text-decoration: none;
    background-color: var(--bg-tag);
    padding: 6px 14px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.02);
    line-height: 1;
    transition: all 0.2s ease;
}
.cnr-tag-pill::before, .cnr-active-tag-pill::before {
    content: "#";
    color: var(--blue-light);
    margin-right: 4px;
    font-weight: 700;
    transition: color 0.2s ease;
}
.cnr-active-tag-pill,
.cnr-tag-pill:hover {
    background-color: var(--orange);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.15);
    border-color: var(--orange);
}
.cnr-tag-pill:hover::before {
    color: rgba(255, 255, 255, 0.8);
}
.cnr-route-sidebar {
    width: 32%;
    position: sticky;
    top: 30px;
    height: fit-content;
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.cnr-route-card {
    background-color: var(--blue-lighter);
    border: 1px solid var(--border-entry);
    border-radius: 8px;
    padding: 24px;
}
.cnr-route-card h3 {
    font-size: 1.05rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--link-color);
    margin-bottom: 20px;
    border-bottom: 1px solid var(--border-entry);
    padding-bottom: 10px;
}
.cnr-route-meta-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.cnr-route-meta-list li {
    display: flex;
    justify-content: space-between;
    font-size: 0.95rem;
    color: var(--blue-custom-lighter);
}
.cnr-route-meta-list li strong {
    color: var(--link-color);
    font-weight: 700;
}
.cnr-gpx-btn-container {
    width: 100%;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px dashed var(--border-entry);
    display: flex;
    justify-content: center;
}
.cnr-gpx-btn-pill {
    display: inline-flex;
    align-items: center;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--blue-custom-lighter);
    text-decoration: none;
    background-color: #f1f1f1;
    padding: 8px 20px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    line-height: 1;
    cursor: pointer;
    box-shadow: none;
}
.cnr-gpx-btn-pill:hover {
    background-color: var(--orange);
    color: #ffffff;
    border-color: var(--orange);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.15);
}
@media (max-width: 992px) {
    .view-trasa-container {
        flex-direction: column;
        gap: 30px;
        margin: 20px auto;
    }
    .cnr-route-main,
    .cnr-route-sidebar {
        width: 100%;
    }
    .cnr-route-sidebar {
        position: static;
    }
    .cnr-wide-route-map-section {
        height: 350px;
    }
    .cnr-wide-route-map-section .cnr-route-elevation-overlay {
        position: relative;
        bottom: auto;
        left: auto;
        width: 100%;
        height: 120px;
        background: var(--blue-lighter);
        margin-top: 10px;
        border-radius: 0;
        border: none;
        border-bottom: 1px solid var(--border-entry);
    }
}

/* =========================================================
   08. GALERIA TRASY
   ========================================================= */

.cnr-route-gallery-section {
    width: 100%;
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px dashed var(--border-entry);
    box-sizing: border-box;
}
.cnr-route-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.cnr-gallery-item {
    background: #ffffff;
    border: 1px solid var(--border-entry);
    border-radius: 6px;
    overflow: hidden;
    aspect-ratio: 1 / 1;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}
.cnr-gallery-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(211, 224, 233, 0.5);
}
.cnr-gallery-link {
    display: block;
    width: 100%;
    height: 100%;
    cursor: zoom-in;
}
.cnr-gallery-media {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.cnr-gallery-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.cnr-gallery-item:hover .cnr-gallery-media img {
    transform: scale(1.04);
}
@media (max-width: 768px) {
    .cnr-route-gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}
.cnr-related-section {
    width: 100%;
    max-width: none;
    margin: 60px 0 0 0;
    padding: 40px 0 0 0;
    border-top: 1px dashed var(--border-entry);
    box-sizing: border-box;
    clear: both;
}
.cnr-related-heading {
    font-size: 1.4rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--link-color);
    margin-bottom: 30px;
}
.cnr-related-grid-clean {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    padding: 0;
    margin-bottom: 20px;
}
.cnr-related-grid-clean .cnr-entry-meta {
    font-size: 0.82rem;
    color: var(--blue-custom-lighter);
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.cnr-related-grid-clean .cnr-entry-title {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.4;
    margin-bottom: 12px;
    min-height: 3.5rem;
}
.cnr-related-grid-clean .cnr-entry-excerpt {
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--blue-custom-lighter);
    margin-bottom: 20px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.cnr-related-grid-clean .cnr-content-type {
    display: none;
}
.cnr-related-section .cnr-race-header-block {
    display: flex;
    padding: 20px 20px 0 20px;
    gap: 14px;
    box-sizing: border-box;
    width: 100%;
}

/* 2. BLOK KALENDARZA: Zamykamy datę w elegancką, ciemną kostkę z zaokrągleniem */
.cnr-related-section .cnr-race-date-badge {
    flex: 0 0 54px;
    height: 56px;
    background-color: var(--link-color);
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.04);
    box-sizing: border-box;
}

.cnr-related-section .cnr-race-day {
    font-size: 1.3rem;
    font-weight: 800;
    color: #ffffff;
    line-height: 1;
}

.cnr-related-section .cnr-race-month {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--orange);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 1px;
    line-height: 1;
}
.cnr-related-section .cnr-race-year {
    font-size: 0.55rem;
    font-weight: 700;
    color: var(--blue-light);
    letter-spacing: 0.5px;
    margin-top: 3px;
    line-height: 1;
}

.cnr-related-section .cnr-badge-start-place {
    background-color: #f1f1f1;
    color: var(--link-color);
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.02);
}

.cnr-related-section .cnr-entry-content.cnr-race-content-fix {
    padding: 12px 20px 20px 20px;
    margin-top: 0;
}

.cnr-related-section .cnr-race-tech-details {
    margin-bottom: 14px;
}
.cnr-related-section .cnr-race-tech-item {
    font-size: 0.84rem;
    color: var(--blue-custom-lighter);
}

.cnr-related-section .cnr-race-label {
    display: none;
}
.cnr-related-section .cnr-race-val {
    text-align: left;
    max-width: 100%;
    font-weight: 600;
    color: var(--blue-custom-lighter);
}


.cnr-related-section .cnr-entry.cnr-race-card {
    display: flex;
    flex-direction: column;
    padding-bottom: 16px;
    min-height: auto;
    box-sizing: border-box;
}

.cnr-related-section .cnr-race-title-meta-zone {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    flex-grow: 1;
    min-width: 0;
}
.cnr-race-title-meta-zone .cnr-entry-title {
    min-height: auto;
    margin-top: -5px;
}
.cnr-related-section .cnr-race-row-tech-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 3px 8px;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 4px;
    color: #ffffff;
    line-height: 1;

    white-space: nowrap;
    min-width: auto;
    text-align: center;
}


.cnr-related-section .cnr-entry-meta .cnr-meta-divider {
    color: #cbd5e1;
    font-size: 0.85rem;
    align-self: center;
}

.cnr-related-section .cnr-cat-1 .cnr-race-row-tech-badge { background-color: #6dbcf4; }
.cnr-related-section .cnr-cat-2 .cnr-race-row-tech-badge { background-color: #fd8d08; }
.cnr-related-section .cnr-cat-3 .cnr-race-row-tech-badge { background-color: #c89bff; }
.cnr-related-section .cnr-cat-4 .cnr-race-row-tech-badge { background-color: #febcb6; color: #1e293b; }
.cnr-related-section .cnr-cat-5 .cnr-race-row-tech-badge { background-color: #ff4b4b; }
.cnr-related-section .cnr-cat-6 .cnr-race-row-tech-badge { background-color: #2655be; }
.cnr-related-section .cnr-cat-7 .cnr-race-row-tech-badge { background-color: #70f547; color: #1e293b; }
.cnr-related-section .cnr-cat-8 .cnr-race-row-tech-badge { background-color: #ffed5c; color: #1e293b; }
.cnr-related-section .cnr-cat-9 .cnr-race-row-tech-badge { background-color: #cdcdcd; color: #1e293b; }
.cnr-related-section .cnr-cat-10 .cnr-race-row-tech-badge { background-color: #3d9f1f; }
.cnr-related-section .cnr-cat-11 .cnr-race-row-tech-badge { background-color: #262222; }
.cnr-related-section .cnr-cat-12 .cnr-race-row-tech-badge { background-color: #ababab; }
.cnr-related-section .cnr-cat-13 .cnr-race-row-tech-badge { background-color: #cc7815; }
.cnr-related-section .cnr-cat-14 .cnr-race-row-tech-badge { background-color: #ddbb44; color: #1e293b; }

@media (max-width: 480px) {
    .cnr-related-section .cnr-entry-meta {
        flex-wrap: wrap;
        gap: 6px;
    }
}

@media (max-width: 768px) {
    .cnr-related-section .cnr-race-header-block {
        padding: 16px 16px 0 16px;
    }
    .cnr-related-section .cnr-entry-content.cnr-race-content-fix {
        padding: 12px 16px 16px 16px;
    }
    .cnr-related-grid-clean {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}

/* =========================================================
   09. PROFIL / BLOG AUTORA
   ========================================================= */

.cnr-blog-user-container {
    width: 100%;
    background-color: #ffffff;
    margin: 0 auto;
    box-sizing: border-box;
}
.cnr-blog-user-header {
    width: 100%;
    max-width: 1200px;
    margin: 40px auto 20px auto;
    padding: 0 20px;
    box-sizing: border-box;
    border-bottom: 1px solid var(--border-entry);
    padding-bottom: 30px;
}
.cnr-blog-user-title {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--link-color);
    margin: 10px 0 12px 0;
    line-height: 1.2;
}
.cnr-blog-user-title span {
    color: var(--orange);
}
.cnr-blog-user-sub {
    font-size: 1.1rem;
    color: var(--blue-custom-lighter);
    font-weight: 300;
    line-height: 1.5;
    margin: 0;
    max-width: 800px;
}
.cnr-blog-user-feed .cnr-entry::before {
    display: none;
    content: none;
}
.cnr-dynamic-category {
    position: absolute;
    top: 15px;
    left: 15px;
    background-color: #ffffff;
    color: var(--link-color);
    padding: 6px 14px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-radius: 4px;
    z-index: 50;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.02);
}
.cnr-explore-channels {
    width: 100%;
    background-color: #ffffff;
    padding: 60px 0;
    margin-top: 20px;
    box-sizing: border-box;
    border-top: 1px solid var(--border-entry);
}
.cnr-explore-intro {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 40px auto;
    padding: 0 20px;
}
.cnr-explore-heading {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--link-color);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin: 0 0 10px 0;
}
.cnr-explore-sub-heading {
    font-size: 1.05rem;
    color: var(--blue-custom-lighter);
    font-weight: 300;
    line-height: 1.5;
    margin: 0;
}
.cnr-explore-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}
.cnr-explore-card {
    background: #f1f1f1;
    border: 1px solid var(--border-entry);
    border-radius: 8px;
    overflow: hidden;
    transition:
        transform 0.3s cubic-bezier(0.16, 1, 0.3, 1),
        box-shadow 0.3s ease,
        background-color 0.3s ease;
}
.cnr-explore-card:hover {
    transform: translateY(-4px);
    background-color: var(--blue-custom-light);
    box-shadow: 0 10px 25px rgba(211, 224, 233, 0.5);
}
.cnr-explore-link {
    text-decoration: none;
    display: block;
    height: 100%;
}
.cnr-explore-content {
    padding: 30px;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-sizing: border-box;
}
.cnr-explore-tag {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--orange);
    margin-bottom: 12px;
}
.cnr-explore-content h3 {
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--link-color);
    margin: 0 0 10px 0;
    line-height: 1.3;
}
.cnr-explore-content p {
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--blue-custom-lighter);
    margin: 0 0 24px 0;
}
.cnr-explore-btn-text {
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--link-color);
    margin-top: auto;
    transition:
        color 0.2s ease,
        transform 0.2s ease;
}
.cnr-explore-card:hover .cnr-explore-btn-text {
    color: var(--orange);
}
.cnr-explore-content .cnr-badge {
    margin-bottom: 16px;
    align-self: flex-start;
}
.cnr-badge-wyscig {
    background-color: #153752;
    color: #ffffff;
}
@media (max-width: 992px) {
    .cnr-explore-container {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 768px) {
    .cnr-explore-channels {
        padding: 40px 0;
    }
    .cnr-explore-intro {
        margin-bottom: 30px;
    }
    .cnr-explore-heading {
        font-size: 1.4rem;
    }
    .cnr-explore-sub-heading {
        font-size: 0.95rem;
    }
    .cnr-explore-container {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .cnr-explore-content {
        padding: 24px;
    }
}

/* =========================================================
   10. ARCHIWUM TRAS I FILTRY
   ========================================================= */

.cnr-routes-archive-container {
    width: 100%;
    background-color: #ffffff;
    margin: 0 auto;
    padding-top: 40px;
    box-sizing: border-box;
}
.cnr-archive-header {
    width: 100%;
    background-color: #ffffff;
    border-bottom: 1px solid var(--border-entry);
    padding: 40px 0 35px 0;
    margin-bottom: 40px;
}
.cnr-archive-header-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}
.cnr-archive-header-title-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 16px;
    margin: 10px 0 12px 0;
}
.cnr-archive-header-title-flex .cnr-archive-title {
    margin: 0;
}

.cnr-country-switcher select {
    display: inline-flex;
    align-items: center;
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--blue-custom-lighter);
    background-color: #f1f1f1;
    border: 1px solid rgba(0, 0, 0, 0.02);
    border-radius: 4px;
    padding: 8px 30px 8px 14px;
    cursor: pointer;
    line-height: 1;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://w3.org' width='10' height='6' viewBox='0 0 10 6'><path fill='%237a91a1' d='M0 0h10L5 6z'/></svg>");
    background-repeat: no-repeat;
    background-position: right 12px center;
}
.cnr-country-switcher select:hover {
    background-color: #e2e8f0;
    color: var(--link-color);
}
@media (max-width: 768px) {
    .cnr-archive-header-title-flex {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    .cnr-country-switcher {
        width: 100%;
    }
    .cnr-country-switcher select {
        width: 100%;
    }
}

.cnr-inline-season-dropdown,
.cnr-inline-country-dropdown {
    display: inline-flex;
    position: relative;
    vertical-align: middle;
    margin-left: 0px;
}
.cnr-calendar-title, .cnr-tracks-title {
    position: relative;
}
.cnr-switcher-trigger.js-season-toggle ,
.cnr-switcher-trigger.js-country-toggle {
    font-size: 0.78rem;
    font-weight: normal;
    color: var(--blue-custom-lighter);
    text-transform: lowercase;
    background-color: transparent;
    padding: 4px 10px;
    border-radius: 5px;
    border: 1px solid transparent;
    cursor: pointer;
    line-height: 1.2;
    margin-top: -10px;
    margin-left: -10px;
    transition: all 0.2s ease;
    position: absolute;
    white-space: nowrap;
}
.cnr-switcher-trigger.js-country-toggle {
    margin-left: 0;
}
.cnr-switcher-trigger.js-season-toggle:hover,
.cnr-switcher-trigger.js-season-toggle.js-active,
.cnr-switcher-trigger.js-country-toggle:hover,
.cnr-switcher-trigger.js-country-toggle.js-active {
    background-color: var(--blue-custom-light);
    color: var(--orange);
    border-color: rgba(255, 118, 0, 0.15);
}

.cnr-season-dropdown-menu,
.cnr-country-dropdown-menu {
    display: none; /* Domyślnie schowane, slideToggle przejmie kontrolę */
    position: absolute;
    top: calc(100% - 25px);
    left: -80px;
    width: 140px; /* Sztywna, zwięzła szerokość menu */
    background-color: #ffffff;
    border: 1px solid var(--border-entry);
    border-radius: 6px;
    box-shadow: 0 10px 25px rgba(15, 23, 42, 0.08),
                0 2px 5px rgba(15, 23, 42, 0.03);
    z-index: 1000;
    overflow: hidden;
}
.cnr-country-dropdown-menu {
    left: 0;
    top: calc(100% - 10px);
}
.cnr-season-menu-scroll-box,
.cnr-country-menu-scroll-box {
    max-height: 240px;
    overflow-y: auto;
    padding: 4px 0;
}

.cnr-season-menu-item,
.cnr-country-menu-item {
    display: block;
    padding: 8px 14px;
    font-size: 0.84rem;
    font-weight: 600;
    color: #475569;
    text-decoration: none;
    transition: all 0.15s ease;
    text-align: left;
}

.cnr-season-menu-item:hover,
.cnr-country-menu-item:hover {
    background-color: var(--blue-custom-light);
    color: var(--orange);
}

.cnr-season-menu-item.cnr-active-item,
.cnr-country-menu-item.cnr-active-item {
    background-color: var(--orange);
    color: #fff;
    font-weight: 700;
    cursor: default;
}

.cnr-archive-title {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--link-color);
    margin: 10px 0 12px 0;
    line-height: 1.2;
}
.cnr-archive-title span {
    color: var(--orange);
}
.cnr-archive-sub {
    font-size: 1.05rem;
    color: var(--blue-custom-lighter);
    font-weight: 300;
    line-height: 1.6;
    margin: 0 0 30px 0;
    max-width: 850px;
    margin-top: 4px;
    margin-bottom: 12px;
}
.cnr-geo-pill {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--link-color);
    text-decoration: none;
    background-color: var(--blue-custom-light);
    display: inline-flex;
    align-items: center;
    padding: 0;
    border-radius: 6px;
    border: 1px solid rgba(0, 0, 0, 0.03);
    transition: all 0.2s ease;
    line-height: 1;
}
.cnr-geo-count {
    font-size: 0.8rem;
    color: var(--blue-custom-lighter);
    font-weight: 400;
    margin-left: 4px;
    transition: color 0.2s ease;
}
.cnr-geo-pill:hover {
    background-color: var(--orange);
    color: #ffffff;
    border-color: var(--orange);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.15);
}
.cnr-geo-pill:hover .cnr-geo-count {
    color: rgba(255, 255, 255, 0.8);
}
.cnr-archive-main-feed {
    max-width: 1200px;
    margin: 0 auto 60px auto;
    padding: 0 20px;
    box-sizing: border-box;
}
.cnr-archive-feed-intro {
    margin-bottom: 24px;
}
.cnr-feed-heading {
    font-size: 1.4rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--link-color);
    margin: 0;
}
.cnr-archive-filters-wrapper {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 5px;
    margin-bottom: 15px;
    width: 100%;
}
.cnr-subregions-row,
.cnr-category-filter-row,
.cnr-type-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.cnr-subregions-row .cnr-pill-subregion {
    background-color: #f1f1f1;
    border: 1px solid rgba(0, 0, 0, 0.01);
    border-radius: 6px;
}
.cnr-subregions-row .cnr-pill-subregion a {
    color: var(--blue-custom-lighter);
    font-weight: 500;
    padding: 8px 14px;
}
a.cnr-geo-pill-type {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--link-color);
    text-decoration: none;
    background-color: #ffffff;
    border: 1px solid var(--border-entry);
    border-radius: 4px;
    transition: all 0.2s ease;
    line-height: 1;
}
a.cnr-geo-pill-type .cnr-geo-count,
.cnr-subregions-row .cnr-geo-count {
    font-size: 0.8rem;
    font-weight: 400;
    color: var(--blue-custom-lighter);
    margin-left: 4px;
}
.cnr-subregions-row .cnr-pill-subregion.cnr-active-pill,
a.cnr-geo-pill-type.cnr-active-pill {
    background-color: var(--orange);
    border-color: var(--orange);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.12);
}
.cnr-subregions-row .cnr-pill-subregion.cnr-active-pill a,
a.cnr-geo-pill-type.cnr-active-pill,
a.cnr-geo-pill-type.cnr-active-pill .cnr-geo-count {
    color: #ffffff;
}
.cnr-subregions-row .cnr-pill-subregion:not(.cnr-active-pill):hover,
a.cnr-geo-pill-type:not(.cnr-active-pill):hover {
    background-color: #e2e8f0;
    transform: translateY(-1px);
}
.cnr-geo-pill a {
    display: block;
    padding: 8px 16px;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--link-color);
    text-decoration: none;
}
.cnr-pill-country {
    background-color: var(--blue-custom-light);
}
.cnr-pill-region {
    background-color: #f1f1f1;
}
.cnr-pill-region a {
    color: var(--blue-custom-lighter);
    font-weight: 500;
}
.cnr-filter-horizontal-divider {
    width: 100%;
    height: 1px;
    background-color: var(--border-entry);
    margin: 2px 0;
}
.cnr-geo-pill.cnr-active-pill,
a.cnr-geo-pill-type.cnr-active-pill {
    background-color: var(--orange);
    border-color: var(--orange);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.12);
}
.cnr-geo-pill.cnr-active-pill a,
a.cnr-geo-pill-type.cnr-active-pill {
    color: #ffffff;
}
.cnr-geo-pill:not(.cnr-active-pill):hover,
a.cnr-geo-pill-type:not(.cnr-active-pill):hover {
    background-color: #e2e8f0;
    transform: translateY(-1px);
}
.cnr-geo-pill.hidden {
    display: none;
    opacity: 0;
}
.cnr-geo-filters {
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
    margin-top: 25px;
    margin-bottom: 30px;
    box-sizing: border-box;
}
.cnr-category-filter-row,
.cnr-type-filter-row {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 8px;
}
.cnr-category-filter-row,
.cnr-type-filter-row {
    margin-top: 5px;
}
.cnr-archive-filters-wrapper .cnr-geo-pill {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border-radius: 6px;
    transition: all 0.2s ease;
    box-sizing: border-box;
    line-height: 1;
}
.cnr-archive-filters-wrapper .cnr-geo-pill a {
    display: block;
    padding: 8px 14px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
}
.cnr-archive-filters-wrapper .cnr-active-pill {
    background-color: var(--orange);
    border-color: var(--orange);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.12);
}
.cnr-archive-filters-wrapper .cnr-active-pill a {
    color: #ffffff;
}
.cnr-geo-filters .hidden,
.cnr-archive-filters-wrapper .hidden {
    display: none;
    opacity: 0;
}
.cnr-type-filter-row a,
.cnr-type-filter-row .cnr-geo-pill-type {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--link-color);
    text-decoration: none;
    background-color: #ffffff;
    border: 1px solid var(--border-entry);
    border-radius: 6px;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    line-height: 1;
}
.cnr-category-filter-row a,
.cnr-category-filter-row .cnr-geo-pill-category {
    display: inline-flex;
    align-items: center;
    padding: 6px 12px;
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    border-radius: 4px;
    line-height: 1;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    border: 1px solid transparent;

    color: var(--link-color);
}

a.cnr-geo-pill-category .cnr-counter {
    font-size: 0.75rem;
    font-weight: 700;
    background-color: rgba(15, 23, 42, 0.05);
    color: var(--blue-custom-lighter);
    padding: 2px 6px;
    border-radius: 3px;
    margin-left: 8px;
    transition: all 0.2s ease;
}

a.cnr-filter-cat-1 { background-color: rgba(109, 188, 244, 0.10); }
a.cnr-filter-cat-1:hover { background-color: rgba(109, 188, 244, 0.22); }
a.cnr-filter-cat-1.cnr-active-pill { background-color: #6dbcf4; color: #ffffff; }

a.cnr-filter-cat-2 { background-color: rgba(253, 141, 8, 0.10); }
a.cnr-filter-cat-2:hover { background-color: rgba(253, 141, 8, 0.22); }
a.cnr-filter-cat-2.cnr-active-pill { background-color: #fd8d08; color: #ffffff; }

a.cnr-filter-cat-3 { background-color: rgba(200, 155, 255, 0.10); }
a.cnr-filter-cat-3:hover { background-color: rgba(200, 155, 255, 0.22); }
a.cnr-filter-cat-3.cnr-active-pill { background-color: #c89bff; color: #ffffff; }

a.cnr-filter-cat-4 { background-color: rgba(254, 188, 182, 0.15); }
a.cnr-filter-cat-4:hover { background-color: rgba(254, 188, 182, 0.28); }
a.cnr-filter-cat-4.cnr-active-pill { background-color: #febcb6; color: #1e293b; }

a.cnr-filter-cat-5 { background-color: rgba(255, 75, 75, 0.10); }
a.cnr-filter-cat-5:hover { background-color: rgba(255, 75, 75, 0.22); }
a.cnr-filter-cat-5.cnr-active-pill { background-color: #ff4b4b; color: #ffffff; }

a.cnr-filter-cat-6 { background-color: rgba(38, 85, 190, 0.10); }
a.cnr-filter-cat-6:hover { background-color: rgba(38, 85, 190, 0.22); }
a.cnr-filter-cat-6.cnr-active-pill { background-color: #2655be; color: #ffffff; }

a.cnr-filter-cat-7 { background-color: rgba(112, 245, 71, 0.12); }
a.cnr-filter-cat-7:hover { background-color: rgba(112, 245, 71, 0.25); }
a.cnr-filter-cat-7.cnr-active-pill { background-color: #70f547; color: #1e293b; }

a.cnr-filter-cat-8 { background-color: rgba(255, 237, 92, 0.15); }
a.cnr-filter-cat-8:hover { background-color: rgba(255, 237, 92, 0.30); }
a.cnr-filter-cat-8.cnr-active-pill { background-color: #ffed5c; color: #1e293b; }

a.cnr-filter-cat-9 { background-color: rgba(205, 205, 205, 0.10); }
a.cnr-filter-cat-9:hover { background-color: rgba(205, 205, 205, 0.22); }
a.cnr-filter-cat-9.cnr-active-pill { background-color: #cdcdcd; color: #1e293b; }

a.cnr-filter-cat-10 { background-color: rgba(61, 159, 31, 0.10); }
a.cnr-filter-cat-10:hover { background-color: rgba(61, 159, 31, 0.22); }
a.cnr-filter-cat-10.cnr-active-pill { background-color: #3d9f1f; color: #ffffff; }

a.cnr-filter-cat-11 { background-color: rgba(38, 34, 38, 0.08); }
a.cnr-filter-cat-11:hover { background-color: rgba(38, 34, 38, 0.18); }
a.cnr-filter-cat-11.cnr-active-pill { background-color: #262222; color: #ffffff; }

a.cnr-filter-cat-12 { background-color: rgba(171, 171, 171, 0.10); }
a.cnr-filter-cat-12:hover { background-color: rgba(171, 171, 171, 0.22); }
a.cnr-filter-cat-12.cnr-active-pill { background-color: #ababab; color: #ffffff; }

a.cnr-filter-cat-13 { background-color: rgba(204, 120, 21, 0.10); }
a.cnr-filter-cat-13:hover { background-color: rgba(204, 120, 21, 0.22); }
a.cnr-filter-cat-13.cnr-active-pill { background-color: #cc7815; color: #ffffff; }

a.cnr-filter-cat-14 { background-color: rgba(221, 187, 68, 0.10); }
a.cnr-filter-cat-14:hover { background-color: rgba(221, 187, 68, 0.22); }
a.cnr-filter-cat-14.cnr-active-pill { background-color: #ddbb44; color: #1e293b; }

a.cnr-geo-pill-category.cnr-active-pill {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
}

a.cnr-geo-pill-category.cnr-active-pill .cnr-counter {
    background-color: rgba(255, 255, 255, 0.25);
    color: #ffffff;
}

a.cnr-geo-pill-category.cnr-disabled {
    background-color: #fcfdfe;
    color: #cdcdcd;
    opacity: 0.4;
    box-shadow: none;
    pointer-events: none;
}
a.cnr-geo-pill-type.cnr-disabled .cnr-counter { background-color: #f5f5f5; color: #dddddd; }

.cnr-type-filter-row a.active,
.cnr-type-filter-row a.cnr-active-pill {
    background-color: var(--orange);
    border-color: var(--orange);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.12);
}
.cnr-type-filter-row a:not(.active):not(.cnr-active-pill):hover {
    background-color: #e2e8f0;
    color: var(--link-color);
    transform: translateY(-1px);
}
.cnr-archive-filters-wrapper,
.cnr-geo-filters {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 25px;
}
.cnr-geo-pill,
.cnr-geo-pill a,
a.cnr-geo-pill-type,
.cnr-track-region,
.cnr-track-country {
    outline: none;
    -webkit-tap-highlight-color: transparent;
}
a.cnr-geo-pill-type .cnr-counter {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--blue-custom-lighter);
    background-color: #f1f1f1;
    padding: 2px 6px;
    border-radius: 3px;
    margin-left: 8px;
    transition: all 0.2s ease;
}
a.cnr-geo-pill-type.cnr-active-pill {
    background-color: var(--orange);
    border-color: var(--orange);
    color: #ffffff;
}
a.cnr-geo-pill-type.cnr-active-pill .cnr-counter {
    background-color: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}
a.cnr-geo-pill-type:not(.cnr-active-pill):not(.cnr-disabled):hover {
    background-color: #e2e8f0;
    transform: translateY(-1px);
}
a.cnr-geo-pill-type.cnr-disabled {
    background-color: #fcfdfe;
    border-color: var(--bg-tag);
    color: #cdcdcd;
    cursor: not-allowed;
    pointer-events: none;
    opacity: 0.6;
}
.cnr-active-categories {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 0.85rem;
    color: var(--blue-custom-lighter);
}
.cnr-active-filter-badge {
    display: inline-flex;
    align-items: center;
    background-color: var(--blue-custom-light);
    border: 1px solid rgba(0, 0, 0, 0.02);
    border-radius: 4px;
    padding: 3px 8px;
    cursor: pointer;
    line-height: 1;
    transition: all 0.2s ease;
    margin-left: 4px;
}

.cnr-filter-close-x {
    font-size: 1.1rem;
    font-weight: 400;
    color: var(--blue-custom-lighter);
    margin-left: 6px;
    line-height: 0.9;
    display: inline-block;
    align-self: center;
    transition: color 0.2s ease;
}
.cnr-active-filter-badge:hover {
    background-color: var(--orange);
    border-color: var(--orange);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(255, 118, 0, 0.12);
}
.cnr-active-filter-badge:hover .cnr-filter-label-text,
.cnr-active-filter-badge:hover .cnr-filter-close-x {
    color: #ffffff;
}
.cnr-active-category,
.cnr-active-cycle {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    vertical-align: middle;
}

.cnr-active-filter-badge {
    display: inline-flex;
    align-items: center;
    background-color: var(--blue-custom-light); /* Czysty, delikatny błękit lookbooka */
    border: 1px solid var(--border-entry);
    border-radius: 4px;
    padding: 3px 8px; /* Kompaktowy, niski profil w linii tekstu */
    cursor: pointer;
    line-height: 1;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    margin-left: 4px;
    margin-right: 4px;
}

.cnr-filter-label-text {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: var(--link-color); /* Twój głęboki granat */
}

/* Minimalistyczny, typograficzny znak krzyżyka zamykania */
.cnr-filter-close-x {
    font-size: 1.1rem; /* Czytelny i wyraźny znak &times; */
    font-weight: 400;
    color: var(--blue-custom-lighter);
    margin-left: 6px; /* Odstęp od tekstu rangi wyścigu */
    line-height: 0.9;
    display: inline-block;
    align-self: center;
    transition: color 0.2s ease;
}

/* --- INTERAKCJA HOVER: Pigułka ożywa pod kursorem --- */
.cnr-active-filter-badge:hover {
    background-color: var(--orange); /* Dynamiczny, markowy pomarańcz portalu */
    border-color: var(--orange);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.15);
}

/* Po najechaniu myszką napisy i iksik zamykania stają się czysto białe */
.cnr-active-filter-badge:hover .cnr-filter-label-text,
.cnr-active-filter-badge:hover .cnr-filter-close-x {
    color: #ffffff;
}
.cnr-simple-pager {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin-top: 50px;
    padding-top: 30px;
    border-top: 1px dashed var(--border-entry);
    box-sizing: border-box;
}
.cnr-pager-btn {
    display: inline-flex;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 4px;
    line-height: 1;
    transition: all 0.2s ease;
    cursor: pointer;
}
.cnr-pager-prev,
.cnr-pager-next {
    background-color: #f1f1f1;
    color: var(--link-color);
    border: 1px solid rgba(0, 0, 0, 0.02);
}
.cnr-pager-prev:hover,
.cnr-pager-next:hover {
    background-color: var(--orange);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.12);
}
.cnr-pager-disabled {
    background-color: #fcfdfe;
    color: #cdcdcd;
    border: 1px solid var(--border-entry);
    cursor: not-allowed;
    pointer-events: none;
}
.cnr-pager-info {
    font-size: 0.9rem;
    color: var(--blue-custom-lighter);
    font-weight: 400;
    padding: 0 20px;
}
.cnr-pager-info strong {
    color: var(--link-color);
    font-weight: 700;
}
@media (max-width: 768px) {
    .cnr-simple-pager {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
    .cnr-pager-btn {
        width: 100%;
        justify-content: center;
    }
    .cnr-pager-info {
        order: -1;
    }
}
.cnr-load-more-tracks-wrapper {
    display: inline-block;
    cursor: pointer;
}
.cnr-load-more-btn-pill {
    display: inline-flex;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    background-color: #f1f1f1;
    color: var(--link-color);
    padding: 14px 45px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.02);
    line-height: 1;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    white-space: nowrap;
}
.cnr-load-more-tracks-wrapper:hover .cnr-load-more-btn-pill:not(.cnr-pager-disabled) {
    background-color: var(--orange);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(255, 118, 0, 0.15);
}
.cnr-load-more-btn-pill.cnr-pager-disabled {
    background-color: #fcfdfe;
    color: #cdcdcd;
    border: 1px solid var(--border-entry);
    cursor: not-allowed;
    pointer-events: none;
}
@media (max-width: 768px) {
    .cnr-load-more-tracks-wrapper {
        width: 100%;
    }
    .cnr-load-more-btn-pill {
        width: 100%;
        justify-content: center;
    }
}
.cnr-grid-equal .cnr-badge-start-place:hover,
.cnr-related-grid-clean .cnr-badge-start-place:hover {
    background-color: var(--blue-custom-light);
    color: var(--link-color);
    transform: scale(1.02);
}
.cnr-mini-category-tag {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--blue-custom-lighter);
    background-color: var(--bg-tag);
    padding: 2px 6px;
    border-radius: 3px;
    margin-right: 4px;
    display: inline-block;
}

/* =========================================================
   11. ARTYKUŁ / BLOG
   ========================================================= */

.cnr-article-view-container {
    width: 100%;
    background-color: #ffffff;
    margin: 0 auto;
    padding: 40px 20px 60px 20px;
    box-sizing: border-box;
}
.cnr-article-reader-content {
    max-width: 800px;
    width: 100%;
    margin: 0 auto 50px auto;
    box-sizing: border-box;
}
.cnr-article-main-title {
    font-size: 2.4rem;
    font-weight: 800;
    color: var(--link-color);
    line-height: 1.25;
    margin: 15px 0 30px 0;
    letter-spacing: -0.5px;
}
.cnr-article-body-text p {
    font-size: 1.1rem;
    line-height: 1.7;
    color: #2c3e50;
    margin-bottom: 24px;
}
.cnr-article-body-text h2,
.cnr-article-body-text h3,
.cnr-article-body-text h4 {
    color: var(--link-color);
    font-weight: 700;
    margin: 40px 0 16px 0;
    line-height: 1.3;
}
.cnr-article-body-text h2 {
    font-size: 1.6rem;
}
.cnr-article-body-text h3 {
    font-size: 1.35rem;
}
.cnr-article-view-container .cnr-badge-article {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 3px 8px;
    border-radius: 4px;
}
.cnr-article-view-container .cnr-related-section {
    max-width: 1200px;
    margin: 60px auto 0 auto;
    padding-top: 40px;
    border-top: 1px dashed var(--border-entry);
}
@media (max-width: 768px) {
    .cnr-article-main-title {
        font-size: 1.85rem;
    }
    .cnr-article-body-text p {
        font-size: 1.02rem;
        line-height: 1.65;
    }
}
.cnr-article-blog-indicator {
    margin-top: 15px;
    margin-bottom: -5px;
}
.cnr-article-blog-indicator a {
    border-bottom: 1px dashed var(--orange);
    color: var(--orange);
    font-weight: 600;
    line-height: 1;
    transition: all 0.2s ease;
    text-decoration: none;
}
.cnr-article-blog-indicator a span {
    font-weight: 700;
    font-style: normal;
}
.cnr-article-blog-indicator a:hover {
    color: var(--link-color);
}
.cnr-blog-pager {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    margin-top: 35px;
    margin-bottom: 10px;
    background-color: transparent;
    background: transparent;
    border: none;
    border-top: 1px dashed var(--border-entry);
    border-bottom: 1px dashed var(--border-entry);
    padding: 18px 0;
    box-sizing: border-box;
}
.cnr-blog-pager-item {
    flex: 1;
    display: inline-flex;
}
.cnr-blog-pager-left {
    justify-content: flex-start;
}
.cnr-blog-pager-center {
    justify-content: center;
}
.cnr-blog-pager-right {
    justify-content: flex-end;
}
.cnr-blog-pager a,
.cnr-blog-pager-disabled {
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    line-height: 1;
}
.cnr-blog-pager a {
    color: var(--link-color);
    transition: color 0.2s ease;
}
.cnr-blog-pager a:hover {
    color: var(--orange);
}
.cnr-blog-return-btn {
    background-color: transparent;
    background: transparent;
    border: none;
    border-bottom: 1px solid var(--blue-light);
    border-radius: 0;
    padding: 2px 4px;
    color: var(--link-color);
    transition: all 0.2s ease;
}
.cnr-blog-return-btn:hover {
    background-color: transparent;
    color: var(--orange);
    border-bottom-color: var(--orange);
    box-shadow: none;
}
.cnr-blog-pager-disabled {
    color: #cdcdcd;
    cursor: not-allowed;
    pointer-events: none;
}
.cnr-article-source-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    margin-bottom: 25px;
    width: 100%;
}
.cnr-source-label {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--blue-custom-lighter);
}
.cnr-source-link {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--link-color);
    text-decoration: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    padding-bottom: 1px;
    transition: all 0.2s ease;
}
.cnr-source-link:hover {
    color: var(--orange);
    border-bottom-color: var(--orange);
}
@media (max-width: 768px) {
    .cnr-blog-pager {
        flex-direction: column;
        gap: 14px;
        text-align: center;
        padding: 16px 0;
    }
    .cnr-blog-pager-item {
        width: 100%;
        justify-content: center;
    }
    .cnr-blog-return-btn {
        width: auto;
    }
    .cnr-article-source-wrapper {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
}
.cnr-article-body-text h5 {
    font-size: 1.15rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--link-color);
    margin: 30px 0 14px 0;
    line-height: 1.3;
}
.cnr-article-body-text ul {
    list-style-type: none;
    padding: 0;
    margin: 0 0 25px 0;
    width: 100%;
}
.cnr-article-body-text ul li {
    font-size: 1.02rem;
    line-height: 1.6;
    color: #2c3e50;
    padding: 6px 0 6px 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
    position: relative;
}
.cnr-article-body-text ul li:last-child {
    border-bottom: none;
}
.cnr-article-body-text ul li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 15px;
    width: 5px;
    height: 5px;
    background-color: var(--orange);
    border-radius: 1px;
}
.cnr-article-body-text a {
    color: var(--orange);
    text-decoration: none;
    font-weight: 600;
    border-bottom: 1px dashed var(--orange);
    transition: all 0.2s ease;
}
.cnr-article-body-text a:hover {
    color: var(--link-color);
    border-bottom-color: var(--link-color);
}
.cnr-article-body-text p:empty,
.cnr-article-body-text p:has(br:only-child) {
    display: none;
}
.cnr-article-body-text ol {
    list-style-type: decimal;
    padding: 0 0 0 24px;
    margin: 0 0 25px 0;
    width: 100%;
    box-sizing: border-box;
}
.cnr-article-body-text ol li {
    font-size: 1.02rem;
    line-height: 1.6;
    color: #2c3e50;
    padding: 6px 0 6px 4px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.03);
}
.cnr-article-body-text ol li:last-child {
    border-bottom: none;
}
.cnr-article-body-text iframe,
.cnr-article-body-text .video-wrapper,
.cnr-article-body-text embed {
    display: block;
    max-width: 640px;
    width: 100%;
    margin: 45px auto;
    aspect-ratio: 16 / 9;
    height: auto;
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow:
        0 10px 30px rgba(0, 0, 0, 0.06),
        0 1px 3px rgba(0, 0, 0, 0.02);
    box-sizing: border-box;
}
.cnr-route-breadcrumbs {
    font-size: 0.85rem;
    color: var(--blue-custom-lighter);
    width: 100%;
    margin-bottom: 20px;
    display: block;
}
.cnr-route-breadcrumbs a,
.cnr-route-breadcrumbs span {
    color: var(--link-color);
    font-size: 0.84rem;
    text-decoration: none;
    line-height: 1.4;
}
.cnr-route-breadcrumbs span {
    color: var(--blue-custom-lighter);
}
.cnr-route-breadcrumbs a {
    transition: color 0.2s ease;
}
.cnr-route-breadcrumbs a:hover {
    color: var(--orange);
}
.cnr-route-breadcrumbs .divider,
.cnr-route-breadcrumbs .separator {
    margin: 0 6px;
    color: #cbd5e1;
}
.cnr-routes-archive-container .cnr-archive-title span {
    color: var(--orange);
}
.cnr-routes-archive-container .cnr-archive-header {
    padding-top: 0;
    padding-bottom: 5px;
    margin-top: 5px;
    margin-bottom: 12px;
}
.cnr-article-categories-filters, .cnr-geo-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    margin-top: 20px;
    width: 100%;
}
a.cnr-article-cat-pill,
a.cnr-track-geo-pill {
    display: inline-flex;
    align-items: center;
    padding: 7px 14px;
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--link-color);
    text-decoration: none;
    background-color: #ffffff;
    border: 1px solid var(--border-entry);
    border-radius: 4px;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    line-height: 1;
    margin-bottom: 3px;
    margin-top: 2px;
    background-color: #f1f1f1;
    border: 1px solid rgba(0, 0, 0, 0.01);
}

a.cnr-article-cat-pill.cnr-active-pill,
a.cnr-track-geo-pill.cnr-active-pill {
    background-color: var(--orange);
    border-color: var(--orange);
    color: #ffffff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 118, 0, 0.12);
}
a.cnr-article-cat-pill:not(.cnr-active-pill):hover,
a.cnr-track-geo-pill:not(.cnr-active-pill):hover {
    background-color: #e2e8f0;
    color: var(--link-color);
    transform: translateY(-1px);
}
.cnr-users-clean-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 20px;
    padding: 10px 0;
}
.cnr-user-mini-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none;
    background-color: #ffffff;
    border: 1px solid var(--border-entry);
    border-radius: 8px;
    padding: 20px 14px;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}
.cnr-user-mini-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(211, 224, 233, 0.4);
}
.cnr-user-avatar-wrapper {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
    background-color: #f1f1f1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
    border: 2px solid #ffffff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}
.cnr-user-avatar-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cnr-user-avatar-placeholder {
    font-size: 1.5rem;
}
.cnr-user-mini-nick {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--link-color);
}
.cnr-profile-view-container {
    display: flex;
    width: 100%;
    max-width: 1200px;
    margin: 40px auto 60px auto;
    padding: 0 20px;
    gap: 40px;
    box-sizing: border-box;
}
.cnr-profile-sidebar-card {
    flex: 0 0 320px;
    background-color: #ffffff;
    border: 1px solid var(--border-entry);
    border-radius: 8px;
    padding: 30px 24px;
    box-sizing: border-box;
    align-self: flex-start;
}
.cnr-profile-avatar-big {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    background-color: #f1f1f1;
    margin: 0 auto 20px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px solid #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}
.cnr-profile-avatar-big img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.cnr-profile-avatar-big-placeholder {
    font-size: 2.5rem;
}
.cnr-profile-username {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--link-color);
    text-align: center;
    margin: 0 0 4px 0;
}
.cnr-profile-fullname {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--orange);
    text-align: center;
    margin: 0 0 16px 0;
}
.cnr-profile-geo-meta {
    font-size: 0.85rem;
    color: var(--blue-custom-lighter);
    text-align: center;
    padding-bottom: 20px;
    border-bottom: 1px dashed var(--border-entry);
    margin-bottom: 20px;
}
.cnr-profile-about-section h3 {
    font-size: 0.9rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--link-color);
    margin-bottom: 10px;
}
.cnr-profile-about-section p {
    font-size: 0.88rem;
    line-height: 1.6;
    color: #4a5568;
    margin-bottom: 25px;
}
.cnr-profile-actions {
    display: flex;
    justify-content: center;
    width: 100%;
}
.cnr-profile-actions .cnr-gpx-btn-pill {
    width: 100%;
    justify-content: center;
    text-align: center;
}
.cnr-profile-main-content {
    flex-grow: 1;
}
.cnr-profile-section-heading {
    font-size: 1.25rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--link-color);
    margin: 0 0 24px 0;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-entry);
}
.cnr-profile-no-content {
    font-size: 0.95rem;
    color: var(--blue-custom-lighter);
    font-style: italic;
}
@media (max-width: 850px) {
    .cnr-profile-view-container {
        flex-direction: column;
        gap: 30px;
    }
    .cnr-profile-sidebar-card {
        width: 100%;
        flex: 1 1 auto;
    }
}
/* ==========================================================================
   23. HARMONIJKOWY SYSTEM KALENDARZA WYŚCIGÓW (ACCORDION STYLE LIST)
   ========================================================================== */
.cnr-schedule-clean-view,
.cnr-routes-archive-container.cnr-schedule-clean-view {
    max-width: 1200px;
    margin: 0 auto 60px auto;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
}

.cnr-schedule-clean-view .cnr-race-accordion-feed {
    max-width: 1200px;
    margin: 0 auto 20px auto;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
}

.cnr-start-calendar {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.cnr-start-calendar.cnr-race-accordion-feed {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 4px;
    margin-bottom: 20px;
    background-color: #f8fafc;
    padding: 10px 14px;
    border-radius: 6px;
    border: 1px solid var(--border-entry);
    box-sizing: border-box;
    width: 100%;
}

.cnr-start-calendar .cnr-accordion-group {
    display: inline-flex;
    width: auto;
    margin-bottom: 0;
    border: none;
    background: transparent;
    border-radius: 0;
    padding: 0;
}

.cnr-start-calendar .cnr-accordion-group .cnr-accordion-trigger {
    padding: 2px 6px;
    background: transparent;
    border: none;
}
.cnr-start-calendar .cnr-accordion-group:first-child .cnr-accordion-trigger {

    padding-left: 12px;
}

.cnr-start-calendar .cnr-accordion-group .cnr-accordion-arrow,
.cnr-start-calendar .cnr-accordion-group .cnr-accordion-month-title span {
    display: none;
}
.cnr-start-calendar .cnr-accordion-group .cnr-accordion-month-title {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--blue-custom-lighter);
    text-transform: capitalize;
}

.cnr-start-calendar .cnr-accordion-group::after {
    content: "|";
    font-size: 0.8rem;
    color: #cbd5e1;
    align-self: center;
    margin-left: 4px;
    margin-right: 2px;
    display: inline-block;
}
.cnr-start-calendar .cnr-accordion-group.cnr-current-month::after,
.cnr-start-calendar .cnr-current-month ~ .cnr-accordion-group::after {
    display: none;
}
.cnr-start-calendar .cnr-accordion-group.cnr-current-month {
    flex: 0 0 100%;
    width: 100%;
    margin-top: 14px;
}

.cnr-start-calendar .cnr-accordion-group.cnr-current-month ~ .cnr-accordion-group,
.cnr-start-calendar .cnr-accordion-group.cnr-current-month {
    display: block;
    width: 100%;
    margin-bottom: 6px;
    border: 1px solid var(--border-entry);
    border-radius: 4px;
    background-color: #ffffff;
}

.cnr-start-calendar .cnr-accordion-group.cnr-current-month .cnr-accordion-trigger,
.cnr-start-calendar .cnr-accordion-group.cnr-current-month ~ .cnr-accordion-group .cnr-accordion-trigger {
    display: flex;
    justify-content: space-between;
    padding: 8px 16px;
    background-color: var(--bg-tag);
}
.cnr-start-calendar .cnr-accordion-group.cnr-current-month .cnr-accordion-arrow,
.cnr-start-calendar .cnr-accordion-group.cnr-current-month ~ .cnr-accordion-group .cnr-accordion-arrow,
.cnr-start-calendar .cnr-accordion-group.cnr-current-month .cnr-accordion-month-title span,
.cnr-start-calendar .cnr-accordion-group.cnr-current-month ~ .cnr-accordion-group .cnr-accordion-month-title span {
    display: inline;
}
.cnr-start-calendar .cnr-accordion-group.cnr-current-month .cnr-accordion-month-title,
.cnr-start-calendar .cnr-accordion-group.cnr-current-month ~ .cnr-accordion-group .cnr-accordion-month-title {
    font-size: 0.88rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--link-color);
}

.cnr-race-accordion-feed {
    max-width: 1200px;
    margin: 0 auto 60px auto;
    width: 100%;
    box-sizing: border-box;
}

.cnr-accordion-group {
    width: 100%;
    margin-bottom: 12px;
    border: 1px solid var(--border-entry);
    border-radius: 6px;
    background-color: #ffffff;
    overflow: hidden;
    box-sizing: border-box;
}
.cnr-accordion-trigger {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 12px 20px;
    background-color: var(--bg-tag);
    border: none;
    cursor: pointer;
    outline: none;
    transition: background-color 0.2s ease;
    text-align: left;
}
.cnr-accordion-trigger:hover { background-color: #f1f5f9; }

.cnr-accordion-month-title {
    font-size: 0.95rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--link-color);
}
.cnr-accordion-month-title span {
    color: var(--blue-custom-lighter);
    font-weight: 600;
    font-size: 0.85rem;
}
.cnr-accordion-arrow {
    font-size: 1rem;
    font-weight: 700;
    color: var(--blue-custom-lighter);
    transition: transform 0.25s ease;
}
.cnr-accordion-trigger.js-expanded .cnr-accordion-arrow { transform: rotate(180deg); color: var(--orange); }

.cnr-accordion-content { display: none; width: 100%; box-sizing: border-box; }
.cnr-race-days-wrapper { display: flex; flex-direction: column; width: 100%; }

.cnr-accordion-trigger.js-expanded + .cnr-accordion-content{
    display: block;
}

.cnr-race-day-block {
    display: flex;
    width: 100%;
    padding: 16px 24px;
    border-bottom: 1px solid var(--border-entry);
    gap: 24px;
    box-sizing: border-box;
    align-items: flex-start;
}
.cnr-race-day-block:last-child { border-bottom: none; }

.cnr-race-day-aside { flex: 0 0 52px; align-self: flex-start; margin-top: 4px; }

.cnr-race-row-date {
    width: 52px; height: 52px; background-color: var(--link-color); border-radius: 4px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.cnr-race-row-day { font-size: 1.25rem; font-weight: 800; color: #ffffff; line-height: 1; }
.cnr-race-row-mon { font-size: 0.68rem; font-weight: 700; color: var(--orange); text-transform: uppercase; margin-top: 1px; line-height: 1; }

.cnr-race-day-events-list { flex-grow: 1; display: flex; flex-direction: column; min-width: 0; gap: 0; }

.cnr-race-sub-row, .cnr-race-list-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 10px 16px;
    border-bottom: 1px dashed rgba(0, 0, 0, 0.04);
    box-sizing: border-box;
}
.cnr-race-sub-row:last-child { border-bottom: none; padding-bottom: 0; }
.cnr-race-list-row::before, .cnr-race-sub-row::before { display: none; }

.cnr-race-row-info {
    flex-grow: 1;
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.cnr-race-row-title {
    font-size: 1.05rem; font-weight: 700; margin: 0; line-height: 1.4;
    flex: 0 0 40%; min-width: 240px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 15px; box-sizing: border-box;
}
.cnr-race-row-title a { color: var(--link-color); text-decoration: none; }
.cnr-race-row-title a:hover { color: var(--orange); }

.cnr-race-row-meta-line {
    flex: 0 0 35%; display: flex; align-items: center; flex-wrap: nowrap; gap: 8px;
    font-size: 0.88rem; color: var(--blue-custom-lighter); margin: 0; line-height: 1.4;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-right: 15px; box-sizing: border-box;
}
.cnr-race-row-geo { font-weight: 600; color: #475569; cursor: pointer; }
.cnr-race-row-geo:hover { color: var(--orange); }
.cnr-race-row-divider { color: #e2e8f0; }

.cnr-race-row-category-zone {
    flex: 0 0 25%; display: flex; justify-content: flex-end; align-items: center; gap: 6px; box-sizing: border-box;
}

.cnr-race-row-tech-badge {
    display: inline-flex; align-items: center; justify-content: center; padding: 5px 12px; font-size: 0.75rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.5px; border-radius: 4px; color: #ffffff; line-height: 1; white-space: nowrap; min-width: 110px; text-align: center;
}

.cnr-race-row-tag {
    background-color: var(--blue-custom-light); padding: 5px 10px; border-radius: 4px; font-weight: 700; font-size: 0.72rem; text-transform: uppercase; color: var(--link-color); line-height: 1; white-space: nowrap;
}

.cnr-cat-1 .cnr-race-row-tech-badge { background-color: #6dbcf4; }
.cnr-cat-2 .cnr-race-row-tech-badge { background-color: #fd8d08; }
.cnr-cat-3 .cnr-race-row-tech-badge { background-color: #c89bff; }
.cnr-cat-4 .cnr-race-row-tech-badge { background-color: #febcb6; }
.cnr-cat-5 .cnr-race-row-tech-badge { background-color: #ff4b4b; }
.cnr-cat-6 .cnr-race-row-tech-badge { background-color: #2655be; }
.cnr-cat-7 .cnr-race-row-tech-badge { background-color: #70f547; }
.cnr-cat-8 .cnr-race-row-tech-badge { background-color: #ffed5c; }
.cnr-cat-9 .cnr-race-row-tech-badge { background-color: #cdcdcd; }
.cnr-cat-10 .cnr-race-row-tech-badge { background-color: #3d9f1f; }
.cnr-cat-11 .cnr-race-row-tech-badge { background-color: #262222; }
.cnr-cat-12 .cnr-race-row-tech-badge { background-color: #ababab; }
.cnr-cat-13 .cnr-race-row-tech-badge { background-color: #cc7815; }
.cnr-cat-13 .cnr-race-row-tech-badge { background-color: #ddbb44; }

#cnr-shedule-calendar .hidden, .cnr-race-accordion-feed .hidden, .cnr-race-days-wrapper .hidden, .cnr-race-day-block.hidden, .cnr-race-sub-row.hidden, .cnr-race-list-row.hidden {
    display: none; opacity: 0; visibility: hidden; height: 0; padding: 0; margin: 0; border: none;
}
/* ==========================================================================
   RESPONSIVNOŚĆ (RWD): MOBILNY STRUMIEŃ PIONOWY FOR SMARTPHONES
   ========================================================================== */
@media (max-width: 768px) {

    .cnr-race-day-block {
        flex-direction: row;

        gap: 16px;
        padding: 14px 12px;
        align-items: flex-start;
    }

    .cnr-race-day-aside {
        flex: 0 0 52px;
        align-self: flex-start;
        margin-top: 6px;
    }

    .cnr-race-sub-row,
    .cnr-race-list-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        padding: 8px 0;

    }

    .cnr-race-row-info {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .cnr-race-row-title {
        flex: 1 1 auto;
        width: 100%;
        max-width: 100%;
        white-space: normal;
        font-size: 1rem;

        padding-right: 0;
    }

    .cnr-race-row-meta-line {
        flex: 1 1 auto;
        width: 100%;
        flex-wrap: wrap;
        font-size: 0.82rem;
        padding-right: 0;
    }

    .cnr-race-row-divider {
        display: inline;
    }

    .cnr-race-row-category-zone {
        flex: 1 1 auto;
        width: 100%;
        justify-content: flex-start;

        margin-top: 4px;
        gap: 4px;
    }

    .cnr-race-row-tech-badge {
        min-width: auto;

        padding: 3px 8px;
        font-size: 0.68rem;
    }

    .cnr-race-row-tag {
        padding: 3px 8px;
        font-size: 0.65rem;
    }
}

.cnr-race-view-wrapper .cnr-article-breadcrumbs-nav {
    max-width: 800px;
    margin: 0 auto 20px auto;
}

.cnr-race-detail-header-block {
    display: flex;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 30px;
    width: 100%;
}

.cnr-race-detail-title-zone {
    flex-grow: 1;
    min-width: 0;
}

.cnr-race-detail-main-title {
    font-size: 2.2rem;
    font-weight: 800;
    color: var(--link-color);
    line-height: 1.25;
    margin: 8px 0 0 0;
    letter-spacing: -0.5px;
}

.cnr-race-detail-spec-panel {
    background-color: #f8fafc;
    border: 1px solid var(--border-entry);
    border-radius: 6px;
    padding: 20px 24px;
    margin-bottom: 35px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
}

.cnr-race-spec-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.95rem;
    border-bottom: 1px dashed rgba(0, 0, 0, 0.04);
    padding-bottom: 10px;
}
.cnr-race-spec-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.cnr-race-spec-label {
    color: var(--blue-custom-lighter);
    font-weight: 600;
}

.cnr-race-spec-val {
    color: var(--link-color);
    font-weight: 700;
    text-align: right;
}

.cnr-race-detail-description {
    margin-top: 10px;
    margin-bottom: 40px;
}
.cnr-race-detail-header-block .cnr-race-date-badge {
    flex: 0 0 68px;
    height: 72px;
    background-color: var(--link-color);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
    box-sizing: border-box;
    margin-top: 6px;
}

.cnr-race-detail-header-block .cnr-race-day {
    font-size: 1.6rem;
    font-weight: 800;
    color: #ffffff;
    line-height: 1;
}

.cnr-race-detail-header-block .cnr-race-month {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--orange);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 3px;
    line-height: 1;
}

.cnr-race-detail-title-zone .cnr-entry-meta {
    margin-bottom: 6px;
}

.cnr-race-detail-title-zone .cnr-badge {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 3px 8px;
    border-radius: 4px;
    color: #ffffff;
    display: inline-block;
}

.cnr-race-detail-title-zone .cnr-cat-1 { background-color: #6dbcf4; }
.cnr-race-detail-title-zone .cnr-cat-2 { background-color: #fd8d08; }
.cnr-race-detail-title-zone .cnr-cat-3 { background-color: #c89bff; }
.cnr-race-detail-title-zone .cnr-cat-4 { background-color: #febcb6; color: #1e293b; }
.cnr-race-detail-title-zone .cnr-cat-5 { background-color: #ff4b4b; }
.cnr-race-detail-title-zone .cnr-cat-10 { background-color: #3d9f1f; }

/* RESPONSYWNOŚĆ (RWD) */
@media (max-width: 768px) {
    .cnr-race-detail-header-block {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 14px;
    }
    .cnr-race-detail-header-block .cnr-race-date-badge {
        margin-top: 0;
    }
    .cnr-race-detail-main-title {
        font-size: 1.75rem;
    }
    .cnr-race-spec-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    .cnr-race-spec-val {
        text-align: left;
    }
}

@media (max-width: 768px) {

    /* 1. Reset głównej siatki strumienia – bezwzględna jedna kolumna */
    .cnr-grid-stream {
        grid-template-columns: 1fr !important;
        gap: 24px !important;
        padding: 0 16px !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    /* Każda karta (mała i duża wyróżniona) na mobile zajmuje dokładnie 1 kolumnę */
    .cnr-grid-stream .cnr-post-card {
        grid-column: span 1 !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    /* 2. RESET DUŻEGO KAFELKA WYRÓŻNIONEGO (6n+1): Przejście z poziomu w pion */
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry {
        flex-direction: column !important; /* Zamiast row dajemy układ pionowy */
        min-height: auto !important;
    }

    /* Zdjęcie dużego kafelka na telefonie dostaje 100% szerokości i standardową wysokość */
    .cnr-grid-stream-featured .cnr-post-card:nth-child(6n+1) .cnr-entry-media {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16 / 10 !important; /* Panoramiczne proporcje obrazka */
    }

    /* 3. STABILIZACJA ZWYKŁYCH KAFELKÓW W JEDNEJ LINII (Jak airmisio i poliorketes) */
    .cnr-entry {
        flex-direction: column !important;
        width: 100% !important;
    }

    .cnr-entry-media {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 16 / 10 !important; /* Gwarancja idealnych proporcji zdjęć z bazy bez deformacji */
    }

    .cnr-entry-content {
        width: auto !important;
        padding: 20px !important; /* Przytulny, czysty oddech tekstu od krawędzi smartfona */
    }

    /* Typografia mobilna dla nagłówków */
    .cnr-entry-title {
        font-size: 1.2rem !important;
        min-height: auto !important; /* Puszczamy blokadę wysokości na telefonie */
        margin-bottom: 10px !important;
    }

    /* Skracamy zajawkę na mobile do 3 linii, aby dół strony nie ciągnął się w nieskończoność */
    .cnr-entry-excerpt {
        font-size: 0.9rem !important;
        line-height: 1.5 !important;
        margin-bottom: 16px !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 3 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }
}