/* =====================================================================
    CUSTOM STYLES (Rationalized)
    =====================================================================
    Sections
    01. Theme Variables & Root Tokens
    02. Navigation / Header (avatar, brand, responsive)
    03. Base Utilities & Helpers (animations, general containers)
    04. Links & Text Utilities
    05. Buttons
    06. Layout Containers (hero, section titles)
    07. Generic Components (cards, tables, feature list)
    08. Shared Decorative / Reusable Patterns
    09. Page Blocks
         09.1 Home (hero, capacity banner)
         09.2 Presentation (timeline, achievements, stats, missions, highlight, services, commissions)
         09.3 Encadrement (coach grid)
         09.4 Inscriptions (tabs, tables, age grid, alerts)
         09.5 Footer (sponsors)
    10. Dark Mode
    11. Responsive Tweaks
    ---------------------------------------------------------------------
    Notes
    - Only light consolidation applied to avoid visual regressions.
    - Repeated decorative bars & icon ring pseudo-elements unified.
    - Original selector names preserved for backward compatibility.
====================================================================== */

/* ---------------------------------------------------------------------
    01. THEME VARIABLES & ROOT TOKENS
--------------------------------------------------------------------- */
:root {
    --accent: #0a5cc0;
    /* primary brand blue */
    --accent-alt: #0f89d7;
    /* secondary accent blue */
    --accent-grad: linear-gradient(135deg, #0d1f33 0%, #0a4d8c 55%, #0f89d7 100%);
}

/* Price emphasis (utility) */
.price-red {
    color: #c40000;
    font-weight: 600;
}

/* ---------------------------------------------------------------------
    02. NAVIGATION / HEADER
--------------------------------------------------------------------- */
.navbar-nav>.nav-item {
    min-width: 200px;
    text-align: center;
}

/* Avatar / logo enlargement */
.navbar-custom .avatar-container {
    width: 5rem;
    bottom: -2.2rem;
}

.navbar-custom.top-nav-regular .avatar-container {
    width: 9rem;
    bottom: -2.8rem;
}

.navbar-custom .avatar-container .avatar-img-border,
.navbar-custom .avatar-container .avatar-img {
    width: 100%;
}

.navbar-custom .avatar-container .avatar-img-border {
    background: #fff;
    border-radius: 50%;
    padding: .45rem;
    box-shadow: 0 4px 14px -4px rgba(0, 0, 0, .25);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    aspect-ratio: 1/1;
}

.navbar-custom .avatar-container .avatar-img {
    border-radius: 50%;
    height: 100%;
    width: 100%;
    object-fit: contain;
    background: #ffffff;
}

.navbar-custom .navbar-brand-logo img {
    height: 4rem;
}

@media (min-width:1200px) {
    .navbar-custom .navbar-brand-logo img {
        height: 5.5rem;
    }
}

/* Responsive avatar scaling */
@media (max-width:575.98px) {
    .navbar-custom .avatar-container {
        width: 3.5rem;
        bottom: -1.6rem;
    }

    .navbar-custom.top-nav-regular .avatar-container {
        width: 5rem;
        bottom: -2rem;
    }
}

@media (min-width:300px) and (max-width:767.98px) {
    .navbar-custom .avatar-container {
        width: 4rem;
        bottom: -1.8rem;
    }

    .navbar-custom.top-nav-regular .avatar-container {
        width: 6rem;
        bottom: -2.2rem;
    }
}

@media (min-width:768px) and (max-width:991.98px) {
    .navbar-custom .avatar-container {
        width: 4.5rem;
        bottom: -2rem;
    }

    .navbar-custom.top-nav-regular .avatar-container {
        width: 7rem;
        bottom: -2.4rem;
    }
}

@media (max-width:767.98px) {
    .navbar-custom .avatar-container {
        display: none !important;
    }
}

/* ---------------------------------------------------------------------
    03. BASE UTILITIES & HELPERS
--------------------------------------------------------------------- */
body {
    background: linear-gradient(180deg, #f5f7ff 0%, #ffffff 140%);
}

/* --------------------------------------------------------------
   TOURNOIS JEUNES – Event list (horizontal cards)
   -------------------------------------------------------------- */
.event-list {
    display: flex !important;
    flex-direction: column !important;
    gap: .9rem;
    margin: 0;
    grid-template-columns: none !important;
}

.event-item {
    --radius: 18px;
    background: #ffffff;
    border: 1px solid #e2e8f4;
    border-radius: var(--radius);
    display: flex;
    align-items: stretch;
    gap: 1.1rem;
    padding: .85rem 1.15rem .85rem .95rem;
    position: relative;
    box-shadow: 0 6px 18px -8px rgba(15, 50, 90, .12);
    transition: border-color .25s ease, box-shadow .25s ease, transform .25s ease;
    overflow: hidden;
}

/* Keep single column layout on all screen sizes */

/* Removed interactive hover overlay; static card appearance */
.event-item:before {
    display: none;
}

.event-item:hover {
    border-color: inherit;
    box-shadow: inherit;
    transform: none;
}

/* Preserve special (orange) border on hover explicitly */
.event-item.special {
    border-color: #ff7b29;
}

.event-item.special:hover {
    border-color: #ff7b29;
}

.event-item.coach {
    border-color: #0a5cc0;
}

.event-item.coach:before {
    background: linear-gradient(135deg, rgba(10, 92, 192, .12), rgba(15, 137, 215, .15));
}

.event-item.special {
    border-color: #ff7b29;
}

.event-item.special:before {
    background: linear-gradient(135deg, rgba(255, 123, 41, .15), rgba(255, 100, 40, .18));
}

.event-item.multi {
    box-shadow: 0 6px 22px -8px rgba(140, 70, 0, .18);
}

/* Price Banner - Better contrast */
.price-banner {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(222, 226, 230, 0.8);
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    font-size: 0.85rem;
}

.price-title {
    font-size: 0.85rem;
    font-weight: 500;
    color: #495057;
}

.price-options {
    display: flex;
    gap: 0.75rem;
}

.price-option {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.4rem;
    border-radius: 4px;
    font-size: 0.8rem;
}

.price-option.member {
    background: rgba(40, 167, 69, 0.15);
    color: #155724;
}

.price-option.external {
    background: rgba(255, 193, 7, 0.2);
    color: #856404;
}

.price-label {
    font-weight: 400;
}

.price-value {
    font-weight: 600;
}

@media (max-width: 600px) {
    .price-banner {
        flex-direction: column;
        text-align: center;
    }

    .price-options {
        justify-content: center;
    }
}

.event-date {
    flex: 0 0 64px;
    background: linear-gradient(135deg, #0d1f33 0%, #0a4d8c 70%, #0f89d7 100%);
    color: #fff;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
    padding: .65rem .3rem .55rem;
    position: relative;
    text-align: center;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 4px 14px -6px rgba(10, 60, 120, .45);
}

.event-item.special .event-date {
    background: linear-gradient(135deg, #ff7b29, #ff5e62);
    box-shadow: 0 4px 14px -6px rgba(200, 60, 10, .5);
}

.event-item.coach:not(.special) .event-date {
    background: linear-gradient(135deg, #0a4d8c, #0f89d7);
}

.event-date .day {
    font-size: 1.55rem;
    font-weight: 800;
    letter-spacing: .5px;
}

.event-date .month {
    font-size: .8rem;
    font-weight: 600;
    margin-top: .15rem;
    opacity: .92;
    text-transform: uppercase;
    letter-spacing: .5px;
}

/* Separator dash for 3-day ranges */
.event-date .day-sep {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1;
    padding: 0 .15rem;
    opacity: .85;
    transform: translateY(-1px);
}

.event-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.event-title {
    font-size: 1rem;
    font-weight: 700;
    color: #102a43;
    margin: 0 0 .25rem;
    letter-spacing: .3px;
}

.event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem .6rem;
    align-items: center;
    font-size: .7rem;
    letter-spacing: .5px;
    text-transform: uppercase;
    font-weight: 600;
    color: #395067;
    margin-bottom: .2rem;
}

.event-meta .organizer {
    color: #1a4e7a;
    font-weight: 700;
}

/* Inline registration / external link button inside event card */
.event-link-btn {
    align-self: center;
    margin-left: auto;
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-alt) 100%);
    color: #fff !important;
    font-size: .62rem;
    letter-spacing: .7px;
    font-weight: 700;
    text-transform: uppercase;
    padding: .45rem .75rem .5rem;
    border-radius: 40px;
    line-height: 1;
    display: inline-flex;
    gap: .35rem;
    align-items: center;
    position: relative;
    text-decoration: none;
    box-shadow: 0 4px 10px -4px rgba(10, 70, 140, .4);
    transition: background .3s ease, transform .25s ease, box-shadow .3s ease;
    white-space: nowrap;
}

.event-link-btn:before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(135deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, 0));
    mix-blend-mode: overlay;
    opacity: .55;
    pointer-events: none;
}

.event-link-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px -8px rgba(10, 70, 140, .55);
    text-decoration: none;
}

