/* «Голубые озёра» — страницы разделов в виде одобренной главной (13.10.2026). Грузится последним, после stil.css и
   stranicy.css (их перекрасил _ishodniki/edinyy_vid.py): тёмные секции — сине-серый камень пола терм, светлые — крем
   стен, кнопки — дубовые рейки, заголовки — Cormorant, как на главной. Шапка, меню и подвал — obshchiy.css. */

body { background: var(--kamen-temn); }

/* ───────── фон секций ───────── */
.ryab, .hero {
  color: #eef3f6;
  background:
    radial-gradient(70% 55% at 12% 0%, rgba(127, 160, 190, .26), rgba(127, 160, 190, 0) 70%),
    radial-gradient(50% 60% at 92% 96%, rgba(167, 118, 79, .16), rgba(167, 118, 79, 0) 70%),
    var(--mramor), linear-gradient(180deg, #34444f, #24303a);
}
.pesok { background-color: var(--krem); color: var(--chernila); }

/* ───────── заголовки, как на главной ───────── */
.metka { font-weight: 600; font-size: 12px; letter-spacing: .22em; }
.pesok .metka, .forma .metka { color: var(--dub); }
.zag em, .hero-fraza em, .podzag em, .dm-zag em, .s-nazv em { font-style: italic; font-weight: 400; color: #d4e7f7; }
.pesok .zag em, .pesok .podzag em, .okno .dm-zag em, .forma .zag em { color: var(--dub); text-shadow: none; }
.vvod { font-size: 18px; }

/* ───────── кнопки — дубовые, как «Забронировать» на главной ───────── */
.knopka, .pesok .knopka:not(.knopka-kontur), .forma .knopka:not(.knopka-kontur), .okno .knopka:not(.knopka-kontur) {
  min-height: 52px; padding: 0 28px; border-radius: 999px;
  color: #fff8ef;
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .06) 0 4px, rgba(0, 0, 0, .08) 4px 6px), linear-gradient(180deg, #b47844, #8a5530);
  box-shadow: inset 0 1px 0 rgba(255, 236, 210, .35), 0 12px 26px -12px rgba(60, 34, 16, .85);
}
.knopka:hover, .pesok .knopka:not(.knopka-kontur):hover, .forma .knopka:not(.knopka-kontur):hover, .okno .knopka:not(.knopka-kontur):hover {
  background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .06) 0 4px, rgba(0, 0, 0, .08) 4px 6px), linear-gradient(180deg, #c08350, #95603a);
  transform: translateY(-2px);
}
.knopka-kontur {
  color: var(--led); background: rgba(244, 251, 255, .08); box-shadow: inset 0 0 0 1px rgba(244, 251, 255, .5);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.knopka-kontur:hover { background: rgba(244, 251, 255, .18); box-shadow: inset 0 0 0 1px rgba(244, 251, 255, .8); }
.pesok .knopka-kontur, .okno .knopka-kontur, .forma .knopka-kontur { color: var(--chernila); background: transparent; box-shadow: inset 0 0 0 1px rgba(94, 58, 31, .4); }
.pesok .knopka-kontur:hover, .okno .knopka-kontur:hover, .forma .knopka-kontur:hover { background: rgba(154, 98, 54, .08); box-shadow: inset 0 0 0 1px var(--dub); }
.knopka-mal { min-height: 42px; padding: 0 20px; }
.knopka:disabled, .knopka[aria-disabled="true"] { opacity: .55; transform: none; }

/* ───────── первый экран страницы раздела ───────── */
.hero.rh { padding-top: calc(var(--shapka-h) + clamp(18px, 3vw, 40px)); }
.kroshki a:hover { color: #fff; }
.kroshki b { color: #d4e7f7; }
.hero-imya, .rh-imya { color: var(--led); }
.hero-imya .s1 { color: var(--led); }
.hero-imya .s2 { font-style: italic; font-weight: 400; color: #d4e7f7; text-shadow: 0 0 26px rgba(170, 215, 255, .35); }
.otrazh { display: none; }
.hero-fraza { color: var(--led); }
.rh-media { border-radius: 26px; box-shadow: 0 40px 80px -40px rgba(0, 0, 0, .8), 0 0 0 1px rgba(244, 251, 255, .14); }
.rh-media::after { background: linear-gradient(to top, rgba(20, 28, 34, .62), rgba(20, 28, 34, 0)); }

/* цифры и метки на камне; столбцы по ширине цифры — «от 6 000 ₽» в Cormorant шире прежней узкой */
.cifry { border-top-color: rgba(244, 251, 255, .16); }
@media (min-width: 761px) {
  .cifry { grid-template-columns: repeat(4, auto); justify-content: space-between; column-gap: 26px; }
  .cifry span { max-width: 12em; }
}
.status.skoro { background: rgba(169, 195, 224, .14); color: #d4e7f7; border-color: rgba(169, 195, 224, .45); }

/* часы базы («Перед поездкой»): «00:00–08:00» в Cormorant не влезал в четверть — столбцы по ширине времени */
.gp-chasy { grid-template-columns: repeat(4, auto); }
.gp-chasy b { font-size: clamp(34px, 3.3vw, 48px); }
@media (max-width: 860px) {
  .gp-chasy { grid-template-columns: repeat(2, auto); }
  .gp-chasy b { font-size: clamp(26px, 7vw, 40px); }
}
@media (max-width: 345px) {
  .knopka { white-space: normal; text-align: center; line-height: 1.25; padding: 10px 18px; }
  .gp-chasy li { padding: 16px 12px; }
  .gp-chasy b { font-size: 22px; }
  .gp-chasy span { font-size: 11px; letter-spacing: .06em; }
}

/* ───────── формы и окна — тёплый крем вместо песка ───────── */
.okno-list { background: var(--krem-svet); color: var(--chernila); }
::selection { background: #d3e2f2; color: var(--nebo-chernila); }

/* согласие в формах (15.10.2026, запуск на голубыеозера45.рф): отмеченная галочка светится голубым — как LED терм */
.soglasie, .soglasie-pravila { margin: 0; font-size: 14.5px; line-height: 1.45; }
.soglasie { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; color: var(--chernila); }
.soglasie input {
  -webkit-appearance: none; appearance: none; flex: none; width: 22px; height: 22px; margin: 0; border-radius: 6px; cursor: pointer;
  background: #fff; border: 1.5px solid rgba(52, 42, 34, .28); transition: background .2s, border-color .2s, box-shadow .2s;
}
.soglasie input:hover { border-color: var(--goluboy-temn); }
.soglasie input:checked {
  border-color: var(--glub); box-shadow: 0 0 0 3px rgba(186, 226, 255, .55);
  background: var(--glub) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.4l3 3 6-6.6' fill='none' stroke='%23f4fbff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 15px no-repeat;
}
.soglasie input:focus-visible { outline: 2px solid var(--goluboy-temn); outline-offset: 3px; }
.soglasie span { padding-top: 1px; }
.soglasie-pravila { margin-top: -10px; color: var(--chernila-2); }
.soglasie a, .soglasie-pravila a { color: var(--goluboy-temn); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.soglasie a:hover, .soglasie-pravila a:hover { color: var(--dub); }

@media (max-width: 759px) {
  .hero.rh { padding-top: calc(var(--shapka-h) + 18px); }
  .vvod { font-size: 17px; }
  .knopka { min-height: 48px; padding: 0 22px; }
}