/* ====================================================================== */
/* brand-v2.css — ЕДИНАЯ ДИЗАЙН-СИСТЕМА Nativa (v2).                       */
/* Источник истины: BRAND.md (+ узаконенное исключение --accent-ink).      */
/* Подключение: ПОСЛЕ main-style.css, ДО постраничного CSS,                */
/* ТОЛЬКО на страницах -v2 (оригиналы не трогаем — они эталон сравнения).  */
/*                                                                         */
/* Слои: A — токены + алиас-мост legacy→бренд;                             */
/*       B — компоненты nv-* + канон .nativa-badge + глобальные фиксы;     */
/*       C — шапка fixed + auto-hide (JS: assets/js/brand-v2.js).          */
/* ====================================================================== */

/* ====================================================================== */
/* СЛОЙ A. ТОКЕНЫ                                                          */
/* ====================================================================== */
:root{
    /* --- палитра BRAND.md (точные значения брендбука) ----------------- */
    --celadon:      #B6FECC;
    --malachite:    #00DE71;
    --brunswick:    #01453E;
    --dark-green:   #012824;
    --blue-crayola: #5C82FF;
    --periwinkle:   #C6D3FF;
    --savoy-blue:   #3861E0;
    --jonquil:      #F9C801;
    --harvest-gold: #E3A704;
    --poppy:        #E03C48;
    --fire-brick:   #BD1E2C;

    /* --- семантика ------------------------------------------------------
       --accent      : заливки, активные состояния, primary-кнопки.
       --accent-ink  : «глубокий малахит» #00B85F — ЕДИНСТВЕННОЕ узаконенное
                       исключение (BRAND.md): зелёный ТЕКСТ/иконки/ссылки на
                       светлом и hover-состояния (Malachite на белом ~1.9:1). */
    --accent:        var(--malachite);
    --accent-ink:    #00B85F;
    --accent-hover:  var(--accent-ink);      /* совместимость со старым именем */
    --accent-strong: var(--brunswick);

    --text:          var(--dark-green);
    --text-soft:     rgba(1,40,36,.72);
    --text-faint:    rgba(1,40,36,.55);
    --text-on-dark:  var(--celadon);

    --bg-page:       #f2fbf5;                /* светлый мятный фон страниц */
    --bg-dark:       var(--dark-green);
    --bg-dark-2:     var(--brunswick);
    --bg-soft:       rgba(182,254,204,.16);
    --bg-tint:       rgba(182,254,204,.34);

    --line:          rgba(1,40,36,.10);
    --line-strong:   rgba(1,40,36,.16);

    /* ошибки форм — ОДИН тон вместо трёх исторических */
    --error:         var(--poppy);           /* #E03C48 — бордеры/иконки */
    --error-soft:    #F8D8DB;                /* текст ошибки на тёмном (poppy-тинт) */

    /* --- радиусы --------------------------------------------------------- */
    --r-s:    10px;                          /* мелкие элементы, инпуты */
    --r-m:    14px;                          /* внутренние карточки */
    --r-l:    18px;                          /* панели */
    --r-xl:   22px;                          /* карточки и диалоги — канон */
    --r-pill: 999px;

    /* --- тени (зелёные, с отрицательным spread) --------------------------- */
    --shadow-soft: 0 18px 40px -24px rgba(1,40,36,.4);
    --shadow-card: 0 30px 60px -34px rgba(1,40,36,.45);

    /* --- spacing-шкала ----------------------------------------------------- */
    --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
    --sp-5: 24px; --sp-6: 32px; --sp-7: 40px; --sp-8: 56px;

    /* --- типошкала (роли, fluid) ------------------------------------------ */
    --fs-display: clamp(38px, 3vw + 26px, 80px);   /* hero */
    --fs-h1:      clamp(30px, 2vw + 20px, 54px);
    --fs-h2:      clamp(26px, 1.6vw + 18px, 44px);
    --fs-h3:      clamp(20px, 1vw + 14px, 28px);
    --fs-body:    16px;
    --fs-small:   13.5px;
    --fs-micro:   12px;
    --font-main: 'Segoe UI', 'SegoeUI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;

    /* --- z-шкала попапов ---------------------------------------------------- */
    --z-header: 100;
    --z-bar:    100030;   /* плавающие панели */
    --z-pop:    100040;   /* попапы/дроверы */
    --z-lb:     100050;   /* лайтбоксы */
    --z-fs:     100060;   /* полноэкранные */
    --z-tip:    100070;   /* тултипы */

    /* ================= АЛИАС-МОСТ legacy → бренд ==========================
       Переопределяем переменные main-style.css (этот файл подключён позже),
       чтобы старые компоненты перекрасились в бренд БЕЗ переписывания.
       Тинты (*Lite/Light/Beige) — производные от палитры, задокументированы. */
    --ColorGreen:       var(--accent-ink);   /* был #00B85F — узаконен */
    --ColorGreenDark:   var(--dark-green);
    --ColorGreenDarkV2: var(--malachite);
    --ColorGreenV2:     var(--brunswick);
    --ColorGreenLight:  var(--celadon);
    --ColorLite:        #DBF7E6;             /* celadon-тинт (45% на белом) */
    --ColorBlue:        var(--blue-crayola); /* был teal #4E9F97 */
    --ColorBlueLight:   var(--periwinkle);
    --ColorBlueDark:    var(--savoy-blue);   /* был #0055a3 */
    --ColorViolet:      var(--periwinkle);   /* был #c2cfff */
    --ColorYellow:      var(--harvest-gold); /* был #e9ad0a — звёзды и т.п. */
    --ColorYellowLite:  #FDF1BF;             /* jonquil-тинт (25% на белом) */
    --ColorBeige:       #FDF1BF;
    --ColorRed:         var(--fire-brick);   /* был #c81926 */
    --ColorRedMid:      var(--poppy);        /* был #e53945 */
    --ColorRedLight:    var(--error-soft);
    --gradient: linear-gradient(180deg, var(--malachite) 0%, var(--accent-ink) 100%);
}

/* ====================================================================== */
/* СЛОЙ B. ГЛОБАЛЬНЫЕ ФИКСЫ                                                */
/* ====================================================================== */

/* ссылки: вместо teal #4E9F97 из main-style — brunswick */
a{ color: var(--brunswick); }

/* футер: вместо чёрного #000 — бренд-тёмно-зелёный */
.footer .container{ background: var(--dark-green); }

/* видимый фокус для клавиатуры — везде (main-style глушит outline) */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible{
    outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 6px;
}

/* ====================================================================== */
/* СЛОЙ B. КОМПОНЕНТЫ nv-*                                                 */
/* ====================================================================== */

/* --- кнопки: нормализация .site-btn к канону ---------------------------
   primary  = malachite-заливка + тёмный текст (1-2 на экран)
   secondary= outline brunswick, hover celadon 20%
   ghost    = текстовая                                                    */
.site-btn.light, .nv-btn--primary{
    background: var(--accent); border-color: var(--accent); color: var(--dark-green);
}
.site-btn.light:hover, .site-btn.light:focus-visible,
.nv-btn--primary:hover, .nv-btn--primary:focus-visible{
    background: var(--accent-ink); border-color: var(--accent-ink); color: #fff;
}
.site-btn.border, .nv-btn--secondary{
    background: transparent; border: 1px solid var(--brunswick); color: var(--brunswick);
}
.site-btn.border:hover, .site-btn.border:focus-visible,
.nv-btn--secondary:hover, .nv-btn--secondary:focus-visible{
    background: rgba(182,254,204,.2); border-color: var(--brunswick); color: var(--brunswick);
}
.nv-btn--ghost{
    background: none; border: 0; color: var(--brunswick);
    font-weight: 700; cursor: pointer; font-family: inherit;
}
.nv-btn--ghost:hover{ color: var(--accent-ink); }