.event-link-btn:active {
    transform: translateY(0);
}

@media (prefers-color-scheme:dark) {
    .event-link-btn {
        box-shadow: 0 4px 14px -4px rgba(0, 0, 0, .55);
    }

    .event-link-btn:hover {
        box-shadow: 0 8px 20px -10px rgba(0, 0, 0, .7);
    }
}

.badge {
    background: #e8eff7;
    border-radius: 30px;
    padding: .25rem .55rem .3rem;
    font-size: .6rem;
    font-weight: 700;
    letter-spacing: .6px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    color: #13324d;
    position: relative;
}

.coach-badge {
    color: #ff5e62;
    position: relative;
}

.coach-badge:after {
    content: "";
    position: absolute;
    inset: -2px;
    border-radius: 32px;
    opacity: .55;
    mix-blend-mode: overlay;
    pointer-events: none;
}



/* Hover motion removed for badges */
@media (prefers-reduced-motion:no-preference) {
    .coach-badge {
        transition: none;
    }
}

.special-badge {
    background: linear-gradient(135deg, #ff7b29, #ff5e62);
    color: #fff;
}

.multi-badge {
    background: #ffe6c7;
    color: #7a3d00;
}

.event-raw-date {
    font-size: .65rem;
    font-weight: 600;
    letter-spacing: .4px;
    color: #5a6d85;
    opacity: .85;
}

@media (max-width:640px) {
    .event-item {
        padding: .75rem .85rem;
        gap: .85rem;
    }

    .event-date {
        flex-basis: 56px;
        border-radius: 12px;
    }

    .event-date .day {
        font-size: 1.35rem;
    }

    .event-title {
        font-size: .95rem;
    }
}

@media (prefers-color-scheme:dark) {
    .event-item {
        background: #1f2531;
        border-color: #2d3a47;
    }

    .event-item:hover {
        border-color: #2d3a47;
    }

    /* Dark mode: keep special border color too */
    .event-item.special {
        border-color: #ff7b29;
    }

    .event-item.special:hover {
        border-color: #ff7b29;
    }

    .event-title {
        color: #dfe7ef;
    }

    .event-meta {
        color: #9fb4c9;
    }

    .event-meta .organizer {
        color: #c4ddff;
    }

    .badge {
        background: #2d3a47;
        color: #c4d5e2;
    }

    .multi-badge {
        background: #5a3b00;
        color: #ffddaa;
    }

    .event-raw-date {
        color: #9db1c4;
    }
}

.hero-container {
    max-width: 1220px;
    margin: 0 auto;
    padding: 0;
}

[data-fade-in] {
    opacity: 0;
    transform: translateY(18px);
    animation: fadeUp .8s .15s forwards ease-out;
}

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

/* ---------------------------------------------------------------------
    04. LINKS & TEXT UTILITIES
--------------------------------------------------------------------- */
.myffbad-link {
    color: #ffb347;
    font-weight: 600;
    position: relative;
    text-decoration: none;
}

.myffbad-link:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #ffcf70, #ff9f43);
    opacity: .85;
    transition: opacity .25s;
    border-radius: 2px;
}

.myffbad-link:hover {
    color: #ffc764;
}

.myffbad-link:hover:after {
    opacity: 1;
}

/* ---------------------------------------------------------------------
    05. BUTTONS
--------------------------------------------------------------------- */
.btn-pill {
    border-radius: 3rem;
    padding: .75rem 1.35rem;
    font-weight: 600;
    font-size: .9rem;
    letter-spacing: .5px;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    box-shadow: 0 4px 14px -4px rgba(0, 0, 0, .3);
    transition: .25s background, .25s transform;
}

.btn-pill.gradient {
    background: var(--accent-grad);
    color: #fff;
    border: 0;
}

.btn-pill.outline {
    background: #fff;
    color: var(--accent);
    border: 2px solid var(--accent);
}

.btn-pill:hover {
    transform: translateY(-3px);
    text-decoration: none;
}

.btn-pill:active {
    transform: translateY(0);
}



/* ---------------------------------------------------------------------
    06. LAYOUT CONTAINERS (Hero, Section Titles)
--------------------------------------------------------------------- */
.hero-wrap {
    position: relative;
    overflow: hidden;
    border-radius: 1.75rem;
    padding: 3.5rem 2.25rem 3rem;
    background: var(--accent-grad);
    color: #fff;
    box-shadow: 0 18px 40px -18px rgba(72, 64, 190, .35);
    margin: 2rem auto 3rem;
}

.hero-wrap:before,
.hero-wrap:after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, .15);
    filter: blur(4px);
    pointer-events: none;
}

.hero-wrap:before {
    width: 480px;
    height: 480px;
    top: -160px;
    right: -120px;
}

.hero-wrap:after {
    width: 320px;
    height: 320px;
    bottom: -120px;
    left: -80px;
}

.hero-heading {
    font-family: var(--header-font);
    font-weight: 800;
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    line-height: 1.05;
    margin: 0 0 1rem;
    position: relative;
    z-index: 5;
}

.hero-lead {
    font-size: 1.05rem;
    max-width: 48ch;
    opacity: .92;
    margin-bottom: 1.75rem;
    position: relative;
    z-index: 5;
}

.hero-wrap .d-flex a.btn-pill {
    position: relative;
    z-index: 6;
}

.hero-cta-raise {
    position: relative;
    z-index: 6;
    display: flex;
    flex-wrap: wrap;
    gap: 1.75rem;
}

.section-title {
    font-weight: 800;
    text-align: center;
    margin: 4rem 0 2.5rem;
    position: relative;
    font-size: clamp(1.7rem, 3.5vw, 2.3rem);
}

.section-title:after {
    content: "";
    display: block;
    width: 130px;
    height: 5px;
    border-radius: 3px;
    margin: .75rem auto 0;
    background: var(--accent-grad);
}

/* ---------------------------------------------------------------------
    07. GENERIC COMPONENTS
--------------------------------------------------------------------- */
/* Content cards */
.content-card {
    background: #fff;
    border: 1px solid #e9ecf4;
    border-radius: 1.25rem;
    padding: 2rem 2.2rem;
    margin: 2.5rem 0;
    box-shadow: 0 4px 18px -6px rgba(33, 37, 41, .08);
    position: relative;
}

.content-card h2:first-child,
.content-card h3:first-child {
    margin-top: 0;
}

.content-card.feature {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    align-items: center;
}

.content-card.feature .feature-image {
    flex: 1 1 320px;
}

.content-card.feature .feature-body {
    flex: 1 1 380px;
}

/* Feature list */
.feature-list {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0 1.75rem;
    columns: 2;
    column-gap: 2rem;
}

.feature-list li {
    position: relative;
    padding-left: 1.15rem;
    margin: 0 0 .55rem;
    font-size: .9rem;
    break-inside: avoid;
}

.feature-list li:before {
    content: "";
    position: absolute;
    left: 0;
    top: .45rem;
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-alt) 100%);
}

/* Tables */
table {
    background: #fff;
    border-radius: .75rem;
    border-collapse: separate;
    border-spacing: 0;
    overflow: auto;
    box-shadow: 0 3px 12px -4px rgba(0, 0, 0, .08);
}

table th {
    background: #f5f7ff;
    font-weight: 600;
}

table th,
table td {
    border: none;
}

table tr+tr td {
    border-top: 1px solid #eef1f6;
}

.table-wide-wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 0 1.5rem;
    border-radius: .85rem;
}

.table-wide-wrapper table {
    width: 100%;
    min-width: 0;
    table-layout: auto;
}

/* RIB specific table layout */
table:has(.rib-iban) {
    width: 100%;
    table-layout: fixed;
}

table:has(.rib-iban) td:first-child,
table:has(.rib-iban) th:first-child {
    width: 32%;
}

table:has(.rib-iban) td:last-child,
table:has(.rib-iban) th:last-child {
    width: 68%;
}

@supports not(selector(:has(*))) {
    .rib-table {
        width: 100%;
        table-layout: fixed;
    }

    .rib-table td:first-child,
    .rib-table th:first-child {
        width: 32%;
    }
}

/* Utility: hero container already defined above */

/* ---------------------------------------------------------------------
    08. SHARED DECORATIVE / REUSABLE PATTERNS
--------------------------------------------------------------------- */
/* Raised top accent bar for interactive cards */
.achievement-card:before,
.mission-item:before,
.coach-card:before,
.stat-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--accent-grad);
    opacity: 0;
    transition: opacity .35s ease;
}

/* Circular icon ring (shared) */
.achievement-icon:before,
.stat-item .stat-icon:before,
.mission-icon:before,
.coach-avatar:before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .4), rgba(255, 255, 255, .1));
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
}

/* Flash animation utilities */
@keyframes flashPulse {

    0%,
    68%,
    74%,
    100% {
        opacity: 0;
    }

    70% {
        opacity: .95;
    }
}

