:root {
    --bg: #07090d;
    --bg-soft: #101318;
    --card: #ffffff;
    --card-dark: #151923;
    --text: #111827;
    --text-light: #f8fafc;
    --muted: #6b7280;
    --muted-light: #aeb6c4;
    --border: #e5e7eb;
    --border-dark: rgba(255,255,255,.12);
    --yellow: #f5bf16;
    --yellow-2: #ffd84d;
    --success: #16a34a;
    --danger: #dc2626;
    --shadow: 0 22px 55px rgba(0, 0, 0, .16);
    --radius: 24px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    font-family: Inter, Arial, Helvetica, sans-serif;
    background: #f5f6f8;
    color: var(--text);
    line-height: 1.5;
}

a { color: inherit; }

.container {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
}

.site-header {
    background: rgba(7, 9, 13, .96);
    color: #fff;
    position: sticky;
    top: 0;
    z-index: 20;
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 78px;
    gap: 18px;
}

.brand-logo {
    width: 284px;
    max-width: 46vw;
    display: block;
}

.main-nav {
    display: flex;
    align-items: center;
    gap: 8px;
}

.main-nav a {
    color: #fff;
    text-decoration: none;
    padding: 10px 13px;
    border-radius: 999px;
    font-weight: 800;
    opacity: .88;
    white-space: nowrap;
}

.main-nav a:hover {
    background: rgba(255,255,255,.08);
    opacity: 1;
}

.hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 15% 20%, rgba(245,191,22,.34), transparent 26%),
        radial-gradient(circle at 90% 0%, rgba(255,255,255,.14), transparent 18%),
        linear-gradient(135deg, #080b10 0%, #151923 45%, #07090d 100%);
    color: var(--text-light);
    padding: 62px 0 46px;
}

.hero:before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .16;
    background-image:
        linear-gradient(115deg, transparent 0 45%, rgba(255,255,255,.24) 45% 46%, transparent 46% 100%),
        repeating-linear-gradient(90deg, rgba(255,255,255,.10) 0 1px, transparent 1px 80px);
    transform: skewY(-2deg);
}

.hero .container {
    position: relative;
    z-index: 1;
}

.hero-kicker {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #111;
    background: var(--yellow);
    padding: 7px 12px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 950;
    letter-spacing: .02em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.hero h1 {
    font-size: clamp(36px, 6vw, 72px);
    max-width: 980px;
    line-height: .98;
    letter-spacing: -0.055em;
    margin: 0 0 20px;
}

.hero p {
    color: var(--muted-light);
    max-width: 820px;
    font-size: 19px;
    margin: 0 0 10px;
}

.search-panel {
    max-width: 1040px;
    margin-top: 28px;
    padding: 12px;
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 24px;
}

.search-box {
    display: grid;
    grid-template-columns: 1fr auto auto;
    gap: 10px;
}

input, textarea, select {
    width: 100%;
    padding: 14px 15px;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: #fff;
    color: var(--text);
    font: inherit;
}

textarea { min-height: 130px; resize: vertical; }

button, .btn {
    border: none;
    background: #111827;
    color: #fff;
    padding: 14px 18px;
    border-radius: 14px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-weight: 950;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
    min-height: 48px;
}

button:hover, .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(0,0,0,.12);
}

.btn.secondary {
    background: #fff;
    color: var(--text);
    border: 1px solid var(--border);
}

.btn.ghost {
    background: transparent;
    border: 1px solid rgba(255,255,255,.22);
    color: #fff;
}

.btn.accent {
    background: var(--yellow);
    color: #111;
}

.btn.small {
    min-height: auto;
    padding: 9px 12px;
    font-size: 13px;
}

.quick-activities {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 12px;
}

.quick-activities a {
    color: #fff;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,.16);
    background: rgba(255,255,255,.08);
    border-radius: 999px;
    padding: 9px 12px;
    font-weight: 850;
    font-size: 14px;
}

.quick-activities a:hover {
    background: rgba(245,191,22,.18);
    border-color: rgba(245,191,22,.45);
}

.section {
    padding: 38px 0;
}

.section-head {
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 18px;
    margin-bottom: 18px;
}

.section h2 {
    font-size: clamp(26px, 3vw, 38px);
    line-height: 1.05;
    margin: 0 0 10px;
    letter-spacing: -0.035em;
}

.grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.activity-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}

.activity-card {
    position: relative;
    overflow: hidden;
    min-height: 142px;
    background: linear-gradient(135deg, #151923, #080b10);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 22px;
    padding: 18px;
    color: #fff;
    text-decoration: none;
    box-shadow: 0 14px 35px rgba(0,0,0,.14);
}

.activity-card:before {
    content: "";
    position: absolute;
    right: -34px;
    bottom: -34px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background: rgba(245,191,22,.18);
}

.activity-card .icon {
    display: inline-flex;
    width: 42px;
    height: 42px;
    align-items: center;
    justify-content: center;
    background: var(--yellow);
    color: #111;
    border-radius: 14px;
    font-size: 22px;
    font-weight: 900;
    margin-bottom: 14px;
}

.activity-card h3 {
    margin: 0 0 6px;
    font-size: 21px;
    letter-spacing: -0.025em;
}

.activity-card p {
    margin: 0;
    color: var(--muted-light);
    font-size: 14px;
}

.card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 22px;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .06);
}

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

