html {
    scroll-behavior: smooth;
    scroll-padding-top: 80px;
    /* Accounts for fixed navbar height */
}

:root {
    --primary-color: #0ea5e9;
    --primary-hover: #0284c7;
    --secondary-color: #f97316;
    --bg-dark: #020617;
    /* Deeper Midnight */
    --bg-card: rgba(15, 23, 42, 0.6);
    /* Transparent Slate for modern glass effect */
    --bg-card-hover: rgba(30, 41, 59, 0.8);
    --text-main: #f8fafc;
    --text-muted: #94a3b8;
    /* Slate 400 */
    --white: #ffffff;

    --font-heading: 'Montserrat', "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
    --font-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    --transition-speed: 0.3s;
    --border-radius: 12px;
    --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-glow: 0 0 20px rgba(14, 165, 233, 0.3);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-body);
    background-color: var(--bg-dark);
    /* Modern atmospheric background with large subtle radial gradients */
    background-image:
        radial-gradient(circle at 0% 0%, rgba(14, 165, 233, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 100% 50%, rgba(14, 165, 233, 0.03) 0%, transparent 50%),
        radial-gradient(circle at 50% 100%, rgba(249, 115, 22, 0.02) 0%, transparent 50%);
    background-attachment: fixed;
    color: var(--text-main);
    line-height: 1.6;
    overflow-x: hidden;
}

h1,
h2,
h3,
h4 {
    font-family: var(--font-heading);
    font-weight: 700;
    color: var(--white);
    line-height: 1.2;
}

a {
    text-decoration: none;
    color: inherit;
    transition: color var(--transition-speed);
}

ul {
    list-style: none;
}

.material-symbols-sharp {
    display: inline-block;
    width: 1em;
    height: 1em;
    overflow: hidden;
    line-height: 1;
    font-size: 24px;
    /* default standard size, can be overridden */
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 2rem;
}

.section {
    padding: 5rem 0;
}