@keyframes glowLoop {

    0%,
    100% {
        box-shadow: 0 30px 60px -22px rgba(255, 120, 40, .55), 0 0 0 0 rgba(255, 255, 255, .4), 0 0 18px -2px rgba(255, 255, 255, .25) inset;
    }

    50% {
        box-shadow: 0 30px 60px -22px rgba(255, 120, 40, .55), 0 0 0 14px rgba(255, 255, 255, .05), 0 0 26px -2px rgba(255, 255, 255, .35) inset;
    }
}

/* ---------------------------------------------------------------------
    09. PAGE BLOCKS
--------------------------------------------------------------------- */
/* 09.1 Capacity / Global notice (Home + reusable) */
.capacity-wrapper {
    margin: 1rem 0 2.5rem;
}

.capacity-banner {
    position: relative;
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    background: radial-gradient(circle at 18% 20%, #ffb347 0%, #ff914d 28%, #ff5e62 70%, #dd2c46 100%);
    color: #fff;
    padding: 2.25rem 2.4rem 2.4rem;
    border-radius: 1.9rem;
    margin: 1.25rem 0 2.25rem;
    box-shadow: 0 28px 54px -22px rgba(220, 60, 30, .45), 0 8px 22px -10px rgba(0, 0, 0, .25);
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, .25);
    isolation: isolate;
}

.capacity-banner:before,
.capacity-banner:after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.capacity-banner:before {
    background: repeating-linear-gradient(135deg, rgba(255, 255, 255, .05) 0 22px, rgba(255, 255, 255, 0) 22px 44px);
    mix-blend-mode: overlay;
    opacity: .55;
}

.capacity-banner:after {
    background: radial-gradient(circle at 85% 75%, rgba(255, 255, 255, .25), rgba(255, 255, 255, 0) 55%);
    mix-blend-mode: soft-light;
    opacity: .85;
}

.capacity-banner .cb-icon {
    flex: 0 0 110px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background: linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .05));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    box-shadow: 0 10px 28px -10px rgba(0, 0, 0, .4), 0 0 0 6px rgba(255, 255, 255, .15) inset;
    backdrop-filter: blur(4px) saturate(140%);
    -webkit-backdrop-filter: blur(4px) saturate(140%);
    border: 3px solid rgba(255, 255, 255, .4);
    position: relative;
    z-index: 2;
}

.capacity-banner .cb-content {
    position: relative;
    z-index: 3;
    max-width: 900px;
}

.capacity-banner h2 {
    margin: 0 0 .85rem;
    font-size: clamp(1.55rem, 3vw, 2.2rem);
    font-weight: 800;
    letter-spacing: .5px;
    line-height: 1.1;
    display: flex;
    gap: .7rem;
    align-items: center;
}

.capacity-banner p {
    margin: 0 0 1rem;
    font-size: .98rem;
    line-height: 1.5;
}

.capacity-banner .cb-link {
    color: #fff;
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.capacity-banner .cb-link:hover {
    text-decoration: none;
}

.capacity-banner .cb-meta {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: .8rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    opacity: .9;
}

.capacity-banner .cb-meta li {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.capacity-banner .cb-date {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

.complete-title-red {
    color: #ff1438;
    text-shadow: 0 2px 6px rgba(0, 0, 0, .35);
}

.capacity-banner.capacity-card {
    background: linear-gradient(135deg, #ffe259 0%, #ffa751 45%, #ff7b72 85%, #ff4b6e 100%);
    border: 3px solid rgba(255, 255, 255, .55);
    box-shadow: 0 30px 60px -22px rgba(255, 120, 40, .55), 0 10px 26px -8px rgba(0, 0, 0, .35);
}

.capacity-banner.capacity-card:before {
    opacity: .65;
}

.capacity-banner.capacity-card:after {
    opacity: .9;
}

.capacity-banner.capacity-card h2 {
    text-shadow: 0 4px 18px rgba(0, 0, 0, .35), 0 0 8px rgba(255, 255, 255, .35);
}

.capacity-banner.capacity-card .cb-meta li i {
    color: #fff;
}

.flash-effect {
    animation: glowLoop 6s linear infinite;
}

.flash-effect .flash-layer {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 50%, rgba(255, 255, 255, .75), rgba(255, 255, 255, 0) 55%), radial-gradient(circle at 75% 30%, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0) 60%);
    mix-blend-mode: screen;
    opacity: 0;
    animation: flashPulse 5.5s ease-in-out infinite;
    pointer-events: none;
}

@media (prefers-reduced-motion:reduce) {
    .flash-effect {
        animation: none;
    }

    .flash-effect .flash-layer {
        animation: none;
        opacity: .18;
    }
}

/* 09.2 Presentation Page Elements */
.timeline-list {
    margin: 1.5rem 0;
}

.timeline-item {
    display: flex;
    align-items: center;
    padding: .75rem 0;
    border-left: 3px solid #e9ecf4;
    padding-left: 1.5rem;
    margin-left: 1rem;
    position: relative;
}

.timeline-item:before {
    content: "";
    position: absolute;
    left: -6px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #e9ecf4;
}

.timeline-item.current {
    border-left-color: var(--accent);
    background: rgba(10, 92, 192, .05);
    border-radius: 0 8px 8px 0;
}

.timeline-item.current:before {
    background: var(--accent);
}

.timeline-item i {
    color: var(--accent);
    margin-right: .75rem;
    font-size: 1.1rem;
}

/* Achievement cards */
.achievement-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin: 2rem 0;
}

.achievement-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1.25rem;
    padding: 2.5rem 2rem;
    text-align: center;
    transition: all .4s ease;
    height: 100%;
    box-shadow: 0 8px 32px -8px rgba(10, 92, 192, .15);
    position: relative;
    overflow: hidden;
}

.achievement-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px -12px rgba(10, 92, 192, .25);
    border-color: var(--accent);
}

.achievement-card:hover:before {
    opacity: 1;
}

.achievement-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: var(--accent-grad);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: #fff;
    font-size: 2.2rem;
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, .4);
    position: relative;
}

.achievement-icon.gold {
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 50%, #ffd700 100%);
    color: #fff;
    box-shadow: 0 8px 24px -8px rgba(255, 107, 53, .4);
}

.achievement-card h4 {
    color: #1a365d;
    margin-bottom: 1.2rem;
    font-weight: 800;
    font-size: 1.4rem;
}

.achievement-card p {
    color: #2d3748;
    font-weight: 500;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.badge-number {
    background: var(--accent-grad);
    color: #fff;
    padding: .75rem 1.5rem;
    border-radius: 25px;
    font-size: .85rem;
    font-weight: 700;
    display: inline-block;
    margin-top: 1rem;
    box-shadow: 0 4px 16px -4px rgba(10, 92, 192, .3);
    text-transform: uppercase;
    letter-spacing: .5px;
}

.badge-stars {
    font-size: 2rem;
    margin-top: 1.2rem;
    display: block;
    filter: drop-shadow(0 2px 4px rgba(255, 193, 7, .3));
}

/* Stats */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem 2.25rem;
    margin: 2.5rem 0 3rem;
}

.stat-item {
    text-align: center;
    padding: 2.25rem 1.75rem 2.1rem;
    background: linear-gradient(135deg, #ffffff 0%, #f3f7ff 100%);
    border: 2px solid #c9def5;
    border-radius: 1.25rem;
    transition: all .45s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 30px -10px rgba(10, 92, 192, .18);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.stat-item:hover {
    transform: translateY(-10px);
    box-shadow: 0 18px 54px -14px rgba(10, 92, 192, .3);
    border-color: var(--accent);
}

.stat-item:hover:before {
    opacity: 1;
}

.stat-item .stat-icon {
    width: 82px;
    height: 82px;
    border-radius: 50%;
    background: var(--accent-grad);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #fff;
    margin: 0 0 1.25rem;
    position: relative;
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, .45);
}

.stat-item .stat-content h4 {
    font-size: 1.9rem;
    font-weight: 800;
    margin: 0 0 .35rem;
    background: var(--accent-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: .5px;
}

.stat-item .stat-content span {
    display: block;
    font-size: .95rem;
    font-weight: 600;
    color: #1f3552;
    letter-spacing: .5px;
    text-transform: uppercase;
}

.stat-number {
    display: none;
}

.stat-label {
    display: none;
}

/* Mission items */
.mission-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    margin: 2rem 0;
}

.mission-item {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1.25rem;
    padding: 2.5rem 2rem;
    text-align: center;
    transition: all .4s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 32px -8px rgba(10, 92, 192, .15);
}

.mission-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px -12px rgba(10, 92, 192, .25);
    border-color: var(--accent);
}

.mission-item:hover:before {
    opacity: 1;
}

.mission-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: #fff;
    font-size: 2.2rem;
    position: relative;
    box-shadow: 0 8px 24px -8px rgba(0, 0, 0, .3);
}

.mission-icon.loisir {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    box-shadow: 0 8px 24px -8px rgba(40, 167, 69, .4);
}

.mission-icon.competition {
    background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
    box-shadow: 0 8px 24px -8px rgba(255, 193, 7, .4);
}

