/* ClubSpace public design v5 — independent stylesheet, no compression */
:root {
    --cs-ink: #182333;
    --cs-muted: #788391;
    --cs-line: #e7eaef;
    --cs-bg: #f8f9fb;
    --cs-blue: #3467ee;
    --cs-white: #ffffff;
    --cs-radius: 24px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.cs-site { margin: 0; color: var(--cs-ink); background: var(--cs-bg); font-family: 'Inter','Noto Sans Georgian',sans-serif; font-size: 14px; line-height: 1.7; -webkit-font-smoothing: antialiased; }
.cs-site a { text-decoration: none; color: inherit; }
.cs-site button, .cs-site input { font: inherit; }
.cs-site button { cursor: pointer; }
.cs-site svg.icon { width: 19px; height: 19px; flex-shrink: 0; vertical-align: middle; }
.cs-site h1, .cs-site h2, .cs-site h3, .cs-site p { margin: 0; }
.cs-container { width: min(100% - 60px, 1280px); margin-inline: auto; }
.cs-header { background: rgba(255,255,255,.96); border-bottom: 1px solid var(--cs-line); position: sticky; top: 0; z-index: 100; backdrop-filter: blur(18px); }
.cs-nav { min-height: 85px; display: flex; justify-content: space-between; align-items: center; gap: 25px; }
.cs-brand { display: inline-flex; align-items: center; gap: 11px; font-size: 23px; font-weight: 800; letter-spacing: -.075em; white-space: nowrap; }
.cs-brand-icon { display: grid; place-items: center; width: 38px; height: 38px; background: #e7efff; color: var(--cs-blue); border-radius: 12px; }
.cs-brand-point { color: var(--cs-blue); }
.cs-nav-links { display: flex; align-items: center; gap: 29px; }
.cs-nav-item { font-size: 13px; font-weight: 650; }
.cs-nav-item:hover, .cs-footer a:hover { color: var(--cs-blue); }
.cs-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; border-radius: 12px; border: 1px solid transparent; padding: 14px 22px; font-size: 13px; font-weight: 700; line-height: 1.3; transition: transform .2s, box-shadow .2s, background .2s; text-align: center; }
.cs-button:hover { transform: translateY(-2px); }
.cs-button-dark { color: white !important; background: #202b3e; }
.cs-button-dark:hover { background: #34445f; box-shadow: 0 13px 28px #1b29401a; }
.cs-button-light { background: white; border-color: #dfe5ec; color: #202b3e !important; }
.cs-button-white { background: white; color: #1c2a43 !important; }
.cs-site .language-switch { display: flex; align-items: center; background: #f4f6f9; border-radius: 10px; padding: 4px; gap: 3px; }
.cs-site .language-switch a { padding: 5px 9px; font-size: 11px; border-radius: 7px; }
.cs-site .language-switch .selected { background: white; box-shadow: 0 2px 5px #11182712; }
.cs-menu-toggle { display: none; border: 0; background: #f0f3f8; padding: 11px; border-radius: 10px; }
.cs-main { min-height: 60vh; }
.cs-hero { display: grid; grid-template-columns: 1.04fr .96fr; min-height: 595px; margin-top: 35px; border-radius: 30px; background: #edf2f9; overflow: hidden; }
.cs-hero-copy { padding: clamp(34px,5vw,78px) clamp(28px,5vw,75px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.cs-eyebrow, .cs-kicker { display: inline-flex; align-items: center; gap: 9px; color: #5574ad; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; font-weight: 800; }
.cs-dot { width: 8px; height: 8px; background: #497ff4; border-radius: 50%; }
.cs-hero h1 { margin-top: 27px; color: #19253a; font-size: clamp(35px,3.45vw,57px); line-height: 1.27; font-weight: 800; letter-spacing: -.065em; }
.cs-hero h1 em { color: var(--cs-blue); font-style: normal; }
.cs-hero-copy > p { margin-top: 24px; font-size: 15px; line-height: 1.9; color: #66768b; max-width: 500px; }
.cs-hero-buttons { display: flex; align-items: center; gap: 11px; flex-wrap: wrap; margin-top: 31px; }
.cs-hero-note { display: flex; align-items: center; gap: 14px; margin-top: 48px; color: #7e8b9c; font-size: 11px; }
.cs-note-avatars { display: flex; padding-left: 8px; }
.cs-note-avatars > span { width: 30px; height: 30px; border: 2px solid #edf2f9; border-radius: 50%; background: #d6e4ff; margin-left: -8px; display: grid; place-items: center; color: #4368b8; }
.cs-note-avatars > span:nth-child(2) { background: #e9e6fa; }
.cs-note-avatars > span:nth-child(3) { background: #d7eee4; }
.cs-note-avatars svg.icon { width: 14px; height: 14px; }
.cs-hero-image { position: relative; background: #dde5ef; min-height: 500px; overflow: hidden; }
.cs-hero-image > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cs-hero-image::after { content: ''; position: absolute; inset: 40% 0 0; background: linear-gradient(transparent, #1018274f); pointer-events: none; }
.cs-hero-placeholder { height: 100%; min-height: 500px; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #a3b6d8; font-size: 62px; font-weight: 800; letter-spacing: -.08em; }
.cs-hero-placeholder svg { width: 100px !important; height: 100px !important; }
.cs-hero-floating { position: absolute; bottom: 34px; left: 33px; right: 33px; display: flex; align-items: center; gap: 15px; padding: 18px; background: #fff; border-radius: 18px; z-index: 2; box-shadow: 0 20px 60px #0e24352e; }
.cs-floating-dot { width: 36px; height: 36px; background: #e8efff; border-radius: 11px; flex: none; }
.cs-hero-floating > div { flex: 1; min-width: 0; }
.cs-hero-floating small, .cs-hero-floating strong { display: block; }
.cs-hero-floating small { color: #8b95a5; font-size: 10px; }
.cs-hero-floating strong { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs-hero-floating a { background: #202b3e; color: white; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; }
.cs-hero-photo-label { position: absolute; top: 22px; right: 23px; background: #ffffffee; padding: 10px 14px; border-radius: 11px; display: flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 750; z-index: 2; }
.cs-benefits { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--cs-line); padding: 35px 0; gap: 20px; }
.cs-benefits > div { display: flex; align-items: center; gap: 13px; }
.cs-benefits > div + div { border-left: 1px solid var(--cs-line); padding-left: 35px; }
.cs-benefit-icon { display: grid; place-items: center; flex: none; width: 44px; height: 44px; background: #e9effc; color: #376be2; border-radius: 14px; }
.cs-benefits strong, .cs-benefits small { display: block; }
.cs-benefits strong { font-size: 13px; }
.cs-benefits small { color: #8a95a3; font-size: 11px; }
.cs-directory { padding-top: 105px; padding-bottom: 95px; scroll-margin-top: 100px; }
.cs-section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 29px; }
.cs-section-heading h2 { margin-top: 10px; font-size: clamp(30px,3.2vw,43px); font-weight: 800; letter-spacing: -.055em; line-height: 1.3; }
.cs-section-heading h2 span { color: var(--cs-blue); }
.cs-section-heading p { margin-top: 7px; color: #84909e; font-size: 13px; }
.cs-total { flex: none; border: 1px solid #e3e8ef; color: #637185; background: white; border-radius: 30px; padding: 9px 15px; font-size: 11px; font-weight: 700; }
.cs-search { display: flex; align-items: center; gap: 14px; padding: 10px 11px 10px 21px; border: 1px solid #e4e9f0; border-radius: 18px; background: white; margin-bottom: 24px; }
.cs-search > svg { color: #7d8aa0; }
.cs-search input { border: 0; background: transparent; min-width: 0; width: 100%; outline: none; color: var(--cs-ink); font-size: 14px; padding: 10px 0; }
.cs-search input::placeholder { color: #99a4b3; }
.cs-search-clear { display: grid; place-items: center; color: #8c98a7; }
.cs-club-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px; }
.cs-club-card { display: block; background: white; border: 1px solid #e9ecf0; border-radius: 23px; overflow: hidden; transition: transform .2s ease, box-shadow .2s ease; min-width: 0; }
.cs-club-card:hover { transform: translateY(-5px); box-shadow: 0 25px 55px #18233413; }
.cs-club-cover { height: 235px; position: relative; overflow: hidden; background: #e3eaf5; }
.cs-club-cover > img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.cs-club-card:hover .cs-club-cover > img { transform: scale(1.045); }
.cs-cover-fallback { height: 100%; display: grid; place-items: center; color: #7391c6; }
.cs-cover-fallback svg.icon { width: 75px; height: 75px; }
.cs-card-category, .cs-profile-category { position: absolute; top: 17px; left: 17px; display: inline-flex; align-items: center; background: #fff; padding: 8px 13px; font-size: 11px; font-weight: 800; color: #33445e; border-radius: 30px; }
.cs-card-info { padding: 0 25px 23px; }
.cs-card-top { display: flex; justify-content: space-between; align-items: flex-start; height: 52px; }
.cs-card-logo { display: grid; place-items: center; width: 77px; height: 77px; border: 5px solid white; background: white; border-radius: 19px; margin-top: -37px; overflow: hidden; box-shadow: 0 7px 24px #1a2b3e18; font-size: 24px; font-weight: 800; z-index: 1; position: relative; }
.cs-card-logo img { width: 100%; height: 100%; object-fit: contain; }
.cs-card-go { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #f2f5fa; margin-top: 13px; }
.cs-card-location { display: flex; align-items: center; gap: 5px; color: #8894a3; font-size: 11px; font-weight: 650; }
.cs-card-location svg.icon { width: 15px; height: 15px; }
.cs-card-info h3 { font-size: 18px; line-height: 1.4; letter-spacing: -.025em; margin-top: 7px; min-height: 50px; }
.cs-card-info p { margin-top: 9px; color: #8994a2; font-size: 12px; line-height: 1.8; min-height: 65px; }
.cs-card-link { border-top: 1px solid #eef0f3; padding-top: 17px; margin-top: 15px; display: flex; align-items: center; justify-content: space-between; color: var(--cs-blue); font-size: 12px; font-weight: 800; }
.cs-pagination { margin-top: 32px; }
.cs-no-results { grid-column: 1 / -1; padding: 64px 25px; text-align: center; color: #8b97a8; background: #fff; border: 1px dashed #dbe2ec; border-radius: 20px; }
.cs-no-results > svg { width: 42px; height: 42px; }
.cs-no-results h3 { margin: 12px 0 5px; font-size: 17px; color: var(--cs-ink); }
.cs-callout { background: #202e45; border-radius: 26px; color: white; padding: 60px 75px; margin-bottom: 105px; display: flex; align-items: center; justify-content: space-between; overflow: hidden; }
.cs-callout .cs-kicker { color: #a7bdfb; }
.cs-callout h2 { margin: 14px 0; font-size: clamp(29px,3.3vw,46px); font-weight: 800; letter-spacing: -.045em; line-height: 1.3; }
.cs-callout p { margin-bottom: 23px; color: #afbacb; font-size: 13px; max-width: 540px; }
.cs-callout-symbol { font-size: clamp(100px,16vw,260px); color: #ffffff0d; font-weight: 800; letter-spacing: -.09em; line-height: 1; }
.cs-footer { background: white; border-top: 1px solid var(--cs-line); padding: 34px 0; }
.cs-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.cs-footer p { color: #91a0b1; font-size: 11px; margin-top: 9px; }
.cs-footer-right { display: flex; gap: 35px; color: #8d99a9; font-size: 12px; }
/* Club details */
.cs-club-page { padding-top: 26px; padding-bottom: 100px; }
.cs-breadcrumb { display: flex; gap: 10px; align-items: center; color: #8a95a4; font-size: 11px; margin-bottom: 21px; flex-wrap: wrap; }
.cs-breadcrumb svg.icon { width: 13px; height: 13px; }
.cs-breadcrumb span { color: #29374d; }
.cs-profile-cover { height: clamp(270px, 33vw, 450px); overflow: hidden; border-radius: 25px; background: #e5edf7; position: relative; }
.cs-profile-cover > img { width: 100%; height: 100%; display: block; object-fit: cover; }
.cs-profile-cover-fallback { height: 100%; display: grid; place-items: center; color: #6d92d7; }
.cs-profile-cover-fallback svg.icon { width: 100px; height: 100px; }
.cs-profile-category { top: 22px; left: 23px; }
.cs-profile-intro { margin: 0 0 30px; padding: 0 5px 27px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid var(--cs-line); }
.cs-profile-main { display: flex; align-items: center; gap: 24px; min-width: 0; }
.cs-profile-logo { display: grid; place-items: center; flex: none; width: 118px; height: 118px; background: white; border: 7px solid var(--cs-bg); border-radius: 25px; margin-top: -38px; z-index: 1; box-shadow: 0 10px 24px #10203117; font-size: 37px; font-weight: 800; overflow: hidden; }
.cs-profile-logo img { width: 100%; height: 100%; object-fit: contain; }
.cs-profile-main h1 { font-size: clamp(24px, 2.5vw, 37px); line-height: 1.35; letter-spacing: -.04em; margin-top: 7px; }
.cs-profile-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 16px; color: #8290a1; margin-top: 10px; font-size: 12px; }
.cs-profile-meta span { display: inline-flex; align-items: center; gap: 6px; }
.cs-profile-meta svg.icon { width: 16px; height: 16px; }
.cs-profile-layout { display: grid; grid-template-columns: minmax(0, 1fr) 335px; gap: 25px; align-items: start; }
.cs-profile-primary { display: grid; gap: 22px; min-width: 0; }
.cs-section-card { background: white; border: 1px solid var(--cs-line); padding: 35px; border-radius: 23px; }
.cs-profile-section-title { margin-bottom: 21px; }
.cs-profile-section-title h2 { margin-top: 8px; font-size: 26px; letter-spacing: -.04em; }
.cs-profile-section-title h2 small { font-size: 13px; color: #8a97a7; }
.cs-profile-section-title p { color: #8b96a6; font-size: 12px; margin-top: 8px; }
.cs-description { font-size: 14px; line-height: 2; color: #667488; overflow-wrap: anywhere; white-space: pre-line; }
.cs-description p { margin-bottom: 13px; }
.cs-description h3 { color: #25354c; margin: 12px 0; }
.cs-gallery-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 11px; }
.cs-gallery-item { border: 0; background: #eef2f6; border-radius: 13px; position: relative; aspect-ratio: 4 / 3; overflow: hidden; padding: 0; }
.cs-gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s; display: block; }
.cs-gallery-item:hover img { transform: scale(1.07); }
.cs-gallery-item span { position: absolute; bottom: 9px; right: 9px; background: #fffffff0; padding: 6px; border-radius: 8px; opacity: 0; transition: opacity .2s; }
.cs-gallery-item:hover span { opacity: 1; }
.cs-groups-list { display: grid; gap: 14px; }
.cs-group-card { border: 1px solid var(--cs-line); border-radius: 17px; padding: 23px; background: #fff; }
.cs-group-head, .cs-group-bottom { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cs-group-activity { background: #e9efff; color: #3b64ba; padding: 6px 11px; border-radius: 20px; font-size: 11px; font-weight: 750; }
.cs-group-places { color: #33846f; font-size: 11px; }
.cs-group-card h3 { font-size: 19px; margin: 15px 0; }
.cs-group-details, .cs-group-timetable { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; font-size: 12px; color: #7c8999; }
.cs-group-details span, .cs-group-timetable { display: inline-flex; align-items: center; gap: 5px; }
.cs-group-details svg.icon, .cs-group-timetable svg.icon { width: 15px; height: 15px; }
.cs-group-timetable { margin-top: 13px; gap: 10px; }
.cs-group-timetable span { background: #f3f6fa; padding: 5px 8px; border-radius: 6px; }
.cs-group-bottom { border-top: 1px solid var(--cs-line); margin-top: 22px; padding-top: 17px; }
.cs-group-price strong { font-size: 21px; }
.cs-group-price small { color: #909dad; margin-left: 5px; }
.cs-profile-aside { position: sticky; top: 105px; }
.cs-contact-card, .cs-contact-note { background: white; padding: 27px; border-radius: 20px; border: 1px solid var(--cs-line); }
.cs-contact-card h3 { font-size: 19px; margin: 8px 0 18px; }
.cs-contact-card > a, .cs-contact-line { display: flex; align-items: center; gap: 12px; padding: 17px 0; border-top: 1px solid var(--cs-line); font-size: 12px; overflow-wrap: anywhere; }
.cs-contact-card > a > svg:first-child, .cs-contact-line > svg:first-child { color: var(--cs-blue); }
.cs-contact-card > a > span, .cs-contact-line > span { flex: 1; min-width: 0; }
.cs-contact-card small { display: block; color: #98a4b2; font-size: 10px; margin-bottom: 5px; }
.cs-contact-note { display: flex; gap: 12px; align-items: flex-start; background: #ecf2ff; border: 0; margin-top: 15px; padding: 22px; font-size: 12px; color: #6d7fa4; }
.cs-contact-note svg.icon { color: #3567d5; }
.cs-detail-accordion { border: 1px solid var(--cs-line); background: white; border-radius: 17px; padding: 20px 25px; }
.cs-detail-accordion summary { display: flex; align-items: center; justify-content: space-between; font-weight: 750; cursor: pointer; list-style: none; }
.cs-detail-accordion summary::-webkit-details-marker { display: none; }
.cs-detail-accordion[open] summary svg { transform: rotate(180deg); }
.cs-detail-accordion .cs-description { margin-top: 17px; }
.cs-lightbox { display: none; position: fixed; inset: 0; z-index: 500; background: #10151bee; align-items: center; justify-content: center; padding: 50px; }
.cs-lightbox[aria-hidden="false"] { display: flex; }
.cs-lightbox-image { max-width: min(1050px, 85vw); max-height: 85vh; object-fit: contain; border-radius: 8px; }
.cs-lightbox button { position: absolute; border: 0; color: white; background: #ffffff23; display: grid; place-items: center; border-radius: 50%; width: 47px; height: 47px; }
.cs-lightbox-close { top: 22px; right: 25px; }
.cs-lightbox-prev { left: 22px; }
.cs-lightbox-next { right: 22px; }
.cs-lightbox-count { position: absolute; bottom: 20px; color: #e9eef6; font-size: 12px; }
.cs-site :focus-visible { outline: 3px solid #83a8ff; outline-offset: 3px; }
@media (max-width: 1050px) {
    .cs-hero { min-height: 520px; }
    .cs-hero-copy { padding: 38px; }
    .cs-profile-layout { grid-template-columns: minmax(0,1fr) 280px; }
    .cs-club-grid { gap: 16px; }
}
@media (max-width: 800px) {
    .cs-container { width: min(100% - 36px, 1280px); }
    .cs-nav { min-height: 70px; }
    .cs-menu-toggle { display: grid; place-items: center; margin-left: auto; }
    .cs-nav-links { display: none; position: absolute; top: 70px; left: 0; right: 0; background: white; border-bottom: 1px solid var(--cs-line); padding: 22px; flex-direction: column; align-items: stretch; gap: 18px; box-shadow: 0 20px 30px #0b193315; }
    .cs-nav-links.is-open { display: flex; }
    .cs-nav-links .cs-button { width: 100%; }
    .cs-hero { grid-template-columns: 1fr; margin-top: 18px; }
    .cs-hero-copy { padding: 40px 30px; }
    .cs-hero-image { min-height: 370px; }
    .cs-hero-note { margin-top: 25px; }
    .cs-club-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cs-profile-layout { grid-template-columns: 1fr; }
    .cs-profile-aside { position: static; }
    .cs-profile-intro { align-items: flex-start; flex-direction: column; }
    .cs-profile-intro > .cs-button { margin-left: 0; }
    .cs-callout { padding: 40px; }
}
@media (max-width: 550px) {
    .cs-container { width: calc(100% - 28px); }
    .cs-hero { border-radius: 18px; }
    .cs-hero-copy { padding: 30px 22px; }
    .cs-hero h1 { font-size: clamp(30px,8vw,41px); }
    .cs-hero-buttons { align-items: stretch; width: 100%; }
    .cs-hero-buttons .cs-button { flex: 1; padding-inline: 12px; }
    .cs-hero-image { min-height: 285px; }
    .cs-hero-floating { left: 14px; right: 14px; bottom: 13px; padding: 11px; }
    .cs-benefits { grid-template-columns: 1fr; gap: 16px; padding: 27px 0; }
    .cs-benefits > div + div { border-left: 0; padding-left: 0; }
    .cs-directory { padding-top: 63px; padding-bottom: 60px; }
    .cs-section-heading { align-items: flex-start; flex-direction: column; }
    .cs-search { padding: 7px 9px 7px 13px; gap: 7px; }
    .cs-search input { font-size: 13px; }
    .cs-search .cs-button { padding: 11px; }
    .cs-club-grid { grid-template-columns: 1fr; }
    .cs-club-cover { height: 235px; }
    .cs-card-info h3, .cs-card-info p { min-height: unset; }
    .cs-callout { padding: 35px 24px; margin-bottom: 60px; }
    .cs-callout-symbol { display: none; }
    .cs-footer-inner { flex-direction: column; align-items: flex-start; }
    .cs-profile-cover { height: 225px; border-radius: 15px; }
    .cs-profile-logo { width: 93px; height: 93px; border-width: 5px; border-radius: 19px; }
    .cs-profile-main { gap: 12px; }
    .cs-profile-main h1 { font-size: 23px; }
    .cs-section-card { padding: 23px 18px; }
    .cs-gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .cs-group-bottom { align-items: flex-start; flex-direction: column; }
    .cs-group-bottom .cs-button { width: 100%; }
    .cs-lightbox { padding: 20px; }
    .cs-lightbox-image { max-width: 88vw; }
    .cs-lightbox button { width: 35px; height: 35px; }
    .cs-lightbox-prev { left: 5px; }
    .cs-lightbox-next { right: 5px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .cs-site *, .cs-site *::before, .cs-site *::after { transition: none !important; } }
/* Compatibility with the original auth/registration views using app.css. */
.cs-site .auth { max-width: 560px; margin: 50px auto 90px; background: white; border: 1px solid var(--cs-line); border-radius: 22px; padding: 36px; }
.cs-site .auth h1 { font-size: 29px; margin-bottom: 14px; }
.cs-site .auth .btn, .cs-site .registration-form .btn { background: #202b3e; border-color: #202b3e; color: white; }
.cs-site .alert { max-width: 1280px; margin: 18px auto; }