:root{
  /* Единый тёмно‑бежевый фон без "скачков" */
  --bg: #c5ae92;
  --surface: rgba(197,174,146,.96);
  --surface-2: rgba(197,174,146,.92);
  --text:#121212;
  --muted:#4b4b4b;
  --border: rgba(0,0,0,.10);
  --shadow: 0 10px 30px rgba(0,0,0,.08);
  --shadow-hover: 0 14px 44px rgba(0,0,0,.10);
  --radius: 18px;
  --max: 1280px;
  --accent:#111;
}
*{box-sizing:border-box}
html,body{height:100%}
/* Prevent layout shift when scrollbar appears/disappears */
html{overflow-y:scroll}
body{
  margin:0;
  /* Keep a single stable system font stack (prevents "jumping" fonts) */
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  background: var(--bg);
  color:var(--text);
  line-height:1.45;
}
a{color:inherit}
.container{max-width:var(--max); margin:0 auto; padding:0 20px}
.topbar{
  position:sticky; top:0; z-index:50;
  font-size:16px;
  /* Make header clearly separated (closer to original site) */
  background: var(--surface);
  border-bottom:1px solid rgba(0,0,0,.14);
  box-shadow: 0 8px 20px rgba(0,0,0,.06);
}

/* Главная: фото Кул Шариф в шапке (фон под контактами/меню) */
.topbar-hero{
  background:
    linear-gradient(rgba(197,174,146,.88), rgba(197,174,146,.88)),
    url("images/home_02.jpg");
  background-size: cover;
  background-position: center;
}

.topbar-hero .inner{padding:14px 0}
.topbar-hero .headerInfo{padding:0 0 12px}
.topbar .inner{display:flex; align-items:center; gap:14px; padding:16px 0}

/* Широкая шапка: меню + логотип + контакты в одну линию */
.topbar .inner.headerWide{
  flex-wrap:wrap;
  justify-content:space-between;
}
@media (min-width: 900px){
  .topbar .inner.headerWide{flex-wrap:nowrap;}
}
@media (min-width: 900px){
  .topbar .nav{margin-top:22px;}
}
.topbar .inner.headerWide .nav{flex:1 1 auto; min-width:0; margin-left:0}
.headerLogo{flex:0 0 auto; display:flex; align-items:center; justify-content:center; padding:2px 0}
.headerLogo img{display:block; height:40px; width:auto}

/* Контакты в шапке (inline) */
.headerInfo.headerInfoInline{
  border-top:0;
  padding:0;
  align-items:center;
  justify-content:flex-end;
}
.headerInfo.headerInfoInline .meta{justify-content:flex-end}
@media (max-width: 900px){
  .topbar .inner.headerWide .nav{min-width:0; flex-basis:100%}
  .headerLogo{order:3; width:100%; justify-content:flex-start}
  .headerInfo.headerInfoInline{order:4; width:100%; justify-content:flex-start}
  .headerInfo.headerInfoInline .meta{justify-content:flex-start}
}

/* Контакты/заметка в шапке (перенесено с главной) */
.headerInfo{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  padding:0 0 10px;
  border-top:1px solid rgba(0,0,0,.08);
}
.headerInfo .meta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  font-size:14px;
  color:rgba(0,0,0,.62);
}
.headerInfo .note{
  max-width:560px;
  font-size:12px;
  color:rgba(0,0,0,.58);
  text-align:right;
}
@media (max-width: 900px){
  .headerInfo{flex-direction:column; align-items:flex-start}
  .headerInfo .note{text-align:left; max-width:100%}
}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none}
.brandText{display:flex; flex-direction:column; line-height:1.05}
.brandTop,.brandBottom{font-size:12px; font-weight:600; opacity:.9}
.brandBottom{opacity:.85}

.brand .dot{width:36px; height:36px; border-radius:10px; background:transparent; border:1px solid rgba(0,0,0,.25); display:grid; place-items:center; flex:0 0 auto; box-shadow:none}
.brand .dot::before{content:"TP"; font-weight:800; font-size:16px; letter-spacing:.5px; color:rgba(0,0,0,.85)}
.brand .title{font-weight:800; letter-spacing:.2px; white-space:nowrap; font-size:18px}
.nav{margin-left:auto;display:flex;gap:14px;flex-wrap:nowrap;white-space:nowrap}
.nav a{
  text-decoration:none;
  font-weight:600;
  padding:10px 2px;
  position:relative;
  border:0;
}
/* Header nav closer to the original site's feel: simple links + underline */
.nav a::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:4px;
  height:2px;
  background:transparent;
  border-radius:2px;
}
.nav a[aria-current="page"]::after{background:rgba(0,0,0,.75)}
.nav a:hover::after{background:rgba(0,0,0,.35)}
.badge{
  font-size:12px; padding:4px 8px; border-radius:999px;
  background:rgba(0,0,0,.06); border:1px solid var(--border);
}