/* --- карточка ----------------------------------------------------------- */
.nv-card{
    background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl);
    transition: transform .3s ease, box-shadow .3s ease;
}
@media (hover:hover){
    .nv-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-card); }
}

/* --- оценка Nativa: канон «капли» ---------------------------------------
   базовый (инлайн-пилюля) 12/12/12/3; крупный блок --lg 18/18/18/5        */
.nv-score{
    display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    padding: 5px 12px; border-radius: 12px 12px 12px 3px;
    background: var(--bg-dark); color: var(--celadon); font-weight: 900;
}
.nv-score--lg{ padding: 0; width: 58px; height: 58px; border-radius: 18px 18px 18px 5px; font-size: 22px; }

/* --- бейдж «נבדק ע״י נתיבה» и статусы: КАНОН (перенесён с hotel-screen) -- */
.nativa-badge{
    display: inline-flex; align-items: center; gap: 8px; padding: 8px 15px 8px 12px;
    border-radius: var(--r-pill); font-size: 14px; font-weight: 800; line-height: 1;
    background: var(--bg-tint); color: var(--text); border: 1px solid var(--line);
}
.nativa-badge__ic{ display: inline-flex; width: 20px; height: 20px; flex: 0 0 auto; color: var(--brunswick); }
.nativa-badge__ic svg{ width: 100%; height: 100%; }
.nativa-badge--recommended{ background: var(--bg-dark); color: var(--celadon); border-color: rgba(182,254,204,.35); }
.nativa-badge--recommended .nativa-badge__ic{ color: var(--accent); }
.nativa-badge--premium{ background: var(--bg-dark-2); color: #fff; border-color: rgba(182,254,204,.3); }
.nativa-badge--premium .nativa-badge__ic{ color: var(--accent); }
.nativa-badge--choice{ background: var(--celadon); color: var(--brunswick); border-color: rgba(1,40,36,.12); }
.nativa-badge--choice .nativa-badge__ic{ color: var(--brunswick); }
.nativa-badge--standard{ background: var(--bg-soft); color: var(--text); }
.nativa-badge--standard .nativa-badge__ic{ color: var(--accent-ink); }
.nativa-badge--onmedia{ box-shadow: 0 8px 22px rgba(1,40,36,.38); }
/* канон «проверено»: тёмный pill + медаль-jonquil */
.nativa-badge--reviewed{ background: var(--bg-dark); color: var(--celadon); border-color: rgba(182,254,204,.35); }
.nativa-badge--reviewed .nativa-badge__ic{ color: var(--jonquil); }

/* --- % совпадения: ЕДИНАЯ шкала ≥80 / 50–79 / <50 ------------------------
   Цвета порогов (использовать и в JS): #00DE71 / #F9C801 / #E3A704.       */
.nv-match{ display: flex; align-items: center; gap: 8px; }
.nv-match__bar{ flex: 1 1 auto; height: 7px; border-radius: var(--r-pill); background: rgba(1,40,36,.08); overflow: hidden; }
.nv-match__bar i{ display: block; height: 100%; border-radius: var(--r-pill);
    transform-origin: 100% 50%; background: var(--accent); }
.nv-match__pct{ flex: 0 0 auto; padding: 3px 10px; border-radius: var(--r-pill);
    font-size: var(--fs-small); font-weight: 900; color: var(--dark-green); background: var(--bg-tint); }
.nv-match--hi  .nv-match__bar i{ background: var(--malachite); }
.nv-match--mid .nv-match__bar i{ background: var(--jonquil); }
.nv-match--lo  .nv-match__bar i{ background: var(--harvest-gold); }

/* --- чип: канон active = malachite-заливка + тёмный текст ----------------- */
.nv-chip{
    display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; min-height: 38px;
    border-radius: var(--r-pill); border: 1px solid rgba(1,69,62,.22); background: #fff;
    color: var(--text); font-family: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
@media (hover:hover){ .nv-chip:hover{ background: var(--bg-tint); } }
.nv-chip.is-on{ background: var(--accent); border-color: var(--accent); color: var(--dark-green); }

/* --- попап: канонический каркас ------------------------------------------ */
.nv-pop{ position: fixed; inset: 0; z-index: var(--z-pop); display: flex; align-items: center;
    justify-content: center; padding: 16px; opacity: 0; visibility: hidden;
    transition: opacity .3s ease, visibility .3s ease; }
.nv-pop.is-open{ opacity: 1; visibility: visible; }
.nv-pop__overlay{ position: absolute; inset: 0; background: rgba(1,40,36,.6); }
.nv-pop__dialog{ position: relative; z-index: 2; width: 560px; max-width: 100%; max-height: 92vh;
    overflow: auto; background: #fff; border-radius: var(--r-xl); padding: 24px;
    transform: scale(.96); transition: transform .3s ease; }
.nv-pop.is-open .nv-pop__dialog{ transform: none; }

/* --- крестик закрытия: канон — кружок + rotate ---------------------------- */
.nv-close{
    display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%;
    border: 0; padding: 0; background: var(--bg-tint); color: var(--text); cursor: pointer;
    transition: transform .3s ease, background-color .3s ease;
}
.nv-close:hover, .nv-close:focus-visible{ transform: rotate(90deg) scale(1.06); background: var(--celadon); }
.nv-close--ondark{ background: rgba(255,255,255,.18); color: #fff; }
.nv-close--ondark:hover, .nv-close--ondark:focus-visible{ background: rgba(255,255,255,.3); }

/* --- инпут: канон + фокус-кольцо малахит ---------------------------------- */
.nv-input{
    font-family: inherit; font-size: 16px; color: var(--text); min-height: 48px;
    padding: 0 14px; border-radius: 13px; border: 1px solid var(--line-strong); background: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.nv-input:focus{ outline: none; border-color: var(--brunswick); box-shadow: 0 0 0 3px rgba(0,222,113,.18); }
.nv-field.is-bad .nv-input, .nv-input.is-bad{ border-color: var(--error); background: rgba(224,60,72,.06); }
.nv-err{ font-style: normal; font-size: 12.5px; font-weight: 700; color: var(--error); }
.nv-err--ondark{ color: var(--error-soft); }

/* --- тултип (fixed, тёмный) ------------------------------------------------ */
.nv-tip{
    position: fixed; z-index: var(--z-tip); max-width: 260px; padding: 8px 12px;
    border-radius: var(--r-s); background: var(--bg-dark); color: var(--celadon);
    font-family: var(--font-main); font-size: 13px; line-height: 1.5; font-weight: 600;
    box-shadow: var(--shadow-soft); pointer-events: none;
    opacity: 0; transform: translateY(4px); transition: opacity .25s ease, transform .25s ease;
}
.nv-tip.is-show{ opacity: 1; transform: none; }

/* --- доска времён года (сезонный компонент, переиспользуемый) --------------
   Разметку и данные даёт страница; здесь — токены/настроение сезонов.
   Модификаторы: --spring/--summer/--autumn/--winter; .is-now (текущий
   по дате, метка «עכשיו»), .is-on (активный фильтр).                        */
.nv-seasons{ display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.nv-season{ position: relative; display: flex; flex-direction: column; gap: 7px;
    padding: 12px 14px; min-height: 44px; border-radius: var(--r-l);
    border: 1.5px solid var(--line); font-family: inherit; text-align: start; cursor: pointer;
    background: linear-gradient(to top, #fff 30%, var(--season-tint, var(--bg-soft)));
    transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
@media (hover:hover){ .nv-season:hover{ transform: translateY(-3px); box-shadow: var(--shadow-soft); } }
.nv-season__name{ display: flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 800; color: var(--dark-green); }
.nv-season__now{ padding: 2px 8px; border-radius: var(--r-pill); background: var(--jonquil); color: var(--dark-green);
    font-size: 10.5px; font-weight: 900; }
.nv-season__crops{ display: flex; flex-wrap: wrap; gap: 5px; }
.nv-season__crops i{ display: inline-flex; align-items: center; gap: 4px; font-style: normal;
    padding: 3px 9px; border-radius: var(--r-pill); background: rgba(255,255,255,.75);
    border: 1px solid var(--line); font-size: 12px; font-weight: 700; color: var(--text-soft); }
.nv-season__crops svg{ width: 14px; height: 14px; color: var(--accent-ink); }
.nv-season__empty{ font-size: 12px; color: var(--text-faint); }
/* настроение сезонов — строго токены палитры */
.nv-season--spring{ --season-tint: rgba(0,222,113,.12); }
.nv-season--summer{ --season-tint: rgba(249,200,1,.18); }
.nv-season--autumn{ --season-tint: rgba(227,167,4,.18); }
.nv-season--winter{ --season-tint: rgba(198,211,255,.32); }
.nv-season.is-now{ border-color: var(--jonquil); }
.nv-season.is-on{ border-color: var(--accent); box-shadow: 0 0 0 3px rgba(0,222,113,.2); }
@media only screen and (min-width: 768px){ .nv-seasons{ grid-template-columns: repeat(4, 1fr); } }

/* --- ГЕО-БЛОК «מיקום וסביבה» (перенесён с hotel-screen — эталон) -----------
   Карта с пинами + список «рядом» + попап полной карты. JS: assets/js/nv-map.js */
.nv-geo__grid{ display: flex; flex-direction: column; gap: 22px; }
.nv-geo__mapbar{ display: flex; justify-content: flex-end; margin-bottom: 10px; }
.nv-geo__nearttl{ font-size: 20px; font-weight: bold; color: var(--text); margin: 0 0 14px; }
.nv-geo__list{ display: flex; flex-direction: column; gap: 10px; }
.nv-geo__route{ display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px;
    margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line);
    font-size: 14px; font-weight: 600; color: var(--text-soft); }
.nv-map-box{ position: relative; width: 100%; height: 300px; border-radius: var(--r-xl); overflow: hidden;
    border: 1px solid var(--line); box-shadow: var(--shadow-soft); }
.nv-map-box > div{ position: absolute; inset: 0; width: 100%; height: 100%; }
.nv-map-ph{ position: relative; width: 100%; height: 100%; cursor: pointer;
    background: radial-gradient(120% 90% at 70% 18%, rgba(182,254,204,.25) 0%, rgba(182,254,204,.5) 45%, rgba(182,254,204,.72) 100%); }
.nv-map-ph__roads{ position: absolute; inset: 0; width: 100%; height: 100%; }
.nv-map-ph__roads path{ fill: none; stroke: #fff; stroke-width: 12; opacity: .85; }
.nv-map-ph__home{ position: absolute; transform: translate(50%,-50%); width: 46px; height: 46px;
    display: flex; align-items: center; justify-content: center; border-radius: 50%;
    background: #fff; border: 2px solid var(--brunswick); box-shadow: 0 8px 20px rgba(1,40,36,.3); z-index: 3; }
.nv-map-ph__home img{ width: 60%; height: 60%; object-fit: contain; }
.nv-map-ph__pin{ position: absolute; transform: translate(50%,-50%); width: 30px; height: 30px;
    display: flex; align-items: center; justify-content: center; border-radius: 50% 50% 50% 3px;
    background: var(--bg-dark); color: #fff; font-size: 13px; font-weight: bold; cursor: pointer; z-index: 2;
    box-shadow: 0 6px 16px rgba(1,40,36,.35); transition: transform .25s ease, background .25s ease, opacity .25s ease; }
.nv-map-ph__pin.is-hidden{ opacity: 0; transform: translate(50%,-50%) scale(.4); pointer-events: none; }
.nv-map-ph__pin.is-pop{ opacity: 0; transform: translate(50%,-50%) scale(.4); }
.nv-map-ph__pin.is-active{ background: var(--accent); color: var(--dark-green); transform: translate(50%,-62%) scale(1.16); z-index: 4; }
.nv-map-ph__card{ position: absolute; z-index: 5; width: 210px; transform: translate(50%, calc(-100% - 38px));
    background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 14px 40px rgba(1,40,36,.32);
    opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s ease; }
.nv-map-ph__card.is-open{ opacity: 1; visibility: visible; }
.nv-map-ph__card-photo{ width: 100%; height: 108px; object-fit: cover; display: block; }
.nv-map-ph__card-body{ padding: 10px 12px; }
.nv-map-ph__card-name{ font-size: 15px; font-weight: bold; color: var(--text); }
.nv-map-ph__card-row{ display: flex; justify-content: space-between; margin-top: 4px; font-size: 12px; color: var(--text-faint); }
.nv-map-ph__card-dist{ color: var(--accent-ink); font-weight: bold; }
/* карточка «рядом» */
.nv-np{ display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 16px;
    border: 1px solid var(--line); cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease; }
.nv-np.is-hl, .nv-np:hover{ background: var(--bg-tint); border-color: transparent; }
.nv-np.is-hidden{ display: none; }
.nv-np__num{ flex: 0 0 auto; width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
    border-radius: 50% 50% 50% 2px; background: var(--bg-dark); color: #fff; font-size: 12px; font-weight: bold; }
.nv-np__info{ display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1 1 auto; }
.nv-np__name{ font-size: 15px; font-weight: bold; color: var(--text); }
.nv-np__meta{ font-size: 12px; color: var(--text-faint); }
.nv-np__photo{ flex: 0 0 auto; width: 54px; height: 54px; border-radius: 12px; object-fit: cover; background: var(--bg-dark-2); }
/* попап полной карты */
.nv-mappop{ position: fixed; inset: 0; z-index: var(--z-pop); opacity: 0; visibility: hidden;
    transition: opacity .35s ease, visibility .35s ease; }
.nv-mappop.is-open{ opacity: 1; visibility: visible; }
.nv-mappop__bg{ position: absolute; inset: 0; background: rgba(1,40,36,.6); }
.nv-mappop__dialog{ position: absolute; inset: 0; display: flex; flex-direction: column; background: #fff; overflow: hidden;
    transform: scale(.985); transition: transform .35s ease; }
.nv-mappop.is-open .nv-mappop__dialog{ transform: scale(1); }
.nv-mappop__close{ position: absolute; z-index: 6; top: 16px; inset-inline-end: 16px; width: 46px; height: 46px;
    display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 0; cursor: pointer;
    background: #fff; color: var(--text); box-shadow: 0 6px 18px rgba(1,40,36,.3);
    transition: transform .3s ease, background-color .3s ease; }
.nv-mappop__close:hover, .nv-mappop__close:focus-visible{ transform: rotate(90deg) scale(1.06); background: var(--celadon); }
.nv-mappop__close svg{ width: 20px; height: 20px; }
.nv-mappop__panel{ position: relative; z-index: 4; display: flex; flex-direction: column; background: #fff;
    flex: 0 0 auto; width: 100%; max-height: 46%; border-bottom: 1px solid var(--line); }
.nv-mappop__panel-head{ padding: 18px 18px 12px; }
.nv-mappop__title{ margin: 0; font-size: 22px; font-weight: bold; color: var(--text); }
.nv-mappop__sub{ margin: 2px 0 0; font-size: 14px; color: var(--text-faint); }
.nv-mappop__filters{ display: flex; flex-wrap: nowrap; gap: 8px; padding: 12px 18px 4px;
    overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.nv-mappop__filters::-webkit-scrollbar{ height: 0; }
.nv-mapchip{ flex: 0 0 auto; padding: 8px 14px; min-height: 36px; border-radius: var(--r-pill);
    border: 1px solid rgba(1,69,62,.25); background: #fff; color: var(--text);
    font-size: 13px; font-weight: 700; cursor: pointer;
    transition: background-color .25s ease, border-color .25s ease, color .25s ease; }
.nv-mapchip.is-active{ background: var(--bg-dark); border-color: var(--bg-dark); color: var(--celadon); }
@media (hover:hover){ .nv-mapchip:hover:not(.is-active){ background: rgba(182,254,204,.2); } }
.nv-mappop__list{ flex: 1 1 auto; overflow-y: auto; padding: 6px 14px 16px; display: flex; flex-direction: column; gap: 8px; }
.nv-mappop__canvas{ position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden;
    background: radial-gradient(120% 90% at 65% 22%, rgba(182,254,204,.25) 0%, rgba(182,254,204,.5) 45%, rgba(182,254,204,.72) 100%); }
@media only screen and (min-width: 768px){
    .nv-map-box{ height: 380px; }
}
@media only screen and (min-width: 1024px){
    .nv-geo__grid{ flex-direction: row; align-items: start; gap: 28px; }
    .nv-geo__mapcol{ flex: 1.4 1 0; min-width: 0; }
    .nv-geo__nearcol{ flex: 1 1 0; min-width: 0; }
    .nv-map-box{ height: 460px; }
    .nv-mappop__dialog{ flex-direction: row; }
    .nv-mappop__panel{ order: 2; width: 380px; max-height: none; height: 100%;
        border-bottom: 0; border-inline-start: 1px solid var(--line); }
}
@media (prefers-reduced-motion: reduce){
    .nv-map-ph__pin, .nv-map-ph__card, .nv-mappop, .nv-mappop__dialog, .nv-mappop__close, .nv-np{ transition: none; }
}

/* --- reveal по скроллу (единый паттерн) ------------------------------------- */
.nv-reveal{ opacity: 0; transform: translateY(18px);
    transition: opacity .6s ease, transform .6s ease; transition-delay: var(--rd, 0ms); }
.nv-reveal.is-in{ opacity: 1; transform: none; }

/* ====================================================================== */
/* СЛОЙ C. ШАПКА: fixed + auto-hide (канон; JS — assets/js/brand-v2.js)    */
/* main-style уже даёт .header{position:fixed} и .header.hide{translateY}. */
/* Страницы с непрозрачной шапкой ставят body.nv-fixed-header + .header.white */
/* (исключение — прозрачная главная поверх hero).                          */
/* ====================================================================== */
body.nv-fixed-header{ padding-block-start: var(--header-height, 84px); }

/* ====================================================================== */
/* REDUCED MOTION                                                          */
/* ====================================================================== */
@media (prefers-reduced-motion: reduce){
    .nv-card, .nv-chip, .nv-pop, .nv-pop__dialog, .nv-close, .nv-input, .nv-tip, .nv-season{ transition: none; }
    .nv-reveal{ opacity: 1; transform: none; transition: none; }
    .nv-close:hover, .nv-close:focus-visible{ transform: none; }
}

/* ====================================================================== */
/* СЛОЙ D. РАСШИРЕНИЕ v2.1 — премиум-блоки (демо: ui-kit.html)             */
/* Только токены системы. Существующие nv-* не изменяются.                 */
/* Поведение: assets/js/nv-ui.js (data-атрибуты).                          */
/* ====================================================================== */

/* ---------- ГАЛЕРЕИ / МЕДИА ------------------------------------------ */
/* nv-gallery — премиум-галерея объекта (Airbnb-мозаика): главное + 4 */
.nv-gallery{ position: relative; display: grid; grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 130px; gap: var(--sp-2); border-radius: var(--r-xl); overflow: hidden; }
.nv-gallery__item{ position: relative; border: 0; padding: 0; overflow: hidden;
    background: var(--bg-tint); cursor: pointer; }
.nv-gallery__item img{ width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform .45s ease; }
@media (hover:hover){ .nv-gallery__item:hover img{ transform: scale(1.05); } }
.nv-gallery__item--main{ grid-column: span 2; grid-row: span 2; }
.nv-gallery__all{ position: absolute; z-index: 2; bottom: var(--sp-3); inset-inline-start: var(--sp-3);
    display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 16px;
    border: 0; border-radius: var(--r-pill); background: rgba(255,255,255,.94); color: var(--dark-green);
    font-family: inherit; font-size: 14px; font-weight: 800; cursor: pointer; box-shadow: var(--shadow-soft);
    transition: transform .25s ease; }
@media (hover:hover){ .nv-gallery__all:hover{ transform: translateY(-2px); } }
@media only screen and (min-width: 768px){
    .nv-gallery{ grid-template-columns: 2fr 1fr 1fr; grid-auto-rows: 150px; }
    .nv-gallery__item--main{ grid-column: 1; grid-row: span 2; }
}
@media only screen and (min-width: 1280px){ .nv-gallery{ grid-auto-rows: 190px; } }

/* nv-lightbox — полноэкранный просмотр (JS: nvLightbox) */
.nv-lightbox{ position: fixed; inset: 0; z-index: var(--z-lb); display: flex; flex-direction: column;
    align-items: center; justify-content: center; background: rgba(1,40,36,.93);
    opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease; }
.nv-lightbox.is-open{ opacity: 1; visibility: visible; }
.nv-lightbox__img{ max-width: min(92vw, 1100px); max-height: 72vh; border-radius: var(--r-l); object-fit: contain; }
.nv-lightbox__close{ position: absolute; top: 16px; inset-inline-start: 16px; }
.nv-lightbox__nav{ position: absolute; top: 50%; transform: translateY(-50%); width: 46px; height: 46px;
    display: grid; place-items: center; border: 0; border-radius: 50%;
    background: rgba(255,255,255,.16); color: #fff; cursor: pointer; transition: background-color .25s ease; }
@media (hover:hover){ .nv-lightbox__nav:hover{ background: rgba(255,255,255,.3); } }
.nv-lightbox__nav svg{ width: 20px; height: 20px; }
.nv-lightbox__nav--prev{ inset-inline-start: 12px; }
.nv-lightbox__nav--next{ inset-inline-end: 12px; }
.nv-lightbox__count{ position: absolute; top: 22px; inset-inline-end: 20px; padding: 6px 14px;
    border-radius: var(--r-pill); background: rgba(255,255,255,.14); color: #fff;
    font-size: 13.5px; font-weight: 700; direction: ltr; unicode-bidi: isolate; }
.nv-lightbox__thumbs{ display: flex; gap: 8px; margin-top: var(--sp-3); max-width: 92vw;
    overflow-x: auto; padding: 4px; scrollbar-width: none; }
.nv-lightbox__thumbs::-webkit-scrollbar{ display: none; }
.nv-lightbox__thumb{ flex: 0 0 auto; width: 74px; height: 52px; border-radius: var(--r-s); overflow: hidden;
    border: 2px solid transparent; padding: 0; background: none; cursor: pointer; opacity: .65;
    transition: opacity .25s ease, border-color .25s ease; }
.nv-lightbox__thumb img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.nv-lightbox__thumb.is-on{ border-color: var(--accent); opacity: 1; }

/* nv-masonry — атмосферный коллаж */
.nv-masonry{ display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-2);
    grid-auto-rows: 130px; grid-auto-flow: dense; }
.nv-masonry__item{ position: relative; margin: 0; overflow: hidden; border-radius: var(--r-l); background: var(--bg-tint); }
.nv-masonry__item img{ width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
@media (hover:hover){ .nv-masonry__item:hover img{ transform: scale(1.06); } }
.nv-masonry__item--tall{ grid-row: span 2; }
.nv-masonry__item--wide{ grid-column: span 2; }
@media only screen and (min-width: 768px){ .nv-masonry{ grid-template-columns: repeat(4, 1fr); grid-auto-rows: 160px; gap: var(--sp-3); } }

/* nv-media-hover — фото ↔ видео/кадр на hover (JS: [data-nv-media]) */
.nv-media-hover{ position: relative; overflow: hidden; border-radius: var(--r-xl); aspect-ratio: 4 / 3;
    background: var(--bg-dark-2); cursor: pointer; }
.nv-media-hover img, .nv-media-hover video{ position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; }
.nv-media-hover__video{ opacity: 0; transition: opacity .4s ease; }
.nv-media-hover.is-on .nv-media-hover__video{ opacity: 1; }
.nv-media-hover__tag{ position: absolute; z-index: 2; top: var(--sp-3); inset-inline-start: var(--sp-3);
    display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: var(--r-pill);
    background: rgba(1,40,36,.62); color: #fff; font-size: 12.5px; font-weight: 800;
    -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }

/* nv-hero-split — hero-развилка на зоны */
.nv-hero-split{ display: grid; grid-template-columns: 1fr; gap: var(--sp-3); }
.nv-hsplit{ position: relative; overflow: hidden; isolation: isolate; min-height: 260px;
    display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start;
    padding: var(--sp-5); border: 0; border-radius: var(--r-xl); background: var(--bg-dark-2);
    font-family: inherit; text-align: start; cursor: pointer; box-shadow: var(--shadow-soft);
    transition: transform .4s ease, opacity .4s ease, box-shadow .4s ease; }
.nv-hsplit__ph{ position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center;
    transition: transform .55s ease; }
.nv-hsplit__scrim{ position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(to top, rgba(1,40,36,.8) 0%, rgba(1,40,36,.26) 55%, rgba(1,40,36,.1) 100%); }
.nv-hsplit--warm .nv-hsplit__scrim{ background:
    linear-gradient(205deg, rgba(249,200,1,.28) 0%, rgba(227,167,4,.1) 34%, rgba(0,0,0,0) 62%),
    linear-gradient(to top, rgba(1,40,36,.8) 0%, rgba(1,40,36,.26) 55%, rgba(1,40,36,.1) 100%); }
.nv-hsplit--green .nv-hsplit__scrim{ background:
    linear-gradient(205deg, rgba(0,222,113,.24) 0%, rgba(182,254,204,.12) 34%, rgba(0,0,0,0) 62%),
    linear-gradient(to top, rgba(1,40,36,.8) 0%, rgba(1,40,36,.26) 55%, rgba(1,40,36,.1) 100%); }
.nv-hsplit__body{ position: relative; z-index: 2; display: flex; flex-direction: column;
    align-items: flex-start; gap: 6px; }
.nv-hsplit__ttl{ font-size: clamp(20px, 1.4vw + 13px, 28px); font-weight: 800; color: #fff;
    text-shadow: 0 3px 18px rgba(1,40,36,.5); }
.nv-hsplit__sub{ font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.9); }
@media (hover:hover){
    .nv-hsplit:hover, .nv-hsplit:focus-visible{ transform: scale(1.02); box-shadow: var(--shadow-card); z-index: 2; }
    .nv-hsplit:hover .nv-hsplit__ph{ transform: scale(1.07); }
    .nv-hero-split:hover .nv-hsplit:not(:hover):not(:focus-visible){ opacity: .75; transform: scale(.98); }
}
@media only screen and (min-width: 768px){ .nv-hero-split{ grid-template-columns: 1fr 1fr; } }

/* ---------- БРОНИРОВАНИЕ / КОММЕРЦИЯ ---------------------------------- */
/* nv-bookbar — панель брони (десктоп-карточка / --mobile фикс снизу) */
.nv-bookbar{ display: flex; flex-direction: column; gap: var(--sp-3); padding: var(--sp-4);
    background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl); box-shadow: var(--shadow-soft); }
.nv-bookbar__head{ display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-2); }
.nv-bookbar__head b{ font-size: 19px; font-weight: 800; color: var(--dark-green); }
.nv-bookbar__from{ font-size: 13px; font-weight: 700; color: var(--text-soft); }
.nv-bookbar__field{ display: flex; flex-direction: column; gap: 6px; }
.nv-bookbar__field > span{ font-size: 13px; font-weight: 700; color: var(--text-soft); }
.nv-bookbar__row{ display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); }
.nv-bookbar__total{ display: flex; align-items: baseline; justify-content: space-between;
    padding-top: var(--sp-3); border-top: 1px solid var(--line); }
.nv-bookbar__total b{ font-size: 24px; font-weight: 900; color: var(--dark-green); }
.nv-bookbar__points{ margin: 0; display: inline-flex; align-items: center; gap: 6px;
    font-size: 13px; font-weight: 700; color: var(--accent-ink); }
.nv-bookbar__points svg{ width: 14px; height: 14px; flex: 0 0 auto; }
.nv-bookbar__note{ margin: 0; font-size: 12px; color: var(--text-faint); text-align: center; }
.nv-bookbar--mobile{ position: fixed; z-index: var(--z-bar); inset-inline: 0; bottom: 0;
    flex-direction: row; align-items: center; justify-content: space-between;
    border-radius: var(--r-pill); max-width: 560px; margin-inline: auto;
    margin-bottom: calc(8px + env(safe-area-inset-bottom));
    padding: 9px 10px 9px 14px; background: rgba(255,255,255,.95);
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: var(--shadow-card); }
.nv-bookbar--static{ position: static; margin-bottom: 0; }   /* для витрины */

/* nv-price-breakdown — прозрачная разбивка цены */
.nv-price-breakdown{ display: flex; flex-direction: column; gap: 5px; padding: var(--sp-3);
    border-radius: var(--r-m); background: var(--bg-soft); font-size: 13.5px; color: var(--text-soft); }
.nv-price-breakdown > div{ display: flex; justify-content: space-between; gap: var(--sp-2); }
.nv-price-breakdown__total{ margin-top: 4px; padding-top: 8px; border-top: 1px solid var(--line);
    font-weight: 900; color: var(--dark-green); font-size: 15px; }

/* nv-ticket — тарифы/пакеты разной значимости */
.nv-ticket{ position: relative; display: flex; flex-direction: column; padding: var(--sp-4);
    background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl);
    transition: transform .3s ease, box-shadow .3s ease; }
@media (hover:hover){ .nv-ticket:hover{ transform: translateY(-3px); box-shadow: var(--shadow-card); } }
.nv-ticket__in{ display: flex; flex-direction: column; gap: var(--sp-3); flex: 1 1 auto; }
.nv-ticket__best{ position: absolute; z-index: 2; top: -11px; inset-inline-start: 16px; padding: 4px 12px;
    border-radius: var(--r-pill); background: var(--jonquil); color: var(--dark-green);
    font-size: 12px; font-weight: 900; }
.nv-ticket__head{ display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-2); }
.nv-ticket__name{ font-size: 18px; font-weight: 800; color: var(--dark-green); }
.nv-ticket__price{ flex: 0 0 auto; display: inline-flex; align-items: baseline; gap: 4px; }
.nv-ticket__price b{ font-size: 22px; font-weight: 900; color: var(--dark-green); }
.nv-ticket__price i{ font-size: 12px; font-style: normal; color: var(--text-faint); }
.nv-ticket__inc{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.nv-ticket__inc li{ display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--text); }
.nv-ticket__inc svg{ width: 15px; height: 15px; flex: 0 0 auto; color: var(--accent-ink); }
.nv-ticket__foot{ display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2);
    margin-top: auto; padding-top: var(--sp-3); border-top: 1px solid var(--line); }
.nv-ticket.is-picked{ border-color: var(--accent); box-shadow: 0 0 0 2px rgba(0,222,113,.3), var(--shadow-soft); }
.nv-ticket--dark{ background: var(--bg-dark); border-color: rgba(182,254,204,.3); }
.nv-ticket--dark .nv-ticket__name, .nv-ticket--dark .nv-ticket__price b{ color: var(--celadon); }
.nv-ticket--dark .nv-ticket__inc li{ color: rgba(255,255,255,.9); }
.nv-ticket--dark .nv-ticket__inc svg{ color: var(--accent); }
.nv-ticket--dark .nv-ticket__foot{ border-top-color: rgba(182,254,204,.2); }
.nv-ticket--feat .nv-ticket__ph{ margin: calc(-1 * var(--sp-4)); margin-bottom: 4px; aspect-ratio: 16 / 6;
    overflow: hidden; border-radius: var(--r-xl) var(--r-xl) 0 0; }
.nv-ticket--feat .nv-ticket__ph img{ width: 100%; height: 100%; object-fit: cover; display: block; }

/* nv-stepper — счётчик (JS: [data-nv-stepper]) */
.nv-stepper{ display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2);
    border: 1px solid var(--line-strong); border-radius: 13px; padding: 4px; }
.nv-stepper bdi{ font-size: 16px; font-weight: 800; color: var(--dark-green); min-width: 22px; text-align: center; }
.nv-stepper__btn{ width: 38px; height: 38px; border: 0; border-radius: var(--r-s);
    background: var(--bg-soft); color: var(--brunswick); font-size: 18px; font-weight: 800;
    cursor: pointer; transition: background-color .2s ease, opacity .2s ease; }
@media (hover:hover){ .nv-stepper__btn:hover:not(:disabled){ background: var(--bg-tint); } }
.nv-stepper__btn:disabled{ opacity: .35; cursor: default; }

/* nv-date-range — пара дат */
.nv-date-range{ display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line-strong);
    border-radius: 13px; overflow: hidden; }
.nv-date-range label{ display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; cursor: pointer; }
.nv-date-range label + label{ border-inline-start: 1px solid var(--line); }
.nv-date-range span{ font-size: 11px; font-weight: 800; color: var(--text-faint); }
.nv-date-range input{ border: 0; padding: 0; background: none; font-family: inherit;
    font-size: 14.5px; font-weight: 700; color: var(--dark-green); min-height: 24px; }
.nv-date-range input:focus{ outline: none; }
.nv-date-range:focus-within{ border-color: var(--brunswick); box-shadow: 0 0 0 3px rgba(0,222,113,.18); }

/* nv-promo — акция/מבצע */
.nv-promo{ display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: var(--sp-3) var(--sp-4);
    border-radius: var(--r-l); background: #fff; border: 1px solid var(--line); }
.nv-promo__tag{ display: inline-flex; align-items: center; padding: 5px 12px; border-radius: var(--r-pill);
    background: var(--jonquil); color: var(--dark-green); font-size: 12.5px; font-weight: 900; }
.nv-promo__ttl{ font-size: 15px; font-weight: 800; color: var(--dark-green); }
.nv-promo__cond{ font-size: 13px; color: var(--text-soft); }
.nv-promo__until{ margin-inline-start: auto; font-size: 12.5px; font-weight: 700; color: var(--text-faint); }
.nv-promo--banner{ background: linear-gradient(120deg, rgba(249,200,1,.2), rgba(182,254,204,.26));
    border-color: rgba(227,167,4,.3); padding: var(--sp-4) var(--sp-5); }
.nv-promo--banner .nv-promo__ttl{ font-size: 19px; }

/* ---------- ДОВЕРИЕ / ОЦЕНКА ------------------------------------------ */
/* nv-review-summary — сводка отзывов с распределением */
.nv-review-summary{ display: flex; flex-direction: column; gap: var(--sp-4); padding: var(--sp-4);
    background: #fff; border: 1px solid var(--line); border-radius: var(--r-xl); }
.nv-review-summary__head{ display: flex; align-items: center; gap: var(--sp-3); }
.nv-review-summary__meta b{ display: block; font-size: 17px; font-weight: 800; color: var(--dark-green); }
.nv-review-summary__meta span{ font-size: 13px; color: var(--text-faint); }
.nv-review-summary__rows{ display: flex; flex-direction: column; gap: 9px; }
.nv-rsrow{ display: grid; grid-template-columns: 86px 1fr 34px; align-items: center; gap: var(--sp-2); }
.nv-rsrow__lbl{ font-size: 13px; font-weight: 700; color: var(--text-soft); }
.nv-rsrow__bar{ height: 6px; border-radius: var(--r-pill); background: rgba(1,40,36,.08); overflow: hidden; }
.nv-rsrow__bar i{ display: block; height: 100%; border-radius: var(--r-pill); background: var(--accent);
    transform-origin: 100% 50%; }
.nv-rsrow__val{ font-size: 13px; font-weight: 800; color: var(--dark-green); text-align: end; }
/* nv-review-card — отзыв гостя */
.nv-review-card{ display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-4);
    background: #fff; border: 1px solid var(--line); border-radius: var(--r-l); }
.nv-review-card__head{ display: flex; align-items: center; gap: var(--sp-2); }
.nv-review-card__who b{ display: block; font-size: 14.5px; font-weight: 800; color: var(--dark-green); }
.nv-review-card__who span{ font-size: 12px; color: var(--text-faint); }
.nv-review-card__stars{ margin-inline-start: auto; color: var(--jonquil); letter-spacing: 2px; font-size: 14px; }
.nv-review-card p{ margin: 0; font-size: 14px; line-height: 1.65; color: var(--text-soft); }

/* nv-verdict — расширенная оценка Nativa */
.nv-verdict{ position: relative; overflow: hidden; display: flex; flex-direction: column; gap: var(--sp-3);
    padding: var(--sp-5); border-radius: var(--r-xl); background: var(--bg-dark); color: var(--celadon); }
.nv-verdict__head{ display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
.nv-verdict__quote{ margin: 0; font-size: clamp(16px, .7vw + 13px, 19px); line-height: 1.6;
    color: rgba(182,254,204,.9); font-weight: 600; max-width: 62ch; }
.nv-verdict__crit{ list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 8px; }
.nv-verdict__crit li{ display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600;
    color: rgba(255,255,255,.9); }
.nv-verdict__crit svg{ width: 15px; height: 15px; flex: 0 0 auto; color: var(--accent); }
@media only screen and (min-width: 768px){ .nv-verdict__crit{ grid-template-columns: 1fr 1fr; } }

/* nv-stat — анимированная цифра (JS: [data-nv-count]) */
.nv-stat{ display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; gap: 4px; padding: var(--sp-4); border-radius: var(--r-l);
    background: var(--bg-tint); }
.nv-stat__num{ font-size: clamp(30px, 2.4vw + 16px, 44px); font-weight: 900; line-height: 1.05; color: var(--brunswick); }
.nv-stat__num--accent{ color: var(--accent-ink); }
.nv-stat__cap{ font-size: 13.5px; font-weight: 700; color: var(--text-soft); }

/* ---------- НАВИГАЦИЯ / СТРУКТУРА -------------------------------------- */
/* nv-bento — bento-плитки */
.nv-bento{ display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--sp-3); }
.nv-bento__tile{ position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 6px;
    min-height: 130px; padding: var(--sp-4); border-radius: var(--r-l); background: #fff;
    border: 1px solid var(--line); transition: transform .35s ease, box-shadow .35s ease; }
@media (hover:hover){ .nv-bento__tile:hover{ transform: translateY(-4px); box-shadow: var(--shadow-soft); } }
.nv-bento__tile--photo{ padding: 0; justify-content: flex-end; background: var(--bg-dark-2); }
.nv-bento__tile--photo img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
    transition: transform .5s ease; }
@media (hover:hover){ .nv-bento__tile--photo:hover img{ transform: scale(1.05); } }
.nv-bento__tile--photo::after{ content: ''; position: absolute; inset: 0;
    background: linear-gradient(to top, rgba(1,40,36,.82) 0%, rgba(1,40,36,.2) 55%, rgba(1,40,36,0) 80%); }
.nv-bento__body{ position: relative; z-index: 2; padding: var(--sp-4); color: #fff; }
.nv-bento__body b{ display: block; font-size: 16px; margin-bottom: 2px; }
.nv-bento__body span{ font-size: 13px; color: rgba(255,255,255,.85); }
.nv-bento__tile--hero{ grid-column: span 2; min-height: 220px; }
.nv-bento__ttl{ font-size: 16px; font-weight: 800; color: var(--brunswick); }
.nv-bento__cap{ font-size: 13.5px; line-height: 1.5; color: var(--text-soft); }
@media only screen and (min-width: 1024px){
    .nv-bento{ grid-template-columns: repeat(4, 1fr); }
    .nv-bento__tile--hero{ grid-column: span 2; grid-row: span 2; }
    .nv-bento__tile--wide{ grid-column: span 2; }
}

/* nv-tabs — премиум-табы с подчёркиванием (JS: [data-nv-tabs]) */
.nv-tabs{ display: flex; gap: var(--sp-1); border-bottom: 1px solid var(--line);
    overflow-x: auto; scrollbar-width: none; }
.nv-tabs::-webkit-scrollbar{ display: none; }
.nv-tabs__tab{ position: relative; flex: 0 0 auto; min-height: 46px; padding: 10px 16px; border: 0;
    background: none; font-family: inherit; font-size: 14.5px; font-weight: 700; color: var(--text-soft);
    cursor: pointer; transition: color .25s ease; }
.nv-tabs__tab::after{ content: ''; position: absolute; inset-inline: 12px; bottom: -1px; height: 3px;
    border-radius: var(--r-pill); background: var(--accent); transform: scaleX(0);
    transition: transform .3s ease; }
.nv-tabs__tab.is-on{ color: var(--dark-green); font-weight: 800; }
.nv-tabs__tab.is-on::after{ transform: scaleX(1); }
.nv-tabs__panel[hidden]{ display: none; }

/* nv-segment — сегмент-переключатель */
.nv-segment{ display: inline-flex; gap: 4px; padding: 4px; border-radius: var(--r-m);
    background: var(--bg-soft); border: 1px solid var(--line); }
.nv-segment__opt{ min-height: 40px; padding: 8px 16px; border: 0; border-radius: var(--r-s);
    background: none; font-family: inherit; font-size: 14px; font-weight: 700; color: var(--text-soft);
    cursor: pointer; transition: background-color .25s ease, color .25s ease, box-shadow .25s ease; }
.nv-segment__opt.is-on{ background: #fff; color: var(--dark-green); font-weight: 800;
    box-shadow: 0 3px 10px -4px rgba(1,40,36,.3); }

/* nv-filter-bar + nv-drawer */
.nv-filter-bar{ display: flex; align-items: center; gap: var(--sp-2); overflow-x: auto;
    padding: 4px; scrollbar-width: none; }
.nv-filter-bar::-webkit-scrollbar{ display: none; }
.nv-filter-bar .nv-chip{ flex: 0 0 auto; }
.nv-filter-bar__open{ flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px;
    min-height: 44px; padding: 0 16px; border-radius: var(--r-pill);
    border: 1px solid var(--brunswick); background: #fff; color: var(--brunswick);
    font-family: inherit; font-size: 14px; font-weight: 800; cursor: pointer;
    transition: background-color .25s ease; }
@media (hover:hover){ .nv-filter-bar__open:hover{ background: rgba(182,254,204,.2); } }
.nv-filter-bar__count{ font-size: 13.5px; font-weight: 700; color: var(--text-faint); white-space: nowrap; }
.nv-drawer{ position: fixed; inset: 0; z-index: var(--z-pop); visibility: hidden;
    transition: visibility .35s ease; }
.nv-drawer.is-open{ visibility: visible; }
.nv-drawer__overlay{ position: absolute; inset: 0; background: rgba(1,40,36,.55);
    opacity: 0; transition: opacity .35s ease; }
.nv-drawer.is-open .nv-drawer__overlay{ opacity: 1; }
.nv-drawer__panel{ position: absolute; top: 0; bottom: 0; inset-inline-end: 0;
    width: min(420px, 92vw); display: flex; flex-direction: column;
    background: #fff; box-shadow: var(--shadow-card);
    transform: translateX(-104%); transition: transform .35s ease; }
[dir="ltr"] .nv-drawer__panel{ transform: translateX(104%); }
.nv-drawer.is-open .nv-drawer__panel{ transform: none; }
.nv-drawer__head{ display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2);
    padding: var(--sp-4); border-bottom: 1px solid var(--line); }
.nv-drawer__head b{ font-size: 18px; font-weight: 800; color: var(--dark-green); }
.nv-drawer__body{ flex: 1 1 auto; overflow-y: auto; padding: var(--sp-4);
    display: flex; flex-direction: column; gap: var(--sp-4); }
.nv-drawer__foot{ display: flex; gap: var(--sp-2); padding: var(--sp-4); border-top: 1px solid var(--line); }
@media only screen and (max-width: 767px){
    .nv-drawer__panel{ top: auto; inset-inline: 0; width: 100%; max-height: 88vh;
        border-radius: var(--r-l) var(--r-l) 0 0; transform: translateY(104%); }
    [dir="ltr"] .nv-drawer__panel{ transform: translateY(104%); }
    .nv-drawer.is-open .nv-drawer__panel{ transform: none; }
}

/* nv-sticky-nav — липкая навигация по секциям (JS: [data-nv-spy]) */
.nv-sticky-nav{ position: sticky; top: var(--header-height, 84px); z-index: 50;
    display: flex; gap: var(--sp-1); padding: 8px 4px; overflow-x: auto; scrollbar-width: none;
    background: rgba(246,253,248,.92); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--line); }
.nv-sticky-nav::-webkit-scrollbar{ display: none; }
.nv-sticky-nav a{ flex: 0 0 auto; min-height: 40px; display: inline-flex; align-items: center;
    padding: 0 14px; border-radius: var(--r-pill); font-size: 13.5px; font-weight: 700;
    color: var(--text-soft); text-decoration: none; transition: background-color .25s ease, color .25s ease; }
@media (hover:hover){ .nv-sticky-nav a:hover{ background: var(--bg-tint); color: var(--dark-green); } }
.nv-sticky-nav a.is-on{ background: var(--dark-green); color: var(--celadon); }

/* nv-story — сторителлинг с чередованием */
.nv-story{ display: grid; grid-template-columns: 1fr; gap: var(--sp-4); align-items: center; }
.nv-story__ph{ margin: 0; overflow: hidden; border-radius: var(--r-xl); aspect-ratio: 4 / 3; background: var(--bg-tint); }
.nv-story__ph img{ width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
@media (hover:hover){ .nv-story:hover .nv-story__ph img{ transform: scale(1.04); } }
.nv-story__body{ display: flex; flex-direction: column; gap: var(--sp-2); }
.nv-story__body h3{ margin: 0; font-size: var(--fs-h3); font-weight: 800; color: var(--dark-green); }
.nv-story__body p{ margin: 0; font-size: 15.5px; line-height: 1.7; color: var(--text-soft); max-width: 56ch; }
@media only screen and (min-width: 768px){
    .nv-story{ grid-template-columns: 1.1fr 1fr; gap: var(--sp-6); }
    .nv-story--flip .nv-story__ph{ order: 2; }
}

/* nv-cta-band — акцентная CTA-полоса */
.nv-cta-band{ position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column;
    gap: var(--sp-4); padding: clamp(26px, 4vw, 48px); border-radius: var(--r-xl);
    background: var(--bg-dark); color: var(--celadon); box-shadow: var(--shadow-card); }
.nv-cta-band__line{ position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%;
    opacity: .16; pointer-events: none; }
.nv-cta-band__body{ position: relative; z-index: 1; display: flex; flex-direction: column; gap: var(--sp-2); }
.nv-cta-band__ttl{ margin: 0; font-size: clamp(22px, 2vw + 12px, 34px); font-weight: 800; color: var(--celadon); line-height: 1.2; }
.nv-cta-band__sub{ margin: 0; font-size: 16px; line-height: 1.6; color: rgba(182,254,204,.82); max-width: 56ch; }
.nv-cta-band__act{ position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: var(--sp-2); }
@media only screen and (min-width: 768px){
    .nv-cta-band{ flex-direction: row; align-items: center; justify-content: space-between; }
}

/* ---------- МИКРО / СОСТОЯНИЯ ------------------------------------------ */
/* nv-toast (JS: nvToast('הודעה')) */
.nv-toast{ position: fixed; z-index: var(--z-tip); inset-inline: 0; bottom: calc(20px + env(safe-area-inset-bottom));
    display: flex; justify-content: center; pointer-events: none; }
.nv-toast__in{ display: inline-flex; align-items: center; gap: 8px; max-width: min(92vw, 480px);
    padding: 12px 18px; border-radius: var(--r-pill); background: var(--bg-dark); color: var(--celadon);
    font-size: 14px; font-weight: 700; box-shadow: var(--shadow-card);
    opacity: 0; transform: translateY(16px); transition: opacity .3s ease, transform .3s ease; }
.nv-toast.is-show .nv-toast__in{ opacity: 1; transform: none; }
.nv-toast__in svg{ width: 16px; height: 16px; color: var(--accent); flex: 0 0 auto; }

/* nv-skeleton — загрузка (shimmer через transform) */
.nv-skeleton{ position: relative; overflow: hidden; border-radius: var(--r-s); background: rgba(1,40,36,.07); }
.nv-skeleton::after{ content: ''; position: absolute; inset: 0;
    background: linear-gradient(100deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.65) 50%, rgba(255,255,255,0) 70%);
    transform: translateX(100%); animation: nvShimmer 1.4s ease-in-out infinite; }
[dir="ltr"] .nv-skeleton::after{ transform: translateX(-100%); }
@keyframes nvShimmer{ to{ transform: translateX(-100%); } }
.nv-skeleton--text{ height: 14px; }
.nv-skeleton--title{ height: 22px; width: 60%; }
.nv-skeleton--photo{ aspect-ratio: 16 / 10; border-radius: var(--r-l); }
.nv-skeleton--pill{ height: 38px; width: 110px; border-radius: var(--r-pill); }

/* nv-empty — пустое состояние */
.nv-empty{ display: flex; flex-direction: column; align-items: center; gap: var(--sp-2);
    text-align: center; padding: var(--sp-7) var(--sp-4); border-radius: var(--r-l);
    border: 1px dashed rgba(1,40,36,.2); background: var(--bg-soft); }
.nv-empty__ic{ display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
    background: var(--bg-tint); color: var(--brunswick); }
.nv-empty__ic svg{ width: 24px; height: 24px; }
.nv-empty b{ font-size: 17px; color: var(--dark-green); }
.nv-empty span{ font-size: 14px; color: var(--text-soft); max-width: 40ch; }

/* nv-avatar */
.nv-avatar{ display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
    overflow: hidden; background: var(--bg-tint); color: var(--brunswick); font-weight: 900; font-size: 16px;
    border: 2px solid #fff; box-shadow: 0 2px 8px -2px rgba(1,40,36,.25); flex: 0 0 auto; }
.nv-avatar img{ width: 100%; height: 100%; object-fit: cover; }
.nv-avatar--s{ width: 32px; height: 32px; font-size: 13px; }
.nv-avatar--l{ width: 60px; height: 60px; font-size: 21px; }
.nv-avatar-group{ display: inline-flex; }
.nv-avatar-group .nv-avatar + .nv-avatar{ margin-inline-start: -12px; }

/* nv-icon-btn */
.nv-icon-btn{ display: inline-grid; place-items: center; width: 44px; height: 44px; border: 0;
    border-radius: 50%; background: var(--bg-soft); color: var(--brunswick); cursor: pointer;
    transition: background-color .25s ease, transform .25s ease; }
.nv-icon-btn svg{ width: 20px; height: 20px; }
@media (hover:hover){ .nv-icon-btn:hover{ background: var(--bg-tint); transform: scale(1.08); } }
.nv-icon-btn:active{ transform: scale(.94); }
.nv-icon-btn:disabled{ opacity: .4; cursor: default; }
.nv-icon-btn--dark{ background: rgba(182,254,204,.14); color: var(--celadon); }
@media (hover:hover){ .nv-icon-btn--dark:hover{ background: rgba(182,254,204,.28); } }

/* nv-badge-set — набор бейджей в ряд */
.nv-badge-set{ display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }

/* ---------- v2.1 reduced-motion ---------------------------------------- */
@media (prefers-reduced-motion: reduce){
    .nv-gallery__item img, .nv-gallery__all, .nv-masonry__item img, .nv-media-hover__video,
    .nv-hsplit, .nv-hsplit__ph, .nv-ticket, .nv-tabs__tab::after, .nv-segment__opt,
    .nv-drawer, .nv-drawer__overlay, .nv-drawer__panel, .nv-sticky-nav a,
    .nv-story__ph img, .nv-toast__in, .nv-icon-btn, .nv-bento__tile, .nv-bento__tile--photo img,
    .nv-lightbox, .nv-lightbox__thumb, .nv-stepper__btn{ transition: none; }
    .nv-skeleton::after{ animation: none; }
}