/* ==========================================================================
   OSK Pawelski - Main Stylesheet
   ==========================================================================
   
   BREAKPOINT SYSTEM (Aligned with UIkit 3)
   =========================================
   Mobile-first approach with these breakpoints:
   
   | Breakpoint | UIkit Class | Width      | Target Devices          |
   |------------|-------------|------------|-------------------------|
   | xs         | (default)   | < 640px    | Small phones            |
   | s          | @s          | >= 640px   | Large phones, portrait  |
   | m          | @m          | >= 960px   | Tablets, small laptops  |
   | l          | @l          | >= 1200px  | Laptops, desktops       |
   | xl         | @xl         | >= 1600px  | Large screens           |
   
   Max-width breakpoints (mobile-first overrides):
   - max-width: 639px  = xs only (mobile phones)
   - max-width: 959px  = below @m (phones + tablets)
   - max-width: 1199px = below @l
   
   Min-width breakpoints (progressive enhancement):
   - min-width: 640px  = @s and above
   - min-width: 960px  = @m and above (tablet+)
   - min-width: 1200px = @l and above (desktop+)
   
   ========================================================================== */

:root {
    --site-nav-height: 88px;
    --font-primary: 'Montserrat', sans-serif;
    --font-display: 'Amatic SC', cursive;

    /* Reusable spacing tokens */
    --modal-padding: clamp(1.25rem, 3vw, 2rem);
    --section-padding-y: clamp(3.5rem, 6vw, 6rem);

    /* Common colors */
    --color-primary-dark: #11243b;
    --color-accent-blue: #2f83ff;
    --color-accent-green: #35c76d;
    --color-text-muted: #5a6b8a;

    /* Common gradients */
    --gradient-accent-blue: linear-gradient(135deg, #2f83ff 0%, #1a5cd0 100%);
}

@media (max-width: 959px) {
    :root {
        --site-nav-height: 74px;
    }
}

/**
 * Prevent horizontal scrolling on mobile.
 * UIkit grids use negative margins which can cause overflow.
 * This ensures the fixed mobile bottom bar stays properly positioned.
 */
html,
body {
    overflow-x: hidden;
}

body {
    font-family: var(--font-primary);
    color: #333;
    line-height: 1.6;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-primary);
    font-weight: 700;
    color: var(--color-primary-dark);
}

p,
li {
    line-height: 1.7;
    text-wrap: pretty;
}

h1,
h2,
h3 {
    text-wrap: balance;
}

.font-display {
    font-family: var(--font-display);
}

/* Ensure h1 and h2 with .font-display have identical visual sizing */
h1.font-display,
h2.font-display {
    font-size: clamp(3.2rem, 7vw, 5rem);
    font-weight: 700;
    line-height: 1.1;
}

.hero-section {
    min-height: min(760px, 100vh);
    color: #f5f7fb;
}

/* Instructors section refresh */
.tm-instructors {
    background-color: #f4f6f8;
    /* Very light bluish-gray page bg */
    padding-top: var(--section-padding-y);
    padding-bottom: var(--section-padding-y);
}

.tm-instructors__intro {
    max-width: 760px;
    margin: 0 auto;
}

/* Masonry Grid Container */
.tm-team-grid {
    margin-top: clamp(2.5rem, 6vw, 4rem);
    --tm-team-grid-offset: 1.25rem;
}

.tm-team-grid__item {
    position: relative;
    --tm-team-item-shift: 0px;
}

@media (min-width: 640px) {
    .tm-team-grid {
        --tm-team-grid-offset: 1.75rem;
    }
}

@media (min-width: 960px) {
    .tm-team-grid {
        --tm-team-grid-offset: 2.5rem;
    }
}

@media (max-width: 959px) {
    .tm-team-grid__item:nth-of-type(2n) {
        --tm-team-item-shift: var(--tm-team-grid-offset);
    }
}

@media (min-width: 960px) and (max-width: 1199px) {
    .tm-team-grid__item:nth-of-type(3n+2) {
        --tm-team-item-shift: var(--tm-team-grid-offset);
    }
}

@media (min-width: 1200px) {
    .tm-team-grid {
        --tm-team-grid-offset: 3rem;
    }

    .tm-team-grid__item:nth-of-type(4n+2),
    .tm-team-grid__item:nth-of-type(4n) {
        --tm-team-item-shift: var(--tm-team-grid-offset);
    }
}

/* Card Styling */
.tm-team-card {
    /* Light neutral gray inner panel */
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    /* Soft diffuse shadow */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100%;
    /* Ensure full height in grid */
    /* Ensure card has a minimum height if content is empty */
    min-height: 300px;
    transform: translateY(var(--tm-team-item-shift));
}

.tm-team-card:hover {
    transform: translateY(calc(var(--tm-team-item-shift) - 5px));
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.12);
}

.tm-team-card__media {
    width: 100%;
    padding-top: 135%;
    /* Aspect ratio for portrait (taller than square) */
}

.tm-team-card__media img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}

/* Badge Styling - Name-only, wrapping from behind the card with a stylish 8px overhang */
.tm-team-card__badge {
    position: absolute;
    bottom: 2.5rem;
    left: -8px;
    /* More pronounced overhang */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(17, 36, 59, 1) 0%, rgba(30, 58, 89, 0.95) 100%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow:
        4px 6px 15px rgba(0, 0, 0, 0.25);
    z-index: 10;
    white-space: nowrap;
    max-width: 95%;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-left: none;
    /* Seamless wrap look */
    border-radius: 0 100px 100px 0;
    /* Pill-like on the right */
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

/* The "fold" effect - a small triangle behind the card edge */
.tm-team-card__badge::before {
    content: '';
    position: absolute;
    top: -8px;
    /* Match overhang height */
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 0 8px 8px;
    /* Match overhang pixels */
    border-color: transparent transparent #07101a transparent;
    /* Very dark shadow color */
    z-index: -1;
}

.tm-team-card:hover .tm-team-card__badge {
    box-shadow: 6px 8px 20px rgba(0, 0, 0, 0.35);
}

.tm-team-card__badge-name {
    color: #ffffff;
    padding: 0.55rem 1.4rem 0.55rem 1.1rem;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: capitalize;
}



/* Responsive Adjustments */
@media (max-width: 639px) {
    .tm-instructors {
        padding-top: clamp(3rem, 8vw, 5rem);
        padding-bottom: clamp(3rem, 8vw, 5rem);
    }

    .tm-team-card__badge {
        bottom: 1.25rem;
        left: -6px;
        /* Reduced overhang on mobile to prevent overflow */
        max-width: calc(100% + 6px);
        /* Allow badge to extend slightly past card edge */
    }

    .tm-team-card__badge::before {
        top: -6px;
        border-width: 0 0 6px 6px;
        /* Match reduced overhang */
    }

    .tm-team-card__badge-name {
        padding: 0.45rem 1rem 0.45rem 0.8rem;
        /* Tighter padding on mobile */
        font-size: 0.8rem;
    }
}



.hero-section__overlay {
    background: linear-gradient(95deg, rgba(8, 10, 16, 0.65) 0%, rgba(12, 15, 22, 0.5) 48%, rgba(18, 20, 26, 0.32) 100%);
    pointer-events: none;
    z-index: 0;
}

.hero-section__content {
    padding: clamp(4rem, 14vh, 9rem) 0 clamp(4rem, 18vh, 10rem);
    z-index: 1;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: left;
}

.hero-section>.uk-overlay {
    z-index: 2;
}

.hero-section__inner {
    width: 100%;
    max-width: 1200px;
    margin-right: auto;
    margin-left: auto;
}

.hero-copy {
    padding: 0;
    gap: clamp(0.85rem, 2.2vw, 1.5rem);
    max-width: 720px;
    align-items: flex-start;
}

.hero-heading-stack {
    display: grid;
    gap: clamp(0.08rem, 0.5vw, 0.3rem);
    text-align: left;
}

.hero-section__lede {
    margin: 0;
    color: rgba(245, 247, 251, 0.94);
    font-size: clamp(1.1rem, 2.3vw, 1.4rem);
    line-height: 1.55;
    text-shadow: 0 10px 28px rgba(0, 0, 0, 0.36);
}

.hero-lede-highlight {
    position: relative;
    display: inline-block;
    padding: 0 0.06em 0.35em;
}

.hero-lede-highlight__svg {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    height: 1.05em;
    width: 100%;
    overflow: visible;
    pointer-events: none;
    transform: translateY(-38%);
}

.hero-lede-highlight__stroke {
    stroke: #eea523;
    stroke-width: 12;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
    filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.38));
    stroke-dasharray: 130;
    stroke-dashoffset: 130;
    /* Delay animation to start after UIkit scrollspy slide-bottom completes */
    /* UIkit animation: 150ms delay + 400ms duration = 550ms total */
    /* Adding 550ms buffer for smooth, noticeable transition = 1100ms total delay */
    /* animation-fill-mode: both ensures Chrome maintains initial state during delay */
    animation: hero-smudge-draw 0.9s ease-out 1.1s both;
}

@keyframes hero-smudge-draw {
    from {
        stroke-dashoffset: 130;
    }

    to {
        stroke-dashoffset: 0;
    }
}

.hero-section__eyebrow {
    font-size: clamp(1.2rem, 3vw, 1.5rem);
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.8);
    text-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

.hero-section__title {
    font-family: var(--font-primary);
    font-weight: 800;
    color: inherit;
    font-size: clamp(2.5rem, 5vw, 4.1rem);
    letter-spacing: -0.012em;
    line-height: 1.08;
    text-shadow: 0 12px 30px rgba(0, 0, 0, 0.5);
}

@media (max-width: 639px) {
    .hero-section__title {
        font-size: clamp(1.8rem, 6vw, 2.5rem);
        line-height: 1.1;
    }

    .hero-section__content {
        padding-top: clamp(6rem, 15vh, 8rem);
        padding-bottom: 2rem;
    }

    .hero-heading-stack {
        gap: 0.2rem;
        margin-top: 2.5rem;
    }
}

.hero-section__categories {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.hero-subhead__list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.2rem;
    color: rgba(245, 247, 251, 0.92);
    font-size: clamp(0.98rem, 1.9vw, 1.12rem);
    line-height: 1.5;
}

.hero-subhead__list li {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
}

.hero-subhead__list [uk-icon] {
    color: #7dd9ff;
    margin-top: 0.1rem;
}

.hero-subhead__secondary {
    display: inline-block;
}

.hero-metrics {
    margin-top: clamp(0.4rem, 1vh, 0.9rem);
}

.hero-metrics__list {
    list-style: none;
    padding: 0;
    margin: 0;
    gap: clamp(0.5rem, 1.5vw, 1rem);
}

.hero-metrics__item {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #f6fbff;
    font-weight: 700;
    font-size: clamp(0.98rem, 2vw, 1.12rem);
    letter-spacing: 0.005em;
    text-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}

.hero-metrics__dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #7cc6ff;
    box-shadow: 0 0 0 6px rgba(124, 198, 255, 0.18);
}

.hero-metrics__text {
    white-space: nowrap;
}

.hero-location {
    color: rgba(255, 255, 255, 0.84);
    font-size: clamp(0.98rem, 1.9vw, 1.14rem);
    font-weight: 650;
    letter-spacing: 0.025em;
    text-transform: uppercase;
    text-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

.hero-location__main {
    margin: 0;
}

.hero-location__areas {
    margin: 0.1rem 0 0;
    color: rgba(241, 245, 249, 0.85);
    font-weight: 600;
}

.hero-course-start {
    color: rgba(241, 245, 249, 0.88);
    font-size: clamp(1rem, 1.9vw, 1.12rem);
    text-shadow: 0 10px 24px rgba(0, 0, 0, 0.3);
}

/* Course Start Urgency Badge */
.hero-course-start__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.6rem 1.1rem;
    background: linear-gradient(135deg, rgba(238, 165, 35, 0.18), rgba(238, 165, 35, 0.08));
    border: 1px solid rgba(238, 165, 35, 0.4);
    border-radius: 999px;
    font-size: clamp(0.9rem, 1.8vw, 1.05rem);
    font-weight: 600;
    color: #ffffff;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.hero-course-start__icon {
    color: #eea523;
}

.hero-course-start__label {
    font-weight: 700;
    color: #ffffff;
}

.hero-course-start__date {
    font-weight: 800;
    color: #fcd34d;
}

.hero-course-start__countdown {
    font-weight: 600;
    color: rgba(255, 255, 255, 0.85);
    font-size: 0.9em;
}

.hero-course-start__countdown:not(:empty)::before {
    content: "(";
}

.hero-course-start__countdown:not(:empty)::after {
    content: ")";
}

.hero-course-start__sublabel {
    color: rgba(255, 255, 255, 0.9);
    font-weight: 500;
}

.hero-course-start__link {
    color: #fcd34d;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.hero-course-start__link:hover {
    color: #fde68a;
}

.hero-cta {
    gap: 0.25rem;
}

.hero-cta__buttons {
    gap: 0.75rem;
    flex-wrap: wrap;
}

.hero-cta__primary,
.hero-cta__messenger {
    flex: 1 1 0;
    min-width: 240px;
    white-space: nowrap;
}

/* Reduce min-width for very small mobile devices to prevent stretching */
@media (max-width: 480px) {

    .hero-cta__primary,
    .hero-cta__messenger {
        min-width: 140px;
    }
}

.hero-cta__primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 0.15rem;
    text-align: center;
    min-height: 48px;
    font-weight: 800;
    font-size: 0.95rem;
    line-height: 1.2;
    padding: 0.85rem 1.6rem;
    box-shadow: 0 12px 28px rgba(12, 130, 255, 0.45);
}

.hero-cta__primary-label {
    font-weight: 800;
}

.hero-cta__phone-number {
    font-weight: 700;
    font-size: 0.92rem;
    color: #e8f2ff;
    letter-spacing: 0.02em;
}

/* Ensure UIKit button base does not override our sizing */
.uk-button.hero-cta__primary,
.uk-button.hero-cta__messenger {
    white-space: nowrap !important;
    line-height: 1.2 !important;
}

.hero-cta__secondary {
    font-weight: 700;
    padding: 0.85rem 1.35rem;
    background: rgba(255, 255, 255, 0.12);
    color: #fefefe;
    border-color: rgba(255, 255, 255, 0.25);
}

