/* =========================================
   KLUBIK — style.css (final)
   Font: Nunito (Cyrillic-safe, Google Fonts)
   ========================================= */

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800;900&display=swap');

/* -----------------------------------------
   1. ПЕРЕМЕННЫЕ
----------------------------------------- */
:root {
    --color-primary:        #ff6b35;
    --color-primary-light:  #ff8c5a;
    --color-primary-dark:   #e05520;
    --color-primary-bg:     #fff3ee;
    --color-primary-border: #ffd4c0;

    --color-dark:           #1a1a2e;
    --color-text:           #1a1a2e;
    --color-text-muted:     #7a7a8a;
    --color-text-dim:       #9a9aaa;
    --color-white:          #ffffff;

    --color-bg:             #ffffff;
    --color-bg-soft:        #faf9f7;
    --color-bg-hero:        #fff9f6;
    --color-border:         #f0ede8;
    --color-border-mid:     #e0ddd8;

    --radius-sm:  8px;
    --radius-md:  12px;
    --radius-lg:  18px;
    --radius-xl:  24px;

    --shadow-card:   0 2px 8px rgba(0,0,0,0.05), 0 0 0 1.5px #f0ede8;
    --shadow-hover:  0 10px 36px rgba(255,107,53,0.1);
    --shadow-search: 0 4px 24px rgba(0,0,0,0.08);

    --transition: 0.2s cubic-bezier(0.16, 1, 0.3, 1);

    --container-width: 1200px;
    --section-padding: 72px 0;
    --header-h: 64px;
}

/* -----------------------------------------
   2. СБРОС И БАЗА
----------------------------------------- */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
    font-family: 'Nunito', Arial, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-text);
    background-color: var(--color-bg);
    -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; }
img { display: block; max-width: 100%; }
ul { list-style: none; }

/* -----------------------------------------
   3. LAYOUT
----------------------------------------- */
.container {
    width: 90%;
    max-width: var(--container-width);
    margin: 0 auto;
}

main section { padding: var(--section-padding); }

.section-title {
    font-size: 32px;
    font-weight: 900;
    color: var(--color-dark);
    letter-spacing: -0.5px;
    margin-bottom: 8px;
}

.section-subtitle {
    font-size: 16px;
    color: var(--color-text-dim);
    font-weight: 600;
    margin-bottom: 36px;
    text-align: center;
}

.empty-message { color: var(--color-text-dim); }

/* -----------------------------------------
   4. КНОПКИ
----------------------------------------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 13px 24px;
    border-radius: var(--radius-md);
    font-family: 'Nunito', sans-serif;
    font-size: 15px;
    font-weight: 800;
    border: 2px solid transparent;
    cursor: pointer;
    transition: all var(--transition);
    white-space: nowrap;
}

.btn--primary {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
    box-shadow: 0 4px 16px rgba(255,107,53,0.3);
}
.btn--primary:hover {
    background: var(--color-primary-light);
    border-color: var(--color-primary-light);
    box-shadow: 0 6px 24px rgba(255,107,53,0.4);
    transform: translateY(-1px);
}
.btn--primary:active { transform: translateY(0); }

.btn--outline {
    background: transparent;
    color: var(--color-dark);
    border-color: var(--color-border-mid);
}
.btn--outline:hover {
    background: var(--color-dark);
    color: var(--color-white);
    border-color: var(--color-dark);
}

.btn--sm  { padding: 8px 16px; font-size: 13px; }
.btn--lg  { padding: 15px 32px; font-size: 16px; border-radius: var(--radius-lg); }

/* -----------------------------------------
   5. HEADER
----------------------------------------- */
header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--color-border);
    height: var(--header-h);
}

.header-inner {
    height: 100%;
    display: flex;
    align-items: center;
    gap: 16px;
    justify-content: space-between;
}

header .container {
    height: 100%;
}

/* Логотип */
.logo {
    font-size: 24px;
    font-weight: 900;
    color: var(--color-dark);
    letter-spacing: -0.5px;
    flex-shrink: 0;
    margin-right: 4px;
    text-decoration: none;
}
.logo span { color: var(--color-primary); }

/* Кнопка Каталог + мега-меню */
.catalog-btn-wrap { position: relative; flex-shrink: 0; }

.catalog-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--color-primary);
    color: var(--color-white);
    border: none;
    padding: 9px 18px;
    border-radius: var(--radius-md);
    font-family: 'Nunito', sans-serif;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    transition: all var(--transition);
    white-space: nowrap;
    box-shadow: 0 4px 14px rgba(255,107,53,0.35);
}
.catalog-btn:hover { background: var(--color-primary-light); box-shadow: 0 6px 20px rgba(255,107,53,0.45); }
.catalog-btn-wrap.is-open .catalog-btn { background: var(--color-primary-dark); box-shadow: none; }

.catalog-btn-icon {
    width: 15px; height: 15px;
    display: grid; grid-template-columns: 1fr 1fr; gap: 3px; flex-shrink: 0;
}
.catalog-btn-icon span { width: 5px; height: 5px; background: #fff; border-radius: 2px; display: block; }

.catalog-arrow { font-size: 10px; opacity: 0.8; transition: transform var(--transition); }
.catalog-btn-wrap.is-open .catalog-arrow { transform: rotate(180deg); }

/* Мега-меню */
.mega-menu {
    display: none;
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    width: 640px;
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-xl);
    box-shadow: 0 12px 48px rgba(0,0,0,0.12);
    overflow: hidden;
    z-index: 200;
}
.catalog-btn-wrap.is-open .mega-menu { display: flex; }

.mega-menu__sidebar {
    width: 195px;
    background: var(--color-bg-soft);
    border-right: 1px solid var(--color-border);
    padding: 12px 8px;
    flex-shrink: 0;
}

.mega-menu__cat {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: var(--radius-md);
    font-size: 13px;
    font-weight: 700;
    color: var(--color-dark);
    cursor: pointer;
    transition: all var(--transition);
    text-decoration: none;
}
.mega-menu__cat:hover,
.mega-menu__cat.active {
    background: var(--color-white);
    color: var(--color-primary);
    box-shadow: var(--shadow-card);
}
.mega-menu__cat-icon { font-size: 16px; flex-shrink: 0; width: 22px; text-align: center; }