.city-card {
    position: relative;
    min-height: 170px;
    overflow: hidden;
    text-decoration: none;
    color: #fff;
    background:
        radial-gradient(circle at 80% 15%, rgba(245,191,22,.38), transparent 34%),
        linear-gradient(135deg, #151923, #080b10);
}

.city-card:after {
    content: "↗";
    position: absolute;
    right: 18px;
    bottom: 14px;
    color: var(--yellow);
    font-size: 28px;
    font-weight: 900;
}

.city-card h3 {
    font-size: 27px;
    margin: 0 0 8px;
}

.city-card p {
    color: var(--muted-light);
    margin: 0;
}

.badge {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 13px;
    background: #fff;
    color: var(--muted);
    margin-right: 6px;
    margin-bottom: 6px;
    font-weight: 850;
}

.badge.featured {
    background: #fff7dd;
    color: #7c5200;
    border-color: #efd082;
}

.badge.verified {
    background: #e9f9ef;
    color: var(--success);
    border-color: #bfe8cc;
}

.badge.dark {
    background: rgba(255,255,255,.08);
    border-color: rgba(255,255,255,.14);
    color: #fff;
}

.muted { color: var(--muted); }
.small { font-size: 13px; }

.facet-bar {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 4px 0 14px;
    -webkit-overflow-scrolling: touch;
}

.facet-bar a {
    flex: 0 0 auto;
    text-decoration: none;
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 10px 13px;
    background: #fff;
    font-weight: 850;
    font-size: 14px;
}

.facet-bar a.active {
    background: #111827;
    color: #fff;
    border-color: #111827;
}

.gym-list {
    display: grid;
    gap: 16px;
}

.gym-row {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    display: grid;
    grid-template-columns: 1fr 170px;
    gap: 20px;
    align-items: center;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .06);
}

.gym-row:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    background: var(--yellow);
}

.gym-row h3 {
    font-size: 24px;
    margin: 8px 0 8px;
}

.gym-row h3 a {
    text-decoration: none;
}

.gym-row p {
    margin: 8px 0;
}