.hero-cta__secondary:hover,
.hero-cta__secondary:focus-visible {
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

.hero-cta__messenger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.95rem;
    padding: 0.85rem 1.6rem;
    line-height: 1.1;
    border: 1px solid rgba(255, 255, 255, 0.32);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    gap: 0.35rem;
    min-height: 48px;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.24);
}

.hero-cta__messenger:hover,
.hero-cta__messenger:focus-visible {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
}

.hero-cta__messenger-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.hero-cta__messenger-icon img,
.hero-cta__messenger-icon svg,
.hero-cta__messenger-icon-svg {
    width: 18px;
    height: 18px;
    display: block;
}

.hero-cta__messenger-label {
    display: inline-flex;
    align-items: center;
}

/* License Calculator - Minimal custom styling, relies on UIKit modal/card components */

.license-calculator__legend-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 999px;
    margin-right: 0.5rem;
    vertical-align: middle;
}

.license-calculator__legend-dot--now {
    background: linear-gradient(135deg, #35c76d, #2bb155);
}

.license-calculator__legend-dot--soon {
    background: linear-gradient(135deg, #2f83ff, #48a6ff);
}



.license-calculator__results[hidden] {
    display: none;
}



.license-calculator__group {
    margin-bottom: clamp(1.5rem, 3vw, 2.5rem);
}

.license-calculator__group-heading {
    gap: 0.65rem;
    margin-bottom: 1rem;
    color: #0f233a;
}

/* Use UIKit grid instead */

.license-calculator__card {
    min-height: 100%;
}

.license-calculator__card--now {
    border-left: 4px solid #35c76d;
}

.license-calculator__card--soon {
    border-left: 4px solid #2f83ff;
}

.license-calculator__card-title {
    margin-bottom: 0.4rem;
    font-weight: 700;
}

.license-calculator__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.875rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-weight: 600;
    background: rgba(53, 199, 109, 0.12);
    color: #128847;
}

.license-calculator__badge--soon {
    background: rgba(47, 131, 255, 0.15);
    color: #0d4aad;
}

.license-calculator__badge-date {
    font-weight: 600;
    color: inherit;
    white-space: nowrap;
}

.license-calculator__quick-list {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(17, 36, 59, 0.08);
}

.license-calculator__quick-list-title {
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.license-calculator__quick-list-items {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.license-calculator__quick-item {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: 0.875rem;
}

.license-calculator__quick-item--note {
    margin-left: 1.25rem;
}

.license-calculator__quick-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 0.3rem;
    background: rgba(17, 36, 59, 0.35);
}

.license-calculator__quick-dot--now {
    background: #35c76d;
}

.license-calculator__quick-dot--soon {
    background: #2f83ff;
}

.license-calculator__quick-text {
    flex: 1;
    color: rgba(10, 23, 39, 0.9);
}

.license-calculator__quick-note-tab {
    width: 10px;
    height: 10px;
    flex-shrink: 0;
}

.license-calculator__quick-text--note {
    display: inline-flex;
    align-items: baseline;
    gap: 0.35rem;
    font-size: 0.875rem;
    color: rgba(10, 23, 39, 0.78);
}

.license-calculator__quick-note-marker {
    font-weight: 600;
    color: rgba(10, 23, 39, 0.85);
}

.license-calculator__quick-note-separator {
    color: rgba(10, 23, 39, 0.55);
}

.license-calculator__quick-note-text {
    color: inherit;
}

.license-calculator__notes {
    border-top: 1px dashed rgba(17, 36, 59, 0.16);
    margin-top: 0.75rem;
    padding-top: 0.55rem;
    font-size: 0.875rem;
    color: rgba(10, 23, 39, 0.78);
}

.license-calculator__note-item {
    display: flex;
    gap: 0.35rem;
    margin: 0.2rem 0;
}

.license-calculator__note-star {
    color: var(--color-accent-blue);
    font-weight: 700;
}

.hero-section__cta {
    gap: clamp(0.75rem, 2.5vh, 1.4rem);
    margin-top: clamp(1.8rem, 6vh, 3.8rem);
    color: inherit;
    text-shadow: 0 10px 28px rgba(0, 0, 0, 0.42);
}

.hero-section__cta-actions {
    gap: clamp(0.75rem, 3vw, 1.5rem);
}

.hero-section__cta-text {
    font-family: var(--font-primary);
    font-size: clamp(1.15rem, 3.1vw, 1.65rem);
    line-height: 1.5;
    max-width: min(90vw, 540px);
    text-shadow: 0 10px 28px rgba(0, 0, 0, 0.55);
}

.hero-section__cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: clamp(0.6rem, 2vw, 1.1rem);
    border: none;
    border-radius: 999px;
    background: linear-gradient(120deg, rgba(53, 199, 109, 0.92) 10%, rgba(94, 237, 151, 0.95) 90%);
    color: #0a1423;
    font-family: var(--font-primary);
    letter-spacing: 0.08em;
    box-shadow: 0 14px 32px rgba(0, 0, 0, 0.34);
    text-shadow: none;
    min-width: clamp(240px, 45vw, 320px);
    padding: clamp(0.85rem, 2.8vh, 1.25rem) clamp(1.5rem, 5vw, 2.4rem);
    line-height: 1;
    text-decoration: none;
}

.hero-section__cta-button--icon-only {
    min-width: 0;
    width: clamp(48px, 8vw, 60px);
    height: clamp(48px, 8vw, 60px);
    padding: 0;
    border-radius: 50%;
    flex: 0 0 auto;
}

.hero-section__cta-button:hover,
.hero-section__cta-button:focus {
    background: linear-gradient(120deg, rgba(94, 237, 151, 1) 0%, rgba(53, 199, 109, 1) 100%);
    color: #04121f;
}

.hero-section__cta-number {
    font-size: clamp(1.3rem, 4.4vw, 1.8rem);
    white-space: nowrap;
}


/* ========================================================================
   Mobile Action Bar — 2-CTA Fixed Bottom
   ======================================================================== */

/**
 * Fixed bottom bar for mobile devices with 2 high-value CTAs.
 * Uses IntersectionObserver to show/hide based on hero visibility.
 * 
 * Conversion Priority:
 * 1. Phone (green) — Primary conversion, highest intent
 * 2. Messenger (blue) — Secondary engagement channel
 */

.mobile-action-bar {
    position: fixed;
    inset: auto 0 0;
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.08);
    z-index: 980;
    transform: translateY(0);
    transition: transform 0.28s ease-out;
}

.mobile-action-bar.is-hidden {
    transform: translateY(100%);
}

.mobile-action-bar__nav {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
    padding: 10px 12px;
    max-width: 480px;
    margin: 0 auto;
}

.mobile-action-bar__link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 52px;
    border-radius: 12px;
    text-decoration: none;
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: -0.01em;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.mobile-action-bar__link:hover {
    text-decoration: none;
}

.mobile-action-bar__link:active {
    transform: scale(0.97);
}

/* Phone CTA — Green accent */
.mobile-action-bar__link--phone {
    background: linear-gradient(135deg, #35c76d 0%, #2ab358 100%);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(53, 199, 109, 0.35);
}

.mobile-action-bar__link--phone:hover,
.mobile-action-bar__link--phone:focus {
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(53, 199, 109, 0.45);
}

.mobile-action-bar__link--phone .mobile-action-bar__icon {
    color: #ffffff;
}

/* Messenger CTA — Blue accent */
.mobile-action-bar__link--messenger {
    background: linear-gradient(135deg, #0084ff 0%, #0066cc 100%);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 132, 255, 0.3);
}

.mobile-action-bar__link--messenger:hover,
.mobile-action-bar__link--messenger:focus {
    color: #ffffff;
    box-shadow: 0 6px 18px rgba(0, 132, 255, 0.4);
}

.mobile-action-bar__link--messenger .mobile-action-bar__icon-svg {
    color: #ffffff;
    width: 22px;
    height: 22px;
}

.mobile-action-bar__icon,
.mobile-action-bar__icon-svg {
    flex-shrink: 0;
}

.mobile-action-bar__label {
    white-space: nowrap;
}

/* iOS safe area (notch + home indicator) */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .mobile-action-bar {
        padding-bottom: env(safe-area-inset-bottom);
    }
}

/* Focus visible (keyboard nav) */
.mobile-action-bar__link:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}

/* Cookie consent bar */
.cookie-consent-bar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1105;
}

.cookie-consent__actions {
    width: 100%;
    gap: 0.75rem;
}

.cookie-consent__actions--right {
    justify-content: flex-end;
}

.cookie-consent__actions--right .cookie-consent__action--accept {
    margin-left: 0;
}

.cookie-consent__action--accept {
    margin-left: auto;
}

.cookie-consent__button {
    min-width: 7.5rem;
    min-height: 44px;
}

.cookie-consent__button--accept {
    background-color: var(--color-accent-green);
    border-color: var(--color-accent-green);
    color: #ffffff;
}

.cookie-consent__button--accept:hover,
.cookie-consent__button--accept:focus-visible {
    background-color: #2fb55f;
    border-color: #2fb55f;
    color: #ffffff;
}

.cookie-consent__button--accept:focus-visible {
    box-shadow: 0 0 0 3px rgba(53, 199, 109, 0.35);
}

.cookie-consent__button--accept:active {
    background-color: #279c52;
    border-color: #279c52;
    color: #ffffff;
}

@media (max-width: 959px) {
    .cookie-consent-bar {
        bottom: calc(60px + env(safe-area-inset-bottom));
    }
}

/* Hide global FAB on mobile viewports since we have the sticky bar */
@media (max-width: 959px) {
    .messenger-fab-container {
        display: none !important;
    }
}

/* Additional utility: Ensure content doesn't get hidden behind the bar on very bottom */

.hero-section__cta-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    line-height: 1;
}

.hero-section__cta-icon.uk-icon {
    top: 0;
}


.hero-contact-card {
    padding: clamp(0.95rem, 3vw, 1.3rem);
    max-width: min(100vw, 480px);
    margin: 0 auto;
    color: #f3f7ff;
}

.hero-contact-card__link {
    padding: clamp(0.65rem, 2vw, 1rem);
    border-radius: 16px;
    text-decoration: none;
    color: inherit;
    transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.hero-contact-card__link:hover,
.hero-contact-card__link:focus {
    background-color: rgba(255, 255, 255, 0.08);
    transform: translateY(-1px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

.hero-contact-card__link:focus-visible {
    outline: 2px solid rgba(94, 237, 151, 0.75);
    outline-offset: 3px;
}

.hero-contact-card__glyph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: clamp(42px, 9vw, 52px);
    height: clamp(42px, 9vw, 52px);
    color: #ffffff;
    border-radius: 50%;
    background: rgba(19, 32, 57, 0.32);
    border: 1px solid rgba(255, 255, 255, 0.25);
    box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.2);
    padding: 0.35rem;
}

.hero-contact-card__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 70%;
    height: 70%;
    color: #ffffff;
}

.hero-contact-card__icon svg,
.hero-contact-card__icon img {
    width: 100%;
    height: 100%;
    display: block;
}

.hero-contact-card__icon img {
    object-fit: contain;
}

/* Prevent text wrapping on desktop */
.hero-contact-card__link>span:not(.hero-contact-card__glyph) {
    white-space: nowrap;
}

.hero-contact-card__text {
    white-space: nowrap;
}

/* Mobile: horizontal layout for links with centered alignment */
@media (max-width: 639px) {

    /* Hide the divider on mobile - multiple selectors to ensure it works */
    .hero-contact-card .uk-grid-divider> :not(.uk-first-column)::before,
    .hero-contact-card .uk-grid-divider>div:not(.uk-first-column)::before {
        display: none !important;
        border-left: none !important;
    }

    /* Also target the grid divider class directly */
    .hero-contact-card .uk-grid-divider::before,
    .hero-contact-card .uk-grid-divider::after {
        display: none !important;
    }

    /* Reduce vertical gap between items */
    .hero-contact-card .uk-grid {
        margin-top: 0;
        row-gap: 0.5rem;
        /* Reduced from default uk-grid-small */
    }

    .hero-contact-card__link {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center;
        gap: 0.85rem;
    }

    /* Remove top margin on mobile to achieve vertical centering */
    .hero-contact-card__link .uk-margin-small-top {
        margin-top: 0 !important;
    }
}

/* Hero Quicklinks - Base Styles */

.hero-quicklinks--desktop {
    justify-content: flex-start;
    /* width: 100%; */
}

.hero-quicklinks__link {
    gap: 0.65rem;
    color: inherit;
}



.hero-quicklinks__icon {
    width: 56px;
    height: 56px;
    flex-shrink: 0;
}

.hero-quicklinks__icon svg {
    width: 100%;
    height: 100%;
    display: block;
}

.hero-quicklinks__category {
    color: #ffffff;
}

.hero-quicklinks__category-icon {
    height: 28px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    display: block;
}

.hero-quicklinks__category-label {
    font-size: 0.875rem;
    letter-spacing: 0.02em;
    margin-top: 0.25rem;
}

.hero-quicklinks__category-label-full {
    display: inline;
}

.hero-quicklinks__category-label-short {
    display: inline;
}

.hero-quicklinks__category-link {
    text-decoration: none;
    color: inherit;
}

.hero-quicklinks__categories--desktop {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0;
}

.hero-quicklinks__categories--desktop .hero-quicklinks__category {
    flex: 1 1 0;
    padding: clamp(0.4rem, 1.2vw, 0.6rem) clamp(0.5rem, 1vw, 0.6rem);
}