/* --- Utilities --- */
.text-gradient {
    background: linear-gradient(to right, var(--primary-color), #60a5fa);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.btn {
    display: inline-block;
    padding: 0.75rem 1.5rem;
    border-radius: 50px;
    font-weight: 600;
    font-family: var(--font-heading);
    cursor: pointer;
    transition: all var(--transition-speed) ease;
    text-align: center;
}

.btn-primary {
    background-color: var(--primary-color);
    color: var(--white);
    border: 2px solid var(--primary-color);
}

.btn-primary:hover {
    background-color: var(--primary-hover);
    border-color: var(--primary-hover);
    transform: translateY(-2px);
    box-shadow: var(--shadow-glow);
}

.btn-outline {
    background-color: transparent;
    border: 2px solid var(--white);
    color: var(--white);
}

.btn-outline:hover {
    border-color: var(--primary-color);
    color: var(--white);
    background: rgba(14, 165, 233, 0.1);
    transform: translateY(-2px);
}

.btn-lg {
    padding: 1rem 2rem;
    font-size: 1.1rem;
}

.btn-block {
    display: block;
    width: 100%;
}

.section-header {
    text-align: center;
    margin-bottom: 3rem;
}

.section-header h2 {
    font-size: 2.5rem;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.divider {
    height: 4px;
    width: 60px;
    background: var(--primary-color);
    margin: 1rem auto;
    border-radius: 2px;
}

.highlight {
    color: var(--primary-color);
    font-weight: 700;
}

/* --- Navigation --- */
.navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 1.5rem 0;
    z-index: 1000;
    background: rgba(15, 23, 42, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.nav-container {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

.row-header {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
}

.nav-logo {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    font-weight: 700;
    font-size: 1.25rem;
    font-family: var(--font-heading);
    letter-spacing: 1px;
    justify-self: start;
}

.nav-logo img {
    height: 40px;
}

.nav-links {
    display: flex;
    gap: 2rem;
    justify-content: center;
}

.nav-links li a {
    font-weight: 500;
    font-size: 0.95rem;
    opacity: 0.9;
}

.nav-links li a:hover {
    color: var(--primary-color);
    opacity: 1;
}

.nav-cta {
    padding: 0.6rem 1.2rem;
    font-size: 0.9rem;
    justify-self: end;
}

.hamburger {
    display: none;
    cursor: pointer;
    flex-direction: column;
    gap: 5px;
}

.hamburger .bar {
    width: 25px;
    height: 3px;
    background-color: var(--white);
    border-radius: 2px;
}

/* --- Hero Section --- */
.hero {
    height: 100vh;
    min-height: 600px;
    display: flex;
    align-items: center;
    position: relative;
    background: linear-gradient(rgba(15, 23, 42, 0.75), rgba(15, 23, 42, 0.85)), url('assets/img/hero_bg_v4.jpg') no-repeat center 42%;
    background-size: cover;
    overflow: hidden;
    padding-top: 80px;
    /* Navbar height */
}

/* Creative background using CSS gradients to simulate dynamic sport atmosphere */
.hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 70% 30%, rgba(14, 165, 233, 0.15) 0%, transparent 60%),
        radial-gradient(circle at 20% 80%, rgba(249, 115, 22, 0.1) 0%, transparent 50%),
        var(--bg-dark);
    z-index: -1;
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.hero-title {
    font-size: 4.5rem;
    font-weight: 900;
    margin-bottom: 1.5rem;
    line-height: 1.1;
}

.hero-subtitle {
    font-size: 1.5rem;
    color: var(--text-muted);
    margin-bottom: 2.5rem;
    max-width: 600px;
}

.hero-buttons {
    display: flex;
    gap: 1rem;
}

/* --- Info Section --- */
.info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}

.info-text p {
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
}

.info-features {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-top: 2rem;
}

.feature {
    display: flex;
    gap: 1rem;
    background: var(--bg-card);
    padding: 1.5rem;
    border-radius: var(--border-radius);
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.feature:hover {
    transform: translateX(5px);
    border-color: var(--primary-color);
}

.feature .material-symbols-sharp {
    font-size: 2rem;
    color: var(--primary-color);
    flex-shrink: 0;
}

.feature h3 {
    font-size: 1.2rem;
    margin-bottom: 0.25rem;
}

.feature p {
    font-size: 0.95rem;
    margin-bottom: 0;
    color: var(--text-muted);
}

.info-image {
    position: relative;
}

.info-image img {
    width: 100%;
    border-radius: var(--border-radius);
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.5);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.info-image:hover img {
    transform: scale(1.02);
    border-color: var(--primary-color);
    box-shadow: 0 8px 20px rgba(14, 165, 233, 0.2);
}

@keyframes float {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }

    100% {
        transform: translateY(0);
    }
}

/* --- Trainings Section --- */
.trainings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
}

@media (min-width: 1024px) {
    .trainings-grid {
        grid-template-columns: repeat(4, 1fr);
    }
}

.training-card {
    background: var(--bg-card);
    border-radius: var(--border-radius);
    overflow: hidden;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    flex-direction: column;
    transition: all var(--transition-speed);
}

.training-card:hover {
    transform: translateY(-10px);
    box-shadow: var(--shadow-glow);
    border-color: var(--primary-color);
}

.training-card.featured {
    border: 2px solid var(--primary-color);
    background: linear-gradient(to bottom right, var(--bg-card), rgba(14, 165, 233, 0.1));
}

.card-header {
    padding: 2rem;
    background: rgba(0, 0, 0, 0.2);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.card-header h3 {
    font-size: 1.5rem;
}

.tag {
    background: var(--primary-color);
    color: var(--white);
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
}

.card-body {
    padding: 2rem;
    flex-grow: 1;
}

.detail-row {
    display: flex;
    gap: 1rem;
    margin-bottom: 1.2rem;
    color: var(--text-muted);
}

.detail-row .material-symbols-sharp {
    color: var(--primary-color);
}

.card-footer {
    padding: 2rem;
    padding-top: 0;
}

.coach-info {
    text-align: center;
    margin-top: 3rem;
    color: var(--text-muted);
    font-style: italic;
}

.training-intro {
    margin-top: 3rem;
}

.training-intro p {
    font-size: 1.1rem;
    line-height: 1.6;
    text-align: center;
    color: var(--white);
    max-width: 800px;
    margin: 0 auto 3rem;
}

/* --- Achievements Section --- */
.achievements-section {
    position: relative;
    padding-bottom: 4rem;
}

.achievements-content {
    max-width: 1300px;
    /* Increased to fit 3 cards */
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    padding: 0 1rem;
    /* Ensure padding on small screens */
}

.achievement-intro p {
    font-size: 1.1rem;
    line-height: 1.6;
    text-align: center;
    color: var(--white);
    max-width: 800px;
    margin: 0 auto;
}

/* Tabs */
.achievements-tabs {
    display: flex;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 2rem;
}

.tab-btn {
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.2);
    color: var(--text-muted);
    padding: 0.75rem 2rem;
    border-radius: 30px;
    font-size: 1.1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--transition-speed);
}

.tab-btn:hover {
    border-color: var(--primary-color);
    color: var(--white);
    background: rgba(14, 165, 233, 0.1);
}

.training-card .btn-outline:hover {
    border-color: var(--primary-color);
    color: var(--white);
    background: rgba(14, 165, 233, 0.1);
}

.tab-btn.active {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: var(--white);
    /* box-shadow removed for clean look */
}

@media (max-width: 768px) {
    .achievements-tabs {
        gap: 0.5rem;
        /* Smaller gap on mobile */
    }

    .tab-btn {
        padding: 0.5rem 1.25rem;
        /* Smaller padding */
        font-size: 0.95rem;
        /* Smaller text */
    }
}

