/* Canonical SuperAvto home layout, restored from the audited production snapshot. */
.sa-home {
  --sa-ink: #10202f;
  --sa-ink-2: #183246;
  --sa-blue: #0b6ea8;
  --sa-blue-dark: #07517e;
  --sa-accent: #e5a83a;
  --sa-paper: #f4f7fa;
  --sa-line: #dce5ec;
  --sa-muted: #607080;
  --sa-radius: 12px;
  --sa-shadow: 0 10px 28px rgba(16, 32, 47, .08);
  color: var(--sa-ink);
}
.sa-home, .sa-home * { box-sizing: border-box; }
.sa-home .sa-hero {
  align-items: center;
  background: linear-gradient(115deg, #0b1220 0%, #132a40 64%, #0b6ea8 100%);
  border-radius: 18px;
  box-shadow: 0 18px 42px rgba(16, 32, 47, .18);
  color: #fff;
  display: flex;
  gap: 28px;
  justify-content: space-between;
  min-height: 360px;
  overflow: hidden;
  padding: 56px 64px;
  position: relative;
}
.sa-home .sa-hero:after {
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 50%;
  content: "";
  height: 440px;
  position: absolute;
  right: -120px;
  top: -170px;
  width: 440px;
}
.sa-home .sa-hero-copy { max-width: 700px; min-width: 0; position: relative; z-index: 1; }
.sa-home .sa-eyebrow { color: #ffbd45; font-size: 12px; font-weight: 800; letter-spacing: .16em; margin: 0 0 16px; }
.sa-home .sa-hero h1 { color: #fff; font-size: clamp(32px, 4vw, 54px); line-height: 1.08; margin: 0 0 18px; overflow-wrap: anywhere; }
.sa-home .sa-lead { color: #d9e7f0; font-size: 17px; max-width: 620px; overflow-wrap: anywhere; }
.sa-home .sa-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; min-width: 0; }
.sa-home .sa-hero-actions .btn { white-space: normal; }
.sa-home .sa-hero-actions .btn-default { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .35); color: #fff; }
.sa-home .sa-hero-mark { align-items: center; border: 1px solid rgba(255, 255, 255, .24); border-radius: 50%; display: flex; flex-direction: column; height: 210px; justify-content: center; min-width: 210px; position: relative; z-index: 1; }
.sa-home .sa-hero-mark span { color: #fff; font-size: 78px; font-weight: 900; letter-spacing: -.08em; line-height: 1; }
.sa-home .sa-hero-mark small { color: #ffbd45; font-size: 9px; font-weight: 700; letter-spacing: .12em; margin-top: 12px; text-align: center; }
.sa-home .sa-trust-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, 1fr); margin: 22px 0; }
.sa-home .sa-trust-grid article { background: #fff; border: 1px solid var(--sa-line); border-radius: var(--sa-radius); box-shadow: 0 4px 16px rgba(16, 32, 47, .04); padding: 24px; }
.sa-home .sa-trust-grid strong { color: var(--sa-accent); font-size: 13px; letter-spacing: .12em; }
.sa-home .sa-trust-grid h2 { font-size: 20px; margin: 12px 0 8px; }
.sa-home .sa-trust-grid p, .sa-home .sa-catalog-state p { color: var(--sa-muted); margin: 0; }
.sa-home .sa-catalog-state { align-items: center; background: #fff; border: 1px solid var(--sa-line); border-radius: var(--sa-radius); display: flex; gap: 20px; justify-content: space-between; padding: 24px 28px; }
.sa-home .sa-catalog-state h2 { font-size: 21px; margin: 0 0 6px; }
.sa-home .sa-state-icon { align-items: center; background: #edf5fa; border-radius: 50%; color: var(--sa-blue); display: flex; flex: 0 0 52px; font-size: 22px; height: 52px; justify-content: center; }
.sa-home .sa-hero h1,
.sa-home .sa-lead,
.sa-home .sa-trust-grid h2,
.sa-home .sa-trust-grid p,
.sa-home .sa-catalog-state h2,
.sa-home .sa-catalog-state p {
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
  white-space: normal !important;
  max-width: 100%;
}
.sa-home .sa-trust-grid article,
.sa-home .sa-catalog-state > div { min-width: 0; }
@media (max-width: 767px) {
  .sa-home .sa-hero { min-height: 0; padding: 32px 24px; }
  .sa-home .sa-hero-mark { display: none; }
  .sa-home .sa-hero-actions .btn { width: 100%; }
  .sa-home .sa-trust-grid { grid-template-columns: 1fr; }
  .sa-home .sa-catalog-state { align-items: flex-start; flex-wrap: wrap; padding: 20px; }
  .sa-home .sa-catalog-state .btn { margin-left: 0; }
}
@media (max-width: 575px) {
  .sa-home .sa-hero h1 { font-size: 28px; }
  .sa-home .sa-lead { font-size: 15px; }
  .sa-home .sa-trust-grid h2 { font-size: 18px; }
  footer .col-xs-6 { width: 100%; float: none; }
  footer .text-right { text-align: left; }
  footer .col-xs-6, footer p, footer span { overflow-wrap: anywhere; }
}