/* Mobile Styles (< 640px) */
@media (max-width: 639px) {
    .hero-quicklinks__icon {
        width: 34px;
        height: 34px;
    }

    .hero-quicklinks--mobile {
        align-items: stretch;
        padding-left: 0;
        padding-right: 0;
    }

    .hero-quicklinks__mobile-line {
        width: 100%;
        /* display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; - handled by uk-flex classes */
        gap: 0.5rem;
        padding-left: 0.35rem;
        padding-right: 0.35rem;
        flex-wrap: nowrap;
    }

    .hero-quicklinks__categories--mobile-inline {
        flex: 1;
        display: flex;
        flex-wrap: nowrap;
        gap: 0.4rem;
        justify-content: space-between;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .hero-quicklinks__category--mobile {
        padding: 0;
        flex: 0 0 auto;
        text-align: center;
        min-width: 34px;
    }

    .hero-quicklinks__category-link--badge {
        width: 48px;
        height: 48px;
        border-radius: 14px;
        border: 1px solid rgba(255, 255, 255, 0.35);
        background: rgba(255, 255, 255, 0.08);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-transform: uppercase;
        font-size: 0.875rem;
        letter-spacing: 0.12em;
        font-weight: 700;
        color: inherit;
        transition: background 0.3s ease;
    }

    .hero-quicklinks__category-link--badge:hover,
    .hero-quicklinks__category-link--badge:focus-visible {
        background: rgba(255, 255, 255, 0.25);
    }

    .hero-quicklinks__category-letter {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        line-height: 1;
    }

    .hero-quicklinks__actions {
        width: 100%;
        /* display: flex; - handled by uk-flex */
        gap: 0.5rem;
        margin-top: 0.5rem;
    }
}

/* Medium Screens (640px - 959px) */
@media (min-width: 640px) and (max-width: 959px) {
    .hero-quicklinks__category-label-full {
        display: none;
    }

    .hero-quicklinks__category-label-short {
        display: inline;
    }

    .hero-quicklinks__icon {
        width: 44px;
        height: 44px;
    }
}

/* Desktop Styles (>= 640px) */
@media (min-width: 640px) {

    /* Keep quicklinks aligned with hero text without double horizontal padding */
    .hero-section .uk-overlay-primary {
        padding-left: 0;
        padding-right: 0;
    }

    .hero-quicklinks--desktop {
        align-items: stretch;
    }

    .hero-quicklinks--desktop .hero-quicklinks__categories--desktop {
        display: flex;
        align-items: center;
        height: 100%;
    }

    .hero-quicklinks--desktop .hero-quicklinks__categories--desktop {
        align-items: stretch;
    }

    .hero-quicklinks--desktop .hero-quicklinks__category {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 100%;
    }

    .hero-quicklinks--desktop .hero-quicklinks__category a {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        padding: 0.3rem 0;
    }
}

.hero-category-modal__dialog {
    background: #ffffff;
    box-shadow: 0 28px 70px rgba(4, 18, 31, 0.35);
}

.hero-category-modal__dialog--wide {
    max-width: 1200px;
}

@media (max-width: 1199px) {
    .hero-category-modal__dialog--wide {
        width: 96vw;
    }
}

.hero-category-modal__header {
    background: linear-gradient(135deg, rgba(4, 18, 31, 0.98), rgba(6, 38, 68, 0.95));
    color: #f4f8ff;
    border-bottom: none;
    padding: var(--modal-padding);
    flex-direction: row;
    align-items: center;
    gap: 1.5rem;
}

.hero-category-modal__header-copy {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.hero-category-modal__meta-label {
    color: rgba(244, 248, 255, 0.75);
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.hero-category-modal__title {
    font-size: clamp(1.5rem, 3vw, 2.1rem);
    letter-spacing: 0.02em;
    color: #ffffff;
}

.hero-category-modal__icon {
    flex-shrink: 0;
    width: 68px;
    height: 68px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.12);
    box-shadow: inset 0 0 0 1px rgba(244, 248, 255, 0.4), 0 16px 24px rgba(0, 0, 0, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.hero-category-modal__icon img {
    width: 100%;
    height: auto;
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
}

.hero-category-modal__icon svg {
    width: 90%;
    height: 90%;
    display: block;
}

.hero-category-modal__age-label {
    display: inline-flex;
    align-self: flex-start;
    background: transparent;
    border: 1px solid rgba(244, 248, 255, 0.65);
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 0.375rem 0.75rem;
    border-radius: 4px;
    font-size: 0.875rem;
}

.hero-category-modal__body {
    padding: var(--modal-padding);
    background: #ffffff;
}

.hero-category-modal__footer {
    background: #f4f7fd;
    border-top: 1px solid rgba(4, 18, 31, 0.07);
    padding: var(--modal-padding);
    gap: 1rem;
}

.hero-category-modal__footer-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

@media (max-width: 639px) {

    .hero-category-modal__header,
    .hero-category-modal__body,
    .hero-category-modal__footer {
        padding: 1rem;
    }

    .hero-category-modal__header {
        gap: 1rem;
    }

    .hero-category-modal__icon {
        width: 56px;
        height: 56px;
    }

    .hero-category-modal__meta-label {
        display: none;
    }

    .hero-category-modal__title {
        font-size: 1.25rem;
    }

    .hero-category-modal__age-label {
        font-size: 0.875rem;
        padding: 0.25rem 0.5rem;
    }

    .hero-category-modal__meta {
        width: 100%;
        text-align: left;
        margin-top: 0.75rem;
    }

    .hero-category-modal__footer {
        flex-direction: column;
        align-items: flex-start;
    }

    .hero-category-modal__footer-actions {
        width: 100%;
        justify-content: flex-end;
    }

}

.hero-keyword {
    font-family: inherit;
    display: inline-block;
    color: inherit;
    padding: clamp(0.5rem, 2vh, 0.9rem) clamp(1.4rem, 4vw, 3.1rem);
    text-shadow: 0 8px 22px rgba(0, 0, 0, 0.48);
    box-shadow: 0 14px 24px rgba(0, 0, 0, 0.28);
    background-color: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.hero-keyword--nauka {
    background-color: rgba(4, 116, 224, 0.62);
    -webkit-clip-path: polygon(26% 0, 100% 11%, 86% 100%, 0 84%);
    clip-path: polygon(26% 0, 100% 11%, 86% 100%, 0 84%);
}

.hero-keyword--szkolenie {
    background-color: rgba(255, 227, 30, 0.58);
    -webkit-clip-path: polygon(0 24%, 75% 0%, 100% 29%, 100% 100%, 4% 89%);
    clip-path: polygon(0 24%, 75% 0%, 100% 29%, 100% 100%, 4% 89%);
}

.hero-keyword--pasja {
    background-color: rgba(238, 0, 135, 0.6);
    -webkit-clip-path: polygon(0 0, 100% 21%, 86% 87%, 6% 100%, 18% 43%);
    clip-path: polygon(0 0, 100% 21%, 86% 87%, 6% 100%, 18% 43%);
}

@media (max-width: 959px) {
    .hero-section__content {
        padding-top: clamp(3rem, 18vh, 6rem);
    }

    .hero-section__title {
        letter-spacing: -0.005em;
    }
}

@media (max-width: 639px) {
    :root {
        --hero-mobile-footer-height: clamp(180px, 34vw, 240px);
    }

    .hero-section {
        min-height: min(620px, 100vh);
    }

    .hero-section__inner {
        box-sizing: border-box;
    }

    .hero-section__content {
        align-items: stretch;
        justify-content: center;
        min-height: calc(100vh - var(--site-nav-height) - var(--hero-mobile-footer-height));
        padding-top: calc(var(--site-nav-height) + clamp(1rem, 4vw, 2rem));
        padding-bottom: calc(var(--hero-mobile-footer-height) + clamp(1rem, 4vw, 2rem));
    }

    .hero-heading-stack {
        text-align: left;
        margin-top: 2.5rem;
    }

    .hero-cta__buttons {
        width: 100%;
        box-sizing: border-box;
        margin-left: 0;
        margin-right: 0;
        padding-left: 0;
        padding-right: 0;
        /* Override flex gap on mobile - spacing handled by margin-top on grid items */
        gap: 0;
    }

    .hero-cta__buttons.uk-grid {
        margin-left: 0;
        /* Reset UIkit grid margins for consistent spacing */
        margin-top: 0;
    }

    .hero-cta__buttons.uk-grid>* {
        padding-left: 0;
        /* Override UIkit grid margin with consistent gap matching hero-copy */
        margin-top: 0;
    }

    .hero-cta__buttons.uk-grid>*+* {
        /* Apply consistent gap between buttons, matching hero-copy gap */
        margin-top: clamp(0.85rem, 2.2vw, 1.5rem);
    }

    .hero-cta__primary,
    .hero-cta__secondary,
    .hero-cta__messenger {
        width: 100%;
        justify-content: center;
    }

    .coverage-section__title {
        margin-bottom: 1.5rem;
    }

    .hero-section__title {
        font-size: clamp(2.4rem, 8vw, 3.4rem);
        text-shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
    }

    .hero-metrics__list {
        gap: 0.6rem 0.9rem;
    }

    .hero-metrics__item {
        width: 100%;
    }

    .hero-metrics__text {
        white-space: normal;
    }

}

@media (max-width: 639px) {
    .hero-quicklinks__actions {
        display: none;
    }
}

.about-section {
    position: relative;
    padding-top: var(--section-padding-y);
    padding-bottom: clamp(1.5rem, 4vw, 3.5rem);
    overflow: visible;
}

.about-section__layout {
    align-items: stretch;
}

.about-section__text {
    max-width: 720px;
}

.about-section__text>*+* {
    margin-top: 1.1rem;
}

.about-section__signature {
    margin-top: clamp(1.25rem, 3vw, 2.5rem);
    visibility: hidden;
}

.about-section__signature-graphic {
    display: block;
    width: 100%;
    max-width: 320px;
}

.about-section__signature--visible {
    visibility: visible;
}

.about-section__signature path {
    animation-play-state: paused !important;
}

.about-section__signature--visible path {
    animation-play-state: running !important;
}

@media (prefers-reduced-motion: reduce) {
    .about-section__signature path {
        animation: none !important;
        stroke-dashoffset: 0 !important;
    }
}

.about-section__photo {
    overflow: visible;
}

.about-section__photo img {
    display: block;
    width: min(100%, 360px);
}

@media (min-width: 960px) {
    .about-section__layout {
        overflow: visible;
    }

    .about-section__layout>.about-section__photo {
        flex-basis: clamp(360px, 42vw, 560px);
        margin-right: clamp(-160px, -8vw, -64px);
        margin-bottom: clamp(-56px, -7vw, -140px);
    }

    .about-section__layout>.about-section__photo img {
        width: 100%;
        max-width: none;
    }
}

.tm-metoda {
    background: linear-gradient(180deg, #fff9ed 0%, #fffef6 100%);
    padding: clamp(3.5rem, 6vw, 6rem) 0;
}

.tm-metoda__content {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}

.tm-metoda__content>*+* {
    margin-top: 1.1rem;
}

.tm-metoda__awards {
    padding-top: clamp(2rem, 4vw, 3.5rem);
}

.tm-metoda__award-image {
    display: flex;
    justify-content: center;
    align-items: center;
}

.tm-metoda__award-image--tilt-left {
    transform: rotate(20deg);
}

.tm-metoda__award-image--tilt-right {
    transform: rotate(-20deg);
}

.tm-metoda__award-image img {
    max-width: 100%;
    height: auto;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
}

.tm-course-roadmap {
    position: relative;
    background: radial-gradient(circle at center, #f8f9fa 0%, #e9ecef 100%);
    padding: clamp(3.2rem, 6vw, 6rem) 0;
    overflow: hidden;
}

.tm-course-roadmap__car,
.tm-course-roadmap__bike {
    /* Slight glow to make the vehicles pop on light backgrounds */
    filter: drop-shadow(0 6px 10px rgba(17, 36, 59, 0.25));
    /* Use CSS animations that work cross-browser */
    animation: none;
}

.tm-course-roadmap.has-roadmap-animations .tm-course-roadmap__car,
.tm-course-roadmap.has-roadmap-animations .tm-course-roadmap__bike {
    opacity: 0;
}

.tm-course-roadmap.has-roadmap-animations .tm-course-roadmap__car.is-active,
.tm-course-roadmap.has-roadmap-animations .tm-course-roadmap__bike.is-active {
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {

    .tm-course-roadmap__car,
    .tm-course-roadmap__bike {
        display: none;
    }
}

.tm-course-roadmap::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    /* sits under the road, above base background */
}

.tm-course-roadmap>.uk-container {
    position: relative;
    z-index: 2;
    /* keep cards above road */
}

.tm-course-roadmap__intro {
    max-width: 760px;
    margin: 0 auto;
}

.tm-eyebrow {
    display: inline-block;
    text-transform: uppercase;
    letter-spacing: 0.4em;
    font-size: 0.875rem;
    font-weight: 600;
    color: rgba(17, 36, 59, 0.75);
    /* Increased from 0.6 for WCAG contrast */
    margin-bottom: 0.6rem;
}

.tm-course-roadmap__intro h2 {
    color: var(--color-primary-dark);
    margin-bottom: 1rem;
}

/* Reusable lead paragraph - used across multiple sections */
.tm-lead {
    color: var(--color-text-muted);
    max-width: 60ch;
    margin: 0 auto;
    line-height: 1.6;
}

/* Timeline layout around the SVG "road" */
.tm-roadmap-container {
    position: relative;
    max-width: 1000px;
    margin: 0 auto;
    overflow: hidden;
}

.tm-roadmap-background {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 50px;
    z-index: 0;
}

.tm-roadmap-background svg path[stroke-dasharray] {
    stroke-width: 2 !important;
    stroke-dasharray: 16 16 !important;
}

.tm-roadmap-steps {
    position: relative;
    z-index: 2;
    padding-top: 0;
}

.tm-roadmap-step {
    display: flex;
    align-items: center;
    margin-bottom: 0;
    height: 250px;
    position: relative;
}

.tm-roadmap-step__content,
.tm-roadmap-step__spacer {
    flex: 1;
    padding: 0 40px;
    transition: transform 0.3s ease;
    position: relative;
}

.tm-roadmap-step__marker {
    width: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 3;
}

.tm-roadmap-step__marker-circle {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #2f83ff;
    border: none;
    color: #fff;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

.tm-roadmap-step--left .tm-roadmap-step__content {
    order: 1;
    text-align: right;
}

.tm-roadmap-step--left .tm-roadmap-step__marker {
    order: 2;
}

.tm-roadmap-step--left .tm-roadmap-step__spacer {
    order: 3;
}

.tm-roadmap-step--right .tm-roadmap-step__content {
    order: 3;
    text-align: left;
}

.tm-roadmap-step--right .tm-roadmap-step__marker {
    order: 2;
}

.tm-roadmap-step--right .tm-roadmap-step__spacer {
    order: 1;
}

.tm-roadmap-svg-mobile {
    display: none;
}

.tm-roadmap-svg-desktop {
    display: block;
}

@media (min-width: 960px) {
    .tm-roadmap-background {
        width: 400px;
    }

    .tm-roadmap-container--curvy .tm-roadmap-step--left .tm-roadmap-step__content {
        transform: translateX(30px);
    }

    .tm-roadmap-container--curvy .tm-roadmap-step--right .tm-roadmap-step__content {
        transform: translateX(-30px);
    }

    .tm-roadmap-step {
        align-items: center;
        padding-top: 30px;
    }

    .tm-roadmap-step__content,
    .tm-roadmap-step__spacer {
        padding: 0 80px;
    }

    .tm-roadmap-step--left .tm-course-roadmap__step-heading {
        justify-content: flex-end;
    }

    .tm-roadmap-step--right .tm-course-roadmap__step-heading {
        flex-direction: row-reverse;
        justify-content: flex-end;
    }


}

@media (max-width: 959px) {
    .tm-roadmap-svg-desktop {
        display: none;
    }

    .tm-roadmap-svg-mobile {
        display: block;
    }

    .tm-roadmap-step {
        height: auto;
        min-height: 150px;
        margin-bottom: 40px;
        justify-content: flex-start;
        align-items: flex-start;
        padding-top: 30px;
    }

    .tm-roadmap-background {
        left: 0;
        transform: none;
        width: 100px;
    }

    .tm-roadmap-step__marker {
        order: 1 !important;
        width: 100px;
        justify-content: center;
    }

    .tm-roadmap-step__marker-circle {
        width: 56px;
        height: 56px;
    }

    .tm-roadmap-step__content {
        order: 2 !important;
        text-align: left !important;
        padding-left: 50px;
        padding-right: 0;
    }

    .tm-course-roadmap__step-title {
        position: relative;
    }

    .tm-course-roadmap__step-title::after {
        content: "";
        position: absolute;
        bottom: -2px;
        height: 2px;
        background: #2f83ff;
        width: 0;
        right: 100%;
    }

    .tm-roadmap-step__spacer {
        display: none;
    }
}

.tm-course-roadmap__step-card {
    --tm-course-accent: #2f83ff;
    --tm-course-accent-soft: rgba(47, 131, 255, 0.12);
    position: relative;
    min-height: 100%;
    background: transparent;
    padding: 0;
    border: none;
    box-shadow: none;
    overflow: visible;
}

.tm-course-roadmap__step-card::before,
.tm-course-roadmap__step-card::after {
    display: none;
}

.tm-course-roadmap__step-card>* {
    position: relative;
    z-index: 1;
}

.tm-course-roadmap__step-card h3 {
    color: var(--color-primary-dark);
    margin-bottom: 0.75rem;
}

/* Inline heading for roadmap step: number + title */
.tm-course-roadmap__step-heading {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    margin-bottom: 0.75rem;
}

/* title should be visually the same size as the pill (larger than the bare number) */
.tm-course-roadmap__step-heading .tm-course-roadmap__step-title {
    margin: 0;
    font-family: var(--font-display);
    font-size: clamp(2.2rem, 4.5vw, 3.2rem);
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--color-primary-dark);
    line-height: 1;
    border-bottom: 2px solid var(--color-accent-blue);
    padding-bottom: 4px;
}

@media (max-width: 639px) {
    .tm-course-roadmap__step-heading {
        gap: 0.6rem;
    }

    .tm-course-roadmap__step-heading .tm-course-roadmap__step-title {
        font-size: clamp(1.2rem, 6vw, 1.6rem);
    }
}

.tm-course-roadmap__step-card p {
    color: rgba(17, 36, 59, 0.78);
    line-height: 1.55;
}

.tm-course-roadmap__step-card--szkolenie {
    --tm-course-accent: #f5c518;
    --tm-course-accent-soft: rgba(245, 197, 24, 0.16);
}

.tm-course-roadmap__step-card--pasja {
    --tm-course-accent: #e0007a;
    --tm-course-accent-soft: rgba(224, 0, 122, 0.15);
}



.tm-metoda__icon {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: clamp(1.5rem, 4vw, 2.8rem);
}

.tm-metoda__icon::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: clamp(200px, 28vw, 320px);
    aspect-ratio: 1;
    transform: translate(-50%, -52%);
    z-index: 0;
    pointer-events: none;
}

.tm-metoda__icon img,
.tm-metoda__icon svg {
    position: relative;
    z-index: 1;
    width: clamp(200px, 28vw, 320px);
    max-width: 100%;
    height: auto;
    display: block;
}

@media (max-width: 959px) {
    .about-section {
        padding: clamp(3rem, 8vw, 5rem) 0;
    }

    .tm-metoda {
        padding: clamp(3rem, 8vw, 5.5rem) 0;
    }

    .tm-course-roadmap {
        padding: clamp(2.8rem, 9vw, 5rem) 0;
    }
}

@media (max-width: 639px) {
    .about-section__text {
        max-width: 100%;
    }

    .tm-metoda__icon {
        padding-bottom: clamp(0.5rem, 6vw, 1.5rem);
    }

    .tm-metoda__content {
        text-align: left;
    }

    .tm-metoda__awards {
        padding-top: clamp(1.5rem, 5vw, 2.5rem);
    }

    .tm-course-roadmap__step-card::after {
        inset: 1rem;
    }

}

.tm-testimonial-card {
    border: 1px dashed rgba(17, 36, 59, 0.25);
    margin-bottom: 1rem;
}

.tm-testimonial-card.uk-overflow-hidden {
    border: none;
}

.tm-testimonial-card.uk-overflow-hidden img {
    display: block;
}

.tm-testimonial__logo {
    width: 24px;
    height: 24px;
    display: inline-block;
    flex-shrink: 0;
}

/* Testimonial source link - subtle link icon */
.tm-testimonial__source-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: rgba(17, 36, 59, 0.06);
    color: rgba(17, 36, 59, 0.5);
    text-decoration: none;
    transition: all 0.2s ease-in-out;
    flex-shrink: 0;
}

.tm-testimonial__source-link:hover {
    background: var(--color-primary-dark);
    color: #fff;
    transform: scale(1.1);
}

/* Review Platform Links - Testimonials Section */
.tm-review-platforms {
    padding: clamp(1rem, 3vw, 1.5rem);
    background: linear-gradient(135deg, rgba(47, 131, 255, 0.04) 0%, rgba(53, 199, 109, 0.04) 100%);
    border-radius: 16px;
    border: 1px dashed rgba(17, 36, 59, 0.15);
}

.tm-review-platforms__label {
    font-size: 0.9375rem;
    color: var(--color-primary-dark);
    margin: 0 0 0.75rem 0;
    letter-spacing: 0.01em;
}

.tm-review-platforms__links {
    gap: 0.625rem;
}

.tm-review-platforms__link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 1rem;
    background: #fff;
    border: 1px solid rgba(17, 36, 59, 0.1);
    border-radius: 999px;
    color: var(--color-primary-dark);
    font-size: 0.8125rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
    box-shadow: 0 2px 8px rgba(17, 36, 59, 0.06);
}

.tm-review-platforms__link:hover {
    background: var(--color-primary-dark);
    color: #fff;
    border-color: var(--color-primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(17, 36, 59, 0.15);
    text-decoration: none;
}

.tm-review-platforms__link:hover .uk-icon {
    color: #fff;
}

.tm-review-platforms__link .uk-icon {
    flex-shrink: 0;
    transition: color 0.2s ease-in-out;
}

.tm-review-platforms__link-text {
    white-space: nowrap;
}

.tm-review-platforms__icon {
    width: 24px;
    height: 24px;
    display: inline-block;
}

/* Desktop variant */
.tm-review-platforms--desktop {
    margin-bottom: 0.75rem;
}

/* Mobile variant */
.tm-review-platforms--mobile {
    text-align: center;
}

.tm-review-platforms--mobile .tm-review-platforms__links {
    justify-content: center;
}

@media (max-width: 639px) {
    .tm-review-platforms {
        padding: clamp(0.875rem, 4vw, 1.25rem);
    }

    .tm-review-platforms__link {
        padding: 0.4rem 0.75rem;
        font-size: 0.75rem;
    }
}

.coverage-section {
    position: relative;
    padding: clamp(3rem, 6vw, 5.5rem) 0;
    overflow: hidden;
    background-color: #ffffff;
}

.coverage-section__background {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.coverage-section__background-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 0.25) 80%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 55%, rgba(0, 0, 0, 0.25) 80%, rgba(0, 0, 0, 0) 100%);
}

.coverage-section__fade {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(246, 248, 252, 0) 0%, rgba(246, 248, 252, 0.75) 55%, rgba(246, 248, 252, 1) 90%, #ffffff 100%);
    pointer-events: none;
}

.coverage-section__content-wrapper {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-height: clamp(20rem, 60vw, 30rem);
}

.coverage-section__content {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
    padding: clamp(1.5rem, 4vw, 3rem);
    max-width: 32rem;
}

.coverage-section__heading {
    display: grid;
    gap: 0.5rem;
    justify-items: start;
}

.coverage-section__details {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.coverage-section__title {
    margin: 0;
}

.coverage-section__description {
    font-size: 1rem;
    max-width: 32ch;
    margin: 0;
}

.coverage-section__list {
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0.65rem clamp(1.75rem, 5vw, 3rem);
}

.coverage-section__list li {
    position: relative;
    padding-left: 1.4rem;
}

.coverage-section__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.65em;
    width: 0.45rem;
    height: 0.45rem;
    border-radius: 50%;
    background: linear-gradient(135deg, #2f83ff 0%, #35c76d 100%);
    transform: translateY(-50%);
}

@media (max-width: 959px) {
    .coverage-section__content-wrapper {
        justify-content: center;
    }

    .coverage-section__content {
        padding: clamp(1.25rem, 6vw, 2.5rem);
    }
}

@media (max-width: 639px) {
    .coverage-section {
        overflow: visible;
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas:
            "coverage-heading"
            "coverage-map"
            "coverage-details";
        gap: 1.5rem;
    }

    .coverage-section__background {
        position: static;
        grid-area: coverage-map;
        justify-self: center;
        margin: 0 1rem;
        width: 100%;
        max-width: 420px;
        border-radius: 18px;
        overflow: hidden;
        box-shadow: 0 18px 38px rgba(17, 32, 52, 0.2);
    }

    .coverage-section__background-image {
        display: block;
        -webkit-mask-image: none;
        mask-image: none;
        height: auto;
    }

    .coverage-section__fade {
        display: none;
    }

    .coverage-section>.uk-container,
    .coverage-section__content-wrapper,
    .coverage-section__content {
        display: contents;
    }

    .coverage-section__heading {
        grid-area: coverage-heading;
        text-align: center;
        padding: 0 1rem;
    }

    .coverage-section__details {
        grid-area: coverage-details;
        align-items: center;
        text-align: center;
        gap: 1.1rem;
        padding: 0 1rem 0;
    }

    .coverage-section__description {
        max-width: 36ch;
    }

    .coverage-section__list li {
        padding-left: 0;
    }

    .coverage-section__list li::before {
        display: none;
    }
}

/* Coverage Section CTA - Button Styling (matches locations section) */
.coverage-section__cta {
    margin-top: 1rem;
}

.coverage-section__contact {
    gap: 0.75rem 1rem;
}

.coverage-section__contact-btn {
    font-size: 0.8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 999px;
    height: 36px;
    line-height: 34px;
    padding: 0 16px;
    box-shadow: 0 4px 12px rgba(17, 36, 59, 0.12);
    transition: all 0.2s ease-in-out;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.coverage-section__contact-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(17, 36, 59, 0.18);
}

.coverage-section__contact-btn.uk-button-primary {
    background: var(--gradient-accent-blue);
    border: none;
    color: #fff;
}

.coverage-section__contact-btn.uk-button-default {
    background: #fff;
    color: var(--color-primary-dark);
    border: 1px solid rgba(17, 36, 59, 0.1);
}

/* Coverage section Messenger sprite icon */
.coverage-section__messenger-icon {
    width: 16px;
    height: 16px;
    display: inline-block;
    vertical-align: middle;
}

/* FAQ contact Messenger sprite icon */
.faq-contact__messenger-icon {
    width: 15px;
    height: 15px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 0.25rem;
}

@media (max-width: 639px) {
    .coverage-section__contact {
        flex-direction: column;
        gap: 0.75rem;
        width: 100%;
        max-width: 320px;
    }

    .coverage-section__contact-btn {
        width: 100%;
        justify-content: center;
    }
}

.tm-locations {
    position: relative;
    overflow: hidden;
    background-color: #f3f6fb;
    color: var(--color-primary-dark);
}

.tm-locations__background {
    position: absolute;
    inset: 0;
    z-index: 0;
    filter: grayscale(30%);
    pointer-events: none;
}

.tm-locations__background img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tm-locations__background-frame {
    width: 100%;
    height: 100%;
    border: 0;
    pointer-events: none;
}

.tm-locations__background-overlay {
    background: linear-gradient(180deg, rgba(243, 246, 250, 0.94) 0%, rgba(243, 246, 250, 0.78) 45%, rgba(243, 246, 250, 0.94) 100%);
    z-index: 1;
    pointer-events: none;
}

.tm-locations .uk-container {
    position: relative;
    z-index: 2;
}

.tm-locations__card {
    border-radius: 18px;
    box-shadow: 0 22px 48px rgba(17, 36, 59, 0.18);
    overflow: visible;
    background-color: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.45);
}

.tm-locations__card-header {
    padding: 20px 24px;
    border-bottom: 1px solid rgba(17, 36, 59, 0.08);
    background: rgba(243, 246, 250, 0.66);
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
}

.tm-locations__card-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(17, 36, 59, 0.08);
    color: rgba(17, 36, 59, 0.85);
}

.tm-locations__card-title {
    color: var(--color-primary-dark);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.tm-locations__card-body {
    padding: 24px;
}

.tm-locations__media {
    position: relative;
    overflow: visible;
    background: rgba(17, 36, 59, 0.02);
}

.tm-locations__photo {
    position: relative;
    min-height: 220px;
    overflow: hidden;
    border-bottom: 1px solid rgba(17, 36, 59, 0.08);
}

.tm-locations__photo canvas {
    width: 100%;
    height: auto;
    display: block;
}

.tm-locations__photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tm-locations__photo-placeholder {
    position: absolute;
    inset: 0;
    background: linear-gradient(145deg, rgba(17, 36, 59, 0.1), rgba(17, 36, 59, 0.02));
    color: rgba(17, 36, 59, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.tm-locations__mini-map {
    --tm-mini-map-size: clamp(140px, 32%, 180px);
    position: absolute;
    right: 1rem;
    top: 0;
    transform: translate(20%, -45%);
    width: var(--tm-mini-map-size);
    height: var(--tm-mini-map-size);
    aspect-ratio: 1 / 1;
    border-radius: 0;
    overflow: hidden;
    background: #fff;
    z-index: 3;
    border: 3px solid rgba(255, 255, 255, 0.9);
    box-shadow: 0 10px 30px rgba(17, 36, 59, 0.25);
}

.tm-locations__mini-map img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tm-locations__mini-map-link {
    display: block;
}

@media (max-width: 639px) {
    .tm-locations__mini-map {
        --tm-mini-map-size: min(70%, 220px);
        position: static;
        transform: none;
        margin: 0.75rem auto 0;
        width: var(--tm-mini-map-size);
        height: var(--tm-mini-map-size);
        aspect-ratio: 1 / 1;
    }
}

.tm-locations__card-footer {
    gap: 0.5rem;
    border-top: 1px solid rgba(17, 36, 59, 0.08);
    background-color: rgba(243, 246, 250, 0.6);
    border-bottom-left-radius: 18px;
    border-bottom-right-radius: 18px;
}

@media (max-width: 639px) {
    .tm-locations__card-footer {
        flex-wrap: nowrap !important;
        justify-content: flex-end !important;
        gap: 4px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

.tm-locations__actions {
    gap: 0.25rem;
}

@media (max-width: 639px) {
    .tm-locations__actions {
        flex-wrap: nowrap !important;
        gap: 4px !important;
    }
}

.tm-locations__actions .uk-button {
    font-size: 0.8125rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border-radius: 999px;
    height: 36px;
    line-height: 34px;
    padding: 0 16px;
    box-shadow: 0 4px 12px rgba(17, 36, 59, 0.12);
    transition: all 0.2s ease-in-out;
}

@media (max-width: 639px) {
    .tm-locations__button-icon {
        display: none !important;
    }

    .tm-locations__actions .uk-button {
        padding: 0 8px;
        margin-right: 0 !important;
        margin-bottom: 0 !important;
        font-size: 0.75rem;
        flex-shrink: 0;
    }
}

.tm-locations__button-icon {
    width: 18px;
    height: 18px;
    display: inline-block;
    vertical-align: middle;
}

.tm-locations__actions .uk-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(17, 36, 59, 0.18);
}

.tm-locations__actions .uk-button-primary {
    background: var(--gradient-accent-blue);
    border: none;
    color: #fff;
}

.tm-locations__actions .uk-button-text {
    background: #fff;
    color: var(--color-primary-dark);
    border: 1px solid rgba(17, 36, 59, 0.1);
    text-decoration: none !important;
}

.tm-locations__actions .uk-button-text::before {
    display: none;
}

@media (min-width: 960px) {
    .tm-locations__card-header {
        padding: 22px 28px;
    }

    .tm-locations__card-body {
        padding: 28px;
    }
}

.site-nav-wrapper {
    height: 88px;
    position: relative;
    z-index: 30;
}

@media (max-width: 959px) {
    .template-homepage .site-nav-wrapper {
        height: 0;
        /* Remove height wrapper so it doesn't push content down on homepage (overlay hero) */
    }

    .template-homepage .site-navbar-container {
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    .template-homepage .site-navbar__toggle .uk-navbar-toggle {
        color: #ffffff !important;
    }

    /* Hide "Menu" text, keep icon */
    .site-navbar__toggle .uk-margin-small-left {
        display: none;
    }

    /* Smaller logo on mobile */
    .site-navbar .uk-logo img {
        max-height: 40px;
    }
}

.site-navbar-container {
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 18px 36px rgba(17, 36, 59, 0.08);
    backdrop-filter: blur(14px);
    position: relative;
    z-index: 40;
}

.site-navbar {
    min-height: 80px;
}

.site-navbar .uk-logo img,
.site-mobile-nav__logo img {
    max-height: 62px;
}

.site-navbar__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem 1.5rem;
    flex: 1 1 auto;
    min-width: 0;
}

.site-navbar__nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem 1.5rem;
    font-family: 'Montserrat', 'Helvetica Neue', 'Segoe UI', Arial, sans-serif;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.site-navbar__nav>li>a {
    color: var(--color-primary-dark);
    padding: 0;
    position: relative;
    transition: color 0.2s ease;
}

.site-navbar__nav>li>a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -0.4rem;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, #2f83ff 0%, #35c76d 100%);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.25s ease;
}

.site-navbar__nav>li>a:hover,
.site-navbar__nav>li>a:focus-visible {
    color: var(--color-accent-blue);
}

.site-navbar__nav>li>a:hover::after,
.site-navbar__nav>li>a:focus-visible::after {
    transform: scaleX(1);
}

.site-navbar__cta {
    border-radius: 999px;
    padding: 0.45rem 1.6rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.site-navbar__toggle .uk-navbar-toggle {
    background: transparent;
    border: none;
    padding: 0;
    color: var(--color-primary-dark);
}

.site-navbar__toggle .uk-navbar-toggle:hover,
.site-navbar__toggle .uk-navbar-toggle:focus-visible {
    color: var(--color-accent-blue);
}

.site-mobile-nav {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.site-mobile-nav__list li a {
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: var(--color-primary-dark);
    padding: 0.4rem 0;
}

.site-mobile-nav__cta {
    border-radius: 16px;
    box-shadow: 0 16px 30px rgba(47, 131, 255, 0.35);
    font-size: 0.875rem;
    padding: 0.45rem 1.2rem;
}

/* ==========================================================================
   Desktop Dropdown Navigation (UIkit navbar-dropdown)
   ========================================================================== */

/* Style UIkit navbar dropdowns to match site design */
.site-navbar .uk-navbar-dropdown {
    min-width: 180px;
    padding: 0.75rem 0;
    background: var(--color-primary-dark);
    border-radius: 8px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.25), 0 4px 12px rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.1);
    margin-top: 0;
}

.site-navbar .uk-navbar-dropdown-nav {
    font-family: var(--font-primary);
}

.site-navbar .uk-navbar-dropdown-nav>li>a {
    display: block;
    padding: 0.65rem 1.25rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.9);
    transition: background-color 0.15s ease, color 0.15s ease, padding-left 0.15s ease;
}

.site-navbar .uk-navbar-dropdown-nav>li>a:hover,
.site-navbar .uk-navbar-dropdown-nav>li>a:focus-visible {
    background: rgba(255, 255, 255, 0.08);
    color: var(--color-accent-blue);
    padding-left: 1.5rem;
}

/* Parent nav items with dropdowns - show chevron indicator */
.site-navbar__nav>li:has(.uk-navbar-dropdown)>a::after {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 0.4rem;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid currentColor;
    transition: transform 0.2s ease;
    vertical-align: middle;
}

.site-navbar__nav>li.uk-open:has(.uk-navbar-dropdown)>a::after {
    transform: rotate(180deg);
}

/* ==========================================================================
   Mobile Hierarchical Navigation
   ========================================================================== */

/* Group label (main category header in mobile) */
.site-mobile-nav__group {
    margin-top: 1rem;
    margin-bottom: 0.25rem;
}

.site-mobile-nav__group-label {
    display: block;
    padding: 0.5rem 0;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

/* Subcategory items with left offset */
.site-mobile-nav__subitem {
    padding-left: 1rem;
    position: relative;
}

.site-mobile-nav__subitem::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.3);
}

.site-mobile-nav__subitem a {
    font-size: 0.9em !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.85) !important;
}

.site-mobile-nav__subitem a:hover,
.site-mobile-nav__subitem a:focus-visible {
    color: var(--color-accent-blue) !important;
}

/* Visual divider between groups */
.site-mobile-nav__divider {
    height: 1px;
    margin: 0.75rem 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.2) 0%, transparent 100%);
}