/* Year Content and Animations */
.year-content {
    display: none;
    animation: fadeIn 0.5s ease-in-out;
}

.year-content.active {
    display: block;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.achievements-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    align-items: start;
}

/* Special styling for years with only one card (2023, 2024) */
.single-card-grid {
    display: flex;
    justify-content: center;
}

.single-card-grid .achievement-card {
    max-width: 800px;
    width: 100%;
}

.achievement-card {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 20px;
    padding: 1.75rem;
    /* Compact padding */
    position: relative;
    transition: all 0.4s ease;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    width: 100%;
    backdrop-filter: blur(10px);
    height: 100%;
}

.achievement-card h4 {
    color: var(--white);
    font-size: 1.1rem;
    /* Slightly smaller to fit "ZAHRANIČÍ" */
    font-weight: 700;
    margin-bottom: 0.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 2px solid var(--primary-color);
    text-transform: uppercase;
    letter-spacing: 1px;
    /* Tighter spacing */
    display: inline-block;
    white-space: nowrap;
    /* Prevent wrapping */
}

.achievement-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(14, 165, 233, 0.2);
    /* More subtle glow */
    border-color: var(--primary-color);
    /* Blue border */
    background: rgba(255, 255, 255, 0.04);
}

.achievement-rows {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.achievement-rows li {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 1rem;
    padding: 1rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.3s ease;
    min-height: auto;
    /* Allow natural height */
}

.achievement-rows li:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.achievement-rows li:hover {
    transform: translateX(5px);
    /* No background change for minimalism */
}

/* Remove the left accent bar */
.achievement-rows li::before {
    display: none;
}


.place {
    font-weight: 800;
    font-size: 1.1rem;
    display: inline-block;
    white-space: nowrap;
}

.place.gold {
    color: #ffd700;
    text-shadow: 0 0 10px rgba(255, 215, 0, 0.3);
}

.place.silver {
    color: #e0e0e0;
    text-shadow: 0 0 10px rgba(224, 224, 224, 0.3);
}

.place.bronze {
    color: #cd7f32;
    text-shadow: 0 0 10px rgba(205, 127, 50, 0.3);
}

.event {
    color: var(--text-muted);
    font-size: 0.95rem;
    line-height: 1.4;
    text-align: right;
}

.event br {
    display: none;
}

/* --- Contacts Section --- */
.contacts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 3rem;
    max-width: 800px;
    margin: 0 auto;
}

.contact-card {
    text-align: center;
    background: var(--bg-card);
    padding: 3rem 2rem;
    border-radius: var(--border-radius);
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: all 0.4s ease;
}

.contact-card:hover {
    transform: translateY(-5px);
    border-color: var(--primary-color);
    box-shadow: 0 8px 20px rgba(14, 165, 233, 0.2);
}

.contact-photo {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    margin: 0 auto 1.5rem;
    overflow: hidden;
    border: 3px solid var(--primary-color);
}

.contact-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contact-card h3 {
    margin-bottom: 0.5rem;
}

.role {
    color: var(--primary-color);
    font-weight: 600;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.contact-details {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    align-items: center;
}

.contact-link {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-muted);
}

.contact-link:hover {
    color: var(--white);
}

/* --- Partners Section --- */
/* --- Footer --- */
footer {
    background: #000;
    padding: 2rem 0 1rem 0;
    /* Reduced bottom padding */
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 2rem;
}

.footer-left {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.partners-text {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: var(--text-muted);
}

.partners-logos {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.partner-logo {
    /* background: var(--white); removed to blend */
    padding: 0;
    transition: all var(--transition-speed);
    width: 110px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.7;
}

.partner-logo img {
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
    /* Force to white */
    filter: brightness(0) invert(1);
    transition: all var(--transition-speed);
}

.partner-logo:hover {
    transform: translateY(-3px);
    opacity: 1;
}

.partner-ddm {
    width: 180px;
    height: 70px;
    /* Larger width for DDM logo */
    position: relative;
    bottom: 5px;
    /* Move up slightly */
}

/* Optional: if you want them to return to original color on hover, 
   you'd need to remove the filter, but then they might be black on black. 
   So keep them white but maybe brighter. */

.social-links {
    display: flex;
    gap: 2rem;
    margin-bottom: 28px;
    /* Lift up to align optically with logos */
}

.social-icon {
    display: block;
    width: 20px;
    height: 20px;
    transition: transform var(--transition-speed);
    opacity: 0.7;
}

.social-icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    /* Force to white to match partners */
    filter: brightness(0) invert(1);
}

.social-icon:hover {
    transform: translateY(-3px);
    opacity: 1;
}

/* --- Camp Popup & Floating Button --- */
.popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba(2, 6, 23, 0.9);
    /* Darker and more opaque overlay */
    backdrop-filter: blur(8px);
    /* Stronger blur for background content */
    z-index: 2000;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    opacity: 1;
    visibility: visible;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

.popup-overlay.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.popup-content {
    background: rgba(15, 23, 42, 0.95);
    /* Matched to navbar color */
    backdrop-filter: blur(10px);
    border: 1px solid rgba(14, 165, 233, 0.4);
    border-radius: var(--border-radius);
    padding: 2.5rem;
    max-width: 600px;
    width: 100%;
    position: relative;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6), var(--shadow-glow);
    transform: translateY(0) scale(1);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    text-align: center;
}