/* Главная: верхняя картинка (мягкая тень + чуть больше скругления) */
.home-banner{
  margin:18px 0 8px;
  border-radius: 22px;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.10);
  box-shadow: 0 18px 52px rgba(0,0,0,.12);
}
.home-banner img{
  display:block;
  width:100%;
  height:323px;
  object-fit:cover;
  filter: brightness(.92) contrast(1.05) saturate(1.05);
}
@media (min-width:900px){
  .home-banner img{height:361px}
}
.hero{padding:34px 0 18px}
.heroCard{
  background: var(--surface-2);
  border:1px solid var(--border);
  border-radius: calc(var(--radius) + 8px);
  box-shadow: var(--shadow);
  padding:26px;
  display:grid; gap:14px;
}
.hero h1{margin:0; font-size:28px; letter-spacing:.35px}
.hero .meta{display:flex; gap:12px; flex-wrap:wrap; color:var(--muted)}
.grid{
  display:grid; gap:16px;
  grid-template-columns: repeat(12, 1fr);
  padding:14px 0 40px;
}

/* Home reviews inside grid */
.grid > #homeReviews{grid-column: span 12;}

/* Главная: блок отзывов внутри grid — на всю ширину */

.card{
  grid-column: span 12;
  background: var(--surface);
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding:18px;
  transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover{transform: translateY(-2px); box-shadow: var(--shadow-hover)}
@media (min-width:900px){
  .card.half{grid-column: span 6}
  .card.third{grid-column: span 4}
}
.card h2{margin:0 0 10px; font-size:18px}
.card p{margin:0 0 10px}
.card ul{margin:0; padding-left:18px}

/* Image blocks */
.media{
  border-radius: calc(var(--radius) - 6px);
  overflow:hidden;
  border:1px solid var(--border);
  background:rgba(255,255,255,.35);
  margin-bottom:12px;
}
.media img{display:block; width:100%; height:228px; object-fit:cover; filter: brightness(0.78) contrast(1.06) saturate(1.04);}
@media (min-width:900px){
  .media img{height:247px}
}

/* 3 фото в карточке (мини-галерея) */
.media.gallery3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  padding:10px;
  background:rgba(255,255,255,.25);
  border:1px solid rgba(0,0,0,.08);
  border-radius:16px;
}
.media.gallery3 img{height:114px; border-radius:14px;}
@media (min-width:900px){
  .media.gallery3 img{height:133px}
}

/* Вставка скриншотов разделов (1-в-1) */
.contentShot{display:block; width:100%; height:auto; border-radius:12px; border:1px solid rgba(0,0,0,.12); box-shadow:0 8px 20px rgba(0,0,0,.06); margin:12px 0;}

/* Feature cards (like original: 4 small tiles) */
.features{display:grid; gap:12px; grid-template-columns:repeat(12,1fr)}
.feature{grid-column: span 12; background:rgba(17,17,17,.78); color:#fff; border-radius:14px; padding:16px; border:1px solid rgba(255,255,255,.08)}
.feature .icon{width:34px; height:34px; margin-bottom:10px; opacity:.95}
.feature p{margin:0; color:rgba(255,255,255,.9)}
@media (min-width:900px){
  .feature{grid-column: span 3}
}
.small{font-size:13px; color:var(--muted)}
hr.sep{border:none; border-top:1px solid var(--border); margin:14px 0}
.button{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:12px;
  border:1px solid rgba(0,0,0,.18);
  background:rgba(255,255,255,.35);
  text-decoration:none; font-weight:700;
  cursor:pointer;
  transition: background .18s ease, transform .18s ease;
}
.button:hover{background:rgba(255,255,255,.5); transform: translateY(-1px)}

.formRow{display:grid; gap:10px; grid-template-columns: repeat(12, 1fr)}
.field{grid-column: span 12}
@media (min-width:900px){
  .field.third{grid-column: span 4}
}

/*
  Формы могут быть вставлены как отдельной секцией в <main>,
  либо как элемент внутри уже существующей .grid.
  Если секция .formsBlock попадает внутрь .grid без явного span,
  браузер кладёт её в 1 колонку (из 12) — из‑за этого поля сжимаются.
  Делаем секцию на всю ширину сетки.
*/
.formsBlock{grid-column: 1 / -1;}
.formsBlock > .grid{padding-top:0;}
label{display:block; font-size:12px; color:var(--muted); margin-bottom:6px}
input, textarea, select{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.55);
  outline:none;
}
textarea{min-height:110px; resize:vertical}
.footer{
  border-top:1px solid var(--border);
  background:var(--bg);
  padding:18px 0;
}
.footer .row{display:flex; gap:14px; flex-wrap:wrap; align-items:center; justify-content:space-between}
.notice{font-size:12px; color:var(--muted)}
.toast{
  position:fixed; right:18px; bottom:18px;
  background:rgba(17,17,17,.92);
  color:#fff;
  padding:12px 14px;
  border-radius:14px;
  max-width:340px;
  box-shadow: 0 16px 50px rgba(0,0,0,.25);
  display:none;
}
.toast.show{display:block}