.gym-meta {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.rating {
    font-size: 34px;
    font-weight: 950;
    letter-spacing: -0.04em;
}

.rating-card {
    background: linear-gradient(135deg, #111827, #1f2937);
    color: #fff;
    border: 0;
}

.rating-card .muted {
    color: var(--muted-light);
}

.rating-card .rating {
    color: var(--yellow);
}

.map-placeholder {
    position: relative;
    background:
        linear-gradient(135deg, rgba(245,191,22,.16), rgba(255,255,255,.88)),
        repeating-linear-gradient(45deg, rgba(17,24,39,.06) 0 1px, transparent 1px 30px);
    border: 1px dashed #9ca3af;
    border-radius: var(--radius);
    padding: 54px 24px;
    text-align: center;
    color: #4b5563;
    overflow: hidden;
}

.map-placeholder:before {
    content: "⌖";
    display: block;
    font-size: 58px;
    color: var(--yellow);
    line-height: 1;
    margin-bottom: 8px;
}

.table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 12px 34px rgba(15, 23, 42, .06);
}

.table th, .table td {
    padding: 15px;
    border-bottom: 1px solid var(--border);
    text-align: left;
    vertical-align: top;
}

.table th {
    width: 220px;
    background: #fafafa;
}

.notice {
    padding: 14px 16px;
    border-radius: 14px;
    background: #fff7dd;
    border: 1px solid #efd082;
    margin-bottom: 16px;
}

.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

.full { grid-column: 1 / -1; }

.gym-hero-card {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 22px;
    align-items: stretch;
    margin-top: 28px;
}

.visual-panel {
    min-height: 310px;
    border-radius: 30px;
    background:
        radial-gradient(circle at 25% 25%, rgba(245,191,22,.75), transparent 23%),
        linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
        linear-gradient(135deg, #1d2430, #080b10);
    border: 1px solid rgba(255,255,255,.12);
    position: relative;
    overflow: hidden;
}

.visual-panel:before {
    content: "";
    position: absolute;
    inset: -30%;
    background:
        repeating-linear-gradient(115deg, transparent 0 48px, rgba(255,255,255,.08) 48px 50px),
        radial-gradient(circle at 75% 75%, rgba(245,191,22,.25), transparent 28%);
    transform: rotate(-6deg);
}

.visual-panel:after {
    content: "FITNESS";
    position: absolute;
    right: -22px;
    bottom: 20px;
    font-size: 72px;
    font-weight: 950;
    color: rgba(255,255,255,.08);
    letter-spacing: -0.06em;
}

.stat-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-top: 22px;
}

.stat {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 18px;
    padding: 16px;
}

.stat strong {
    display: block;
    color: var(--yellow);
    font-size: 24px;
}

.review-card {
    border-left: 5px solid var(--yellow);
}

.claim-zone {
    margin-top: 18px;
    padding: 18px;
    background: #f9fafb;
    border: 1px dashed #d1d5db;
    border-radius: 18px;
}

.claim-zone a {
    font-weight: 850;
}

.site-footer {
    margin-top: 50px;
    padding: 38px 0;
    background: #080b10;
    color: #fff;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    gap: 24px;
}

.footer-logo {
    width: 260px;
    max-width: 100%;
    margin-bottom: 14px;
}

.site-footer a {
    display: block;
    color: #fff;
    text-decoration: none;
    margin: 7px 0;
    opacity: .86;
}

.footer-title {
    color: var(--yellow);
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.site-footer .muted {
    color: #d1d5db;
}

.admin-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 20px;
    padding: 24px 0;
}

.admin-menu a {
    display: block;
    background: #fff;
    padding: 12px;
    border-radius: 10px;
    margin-bottom: 8px;
    text-decoration: none;
}

.mobile-bottom-bar {
    display: none;
}

@media (max-width: 980px) {
    .activity-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid, .form-grid, .admin-layout, .gym-hero-card, .footer-grid {
        grid-template-columns: 1fr;
    }

    .stat-strip {
        grid-template-columns: repeat(2, 1fr);
    }

    .gym-row {
        grid-template-columns: 1fr;
    }

    .header-inner {
        min-height: auto;
        padding: 10px 0;
    }

    .brand-logo {
        width: 230px;
        max-width: 62vw;
    }

    .main-nav {
        gap: 4px;
    }

    .main-nav a {
        font-size: 13px;
        padding: 8px 9px;
    }
}

@media (max-width: 640px) {
    body {
        padding-bottom: 70px;
    }

    .container {
        width: min(100% - 22px, 1180px);
    }

    .site-header {
        position: sticky;
    }

    .header-inner {
        justify-content: center;
        flex-direction: column;
        gap: 8px;
    }

    .brand-logo {
        width: 245px;
        max-width: 92vw;
    }

    .main-nav {
        width: 100%;
        overflow-x: auto;
        justify-content: flex-start;
        padding-bottom: 4px;
        scrollbar-width: none;
    }

    .main-nav::-webkit-scrollbar {
        display: none;
    }

    .hero {
        padding: 34px 0 30px;
    }

    .hero h1 {
        font-size: 38px;
        line-height: 1;
    }

    .hero p {
        font-size: 16px;
    }

    .search-panel {
        padding: 10px;
        border-radius: 20px;
    }

    .search-box {
        grid-template-columns: 1fr;
    }

    button, .btn, input, select {
        min-height: 50px;
        font-size: 16px;
    }

    .quick-activities {
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 4px;
    }

    .quick-activities a {
        flex: 0 0 auto;
    }

    .section {
        padding: 28px 0;
    }

    .section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .activity-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .activity-card {
        min-height: 112px;
        display: grid;
        grid-template-columns: 52px 1fr;
        gap: 12px;
        align-items: center;
        padding: 14px;
    }

    .activity-card .icon {
        margin: 0;
    }

    .activity-card h3 {
        font-size: 19px;
    }

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

    .city-card {
        min-height: 130px;
    }

    .gym-row {
        padding: 17px 17px 18px;
        border-radius: 20px;
    }

    .gym-row h3 {
        font-size: 21px;
    }

    .rating {
        font-size: 30px;
    }

    .table th, .table td {
        display: block;
        width: 100%;
    }

    .table th {
        border-bottom: 0;
    }

    .visual-panel {
        min-height: 190px;
    }

    .stat-strip {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .stat {
        padding: 12px;
    }

    .mobile-bottom-bar {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 30;
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        background: rgba(7,9,13,.96);
        border-top: 1px solid rgba(255,255,255,.1);
        backdrop-filter: blur(14px);
    }

    .mobile-bottom-bar a {
        color: #fff;
        text-decoration: none;
        text-align: center;
        padding: 10px 4px 11px;
        font-size: 12px;
        font-weight: 850;
    }

    .mobile-bottom-bar span {
        display: block;
        color: var(--yellow);
        font-size: 17px;
        line-height: 1;
        margin-bottom: 3px;
    }
}


/* Correctif intégré - header compact desktop + mobile */
.site-header {
    box-shadow: 0 8px 24px rgba(0,0,0,.10);
}

@media (min-width: 641px) {
    .header-inner {
        min-height: 58px;
        padding: 6px 0;
    }

    .brand-logo {
        width: 220px;
    }

    .main-nav a {
        padding: 7px 10px;
        font-size: 14px;
    }
}

@media (max-width: 640px) {
    .header-inner {
        min-height: 54px;
        padding: 6px 0;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: 8px;
    }

    .brand-logo {
        width: 185px;
        max-width: 62vw;
    }

    .main-nav {
        width: auto;
        max-width: 38vw;
        justify-content: flex-end;
        overflow-x: auto;
        gap: 4px;
        padding-bottom: 0;
        scrollbar-width: none;
    }

    .main-nav::-webkit-scrollbar {
        display: none;
    }

    .main-nav a {
        font-size: 0;
        padding: 8px;
        min-width: 36px;
        min-height: 36px;
        border-radius: 12px;
        background: rgba(255,255,255,.07);
    }

    .main-nav a:nth-child(1)::after {
        content: "⌕";
        font-size: 17px;
    }

    .main-nav a:nth-child(2)::after {
        content: "●";
        font-size: 15px;
        color: var(--yellow);
    }

    .main-nav a:nth-child(3),
    .main-nav a:nth-child(4) {
        display: none;
    }

    .hero {
        padding-top: 28px;
    }
}

@media (max-width: 420px) {
    .brand-logo {
        width: 168px;
        max-width: 60vw;
    }

    .main-nav {
        max-width: 36vw;
    }
}


/* V6.2 - refonte du header */
.site-header {
    background: linear-gradient(180deg, rgba(6,9,14,.98) 0%, rgba(9,12,18,.95) 100%);
    border-bottom: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 12px 32px rgba(0,0,0,.16);
}

.header-inner {
    min-height: 86px;
    padding: 10px 0;
    gap: 22px;
}

.brand {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    text-decoration: none;
}

.brand-logo {
    display: block;
    width: clamp(230px, 23vw, 330px);
    max-width: 100%;
    height: auto;
}

.main-nav {
    margin-left: auto;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.main-nav a {
    padding: 11px 14px;
    border-radius: 14px;
    font-size: 15px;
    font-weight: 850;
    color: rgba(255,255,255,.92);
    background: transparent;
    border: 1px solid transparent;
}

.main-nav a:hover {
    background: rgba(255,255,255,.06);
    border-color: rgba(255,255,255,.08);
}

.site-footer .footer-logo {
    width: min(280px, 100%);
    height: auto;
}

@media (max-width: 980px) {
    .header-inner {
        min-height: 74px;
        padding: 8px 0;
    }

    .brand-logo {
        width: clamp(210px, 34vw, 280px);
    }

    .main-nav a {
        padding: 9px 11px;
        font-size: 14px;
    }
}

@media (max-width: 640px) {
    .header-inner {
        min-height: 66px;
        padding: 8px 0;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
    }

    .brand {
        min-width: 0;
    }

    .brand-logo {
        width: clamp(165px, 46vw, 210px);
        max-width: 100%;
    }

    .main-nav {
        margin-left: 0;
        width: auto;
        max-width: 42vw;
        gap: 5px;
        flex-wrap: nowrap;
        overflow-x: auto;
        justify-content: flex-end;
    }

    .main-nav a {
        font-size: 0;
        padding: 9px;
        min-width: 38px;
        min-height: 38px;
        border-radius: 12px;
        background: rgba(255,255,255,.06);
        border-color: rgba(255,255,255,.05);
    }

    .main-nav a:nth-child(1)::after {
        content: "⌕";
        font-size: 17px;
    }

    .main-nav a:nth-child(2)::after {
        content: "●";
        font-size: 15px;
        color: var(--yellow);
    }

    .main-nav a:nth-child(3),
    .main-nav a:nth-child(4) {
        display: none;
    }
}


/* V7.8 ranking, legal, forms */
.badge.featured {
    background: linear-gradient(135deg, #f5bf16, #ffe08a);
    color: #111827;
    border: 0;
}
.notice.error {
    background: #fef2f2;
    border-color: #fecaca;
    color: #991b1b;
}
.legal-content h2 {
    margin-top: 24px;
}
.legal-content p {
    line-height: 1.7;
}
.cookie-banner {
    position: fixed;
    left: 18px;
    right: 18px;
    bottom: 18px;
    z-index: 80;
    background: rgba(17,24,39,.96);
    color: #fff;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 18px;
    padding: 16px;
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 20px 50px rgba(0,0,0,.30);
}
.cookie-banner p {
    margin: 0 0 4px;
}
.cookie-banner a {
    color: #f5bf16;
}
.cookie-actions {
    display: flex;
    gap: 8px;
    flex: 0 0 auto;
}
@media(max-width: 640px) {
    .cookie-banner {
        flex-direction: column;
        align-items: stretch;
    }
    .cookie-actions {
        width: 100%;
    }
    .cookie-actions .btn {
        flex: 1;
    }
}


/* V8.0 cookie banner fix */
.cookie-banner {
    position: fixed;
    left: 16px;
    right: 16px;
    bottom: 16px;
    z-index: 99999;
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px;
    border-radius: 18px;
    background: rgba(17,24,39,.98);
    color: #fff;
    box-shadow: 0 20px 60px rgba(0,0,0,.28);
    border: 1px solid rgba(255,255,255,.10);
}

.cookie-banner p {
    margin: 0 0 4px;
    color: #fff;
}

.cookie-banner a {
    color: var(--yellow);
}

.cookie-actions {
    display: flex;
    gap: 10px;
    flex: 0 0 auto;
}

.cookie-actions button {
    cursor: pointer;
    pointer-events: auto;
}

@media (max-width: 640px) {
    .cookie-banner {
        flex-direction: column;
        align-items: stretch;
        left: 10px;
        right: 10px;
        bottom: 76px;
    }
    .cookie-actions {
        width: 100%;
    }
    .cookie-actions .btn {
        flex: 1;
        text-align: center;
    }
}


/* V9.2 vraie carte interactive */
.map-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.6fr) minmax(280px, .9fr);
    gap: 18px;
    align-items: stretch;
}

.real-map {
    min-height: 520px;
    border-radius: 24px;
    overflow: hidden;
    background: #e5e7eb;
    border: 1px solid rgba(17, 24, 39, .12);
    box-shadow: 0 18px 45px rgba(17, 24, 39, .12);
}

.map-side-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 520px;
    overflow: auto;
    padding-right: 4px;
}

.map-side-item {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 10px;
    padding: 12px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(17, 24, 39, .10);
    text-decoration: none;
    color: inherit;
    box-shadow: 0 8px 22px rgba(17, 24, 39, .06);
}

.map-side-item:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 28px rgba(17, 24, 39, .10);
}