.popup-overlay.hidden .popup-content {
    transform: translateY(20px) scale(0.95);
}

.close-btn {
    position: absolute;
    top: 1rem;
    right: 1rem;
    background: transparent;
    border: none;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border-radius: 50%;
    transition: all var(--transition-speed);
}

.close-btn:hover {
    color: var(--white);
    background: rgba(255, 255, 255, 0.1);
    transform: rotate(90deg);
}

.popup-icon {
    font-size: 3rem !important;
    color: var(--primary-color);
    margin-bottom: 1rem;
    display: inline-block;
}

.popup-header h2 {
    font-size: 1.8rem;
    margin-bottom: 1rem;
    color: var(--white);
}

.popup-body p {
    color: var(--text-muted);
    font-size: 1.05rem;
    margin-bottom: 1.5rem;
    line-height: 1.6;
}

.popup-details {
    margin-bottom: 2rem;
    text-align: left;
    display: inline-block;
}

.popup-details li {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.5rem;
    color: var(--text-main);
    font-weight: 500;
}

.popup-details .material-symbols-sharp {
    color: var(--primary-color);
    font-size: 1.25rem !important;
}

.floating-btn {
    position: fixed;
    bottom: 2rem;
    right: 2rem;
    background: var(--primary-color);
    color: var(--white);
    border: none;
    border-radius: 50px;
    padding: 0.75rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    z-index: 1500;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    /* Reduced shadow */
    font-family: var(--font-heading);
    font-weight: 600;
    font-size: 1rem;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.floating-btn:hover {
    background: var(--primary-hover);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(14, 165, 233, 0.2);
    /* Reduced glow on hover */
}

.floating-btn.hidden {
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
    pointer-events: none;
}

/* The pulsing animation is intentionally removed as requested */

@media (max-width: 768px) {
    .floating-text {
        display: none;
    }

    .floating-btn {
        bottom: 1.5rem;
        right: 1.5rem;
        width: 54px;
        height: 54px;
        padding: 0;
        justify-content: center;
        border-radius: 50%;
    }

    .floating-btn .material-symbols-sharp {
        font-size: 1.75rem !important;
    }
}

@media (max-width: 480px) {
    .floating-btn {
        bottom: 1rem;
        right: 1rem;
        width: 48px;
        height: 48px;
    }

    .floating-btn .material-symbols-sharp {
        font-size: 1.5rem !important;
    }
}

/* --- Responsive & Media Queries --- */
@media (max-width: 768px) {
    .hero-title {
        font-size: 3rem;
    }

    .hero-buttons .btn-lg {
        padding: 0.75rem 1.25rem;
        font-size: 0.9rem;
        white-space: nowrap;
    }

    .nav-links,
    .nav-cta {
        display: none;
    }

    .navbar {
        position: fixed;
    }

    .nav-links.active {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        width: 100vw;
        height: auto;
        margin-top: 76px;
        background: rgba(15, 23, 42, 0.98);
        /* Opaque background for legibility */
        backdrop-filter: blur(10px);
        /* Modern frosted effect */
        padding: 2.5rem 2rem;
        border-bottom: 2px solid var(--primary-color);
        gap: 1.5rem;
        z-index: 1001;
    }

    .nav-links.active li {
        display: block;
    }

    .nav-links.active li a {
        display: block;
        padding: 0.5rem 0;
        font-size: 1.1rem;
        opacity: 1;
    }

    .hamburger {
        display: flex;
        grid-column: 3;
        justify-self: end;
    }

    .hero-content {
        padding: 0 1rem;
    }

    .info-grid {
        grid-template-columns: 1fr;
    }

    .info-image {
        order: -1;
        /* Image first on mobile */
        max-width: 300px;
        margin: 0 auto;
    }

    .section-header h2 {
        font-size: 2rem;
    }

    .trainings-grid {
        grid-template-columns: 1fr;
    }

    .footer-content {
        flex-direction: column;
        text-align: center;
        align-items: center;
        /* Override flex-end from desktop */
    }

    .footer-left {
        align-items: center;
    }

    .partners-logos {
        justify-content: center;
    }

    .event br {
        display: block;
    }
}