/* Дополнения образца поверх копии styles.css боевого сайта. */
.villa-badge {
  position: absolute; z-index: 30; right: 14px; bottom: 12px;
  font: 500 10px/1 Manrope, system-ui, sans-serif; letter-spacing: .18em; text-transform: uppercase;
  color: rgba(243, 239, 232, .45); pointer-events: none;
}
/* петля ветра: тот же слой и наезд, что у картинки (.scene-photo), видна только когда играет */
.scene-video { z-index: 1; opacity: 0; transition: opacity .8s ease; background: transparent; }
.scene-video.is-live { opacity: var(--scene-opacity); }
/* кадр синего часа темнее закатного — заголовку чуть больше тени */
.hero-word { text-shadow: 0 6px 40px rgba(8, 10, 20, .35); }
/* 14.10b: дом в финале целиком. Кадр 16:9: дом от 15.6 % (кончик крыши) до 96 % (ножка) — справа запас мал,
   поэтому на экранах уже 16:9 режем только СЛЕВА (позиция 100 %), наезд 4 % к точке справа — ножка не уходит. */
.scene-photo { object-position: 100% 58%; transform-origin: 82% 60%; }
/* портрет: свой кадр (дом по ширине, небо сверху, газон снизу), центр дома на 47 % высоты */
@media (max-aspect-ratio: 3/4) {
  .scene-photo { object-position: 50% 47%; transform-origin: 50% 47%; }
}