.map-side-item small {
    display: block;
    color: #6b7280;
    margin-top: 3px;
    line-height: 1.35;
}

.map-rank,
.map-marker {
    display: inline-flex;
    width: 32px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #f5bf16;
    color: #111827;
    font-weight: 900;
    border: 2px solid #111827;
}

.map-popup {
    min-width: 210px;
}

.map-popup strong {
    display: block;
    font-size: 15px;
    margin-bottom: 4px;
}

.map-popup p {
    margin: 4px 0;
    color: #374151;
}

.map-popup a {
    display: inline-flex;
    margin-top: 6px;
    color: #111827;
    font-weight: 800;
}

@media (max-width: 860px) {
    .map-layout {
        grid-template-columns: 1fr;
    }

    .real-map {
        min-height: 380px;
    }

    .map-side-list {
        max-height: none;
    }
}


/* V9.3 header, carte et itinéraire */
.map-side-card {
    display: grid;
    gap: 8px;
    padding: 10px;
    border-radius: 18px;
    background: #fff;
    border: 1px solid rgba(17, 24, 39, .10);
    box-shadow: 0 8px 22px rgba(17, 24, 39, .06);
}

.map-side-card .map-side-item {
    padding: 0;
    border: 0;
    box-shadow: none;
    border-radius: 0;
    background: transparent;
}

.map-directions-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #111827;
    color: #fff;
    text-decoration: none;
    font-weight: 900;
}

.map-directions-btn::before {
    content: "➜";
    margin-right: 8px;
    color: #f5bf16;
}

.map-popup-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.map-popup-actions a {
    display: inline-flex;
    margin: 0;
    padding: 8px 10px;
    border-radius: 10px;
    background: #111827;
    color: #fff !important;
    text-decoration: none;
    font-weight: 800;
}

.map-popup-actions a:last-child {
    background: #f5bf16;
    color: #111827 !important;
}

@media (max-width: 640px) {
    .map-directions-btn {
        width: 100%;
        font-size: 15px;
    }

    .map-popup-actions {
        flex-direction: column;
    }
}


/* V9.5 corrections interface */
.site-header,
.header,
.topbar,
nav,
.main-header {
    position: sticky;
    top: 0;
    z-index: 100000;
}

.leaflet-container {
    z-index: 1 !important;
}

.leaflet-pane,
.leaflet-map-pane,
.leaflet-tile-pane,
.leaflet-overlay-pane,
.leaflet-shadow-pane,
.leaflet-marker-pane,
.leaflet-tooltip-pane,
.leaflet-popup-pane {
    z-index: 1 !important;
}

.leaflet-control-container,
.leaflet-top,
.leaflet-bottom {
    z-index: 10 !important;
}

.cookie-banner {
    z-index: 100001 !important;
}