.mega-menu__content {
    flex: 1;
    padding: 18px 20px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 18px;
    align-content: start;
}

.mega-menu__sub-bold {
    font-weight: 800;
    color: var(--color-dark);
    font-size: 13px;
    padding: 6px 0 3px;
    display: block;
}

.mega-menu__sub {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #666;
    padding: 4px 0;
    text-decoration: none;
    border-bottom: 1px solid var(--color-border);
    transition: color var(--transition);
}
.mega-menu__sub:hover { color: var(--color-primary); }

.mega-menu__footer {
    grid-column: span 2;
    padding-top: 12px;
    border-top: 1px solid var(--color-border);
    margin-top: 4px;
}

.mega-menu__all {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 800;
    color: var(--color-primary);
    text-decoration: none;
    transition: gap var(--transition);
}
.mega-menu__all:hover { gap: 10px; }

/* Nav по центру */
.nav {
    display: flex;
    gap: 4px;
    align-items: center;
    flex: 1;
    justify-content: center;
    position: static;
    transform: none;
}

.nav a {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text-muted);
    padding: 7px 14px;
    border-radius: var(--radius-sm);
    transition: all var(--transition);
}
.nav a:hover { color: var(--color-dark); background: var(--color-bg-soft); }

.header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}

/* CTA справа */
.header-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

.burger {
    display: none;
    padding: 8px 10px;
    border-radius: var(--radius-sm);
    border: 1.5px solid var(--color-border);
    background: transparent;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    color: var(--color-text);
}

/* -----------------------------------------
   6. HERO
----------------------------------------- */
.hero {
    background: linear-gradient(160deg, var(--color-bg-hero) 0%, var(--color-bg) 60%);
    padding: 68px 0 76px;
}

.hero__inner {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 48px;
    align-items: center;
}

.hero__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--color-primary-bg);
    border: 1px solid var(--color-primary-border);
    color: var(--color-primary-dark);
    font-size: 12px;
    font-weight: 800;
    padding: 5px 14px;
    border-radius: 100px;
    margin-bottom: 18px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.hero__title {
    font-size: 44px;
    font-weight: 900;
    line-height: 1.1;
    color: var(--color-dark);
    max-width: 600px;
    margin: 0 0 14px 0;
    letter-spacing: -1.5px;
}
.hero__title .accent { color: var(--color-primary); }

.hero__subtitle {
    font-size: 17px;
    color: var(--color-text-muted);
    max-width: 420px;
    margin: 0 0 28px 0;
    line-height: 1.65;
    font-weight: 500;
}

/* Search */
.search-form {
    display: flex;
    align-items: center;
    background: var(--color-white);
    border: 2px solid var(--color-border-mid);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--shadow-search);
    max-width: 520px;
    flex-wrap: nowrap;
}

.search-form__input,
.search-form__select {
    padding: 14px 16px;
    border: none;
    font-family: 'Nunito', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text);
    background: transparent;
    min-width: 0;
}

