/*
 * FitBlizu content pages (layouts/content, pages/show, errors/404, owner layout chrome, badge section).
 * Loaded AFTER app.css and uses its --fb-* tokens; theme switching mirrors app.css exactly:
 * light by default, dark via `prefers-color-scheme: dark` when <html> has no data-theme ("auto"), or `html[data-theme=dark]`.
 *
 * Direction: a calm product site that reads like the map's paper. The one bold element is the hero "map fragment"
 * (a few streets + a pin drawn in hairlines behind the H1); everything else stays quiet: navy text, blue actions,
 * green only as accent lines / dots (green text fails AA on light surfaces), neutral surfaces, system type.
 * Type scale: 15 / 17 / 20 / 26 / 32, body 17px / 1.55. Gutters 16px, text column 720px, wide (stats / tables) 960px.
 */
:root {
    --c-link: var(--fb-blue-600);                 /* #005EEB: 5.5:1 on white (#0072F2 is 4.49:1, just under AA) */
    --c-link-hover: #0246C9;
    --c-grid: rgba(8, 36, 74, .09);               /* hero map-fragment strokes */
    --c-grid-strong: rgba(8, 36, 74, .16);
    --c-head-bg: rgba(248, 250, 252, .92);
    --c-card-shadow: 0 1px 2px rgba(8, 36, 74, .04), 0 6px 20px rgba(8, 36, 74, .06);
    --c-card-shadow-hover: 0 2px 4px rgba(8, 36, 74, .06), 0 14px 32px rgba(8, 36, 74, .10);
    --c-danger-soft: #FDECEC;
    --c-danger-text: #B42318;                     /* 6.2:1 on #FDECEC */
    --c-warning-soft: #FEF3C7;
    --c-warning-text: #92400E;
    --c-cta: linear-gradient(135deg, #0493AA -25%, #005EEB 45%, #0246C9 100%); /* label sits on the blue part: ≥ 5:1 */
    --c-cover: linear-gradient(135deg, #E3F8F1 0%, #E6F0FE 55%, #DCEBFF 100%);
    --c-ease: var(--fb-ease, cubic-bezier(.2, 0, 0, 1));
    --c-w: 720px;
    --c-w-wide: 960px;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --c-link: #3BA3FF;
        --c-link-hover: #7CC2FF;
        --c-grid: rgba(148, 163, 184, .10);
        --c-grid-strong: rgba(148, 163, 184, .20);
        --c-head-bg: rgba(7, 17, 31, .9);
        --c-card-shadow: 0 1px 2px rgba(0, 0, 0, .3);
        --c-card-shadow-hover: 0 2px 4px rgba(0, 0, 0, .35), 0 14px 32px rgba(0, 0, 0, .35);
        --c-danger-soft: rgba(229, 72, 77, .14);
        --c-danger-text: #FF9DA0;
        --c-warning-soft: rgba(245, 166, 35, .14);
        --c-warning-text: #FFC862;
        --c-cover: linear-gradient(135deg, #0C3128 0%, #0F2B4D 60%, #12243B 100%);
    }
}
:root[data-theme="dark"] {
    --c-link: #3BA3FF;
    --c-link-hover: #7CC2FF;
    --c-grid: rgba(148, 163, 184, .10);
    --c-grid-strong: rgba(148, 163, 184, .20);
    --c-head-bg: rgba(7, 17, 31, .9);
    --c-card-shadow: 0 1px 2px rgba(0, 0, 0, .3);
    --c-card-shadow-hover: 0 2px 4px rgba(0, 0, 0, .35), 0 14px 32px rgba(0, 0, 0, .35);
    --c-danger-soft: rgba(229, 72, 77, .14);
    --c-danger-text: #FF9DA0;
    --c-warning-soft: rgba(245, 166, 35, .14);
    --c-warning-text: #FFC862;
    --c-cover: linear-gradient(135deg, #0C3128 0%, #0F2B4D 60%, #12243B 100%);
}

/* Light theme contrast boost (content + owner pages). Scoped on <html> so the :root dark blocks above (higher specificity:
   (0,2,0) vs (0,1,2)) still win in dark mode. Tinted page background + darker hairlines/secondary text so white cards,
   forms and tables separate clearly on low-contrast screens. */
html:has(> body.cpage), html:has(> body.owner) {
    --fb-bg: #E8EEF6;
    --fb-surface-secondary: #EDF2F9;
    --fb-surface-2: #EDF2F9;
    --fb-border: #C5D0DF;
    --fb-text-secondary: #334155;
    --fb-text-muted: #4B5B73;
    --c-head-bg: rgba(255, 255, 255, .94);
    --c-card-shadow: 0 1px 2px rgba(8, 36, 74, .08), 0 8px 24px rgba(8, 36, 74, .09);
    --c-card-shadow-hover: 0 2px 4px rgba(8, 36, 74, .10), 0 16px 36px rgba(8, 36, 74, .14);
    --c-cover: linear-gradient(135deg, #CFF3E6 0%, #D6E7FD 55%, #C9DFFF 100%);
}

/* ------------------------------------------------------------------ base
   The page body must NOT carry the map shell's `.app` class: `body.app` paints the map-land colour (#f2efe9), which is
   what made text invisible in system dark mode (dark tokens on a light background). */
html.c-html, html:has(> body.cpage) { background: var(--fb-bg); overflow-y: auto; overscroll-behavior-y: auto; scroll-padding-top: 72px; }
body.cpage {
    margin: 0; min-height: 100vh; display: flex; flex-direction: column;
    background: var(--fb-bg); color: var(--fb-text);
    font-family: var(--fb-font); font-size: 17px; line-height: 1.55;
    -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
    overscroll-behavior: auto;
}
.cpage main { flex: 1 0 auto; }
.cpage a { color: var(--c-link); text-underline-offset: .18em; text-decoration-thickness: 1px; }
.cpage a:hover { color: var(--c-link-hover); }
.cpage :focus-visible { outline: 2px solid var(--c-link); outline-offset: 2px; box-shadow: none; border-radius: 6px; }
.cpage h1, .cpage h2, .cpage h3 { color: var(--fb-text); text-wrap: balance; }
.cpage p, .cpage li { text-wrap: pretty; }
.cpage img { max-width: 100%; }
.c-skip { position: absolute; left: 12px; top: -140px; z-index: 50; padding: 10px 16px; border-radius: 10px; background: var(--fb-surface); color: var(--fb-text); font-weight: 600; box-shadow: var(--fb-shadow); }
.c-skip:focus { top: calc(var(--fb-safe-top) + 8px); }
.c-wrap { width: 100%; max-width: calc(var(--c-w) + 32px); margin: 0 auto; padding: 0 16px; padding-left: max(16px, var(--fb-safe-left)); padding-right: max(16px, var(--fb-safe-right)); }
.c-wrap--wide { max-width: calc(var(--c-w-wide) + 32px); }
.num, .c-num { font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------ header (sticky, slim) */
.c-top { position: sticky; top: 0; z-index: 30; padding-top: var(--fb-safe-top); background: var(--c-head-bg); border-bottom: 1px solid var(--fb-border); -webkit-backdrop-filter: saturate(1.6) blur(14px); backdrop-filter: saturate(1.6) blur(14px); }
.c-top__in { display: flex; align-items: center; gap: 6px; height: 56px; }
.c-logo { display: inline-flex; align-items: center; min-height: 44px; margin-right: auto; border-radius: 8px; }
.c-logo img { display: block; height: 26px; width: auto; }
:root[data-theme="dark"] .c-logo img { content: url("../brand/logo-horizontal-dark.png"); }
:root[data-theme="light"] .c-logo img { content: url("../brand/logo-horizontal.png"); }
.c-tbtn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; min-height: 44px; padding: 0 10px;
    border: 0; border-radius: 12px; background: transparent; color: var(--fb-text); font: inherit; font-size: 15px; font-weight: 600;
    text-decoration: none; cursor: pointer; list-style: none; -webkit-tap-highlight-color: transparent;
    transition: background-color var(--fb-dur-fast) var(--c-ease), transform var(--fb-dur-fast) var(--c-ease);
}
.c-tbtn::-webkit-details-marker { display: none; }
.cpage a.c-tbtn { color: var(--fb-text); }
.c-tbtn:hover { background: var(--fb-surface-secondary); }
.c-tbtn:active { transform: scale(.96); }
.c-tbtn .ic { width: 20px; height: 20px; }
.cpage a.c-tbtn--map { color: var(--c-link); background: var(--fb-primary-soft); padding: 0 14px 0 12px; }
.c-tbtn--map:hover { background: var(--fb-primary-soft); filter: brightness(.97); }
.c-tbtn__code { font-size: 14px; letter-spacing: .02em; }
.c-pop { position: relative; }
.c-pop[open] > .c-tbtn { background: var(--fb-surface-secondary); }
.c-pop__menu {
    position: absolute; right: 0; top: calc(100% + 8px); z-index: 40; min-width: 200px; margin: 0; padding: 6px; list-style: none;
    background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 14px; box-shadow: var(--fb-shadow);
    transform-origin: top right; animation: c-pop .16s var(--c-ease);
}
@keyframes c-pop { from { opacity: 0; transform: translateY(-4px) scale(.98); } }
.c-pop__menu a { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px; border-radius: 10px; color: var(--fb-text); text-decoration: none; font-size: 15px; }
.cpage .c-pop__menu a { color: var(--fb-text); }
.c-pop__menu a:hover { background: var(--fb-surface-secondary); }
.c-pop__menu a[aria-current] { background: var(--fb-primary-soft); color: var(--c-link); font-weight: 600; }
.c-pop__menu .c-code { width: 28px; font-size: 13px; font-weight: 700; color: var(--fb-text-muted); }
.c-pop__menu hr { border: 0; border-top: 1px solid var(--fb-border); margin: 6px 4px; }
/* hamburger: full-width sheet under the header on phones, dropdown from 640px */
.c-menu .c-pop__menu { position: fixed; left: 8px; right: 8px; top: calc(var(--fb-safe-top) + 60px); min-width: 0; max-height: calc(100dvh - var(--fb-safe-top) - 76px); overflow-y: auto; }
@media (min-width: 640px) { .c-menu .c-pop__menu { position: absolute; left: auto; right: 0; top: calc(100% + 8px); width: 280px; } }
@media (max-width: 379px) { .c-tbtn--map span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .cpage a.c-tbtn--map { padding: 0 10px; } .c-logo img { height: 22px; } }

/* ------------------------------------------------------------------ hero: crumbs, H1, lead + the map fragment */
.c-hero { position: relative; isolation: isolate; overflow: hidden; padding: 20px 0 8px; }
.c-hero__map { position: absolute; z-index: -1; top: -20px; right: -90px; width: 380px; max-width: 110%; height: auto; color: var(--c-grid); pointer-events: none;
    -webkit-mask-image: radial-gradient(ellipse 75% 70% at 70% 30%, #000 30%, transparent 78%); mask-image: radial-gradient(ellipse 75% 70% at 70% 30%, #000 30%, transparent 78%); }
.c-hero__map .c-road--main { color: var(--c-grid-strong); }
.c-hero__map .c-pin { color: var(--fb-blue-500); }
@media (max-width: 767px) { .c-hero h1 { max-width: calc(100% - 44px); } }
@media (min-width: 768px) { .c-hero { padding: 36px 0 12px; } .c-hero__map { width: 560px; right: -20px; top: -30px; } }
.c-crumbs { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; margin: 0 0 14px; padding: 0; font-size: 13px; line-height: 1.4; color: var(--fb-text-muted); }
.c-crumbs li { display: inline-flex; align-items: center; gap: 6px; }
.c-crumbs li + li::before { content: ""; width: 5px; height: 5px; border-right: 1.5px solid currentColor; border-top: 1.5px solid currentColor; transform: rotate(45deg); opacity: .6; }
.cpage .c-crumbs a { color: var(--fb-text-secondary); text-decoration: none; }
.cpage .c-crumbs a:hover { color: var(--c-link); text-decoration: underline; }
.c-crumbs [aria-current] { color: var(--fb-text-muted); }
.c-hero h1 { margin: 0 0 12px; font-size: 32px; line-height: 1.15; font-weight: 750; letter-spacing: -.025em; max-width: 20ch; }
.c-lead { margin: 0 0 8px; font-size: 20px; line-height: 1.5; color: var(--fb-text-secondary); max-width: 34em; }
@media (max-width: 359px) { .c-hero h1 { font-size: 28px; } .c-lead { font-size: 18px; } }

/* ------------------------------------------------------------------ body typography */
.c-body { padding-top: 8px; padding-bottom: 8px; }
.c-body > h2, .c-sec > h2 { margin: 44px 0 14px; font-size: 26px; line-height: 1.2; font-weight: 700; letter-spacing: -.02em; }
.c-body > h3, .c-sec h3 { margin: 28px 0 8px; font-size: 20px; line-height: 1.3; font-weight: 650; letter-spacing: -.01em; }
.c-body > p, .c-body > ul:not([class]), .c-body > ol:not([class]) { max-width: 68ch; }
.c-body > p { margin: 0 0 16px; }
.c-muted, .c-body small { color: var(--fb-text-muted); font-size: 15px; }
.c-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin: 0 0 16px; font-size: 15px; color: var(--fb-text-muted); }
.c-meta b { font-weight: 650; color: var(--fb-text); }
.c-note { margin-top: 28px; }
.c-updated { margin: 28px 0 0; font-size: 15px; color: var(--fb-text-muted); }

/* ------------------------------------------------------------------ stat cards */
.c-stats { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 20px 0 8px; padding: 0; list-style: none; }
@media (min-width: 640px) { .c-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } .c-stats--cities { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); } }
@media (min-width: 960px) { .c-stats--cities { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.c-stat {
    position: relative; display: flex; flex-direction: column; gap: 4px; min-height: 108px; padding: 18px 16px 14px;
    background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 16px; box-shadow: var(--c-card-shadow);
    color: var(--fb-text); text-decoration: none;
}
.c-stat::before { content: ""; width: 24px; height: 3px; margin-bottom: 8px; border-radius: 3px; background: var(--fb-gradient); }
.c-stat b { font-size: 32px; line-height: 1.05; font-weight: 750; letter-spacing: -.03em; font-variant-numeric: tabular-nums; color: var(--fb-text); }
.c-stat span { font-size: 15px; line-height: 1.35; color: var(--fb-text-secondary); }
.c-stat--hero { grid-column: 1 / -1; }
.c-stat--hero b { font-size: 44px; }
@media (min-width: 640px) { .c-stat--hero { grid-column: span 2; } }
a.c-stat { transition: transform var(--fb-dur) var(--c-ease), box-shadow var(--fb-dur) var(--c-ease), border-color var(--fb-dur) var(--c-ease); }
.cpage a.c-stat { color: var(--fb-text); }
a.c-stat:hover { border-color: color-mix(in srgb, var(--fb-blue-500) 40%, var(--fb-border)); box-shadow: var(--c-card-shadow-hover); transform: translateY(-1px); }
a.c-stat:active { transform: scale(.98); }
a.c-stat span { display: flex; align-items: center; justify-content: space-between; gap: 6px; color: var(--fb-text); font-weight: 600; }
a.c-stat span .ic { width: 16px; height: 16px; color: var(--fb-text-muted); transform: rotate(-90deg); }
.c-stats--cities .c-stat { min-height: 92px; }
.c-stats--cities .c-stat b { font-size: 26px; }

/* ------------------------------------------------------------------ tables (inside a card; stacked rows on phones) */
.c-tablecard { margin: 12px 0 8px; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 16px; box-shadow: var(--c-card-shadow); overflow: hidden; }
.c-table { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.4; }
.c-table th, .c-table td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--fb-border); vertical-align: middle; }
.c-table thead th { font-size: 13px; font-weight: 650; color: var(--fb-text-secondary); background: var(--fb-surface-secondary); white-space: nowrap; }
.c-table tbody tr:last-child > * { border-bottom: 0; }
.c-table tbody tr:hover { background: color-mix(in srgb, var(--fb-surface-secondary) 60%, transparent); }
.c-table .num { text-align: right; font-variant-numeric: tabular-nums; }
.c-table td.num { font-weight: 600; color: var(--fb-text); }
.c-table td a { font-weight: 600; text-decoration: none; }
.c-table td a:hover { text-decoration: underline; }
.c-table .c-rank { width: 1%; padding-right: 0; color: var(--fb-text-muted); font-variant-numeric: tabular-nums; font-size: 13px; }
/* venue weekly hours (venues/show.php): today's row highlighted like the gym hours table */
.c-hours td.num { font-weight: 500; overflow-wrap: anywhere; }
.c-hours th { white-space: nowrap; }
.c-hours tr.is-today th, .c-hours tr.is-today td.num { font-weight: 700; color: var(--fb-blue-600); }
.c-hours__mark { font-weight: 500; }
.c-hours__note { margin: 6px 2px 0; font-size: 14px; }
.c-vstate { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin: 8px 0 4px; }
.c-vstate__today { color: var(--fb-text-secondary); font-variant-numeric: tabular-nums; }
:root[data-theme="dark"] .c-hours tr.is-today th, :root[data-theme="dark"] .c-hours tr.is-today td.num { color: #8CC4FF; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .c-hours tr.is-today th, :root:not([data-theme="light"]) .c-hours tr.is-today td.num { color: #8CC4FF; } }
.c-bar { display: block; height: 4px; margin-top: 6px; border-radius: 4px; background: var(--fb-surface-secondary); overflow: hidden; }
.c-bar i { display: block; height: 100%; border-radius: 4px; background: var(--fb-gradient-blue); }
@media (max-width: 639px) {
    .c-table--stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .c-table--stack, .c-table--stack tbody, .c-table--stack tr, .c-table--stack td { display: block; width: 100%; }
    .c-table--stack tbody tr { padding: 6px 0; border-bottom: 1px solid var(--fb-border); }
    .c-table--stack tbody tr:last-child { border-bottom: 0; }
    .c-table--stack td { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 6px 16px; border: 0; }
    .c-table--stack td::before { content: attr(data-label); font-size: 15px; font-weight: 500; color: var(--fb-text-secondary); }
    .c-table--stack td:first-child { padding-top: 10px; padding-bottom: 4px; font-size: 17px; }
    .c-table--stack td:first-child::before { content: none; }
    .c-table--stack td.num { text-align: right; }
    .c-table th, .c-table td { padding: 11px 12px; }
}

/* ------------------------------------------------------------------ gym lists (region) */
.c-city { margin: 28px 0 0; }
.c-city__head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 8px; }
.c-city__head h3 { margin: 0; font-size: 20px; }
.c-city__head h3 a { color: var(--fb-text); text-decoration: none; }
.c-city__head h3 a:hover { color: var(--c-link); text-decoration: underline; }
.c-count { flex: 0 0 auto; min-width: 28px; padding: 2px 9px; border-radius: 999px; background: var(--fb-surface-secondary); color: var(--fb-text-secondary); font-size: 13px; font-weight: 650; text-align: center; font-variant-numeric: tabular-nums; }
.c-gyms { display: grid; grid-template-columns: 1fr; margin: 0; padding: 0; list-style: none; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 16px; overflow: hidden; }
@media (min-width: 768px) { .c-gyms { grid-template-columns: 1fr 1fr; } .c-gyms li:nth-child(odd) { border-right: 1px solid var(--fb-border); } }
.c-gyms li { display: flex; flex-direction: column; justify-content: center; gap: 1px; min-height: 56px; padding: 9px 14px; border-bottom: 1px solid var(--fb-border); }
.c-gyms a { font-weight: 600; text-decoration: none; }
.c-gyms a:hover { text-decoration: underline; }
.c-gyms small { font-size: 13px; line-height: 1.35; color: var(--fb-text-muted); }
.c-gyms small.c-price { color: var(--fb-text); font-weight: 600; }
.c-gyms li:last-child { border-bottom: 0; }
@media (min-width: 768px) { .c-gyms li:nth-last-child(2):nth-child(odd) { border-bottom: 0; } }
.c-247 { display: inline-flex; align-items: center; gap: 5px; margin-left: 6px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.6; color: var(--fb-text); background: var(--fb-accent-soft); vertical-align: 1px; }
.c-247::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--fb-green); }
.c-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; padding: 0; list-style: none; }
.c-chips a { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--fb-border); background: var(--fb-surface); color: var(--fb-text); font-size: 15px; font-weight: 600; text-decoration: none; transition: border-color var(--fb-dur-fast), background-color var(--fb-dur-fast); }
.cpage .c-chips a { color: var(--fb-text); }
.c-chips a:hover { border-color: var(--c-link); background: var(--fb-primary-soft); }
.c-chips small { font-size: 13px; font-weight: 600; color: var(--fb-text-muted); font-variant-numeric: tabular-nums; }