.mission-icon.jeunes {
    background: linear-gradient(135deg, #17a2b8 0%, #6f42c1 100%);
    box-shadow: 0 8px 24px -8px rgba(23, 162, 184, .4);
}

.mission-item h4 {
    color: #1a365d;
    margin-bottom: 1.2rem;
    font-weight: 800;
    font-size: 1.4rem;
}

.mission-item p {
    color: #2d3748;
    font-weight: 500;
    line-height: 1.55;
    margin: 0;
}

/* Highlight box & services & commission list */
.highlight-box {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecf4 100%);
    border: 2px solid var(--accent);
    border-radius: 1.5rem;
    padding: 2rem;
    text-align: center;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.highlight-box i,
.highlight-box h4 {
    color: var(--accent);
}

.highlight-box h4 {
    margin-bottom: 1rem;
    font-weight: 700;
}

.highlight-box p {
    color: #000;
    font-weight: 600;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}

.service-item {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1rem;
    padding: 2rem 1.5rem;
    display: flex;
    align-items: center;
    transition: all .3s ease;
    box-shadow: 0 4px 16px -4px rgba(10, 92, 192, .1);
    position: relative;
    overflow: hidden;
}

.service-item:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--accent-grad);
    opacity: 0;
    transition: opacity .3s ease;
}

.service-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, .2);
    border-color: var(--accent);
}

.service-item:hover:before {
    opacity: 1;
}

.service-item i {
    margin-right: 1.2rem;
    font-size: 1.8rem;
    color: var(--accent);
    width: 50px;
    display: flex;
    justify-content: center;
}

.service-item span {
    color: #2d3748;
    font-weight: 600;
    font-size: 1.1rem;
}

.commission-list {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0;
}

.commission-list li {
    display: flex;
    align-items: center;
    padding: .75rem 0;
    border-bottom: 1px solid #f8f9fa;
}

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

.commission-list i {
    margin-right: .75rem;
    font-size: 1.2rem;
}

/* 09.3 Encadrement (coaches) */
.coach-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 2rem;
    margin-top: 1rem;
}

.coach-card {
    background: linear-gradient(135deg, #ffffff 0%, #f3f8ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1.25rem;
    padding: 2rem 1.5rem 1.75rem;
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 30px -10px rgba(10, 92, 192, .18);
    transition: all .45s ease;
}

.coach-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 18px 54px -14px rgba(10, 92, 192, .28);
    border-color: var(--accent);
}

.coach-card:hover:before {
    opacity: 1;
}

.coach-avatar {
    width: 86px;
    height: 86px;
    border-radius: 50%;
    margin: 0 auto 1.1rem;
    background: var(--accent-grad);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #fff;
    position: relative;
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, .45);
}

.coach-avatar.alt {
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    box-shadow: 0 8px 24px -8px rgba(255, 107, 53, .45);
}

.coach-card h4 {
    font-weight: 800;
    color: #1a365d;
    margin-bottom: .35rem;
    letter-spacing: .5px;
}

.coach-role {
    font-weight: 600;
    color: #28527a;
    margin-bottom: .5rem;
}

.coach-slot {
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .5px;
    color: #1f3552;
    margin: .15rem 0;
}

.coach-slot i {
    margin-right: .35rem;
    color: var(--accent);
}

@media (max-width:600px) {
    .coach-grid {
        grid-template-columns: 1fr 1fr;
        gap: 1.25rem;
    }
}

@media (max-width:440px) {
    .coach-grid {
        grid-template-columns: 1fr;
    }
}

/* 09.4 Inscriptions (tabs, table, age grid, alerts) */
.tabs-enroll {
    margin-top: .5rem;
}

.tabs-enroll .tab-list {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-bottom: 1.75rem;
}

.tabs-enroll .tab-btn {
    background: linear-gradient(135deg, #ffffff 0%, #f1f6ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 50px;
    padding: .75rem 1.4rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: .55rem;
    color: #1a365d;
    cursor: pointer;
    position: relative;
    transition: all .35s ease;
    box-shadow: 0 4px 16px -6px rgba(10, 92, 192, .15);
}

.tabs-enroll .tab-btn.active,
.tabs-enroll .tab-btn:hover {
    background: var(--accent-grad);
    color: #fff;
    border-color: var(--accent);
    box-shadow: 0 10px 28px -10px rgba(10, 92, 192, .45);
}

.tabs-enroll .tab-panels {
    position: relative;
}

.tabs-enroll .tab-panel {
    display: none;
    animation: fadePanel .45s ease;
}

.tabs-enroll .tab-panel.active {
    display: block;
}

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

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

.enroll-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: .9rem;
}

.enroll-table thead th {
    background: var(--accent-grad);
    color: #fff;
    padding: .9rem .85rem;
    font-weight: 700;
    font-size: .85rem;
    letter-spacing: .5px;
}

.enroll-table tbody td {
    background: #fff;
    border: 1px solid #e2e8f4;
    padding: .75rem .85rem;
    vertical-align: top;
}

.enroll-table tbody tr:nth-child(even) td {
    background: #f8fbff;
}

.enroll-table td.label {
    font-weight: 700;
    color: #1a365d;
}

.enroll-table span.price-red {
    font-weight: 800;
    font-size: .95rem;
}

.enroll-table thead th:first-child:empty {
    width: 140px;
}

.enroll-table.two-col {
    width: 100%;
    table-layout: fixed;
}

.enroll-table.two-col thead th:first-child {
    width: 180px;
}

.enroll-table.two-col td:first-child {
    width: 180px;
    font-weight: 600;
}

.enroll-table.two-col td:nth-child(2),
.enroll-table.two-col th:nth-child(2) {
    width: auto;
}

.age-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: .75rem;
    margin-top: .75rem;
}

.age-item {
    background: linear-gradient(135deg, #ffffff 0%, #f3f7ff 100%);
    border: 1px solid #d1e7fd;
    border-radius: .75rem;
    padding: .75rem .6rem;
    text-align: center;
    font-weight: 600;
    color: #1a365d;
    font-size: .8rem;
    line-height: 1.15;
}

.age-item span {
    display: block;
    font-weight: 700;
    font-size: .7rem;
    color: #0e1e2f;
    margin-top: .25rem;
}

.check-list {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
}

.check-list li {
    display: flex;
    align-items: center;
    padding: .55rem 0;
    font-weight: 600;
    letter-spacing: .3px;
}

.check-list.tight li {
    padding: .4rem 0;
}

.check-list i {
    background: var(--accent-grad);
    color: #fff;
    margin-right: .6rem;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .9rem;
    box-shadow: 0 4px 12px -4px rgba(10, 92, 192, .35);
}

.tabs-enroll .text-muted {
    color: #5a6d85 !important;
}

.tabs-enroll .tab-btn:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
}

@media (max-width:640px) {
    .tabs-enroll .tab-btn {
        flex: 1 1 calc(50% - .75rem);
        justify-content: center;
    }
}

@media (max-width:430px) {
    .tabs-enroll .tab-btn {
        flex: 1 1 100%;
    }
}