.site-footer {
    margin-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    /* Tighter footer spacing */
    padding-top: clamp(1.5rem, 3vw, 2rem);
    padding-bottom: clamp(1rem, 2vw, 1.25rem);
}

.site-footer__brand .uk-flex {
    gap: 1.5rem;
}

.site-footer__logo img {
    max-height: 72px;
}

.site-footer__brand-copy {
    max-width: 320px;
}

.site-footer__sections {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.site-footer__sections .uk-grid-divider {
    border-color: rgba(255, 255, 255, 0.12);
}

.site-footer__sections .uk-grid-divider>* {
    padding-top: 15px;
    padding-bottom: 15px;
}

@media (min-width: 960px) {
    .site-footer__sections {
        margin-left: auto;
    }
}


.site-footer__summary {
    color: rgba(255, 255, 255, 0.92);
    font-weight: 600;
}

.site-footer__coverage {
    color: rgba(255, 255, 255, 0.72);
}

.site-footer__socials .uk-icon-button {
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: #fff;
}

.site-footer__nav li+li {
    margin-top: 0.3rem;
}

.site-footer__nav a {
    color: rgba(255, 255, 255, 0.85);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.875rem;
}

.site-footer__nav a:hover,
.site-footer__nav a:focus-visible {
    color: #7fd5ff;
}

@media (max-width: 639px) {
    .site-footer__nav a {
        font-size: 0.7rem;
        letter-spacing: 0.04em;
    }
}


.site-footer__bottom {
    margin-top: clamp(0.75rem, 2.5vw, 1.5rem);
    padding-top: 1rem;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.site-footer__legal {
    gap: 0.25rem;
}

.site-footer__legal .uk-link-text {
    color: rgba(255, 255, 255, 0.85);
    font-weight: 500;
    transition: color 0.2s ease;
}

.site-footer__legal .uk-link-text:hover,
.site-footer__legal .uk-link-text:focus-visible {
    color: #7fd5ff;
}

.site-footer__actions {
    gap: 0.75rem;
}

.site-footer__go-up {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 999px;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

@media (max-width: 959px) {
    .site-footer__brand .uk-flex {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 639px) {
    .site-footer__bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 1rem;
    }

    .site-footer__legal {
        gap: 0.5rem;
    }

    .site-footer__actions {
        width: 100%;
        justify-content: space-between;
    }
}

.site-offcanvas-bar {
    background: linear-gradient(135deg, #11243b 0%, #1a3652 100%);
    color: #ffffff;
}

.site-offcanvas-bar .uk-offcanvas-close {
    color: #ffffff;
}

.site-offcanvas-bar .uk-offcanvas-close:hover {
    color: var(--color-accent-blue);
}

.site-mobile-nav__list li a {
    color: #ffffff !important;
}

.site-mobile-nav__list li a:hover,
.site-mobile-nav__list li a:focus-visible {
    color: var(--color-accent-blue) !important;
}

@media (max-width: 1199px) {
    .site-navbar__nav {
        font-size: 0.875rem;
        gap: 0.4rem 1rem;
    }
}

/* Messenger FAB */
.messenger-fab-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(12px);
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.messenger-fab-container--visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.messenger-fab {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #ffffff;
    color: #0866ff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.3s ease, background-color 0.2s ease, color 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
}

.messenger-fab:hover,
.messenger-fab:focus {
    background-color: #f0f4ff;
    color: #0653d8;
    transform: scale(1.1);
    box-shadow: 0 8px 24px rgba(0, 132, 255, 0.4);
    outline: none;
}

.messenger-fab:focus-visible {
    outline: 3px solid rgba(8, 102, 255, 0.35);
    outline-offset: 3px;
}

.messenger-fab img,
.messenger-fab svg,
.messenger-fab__icon {
    width: 32px;
    height: 32px;
    display: block;
}

/* Mobile Hero Redesign Styles */

@media (max-width: 639px) {
    .hero-mobile-content {
        padding-top: 6rem;
        /* Increased top padding to push content down? No, user wants title HIGHER. */
        /* Actually, the hero content is centered by .hero-section__content flex. 
           To move title higher, we might need to adjust the flex alignment or margins. 
           Let's try reducing top padding if it was large, or adding negative margin.
           Wait, .hero-section__content has large padding. 
           Let's adjust .hero-mobile-content to take up more space or position itself.
           
           Better approach: The parent .hero-section__content is flex-center. 
           To separate elements (title up, buttons down), we can make .hero-mobile-content 
           flex-column and justify-content: space-between if it had height.
           
           For now, let's just add margin-bottom to the title/date/cards group 
           and margin-top to buttons to push them apart.
        */
        padding-top: 1rem;
        padding-bottom: 1rem;
        text-align: center;
        color: #ffffff;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        min-height: 60vh;
        /* Ensure it takes up space to allow spreading */
    }

    .hero-mobile-title {
        font-family: var(--font-display);
        font-weight: 700;
        font-size: 3.5rem;
        line-height: 1;
        letter-spacing: 0.05em;
        color: #ffffff;
        text-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
        margin-top: 0;
        /* Ensure no extra top margin */
    }

    .hero-mobile-date {
        font-family: var(--font-primary);
        color: #ffffff;
        text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    }

    .hero-mobile-cards {
        margin-left: -4px;
    }

    .hero-mobile-cards>* {
        padding-left: 4px;
    }

    .hero-mobile-card {
        height: 60px;
        font-family: var(--font-display);
        font-size: 1.7rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        color: #ffffff;
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
        /* Added for WCAG contrast */
        filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.2));
        transition: transform 0.2s ease;
        text-transform: uppercase;
        /* Ensure text doesn't overflow the clipped area */
        white-space: nowrap;
    }

    .hero-mobile-card--nauka {
        background-color: #1e87f0;
        border-radius: 8px 0 0 8px;
        clip-path: polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
        margin-right: -4px;
    }

    .hero-mobile-card--szkolenie {
        background-color: #c9a227;
        border-radius: 0 8px 8px 0;
        clip-path: polygon(10px 0, 100% 0, 100% 100%, 0 100%);
        margin-left: -4px;
    }

    .hero-mobile-card--pasja {
        background-color: #9c27b0;
        border-radius: 8px;
    }

    .hero-mobile-buttons {
        width: 100%;
        gap: 0.75rem;
        margin-top: 0;
        /* Let cards' margin handle the spacing */
        padding-top: 2rem;
        /* Add some space from cards */
    }

    .hero-mobile-button {
        font-weight: 700;
        font-size: 1rem;
        letter-spacing: 0.05em;
        border-radius: 8px;
        padding: 0 1.5rem;
        height: 56px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.25);
        text-shadow: none;
    }

    .hero-mobile-button--phone {
        background-color: #1976d2;
        /* Darkened from #1e87f0 for WCAG contrast */
        color: #ffffff;
        border: none;
    }

    .hero-mobile-button--messenger {
        background-color: #0066cc;
        /* Darkened from #0084ff for WCAG contrast */
        color: #ffffff;
        border: none;
    }

    /* Adjust quicklinks spacing if needed */
    .hero-quicklinks--mobile {
        padding-top: 0.5rem;
    }
}

/* Accessibility: Respect user's motion preferences */
@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }

    /* Disable UIkit scrollspy animations */
    [uk-scrollspy] {
        animation: none !important;
    }
}