#near-me-btn[aria-busy="true"] {
    opacity: .7;
    cursor: wait;
}


/* V9.6 près de moi */
#geo-start[aria-busy="true"],
#near-me-btn[aria-busy="true"] {
    opacity: .7;
    cursor: wait;
}

#near-me-btn[data-near-me-link="1"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}


/* V9.9 mobile portrait + Localise-moi */
.geo-modal{display:none;position:fixed;inset:0;z-index:200000}
.geo-modal.is-open{display:block}
.geo-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72)}
.geo-modal-card{position:relative;z-index:1;width:min(92vw,520px);margin:10vh auto 0;padding:22px;border-radius:22px;background:#fff;color:#111827;box-shadow:0 28px 90px rgba(0,0,0,.35)}
.geo-modal-card h2,.geo-modal-card h3{color:#111827;margin-top:0}
.geo-modal-card p,.geo-modal-card li{color:#374151}
.geo-modal-card ol{padding-left:20px}
.geo-modal-close{position:absolute;right:14px;top:12px;width:38px;height:38px;border:0;border-radius:999px;background:#111827;color:#fff;font-size:25px;line-height:1}
.modal-open{overflow:hidden}
[data-near-me][aria-busy="true"],#near-me-btn[aria-busy="true"],#geo-start[aria-busy="true"]{opacity:.7;cursor:wait}

@media (max-width:640px){
    body{overflow-x:hidden}
    .site-header,.header,.main-header{min-height:auto!important}
    header .container,.site-header .container,.header .container{min-height:76px!important;padding-top:10px!important;padding-bottom:10px!important;align-items:center!important}
    .brand,.logo,.site-logo{max-width:230px!important}
    .brand img,.logo img,.site-logo img,header img{max-height:56px!important;width:auto!important;object-fit:contain!important}
    .hero{min-height:auto!important;padding-top:34px!important;padding-bottom:38px!important}
    .hero .container{padding-top:0!important}
    .hero h1{font-size:clamp(34px,11vw,48px)!important;line-height:.98!important;margin-bottom:14px!important}
    .hero p{font-size:17px!important;line-height:1.45!important}
    .search-panel{margin-top:20px!important;padding:14px!important;border-radius:22px!important}
    .search-box{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
    .search-box input,.search-box button,.search-box .btn{width:100%!important;min-height:52px!important;justify-content:center!important;text-align:center!important}
    .quick-activities{margin-top:14px!important;display:flex!important;gap:8px!important;overflow-x:auto!important;padding-bottom:6px!important;-webkit-overflow-scrolling:touch}
    .quick-activities a{flex:0 0 auto!important;white-space:nowrap!important}
    .geo-modal-card{margin:7vh auto 0;max-height:86vh;overflow:auto}
}
@media (max-width:420px){
    header img{max-width:255px!important}
    .hero h1{font-size:38px!important}
}


/* V10.0 correctif dur mobile portrait homepage */
.mobile-home-fix-v100 {
    display: none;
}

@media (max-width: 760px) and (orientation: portrait) {
    html, body {
        min-height: 100%;
        overflow-x: hidden !important;
        background: #05070b !important;
    }

    body::before,
    body::after,
    .hero::before,
    .hero::after {
        pointer-events: none !important;
    }

    header,
    .site-header,
    .header,
    .main-header {
        position: sticky !important;
        top: 0 !important;
        z-index: 100000 !important;
        min-height: 72px !important;
        height: auto !important;
        background: #090b10 !important;
    }

    header .container,
    .site-header .container,
    .header .container,
    .main-header .container {
        min-height: 72px !important;
        height: 72px !important;
        padding: 8px 18px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
    }

    header img,
    .site-header img,
    .header img,
    .main-header img,
    .brand img,
    .logo img,
    .site-logo img {
        max-height: 46px !important;
        max-width: 260px !important;
        width: auto !important;
        object-fit: contain !important;
        display: block !important;
    }

    header nav,
    .desktop-nav {
        display: none !important;
    }

    .hero {
        display: block !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 18px 0 26px !important;
        margin: 0 !important;
        background:
            radial-gradient(circle at 15% 5%, rgba(245,191,22,.18), transparent 28%),
            linear-gradient(135deg, #07090f 0%, #111827 100%) !important;
        overflow: visible !important;
    }

    .hero .container {
        display: block !important;
        min-height: 0 !important;
        height: auto !important;
        padding: 0 16px !important;
        margin: 0 auto !important;
        transform: none !important;
    }

    .mobile-home-fix-v100 {
        display: flex !important;
        flex-direction: column !important;
        gap: 3px !important;
        margin: 0 0 12px !important;
        padding: 10px 12px !important;
        border-radius: 16px !important;
        background: rgba(245,191,22,.12) !important;
        border: 1px solid rgba(245,191,22,.28) !important;
        color: #fff !important;
    }

    .mobile-home-fix-v100 strong {
        font-size: 18px !important;
        line-height: 1.1 !important;
        color: #fff !important;
    }

    .mobile-home-fix-v100 span {
        font-size: 13px !important;
        line-height: 1.25 !important;
        color: #d1d5db !important;
    }

    .hero-kicker {
        display: inline-flex !important;
        margin: 0 0 12px !important;
        padding: 7px 10px !important;
        font-size: 11px !important;
        line-height: 1 !important;
        max-width: 100% !important;
        white-space: normal !important;
    }

    .hero h1 {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #fff !important;
        font-size: 34px !important;
        line-height: 1.02 !important;
        letter-spacing: -1.5px !important;
        margin: 0 0 12px !important;
        max-width: 100% !important;
        transform: none !important;
    }

    .hero p {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        color: #d1d5db !important;
        font-size: 15px !important;
        line-height: 1.38 !important;
        margin: 0 0 14px !important;
        max-width: 100% !important;
    }

    .search-panel {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin: 14px 0 0 !important;
        padding: 12px !important;
        border-radius: 18px !important;
        background: rgba(255,255,255,.08) !important;
        border: 1px solid rgba(255,255,255,.14) !important;
        transform: none !important;
        position: relative !important;
        z-index: 3 !important;
    }

    .search-box {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 9px !important;
    }

    .search-box input,
    .search-box button,
    .search-box .btn {
        min-height: 48px !important;
        width: 100% !important;
        border-radius: 14px !important;
        font-size: 15px !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .quick-activities {
        display: flex !important;
        overflow-x: auto !important;
        gap: 8px !important;
        margin-top: 12px !important;
        padding-bottom: 4px !important;
        -webkit-overflow-scrolling: touch;
    }

    .quick-activities a {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
        font-size: 13px !important;
        padding: 8px 10px !important;
        border-radius: 999px !important;
    }

    #geo-message {
        color: #f9fafb !important;
        font-size: 13px !important;
    }

    .section {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }
}

@media (max-width: 380px) and (orientation: portrait) {
    .hero h1 {
        font-size: 30px !important;
    }

    header img,
    .brand img,
    .logo img,
    .site-logo img {
        max-width: 225px !important;
        max-height: 42px !important;
    }

    header .container,
    .site-header .container,
    .header .container,
    .main-header .container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}


/* V10.2 viewport mobile fix */
@media (max-width: 1024px) {
    html {
        -webkit-text-size-adjust: 100% !important;
        text-size-adjust: 100% !important;
    }

    body {
        margin: 0 !important;
        overflow-x: hidden !important;
    }

    header,
    .site-header,
    .header,
    .main-header {
        min-height: 64px !important;
        height: 64px !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 100000 !important;
    }

    header .container,
    .site-header .container,
    .header .container,
    .main-header .container {
        height: 64px !important;
        min-height: 64px !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
    }

    header img,
    .brand img,
    .logo img,
    .site-logo img {
        max-height: 42px !important;
        max-width: 218px !important;
        object-fit: contain !important;
    }

    .sdf-home-v101 .home-wrap {
        padding-top: 16px !important;
        padding-bottom: 24px !important;
    }

    .sdf-home-v101 h1 {
        font-size: 32px !important;
        line-height: 1.02 !important;
        letter-spacing: -1.2px !important;
        margin-bottom: 10px !important;
    }

    .sdf-home-v101 .home-lead {
        font-size: 15px !important;
        line-height: 1.35 !important;
        margin-bottom: 12px !important;
    }

    .sdf-home-v101 .search-box-v101 {
        grid-template-columns: 1fr !important;
    }
}


/* V11.0 avis étoiles */
.stars-wrap{
    position:relative;
    display:inline-block;
    font-size:22px;
    line-height:1;
    letter-spacing:1px;
    vertical-align:middle;
}
.stars-base{
    color:#d1d5db;
}
.stars-fill{
    position:absolute;
    left:0;
    top:0;
    overflow:hidden;
    white-space:nowrap;
    color:#f5bf16;
}
.stars-empty{
    color:#d1d5db;
}
.rating-text{
    display:block;
    margin-top:6px;
    color:#6b7280;
    font-weight:800;
    font-size:14px;
}
.rating-block{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:4px;
}
@media(max-width:760px){
    .rating-block{align-items:flex-start}
    .stars-wrap{font-size:24px}
}

/* V11.8 aide localisation */
.geo-path-box{margin:12px 0;padding:12px;border-radius:14px;background:#f3f4f6;border:1px solid #e5e7eb}
.geo-path-box strong{display:block;color:#111827;margin-bottom:5px}
.geo-path-box span{display:block;color:#374151;font-weight:800}
.geo-help-actions{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 0}
.geo-help-actions .btn{min-height:40px;border-radius:10px;padding:0 12px;text-decoration:none}

/* V11.9 liens directs réglages localisation */
.geo-note{color:#6b7280;font-size:13px;line-height:1.35;margin:8px 0}
.geo-help-actions .primary{background:#f5bf16;color:#111827}


/* V12.1 - Fiche salle sécurisée + correction rendu noir */
body.sdf-gym-page{
    background:#f4f6fa !important;
    color:#111827 !important;
}
.gym-detail-v121,
.gym-detail-v121 *{box-sizing:border-box}
.gym-detail-v121{
    position:relative;
    z-index:2;
    background:#f4f6fa;
    color:#111827;
    min-height:60vh;
    padding:28px 18px 52px;
}
.gym-detail-v121-container{
    max-width:1180px;
    margin:0 auto;
}
.gym-detail-v121-card{
    background:#fff;
    color:#111827;
    border:1px solid #e5e7eb;
    border-radius:22px;
    box-shadow:0 10px 26px rgba(17,24,39,.06);
}
.gym-detail-v121 a{color:inherit}
.gym-detail-v121 img{max-width:100%;height:auto;display:block}
.gym-detail-v121 .photo-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.gym-detail-v121 .photo-grid img{
    width:100%;
    aspect-ratio:16/10;
    object-fit:cover;
    border-radius:14px;
    background:#111827;
}
@media(max-width:760px){
    .gym-detail-v121{padding:18px 12px 40px}
    .gym-detail-v121 .photo-grid{grid-template-columns:1fr 1fr}
}


/* V12.2 - Fiches salles toujours visibles */
body.sdf-gym-page{background:#f4f6fa!important;color:#111827!important}
.gym-detail-v122,.gym-detail-v122 *{box-sizing:border-box}
.gym-detail-v122{position:relative;z-index:2;background:#f4f6fa;color:#111827;min-height:60vh;padding:28px 18px 52px}
.gym-detail-v122-container{max-width:1180px;margin:0 auto}
.gym-detail-v122-card{background:#fff;color:#111827;border:1px solid #e5e7eb;border-radius:22px;box-shadow:0 10px 26px rgba(17,24,39,.06)}
.gym-detail-v122 a{color:inherit}
.gym-detail-v122 img{max-width:100%;height:auto;display:block}
.gym-detail-v122 .photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.gym-detail-v122 .photo-grid img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:14px;background:#111827}
@media(max-width:760px){.gym-detail-v122{padding:18px 12px 40px}.gym-detail-v122 .photo-grid{grid-template-columns:1fr 1fr}}

/* V12.6 epic responsive redesign */
:root{--bg:#05070b;--panel:rgba(15,22,34,.88);--line:rgba(255,255,255,.12);--yellow:#ffc400;--yellow2:#ffae00;--text:#f8fafc;--muted:#aab3c2}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:radial-gradient(circle at 70% 8%,rgba(255,196,0,.16),transparent 32%),linear-gradient(180deg,#03050a,#08111e 52%,#05070b);color:var(--text);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
a{color:inherit}.sdf-shell{width:min(92vw,1380px);margin:0 auto}
.sdf-top{position:sticky;top:0;z-index:1000;background:rgba(5,7,11,.86);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.sdf-top-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:3%}
.sdf-logo{display:flex;align-items:center;gap:10px;text-decoration:none}.sdf-mark{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--yellow);color:var(--yellow);box-shadow:0 0 24px rgba(255,196,0,.26);font-weight:900}
.sdf-logo-text{font-size:clamp(22px,2.4vw,30px);font-style:italic;font-weight:900;letter-spacing:-1px}.sdf-logo-text span{color:var(--yellow)}
.sdf-nav{display:flex;gap:clamp(14px,2.4vw,34px);font-size:14px;font-weight:900}.sdf-nav a{text-decoration:none}
.sdf-btn{min-height:48px;border-radius:12px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);text-decoration:none;font-weight:900;cursor:pointer}
.sdf-yellow{background:linear-gradient(135deg,var(--yellow),var(--yellow2));color:#111827;border-color:rgba(255,196,0,.7);box-shadow:0 0 24px rgba(255,196,0,.22)}
.sdf-hero{position:relative;overflow:hidden;padding:clamp(38px,7vw,96px) 0 clamp(28px,5vw,58px)}
.sdf-hero:before{content:"";position:absolute;inset:0 -4vw;background:linear-gradient(90deg,rgba(5,7,11,.97),rgba(5,7,11,.78) 48%,rgba(5,7,11,.24)),url('/assets/img/hero-athlete-v126.svg') right center/auto 100% no-repeat}
.sdf-hero:after{content:"";position:absolute;right:-8%;top:10%;width:48%;height:60%;background:linear-gradient(135deg,transparent,rgba(255,196,0,.35),transparent 60%);transform:skewX(-18deg)}
.sdf-hero-content{position:relative;z-index:2;width:min(760px,72%)}.sdf-kicker{display:inline-flex;background:var(--yellow);color:#111827;border-radius:999px;padding:8px 12px;font-weight:900;text-transform:uppercase;margin-bottom:16px}
.sdf-title{margin:0;font-size:clamp(42px,7vw,86px);line-height:.94;letter-spacing:-3px;text-transform:uppercase;font-style:italic;font-weight:900}.sdf-title span{color:var(--yellow)}
.sdf-lead{max-width:620px;color:#d1d5db;font-size:clamp(16px,1.5vw,20px);line-height:1.5;margin:18px 0 0}
.sdf-search{position:relative;z-index:3;margin-top:clamp(22px,4vw,34px);width:min(100%,1080px);background:rgba(12,17,26,.88);border:1px solid rgba(255,196,0,.25);box-shadow:0 24px 70px rgba(0,0,0,.38);border-radius:18px;padding:10px;display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,24%) minmax(170px,20%);gap:10px}
.sdf-input{display:flex;align-items:center;gap:10px;background:#fff;color:#111827;border-radius:14px;padding:0 14px;min-height:58px}.sdf-input input{width:100%;border:0;outline:0;font:inherit;background:transparent}
.sdf-section{margin:clamp(26px,4vw,42px) 0 0}.sdf-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.sdf-head h2{margin:0;font-size:clamp(22px,2.4vw,32px)}.sdf-link{color:var(--yellow);text-decoration:none;font-weight:900;white-space:nowrap}
.sdf-activities{display:grid;grid-template-columns:repeat(9,minmax(88px,1fr));gap:10px}.sdf-chip{min-height:70px;border-radius:14px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));display:grid;place-items:center;text-align:center;padding:10px;text-decoration:none;font-weight:800}.sdf-chip b{color:var(--yellow);font-size:24px}
.sdf-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.sdf-card{position:relative;border:1px solid var(--line);background:var(--panel);border-radius:16px;overflow:hidden;box-shadow:0 14px 36px rgba(0,0,0,.26)}.sdf-card img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}.sdf-card-body{padding:14px}.sdf-card h3{margin:0 0 5px;font-size:18px}.sdf-meta{color:var(--muted);font-size:14px}.sdf-stars{color:var(--yellow);font-weight:900;margin:8px 0}.sdf-badge{position:absolute;top:10px;left:10px;background:var(--yellow);color:#111827;border-radius:999px;padding:6px 9px;font-weight:900;font-size:12px}
.sdf-map-grid{display:grid;grid-template-columns:minmax(220px,28%) minmax(0,1fr) minmax(220px,26%);gap:14px}.sdf-panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:18px}.sdf-map{min-height:230px;border-radius:18px;background:radial-gradient(circle at 50% 52%,rgba(255,196,0,.28),transparent 18%),#09111d;position:relative;overflow:hidden}.sdf-map:before{content:"";position:absolute;inset:0;background-image:linear-gradient(35deg,transparent 0 48%,rgba(255,255,255,.08) 49% 50%,transparent 51%),linear-gradient(-35deg,transparent 0 48%,rgba(255,255,255,.06) 49% 50%,transparent 51%);background-size:90px 90px}.sdf-pin{position:absolute;width:22px;height:22px;border-radius:50% 50% 50% 0;background:var(--yellow);transform:rotate(-45deg);box-shadow:0 0 20px rgba(255,196,0,.55)}.sdf-pin:after{content:"";position:absolute;inset:6px;border-radius:50%;background:#111827}
.sdf-cities{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.sdf-city{min-height:120px;border-radius:16px;overflow:hidden;position:relative;background:linear-gradient(135deg,#1f2937,#030712);border:1px solid var(--line);text-decoration:none}.sdf-city:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,196,0,.08),rgba(0,0,0,.72))}.sdf-city span{position:absolute;left:12px;bottom:12px;font-weight:900;font-size:18px}
.sdf-pro{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;border-color:rgba(255,196,0,.28)}
.sdf-footer{margin-top:44px;border-top:1px solid var(--line);padding:34px 0;color:#d1d5db}.sdf-footer-grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:28px}.sdf-footer h4{margin:0 0 12px;color:#fff}.sdf-footer a{display:block;color:#cbd5e1;text-decoration:none;margin:8px 0}
.geo-modal{display:none;position:fixed;inset:0;z-index:3000;background:rgba(0,0,0,.72);align-items:center;justify-content:center;padding:18px}.geo-modal.is-open{display:flex}.geo-modal-card{width:min(92vw,720px);max-height:86vh;overflow:auto;background:#fff;color:#111827;border-radius:28px;padding:28px}.geo-close{float:right;width:52px;height:52px;border:0;border-radius:50%;background:#111827;color:#fff;font-size:32px;cursor:pointer}
@media(max-width:1100px){.sdf-activities{grid-template-columns:repeat(5,minmax(0,1fr))}.sdf-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.sdf-map-grid{grid-template-columns:1fr}.sdf-cities{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.sdf-shell{width:min(94vw,560px)}.sdf-nav{display:none}.sdf-top-inner{min-height:68px}.sdf-mark{width:38px;height:38px}.sdf-logo-text{font-size:22px}.sdf-hero{padding:28px 0 26px}.sdf-hero:before{background:linear-gradient(180deg,rgba(5,7,11,.88),rgba(5,7,11,.84)),url('/assets/img/hero-athlete-v126.svg') right top/auto 72% no-repeat}.sdf-hero-content{width:100%}.sdf-title{font-size:clamp(36px,12vw,54px);letter-spacing:-1.8px}.sdf-search{grid-template-columns:1fr}.sdf-activities{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.sdf-chip{min-height:66px;font-size:12px}.sdf-cards{grid-template-columns:1fr}.sdf-cities{grid-template-columns:repeat(2,minmax(0,1fr))}.sdf-pro{grid-template-columns:1fr}.sdf-footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:420px){.sdf-activities{grid-template-columns:repeat(2,minmax(0,1fr))}.sdf-cities{grid-template-columns:1fr}.sdf-footer-grid{grid-template-columns:1fr}}


/* V12.8 homepage visuals */
.sdf-kicker-dark{background:rgba(255,196,0,.14)!important;color:var(--yellow)!important;border:1px solid rgba(255,196,0,.28)}
.sdf-hero:before{background:linear-gradient(90deg,rgba(5,7,11,.98),rgba(5,7,11,.78) 46%,rgba(5,7,11,.32)),url('/assets/img/home/hero-main.png') right center/cover no-repeat}
.sdf-visual-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:-16px}
.sdf-visual-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 18px 38px rgba(0,0,0,.22)}
.sdf-visual-card img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.sdf-visual-copy{padding:16px}
.sdf-visual-copy h3{margin:10px 0 8px;font-size:22px}
.sdf-visual-copy p{margin:0;color:var(--muted);line-height:1.55}
.sdf-map-visual{padding:0;display:flex;align-items:stretch;justify-content:stretch}
.sdf-map-visual img{width:100%;height:100%;min-height:230px;display:block;object-fit:cover;filter:saturate(1.05) contrast(1.02) brightness(.86)}
.sdf-map-visual:before{background:linear-gradient(180deg,rgba(4,7,11,.08),rgba(4,7,11,.18))}
.sdf-pro-visual{position:relative;overflow:hidden;background:linear-gradient(135deg,rgba(255,196,0,.08),rgba(8,13,21,.96));display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px}
.sdf-pro-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,10,16,.95),rgba(7,10,16,.72) 45%,rgba(7,10,16,.22)),url('/assets/img/home/pro-workstation.png') right center/cover no-repeat;opacity:.9}
.sdf-pro-visual > *{position:relative;z-index:1}
@media(max-width:1100px){.sdf-visual-row{grid-template-columns:1fr 1fr}.sdf-visual-row .sdf-visual-card:last-child{grid-column:1/-1}}
@media(max-width:760px){.sdf-hero:before{background:linear-gradient(180deg,rgba(5,7,11,.92),rgba(5,7,11,.84) 45%,rgba(5,7,11,.92)),url('/assets/img/home/hero-main.png') center top/cover no-repeat}.sdf-visual-row{grid-template-columns:1fr;gap:12px;margin-top:0}.sdf-visual-copy h3{font-size:20px}.sdf-map-visual img{min-height:220px}.sdf-pro-visual{grid-template-columns:1fr}.sdf-pro-visual:before{background:linear-gradient(180deg,rgba(7,10,16,.92),rgba(7,10,16,.85)),url('/assets/img/home/pro-workstation.png') center/cover no-repeat}}

/* V12.9 homepage cards image correction */
.sdf-card img[src$="default-gym-photo.svg"]{
    background:linear-gradient(135deg,rgba(255,196,0,.18),rgba(10,16,26,.95)), url('/assets/img/home/urban-gym.png') center/cover no-repeat;
    opacity:1;
}
.sdf-card img{
    background:#0b111d;
}
.sdf-card:nth-child(1) img[src$="default-gym-photo.svg"]{content:url('/assets/img/home/urban-gym.png')}
.sdf-card:nth-child(2) img[src$="default-gym-photo.svg"]{content:url('/assets/img/home/collective-energy.png')}
.sdf-card:nth-child(3) img[src$="default-gym-photo.svg"]{content:url('/assets/img/home/hero-main.png')}
.sdf-card:nth-child(4) img[src$="default-gym-photo.svg"]{content:url('/assets/img/home/locator-app.png')}