.alert-warning {
    background: linear-gradient(135deg, #fff8e5 0%, #ffe7c2 100%);
    border: 2px solid #f9c66a;
    padding: .9rem 1.1rem;
    border-radius: .85rem;
    font-size: .9rem;
    font-weight: 600;
    color: #5a4105;
    display: flex;
    align-items: flex-start;
    line-height: 1.3;
    box-shadow: 0 4px 14px -6px rgba(180, 120, 10, .25);
}

.alert-warning i {
    color: #d48806;
    margin-top: 2px;
}

/* 09.5 Sponsors (footer block) */
.sponsors-section {
    border-top: 1px solid #e9ecf4;
    padding-top: 2rem;
    margin-top: 2rem;
}

.sponsors-title {
    font-size: .9rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 1.5rem !important;
}

.sponsors-logos {
    gap: 3.5rem !important;
}

.sponsor-link {
    display: inline-block;
    transition: transform .3s ease, opacity .3s ease;
    border-radius: 8px;
    padding: .75rem;
    background: #fff;
    box-shadow: 0 2px 8px -2px rgba(0, 0, 0, .1);
    border: 1px solid #f0f0f0;
}

.sponsor-link:hover {
    transform: translateY(-3px);
    opacity: .9;
    text-decoration: none;
    box-shadow: 0 4px 16px -4px rgba(0, 0, 0, .15);
}

.sponsor-logo {
    height: 120px;
    width: auto;
    max-width: 250px;
    object-fit: contain;
    filter: grayscale(.2);
    transition: filter .3s ease;
}

.sponsor-link:hover .sponsor-logo {
    filter: grayscale(0);
}

@media (max-width:576px) {
    .sponsors-logos {
        gap: 1rem !important;
        flex-direction: column;
        align-items: center;
    }

    .sponsor-logo {
        height: 80px;
        max-width: 180px;
    }

    .sponsors-section {
        padding-top: 1.5rem;
        margin-top: 1.5rem;
    }
}

/* ---------------------------------------------------------------------
    10. DARK MODE (minimal override; keep original intent)
--------------------------------------------------------------------- */
@media (prefers-color-scheme:dark) {
    body {
        background: linear-gradient(180deg, #111827 0%, #1f2937 140%);
        color: #e5e7eb;
    }

    .content-card {
        background: #1f2531;
        border-color: #303a47;
        box-shadow: 0 6px 24px -8px rgba(0, 0, 0, .6);
    }

    table {
        background: #ad1313 !important;
        color: #0f55d7 !important;
        border-color: #dfe4ee !important;
        box-shadow: 0 3px 18px -6px rgba(0, 0, 0, .45) !important;
    }

    table th {
        background: #f2f5fc !important;
        color: #1f242d !important;
    }

    table td {
        color: #222831 !important;
    }

    .price-red {
        color: #d40000 !important;
    }

    table a {
        color: #0b57d0;
    }

    table a:hover {
        color: #063d96;
    }

    .hero-wrap {
        box-shadow: 0 18px 44px -14px rgba(0, 0, 0, .65);
    }

    .feature-list li:before {
        opacity: .85;
    }
}

/* ---------------------------------------------------------------------
    11. RESPONSIVE TWEAKS (Page-specific adjustments)
--------------------------------------------------------------------- */
@media (max-width:768px) {
    .achievement-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .stats-grid {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 1rem;
    }

    .mission-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .services-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .achievement-card,
    .mission-item {
        padding: 1.5rem;
    }

    .highlight-box {
        padding: 1.5rem;
        margin-top: 2rem;
    }
}

@media (max-width:820px) {
    .stats-grid {
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
    }
}

@media (max-width:560px) {
    .stats-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
}

@media (max-width:820px) {
    .capacity-banner {
        flex-direction: column;
        text-align: left;
        padding: 2rem 1.75rem 2.2rem;
    }

    .capacity-banner .cb-icon {
        width: 90px;
        flex: 0 0 90px;
        font-size: 2.4rem;
    }
}

@media (max-width:540px) {
    .capacity-banner {
        gap: 1.25rem;
        border-radius: 1.4rem;
    }

    .capacity-banner h2 {
        font-size: 1.55rem;
    }

    .capacity-banner p {
        font-size: .92rem;
    }

    .capacity-banner .cb-meta {
        flex-direction: column;
        gap: .4rem;
    }
}

/* End of rationalized custom styles */
.navbar-nav>.nav-item {
    min-width: 200px;
    /* wider menu items */
    text-align: center;
}

/* Enlarge logo in avatar-container */
.navbar-custom .avatar-container {
    width: 5rem;
    /* base size (was 3.125rem) */
    bottom: -2.2rem;
    /* drop slightly so it overlaps nicely */
}

.navbar-custom.top-nav-regular .avatar-container {
    width: 9rem;
    /* large screens (was 6.25rem) */
    bottom: -2.8rem;
}

.navbar-custom .avatar-container .avatar-img-border,
.navbar-custom .avatar-container .avatar-img {
    width: 100%;
}

/* White circular background around avatar */
.navbar-custom .avatar-container .avatar-img-border {
    background: #ffffff;
    border-radius: 50%;
    padding: .45rem;
    /* space creating visible white ring */
    box-shadow: 0 4px 14px -4px rgba(0, 0, 0, .25);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    /* clip image to circle */
    aspect-ratio: 1/1;
    /* keep square so circle renders */
}

.navbar-custom .avatar-container .avatar-img {
    border-radius: 50%;
    height: 100%;
    width: 100%;
    object-fit: contain;
    /* keep full logo visible inside circle */
    background: #ffffff;
    /* fallback white behind transparent PNG */
}

/* Increase the brand logo (if using title-img) */
.navbar-custom .navbar-brand-logo img {
    height: 4rem;
    /* small viewports */
}

@media (min-width: 1200px) {
    .navbar-custom .navbar-brand-logo img {
        height: 5.5rem;
        /* large viewports */
    }
}

/* Red price utility */
.price-red {
    color: #c40000;
    font-weight: 600;
}

/* Responsive avatar scaling for small screens */
@media (max-width: 575.98px) {

    /* extra small phones */
    .navbar-custom .avatar-container {
        width: 3.5rem;
        bottom: -1.6rem;
    }

    .navbar-custom.top-nav-regular .avatar-container {
        width: 5rem;
        bottom: -2rem;
    }
}

@media (min-width: 300px) and (max-width: 767.98px) {

    /* small devices */
    .navbar-custom .avatar-container {
        width: 4rem;
        bottom: -1.8rem;
    }

    .navbar-custom.top-nav-regular .avatar-container {
        width: 6rem;
        bottom: -2.2rem;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {

    /* medium tablets */
    .navbar-custom .avatar-container {
        width: 4.5rem;
        bottom: -2rem;
    }

    .navbar-custom.top-nav-regular .avatar-container {
        width: 7rem;
        bottom: -2.4rem;
    }
}

/* ---- Modern theme enhancements ---- */

/* Global background subtle gradient */
body {
    background: linear-gradient(180deg, #f5f7ff 0%, #ffffff 140%);
}

/* Highlighted external registration link */
.myffbad-link {
    color: #ffb347;
    /* warm accent */
    font-weight: 600;
    position: relative;
    text-decoration: none;
}

.myffbad-link:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 2px;
    background: linear-gradient(90deg, #ffcf70, #ff9f43);
    opacity: .85;
    transition: opacity .25s;
    border-radius: 2px;
}

.myffbad-link:hover {
    color: #ffc764;
}

.myffbad-link:hover:after {
    opacity: 1;
}

/* Accent color system */
:root {
    /* Professional subdued blue palette */
    --accent: #0a5cc0;
    /* primary brand blue */
    --accent-alt: #0f89d7;
    /* secondary accent blue */
    --accent-grad: linear-gradient(135deg, #0d1f33 0%, #0a4d8c 55%, #0f89d7 100%);
    /* Alternative ideas (uncomment to test): */
    /* --accent-grad: linear-gradient(140deg,#0e2238 0%,#163d5c 60%,#1b5f87 100%); */
    /* --accent-grad: linear-gradient(125deg,#0f2542 0%,#154c6f 50%,#1d759a 100%); */
}

/* Modern hero section */
.hero-wrap {
    position: relative;
    overflow: hidden;
    border-radius: 1.75rem;
    padding: 3.5rem 2.25rem 3rem;
    background: var(--accent-grad);
    color: #fff;
    box-shadow: 0 18px 40px -18px rgba(72, 64, 190, .35);
    margin: 2rem auto 3rem;
}

.hero-wrap:before,
.hero-wrap:after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, .15);
    filter: blur(4px);
    pointer-events: none;
    /* prevent overlay from blocking clicks */
}

.hero-wrap:before {
    width: 480px;
    height: 480px;
    top: -160px;
    right: -120px;
}

.hero-wrap:after {
    width: 320px;
    height: 320px;
    bottom: -120px;
    left: -80px;
}

.hero-heading {
    font-family: var(--header-font);
    font-weight: 800;
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    line-height: 1.05;
    margin: 0 0 1rem;
    position: relative;
    z-index: 5;
}

.hero-lead {
    font-size: 1.05rem;
    max-width: 48ch;
    opacity: .92;
    margin-bottom: 1.75rem;
    position: relative;
    z-index: 5;
}

/* Ensure CTA buttons in hero are on top */
.hero-wrap .d-flex a.btn-pill {
    position: relative;
    z-index: 6;
}

/* Utility to raise CTA group */
.hero-cta-raise {
    position: relative;
    z-index: 6;
    display: flex;
    flex-wrap: wrap;
    gap: 1.75rem;
    /* increased custom gap */
}

/* Pill buttons */
.btn-pill {
    border-radius: 3rem;
    padding: .75rem 1.35rem;
    font-weight: 600;
    font-size: .9rem;
    letter-spacing: .5px;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    box-shadow: 0 4px 14px -4px rgba(0, 0, 0, .3);
    transition: .25s background, .25s transform;
}

.btn-pill.gradient {
    background: var(--accent-grad);
    color: #fff;
    border: 0;
}

.btn-pill.outline {
    background: #fff;
    color: var(--accent);
    border: 2px solid var(--accent);
}

.btn-pill:hover {
    transform: translateY(-3px);
    text-decoration: none;
}

.btn-pill:active {
    transform: translateY(0);
}

/* Card style sections */
.content-card {
    background: #fff;
    border: 1px solid #e9ecf4;
    border-radius: 1.25rem;
    padding: 2rem 2.2rem;
    margin: 2.5rem 0;
    box-shadow: 0 4px 18px -6px rgba(33, 37, 41, .08);
    position: relative;
}

.content-card h2:first-child,
.content-card h3:first-child {
    margin-top: 0;
}

.content-card.feature {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    align-items: center;
}

.content-card.feature .feature-image {
    flex: 1 1 320px;
}

.content-card.feature .feature-body {
    flex: 1 1 380px;
}

/* Feature list with colored dots */
.feature-list {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0 1.75rem;
    columns: 2;
    column-gap: 2rem;
}

.feature-list li {
    position: relative;
    padding-left: 1.15rem;
    margin: 0 0 .55rem;
    font-size: .9rem;
    break-inside: avoid;
}

.feature-list li:before {
    content: "";
    position: absolute;
    left: 0;
    top: .45rem;
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--accent) 0%, var(--accent-alt) 100%);
}

/* Section title underline accent */
.section-title {
    font-weight: 800;
    text-align: center;
    margin: 4rem 0 2.5rem;
    position: relative;
    font-size: clamp(1.7rem, 3.5vw, 2.3rem);
}

.section-title:after {
    content: "";
    display: block;
    width: 130px;
    height: 5px;
    border-radius: 3px;
    margin: .75rem auto 0;
    background: var(--accent-grad);
}

/* Improve table readability */
table {
    background: #fff;
    border-radius: .75rem;
    border-collapse: separate;
    border-spacing: 0;
    overflow: auto;
    box-shadow: 0 3px 12px -4px rgba(0, 0, 0, .08);
}

table th {
    background: #f5f7ff;
    font-weight: 600;
}

table th,
table td {
    border: none;
}

table tr+tr td {
    border-top: 1px solid #eef1f6;
}

/* Horizontal scroll wrapper for wide tables */
.table-wide-wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 0 1.5rem;
    border-radius: .85rem;
}

.table-wide-wrapper table {
    width: 100%;
    min-width: 0;
    table-layout: auto;
}

/* Narrow tables (single column right side) */
.enroll-table thead th:first-child:empty {
    width: 140px;
}

.enroll-table.two-col {
    width: 100%;
    table-layout: fixed;
}

.enroll-table.two-col thead th:first-child {
    width: 180px;
}

.enroll-table.two-col td:first-child {
    width: 180px;
    font-weight: 600;
}

.enroll-table.two-col td:nth-child(2),
.enroll-table.two-col th:nth-child(2) {
    width: auto;
}

/* Full-width compact info tables (like RIB) */
table:has(.rib-iban) {
    /* target the RIB table specifically */
    width: 100%;
    table-layout: fixed;
}

table:has(.rib-iban) td:first-child,
table:has(.rib-iban) th:first-child {
    width: 32%;
}

table:has(.rib-iban) td:last-child,
table:has(.rib-iban) th:last-child {
    width: 68%;
}

@supports not(selector(:has(*))) {

    /* fallback: apply by class wrapper if :has unsupported */
    .rib-table {
        width: 100%;
        table-layout: fixed;
    }

    .rib-table td:first-child,
    .rib-table th:first-child {
        width: 32%;
    }
}

/* Utility max width for hero inside container */
.hero-container {
    max-width: 1220px;
    margin: 0 auto;
    padding: 0;
}

/* Subtle animation */
[data-fade-in] {
    opacity: 0;
    transform: translateY(18px);
    animation: fadeUp .8s .15s forwards ease-out;
}

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

/* Dark mode quick hook (optional manual) */
@media (prefers-color-scheme: dark) {
    body {
        background: linear-gradient(180deg, #111827 0%, #1f2937 140%);
        color: #e5e7eb;
    }

    .content-card {
        background: #1f2531;
        border-color: #303a47;
        box-shadow: 0 6px 24px -8px rgba(0, 0, 0, .6);
    }

    /* Force high-contrast light style for large data tables (readability) */
    table {
        background: #fff !important;
        color: #fff !important;
        border-color: #dfe4ee !important;
        box-shadow: 0 3px 18px -6px rgba(0, 0, 0, .45) !important;
    }

    table th {
        background: #f2f5fc !important;
        color: #1f242d !important;
    }

    table td {
        color: #222831 !important;
    }

    .price-red {
        color: #d40000 !important;
    }

    table a {
        color: #0b57d0;
    }

    table a:hover {
        color: #063d96;
    }

    .hero-wrap {
        box-shadow: 0 18px 44px -14px rgba(0, 0, 0, .65);
    }

    .feature-list li:before {
        opacity: .85;
    }
}

/* Hide round logo (avatar) on small screens */
@media (max-width: 767.98px) {
    .navbar-custom .avatar-container {
        display: none !important;
    }
}

/* Sponsors section in footer */
.sponsors-section {
    border-top: 1px solid #e9ecf4;
    padding-top: 2rem;
    margin-top: 2rem;
}

.sponsors-title {
    font-size: 0.9rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 1.5rem !important;
}

.sponsors-logos {
    gap: 3.5rem !important;
}

.sponsor-link {
    display: inline-block;
    transition: transform 0.3s ease, opacity 0.3s ease;
    border-radius: 8px;
    padding: 0.75rem;
    background: #fff;
    box-shadow: 0 2px 8px -2px rgba(0, 0, 0, 0.1);
    border: 1px solid #f0f0f0;
}

.sponsor-link:hover {
    transform: translateY(-3px);
    opacity: 0.9;
    text-decoration: none;
    box-shadow: 0 4px 16px -4px rgba(0, 0, 0, 0.15);
}

.sponsor-logo {
    height: 120px;
    width: auto;
    max-width: 250px;
    object-fit: contain;
    filter: grayscale(0.2);
    transition: filter 0.3s ease;
}

.sponsor-link:hover .sponsor-logo {
    filter: grayscale(0);
}

/* Responsive adjustments for sponsors */
@media (max-width: 576px) {
    .sponsors-logos {
        gap: 1rem !important;
        flex-direction: column;
        align-items: center;
    }

    .sponsor-logo {
        height: 80px;
        max-width: 180px;
    }

    .sponsors-section {
        padding-top: 1.5rem;
        margin-top: 1.5rem;
    }
}

/* GLOBAL capacity card + flash */
.capacity-wrapper {
    margin: 1rem 0 2.5rem;
}

.capacity-banner.capacity-card {
    background: linear-gradient(135deg, #ffe259 0%, #ffa751 45%, #ff7b72 85%, #ff4b6e 100%);
    border: 3px solid rgba(255, 255, 255, .55);
    box-shadow: 0 30px 60px -22px rgba(255, 120, 40, .55), 0 10px 26px -8px rgba(0, 0, 0, .35);
}

.capacity-banner.capacity-card:before {
    opacity: .65;
}

.capacity-banner.capacity-card:after {
    opacity: .9;
}

.capacity-banner.capacity-card h2 {
    text-shadow: 0 4px 18px rgba(0, 0, 0, .35), 0 0 8px rgba(255, 255, 255, .35);
}

.capacity-banner.capacity-card .cb-meta li i {
    color: #fff;
}


.flash-effect {
    animation: glowLoop 6s linear infinite;
}

.flash-effect .flash-layer {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 50%, rgba(255, 255, 255, .75), rgba(255, 255, 255, 0) 55%), radial-gradient(circle at 75% 30%, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0) 60%);
    mix-blend-mode: screen;
    opacity: 0;
    animation: flashPulse 5.5s ease-in-out infinite;
    pointer-events: none;
}

@keyframes flashPulse {

    0%,
    68% {
        opacity: 0;
    }

    70% {
        opacity: .95;
    }

    74% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@keyframes glowLoop {

    0%,
    100% {
        box-shadow: 0 30px 60px -22px rgba(255, 120, 40, .55), 0 0 0 0 rgba(255, 255, 255, .4), 0 0 18px -2px rgba(255, 255, 255, .25) inset;
    }

    50% {
        box-shadow: 0 30px 60px -22px rgba(255, 120, 40, .55), 0 0 0 14px rgba(255, 255, 255, .05), 0 0 26px -2px rgba(255, 255, 255, .35) inset;
    }
}

@media (prefers-reduced-motion: reduce) {
    .flash-effect {
        animation: none;
    }

    .flash-effect .flash-layer {
        animation: none;
        opacity: .18;
    }
}

/* ---- Presentation Page Enhancements ---- */

/* Timeline list for presidents */
.timeline-list {
    margin: 1.5rem 0;
}

.timeline-item {
    display: flex;
    align-items: center;
    padding: 0.75rem 0;
    border-left: 3px solid #e9ecf4;
    padding-left: 1.5rem;
    margin-left: 1rem;
    position: relative;
}

.timeline-item:before {
    content: "";
    position: absolute;
    left: -6px;
    top: 50%;
    transform: translateY(-50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #e9ecf4;
}

.timeline-item.current {
    border-left-color: var(--accent);
    background: rgba(10, 92, 192, 0.05);
    border-radius: 0 8px 8px 0;
}

.timeline-item.current:before {
    background: var(--accent);
}

.timeline-item i {
    color: var(--accent);
    margin-right: 0.75rem;
    font-size: 1.1rem;
}

/* Achievement Grid */
.achievement-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin: 2rem 0;
}

/* Achievement cards */
.achievement-card {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1.25rem;
    padding: 2.5rem 2rem;
    text-align: center;
    transition: all 0.4s ease;
    height: 100%;
    box-shadow: 0 8px 32px -8px rgba(10, 92, 192, 0.15);
    position: relative;
    overflow: hidden;
}

.achievement-card:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--accent-grad);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.achievement-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px -12px rgba(10, 92, 192, 0.25);
    border-color: var(--accent);
}

