:root {
  --brand:#1f8f6a;
  --brand-dark:#145c44;
  --brand-light:#e6f3ee;
  --text:#223;
}

/* RESET (минимальный, безопасный) */
* { box-sizing:border-box; }

body {
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial;
  color:var(--text);
  background:#fff;
}

/* БАЗОВЫЙ КОНТЕЙНЕР — КАК В СТАБИЛЬНОЙ ВЕРСИИ */
.container {
  max-width:1140px;
  margin:0 auto;
  padding:40px 24px;
}

/* ================= HEADER ================= */
.site-header {
  position:sticky;
  top:0;
  background:#fff;
  border-bottom:1px solid #eee;
  z-index:1000;
}

.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px 0;
}

.logo {
  font-weight:700;
  font-size:18px;
  color:var(--brand);
  text-decoration:none;
}

.main-nav a {
  margin:0 14px;
  text-decoration:none;
  color:var(--text);
  position:relative;
}

.main-nav a::after {
  content:'';
  position:absolute;
  left:0;
  bottom:-6px;
  width:0;
  height:2px;
  background:var(--brand);
  transition:.25s;
}

.main-nav a:hover::after { width:100%; }

/* ================= BUTTONS ================= */
.btn {
  display:inline-block;
  padding:12px 22px;
  border-radius:12px;
  border:1px solid transparent;
  background:var(--brand);
  color:#fff;
  font-weight:500;
  text-decoration:none;
  cursor:pointer;
}

.btn + .btn { margin-left:16px; }

.btn:hover { background:var(--brand-dark); }

.btn-ghost {
  background:#fff;
  color:var(--brand);
  border:1px solid var(--brand);
}

.btn-ghost:hover {
  background:var(--brand-light);
}

/* ================= HERO ================= */
.hero {
  min-height:70vh;
  background-size:cover;
  background-position:center;
  position:relative;
  color:#fff;
}

.hero-overlay {
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.45);
}

.hero-content {
  position:relative;
  padding-top:90px;
}

.hero-actions { margin-top:24px; }

/* ================= USP ================= */
.usp-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  text-align:center;
}

.usp-grid div {
  background:#fff;
  padding:28px;
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.06);
}

.usp-grid strong {
  display:block;
  margin-bottom:6px;
}

/* ================= ROOMS ================= */
.rooms-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}

.room-card {
  display:block;
  text-decoration:none;
  color:inherit;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 12px 30px rgba(0,0,0,.08);
  transition:.3s;
}

.room-card:hover { transform:translateY(-4px); }

.room-card img {
  width:100%;
  height:220px;
  object-fit:cover;
}

.room-info { padding:20px; }

.more {
  display:inline-block;
  margin-top:6px;
  color:var(--brand);
  font-weight:500;
}

/* ================= TREATMENT ================= */
.treatment-parallax {
  position:relative;
  background-size:cover;
  background-position:center;
  background-attachment:fixed;
  padding:160px 0;
  color:#fff;
}

.treatment-overlay {
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.55);
}

.treatment-content {
  position:relative;
  max-width:760px;
}

.treatment-content h2 {
  font-size:34px;
  margin-bottom:18px;
}

.treatment-content p {
  font-size:18px;
  line-height:1.7;
}

/* ================= GALLERY ================= */
.gallery-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
}

.gallery-item {
  cursor:pointer;
  height:180px;
  width:100%;
  object-fit:cover;
  border-radius:14px;
}

/* POPUP */
.gallery-overlay {
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.9);
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
}

.gallery-overlay img {
  max-width:90%;
  max-height:90%;
}

.gallery-overlay button {
  position:absolute;
  background:none;
  border:none;
  color:#fff;
  font-size:44px;
  cursor:pointer;
}

.g-prev { left:20px; }
.g-next { right:20px; }
.g-close { top:20px; right:24px; font-size:32px; }

/* ================= FORMS ================= */
.booking-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
}

.booking-box,
.callback-box {
  background:#fff;
  padding:32px;
  border-radius:18px;
  box-shadow:0 12px 30px rgba(0,0,0,.06);
}

.form-row { margin-bottom:14px; }

.form-row.two {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

input, textarea, select {
  width:100%;
  padding:14px 16px;
  border-radius:12px;
  border:1px solid #ddd;
  font-size:15px;
}

.form-actions { margin-top:18px; }

.form-result {
  display:none;
  margin-top:14px;
  padding:10px 14px;
  background:var(--brand-light);
  border-radius:10px;
  font-size:14px;
}

/* ================= CONTACTS ================= */
.contacts-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
}

/* ================= FOOTER ================= */
.site-footer {
  background:var(--brand-dark);
  color:#fff;
  padding:32px 0 0;
}

.footer-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
}

.site-footer a { color:#eafff6; }

.copyright {
  background:#0f3f30;
  text-align:center;
  padding:12px;
  font-size:14px;
  margin-top:24px;
}

/* ================= MOBILE ================= */
@media(max-width:900px) {
  .usp-grid,
  .rooms-grid,
  .gallery-grid,
  .booking-grid,
  .contacts-grid,
  .footer-grid {
    grid-template-columns:1fr;
  }
}

.contact-link {
  color: var(--brand);
  text-decoration: none;
}

.contact-link:hover {
  text-decoration: underline;
}