/* ═══ 14.10n: правки Вити — карточки убраны, меню главное, луна «вечер ↔ ночь» ═══ */
/* шапка: ниже от верха; колонки лого | меню | луна | контакты — меню с луной по центру */
.site-header {
  grid-template-columns: 1fr auto auto 1fr; grid-template-areas: "logo nav noch contact";
  column-gap: clamp(18px, 1.8vw, 30px); padding-top: clamp(30px, 4.6vh, 52px);
}
.site-logo { grid-area: logo; }
.site-nav { grid-area: nav; display: flex; gap: clamp(26px, 2.6vw, 52px); }
.site-contact { grid-area: contact; }
/* меню: антиква Cormorant Garamond (вшита), капитель, тёплое латунное свечение */
.site-nav a {
  font-family: var(--serif); font-weight: 500; font-size: clamp(1.12rem, 0.55rem + 0.82vw, 1.62rem);
  letter-spacing: 0.15em; line-height: 1; padding: 8px 0 10px; color: #f4ebde;
  text-shadow: 0 0 18px rgba(236, 200, 146, 0.30), 0 1px 2px rgba(10, 8, 6, 0.55), 0 2px 16px rgba(10, 8, 6, 0.45);
  transition: color 420ms ease, text-shadow 520ms ease, letter-spacing 520ms var(--ease-out);
}
/* разделитель — латунный ромбик между пунктами */
.site-nav a + a::before {
  content: ""; position: absolute; left: calc(clamp(26px, 2.6vw, 52px) / -2 - 3px); top: 50%;
  width: 5px; height: 5px; margin-top: -3px; transform: rotate(45deg);
  background: linear-gradient(135deg, #f0d9ac, #b08d57); box-shadow: 0 0 8px rgba(240, 205, 150, 0.55); opacity: 0.75;
}
/* нить снизу — растёт от центра, латунный градиент со свечением */
.site-nav a::after {
  height: 1px; bottom: 0; transform-origin: 50% 50%;
  background: linear-gradient(90deg, transparent, #e9cf9c 22%, #fff1d2 50%, #e9cf9c 78%, transparent);
  box-shadow: 0 0 10px rgba(240, 205, 150, 0.8);
}
.site-nav a:hover, .site-nav a:focus-visible {
  color: #ffe9c4;
  text-shadow: 0 0 14px rgba(255, 214, 150, 0.85), 0 0 34px rgba(236, 190, 120, 0.55), 0 2px 16px rgba(10, 8, 6, 0.4);
}
.site-nav a:focus-visible { outline: none; }
/* луна / солнце */
.noch-knopka {
  grid-area: noch; position: relative; width: 44px; height: 44px; padding: 0; cursor: pointer;
  border-radius: 50%; border: 1px solid rgba(214, 190, 150, 0.55); color: #f0d9ac;
  background: rgba(20, 15, 11, 0.30); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  box-shadow: 0 0 16px rgba(236, 200, 146, 0.18);
  transition: border-color 300ms ease, box-shadow 400ms ease, transform 300ms var(--ease-out), background-color 300ms ease;
}
.noch-knopka:hover, .noch-knopka:focus-visible {
  border-color: rgba(255, 226, 176, 0.9); background: rgba(20, 15, 11, 0.45); transform: translateY(-1px);
  box-shadow: 0 0 22px rgba(255, 214, 150, 0.55), inset 0 0 10px rgba(255, 214, 150, 0.2);
}
.noch-knopka:focus-visible { outline: 2px solid rgba(255, 231, 190, 0.8); outline-offset: 3px; }
.noch-knopka .ik {
  position: absolute; left: 50%; top: 50%; width: 20px; height: 20px; margin: -10px 0 0 -10px;
  fill: currentColor; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round;
  filter: drop-shadow(0 0 5px rgba(255, 214, 150, 0.6));
  transition: opacity 600ms ease, transform 900ms var(--ease-out);
}
.noch-knopka .ik-luna { stroke: none; }
.noch-knopka .ik-solnce { fill: none; opacity: 0; transform: rotate(-90deg) scale(0.6); }
html[data-noch] .noch-knopka .ik-luna { opacity: 0; transform: rotate(90deg) scale(0.6); }
html[data-noch] .noch-knopka .ik-solnce { opacity: 1; transform: none; }

/* ночной слой: над вечером и видео (z 2), кроссфейд 1,2 с — только opacity.
   15.10: медленный наезд noch-naezd (scale 1→1.025, 26 с) УБРАН — Витя: «при переключении вся картинка дрожит».
   Замер (_tools/zamer_drozh.*): наезд шагал дом по 1 px каждый кадр (p95 0.97 px кадр↔кадр), а при втором включении
   ночь стартовала с места паузы (scale≠1) поверх вечера без наезда — двоение 0.9 px. Без наезда ≤0.1 px.
   Слои вечера и ночи — одна геометрия (.scene-photo, общий --scene-scale), двигается только листва в видео. */
.scene-noch { z-index: 2; opacity: 0; transition: opacity 1.2s ease; pointer-events: none; }
html[data-noch] .scene-noch.is-ready { opacity: var(--scene-opacity); }
/* 14.10n3: ночной ветер — над ночным кадром */
.scene-video-noch { z-index: 3; transition: opacity 1.2s ease; }
.scene-video-noch.is-live { opacity: 0; }
html[data-noch] .scene-video-noch.is-live { opacity: var(--scene-opacity); }
/* кулисы-ветки ночью — темнее и холоднее (видны только в начале прокрутки) */
.splitframe-img { transition: filter 1.2s ease; }
html[data-noch] .splitframe-img { filter: brightness(0.38) saturate(0.7) hue-rotate(-8deg); }
html[data-noch] .hero-word { text-shadow: 0 0 40px rgba(236, 200, 146, 0.25), 0 6px 40px rgba(4, 6, 14, 0.5); }

/* средние экраны: меню вторым рядом по центру */
@media (max-width: 1180px) {
  .site-header { grid-template-columns: 1fr auto auto; grid-template-areas: "logo noch contact" "nav nav nav"; row-gap: 18px; }
  .site-nav { display: flex; justify-self: center; }
}
/* телефон: лого + луна + «Связаться» сверху, меню — отдельной строкой под ними */
@media (max-width: 640px) {
  .site-header { padding: 20px 16px 0; column-gap: 10px; row-gap: 16px; }
  .site-nav { gap: 22px; }
  .site-nav a { font-size: 0.98rem; letter-spacing: 0.09em; padding: 6px 0 8px; font-weight: 600; }
  .site-nav a + a::before { left: -14px; width: 4px; height: 4px; margin-top: -2px; }
  .noch-knopka { width: 38px; height: 38px; }
  .noch-knopka .ik { width: 18px; height: 18px; margin: -9px 0 0 -9px; }
  .hero-title { top: 19vh; }
}
@media (max-width: 360px) { .site-nav { gap: 16px; } .site-nav a { font-size: 0.9rem; letter-spacing: 0.06em; } .site-nav a + a::before { left: -11px; } }
/* Windows «эффекты анимации: выкл» = prefers-reduced-motion: styles.css гасит ВСЕ переходы. Кроссфейд ночи —
   не движение, оставляем 1,2 с (иначе на слабых ПК ночь «щёлкает»). */
@media (prefers-reduced-motion: reduce) {
  .scene-noch, .scene-video-noch, .splitframe-img { transition-duration: 1.2s !important; }
  .noch-knopka .ik { transition-duration: 0.6s !important; }
}
/* телефон: меню одной строкой (проверено на 390 px) */
@media (max-width: 640px) {
  .site-nav { gap: 22px; white-space: nowrap; }
  .site-nav a { font-size: 0.86rem; letter-spacing: 0.07em; }
}
@media (max-width: 360px) { .site-nav { gap: 16px; } .site-nav a { font-size: 0.78rem; letter-spacing: 0.05em; } }

/* ═══ 15.10h (_edinyi_v1): пока ветки в кадре — никаких надписей. Появление/уход — WAAPI в hero.js (nadpisi),
   reduce-motion на этой машине гасит CSS-переходы. Здесь только скрытое состояние до html[data-nadpisi]. ═══ */
html:not([data-nadpisi]) :is(.site-nav a, .noch-knopka, .site-phone, .site-contact .btn, .villa-badge) { opacity: 0; }
/* 15.10h2 (Витя): маленький лого шапки, подзаголовок и подводка слева внизу — убраны совсем */
.site-logo { visibility: hidden; }
.hero-kicker, .intro-copy { display: none; }
html:not([data-nadpisi]) .site-header > * { pointer-events: none; }
.hero-word:not(.razbit) { opacity: 0; }
.hero-word .bk { display: inline-block; will-change: transform, opacity; }
.curtain-logo { visibility: hidden; }   /* загрузочная кулиса — без надписи, только линия */
/* подсказка — одна тонкая «капля» внизу, без текста; уходит с первых пикселей прокрутки */
.scroll-hint { opacity: var(--hint-opacity, 1); }
.scroll-hint span { height: 56px; background: rgba(243, 239, 232, 0.16); }