/* =========================================================
   ASIA SIBIR — CLEAN PREMIUM TILDA CSS v1
   стабильная версия без конфликтов
   ========================================================= */

/* ===== ROOT ===== */
:root {
  --bg: #f7f3ec;
  --text: #101723;
  --muted: rgba(16,23,34,.65);

  --container: 1480px;

  --radius-xl: 32px;
  --radius-lg: 24px;

  --shadow: 0 18px 45px rgba(16,23,34,.08);
}

/* ===== GLOBAL RESET (safe for Tilda) ===== */
html, body {
  margin: 0;
  padding: 0;
  background: var(--bg) !important;
  color: var(--text);
  overflow-x: hidden;
  font-family: Manrope, Arial, sans-serif;
}

/* Tilda blocks fix */
.t-rec {
  background: transparent !important;
}

/* ===== HERO FIX ===== */
#as-keramo-hero-v9 {
  padding: 90px 20px 30px !important;
}

/* layout */
#as-keramo-hero-v9 .askv9-shell {
  max-width: var(--container);
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 20px;

  align-items: stretch;
}

/* TEXT COLUMN — ВАЖНО */
#as-keramo-hero-v9 .askv9-content {
  min-width: 0;
  padding: 40px 20px;
}

/* TITLE — ОСНОВНАЯ ПРОБЛЕМА БЫЛА ЗДЕСЬ */
#as-keramo-hero-v9 h1 {
  font-size: clamp(32px, 3vw, 54px);
  line-height: 1.05;
  max-width: 600px;
  margin: 0;
  word-break: normal;
}

/* RIGHT IMAGE */
#as-keramo-hero-v9 .askv9-showcase {
  min-width: 0;
}

#as-keramo-hero-v9 .askv9-slider {
  border-radius: var(--radius-xl);
  overflow: hidden;
  min-height: 480px;
}

/* image */
#as-keramo-hero-v9 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ===== BUTTONS ===== */
#as-keramo-hero-v9 .askv9-btn {
  border-radius: 999px;
  padding: 14px 22px;
  font-size: 14px;
}

/* ===== SECTIONS ===== */
#as-keramo-benefits-v3,
#as-premium-cats-v2,
#as-premium-map-v2,
#as-footer-v1 {
  padding: 40px 20px;
}

/* cards */
.askb3-card,
.aspc2-card {
  border-radius: 20px;
  box-shadow: var(--shadow);
}

/* ===== GRID FIX ===== */
.askb3-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.aspc2-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

/* ===== MAP ===== */
.aspm2-shell {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 16px;
}

/* ===== FOOTER ===== */
#as-footer-v1 .asf1-shell {
  max-width: var(--container);
  margin: 0 auto;

  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 20px;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 1200px) {
  #as-keramo-hero-v9 .askv9-shell {
    grid-template-columns: 1fr;
  }

  #as-keramo-hero-v9 h1 {
    max-width: 100%;
  }

  .askb3-grid,
  .aspc2-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  #as-keramo-hero-v9 {
    padding: 80px 14px 20px !important;
  }

  #as-keramo-hero-v9 h1 {
    font-size: 28px;
  }

  .askb3-grid,
  .aspc2-grid {
    grid-template-columns: 1fr;
  }

  .aspm2-shell {
    grid-template-columns: 1fr;
  }
}