/* ------------------------------------------------------------------ lists: checks + numbered steps */
.c-checks { margin: 0 0 8px; padding: 0; list-style: none; display: grid; gap: 10px; }
.c-checks li { position: relative; padding: 14px 16px 14px 48px; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 14px; }
.c-checks li::before { content: ""; position: absolute; left: 16px; top: 17px; width: 20px; height: 20px; border-radius: 50%; background: var(--fb-accent-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2306B987' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12.5 4 4 8-9'/%3E%3C/svg%3E") center / 13px no-repeat; }
.c-steps { counter-reset: s; margin: 0; padding: 0; list-style: none; }
.c-steps li { position: relative; padding: 0 0 22px 52px; }
.c-steps li::before { counter-increment: s; content: counter(s); position: absolute; left: 0; top: -3px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-size: 15px; font-weight: 700; color: var(--c-link); background: var(--fb-primary-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--fb-blue-500) 30%, transparent); }
.c-steps li:not(:last-child)::after { content: ""; position: absolute; left: 16.5px; top: 36px; bottom: 2px; width: 1px; background: var(--fb-border); }

/* ------------------------------------------------------------------ buttons + CTA blocks */
.c-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 20px;
    border: 1px solid transparent; border-radius: 14px; font: inherit; font-size: 16px; font-weight: 650; line-height: 1.2; text-decoration: none; cursor: pointer;
    transition: transform var(--fb-dur-fast) var(--c-ease), box-shadow var(--fb-dur) var(--c-ease), filter var(--fb-dur) var(--c-ease);
    -webkit-tap-highlight-color: transparent;
}
.c-btn .ic { width: 20px; height: 20px; }
.c-btn:active { transform: scale(.97); }
/* row of action buttons (venue page: "Pokaži na zemljevidu" + "Pelji me tja"); wraps, full width on narrow phones */
.c-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.c-actions .c-btn { flex: 1 1 auto; min-width: 0; text-align: center; padding: 0 16px; }
@media (max-width: 379px) { .c-actions .c-btn { flex-basis: 100%; } }
.cpage .c-btn--primary, .c-btn--primary { color: #fff; background: var(--c-cta); box-shadow: 0 1px 2px rgba(0, 57, 160, .25), 0 8px 20px rgba(0, 94, 235, .26); }
.cpage .c-btn--primary:hover { color: #fff; filter: brightness(1.06); box-shadow: 0 1px 2px rgba(0, 57, 160, .25), 0 12px 26px rgba(0, 94, 235, .32); }
.cpage .c-btn--ghost, .c-btn--ghost { color: var(--fb-text); background: var(--fb-surface); border-color: var(--fb-border); }
.cpage .c-btn--ghost:hover { color: var(--c-link); border-color: var(--c-link); }
.c-cta {
    position: relative; overflow: hidden; display: grid; gap: 14px; margin: 44px 0 8px; padding: 22px 20px;
    background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 20px; box-shadow: var(--c-card-shadow);
}
.c-cta::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--fb-gradient); }
.c-cta h2 { margin: 0; font-size: 20px; line-height: 1.3; letter-spacing: -.01em; }
.c-cta p { margin: 0; font-size: 15px; color: var(--fb-text-secondary); }
.c-cta .c-btn { justify-self: start; }
@media (min-width: 640px) { .c-cta { grid-template-columns: 1fr auto; align-items: center; padding: 24px 24px 24px 28px; } .c-cta .c-btn { justify-self: end; } }
@media (max-width: 479px) { .c-cta .c-btn { justify-self: stretch; } }