.achievement-card:hover:before {
    opacity: 1;
}

.achievement-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: var(--accent-grad);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: #fff;
    font-size: 2.2rem;
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, 0.4);
    position: relative;
}

.achievement-icon:before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.1));
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
}

.achievement-icon.gold {
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 50%, #ffd700 100%);
    color: #fff;
    box-shadow: 0 8px 24px -8px rgba(255, 107, 53, 0.4);
}

.achievement-card h4 {
    color: #1a365d;
    margin-bottom: 1.2rem;
    font-weight: 800;
    font-size: 1.4rem;
}

.achievement-card p {
    color: #2d3748;
    font-weight: 500;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.badge-number {
    background: var(--accent-grad);
    color: #fff;
    padding: 0.75rem 1.5rem;
    border-radius: 25px;
    font-size: 0.85rem;
    font-weight: 700;
    display: inline-block;
    margin-top: 1rem;
    box-shadow: 0 4px 16px -4px rgba(10, 92, 192, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.badge-stars {
    font-size: 2rem;
    margin-top: 1.2rem;
    display: block;
    filter: drop-shadow(0 2px 4px rgba(255, 193, 7, 0.3));
}

/* Stats Grid */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    /* Force 2 columns */
    gap: 2rem 2.25rem;
    margin: 2.5rem 0 3rem;
}

/* Ensure exactly 4 stat items create a 2x2 balanced grid; if fewer items, they still align naturally */


@media (max-width: 820px) {
    .stats-grid {
        grid-template-columns: 1fr 1fr;
        /* still 2 columns on tablets */
        gap: 1.5rem;
    }
}

@media (max-width: 560px) {
    .stats-grid {
        grid-template-columns: 1fr;
        /* single column on small screens */
        gap: 1.25rem;
    }
}

/* Stat items mimic achievement cards for consistent visual weight */
.stat-item {
    text-align: center;
    padding: 2.25rem 1.75rem 2.1rem;
    background: linear-gradient(135deg, #ffffff 0%, #f3f7ff 100%);
    border: 2px solid #c9def5;
    border-radius: 1.25rem;
    transition: all 0.45s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 30px -10px rgba(10, 92, 192, 0.18);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.stat-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--accent-grad);
    opacity: 0;
    transition: opacity 0.35s ease;
}

.stat-item:hover {
    transform: translateY(-10px);
    box-shadow: 0 18px 54px -14px rgba(10, 92, 192, 0.3);
    border-color: var(--accent);
}

.stat-item:hover:before {
    opacity: 1;
}

/* Circular icon like achievement icon */
.stat-item .stat-icon {
    width: 82px;
    height: 82px;
    border-radius: 50%;
    background: var(--accent-grad);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #fff;
    margin: 0 0 1.25rem;
    position: relative;
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, 0.45);
}

.stat-item .stat-icon:before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.1));
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
}