/* ============================================
   SEO 2025 Improvements - Additional Styles
   ============================================ */

/* CLS Guard: Prevent layout shift when JS populates course info */
#desktop-course-info {
    min-height: 48px;
}

/* Hero Intro Paragraph */
.hero-section__intro {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    color: rgba(255, 255, 255, 0.95);
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
    font-size: clamp(0.95rem, 2vw, 1.1rem);
    line-height: 1.6;
}

.hero-section__intro strong {
    color: #5eed97;
}

/* Hero Social Proof Line */
.hero-section__social-proof {
    color: rgba(255, 255, 255, 0.8) !important;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    font-size: clamp(0.85rem, 1.8vw, 0.95rem);
}

/* Mobile Hero Value Stack */
.hero-mobile-value-stack {
    text-align: center;
    color: #ffffff;
}

.hero-mobile-badge {
    font-size: 0.9rem;
    font-weight: 700;
    padding: 0.4rem 1rem;
    border-radius: 999px;
    background: linear-gradient(135deg, #35c76d, #2bb155);
    box-shadow: 0 4px 12px rgba(53, 199, 109, 0.4);
}

.hero-mobile-value-stack ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
}

.hero-mobile-value-stack li {
    color: rgba(255, 255, 255, 0.9);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

/* FAQ Section */
.faq-section {
    padding-top: clamp(2.5rem, 6vw, 4rem);
    padding-bottom: clamp(2.5rem, 6vw, 4rem);
}

.faq-section .uk-accordion-title {
    font-family: var(--font-primary);
    font-weight: 600;
    font-size: clamp(1rem, 2.5vw, 1.15rem);
    color: var(--color-primary-dark);
    padding: 1rem 0;
    border-bottom: 1px solid rgba(17, 36, 59, 0.1);
}

.faq-section .uk-accordion-title:hover,
.faq-section .uk-accordion-title:focus {
    color: var(--color-accent-blue);
}

.faq-section .uk-accordion-content {
    padding: 1rem 0 1.5rem;
    color: #3d5166;
    line-height: 1.7;
}

.faq-section .uk-accordion-content p {
    margin: 0;
}

.faq-section .uk-accordion>li {
    margin-top: 0;
}

.faq-section .uk-accordion>li.uk-open .uk-accordion-title {
    color: var(--color-accent-blue);
}

/* ==========================================================================
   Categories Section - Switcher / Accordion
   ==========================================================================
   Desktop: Left-side switcher with category icons, right-side content panel
   Mobile: Accordion with expandable category details
   ========================================================================== */

.categories-section {
    padding-top: clamp(2rem, 5vw, 4rem);
    padding-bottom: clamp(2rem, 5vw, 4rem);
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
}

.categories-section__header {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}

.categories-section__header h2 {
    color: rgb(17, 36, 59);
}

.categories-section__lead {
    font-size: 1rem;
    line-height: 1.6;
    color: rgb(90, 107, 138);
}

/* Removed custom color overrides to align with other section headers.
   The default .tm-eyebrow and .uk-heading-medium styles now apply,
   ensuring consistent typography across all sections. */

/* ---------------------------------------------------------------------------
   Desktop Switcher - Left Navigation
   --------------------------------------------------------------------------- */
.categories-switcher__nav {
    list-style: none;
    padding: 0;
    margin: 0;
    border: none;
}

.categories-switcher__nav::before {
    display: none;
}

.categories-switcher__nav-item {
    margin: 0 0 0.5rem 0;
}

.categories-switcher__nav-link {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem 1.25rem;
    border-radius: 12px;
    background: #ffffff;
    border: 2px solid transparent;
    box-shadow: 0 2px 8px rgba(17, 36, 59, 0.05);
    text-decoration: none;
    transition: all 0.25s ease;
    color: #3d5166;
}

.categories-switcher__nav-link:hover {
    border-color: rgba(47, 131, 255, 0.3);
    box-shadow: 0 4px 16px rgba(47, 131, 255, 0.1);
    color: var(--color-primary-dark);
}

/* Active state - Blue background with white text/icon */
.categories-switcher__nav-item.uk-active .categories-switcher__nav-link {
    background: var(--gradient-accent-blue);
    color: #ffffff;
    border-color: transparent;
    box-shadow: 0 4px 20px rgba(47, 131, 255, 0.35);
}

/* Icon wrapper */
.categories-switcher__nav-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: rgba(47, 131, 255, 0.1);
    flex-shrink: 0;
    transition: background 0.25s ease;
}