/* ------------------------------------------------------------------ FAQ accordions */
.c-acc { margin: 20px 0 8px; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 18px; box-shadow: var(--c-card-shadow); overflow: hidden; }
.c-acc details { border-bottom: 1px solid var(--fb-border); }
.c-acc details:last-child { border-bottom: 0; }
.c-acc summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 14px 18px; cursor: pointer; list-style: none; font-size: 17px; font-weight: 650; line-height: 1.35; -webkit-tap-highlight-color: transparent; }
.c-acc summary::-webkit-details-marker { display: none; }
.c-acc summary:hover { background: color-mix(in srgb, var(--fb-surface-secondary) 60%, transparent); }
.c-acc summary:focus-visible { outline-offset: -3px; }
.c-acc summary::after { content: ""; flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; background: var(--fb-surface-secondary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 16px no-repeat; transition: transform var(--fb-dur) var(--c-ease), background-color var(--fb-dur); }
.c-acc details[open] > summary::after { transform: rotate(180deg); background-color: var(--fb-primary-soft); }
.c-acc__a { padding: 0 18px 18px; color: var(--fb-text-secondary); }
.c-acc__a p { margin: 0; max-width: 64ch; }
.c-acc details.is-anim { overflow: hidden; }

/* ------------------------------------------------------------------ news list */
.c-posts { display: grid; gap: 12px; margin: 20px 0 8px; padding: 0; list-style: none; }
.c-post { position: relative; padding: 18px 18px 16px; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 16px; box-shadow: var(--c-card-shadow); transition: box-shadow var(--fb-dur) var(--c-ease), transform var(--fb-dur) var(--c-ease); }
.c-post:hover { box-shadow: var(--c-card-shadow-hover); }
.c-post:active { transform: scale(.99); }
.c-post h2 { margin: 0 0 6px; font-size: 20px; line-height: 1.3; letter-spacing: -.01em; }
.c-post h2 a { color: var(--fb-text); text-decoration: none; }
.c-post h2 a::after { content: ""; position: absolute; inset: 0; border-radius: 16px; }
.c-post h2 a:focus-visible { outline: none; }
.c-post:has(a:focus-visible) { outline: 2px solid var(--c-link); outline-offset: 2px; }
.c-post time { font-size: 15px; color: var(--fb-text-muted); }
.c-empty { margin: 20px 0; padding: 28px 20px; text-align: center; color: var(--fb-text-secondary); background: var(--fb-surface); border: 1px dashed var(--fb-border); border-radius: 16px; }

/* ------------------------------------------------------------------ guides list */
.c-guides { display: grid; gap: 14px; margin: 20px 0 8px; padding: 0; list-style: none; }
@media (min-width: 640px) { .c-guides { grid-template-columns: 1fr 1fr; gap: 16px; } }
@media (min-width: 1024px) { .c-guides { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.c-guide { position: relative; display: flex; flex-direction: column; height: 100%; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 18px; box-shadow: var(--c-card-shadow); overflow: hidden; transition: box-shadow var(--fb-dur) var(--c-ease), transform var(--fb-dur) var(--c-ease); }
.c-guide:hover { box-shadow: var(--c-card-shadow-hover); transform: translateY(-2px); }
.c-guide:active { transform: scale(.99); }
.c-guide:has(a:focus-visible) { outline: 2px solid var(--c-link); outline-offset: 2px; }
.c-guide__cover { position: relative; aspect-ratio: 16 / 7; background: var(--c-cover); overflow: hidden; }
.c-guide__cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.c-guide__cover svg { position: absolute; inset: 0; width: 100%; height: 100%; color: var(--c-grid-strong); }
.c-guide__cover svg .c-pin { color: var(--fb-blue-500); }
.c-guide__type { position: absolute; left: 12px; top: 12px; padding: 3px 10px; border-radius: 999px; background: var(--fb-surface); color: var(--fb-text); font-size: 13px; font-weight: 650; box-shadow: var(--fb-shadow-sm); }
.c-guide__body { display: flex; flex-direction: column; gap: 6px; flex: 1; padding: 14px 16px 16px; }
.c-guide h2 { margin: 0; font-size: 20px; line-height: 1.3; letter-spacing: -.01em; }
.c-guide h2 a { color: var(--fb-text); text-decoration: none; }
.cpage .c-guide h2 a { color: var(--fb-text); }
.c-guide h2 a::after { content: ""; position: absolute; inset: 0; }
.c-guide h2 a:focus-visible { outline: none; }
.c-guide p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--fb-text-secondary); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.c-guide .c-meta { margin: auto 0 0; padding-top: 6px; font-size: 13px; }
.c-feed { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 12px; font-size: 15px; font-weight: 600; text-decoration: none; }
.c-feed .ic { width: 18px; height: 18px; }

/* ------------------------------------------------------------------ article (guide + news post) */
.c-article { font-size: 17px; line-height: 1.65; }
.c-article .c-meta { margin: 0 0 18px; }
.c-article__lead { margin: 0 0 20px; font-size: 20px; line-height: 1.5; color: var(--fb-text-secondary); max-width: 34em; }
.c-article__cover { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; margin: 4px 0 24px; border-radius: 18px; background: var(--fb-surface-secondary); }
.c-preview { margin: 0 0 14px; padding: 10px 14px; border-radius: 12px; background: var(--c-warning-soft); color: var(--c-warning-text); font-size: 15px; font-weight: 600; }
.c-toc { margin: 0 0 28px; }
.c-toc summary { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; list-style: none; font-size: 15px; font-weight: 650; color: var(--fb-text-secondary); }
.c-toc summary::-webkit-details-marker { display: none; }
.c-toc summary::after { content: ""; width: 7px; height: 7px; margin-top: -3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform var(--fb-dur) var(--c-ease); }
.c-toc[open] summary::after { transform: rotate(-135deg); margin-top: 3px; }
.c-toc ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 0; padding: 0; list-style: none; }
.c-toc a { display: inline-flex; align-items: center; min-height: 36px; padding: 6px 14px; border-radius: 999px; border: 1px solid var(--fb-border); background: var(--fb-surface); color: var(--fb-text); font-size: 15px; line-height: 1.3; font-weight: 550; text-decoration: none; transition: border-color var(--fb-dur-fast), background-color var(--fb-dur-fast); }
.cpage .c-toc a { color: var(--fb-text); }
.c-toc a:hover { border-color: var(--c-link); background: var(--fb-primary-soft); }
.c-prose { max-width: 68ch; }
.c-prose > :first-child { margin-top: 0; }
.c-prose h2 { margin: 44px 0 12px; font-size: 26px; line-height: 1.22; letter-spacing: -.02em; scroll-margin-top: 76px; }
.c-prose h3 { margin: 30px 0 8px; font-size: 20px; line-height: 1.3; scroll-margin-top: 76px; }
.c-prose h4 { margin: 22px 0 6px; font-size: 17px; }
.c-prose p { margin: 0 0 18px; }
.c-prose ul, .c-prose ol { margin: 0 0 18px; padding-left: 22px; }
.c-prose li { margin: 0 0 8px; padding-left: 4px; }
.c-prose li::marker { color: var(--fb-text-muted); }
.c-prose strong { font-weight: 650; color: var(--fb-text); }
/* callout: a blockquote in Markdown; pull quote: a blockquote that is a single short paragraph without bold lead-in */
.c-prose blockquote { margin: 24px 0; padding: 16px 18px 16px 20px; background: var(--fb-primary-soft); border-radius: 14px; border-left: 4px solid var(--fb-blue-500); color: var(--fb-text); font-size: 17px; }
.c-prose blockquote p { margin: 0 0 8px; } .c-prose blockquote p:last-child { margin: 0; }
.c-prose blockquote:has(> p:only-child):not(:has(strong)) { padding: 6px 0 6px 20px; background: none; border-left: 3px solid; border-image: var(--fb-gradient) 1; border-radius: 0; font-size: 20px; line-height: 1.45; font-weight: 550; letter-spacing: -.01em; color: var(--fb-text); }
.c-prose table { width: 100%; border-collapse: collapse; margin: 8px 0 22px; font-size: 15px; display: block; overflow-x: auto; }
.c-prose th, .c-prose td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--fb-border); vertical-align: top; }
.c-prose th { font-size: 13px; color: var(--fb-text-muted); font-weight: 650; }
.c-prose figure { margin: 24px 0; }
.c-prose img { height: auto; border-radius: 14px; }
/* phone screenshots in news/guides: phone-sized and centred, not full column width */
.c-prose figure img[src*="/assets/news/"] { display: block; width: 100%; max-width: 320px; margin: 0 auto; box-shadow: 0 8px 28px rgba(8, 36, 74, .16); border: 1px solid rgba(100, 116, 139, .18); }
.c-prose figure:has(img[src*="/assets/news/"]) figcaption { text-align: center; }
.c-prose figcaption { margin-top: 8px; font-size: 13px; color: var(--fb-text-muted); }
.c-prose pre { padding: 14px 16px; border-radius: 12px; background: var(--fb-surface-secondary); overflow: auto; font-size: 14px; }
.c-prose code { font-size: .9em; }
.c-prose hr { border: 0; height: 1px; margin: 32px 0; background: var(--fb-border); }
.c-prose a { text-decoration: underline; }
/* shortcode output (App\Content shortcodes) */
.sc-list { margin: 10px 0 22px; }
.sc-list__lead, .sc-list__empty { color: var(--fb-text-secondary); }
.sc-list__empty { padding: 12px 14px; border-radius: 12px; background: var(--fb-surface-secondary); font-size: 15px; }
.sc-list__more a { font-weight: 650; text-decoration: none; }
.sc-gym { display: grid; grid-template-columns: 52px 1fr; gap: 14px; align-items: center; margin: 0 0 10px; padding: 12px 14px; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 16px; box-shadow: var(--c-card-shadow); line-height: 1.4; }
.sc-gym__logo { width: 52px; height: 52px; border-radius: 12px; object-fit: contain; background: #fff; border: 1px solid var(--fb-border); }
.sc-gym__logo--empty { display: grid; place-items: center; font-size: 20px; font-weight: 750; color: var(--c-link); background: var(--fb-primary-soft); border-color: transparent; }
.sc-gym__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cpage .sc-gym__name { font-size: 17px; font-weight: 700; color: var(--fb-text); text-decoration: none; }
.cpage .sc-gym__name:hover { color: var(--c-link); text-decoration: none; }
.sc-gym__meta { font-size: 13px; color: var(--fb-text-secondary); }
.sc-gym__badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.sc-badge { display: inline-flex; align-items: center; gap: 5px; padding: 1px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; line-height: 1.6; color: var(--fb-text); background: var(--fb-accent-soft); }
.sc-badge--247::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--fb-green); }
.sc-badge--pass { background: var(--fb-primary-soft); }
.cpage .sc-city { display: inline-flex; align-items: center; gap: 4px; padding: 1px 10px; border: 1px solid var(--fb-border); border-radius: 999px; background: var(--fb-surface); color: var(--fb-text); font-weight: 650; font-size: 15px; text-decoration: none; }
.cpage .sc-city:hover { border-color: var(--c-link); }
.sc-city small { font-weight: 500; color: var(--fb-text-muted); }
.sc-gymlink { font-weight: 650; }
.c-rel { margin: 40px 0 8px; }
.c-rel h2 { margin: 0 0 12px; font-size: 20px; }
.c-share { display: flex; flex-wrap: wrap; gap: 8px; margin: 28px 0 8px; padding-top: 20px; border-top: 1px solid var(--fb-border); }
.c-share button, .c-share a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--fb-border); background: var(--fb-surface); color: var(--fb-text); font: inherit; font-size: 15px; font-weight: 600; text-decoration: none; cursor: pointer; transition: transform var(--fb-dur-fast) var(--c-ease), border-color var(--fb-dur-fast); }
.cpage .c-share a { color: var(--fb-text); }
.c-share button:hover, .c-share a:hover { border-color: var(--c-link); }
.c-share button:active, .c-share a:active { transform: scale(.96); }
.c-share .ic { width: 18px; height: 18px; }
.c-pager { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 24px 0 8px; }
@media (min-width: 640px) { .c-pager { grid-template-columns: 1fr 1fr; } .c-pager a[rel="next"] { text-align: right; grid-column: 2; } }
.c-pager a { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border: 1px solid var(--fb-border); border-radius: 14px; background: var(--fb-surface); color: var(--fb-text); font-weight: 650; font-size: 15px; line-height: 1.35; text-decoration: none; transition: border-color var(--fb-dur-fast); }
.cpage .c-pager a { color: var(--fb-text); }
.c-pager a:hover { border-color: var(--c-link); }
.c-pager small { font-size: 13px; font-weight: 500; color: var(--fb-text-muted); }
.c-backlink { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; margin-top: 12px; font-size: 15px; font-weight: 600; text-decoration: none; }
.c-backlink .ic { width: 18px; height: 18px; }