/* Heading (number) */
.stat-item .stat-content h4 {
    font-size: 1.9rem;
    font-weight: 800;
    margin: 0 0 .35rem;
    background: var(--accent-grad);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    letter-spacing: 0.5px;
}

/* Label */
.stat-item .stat-content span {
    display: block;
    font-size: 0.95rem;
    font-weight: 600;
    color: #1f3552;
    letter-spacing: .5px;
    text-transform: uppercase;
}

/* Remove old unused stat-number/stat-label in this context while keeping compatibility */
.stat-number {
    display: none;
}

.stat-label {
    display: none;
}

.stat-number {
    font-size: 3.5rem;
    font-weight: 900;
    color: var(--accent);
    display: block;
    line-height: 1;
    margin-bottom: 0.8rem;
    background: var(--accent-grad);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 0 4px 8px rgba(10, 92, 192, 0.2);
}

.stat-label {
    font-size: 1rem;
    color: #2d3748;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0;
}

/* Commission list */
.commission-list {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0;
}

.commission-list li {
    display: flex;
    align-items: center;
    padding: 0.75rem 0;
    border-bottom: 1px solid #f8f9fa;
}

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

.commission-list i {
    margin-right: 0.75rem;
    font-size: 1.2rem;
}

/* Highlight box */
.highlight-box {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecf4 100%);
    border: 2px solid var(--accent);
    border-radius: 1.5rem;
    padding: 2rem;
    text-align: center;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.highlight-box i {
    color: var(--accent);
}

.highlight-box h4 {
    color: var(--accent);
    margin-bottom: 1rem;
    font-weight: 700;
}

.highlight-box p {
    color: #000;
    font-weight: 600;
}

/* Mission grid */
.mission-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 2rem;
    margin: 2rem 0;
}

.mission-item {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1.25rem;
    padding: 2.5rem 2rem;
    text-align: center;
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 32px -8px rgba(10, 92, 192, 0.15);
}

.mission-item:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--accent-grad);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.mission-item:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px -12px rgba(10, 92, 192, 0.25);
    border-color: var(--accent);
}

.mission-item:hover:before {
    opacity: 1;
}

.mission-icon {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem;
    color: #fff;
    font-size: 2.2rem;
    position: relative;
    box-shadow: 0 8px 24px -8px rgba(0, 0, 0, 0.3);
}

.mission-icon:before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.1));
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
}

.mission-icon.loisir {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
    box-shadow: 0 8px 24px -8px rgba(40, 167, 69, 0.4);
}

.mission-icon.competition {
    background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
    box-shadow: 0 8px 24px -8px rgba(255, 193, 7, 0.4);
}

.mission-icon.jeunes {
    background: linear-gradient(135deg, #17a2b8 0%, #6f42c1 100%);
    box-shadow: 0 8px 24px -8px rgba(23, 162, 184, 0.4);
}

.mission-item h4 {
    color: #1a365d;
    margin-bottom: 1.2rem;
    font-weight: 800;
    font-size: 1.4rem;
}

.mission-item p {
    color: #2d3748;
    font-weight: 500;
    line-height: 1.55;
    margin: 0;
}

/* Services grid */
.services-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin: 2rem 0;
}

/* Coach / Encadrement Grid */
.coach-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 2rem;
    margin-top: 1rem;
}

.coach-card {
    background: linear-gradient(135deg, #ffffff 0%, #f3f8ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1.25rem;
    padding: 2rem 1.5rem 1.75rem;
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 30px -10px rgba(10, 92, 192, 0.18);
    transition: all .45s ease;
}

.coach-card:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--accent-grad);
    opacity: 0;
    transition: opacity .35s ease;
}

.coach-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 18px 54px -14px rgba(10, 92, 192, .28);
    border-color: var(--accent);
}

.coach-card:hover:before {
    opacity: 1;
}

.coach-avatar {
    width: 86px;
    height: 86px;
    border-radius: 50%;
    margin: 0 auto 1.1rem;
    background: var(--accent-grad);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: #fff;
    position: relative;
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, 0.45);
}

.coach-avatar.alt {
    background: linear-gradient(135deg, #ff6b35 0%, #f7931e 100%);
    box-shadow: 0 8px 24px -8px rgba(255, 107, 53, .45);
}

.coach-avatar:before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 50%;
    padding: 3px;
    background: linear-gradient(135deg, rgba(255, 255, 255, .45), rgba(255, 255, 255, .1));
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: xor;
}

.coach-card h4 {
    font-weight: 800;
    color: #1a365d;
    margin-bottom: .35rem;
    letter-spacing: .5px;
}

.coach-role {
    font-weight: 600;
    color: #28527a;
    margin-bottom: .5rem;
}

.coach-slot {
    font-size: .85rem;
    font-weight: 600;
    letter-spacing: .5px;
    color: #1f3552;
    margin: .15rem 0;
}

.coach-slot i {
    margin-right: .35rem;
    color: var(--accent);
}

/* Check list */
.check-list {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
}

.check-list li {
    display: flex;
    align-items: center;
    padding: .55rem 0;
    font-weight: 600;
    /* darker for contrast */
    letter-spacing: .3px;
}

.check-list i {
    background: var(--accent-grad);
    color: #fff;
    margin-right: .6rem;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .9rem;
    box-shadow: 0 4px 12px -4px rgba(10, 92, 192, .35);
}

@media (max-width: 600px) {
    .coach-grid {
        grid-template-columns: 1fr 1fr;
        gap: 1.25rem;
    }
}

@media (max-width: 440px) {
    .coach-grid {
        grid-template-columns: 1fr;
    }
}

/* Enrollment Tabs (moved out of erroneous nesting) */
.tabs-enroll {
    margin-top: .5rem;
}

.tabs-enroll .tab-list {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    margin-bottom: 1.75rem;
}