.categories-switcher__nav-item.uk-active .categories-switcher__nav-icon {
    background: rgba(255, 255, 255, 0.2);
}

.categories-switcher__icon-svg,
.categories-switcher__icon-img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    transition: filter 0.25s ease;
}

/* Default state: Icons should be visible (blue/dark on white) */
.categories-switcher__icon-svg {
    fill: var(--color-accent-blue);
}

.categories-switcher__icon-img {
    filter: none;
}

/* Active state: Icons should be white */
.categories-switcher__nav-item.uk-active .categories-switcher__icon-svg {
    fill: #ffffff;
}

.categories-switcher__nav-item.uk-active .categories-switcher__icon-img {
    filter: brightness(0) invert(1);
}

/* Nav label */
.categories-switcher__nav-label {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.categories-switcher__nav-prefix {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.7;
}

.categories-switcher__nav-name {
    font-size: 1.25rem;
    font-weight: 700;
}

/* Badges in the nav items */
.categories-switcher__nav-badges {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-left: auto;
    flex-shrink: 0;
}

.categories-switcher__age-badge,
.categories-switcher__price-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    border-radius: 999px;
    white-space: nowrap;
    transition: all 0.25s ease;
}

.categories-switcher__age-badge {
    background: rgba(47, 131, 255, 0.08);
    color: #4a6a8a;
    border: 1px solid rgba(47, 131, 255, 0.15);
}

.categories-switcher__price-badge {
    background: rgba(53, 199, 109, 0.1);
    color: #1a7a3e;
    border: 1px solid rgba(53, 199, 109, 0.2);
    font-weight: 700;
}

/* Active state: Invert badge colors for contrast against the blue background */
.categories-switcher__nav-item.uk-active .categories-switcher__age-badge,
.categories-switcher__nav-item.uk-active .categories-switcher__price-badge {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}

.categories-switcher__nav-item.uk-active .categories-switcher__price-badge {
    background: rgba(255, 255, 255, 0.25);
}

/* ---------------------------------------------------------------------------
   Desktop Switcher - Right Content Panel
   --------------------------------------------------------------------------- */
.categories-switcher__content {
    list-style: none;
    padding: 0;
    margin: 0;
}

.categories-switcher__panel {
    padding: 0;
}

.category-card {
    height: 100%;
    box-shadow: 0 4px 24px rgba(17, 36, 59, 0.08);
    border: 1px solid rgba(17, 36, 59, 0.06);
}

.category-card__header {
    gap: 1rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid rgba(17, 36, 59, 0.08);
}

.category-card__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 14px;
    background: var(--gradient-accent-blue);
    flex-shrink: 0;
}

.category-card__icon-svg,
.category-card__icon-img {
    width: 36px;
    height: 36px;
    object-fit: contain;
}

.category-card__icon-svg {
    fill: #ffffff;
}

.category-card__icon-img {
    filter: brightness(0) invert(1);
}

.category-card__title-wrap .uk-text-meta {
    letter-spacing: 0.1em;
    font-weight: 600;
    color: #7a8fa3;
    font-size: 0.75rem;
    margin-bottom: 0.25rem;
    display: block;
}

.category-card__title {
    color: var(--color-primary-dark);
    font-size: clamp(1.25rem, 2.5vw, 1.5rem);
    margin-bottom: 0.5rem;
}

/* Age badge - subtle muted style, same sizing as price badge */
.category-card__age-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.85rem;
    background: rgba(47, 131, 255, 0.08);
    color: #4a6a8a;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    border-radius: 999px;
    border: 1px solid rgba(47, 131, 255, 0.15);
}

/* Container for age + price badges */
.category-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

/* Price badge - muted green style matching age badge aesthetic */
.category-card__price-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.85rem;
    background: rgba(53, 199, 109, 0.1);
    color: #1a7a3e;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-radius: 999px;
    border: 1px solid rgba(53, 199, 109, 0.2);
}

.category-card__body h4 {
    color: var(--color-primary-dark);
    font-size: 1rem;
    font-weight: 600;
}

/* ---------------------------------------------------------------------------
   Category Card — Permissions Section (Primary, always shown)
   --------------------------------------------------------------------------- */
.category-card__permissions-section {
    margin-bottom: 1.5rem;
}

.category-card__section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-primary-dark);
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
}

.category-card__section-title [uk-icon] {
    color: var(--color-accent);
    flex-shrink: 0;
}

.category-card__section-title--small {
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.category-card__permissions-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.category-card__permissions-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.5rem 0;
    color: #3d5166;
    font-size: 0.9375rem;
    line-height: 1.45;
    border-bottom: 1px solid rgba(17, 36, 59, 0.05);
}

.category-card__permissions-list li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.category-card__permissions-list li:first-child {
    padding-top: 0;
}

.category-card__check-icon {
    color: var(--color-success);
    flex-shrink: 0;
    margin-top: 0.15rem;
}

/* ---------------------------------------------------------------------------
   Category Card — Details Grid (Training Program + Special Rules)
   --------------------------------------------------------------------------- */
.category-card__details {
    margin-bottom: 1.5rem;
}

.category-card__detail-box {
    background: rgba(47, 131, 255, 0.03);
    border-radius: 10px;
    padding: 1rem;
    border: 1px solid rgba(47, 131, 255, 0.08);
    height: 100%;
}

.category-card__detail-box--rules {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.06) 0%, rgba(255, 152, 0, 0.04) 100%);
    border: 1px solid rgba(255, 193, 7, 0.2);
}

.category-card__detail-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--color-primary-dark);
    font-size: 0.9375rem;
    font-weight: 700;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.015em;
}

.category-card__detail-title [uk-icon] {
    color: var(--color-accent);
}

.category-card__detail-box--rules .category-card__detail-title [uk-icon] {
    color: #f59e0b;
    filter: drop-shadow(0 1px 2px rgba(245, 158, 11, 0.2));
}

.category-card__detail-list {
    margin: 0;
    padding: 0;
}

.category-card__detail-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.5rem;
    padding: 0.35rem 0;
    border-bottom: 1px solid rgba(17, 36, 59, 0.05);
}

.category-card__detail-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.category-card__detail-row:first-child {
    padding-top: 0;
}

.category-card__detail-list dt {
    font-size: 0.8125rem;
    color: #7a8fa3;
    font-weight: 500;
    min-width: 5rem;
}

.category-card__detail-list dd {
    font-size: 0.875rem;
    color: #3d5166;
    font-weight: 600;
    margin: 0;
}

/* Rules List */
.category-card__rules-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.category-card__rules-list li {
    padding: 0.375rem 0;
    border-bottom: 1px solid rgba(17, 36, 59, 0.05);
}

.category-card__rules-list li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.category-card__rules-list li:first-child {
    padding-top: 0;
}

.category-card__rule-text {
    display: block;
    font-size: 0.875rem;
    color: #3d5166;
    line-height: 1.5;
    font-weight: 500;
}

.category-card__rule-meta {
    display: inline-block;
    font-size: 0.75rem;
    color: #92400e;
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.12) 0%, rgba(255, 152, 0, 0.08) 100%);
    padding: 0.3rem 0.7rem;
    border-radius: 12px;
    margin-top: 0.375rem;
    font-weight: 600;
    letter-spacing: 0.005em;
    border: 1px solid rgba(245, 158, 11, 0.2);
}

/* ---------------------------------------------------------------------------
   Category Card — Note / Alert
   --------------------------------------------------------------------------- */
.category-card__note {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.875rem 1rem;
    background: rgba(47, 131, 255, 0.06);
    border-radius: 8px;
    border-left: 3px solid var(--color-accent);
    font-size: 0.875rem;
    color: #3d5166;
    line-height: 1.45;
}