/* ------------------------------------------------------------------ secondary pages (about, contact, privacy, terms) */
.c-subnav { display: flex; gap: 6px; margin: 36px 0 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.c-subnav::-webkit-scrollbar { display: none; }
.c-subnav a { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: 999px; white-space: nowrap; color: var(--fb-text-secondary); font-size: 15px; font-weight: 600; text-decoration: none; }
.cpage .c-subnav a { color: var(--fb-text-secondary); }
.c-subnav a:hover { background: var(--fb-surface-secondary); }
.cpage .c-subnav a[aria-current] { color: var(--fb-text); background: var(--fb-surface); box-shadow: inset 0 0 0 1px var(--fb-border); }

/* ------------------------------------------------------------------ footer */
.c-foot { margin-top: 56px; padding: 32px 0 calc(28px + var(--fb-safe-bottom)); background: var(--fb-surface); border-top: 1px solid var(--fb-border); font-size: 15px; }
.c-foot__grid { display: grid; gap: 28px; }
@media (min-width: 768px) { .c-foot__grid { grid-template-columns: 1.6fr 1fr 1fr; gap: 32px; } }
.c-foot h2 { margin: 0 0 10px; font-size: 15px; font-weight: 700; color: var(--fb-text); }
.c-foot ul { margin: 0; padding: 0; list-style: none; }
.c-foot__links li a { display: inline-flex; align-items: center; min-height: 36px; color: var(--fb-text-secondary); text-decoration: none; }
.cpage .c-foot__links li a { color: var(--fb-text-secondary); }
.cpage .c-foot__links li a:hover { color: var(--c-link); text-decoration: underline; }
.c-foot .c-chips a { min-height: 36px; font-size: 14px; }
.c-foot__base { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 14px 24px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--fb-border); }
.c-foot__brand { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
.c-foot__brand img { width: 32px; height: 32px; }
.c-foot__brand b { font-size: 15px; }
.c-foot__note { flex: 1 1 320px; margin: 0; font-size: 13px; line-height: 1.5; color: var(--fb-text-muted); }
.cpage .c-foot__note a { color: var(--fb-text-secondary); }

/* ------------------------------------------------------------------ 404 */
.c-nf { padding: 32px 0 8px; }
.c-nf__code { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 4px 12px; border-radius: 999px; background: var(--fb-surface); border: 1px solid var(--fb-border); font-size: 13px; font-weight: 650; color: var(--fb-text-secondary); font-variant-numeric: tabular-nums; }
.c-nf__code::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--fb-warning); }
.c-nf__acts { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 8px; }
.c-nf__dev { margin: 24px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--fb-surface-secondary); font: 13px/1.5 ui-monospace, Menlo, monospace; color: var(--fb-text-secondary); overflow-wrap: anywhere; }