.tabs-enroll .tab-btn {
    background: linear-gradient(135deg, #ffffff 0%, #f1f6ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 50px;
    padding: .75rem 1.4rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: .55rem;
    color: #1a365d;
    cursor: pointer;
    position: relative;
    transition: all .35s ease;
    box-shadow: 0 4px 16px -6px rgba(10, 92, 192, .15);
}

.tabs-enroll .tab-btn.active,
.tabs-enroll .tab-btn:hover {
    background: var(--accent-grad);
    color: #fff;
    border-color: var(--accent);
    box-shadow: 0 10px 28px -10px rgba(10, 92, 192, .45);
}

.tabs-enroll .tab-panels {
    position: relative;
}

.tabs-enroll .tab-panel {
    display: none;
    animation: fadePanel .45s ease;
}

.tabs-enroll .tab-panel.active {
    display: block;
}

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

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

/* Enrollment table */
.enroll-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: .9rem;
}

.enroll-table thead th {
    background: var(--accent-grad);
    color: #fff;
    padding: .9rem .85rem;
    font-weight: 700;
    font-size: .85rem;
    letter-spacing: .5px;
}

.enroll-table tbody td {
    background: #fff;
    border: 1px solid #e2e8f4;
    padding: .75rem .85rem;
    vertical-align: top;
}

.enroll-table tbody tr:nth-child(even) td {
    background: #f8fbff;
}

.enroll-table td.label {
    font-weight: 700;
    color: #1a365d;
}

.enroll-table span.price-red {
    font-weight: 800;
    font-size: .95rem;
}

/* Age grid */
.age-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: .75rem;
    margin-top: .75rem;
}

.age-item {
    background: linear-gradient(135deg, #ffffff 0%, #f3f7ff 100%);
    border: 1px solid #d1e7fd;
    border-radius: .75rem;
    padding: .75rem .6rem;
    text-align: center;
    font-weight: 600;
    color: #1a365d;
    font-size: .8rem;
    line-height: 1.15;
}

.age-item span {
    display: block;
    font-weight: 700;
    font-size: .7rem;
    color: #0e1e2f;
    margin-top: .25rem;
}

.check-list.tight li {
    padding: .4rem 0;
}

.tabs-enroll .text-muted {
    color: #5a6d85 !important;
}

.tabs-enroll .tab-btn:focus-visible {
    outline: 3px solid var(--accent);
    outline-offset: 2px;
}

@media (max-width:640px) {
    .tabs-enroll .tab-btn {
        flex: 1 1 calc(50% - .75rem);
        justify-content: center;
    }
}

@media (max-width:430px) {
    .tabs-enroll .tab-btn {
        flex: 1 1 100%;
    }
}

/* Alert warning */
.alert-warning {
    background: linear-gradient(135deg, #fff8e5 0%, #ffe7c2 100%);
    border: 2px solid #f9c66a;
    padding: .9rem 1.1rem;
    border-radius: .85rem;
    font-size: .9rem;
    font-weight: 600;
    color: #5a4105;
    display: flex;
    align-items: flex-start;
    line-height: 1.3;
    box-shadow: 0 4px 14px -6px rgba(180, 120, 10, .25);
}

.alert-warning i {
    color: #d48806;
    margin-top: 2px;
}

.service-item {
    background: linear-gradient(135deg, #ffffff 0%, #f8f9ff 100%);
    border: 2px solid #d1e7fd;
    border-radius: 1rem;
    padding: 2rem 1.5rem;
    display: flex;
    align-items: center;
    transition: all 0.3s ease;
    box-shadow: 0 4px 16px -4px rgba(10, 92, 192, 0.1);
    position: relative;
    overflow: hidden;
}

.service-item:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--accent-grad);
    opacity: 0;
    transition: opacity 0.3s ease;
}

.service-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 24px -8px rgba(10, 92, 192, 0.2);
    border-color: var(--accent);
}

.service-item:hover:before {
    opacity: 1;
}

.service-item i {
    margin-right: 1.2rem;
    font-size: 1.8rem;
    color: var(--accent);
    width: 50px;
    display: flex;
    justify-content: center;
}

.service-item span {
    color: #2d3748;
    font-weight: 600;
    font-size: 1.1rem;
}

/* Responsive adjustments for presentation page */
@media (max-width: 768px) {
    .achievement-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .stats-grid {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
        gap: 1rem;
    }

    .mission-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .services-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }

    .achievement-card,
    .mission-item {
        padding: 1.5rem;
    }

    .highlight-box {
        padding: 1.5rem;
        margin-top: 2rem;
    }
}

/* --- Capacity / Full notice banner --- */
.capacity-banner {
    position: relative;
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    background: radial-gradient(circle at 18% 20%, #ffb347 0%, #ff914d 28%, #ff5e62 70%, #dd2c46 100%);
    color: #fff;
    padding: 2.25rem 2.4rem 2.4rem;
    border-radius: 1.9rem;
    margin: 1.25rem 0 2.25rem;
    box-shadow: 0 28px 54px -22px rgba(220, 60, 30, 0.45), 0 8px 22px -10px rgba(0, 0, 0, .25);
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, .25);
    isolation: isolate;
}

.capacity-banner:before,
.capacity-banner:after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(135deg, rgba(255, 255, 255, .05) 0 22px, rgba(255, 255, 255, 0) 22px 44px);
    mix-blend-mode: overlay;
    pointer-events: none;
    opacity: .55;
}

.capacity-banner:after {
    background: radial-gradient(circle at 85% 75%, rgba(255, 255, 255, .25), rgba(255, 255, 255, 0) 55%);
    mix-blend-mode: soft-light;
    opacity: .85;
}

.capacity-banner .cb-icon {
    flex: 0 0 110px;
    aspect-ratio: 1/1;
    border-radius: 50%;
    background: linear-gradient(145deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .05));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    box-shadow: 0 10px 28px -10px rgba(0, 0, 0, .4), 0 0 0 6px rgba(255, 255, 255, .15) inset;
    backdrop-filter: blur(4px) saturate(140%);
    -webkit-backdrop-filter: blur(4px) saturate(140%);
    border: 3px solid rgba(255, 255, 255, .4);
    position: relative;
    z-index: 2;
}

.capacity-banner .cb-icon i {
    color: #fff;
    text-shadow: 0 4px 18px rgba(0, 0, 0, .3);
}

.capacity-banner .cb-content {
    position: relative;
    z-index: 3;
    max-width: 900px;
}

.capacity-banner h2 {
    margin: 0 0 .85rem;
    font-size: clamp(1.55rem, 3vw, 2.2rem);
    font-weight: 800;
    letter-spacing: .5px;
    line-height: 1.1;
    display: flex;
    gap: .7rem;
    align-items: center;
}

.capacity-banner p {
    margin: 0 0 1rem;
    font-size: .98rem;
    line-height: 1.5;
}

.capacity-banner p strong {
    font-weight: 700;
}

.capacity-banner .cb-link {
    color: #fff;
    font-weight: 700;
    text-decoration: underline;
    text-decoration-thickness: 2px;
}

.capacity-banner .cb-link:hover {
    text-decoration: none;
}

.capacity-banner .cb-meta {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: .8rem;
    display: flex;
    flex-wrap: wrap;
    gap: 1.2rem;
    opacity: .9;
}

.capacity-banner .cb-meta li {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.capacity-banner .cb-meta i {
    font-size: .85rem;
    opacity: .85;
}

.capacity-banner .cb-date {
    font-variant-numeric: tabular-nums;
    font-weight: 600;
}

@media (max-width: 820px) {
    .capacity-banner {
        flex-direction: column;
        text-align: left;
        padding: 2rem 1.75rem 2.2rem;
    }

    .capacity-banner .cb-icon {
        width: 90px;
        flex: 0 0 90px;
        font-size: 2.4rem;
    }
}

@media (max-width: 540px) {
    .capacity-banner {
        gap: 1.25rem;
        border-radius: 1.4rem;
    }

    .capacity-banner h2 {
        font-size: 1.55rem;
    }

    .capacity-banner p {
        font-size: .92rem;
    }

    .capacity-banner .cb-meta {
        flex-direction: column;
        gap: .4rem;
    }
}

/* Emphasis red title for capacity banner */
.complete-title-red {
    color: #ff1438;
    text-shadow: 0 2px 6px rgba(0, 0, 0, .35);
}

/* ---------------------------------------------------------------------
    AUTUMN BREAK SCHEDULE STYLES
--------------------------------------------------------------------- */
.schedule-day {
    margin-bottom: 1.5rem;
}

.schedule-day h4 {
    margin-bottom: 0.5rem;
}

.schedule-session {
    margin: 0.25rem 0;
}

.schedule-session:first-child {
    margin-top: 0;
}

.schedule-session:only-child {
    margin: 0;
}

.session-badge {
    padding: 0.4rem 0.7rem;
    border-radius: 0.4rem;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    display: inline-block;
    margin-right: 0.5rem;
}

.session-badge.loisirs {
    background: #1e3a8a;
    color: #ffffff;
    border: 1px solid #1d4ed8;
}

.session-badge.competiteurs {
    background: #dc2626;
    color: #ffffff;
    border: 1px solid #ef4444;
}

.session-badge.pour-tous {
    background: #059669;
    color: #ffffff;
    border: 1px solid #10b981;
}

.schedule-cta {
    gap: 1rem;
    margin-top: 2rem;
}