.search-form__input { flex: 2; }
.search-form__input::placeholder { color: #c0bdb8; font-weight: 500; }

.search-form__select {
    flex: 1;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    color: var(--color-text-muted);
    border-left: 1px solid var(--color-border);
}

.search-form__input:focus,
.search-form__select:focus { outline: none; }

.search-form__actions { padding: 5px; flex-shrink: 0; }
.search-form__actions .btn { padding: 11px 20px; border-radius: 10px; }

/* Quick tags */
.search-tags {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
    font-size: 12px;
    color: var(--color-text-dim);
    font-weight: 700;
}

.search-tags__label { font-size: 12px; color: var(--color-text-dim); font-weight: 700; }

.search-tag {
    background: var(--color-white);
    border: 1.5px solid var(--color-border-mid);
    color: var(--color-text-muted);
    font-size: 12px;
    font-weight: 700;
    padding: 4px 11px;
    border-radius: 100px;
    cursor: pointer;
    transition: all var(--transition);
    text-decoration: none;
    font-family: 'Nunito', sans-serif;
}
.search-tag:hover {
    border-color: var(--color-primary-border);
    color: var(--color-primary-dark);
    background: var(--color-primary-bg);
}

/* Статистика */
.hero__stats {
    display: flex;
    gap: 32px;
    justify-content: flex-start;
    margin-top: 32px;
    padding-top: 28px;
    border-top: 1px solid var(--color-border);
}

.hero__stat-value {
    font-size: 26px;
    font-weight: 900;
    color: var(--color-dark);
    letter-spacing: -1px;
    line-height: 1;
    margin-bottom: 3px;
}

.hero__stat-label {
    font-size: 12px;
    color: var(--color-text-dim);
    font-weight: 600;
}

/* Иллюстрация справа */
.hero__visual {
    position: relative;
    height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero__blob {
    position: absolute;
    width: 350px;
    height: 350px;
    background: radial-gradient(ellipse at 60% 40%, #fff3ee 0%, #ffeee4 50%, transparent 75%);
    border-radius: 60% 40% 55% 45% / 50% 60% 40% 50%;
}

.hero__cards {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-end;
}

.hero-pill {
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 11px;
    box-shadow: var(--shadow-card);
    min-width: 210px;
    animation: heroPillFloat 3s ease-in-out infinite;
}
.hero-pill:nth-child(1) { animation-delay: 0s; }
.hero-pill:nth-child(2) { animation-delay: 0.6s; margin-right: 20px; }
.hero-pill:nth-child(3) { animation-delay: 1.2s; margin-right: 4px; }
.hero-pill:nth-child(4) { animation-delay: 1.8s; margin-right: 28px; }

@keyframes heroPillFloat {
    0%, 100% { transform: translateY(0); }
    50%       { transform: translateY(-5px); }
}

.hero-pill__icon {
    width: 36px; height: 36px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; flex-shrink: 0;
    background: var(--color-primary-bg);
}

.hero-pill__title { font-size: 13px; font-weight: 800; color: var(--color-dark); margin-bottom: 2px; }
.hero-pill__sub   { font-size: 11px; font-weight: 600; color: var(--color-text-dim); }

.hero-pill__badge {
    margin-left: auto;
    font-size: 11px; font-weight: 800;
    padding: 3px 9px; border-radius: 100px;
    flex-shrink: 0; white-space: nowrap;
}
.hero-pill__badge--orange { background: var(--color-primary-bg); color: var(--color-primary-dark); }
.hero-pill__badge--green  { background: #f0fdf4; color: #16a34a; }
.hero-pill__badge--blue   { background: #eff6ff; color: #2563eb; }
.hero-pill__badge--purple { background: #f5f3ff; color: #7c3aed; }

/* -----------------------------------------
   7. CATEGORIES
----------------------------------------- */
.categories {
    background: var(--color-bg-soft);
    padding: var(--section-padding);
    text-align: center;
}

.categories-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
}

.category-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 26px 16px 22px;
    text-align: center;
    font-weight: 800;
    font-size: 14px;
    color: var(--color-dark);
    transition: all var(--transition);
    cursor: pointer;
    text-decoration: none;
}
.category-card__icon { font-size: 30px; line-height: 1; }
.category-card:hover {
    border-color: var(--color-primary);
    background: var(--color-primary-bg);
    color: var(--color-primary-dark);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(255,107,53,0.12);
}

/* -----------------------------------------
   8. ACTIVITIES
----------------------------------------- */
.activities {
    background: var(--color-bg);
    padding: var(--section-padding);
}

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

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

/* ── Карточка ── */
.activity-card {
    display: flex;
    flex-direction: column;
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
    transition: all var(--transition);
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    position: relative;
}
.activity-card:hover {
    border-color: var(--color-primary-border);
    transform: translateY(-4px);
    box-shadow: var(--shadow-hover);
}

/* ── Картинка ── */
.activity-card__image {
    width: 100%;
    height: 196px;
    overflow: hidden;
    background: var(--color-primary-bg);
    flex-shrink: 0;
    position: relative;
}
.activity-card__image img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform 0.45s ease;
}
.activity-card:hover .activity-card__image img { transform: scale(1.05); }

.activity-card__image-placeholder {
    width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    color: var(--color-text-dim); font-size: 13px;
}

/* Категория-чип поверх фото */
.activity-card__chip {
    position: absolute;
    top: 10px; left: 10px;
    background: rgba(255,255,255,0.93);
    backdrop-filter: blur(4px);
    color: var(--color-primary-dark);
    font-size: 11px; font-weight: 800;
    text-transform: uppercase; letter-spacing: 0.3px;
    padding: 4px 10px;
    border-radius: 100px;
    border: 1px solid var(--color-primary-border);
}

/* Бейдж «Популярно» / «Новинка» / «Топ рейтинг» */
.activity-card__badge {
    position: absolute;
    top: 10px; right: 10px;
    font-size: 11px; font-weight: 800;
    padding: 4px 10px;
    border-radius: 100px;
    white-space: nowrap;
    letter-spacing: 0.2px;
}
.activity-card__badge--popular {
    background: #ff6b35;
    color: #fff;
}
.activity-card__badge--new {
    background: #10b981;
    color: #fff;
}
.activity-card__badge--top {
    background: #f59e0b;
    color: #fff;
}

/* Рейтинг поверх фото */
.activity-card__rating-badge {
    position: absolute;
    bottom: 10px; right: 10px;
    background: rgba(255,255,255,0.93);
    backdrop-filter: blur(4px);
    font-size: 12px; font-weight: 800;
    color: #f59e0b;
    padding: 3px 9px;
    width: fit-content;
    border-radius: 100px;
    border: 1px solid rgba(245,158,11,0.2);
    display: flex; align-items: center; gap: 3px;
}

/* ── Тело карточки ── */
.activity-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 16px 18px 0;
}

.activity-card__title {
    font-size: 16px; font-weight: 800; line-height: 1.3;
    color: var(--color-dark);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 4px;
    min-height: 42px; /* высота для 2 строк — выравниваем карточки */
}

.activity-card__org {
    font-size: 12px; color: var(--color-text-dim);
    font-weight: 600; margin-bottom: 10px;
}

{% with reviews=activity.reviews.all %}
    {% if reviews %}
        <span class="activity-card__rating-badge">★ 5.0</span>
    {% endif %}
{% endwith %}

/* Мета — возраст + район */
.activity-card__meta {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 0;
    margin-top: auto;
    padding-top: 8px;
}
.activity-card__meta li {
    display: flex; align-items: center; gap: 4px;
    font-size: 12px; color: var(--color-text-muted); font-weight: 600;
}
.activity-card__meta .meta-age::before    { content: '👤'; font-size: 11px; }
.activity-card__meta .meta-district::before { content: '📍'; font-size: 11px; }

/* ── Футер карточки — цена + кнопка ── */
.activity-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px 16px;
    margin-top: 12px;
    border-top: 1px solid var(--color-border);
    gap: 8px;
}

.activity-card__price-block {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
    min-width: 0;
}

.activity-card__price-value {
    font-size: 16px; font-weight: 900;
    color: var(--color-primary);
    white-space: nowrap;
}
.activity-card__price-value--muted {
    font-size: 13px; font-weight: 600;
    color: var(--color-text-dim);
}
.activity-card__price-label {
    font-size: 10px; color: var(--color-text-dim); font-weight: 600;
}

.activity-card__btn {
    background: var(--color-primary);
    color: var(--color-white);
    border: none;
    padding: 9px 16px;
    border-radius: var(--radius-md);
    font-family: 'Nunito', sans-serif;
    font-size: 13px; font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    text-decoration: none;
    display: inline-block;
    box-shadow: 0 3px 10px rgba(255,107,53,0.25);
    transition: all var(--transition);
    pointer-events: none; /* клик идёт по всей карточке */
}
.activity-card:hover .activity-card__btn {
    background: var(--color-primary-light);
    box-shadow: 0 4px 14px rgba(255,107,53,0.35);
}

/* -----------------------------------------
   9. SMART AGENT / CTA
----------------------------------------- */
.smart-agent { background: var(--color-bg-soft); padding: var(--section-padding); }

.smart-agent .container {
    background: linear-gradient(135deg, var(--color-primary-bg) 0%, #fff9f0 100%);
    border: 2px solid var(--color-primary-border);
    border-radius: var(--radius-xl);
    padding: 56px 48px;
    text-align: center;
    box-shadow: var(--shadow-card);
}

.smart-agent .section-title { color: var(--color-dark); }
.smart-agent p { color: var(--color-text-muted); margin: 12px auto 28px; font-size: 17px; max-width: 480px; line-height: 1.65; font-weight: 500; }

/* -----------------------------------------
   10. OWNERS CTA
----------------------------------------- */
.owners-cta { background: var(--color-bg); padding: var(--section-padding); }

.owners-cta .container {
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-xl);
    padding: 56px 48px;
    text-align: center;
    box-shadow: var(--shadow-card);
}

.owners-cta p { color: var(--color-text-muted); margin: 12px auto 28px; font-size: 17px; max-width: 460px; line-height: 1.65; font-weight: 500; }

/* -----------------------------------------
   11. FOOTER
----------------------------------------- */
footer { background: var(--color-dark); }

.footer-inner {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    gap: 48px;
    padding: 56px 0 48px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
}

.footer-brand { max-width: 260px; }

.footer-logo-text {
    font-size: 24px; font-weight: 900; color: var(--color-white);
    display: block; margin-bottom: 12px; letter-spacing: -0.5px;
}
.footer-logo-text span { color: var(--color-primary-light); }

.footer-tagline { font-size: 14px; color: #888; line-height: 1.65; font-weight: 500; margin-bottom: 24px; }

.footer-social { display: flex; gap: 8px; margin-bottom: 24px; }

.footer-social-btn {
    width: 38px; height: 38px; border-radius: 10px;
    background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.1);
    display: flex; align-items: center; justify-content: center;
    font-size: 17px; cursor: pointer; transition: all var(--transition); text-decoration: none;
}
.footer-social-btn:hover { background: var(--color-primary); border-color: var(--color-primary); }

.footer-tg-btn {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(0,136,204,0.15); border: 1px solid rgba(0,136,204,0.3);
    color: #5bc8f5; font-size: 13px; font-weight: 800;
    padding: 9px 16px; border-radius: 10px; text-decoration: none;
    transition: all var(--transition); font-family: 'Nunito', sans-serif;
}
.footer-tg-btn:hover { background: #0088cc; border-color: #0088cc; color: var(--color-white); }

.footer-col h4 { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.8px; color: var(--color-white); margin-bottom: 18px; }
.footer-col a { display: block; font-size: 14px; color: #888; font-weight: 500; margin-bottom: 11px; transition: color var(--transition); }
.footer-col a:hover { color: var(--color-white); }

.footer-col-badge {
    display: inline-block; background: rgba(255,107,53,0.15);
    border: 1px solid rgba(255,107,53,0.25); color: var(--color-primary-light);
    font-size: 11px; font-weight: 800; padding: 3px 10px;
    border-radius: 100px; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.3px;
}

.footer-bottom {
    display: flex; justify-content: space-between; align-items: center;
    padding: 20px 0; font-size: 13px; color: #555; font-weight: 600;
    gap: 16px; flex-wrap: wrap;
}

.footer-bottom-links { display: flex; gap: 20px; }
.footer-bottom-links a { color: #666; font-size: 13px; font-weight: 600; transition: color var(--transition); }
.footer-bottom-links a:hover { color: var(--color-white); }

/* -----------------------------------------
   12. СТРАНИЦА КРУЖКА
----------------------------------------- */
.breadcrumb { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--color-text-dim); margin-bottom: 28px; flex-wrap: wrap; font-weight: 600; }
.breadcrumb a { color: var(--color-primary); font-weight: 700; transition: opacity var(--transition); }
.breadcrumb a:hover { opacity: 0.75; }

.detail__layout { display: grid; grid-template-columns: 380px 1fr; gap: 44px; align-items: start; }

.sidebar-gallery { margin-bottom: 20px; }
.sidebar-gallery__main { width: 100%; aspect-ratio: 4 / 3; border-radius: var(--radius-xl); overflow: hidden; background: var(--color-bg-soft); margin-bottom: 10px; cursor: zoom-in; }
.sidebar-gallery__main img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s ease; }
.sidebar-gallery__main img:hover { transform: scale(1.04); }
.sidebar-gallery__thumbs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.sidebar-gallery__thumb { width: 72px; height: 72px; flex-shrink: 0; border-radius: var(--radius-md); overflow: hidden; cursor: pointer; border: 2.5px solid transparent; transition: border-color var(--transition); }
.sidebar-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.sidebar-gallery__thumb:hover, .sidebar-gallery__thumb.active { border-color: var(--color-primary); }

.lightbox { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.88); z-index: 1000; align-items: center; justify-content: center; }
.lightbox.is-open { display: flex; }
.lightbox__img { max-width: 90vw; max-height: 90vh; border-radius: var(--radius-lg); object-fit: contain; }
.lightbox__close { position: fixed; top: 24px; right: 32px; font-size: 36px; color: #fff; cursor: pointer; opacity: 0.7; transition: opacity var(--transition); }
.lightbox__prev, .lightbox__next { position: fixed; top: 50%; transform: translateY(-50%); font-size: 56px; color: #fff; cursor: pointer; padding: 10px 20px; opacity: 0.7; transition: opacity var(--transition); user-select: none; }
.lightbox__prev:hover, .lightbox__next:hover, .lightbox__close:hover { opacity: 1; }
.lightbox__prev { left: 16px; }
.lightbox__next { right: 16px; }
.lightbox__counter { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%); color: rgba(255,255,255,0.6); font-size: 14px; }

.detail__contacts { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-xl); padding: 22px 24px; margin-bottom: 16px; }
.detail__contacts-title { font-size: 15px; font-weight: 800; margin-bottom: 16px; color: var(--color-dark); }
.detail__contact-item { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; color: #444; padding: 10px 0; border-bottom: 1px solid var(--color-border); font-weight: 600; transition: color var(--transition); }
.detail__contact-item:last-child { border-bottom: none; }
a.detail__contact-item:hover { color: var(--color-primary); }
.detail__contact-icon { font-size: 16px; flex-shrink: 0; }

.detail__rating { display: flex; align-items: center; gap: 8px; margin-bottom: 20px; }
.detail__stars { display: flex; gap: 3px; }
.detail__star { font-size: 20px; color: #e5e7eb; }
.detail__star--filled { color: #f59e0b; }
.detail__rating-value { font-size: 16px; font-weight: 900; color: var(--color-dark); }
.detail__rating-count { font-size: 13px; color: var(--color-text-dim); font-weight: 600; }

.detail__socials { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-xl); padding: 20px 24px; margin-top: 16px; }
.detail__socials-links { display: flex; flex-direction: column; gap: 8px; }
.detail__social-btn { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-radius: var(--radius-md); font-size: 14px; font-weight: 800; transition: opacity var(--transition), transform var(--transition); }
.detail__social-btn:hover { opacity: 0.85; transform: translateX(3px); }
.detail__social-btn::before { content: ''; width: 32px; height: 32px; border-radius: 8px; flex-shrink: 0; background-size: 18px; background-repeat: no-repeat; background-position: center; }
.detail__social-btn--telegram { background: #e8f4fd; color: #0088cc; }
.detail__social-btn--telegram::before { background-color: #0088cc; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12 12-5.373 12-12S18.627 0 12 0zm5.562 8.248-1.97 9.289c-.145.658-.537.818-1.084.508l-3-2.21-1.447 1.394c-.16.16-.295.295-.605.295l.213-3.053 5.56-5.023c.242-.213-.054-.333-.373-.12L8.32 14.617l-2.96-.924c-.643-.204-.657-.643.136-.953l11.57-4.461c.537-.194 1.006.131.496.969z'/%3E%3C/svg%3E"); }
.detail__social-btn--instagram { background: #fce8f3; color: #c13584; }
.detail__social-btn--instagram::before { background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z'/%3E%3C/svg%3E"); }
.detail__social-btn--website { background: #f0fdf4; color: #16a34a; }
.detail__social-btn--website::before { background-color: #16a34a; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M12 0C5.373 0 0 5.373 0 12s5.373 12 12 12 12-5.373 12-12S18.627 0 12 0zm-1 17.93A8.009 8.009 0 0 1 4.07 12H7a14.77 14.77 0 0 0 4 5.93zM7 10H4.07A8.009 8.009 0 0 1 11 4.07V7a14.77 14.77 0 0 0-4 3zm6 7.93V15a14.77 14.77 0 0 0 4-3h2.93A8.009 8.009 0 0 1 13 17.93zM15 10a14.77 14.77 0 0 0-4-3V4.07A8.009 8.009 0 0 1 19.93 10H15z'/%3E%3C/svg%3E"); }

.detail__category-badge { display: inline-block; background: var(--color-primary-bg); color: var(--color-primary-dark); font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.5px; padding: 5px 14px; border-radius: 100px; margin-bottom: 14px; border: 1px solid var(--color-primary-border); }
.detail__title { font-size: 36px; font-weight: 900; line-height: 1.15; color: var(--color-dark); margin-bottom: 14px; letter-spacing: -0.5px; }
.detail__meta { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 36px; }
.detail__meta-item { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-lg); padding: 14px 20px; min-width: 130px; transition: border-color var(--transition); }
.detail__meta-item:hover { border-color: var(--color-primary); }
.detail__meta-label { display: block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.7px; color: var(--color-text-dim); margin-bottom: 4px; }
.detail__meta-value { display: block; font-size: 20px; font-weight: 900; color: var(--color-dark); }
.detail__meta-value--price { color: var(--color-primary); }
.detail__section-title { font-size: 19px; font-weight: 900; color: var(--color-dark); margin-bottom: 14px; }
.detail__description { margin-bottom: 40px; line-height: 1.75; color: #444; font-size: 15.5px; font-weight: 500; }

.detail__schedule { margin-bottom: 40px; }
.schedule-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.schedule-card { display: flex; align-items: center; gap: 16px; background: var(--color-white); border: 2px solid var(--color-border); border-left: 4px solid var(--color-primary); border-radius: var(--radius-md); padding: 14px 18px; transition: box-shadow var(--transition); }
.schedule-card:hover { box-shadow: 0 4px 16px rgba(255,107,53,0.1); }
.schedule-card__time { font-size: 15px; font-weight: 900; color: var(--color-dark); white-space: nowrap; min-width: 120px; }
.schedule-card__days { display: flex; flex-wrap: wrap; gap: 6px; }
.schedule-card__day { display: inline-block; padding: 4px 12px; background: var(--color-primary-bg); color: var(--color-primary-dark); border-radius: 100px; font-size: 13px; font-weight: 800; }

.detail__prices { margin-bottom: 40px; }
.price-groups-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.price-group { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-lg); padding: 18px 22px; }
.price-group__title { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.7px; color: var(--color-text-dim); border: 1.5px solid var(--color-border); display: inline-block; padding: 4px 12px; border-radius: var(--radius-sm); margin-bottom: 10px; }
.price-item { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--color-border); }
.price-item:last-child { border-bottom: none; }
.price-item__name { font-size: 15px; color: #333; font-weight: 600; }
.price-item__detail { font-size: 13px; color: var(--color-text-dim); margin-left: 6px; }
.price-item__price { font-size: 16px; font-weight: 900; color: var(--color-dark); }

.detail__gallery { margin-bottom: 40px; }
.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.gallery-grid .gallery-item:first-child { grid-column: span 2; grid-row: span 2; aspect-ratio: unset; }
.gallery-item { aspect-ratio: 1; border-radius: var(--radius-md); overflow: hidden; background: var(--color-bg-soft); cursor: pointer; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.35s ease; }
.gallery-item:hover img { transform: scale(1.06); }

.detail__map { margin-bottom: 40px; }
.map-wrapper { border-radius: var(--radius-xl); overflow: hidden; border: 2px solid var(--color-border); }
.map-wrapper iframe { display: block; }

.detail__reviews { margin-bottom: 40px; }
.reviews-list { display: flex; flex-direction: column; gap: 14px; }
.review-card { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-xl); padding: 22px 24px; transition: box-shadow var(--transition); }
.review-card:hover { box-shadow: 0 4px 20px rgba(0,0,0,0.06); }
.review-card__header { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.review-card__avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--color-primary-bg); color: var(--color-primary-dark); font-size: 18px; font-weight: 900; display: flex; align-items: center; justify-content: center; flex-shrink: 0; text-transform: uppercase; }
.review-card__name { font-weight: 800; font-size: 15px; color: var(--color-dark); }
.review-card__date { font-size: 13px; color: var(--color-text-dim); font-weight: 600; }
.review-card__stars { margin-left: auto; display: flex; gap: 2px; }
.review-card__text { font-size: 15px; line-height: 1.65; color: #555; font-weight: 500; }

.detail__benefits { margin-bottom: 40px; }
.benefits-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.benefits-item { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; color: #333; font-weight: 600; padding: 14px 18px; background: #f0fdf4; border: 2px solid #d1fae5; border-radius: var(--radius-md); border-left: 3px solid #10b981; }
.benefits-icon { color: #10b981; font-weight: 900; font-size: 16px; flex-shrink: 0; }
.btn--trial { margin-bottom: 36px; font-size: 16px; padding: 15px 30px; }
.detail__actions { display: flex; margin-bottom: 32px; }
.detail__action-btns { display: flex; gap: 12px; flex-wrap: wrap; }
.detail__price-hidden { background: var(--color-bg-soft); border: 2px solid var(--color-border); border-radius: var(--radius-md); padding: 16px 20px; font-size: 15px; color: var(--color-text-dim); margin-bottom: 40px; font-weight: 600; }
.detail__sidebar { position: static; }
a.detail__rating:hover { text-decoration: underline; text-decoration-color: var(--color-text-dim); }

.detail__org-card { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-xl); padding: 22px 24px; margin-top: 16px; }
.detail__org-contacts { margin-top: 12px; }
.detail__org-logo { width: 80px; height: 80px; object-fit: contain; border-radius: var(--radius-md); margin-bottom: 12px; }
.detail__org-name { font-weight: 900; font-size: 16px; color: var(--color-dark); margin-bottom: 6px; }
.detail__org-desc { font-size: 14px; color: var(--color-text-dim); margin-bottom: 10px; line-height: 1.55; font-weight: 500; }
.detail__org-activities { margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--color-border); }
.detail__org-other-title { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.7px; color: var(--color-text-dim); margin-bottom: 8px; }
.detail__org-activity-link { display: block; font-size: 14px; font-weight: 700; color: var(--color-primary); padding: 4px 0; transition: opacity var(--transition); }
.detail__org-activity-link:hover { opacity: 0.75; }
.detail__org-header { display: inline-block; font-size: 15px; font-weight: 800; color: var(--color-primary); margin-bottom: 8px; transition: opacity var(--transition); }
.detail__org-header:hover { opacity: 0.75; }
.detail__category-badge { margin-top: 8px; margin-bottom: 24px; }

/* -----------------------------------------
   13. КАТАЛОГ
----------------------------------------- */
.catalog { background: var(--color-bg-soft); padding: var(--section-padding); }
.catalog__header { margin-bottom: 28px; }
.catalog__title { font-size: 32px; font-weight: 900; color: var(--color-dark); letter-spacing: -0.5px; }
.catalog__layout { display: grid; grid-template-columns: 260px 1fr; gap: 32px; align-items: start; }
.catalog__filters { background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-xl); padding: 24px; position: sticky; top: calc(var(--header-h) + 16px); }
.filter-block { margin-bottom: 22px; padding-bottom: 22px; border-bottom: 1px solid var(--color-border); }
.filter-block:last-of-type { border-bottom: none; margin-bottom: 18px; }
.filter-block__title { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.8px; color: var(--color-text-dim); margin-bottom: 10px; }
.filter-input, .filter-select { width: 100%; padding: 11px 14px; border: 2px solid var(--color-border); border-radius: var(--radius-md); font-family: 'Nunito', sans-serif; font-size: 14px; font-weight: 600; color: var(--color-dark); background: var(--color-white); transition: border-color var(--transition); }
.filter-input:focus, .filter-select:focus { outline: none; border-color: var(--color-primary); }
.filter-dropdown { position: relative; }
.filter-dropdown__btn { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; border: 2px solid var(--color-border); border-radius: var(--radius-md); background: var(--color-white); font-family: 'Nunito', sans-serif; font-size: 14px; font-weight: 600; color: var(--color-dark); cursor: pointer; text-align: left; transition: border-color var(--transition); }
.filter-dropdown__btn:hover { border-color: var(--color-primary); }
.filter-dropdown__arrow { font-size: 11px; color: var(--color-text-dim); transition: transform var(--transition); }
.filter-dropdown.is-open .filter-dropdown__arrow { transform: rotate(180deg); }
.filter-dropdown__menu { display: none; position: absolute; top: calc(100% + 6px); left: 0; right: 0; background: var(--color-white); border: 2px solid var(--color-border); border-radius: var(--radius-md); padding: 8px; z-index: 50; box-shadow: 0 8px 32px rgba(0,0,0,0.1); max-height: 220px; overflow-y: auto; }
.filter-dropdown.is-open .filter-dropdown__menu { display: block; }
.filter-checkbox { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: var(--radius-sm); cursor: pointer; font-size: 14px; font-weight: 600; color: var(--color-dark); transition: background var(--transition); }
.filter-checkbox:hover { background: var(--color-primary-bg); }
.filter-checkbox input[type="checkbox"] { accent-color: var(--color-primary); width: 15px; height: 15px; flex-shrink: 0; }
.filter-submit { width: 100%; text-align: center; margin-bottom: 10px; }
.filter-reset { display: block; text-align: center; font-size: 13px; font-weight: 700; color: var(--color-text-dim); transition: color var(--transition); }
.filter-reset:hover { color: var(--color-primary); }
.catalog__search { margin-bottom: 20px; }
.catalog__search-input { width: 50%; padding: 12px 18px; border: 2px solid var(--color-border); border-radius: var(--radius-md); font-family: 'Nunito', sans-serif; font-size: 15px; font-weight: 600; color: var(--color-dark); background: var(--color-white); transition: border-color var(--transition); margin-bottom: 10px; display: block; }
.catalog__search-input:focus { outline: none; border-color: var(--color-primary); }
.catalog__count { font-size: 14px; color: var(--color-text-dim); font-weight: 700; }
.catalog__empty { text-align: center; padding: 72px 20px; color: var(--color-text-dim); }
.catalog__empty p { font-size: 18px; margin-bottom: 20px; font-weight: 600; }

/* -----------------------------------------
   14. АДАПТИВНОСТЬ
----------------------------------------- */
@media (max-width: 1024px) {
    :root { --section-padding: 60px 0; }
    .hero__inner { grid-template-columns: 1fr; }
    .hero__visual { display: none; }
    .mega-menu { width: 480px; }
    .categories-grid { grid-template-columns: repeat(3, 1fr); }
    .activities-grid { grid-template-columns: repeat(2, 1fr); }
    .footer-inner { grid-template-columns: 1fr 1fr; gap: 32px; }
    .hero__title { font-size: 38px; }
}

@media (max-width: 900px) {
    .detail__layout { grid-template-columns: 1fr; }
    .detail__title { font-size: 28px; }
    .catalog__layout { grid-template-columns: 1fr; }
    .catalog__filters { position: static; }
    .schedule-cards { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    :root { --section-padding: 48px 0; }
    .header-inner { flex-wrap: wrap; min-height: 60px; }
    .nav { display: none; flex-direction: column; align-items: flex-start; gap: 4px; width: 100%; padding: 10px 0; }
    .nav.is-open { display: flex; }
    .burger { display: inline-block; }
    .mega-menu { width: calc(100vw - 32px); }
    .mega-menu__sidebar { display: none; }
    .mega-menu__content { grid-template-columns: 1fr; }
    .hero { padding: 48px 0 56px; }
    .hero__title { font-size: 32px; letter-spacing: -0.5px; }
    .hero__stats { gap: 24px; flex-wrap: wrap; }
    .hero__stat-value { font-size: 22px; }
    .search-form { flex-wrap: wrap; max-width: 100%; }
    .search-form__input { order: 1; border-left: none; flex-basis: 100%; }
    .search-form__select { order: 2; flex-basis: 50%; border-left: none; border-top: 1px solid var(--color-border); }
    .search-form__actions { order: 3; width: 100%; padding: 5px; }
    .search-form__actions .btn { width: 100%; }
    .categories-grid { grid-template-columns: repeat(2, 1fr); }
    .activities-grid { grid-template-columns: 1fr; }
    .footer-inner { grid-template-columns: 1fr 1fr; gap: 28px; }
    .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
    .footer-bottom-links { justify-content: center; }
    .section-title { font-size: 26px; }
    .smart-agent .container, .owners-cta .container { padding: 36px 24px; }
    .catalog__search-input { width: 100%; }
    .benefits-list { grid-template-columns: 1fr; }
    .price-groups-grid { grid-template-columns: 1fr; }
    .gallery-grid { grid-template-columns: repeat(2, 1fr); }
    .gallery-grid .gallery-item:first-child { grid-column: span 2; grid-row: span 1; }
    .detail__meta-item { flex: 1; min-width: 100px; }
}

@media (max-width: 480px) {
    .hero__title { font-size: 28px; }
    .categories-grid { grid-template-columns: 1fr 1fr; }
    .footer-inner { grid-template-columns: 1fr; }
    .schedule-card { flex-direction: column; align-items: flex-start; gap: 10px; }
}

/* -----------------------------------------
   SECTION EYEBROW + SUBTITLE LEFT
----------------------------------------- */
.section-eyebrow {
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--color-primary);
    margin-bottom: 6px;
}

.section-subtitle-left {
    font-size: 15px;
    color: var(--color-text-dim);
    font-weight: 600;
    margin-top: 4px;
}

/* -----------------------------------------
   ОРГАНИЗАЦИИ
----------------------------------------- */
.organizations {
    background: var(--color-bg-soft);
    padding: var(--section-padding);
}

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

.org-card {
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 22px 16px 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: all var(--transition);
    text-align: center;
    text-decoration: none;
    color: inherit;
}

.org-card:hover {
    border-color: var(--color-primary-border);
    transform: translateY(-2px);
    box-shadow: var(--shadow-hover);
}

/* Логотип — квадрат */
.org-logo {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    overflow: hidden;
    flex-shrink: 0;
    border: 1.5px solid var(--color-border);
}

.org-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Заглушка — первая буква */
.org-logo-placeholder {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 26px;
    font-weight: 900;
    flex-shrink: 0;
    border: 1.5px solid var(--color-primary-border);
    color: var(--color-primary-dark);
    background: var(--color-primary-bg);
}

.org-name {
    font-size: 14px;
    font-weight: 800;
    color: var(--color-dark);
    line-height: 1.3;
}

.org-tag {
    font-size: 11px;
    font-weight: 700;
    color: var(--color-text-dim);
    background: var(--color-bg-soft);
    padding: 3px 10px;
    border-radius: 100px;
    border: 1px solid var(--color-border);
}

.org-stats {
    font-size: 12px;
    font-weight: 700;
    color: var(--color-text-dim);
}

.org-activities-count { color: var(--color-text-dim); }

/* Бегущая строка логотипов */
.logos-strip {
    overflow: hidden;
    position: relative;
}

.logos-strip::before,
.logos-strip::after {
    content: '';
    position: absolute;
    top: 0; bottom: 0;
    width: 80px;
    z-index: 2;
    pointer-events: none;
}

.logos-strip::before { left: 0;  background: linear-gradient(to right, var(--color-bg-soft), transparent); }
.logos-strip::after  { right: 0; background: linear-gradient(to left,  var(--color-bg-soft), transparent); }

.logos-track {
    display: flex;
    gap: 10px;
    animation: marqueeScroll 200s linear infinite;
    width: max-content;
}

.logos-track:hover { animation-play-state: paused; }

@keyframes marqueeScroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

.logo-chip {
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-radius: 10px;
    padding: 8px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 800;
    color: var(--color-dark);
    flex-shrink: 0;
    cursor: pointer;
    transition: all var(--transition);
}

.logo-chip:hover {
    border-color: var(--color-primary-border);
    color: var(--color-primary-dark);
}

.chip-logo {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    overflow: hidden;
    border: 1px solid var(--color-border);
    flex-shrink: 0;
}

.chip-logo img { width: 100%; height: 100%; object-fit: cover; }

.chip-logo-placeholder {
    width: 28px;
    height: 28px;
    border-radius: 7px;
    background: var(--color-primary-bg);
    border: 1px solid var(--color-primary-border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 900;
    color: var(--color-primary-dark);
    flex-shrink: 0;
}

/* -----------------------------------------
   ACTIVITY CARD — обновлённый дизайн
----------------------------------------- */

/* Рейтинг поверх картинки */
.activity-card__rating-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(4px);
    font-size: 11px;
    font-weight: 800;
    color: #f59e0b;
    padding: 3px 9px;
    border-radius: 100px;
    border: 1px solid rgba(245,158,11,0.2);
}

/* Мета в одну строку */
.activity-card__meta-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: auto;
    padding-top: 10px;
}

.activity-card__meta-item {
    font-size: 12px;
    color: var(--color-text-muted);
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* Footer карточки — цена + кнопка */
.activity-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px 16px;
    border-top: 1px solid var(--color-border);
    gap: 8px;
    margin-top: 0;
}

.activity-card__price-block {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.activity-card__price-value {
    font-size: 15px;
    font-weight: 900;
    color: var(--color-primary);
    white-space: nowrap;
    line-height: 1.2;
}

.activity-card__price-value--muted {
    font-size: 13px;
    color: var(--color-text-dim);
    font-weight: 600;
}

.activity-card__price-label {
    font-size: 10px;
    color: var(--color-text-dim);
    font-weight: 600;
}

.activity-card__btn {
    background: var(--color-primary);
    color: var(--color-white);
    border: none;
    padding: 9px 18px;
    border-radius: var(--radius-md);
    font-family: 'Nunito', sans-serif;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    text-decoration: none;
    display: inline-block;
    box-shadow: 0 3px 10px rgba(255,107,53,0.3);
    transition: all var(--transition);
}

.activity-card__btn:hover {
    background: var(--color-primary-light);
    transform: translateY(-1px);
}

/* Убираем старые стили которые конфликтуют */
.activity-card__body {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 16px 20px 14px;
}

/* -----------------------------------------
   АДАПТИВНОСТЬ
----------------------------------------- */
@media (max-width: 1024px) {
    .orgs-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 768px) {
    .orgs-grid { grid-template-columns: repeat(2, 1fr); }
    .activity-card__footer { padding: 10px 16px 14px; }
    .activity-card__price-value { font-size: 13px; }
}

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

/* Add to end of style.css */

/* -----------------------------------------
   ЛОКАЦИИ / ФИЛИАЛЫ
----------------------------------------- */
.detail__locations { margin-bottom: 40px; }

.locations-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.location-card {
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-left: 4px solid var(--color-primary);
    border-radius: var(--radius-lg);
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: box-shadow var(--transition);
}

.location-card:hover {
    box-shadow: 0 4px 16px rgba(255,107,53,0.1);
}

.location-card__label {
    font-size: 14px;
    font-weight: 800;
    color: var(--color-dark);
}

.location-card__district {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-primary-dark);
    background: var(--color-primary-bg);
    padding: 2px 10px;
    border-radius: 100px;
    display: inline-block;
    width: fit-content;
}

.location-card__address {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-muted);
}

.location-card__phone,
.location-card__map {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-primary);
    text-decoration: none;
    transition: opacity var(--transition);
}

.location-card__phone:hover,
.location-card__map:hover { opacity: 0.75; }

@media (max-width: 600px) {
    .locations-list { grid-template-columns: 1fr; }
}

.detail__locations { margin-bottom: 40px; }

.locations-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
}

.location-card {
    background: var(--color-white);
    border: 2px solid var(--color-border);
    border-left: 4px solid var(--color-primary);
    border-radius: var(--radius-lg);
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: box-shadow var(--transition);
}

.location-card:hover {
    box-shadow: 0 4px 16px rgba(255,107,53,0.1);
}

.location-card__label {
    font-size: 14px;
    font-weight: 800;
    color: var(--color-dark);
}

.location-card__district {
    font-size: 12px;
    font-weight: 700;
    color: var(--color-primary-dark);
    background: var(--color-primary-bg);
    padding: 2px 10px;
    border-radius: 100px;
    display: inline-block;
    width: fit-content;
}

.location-card__address {
    font-size: 13px;
    font-weight: 600;
    color: var(--color-text-muted);
}

.location-card__phone,
.location-card__map {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-primary);
    text-decoration: none;
    transition: opacity var(--transition);
}

.location-card__phone:hover,
.location-card__map:hover { opacity: 0.75; }

@media (max-width: 600px) {
    .locations-list { grid-template-columns: 1fr; }
}

.beta-banner {
    background-color: #f57c00;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    padding: 6px 0;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}

.beta-track {
    display: inline-block;
    animation: beta-scroll 20s linear infinite;
}

.beta-track span {
    display: inline-block;
}

@keyframes beta-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}