/* ------------------------------------------------------------------ partner badge section (partials/_badge_section) */
.fb-badge-sec { margin: 44px 0 8px; padding: 22px 20px; background: var(--fb-surface); color: var(--fb-text); border: 1px solid var(--fb-border); border-radius: 20px; box-shadow: var(--c-card-shadow); }
.fb-badge-sec h2 { margin: 0 0 6px; font-size: 20px; line-height: 1.3; letter-spacing: -.01em; }
.fb-badge-sec p { margin: 0 0 12px; font-size: 15px; line-height: 1.5; color: var(--fb-text-secondary); max-width: 64ch; }
.fb-badge-sec__row { display: flex; flex-wrap: wrap; gap: 16px 24px; align-items: flex-start; margin: 12px 0 12px; }
.fb-badge-sec__prev { display: flex; flex-direction: column; gap: 8px; min-width: 200px; }
.fb-badge-sec__prev-box { display: inline-flex; justify-content: center; padding: 16px; border-radius: 14px; background: #F1F5F9; transition: background-color .2s var(--c-ease); }
.fb-badge-sec__prev-box.is-dark { background: #0D1B2E; }
.fb-badge-sec__prev img { display: block; width: 200px; height: 56px; }
.fb-badge-sec__lbl { font-size: 13px; font-weight: 650; color: var(--fb-text-secondary); }
.fb-badge-sec__theme { display: inline-flex; align-self: flex-start; gap: 4px; padding: 4px; border-radius: 999px; background: var(--fb-surface-secondary); }
.fb-badge-sec__theme button { appearance: none; min-height: 36px; padding: 0 16px; border: 0; border-radius: 999px; font: inherit; font-size: 14px; font-weight: 650; color: var(--fb-text-secondary); background: transparent; cursor: pointer; transition: background-color var(--fb-dur-fast), color var(--fb-dur-fast); }
.fb-badge-sec__theme button[aria-pressed="true"] { background: var(--fb-surface); color: var(--fb-text); box-shadow: var(--fb-shadow-sm); }
.fb-badge-sec__code { flex: 1 1 280px; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.fb-badge-sec__code textarea { display: block; width: 100%; min-height: 112px; padding: 12px 14px; box-sizing: border-box; border: 1px solid var(--fb-border); border-radius: 12px; background: var(--fb-surface-secondary); color: var(--fb-text); font: 12.5px/1.55 ui-monospace, Menlo, Consolas, monospace; resize: vertical; }
.fb-badge-sec__code button { align-self: flex-start; appearance: none; min-height: 44px; padding: 0 18px; border: 0; border-radius: 12px; font: inherit; font-size: 15px; font-weight: 650; color: #fff; background: var(--c-cta); cursor: pointer; transition: transform var(--fb-dur-fast) var(--c-ease), background var(--fb-dur); }
.fb-badge-sec__code button:active { transform: scale(.97); }
.fb-badge-sec__code button.is-done { background: var(--fb-navy); }
.fb-badge-sec__note { font-size: 13px !important; color: var(--fb-text-muted) !important; margin: 0 !important; }
@media (max-width: 479px) { .fb-badge-sec { padding: 18px 16px; } .fb-badge-sec__prev { min-width: 0; width: 100%; } .fb-badge-sec__code button { align-self: stretch; } }

/* ------------------------------------------------------------------ motion (JS marks below-the-fold blocks; content never depends on it) */
.c-rv { opacity: 0; transform: translateY(12px); }
.c-rv.is-in { opacity: 1; transform: none; transition: opacity .5s var(--c-ease), transform .5s var(--c-ease); }
@media (prefers-reduced-motion: reduce) {
    .c-rv { opacity: 1; transform: none; }
    .c-pop__menu { animation: none; }
    .c-stat, .c-guide, .c-post, .c-btn, .c-tbtn { transition: none; }
}
@media print {
    .c-top, .c-foot, .c-cta, .c-share, .c-hero__map { display: none !important; }
    body.cpage { background: #fff; color: #000; }
    .c-rv { opacity: 1 !important; transform: none !important; }
}
.c-foot__links { columns: 2; column-gap: 16px; }
.c-foot__links li { break-inside: avoid; }
.c-foot__links--1 { columns: 1; }
.c-pop__menu a[aria-current] .c-code { color: inherit; }
.c-city__head h3 a { display: inline-block; padding: 10px 0; }
.c-city__head { margin-bottom: 4px; }

/* ---- wide layout (owner 2026-09-24: "grid 1200–1440px, da ni vse stisnjeno") ----
   Everything sits on a 1200px grid (1440px on very wide screens); running text keeps a readable measure
   but wider than before, and card grids use the extra columns. */
:root { --c-w: 1200px; --c-w-wide: 1200px; }
@media (min-width: 1600px) { :root { --c-w: 1440px; --c-w-wide: 1440px; } }
@media (min-width: 1024px) {
    .c-wrap { padding-left: max(32px, var(--fb-safe-left)); padding-right: max(32px, var(--fb-safe-right)); max-width: calc(var(--c-w) + 64px); }
    .c-wrap--wide { max-width: calc(var(--c-w-wide) + 64px); }
    .c-body > p, .c-body > ul:not([class]), .c-body > ol:not([class]), .c-prose { max-width: 82ch; }
    .c-stats { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
    .c-stats--cities { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .c-gyms { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .c-gyms li:nth-child(odd) { border-right: 0; }
    .c-gyms li:not(:nth-child(3n)) { border-right: 1px solid var(--fb-border); }
    .c-guides { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
    /* footer (owner 2026-09-24: columns should breathe on the wide grid) */
    .c-foot { padding-top: 48px; }
    .c-foot__grid { display: flex; flex-wrap: nowrap; gap: 64px; align-items: flex-start; }
    .c-foot__cities { flex: 1 1 420px; }
    .c-foot__pages { flex: 0 1 auto; }
    .c-foot__lang { flex: 0 0 160px; }
    .c-foot__pages .c-foot__links { columns: 2 180px; column-gap: 56px; }
    .c-foot__links li a { white-space: nowrap; min-height: 38px; }
    .c-foot h2 { margin-bottom: 14px; }
}
@media (min-width: 1440px) { .c-guides { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---- articles on the wide grid (owner 2026-09-24: "ne da je pol strani prazno") ----
   ≥1100px: text column + sticky 320px sidebar with the table of contents as a vertical list. */
@media (min-width: 1100px) {
    .c-article { display: grid; grid-template-columns: minmax(0, 1fr) 320px; column-gap: 64px; align-items: start; }
    .c-article > * { grid-column: 1; }
    .c-article__cover { grid-column: 1 / -1; grid-row: 1; }
    .c-article .c-prose { max-width: none; }
    .c-article:has(> .c-article__cover) > .c-toc { grid-row: 2 / span 40; }
    .c-article > .c-toc { grid-column: 2; grid-row: 1 / span 40; position: sticky; top: 96px; margin: 0; padding: 20px 22px; border: 1px solid var(--fb-border); border-radius: 18px; background: var(--fb-surface); box-shadow: var(--c-card-shadow); }
    .c-article > .c-toc summary { pointer-events: none; min-height: 0; margin-bottom: 10px; text-transform: uppercase; letter-spacing: .06em; font-size: 12.5px; color: var(--fb-text-muted); }
    .c-article > .c-toc summary::after { display: none; }
    .c-article > .c-toc ol { display: block; counter-reset: toc; }
    .c-article > .c-toc li { counter-increment: toc; }
    .c-article > .c-toc a { display: flex; gap: 10px; min-height: 0; padding: 8px 0; border: 0; border-radius: 0; background: none; font-size: 15px; color: var(--fb-text-secondary); border-bottom: 1px solid var(--fb-border); }
    .c-article > .c-toc li:last-child a { border-bottom: 0; }
    .c-article > .c-toc a::before { content: counter(toc, decimal-leading-zero); color: var(--c-link); font-weight: 700; font-variant-numeric: tabular-nums; }
    .c-article > .c-toc a:hover { color: var(--c-link); background: none; }
}

/* CTA with two buttons (about / contact / privacy / terms) */
.c-cta__btns { display: flex; flex-wrap: wrap; gap: 10px; }

/* Personal-trainer / PT-studio page: portrait slot + details side by side (grey placeholder with the FitBlizu mark) */
.c-person { display: grid; grid-template-columns: 1fr; gap: 16px; align-items: start; }
.c-person__photo { aspect-ratio: 1 / 1; width: 100%; max-width: 220px; border-radius: 16px; display: grid; place-items: center;
    background: rgba(148, 163, 184, .2); border: 1px solid rgba(148, 163, 184, .35); }
.c-person__photo img { width: 72px; height: 72px; opacity: .55; filter: grayscale(1); }
.c-person__body { min-width: 0; }
@media (min-width: 720px) { .c-person { grid-template-columns: 220px 1fr; gap: 24px; } }
.c-person__photo--img { overflow: hidden; background: var(--fb-surface-secondary); }
.c-person__photo--img img { width: 100%; height: 100%; object-fit: cover; opacity: 1; filter: none; }
/* other venue pages: the owner's photo / logo as a small image above the meta line */
.c-vlogo { margin: 0 0 10px; }
.c-vlogo img { display: block; width: 96px; height: 96px; object-fit: cover; border-radius: 14px; border: 1px solid rgba(148, 163, 184, .35); background: var(--fb-surface); }

/* Venue page: "Predlagaj popravek" + "Prevzemi profil" forms (views/venues/_community.php, owner 2026-10-11) */
.vcom { margin-top: 32px; }
.vcom__msg { padding: 12px 16px; border-radius: 12px; background: var(--fb-primary-soft, rgba(0, 114, 242, .1)); color: var(--fb-text); }
.vcom__msg--err { background: rgba(229, 72, 77, .12); }
.vcom__form { display: grid; gap: 6px; padding: 0 18px 18px; }
.vcom__form label { margin-top: 8px; font-size: 14px; font-weight: 600; }
.vcom__form input, .vcom__form select, .vcom__form textarea { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--fb-border); border-radius: 10px;
    background: var(--fb-surface); color: var(--fb-text); font: inherit; font-size: 16px; }
.vcom__form textarea { min-height: 96px; resize: vertical; }
.vcom__form .c-btn { justify-self: start; margin-top: 12px; }
.vcom__row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
@media (max-width: 480px) { .vcom__row { grid-template-columns: 1fr; } }
.vcom__hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Guide shortcode [[venues:sport]] — venue cards grouped by town (Shortcodes::venueList / venueCard) */
.sc-venues .sc-vtown { margin: 18px 0 0; }
.sc-venues .sc-vtown__name { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: 17px; font-weight: 750; }
.sc-venues .sc-vtown__n { padding: 0 8px; border-radius: 999px; background: var(--fb-surface-secondary); color: var(--fb-text-secondary); font-size: 13px; font-weight: 650; line-height: 1.7; }
.sc-venues .sc-vgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.sc-venues .sc-vgrid li { margin: 0; }
.cpage .sc-vcard { display: grid; grid-template-columns: 44px 1fr auto; gap: 12px; align-items: center; height: 100%; box-sizing: border-box; padding: 10px 12px; background: var(--fb-surface); border: 1px solid var(--fb-border); border-radius: 14px; box-shadow: var(--c-card-shadow); color: var(--fb-text); text-decoration: none; line-height: 1.35; transition: border-color .15s ease, transform .15s ease; }
.cpage .sc-vcard:hover { border-color: var(--c-link); transform: translateY(-1px); }
.cpage .sc-vcard:focus-visible { outline: 2px solid var(--c-link); outline-offset: 2px; }
.sc-vcard__img { width: 44px; height: 44px; border-radius: 12px; object-fit: cover; background: #fff; }
.sc-vcard__img--pin { display: grid; place-items: center; background: var(--fb-primary-soft); }
.sc-vcard__body { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sc-vcard__name { font-weight: 700; font-size: 15.5px; overflow-wrap: anywhere; }
.sc-vcard__meta { font-size: 13px; color: var(--fb-text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sc-vcard__badges { display: flex; gap: 6px; margin-top: 3px; }
.sc-vcard__go { font-size: 22px; color: var(--fb-text-muted); }
@media (prefers-reduced-motion: reduce) { .cpage .sc-vcard { transition: none; } .cpage .sc-vcard:hover { transform: none; } }

/* consecutive gym cards (Markdown::toHtml wraps 2+ in .sc-gyms): grid instead of one full-width card per row */
.sc-gyms { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 10px; margin: 0 0 14px; }
.sc-gyms .sc-gym { margin: 0; }
/* article images get `height: auto` (.c-prose img) — logos and venue thumbs keep their square box */
.c-prose .sc-gym__logo { height: 52px; border-radius: 12px; }
.c-prose .sc-vcard__img { height: 44px; border-radius: 12px; }
.c-prose .sc-vcard__img--pin img { height: 30px; border-radius: 0; }