.category-card__note [uk-icon] {
    color: var(--color-accent);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.category-card__footer {
    padding-top: 1.5rem;
    margin-top: 1.5rem;
}

/* ---------------------------------------------------------------------------
   Category Inclusions - "W cenie kursu" (What's included in price)
   --------------------------------------------------------------------------- */
.category-card__inclusions {
    background: linear-gradient(135deg, rgba(52, 199, 89, 0.04) 0%, rgba(47, 131, 255, 0.04) 100%);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    border: 1px solid rgba(52, 199, 89, 0.12);
    margin-top: 1.5rem;
}

.category-card__inclusions .category-card__section-title {
    margin-bottom: 0.5rem;
}

.category-card__inclusions .category-card__section-title [uk-icon] {
    color: var(--color-success);
}

.category-card__inclusions-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.category-card__inclusion-item {
    display: flex;
    align-items: flex-start;
    gap: 0.625rem;
    padding: 0.5rem 0;
    color: #3d5166;
    font-size: 0.9375rem;
    line-height: 1.4;
    border-bottom: 1px solid rgba(17, 36, 59, 0.05);
}

.category-card__inclusion-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.category-card__inclusion-item:first-child {
    padding-top: 0;
}

.category-card__inclusion-check {
    color: var(--color-success);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

.category-card__inclusion-item--highlighted {
    color: var(--color-primary-dark);
    font-weight: 600;
}

.category-card__inclusion-item--highlighted .category-card__inclusion-check {
    color: var(--color-success);
}

/* Mobile accordion inclusions */
.categories-accordion__content .category-card__inclusions-list {
    margin-left: 0;
}

.categories-accordion__content .category-card__inclusion-item {
    font-size: 0.875rem;
    padding: 0.375rem 0;
}

.categories-accordion__content .category-card__inclusion-check {
    margin-top: 0.05rem;
}

/* ---------------------------------------------------------------------------
   Mobile Accordion
   --------------------------------------------------------------------------- */
.categories-accordion__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.categories-accordion__item {
    background: #ffffff;
    border-radius: 12px;
    margin-bottom: 0.75rem;
    box-shadow: 0 2px 12px rgba(17, 36, 59, 0.06);
    overflow: hidden;
}

.categories-accordion__title {
    display: flex;
    align-items: center;
    padding: 1rem 1.25rem;
    background: #ffffff;
    text-decoration: none;
    color: var(--color-primary-dark);
    font-size: 1rem;
    font-weight: 600;
    border: none;
    transition: background 0.2s ease;
}

.categories-accordion__title::before {
    /* Override UIkit default icon position */
    order: 10;
    margin-left: auto;
    color: #7a8fa3;
}

.categories-accordion__title:hover {
    background: rgba(47, 131, 255, 0.04);
}

.categories-accordion__item.uk-open .categories-accordion__title {
    background: var(--gradient-accent-blue);
    color: #ffffff;
}

.categories-accordion__item.uk-open .categories-accordion__title::before {
    color: #ffffff;
}

.categories-accordion__title-inner {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    flex: 1;
}

.categories-accordion__title-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: rgba(47, 131, 255, 0.1);
    flex-shrink: 0;
}

.categories-accordion__item.uk-open .categories-accordion__title-icon {
    background: rgba(255, 255, 255, 0.2);
}

.categories-accordion__icon-svg,
.categories-accordion__icon-img {
    width: 22px;
    height: 22px;
    object-fit: contain;
}

.categories-accordion__icon-svg {
    fill: var(--color-accent-blue);
}

.categories-accordion__item.uk-open .categories-accordion__icon-svg {
    fill: #ffffff;
}

.categories-accordion__icon-img {
    filter: none;
}

.categories-accordion__item.uk-open .categories-accordion__icon-img {
    filter: brightness(0) invert(1);
}

.categories-accordion__title-text {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

.categories-accordion__title-prefix {
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.7;
    font-weight: 500;
}

.categories-accordion__title-name {
    font-size: 1.125rem;
    font-weight: 700;
}

/* Container for badges (age + price) in accordion title */
.categories-accordion__badges {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-left: auto;
    flex-shrink: 0;
}

/* Age badge - subtle muted style, same sizing as price badge for visual consistency */
.categories-accordion__age-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.6rem;
    background: rgba(47, 131, 255, 0.08);
    color: #4a6a8a;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    border-radius: 999px;
    border: 1px solid rgba(47, 131, 255, 0.15);
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* When accordion is open (blue header), invert the age badge colors */
.categories-accordion__item.uk-open .categories-accordion__age-badge {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}

/* Price badge in mobile accordion - muted green style matching age badge */
.categories-accordion__price-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.6rem;
    background: rgba(53, 199, 109, 0.1);
    color: #1a7a3e;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-radius: 999px;
    border: 1px solid rgba(53, 199, 109, 0.2);
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

/* When accordion is open, invert the price badge colors for contrast */
.categories-accordion__item.uk-open .categories-accordion__price-badge {
    background: rgba(255, 255, 255, 0.2);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.3);
}

/* Hidden price badge placeholder (initial state when no price set) */
.categories-accordion__price-badge[hidden],
.category-card__price-badge[hidden] {
    display: none;
}

.categories-accordion__content {
    padding: 1.25rem;
    padding-top: 0.75rem;
    background: #ffffff;
    color: #3d5166;
}

/* ---------------------------------------------------------------------------
   Mobile Accordion — Category Content Sections
   --------------------------------------------------------------------------- */
.category-accordion__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.category-accordion__meta-item {
    display: inline-flex;
    align-items: center;
    padding: 0.3rem 0.75rem;
    background: rgba(47, 131, 255, 0.06);
    color: #4a6a8a;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: 999px;
}

.category-accordion__section {
    margin-bottom: 1rem;
}

.category-accordion__section-title {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    color: var(--color-primary-dark);
    font-size: 0.875rem;
    font-weight: 700;
    margin-bottom: 0.5rem;
}

.category-accordion__section-title [uk-icon] {
    color: var(--color-accent);
    flex-shrink: 0;
}

.category-accordion__section-title--small {
    font-size: 0.8125rem;
}

.category-accordion__permissions-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.category-accordion__permissions-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.375rem 0;
    font-size: 0.8125rem;
    line-height: 1.4;
    border-bottom: 1px solid rgba(17, 36, 59, 0.04);
}

.category-accordion__permissions-list li:last-child {
    border-bottom: none;
}

.category-accordion__check {
    color: var(--color-success);
    flex-shrink: 0;
    margin-top: 0.1rem;
}

/* Details boxes (Program + Rules) */
.category-accordion__details {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.category-accordion__detail-box {
    background: rgba(47, 131, 255, 0.03);
    border-radius: 8px;
    padding: 0.75rem;
    border: 1px solid rgba(47, 131, 255, 0.08);
}

.category-accordion__detail-box--rules {
    background: rgba(255, 179, 0, 0.04);
    border-color: rgba(255, 179, 0, 0.12);
}

.category-accordion__detail-title {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--color-primary-dark);
    font-size: 0.75rem;
    font-weight: 700;
    margin-bottom: 0.4rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.category-accordion__detail-title [uk-icon] {
    color: var(--color-accent);
}

.category-accordion__detail-box--rules .category-accordion__detail-title [uk-icon] {
    color: #e6a500;
}

.category-accordion__detail-list {
    margin: 0;
    padding: 0;
}

.category-accordion__detail-list > div {
    display: flex;
    gap: 0.25rem 0.5rem;
    flex-wrap: wrap;
    padding: 0.25rem 0;
    border-bottom: 1px solid rgba(17, 36, 59, 0.04);
}

.category-accordion__detail-list > div:last-child {
    border-bottom: none;
}

.category-accordion__detail-list dt {
    font-size: 0.7rem;
    color: #7a8fa3;
    font-weight: 500;
}

.category-accordion__detail-list dd {
    font-size: 0.75rem;
    color: #3d5166;
    font-weight: 600;
    margin: 0;
}

/* Rules List */
.category-accordion__rules-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.category-accordion__rules-list li {
    font-size: 0.75rem;
    color: #3d5166;
    line-height: 1.35;
    padding: 0.25rem 0;
    border-bottom: 1px solid rgba(17, 36, 59, 0.04);
}

.category-accordion__rules-list li:last-child {
    border-bottom: none;
}

/* Inclusions list (mobile) */
.category-accordion__inclusions-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.category-accordion__inclusions-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    padding: 0.3rem 0;
    font-size: 0.8rem;
    line-height: 1.35;
    border-bottom: 1px solid rgba(17, 36, 59, 0.04);
}

.category-accordion__inclusions-list li:last-child {
    border-bottom: none;
}

/* Note box (mobile) */
.category-accordion__note {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    padding: 0.625rem 0.75rem;
    background: rgba(47, 131, 255, 0.05);
    border-radius: 6px;
    border-left: 2px solid var(--color-accent);
    font-size: 0.8rem;
    color: #3d5166;
    line-height: 1.4;
    margin-bottom: 1rem;
}

.category-accordion__note [uk-icon] {
    color: var(--color-accent);
    flex-shrink: 0;
}

/* CTA button area */
.category-accordion__cta {
    padding-top: 0.75rem;
    border-top: 1px solid rgba(17, 36, 59, 0.06);
}

.category-accordion__cta .uk-button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
}

/* Legacy support for old class names */
.categories-accordion__content h4,
.categories-accordion__content .uk-h5 {
    color: var(--color-primary-dark);
    font-size: 0.9rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.categories-accordion__content .uk-list {
    margin-left: 0;
}

.categories-accordion__content .uk-list li {
    padding: 0.35rem 0;
}

/* Smooth scroll behavior for categories section */
@media (prefers-reduced-motion: no-preference) {
    html:has(.categories-section) {
        scroll-behavior: smooth;
    }
}

/* Ensure footer content is not covered by sticky bar on mobile */
@media (max-width: 959px) {
    .site-footer {
        /* 60px height + 20px buffer */
        padding-bottom: 80px;
    }

}

/* Premium Street View Button (Pill shape with text) */

/* ==========================================
   News / Aktualności Section
   ========================================== */

/* ========================================
   NEWS SECTION - Premium Design
   ======================================== */

.tm-news-section {
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    padding-top: var(--section-padding-y);
    padding-bottom: var(--section-padding-y);
}

/* News Slider Container */
.tm-news-slider {
    padding: 0 2.5rem;
    position: relative;
}

/* Allow shadows and hover effects to render outside slider bounds */
.tm-news-slider .uk-slider-container {
    overflow: visible;
}

/* Add vertical padding to slider items container for shadow/hover space */
.tm-news-slider .uk-slider-items {
    padding-top: 1rem;
    padding-bottom: 2rem;
    /* Extra space for hover translateY + shadow */
}

@media (max-width: 639px) {
    .tm-news-slider {
        padding: 0 0.5rem;
    }
}

/* Slider navigation arrows - Premium styling */
.tm-news-slider__nav {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    border-radius: 50%;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(17, 36, 59, 0.15), 0 2px 6px rgba(17, 36, 59, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    color: var(--color-primary-dark);
    border: 1px solid rgba(17, 36, 59, 0.08);
}

.tm-news-slider__nav:hover {
    background: linear-gradient(135deg, #ffffff 0%, #ffffff 100%);
    box-shadow: 0 10px 30px rgba(17, 36, 59, 0.2), 0 4px 10px rgba(17, 36, 59, 0.12);
    transform: scale(1.08);
    color: var(--color-accent-blue);
    border-color: rgba(47, 131, 255, 0.2);
}

@media (min-width: 640px) {
    .tm-news-slider__nav--prev {
        left: -16px;
    }

    .tm-news-slider__nav--next {
        right: -16px;
    }
}

/* Dot navigation - Modern styling */
.tm-news-slider .uk-dotnav>*>* {
    width: 12px;
    height: 12px;
    background: rgba(17, 36, 59, 0.15);
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.tm-news-slider .uk-dotnav>.uk-active>* {
    background: var(--color-accent-blue);
    border-color: var(--color-accent-blue);
    transform: scale(1.2);
}

.tm-news-slider .uk-dotnav>*:hover>* {
    background: rgba(47, 131, 255, 0.4);
    border-color: rgba(47, 131, 255, 0.4);
}

/* Slider items spacing - increased gutter for card breathing room */
.tm-news-slider .uk-slider-items {
    margin-left: -20px;
}

.tm-news-slider .uk-slider-items>li {
    padding-left: 20px;
}

@media (min-width: 960px) {
    .tm-news-slider .uk-slider-items {
        margin-left: -30px;
    }

    .tm-news-slider .uk-slider-items>li {
        padding-left: 30px;
    }
}

/* ========================================
   NEWS CARDS - Premium Design
   ======================================== */

.tm-news-card {
    border-radius: 18px;
    overflow: hidden;
    transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    height: 100%;
    display: flex;
    flex-direction: column;
    background-color: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.45);
    box-shadow: 0 12px 32px rgba(17, 36, 59, 0.08);
    cursor: pointer;
    position: relative;
}

/* Focus ring for accessibility */
.tm-news-card:focus-within {
    outline: 3px solid rgba(47, 131, 255, 0.4);
    outline-offset: 3px;
}

.tm-news-card:hover {
    transform: translateY(-10px);
    box-shadow:
        0 8px 20px rgba(17, 36, 59, 0.1),
        0 24px 56px rgba(17, 36, 59, 0.16),
        0 0 0 1px rgba(47, 131, 255, 0.12);
}

/* Card Media */
.tm-news-card .uk-card-media-top,
.tm-news-card__media {
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}

/* Subtle dark overlay on hover for better text contrast */
.tm-news-card .uk-card-media-top::after,
.tm-news-card__media::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 40%, rgba(17, 36, 59, 0.15) 100%);
    opacity: 0;
    transition: opacity 0.35s ease;
    pointer-events: none;
    z-index: 1;
}

.tm-news-card:hover .uk-card-media-top::after,
.tm-news-card:hover .tm-news-card__media::after {
    opacity: 1;
}

/* Card Image Container */
.tm-news-card__media {
    border-top-left-radius: 18px;
    border-top-right-radius: 18px;
}

.tm-news-card .uk-card-media-top img,
.tm-news-card__image {
    aspect-ratio: 2 / 1;
    object-fit: cover;
    width: 100%;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.tm-news-card:hover .uk-card-media-top img,
.tm-news-card:hover .tm-news-card__image {
    transform: scale(1.06);
}

/* Link wrapper - no text decoration on any text */
.tm-news-card__link {
    text-decoration: none;
    color: inherit;
    display: block;
    height: 100%;
}

.tm-news-card__link:hover {
    text-decoration: none;
}

/* Card Body - Compact layout */
.tm-news-card .uk-card-body,
.tm-news-card__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 1rem 1.25rem 1.125rem;
    gap: 0.375rem;
}

@media (min-width: 960px) {

    .tm-news-card .uk-card-body,
    .tm-news-card__body {
        padding: 1.125rem 1.5rem 1.25rem;
    }
}

/* Card Meta */
.tm-news-card__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tm-news-card__date {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8125rem;
    font-weight: 500;
    color: var(--color-text-muted);
    letter-spacing: 0.01em;
}

.tm-news-card__date [uk-icon] {
    color: var(--color-accent-blue);
}

/* Card Title - Now in body, below image */
.tm-news-card__title {
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.35;
    margin: 0;
    color: var(--color-primary-dark);
    text-decoration: none;
    /* Limit to 2 lines with ellipsis */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: none;
}

/* Title remains stable on hover — no color shift, no underline */
.tm-news-card:hover .tm-news-card__title {
    color: var(--color-primary-dark);
    text-decoration: none;
}

/* Card Excerpt - Compact snippet */
.tm-news-card__excerpt {
    color: #4b5563;
    font-size: 0.875rem;
    line-height: 1.55;
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0.25rem 0 0.5rem;
}

.tm-news-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--color-accent-blue);
    transition: all 0.25s ease;
    padding: 0.5rem 0;
    text-decoration: none;
    letter-spacing: 0.01em;
    position: relative;
}