.docText{margin-top:12px; padding:14px; background:var(--surface); border:1px solid rgba(0,0,0,.15); border-radius:10px; line-height:1.55;}
.docText p{margin:10px 0;}

/* Program tables (match the original “document” look) */
.docText .docTable{width:100%; border-collapse:collapse; margin:10px 0 14px; font-size:14px;}
.docText .docTable th,.docText .docTable td{border:1px solid #1d1d1d; padding:10px 12px; vertical-align:top;}
.docText .docTable th{font-weight:700; text-align:left; background:var(--surface);}
.docText .docTable td:first-child{width:120px; font-weight:700; text-align:center; white-space:nowrap;}
.docText .docTable td{white-space:normal;}

/* Home: two hero photos like on the original site */
.homePhotos{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:18px 0 10px;}
.homePhotos img{width:100%; height:304px; object-fit:cover; border-radius:16px; border:1px solid rgba(0,0,0,.12);  filter: brightness(0.78) contrast(1.06) saturate(1.04);;
}
@media (max-width: 820px){
  .homePhotos{grid-template-columns:1fr;}
  .homePhotos img{height:247px;}
}

/* "Также рекомендуем" (как в оригинале) */
.recommend{margin-top:22px;}
.recommendTitle{text-align:center; font-weight:900; letter-spacing:.08em; margin:0;}
.recommendGrid{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:14px;}
.recommendCard{display:block; text-decoration:none; color:inherit; border:1px solid rgba(0,0,0,.15); border-radius:10px; overflow:hidden; background:rgba(239,226,208,.96);}
.recommendCard img{width:100%; height:219px; object-fit:cover; display:block;  filter: brightness(0.78) contrast(1.06) saturate(1.04);;
}
.recommendText{padding:10px 12px;}
.recommendName{font-size:14px; line-height:1.3;}
@media (max-width: 820px){
  .recommendGrid{grid-template-columns:1fr;}
  .recommendCard img{height:190px;}
}


/* ===== Adult tours (match original card layout) ===== */
.page-hero.center { text-align: center; }
.adult-features{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:16px;
  margin: 18px 0 22px;
}
.adult-feature{
  background:#2f3445;
  color:#fff;
  border-radius:16px;
  padding:18px 16px;
  min-height:130px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  border-left: 6px solid var(--accent);
}
.adult-feature-ic{ font-size:40px; line-height:1; margin-bottom:10px; opacity:.95; }
.adult-feature-txt{ font-size:14px; line-height:1.35; opacity:.95; }

.adult-tours-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:18px;
  margin: 8px 0 34px;
}
.adult-tour-card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:0;
  overflow:hidden;
}
.adult-tour-image{ display:block; background:#eee; }
.adult-tour-image img{
  width:100%;
  height:238px;
  object-fit:cover;
  display:block;
  filter: brightness(0.78) contrast(1.06) saturate(1.04);;
}
.adult-tour-title{
  margin:0;
  padding:12px 12px 10px;
  font-size:16px;
  font-weight:600;
  line-height:1.25;
  text-align:center;
}
.adult-tour-title a{ color:inherit; text-decoration:none; }
.adult-tour-footer{
  display:flex;
  justify-content:space-between;
  align-items:stretch;
  gap:10px;
  padding:0;
}
.adult-tour-meta{
  background:#2f3445;
  color:#fff;
  padding:10px 12px;
  flex:1;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
}
.meta-row{ display:flex; align-items:center; gap:8px; font-size:14px; }
.meta-ic{ opacity:.9; width:18px; display:inline-flex; justify-content:center; }
.adult-tour-btn{
  background: var(--accent);
  color:#fff;
  font-weight:700;
  letter-spacing:.02em;
  text-decoration:none;
  padding: 0 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:140px;
}
.adult-tour-btn:hover{ filter:brightness(.95); }

@media (max-width: 1024px){
  .adult-features{ grid-template-columns: repeat(2, minmax(0,1fr)); }
  .adult-tours-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px){
  .adult-features{ grid-template-columns: 1fr; }
  .adult-tours-grid{ grid-template-columns: 1fr; }
  .adult-tour-image img{ height:209px; }
}

/* ===== Tour program tables (doc import) ===== */
.tour-doc{ margin-top: 14px; }
.tour-doc p{ margin: 8px 0; }
.tour-doc table{
  width:100%;
  border-collapse:collapse;
  margin: 14px 0;
  font-size:14px;
}
.tour-doc table td, .tour-doc table th{
  border:1px solid rgba(0,0,0,.35);
  padding:8px 10px;
  vertical-align:top;
}
.tour-doc table tr:nth-child(1) td{
  font-weight:600;
}

/* ===== Hotels table (with photos, compact) ===== */
.hotels-doc{margin-top:14px;}
.hotels-doc .hotels-note{color:#b02a2a; font-weight:700; margin:6px 0 10px;}
.hotels-doc table{width:100%; border-collapse:collapse; font-size:14px;}
.hotels-doc th, .hotels-doc td{border:1px solid #1d1d1d; padding:10px 12px; vertical-align:top;}
.hotels-doc th{font-weight:700; text-align:left; background:rgba(239,226,208,.96);}
.hotels-doc .hotel-title{font-weight:800; background:rgba(0,0,0,.04);}
.hotels-doc .hotel-cell{display:flex; gap:14px; align-items:flex-start;}
.hotels-doc .hotel-photo{width:220px; height:133px; object-fit:cover; border-radius:14px; border:1px solid rgba(0,0,0,.18); flex:0 0 auto;}
.hotels-doc .hotel-text{line-height:1.45;}
.hotels-doc td:nth-child(2){white-space:nowrap;}
.hotels-doc td:nth-child(3){white-space:nowrap;}
.hotels-doc td:nth-child(4){white-space:nowrap;}
@media (max-width: 820px){
  .hotels-doc .hotel-cell{flex-direction:column;}
  .hotels-doc .hotel-photo{width:100%; height:190px;}
  .hotels-doc td:nth-child(2), .hotels-doc td:nth-child(3), .hotels-doc td:nth-child(4){white-space:normal;}
}


.yearsStrong{font-weight:800;}
.headerInfo .meta a{color:inherit; text-decoration:none; border-bottom:1px solid rgba(0,0,0,.25);}
.headerInfo .meta a:hover{border-bottom-color: rgba(0,0,0,.55);}


/* Two-card grid (Excursions & Museums landing) */
.twoCards{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
  margin-top: 26px;
}
@media (max-width: 900px){
  .twoCards{ grid-template-columns: 1fr; }
}

/* ===== Scoped: make ONLY "Экскурсии и музеи" twoCards compact (do not affect other pages) ===== */
.page-exmuseums .twoCards{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: start;
}
.page-exmuseums .twoCards .card.third{
  /* override global .card.third { grid-column: span 4; } so cards can sit in one row */
  grid-column: auto;
  padding: 10px;
  min-height: auto;
}
.page-exmuseums .twoCards .cardImage{
  margin: 0;
  /* show full image (no cropping) */
  background: rgba(255,255,255,.14);
  border-radius: 14px;
  overflow: hidden;
}
.page-exmuseums .twoCards .cardImage img{
  width: 100%;
  height: auto;
  max-height: 228px;
  object-fit: contain;
  border-radius: 14px;
  display: block;
}

.page-exmuseums .twoCards .card.third h3{
  font-size: 16px;
  margin: 8px 0 6px;
}

.page-exmuseums .twoCards .card.third p{
  font-size: 13px;
  line-height: 1.35;
  margin: 0 0 6px;
}

.page-exmuseums .twoCards .card.third a{
  font-size: 13px;
}
.page-exmuseums .twoCards .cardBody h3{
  font-size: 14px;
  margin: 8px 0 4px;
}
.page-exmuseums .twoCards .cardBody p{
  font-size: 12px;
  line-height: 1.3;
  margin: 0 0 8px;
}
.page-exmuseums .twoCards .btn{
  padding: 6px 10px;
  font-size: 12px;
}
@media (max-width: 720px){
  .page-exmuseums .twoCards{
    grid-template-columns: 1fr;
  }
}

/* ===== EXMUSEUMS: make cards look like homepage cards (image cover, neat radius) ===== */
.page-exmuseums .twoCards{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}
.page-exmuseums .twoCards .card.third{
  padding: 18px;
}
.page-exmuseums .twoCards .media{
  height: 300px;
  /* Taller cover so photos read better (more image visible vertically) */
  border-radius: 18px;
  overflow: hidden;
  margin: 0 0 12px;
}
.page-exmuseums .twoCards .media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

@media (max-width: 900px){
  .page-exmuseums .twoCards{ grid-template-columns: 1fr; }
}

/* FINAL FIX — small cards only for excursions-museums */
.excursions-museums .cards {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
}
.excursions-museums .card {
  padding:14px;
}

/* Image: show the FULL original photo (no cropping) and make the frame hug it */
.excursions-museums .card .cardImage{
  background: rgba(255,255,255,0.12);
  border-radius: 16px;
  padding: 10px;
  margin-bottom: 12px;
  height: 228px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.excursions-museums .card .cardImage img{
  display:block;
  height:100%;
  width:auto;
  max-width:100%;
  max-height:100%;
  border-radius: 12px;
}

@media (max-width: 700px){
  .excursions-museums .card .cardImage{ height: 200px; }
}

/* EXTRA TALL — excursions-museums cards */
.excursions-museums .card-cover{
  height:247px;
}

/* LOGO VARIANT B */

.brand .dot{
  width:36px; height:36px;
  border-radius:10px;
  background:#111;
  box-shadow:none;
  display:grid; place-items:center;
}
.brand .dot::before{
  content:"TP";
  font-weight:800;
  font-size:16px;
  color:#fff;
}

@media (max-width:520px){.brand .title{white-space:normal}}


/* Diplomas grid (About page) */
.staffGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:22px;
  margin: 14px 0 6px;
}
.staffCard{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:16px 14px;
  border-radius:16px;
  background: rgba(255,255,255,.28);
  box-shadow: 0 10px 26px rgba(0,0,0,.10);
}
.staffPhoto{
  width:132px;
  height:132px;
  border-radius:999px;
  object-fit:cover;
  box-shadow:0 10px 26px rgba(0,0,0,.14);
}
.staffName{
  margin-top:12px;
  font-weight:800;
  letter-spacing:.2px;
}
.staffRole{
  margin-top:6px;
  opacity:.95;
}
@media (max-width: 920px){
  .staffGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .staffGrid{ grid-template-columns: 1fr; }
  .staffPhoto{ width:140px; height:140px; }
}

.diplomas{
  display:flex;
  flex-wrap:wrap;
  gap:22px;
  justify-content:center;
  margin-top:32px;
}
.diplomas a{
  display:block;
  line-height:0;
}
.diplomas img{
  height:171px;
  width:auto;
  max-width:100%;
  border-radius:8px;
  box-shadow:0 8px 22px rgba(0,0,0,.14);
  transition:transform .15s ease, box-shadow .15s ease;
}
.diplomas a:hover img{
  transform:translateY(-2px);
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
@media (max-width: 720px){
  .diplomas img{ height:143px; }
}

/* --- Lead/Express forms block --- */
.formsBlock{margin-top:22px}

/* --- Star rating widgets (Reviews) --- */
.ratingGroup{margin-top:12px; padding-top:10px; border-top:1px solid rgba(0,0,0,.08)}
.ratingItem{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 0}
.ratingItem .label{font-size:14px; opacity:.9}

.stars{display:inline-flex; flex-direction:row-reverse; gap:6px}
.stars input{position:absolute; opacity:0; pointer-events:none}
.stars label{
  width:22px; height:22px;
  display:inline-grid; place-items:center;
  cursor:pointer;
  border-radius:6px;
  border:1px solid rgba(0,0,0,.12);
  background:rgba(255,255,255,.7);
}
.stars label::before{content:"★"; font-size:16px; line-height:1; opacity:.35}
.stars input:checked ~ label::before{opacity:1}
.stars label:hover::before,
.stars label:hover ~ label::before{opacity:1}
.stars label:hover{border-color:rgba(0,0,0,.2)}

@media (max-width: 520px){
  .ratingItem{flex-direction:column; align-items:flex-start}
}


/* --- FIX: formsBlock layout (prevent "narrow column" / broken grid) --- */
.formsBlock{width:100%}
.formsBlock > .grid{
  grid-template-columns: 1fr;
  padding: 14px 0 40px;
}
.formsBlock > .grid > .card{grid-column:auto}
@media (min-width:900px){
  .formsBlock > .grid{grid-template-columns: 1fr 1fr;}
  .formsBlock > .grid > .card{grid-column:auto}
}


/* --- Visual enhancements merged --- */

/* Visual-only enhancements (NO content/structure changes) */
/* Depth & layers */
.card, .card-wrap, .form, .form-wrap, .formsBlock, .section, .panel {
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  border-radius: 14px;
}

/* Subtle separation */
.section {
  margin-bottom: 24px;
}

/* Buttons: same color, more weight */
button, .btn, input[type="submit"] {
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
button:hover, .btn:hover, input[type="submit"]:hover {
  transform: translateY(-1px);
  filter: brightness(0.95);
  box-shadow: 0 10px 22px rgba(0,0,0,.16);
}

/* Forms focus */
input:focus, textarea:focus, select:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(0,0,0,.08);
}

/* Cards hover */
.card:hover, .panel:hover {
  box-shadow: 0 12px 28px rgba(0,0,0,.10);
}

/* Preserve colors: no color changes */


/* --- Micro accent: Olive (#4F5B3A) --- */
/* Menu active underline */
nav a.active, nav a:hover {
  border-bottom: 2px solid #4F5B3A;
}

/* Form focus accent */
input:focus, textarea:focus, select:focus {
  box-shadow: 0 0 0 2px rgba(79, 91, 58, 0.35);
}

/* Buttons hover accent (no fill change) */
button:hover, .btn:hover, input[type="submit"]:hover {
  box-shadow: 0 10px 22px rgba(79, 91, 58, 0.25);
}


/* --- Card layout fixes: align buttons to bottom --- */
.card, .panel {
  display: flex;
  flex-direction: column;
}

.card .btn, .panel .btn,
.card button, .panel button {
  margin-top: auto;
}

/* --- Slightly stronger olive micro-accent (still subtle) --- */
.card:hover {
  box-shadow: 0 14px 32px rgba(79, 91, 58, 0.18);
}


/* --- Align all "Подробнее" buttons across cards (visual-only) --- */
.card, .card.third, .card.full, .panel {
  display: flex;
  flex-direction: column;
}

/* If a card has an inner body wrapper, make it stretch */
.card .cardBody, .card .content, .card .body, .card .card-body {
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Push "Подробнее" style buttons to the bottom of the card/body */
.card a.button, .card a.btn,
.card .button, .card .btn,
.panel a.button, .panel a.btn,
.panel .button, .panel .btn {
  margin-top: auto;
  align-self: flex-start;
}


/* --- Micro texts (service notes) --- */
.microNote, .microHint {
  font-size: 12px;
  line-height: 1.35;
  opacity: 0.78;
  margin-top: 10px;
}
.microNote { max-width: 520px; }
.microHint { margin-top: 8px; }

@media (max-width: 640px) {
  .microNote, .microHint { font-size: 11px; }
}


/* --- Reviews section --- */
.sectionHead { margin-bottom: 14px; }
.reviewsGrid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}
.reviewCard {
  border-radius: 14px;
  padding: 16px;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
  display: flex;
  flex-direction: column;
  min-height: 120px;
}
.reviewTop { display: flex; flex-direction: column; gap: 6px; }
.reviewTitle { font-weight: 700; }
.reviewMeta { font-size: 12px; opacity: .75; }
.reviewActions { margin-top: auto; padding-top: 12px; }
.centerActions { display: flex; justify-content: center; margin-top: 16px; }

@media (max-width: 980px) {
  .reviewsGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .reviewsGrid { grid-template-columns: 1fr; }
}


/* --- Reviews (scans + form) --- */
.reviewsLayout{
  display:grid;
  /* форма заметно шире (визуально), без изменения структуры */
  grid-template-columns: .78fr 1.22fr;
  gap: 22px;
  align-items:start;
}

@media (min-width: 1100px){
  .reviewsLayout{ grid-template-columns: .72fr 1.28fr; }
}
.reviewsLeft, .reviewsRight{
  border-radius:14px;
  padding:16px;
  box-shadow: 0 8px 24px rgba(0,0,0,.06);
}
.reviewsH1{ margin: 0 0 6px; }
.reviewsH2{ margin: 0 0 12px; }

.reviewsGallery{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.reviewThumb{
  position: relative;
  display:block;
  border-radius: 12px;
  overflow:hidden;
  box-shadow: 0 8px 18px rgba(0,0,0,.08);
  transform: translateY(0);
  transition: transform .15s ease, box-shadow .15s ease;
}
.reviewThumb:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(0,0,0,.12);
}
.reviewThumb img{
  width:100%;
  /* уменьшаем превью примерно на 20% */
  height: 129px;
  object-fit: cover;
  display:block;
}
.reviewBadge{
  position:absolute;
  left:10px;
  bottom:10px;
  padding:6px 10px;
  border-radius: 999px;
  font-size: 12px;
  background: rgba(255,255,255,.85);
  color: rgba(0,0,0,.8);
  backdrop-filter: blur(4px);
}

/* Reviews form — align labels and fields neatly */
.reviewForm .formRow{
  display:grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 14px;
  align-items:center;
  margin-bottom: 12px;
}
.reviewForm .formRow > label{
  margin: 0;
  font-size: 13px;
  line-height: 1.2;
}
.reviewForm .formRow.isTextarea{ align-items:start; }
.reviewForm .formRow.isTextarea textarea{ min-height: 120px; }

.ratingRows{ display:flex; flex-direction:column; gap: 10px; margin: 10px 0 14px; }
.ratingRow{
  display:grid;
  grid-template-columns: 180px minmax(0, 1fr);
  align-items:center;
  gap: 14px;
}
.ratingRow > span{ font-size: 13px; color: rgba(0,0,0,.78); }
.ratingRow .stars{ justify-self:start; }

@media (max-width: 980px){
  .reviewForm .formRow{ grid-template-columns: 160px minmax(0, 1fr); }
  .ratingRow{ grid-template-columns: 160px minmax(0, 1fr); }
}
@media (max-width: 640px){
  .reviewForm .formRow{ grid-template-columns: 1fr; gap: 8px; }
  .reviewForm .formRow > label{ font-size: 12px; }
  .ratingRow{ grid-template-columns: 1fr; gap: 8px; }
}

/* Stars */
.stars{
  display:inline-flex;
  flex-direction: row-reverse;
  gap: 6px;
}
.stars input{ display:none; }
.stars label{
  cursor:pointer;
  font-size: 18px;
  line-height: 1;
  opacity: .35;
  transition: opacity .12s ease, transform .12s ease;
}
.stars label:hover{ transform: translateY(-1px); opacity: .7; }
.stars input:checked ~ label{ opacity: .75; }

.formNote{ font-size: 12px; opacity: .75; margin: 10px 0 12px; }

@media (max-width: 980px){
  .reviewsLayout{ grid-template-columns: 1fr; }
  .reviewsGallery{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reviewThumb img{ height: 144px; }
}
@media (max-width: 640px){
  .reviewsGallery{ grid-template-columns: 1fr; }
  .reviewThumb img{ height: 167px; }
}

.inner{
  display:flex;
  align-items:center;
}


.topLeftLogo{margin:0 0 2px 0;text-align:left}
.topLeftLogo img{max-width:432px;width:100%;height:auto;display:block}




.bigSpaceLogo img{
  height:82px; /* +50% from ~55px */
  width:auto;
}

.bigSpaceLogoVisible img{
  height:82px;
  width:auto;
  display:block;
}

/* --- Added: quick links + toTop button (do not affect forms) --- */
.pageQuickLinks{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin: 10px 0 18px;
  padding: 12px;
  border-radius: 14px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
}
.pageQuickLinks a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 12px;
  border-radius: 12px;
  text-decoration:none;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.12);
}
.pageQuickLinks a:hover{
  border-color: rgba(255,255,255,0.22);
}

.toTop{
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(0,0,0,0.55);
  color: inherit;
  cursor: pointer;
  opacity: 0;
  transform: translateY(8px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
.toTop.show{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* --- quick links + toTop (added) --- */
.pageQuickLinks{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 18px;padding:10px 12px;border:1px solid rgba(255,255,255,0.10);border-radius:14px;background:rgba(255,255,255,0.04)}
.pageQuickLinks a{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,0.10);text-decoration:none}
.pageQuickLinks a:hover{border-color:rgba(255,255,255,0.22)}

.toTop{position:fixed;right:18px;bottom:18px;width:44px;height:44px;border-radius:999px;border:1px solid rgba(255,255,255,0.18);background:rgba(25,25,25,0.85);color:inherit;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,0.35);opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.toTop.isVisible{opacity:1;transform:translateY(0);pointer-events:auto}
.toTop:hover{border-color:rgba(255,255,255,0.28)}

/* Цифровые отзывы */
.digitalReviews{margin-top:18px;padding-top:18px;border-top:1px solid rgba(255,255,255,0.08)}
.digitalReviewsTitle{margin:0 0 10px;font-size:16px}
.digitalRating{margin:0 0 12px;padding:10px 12px;border:1px solid rgba(255,255,255,0.10);border-radius:14px;background:rgba(255,255,255,0.04)}
.digitalReviewsList{display:flex;flex-direction:column;gap:12px}
.digitalReviewCard{padding:14px 14px;border:1px solid rgba(255,255,255,0.10);border-radius:16px;background:rgba(255,255,255,0.03)}
.digitalReviewHead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:0 0 10px}
.digitalReviewName{font-weight:600}
.digitalReviewMeta{opacity:0.85;font-size:12px}
.digitalStars{letter-spacing:1px;font-size:14px;white-space:nowrap}
.digitalReviewText{margin:0;white-space:pre-line;line-height:1.55;opacity:0.95}


/* === Step 26: Header (bigger + slogan logo + left-aligned contacts) === */
.topbar{ font-size:18px; }
.topbar .inner.headerWideV2{ align-items:flex-start; padding:28px 0; gap:18px; }
.topbar .headerLeft{ display:flex; flex-direction:column; align-items:flex-start; }
.topbar .brandText .brandTop{ font-size:18px; line-height:1.2; }
.topbar .brandText .title{ font-size:28px; line-height:1.15; }
.topbar .brandText .brandBottom{ font-size:18px; line-height:1.2; }
.topbar .headerUnderBrand{ margin-top:10px; }
.topbar .headerUnderBrand .meta{ display:flex; flex-direction:column; gap:4px; align-items:flex-start; }
.topbar .headerUnderBrand .meta .yearsStrong{ font-size:18px; }
.topbar .headerUnderBrand .meta span{ font-size:18px; }
.topbar .nav a span{ font-size:18px; }
.topbar .headerLogo img{ width:48px; height:48px; }
.topbar .brandSloganWrap{ margin-top:10px; }
.topbar .brandSloganLogo{ display:block; max-width:250px; width:100%; height:auto; }
@media (max-width: 920px){
  .topbar .inner.headerWideV2{ flex-wrap:wrap; }
  .topbar .brandSloganLogo{ max-width:212px; }
}

.topbar .headerRight{display:flex; align-items:flex-start; gap:14px;}
.topbar .headerRight .nav{flex:0 1 auto; white-space:nowrap;}


/* === Step25: шапка — меню ближе к названию, контакты строго в одну линию === */
.topbar .inner.headerWideV2{
  justify-content:flex-start;
}

/* Новый логотип + контакты: в одну линию рядом (не столбиком) */
.topbar .inner.headerWideV2 .headerUnderBrand{
  display:flex;
  align-items:center;
  gap:22px;
  flex-wrap:nowrap;
}

.topbar .inner.headerWideV2 .brandSloganWrap{
  margin-top:0;
  flex:0 0 auto;
}

.topbar .inner.headerWideV2 .brandSloganLogo{
  width:auto;
}

.topbar .inner.headerWideV2 .headerUnderBrand .meta{
  flex-direction:row;
  gap:22px;
  align-items:baseline;
  margin:0;
}

.topbar .inner.headerWideV2 .headerUnderBrand .meta .yearsStrong,
.topbar .inner.headerWideV2 .headerUnderBrand .meta span{
  font-size:16px;
}

/* Меню: сдвиг влево (ближе к названию компании) */
.topbar .inner.headerWideV2 .nav{
  margin-top:0;
  /* Step27: сместить названия страниц вправо к названию компании (без выезда за фон) */
  margin-left:clamp(40px, 5vw, 90px);
  flex:0 0 auto;
}

/* Старый логотип TP остаётся справа */
.topbar .inner.headerWideV2 .headerLogo{
  margin-left:auto;
}

/* Контакты: строго одна строка */
.topbar .inner.headerWideV2 .meta{
  display:flex;
  flex-wrap:nowrap;
  gap:22px;
  align-items:baseline;
  white-space:nowrap;
  overflow-x:auto;
}

.topbar .inner.headerWideV2 .meta strong,
.topbar .inner.headerWideV2 .meta span,
.topbar .inner.headerWideV2 .meta a{
  white-space:nowrap;
}



/* FORCE NAV HARD LEFT NEXT TO COMPANY NAME */
nav, .nav, .menu, .main-menu {
    margin-left: -800px !important;
}