/* Animated underline - hidden by default */
.tm-news-card__cta::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0.25rem;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--color-accent-blue), #1a5cd0);
    transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 2px;
}

/* Expand underline on CARD hover (not just CTA hover) */
.tm-news-card:hover .tm-news-card__cta::after {
    width: calc(100% - 1.3rem);
    /* Account for arrow icon */
}

.tm-news-card__cta:hover {
    color: #1a5cd0;
    gap: 0.7rem;
}

.tm-news-card__cta [uk-icon] {
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Arrow moves right on CARD hover */
.tm-news-card:hover .tm-news-card__cta [uk-icon] {
    transform: translateX(5px);
}

/* Badges Container - Stacked on left */
.tm-news-card__badges {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    z-index: 10;
}

/* Badges - Modern pill styling */
.tm-news-card__pinned-badge,
.tm-news-card__gallery-badge {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.3rem 0.6rem;
    border-radius: 999px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    letter-spacing: 0.03em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    width: fit-content;
}

.tm-news-card__pinned-badge {
    background: linear-gradient(135deg, rgba(47, 131, 255, 0.92) 0%, rgba(26, 92, 208, 0.95) 100%);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.tm-news-card__gallery-badge {
    background: rgba(17, 36, 59, 0.85);
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.tm-news-card__pinned-inline {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.6rem;
    border-radius: 6px;
}

/* ========================================
   NEWS MODAL - Minimalistic Design
   Clean, content-focused layout
   ======================================== */

.tm-news-modal {
    /* Dark overlay for focus - matches calculator modal */
    --uk-modal-background: rgba(4, 18, 31, 0.72);
}

.tm-news-modal .uk-modal-dialog {
    max-width: 780px;
    width: 92vw;
    background: #ffffff;
    /* Premium shadow matching calculator modal */
    box-shadow: 0 28px 70px rgba(4, 18, 31, 0.35);
    border-radius: 16px;
    overflow: hidden;
}

/* Close button - positioned top right, light for dark header */
.tm-news-modal .uk-modal-close-default {
    top: 1.25rem;
    right: 1.25rem;
    color: rgba(244, 248, 255, 0.85);
    transition: all 0.25s ease;
    z-index: 10;
}

.tm-news-modal .uk-modal-close-default:hover {
    color: #ffffff;
    transform: scale(1.1);
}

/* Modal Header - Dark gradient matching calculator modal */
.tm-news-modal__header {
    background: linear-gradient(135deg, rgba(4, 18, 31, 0.98), rgba(6, 38, 68, 0.95));
    color: #f4f8ff;
    border-bottom: none;
    padding: var(--modal-padding);
    gap: 1.5rem;
    position: relative;
    flex-direction: row;
    align-items: center;
}

/* Remove the gradient bar at the bottom */
.tm-news-modal__header::after {
    display: none;
}

/* Icon - glass-like box matching calculator modal */
.tm-news-modal__icon {
    flex-shrink: 0;
    width: 68px;
    height: 68px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.12);
    box-shadow: inset 0 0 0 1px rgba(244, 248, 255, 0.4), 0 16px 24px rgba(0, 0, 0, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
}

.tm-news-modal__header-copy {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}

.tm-news-modal__meta-label {
    color: rgba(244, 248, 255, 0.75);
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 500;
}

.tm-news-modal__header .tm-news-modal__title {
    font-size: clamp(1.5rem, 3vw, 2.1rem);
    letter-spacing: 0.02em;
    color: #ffffff;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Modal Body - Enhanced spacing and readability */
.tm-news-modal__body-wrapper {
    padding: 2rem;
    background: #ffffff;
    max-height: 65vh;
    overflow-y: auto;
}

/* Custom scrollbar for modal */
.tm-news-modal__body-wrapper::-webkit-scrollbar {
    width: 8px;
}

.tm-news-modal__body-wrapper::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

.tm-news-modal__body-wrapper::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, var(--color-accent-blue), var(--color-accent-green));
    border-radius: 4px;
}

.tm-news-modal__body-wrapper::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #1a5cd0, #2bb155);
}

.tm-news-modal__header-image {
    margin-bottom: 1.5rem;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 24px rgba(17, 36, 59, 0.12);
}

.tm-news-modal__header-image img {
    width: 100%;
    max-height: 400px;
    object-fit: cover;
    display: block;
}

/* Meta section */
.tm-news-modal__meta {
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.tm-news-modal__date {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9375rem;
    font-weight: 500;
    color: var(--color-text-muted);
}

.tm-news-modal__date [uk-icon] {
    color: var(--color-accent-blue);
}

.tm-news-modal__badge {
    font-size: 0.8125rem;
    font-weight: 700;
    padding: 0.4rem 0.8rem;
    border-radius: 8px;
    letter-spacing: 0.02em;
}

/* Body content - Enhanced typography */
.tm-news-modal__body {
    font-size: 1.0625rem;
    line-height: 1.75;
    color: #334155;
}

.tm-news-modal__body p {
    margin-bottom: 1.25rem;
}

.tm-news-modal__body h2,
.tm-news-modal__body h3,
.tm-news-modal__body h4 {
    color: var(--color-primary-dark);
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-weight: 700;
}

.tm-news-modal__body h2 {
    font-size: 1.75rem;
}

.tm-news-modal__body h3 {
    font-size: 1.5rem;
}

.tm-news-modal__body h4 {
    font-size: 1.25rem;
}

.tm-news-modal__body ul,
.tm-news-modal__body ol {
    margin-left: 1.5rem;
    margin-bottom: 1.25rem;
}

.tm-news-modal__body li {
    margin-bottom: 0.5rem;
}

.tm-news-modal__body a {
    color: var(--color-accent-blue);
    text-decoration: none;
    border-bottom: 2px solid rgba(47, 131, 255, 0.3);
    transition: all 0.3s ease;
}

.tm-news-modal__body a:hover {
    color: #1a5cd0;
    border-bottom-color: #1a5cd0;
}

.tm-news-modal__body img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
    margin: 1.5rem 0;
    box-shadow: 0 8px 24px rgba(17, 36, 59, 0.1);
}

/* Modal Footer - Matching calculator modal styling */
.tm-news-modal__footer {
    background: #f4f7fd;
    border-top: 1px solid rgba(4, 18, 31, 0.07);
    padding: var(--modal-padding);
    gap: 1rem;
}

.tm-news-modal__footer .uk-button {
    font-weight: 600;
    padding: 0.6rem 1.5rem;
    border-radius: 8px;
    transition: all 0.25s ease;
    font-size: 0.9rem;
}

.tm-news-modal__footer .uk-button-default {
    background: rgba(17, 36, 59, 0.08);
    border: none;
    color: var(--color-text-muted);
}

.tm-news-modal__footer .uk-button-default:hover {
    background: rgba(17, 36, 59, 0.12);
    color: var(--color-primary-dark);
}

/* Gallery badge on cards */
.tm-news-card__gallery-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

/* Gallery grid in modal */
.tm-news-modal__gallery {
    margin-top: 2rem;
}

/* Gallery item thumbnail */
.tm-gallery-item {
    display: block;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
    aspect-ratio: 3 / 2;
    position: relative;
    box-shadow: 0 4px 12px rgba(17, 36, 59, 0.08);
    transition: all 0.3s ease;
}

.tm-gallery-item:hover {
    box-shadow: 0 8px 24px rgba(17, 36, 59, 0.15);
    transform: translateY(-2px);
}

.tm-gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.tm-gallery-item:hover img {
    transform: scale(1.08);
}

/* Gallery item overlay */
.tm-gallery-item .uk-overlay {
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(17, 36, 59, 0.7);
    backdrop-filter: blur(4px);
}

.tm-gallery-item .uk-overlay .uk-position-center {
    color: #ffffff;
}

/* Gallery lightbox caption styling */
.uk-lightbox-caption {
    text-align: center;
    padding: 1rem;
    font-size: 0.9375rem;
    color: #ffffff;
    background: rgba(0, 0, 0, 0.75);
}

/* Loading and error states */
.tm-news-modal__loading {
    text-align: center;
    padding: 4rem 1rem;
}

.tm-news-modal__loading [uk-spinner] {
    color: var(--color-accent-blue);
}

.tm-news-modal__error {
    text-align: center;
    padding: 3rem 1rem;
}

.tm-news-modal__error .uk-alert {
    display: inline-flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem 1.75rem;
    border-radius: 12px;
}

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */

@media (max-width: 639px) {
    .tm-news-section {
        padding-top: clamp(3rem, 8vw, 5rem);
        padding-bottom: clamp(3rem, 8vw, 5rem);
    }

    .tm-news-card {
        border-radius: 12px;
    }

    .tm-news-card__media {
        border-top-left-radius: 12px;
        border-top-right-radius: 12px;
    }

    .tm-news-card .uk-card-body,
    .tm-news-card__body {
        padding: 0.875rem 1rem;
    }

    .tm-news-card__title {
        font-size: 1rem;
    }

    .tm-news-card__excerpt {
        font-size: 0.825rem;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    .tm-news-card__badges {
        top: 8px;
        left: 8px;
        gap: 4px;
    }

    .tm-news-card__pinned-badge,
    .tm-news-card__gallery-badge {
        font-size: 0.6rem;
        padding: 0.25rem 0.5rem;
    }

    .tm-news-modal .uk-modal-dialog {
        width: 96vw;
        border-radius: 16px;
    }

    .tm-news-modal__header {
        padding: 1rem;
        gap: 1rem;
    }

    .tm-news-modal__icon {
        width: 56px;
        height: 56px;
        border-radius: 12px;
    }

    .tm-news-modal__icon [uk-icon] {
        width: 28px;
        height: 28px;
    }

    .tm-news-modal__meta-label {
        display: none;
    }

    .tm-news-modal__header .tm-news-modal__title {
        font-size: 1.25rem;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }

    .tm-news-modal__body-wrapper {
        padding: 1.5rem;
        max-height: 60vh;
    }

    .tm-news-modal__header-image {
        margin-bottom: 1.25rem;
        border-radius: 10px;
    }

    .tm-news-modal__header-image img {
        max-height: 250px;
    }

    .tm-news-modal__footer {
        padding: 1rem;
    }

    .tm-news-modal__footer .uk-button {
        padding: 0.65rem 1.5rem;
        font-size: 0.9375rem;
    }

    .tm-news-modal .uk-modal-close-default {
        top: 1rem;
        right: 1rem;
    }

    .tm-news-modal__body {
        font-size: 1rem;
    }

    .tm-news-modal__body h2 {
        font-size: 1.5rem;
    }

    .tm-news-modal__body h3 {
        font-size: 1.25rem;
    }

    .tm-news-modal__body h4 {
        font-size: 1.125rem;
    }

    .tm-gallery-item {
        border-radius: 8px;
    }
}

/* Tablet adjustments */
@media (min-width: 640px) and (max-width: 959px) {
    .tm-news-card__title {
        font-size: 1.1875rem;
    }

    .tm-news-modal__header {
        padding: 1.25rem 1.5rem;
    }

    .tm-news-modal__body-wrapper {
        padding: 1.75rem;
    }

    .tm-news-modal__icon {
        width: 60px;
        height: 60px;
    }
}

/* Empty state styling */
.tm-news-empty {
    text-align: center;
    padding: 4rem 1rem;
    color: var(--color-text-muted);
}

.tm-news-empty [uk-icon] {
    color: rgba(17, 36, 59, 0.3);
    margin-bottom: 1rem;
}

/* ==========================================================================
   Downloads Section
   ========================================================================== */

/* ==========================================================================
   Downloads Section - Modernized
   ========================================================================== */

.tm-download-card {
    background: #ffffff;
    border: 1px solid rgba(17, 36, 59, 0.08);
    box-shadow: 0 4px 12px rgba(17, 36, 59, 0.04);
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s ease;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.tm-download-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(17, 36, 59, 0.12);
    border-color: rgba(47, 131, 255, 0.3);
}

.tm-download-card__body {
    padding: 0.85rem;
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    flex: 1;
}

.tm-download-card__icon-wrapper {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 8px;
    background: rgba(241, 245, 249, 0.8);
    color: var(--color-primary-dark);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.tm-download-card:hover .tm-download-card__icon-wrapper {
    background: linear-gradient(135deg, var(--color-accent-blue), #1a5cd0);
    color: #ffffff;
    transform: scale(1.05) rotate(-3deg);
}

.tm-download-card__content {
    flex: 1;
    min-width: 0;
    /* For truncation to work */
}

.tm-download-card__title {
    font-size: 0.95rem;
    font-weight: 700;
    margin: 0 0 0.2rem 0;
    color: var(--color-primary-dark);
    line-height: 1.25;
    transition: color 0.2s ease;
}

.tm-download-card:hover .tm-download-card__title {
    color: var(--color-accent-blue);
}

.tm-download-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    color: var(--color-text-muted);
}

.tm-download-card__description {
    font-size: 0.8rem;
    color: #64748b;
    margin-top: 0.35rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Badges - Reusing News Card Aesthetic */
.tm-download-card__badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

.tm-download-card__badge {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    background: #f1f5f9;
    color: #475569;
}

.tm-download-card__badge--pinned {
    background: linear-gradient(135deg, rgba(47, 131, 255, 0.1), rgba(26, 92, 208, 0.1));
    color: var(--color-accent-blue);
    border: 1px solid rgba(47, 131, 255, 0.15);
}

.tm-download-card__badge--category {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

/* Action Icon (Visual cue) */
.tm-download-card__action {
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    opacity: 0;
    transform: translateX(-10px);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    color: var(--color-accent-blue);
}

.tm-download-card:hover .tm-download-card__action {
    opacity: 1;
    transform: translateX(0);
}

/* Mobile Adjustments */
@media (max-width: 639px) {
    .tm-download-card__body {
        padding: 1rem;
        gap: 0.75rem;
    }

    .tm-download-card__icon-wrapper {
        width: 40px;
        height: 40px;
    }

    .tm-download-card__title {
        font-size: 1rem;
    }
}



/* Street View button now uses .tm-locations__actions .uk-button-text styling */