/* ==================================================================
   АЛЬФАСКАН · Хаб /service/ · префикс .ash-
   Все токены дизайн-системы — CSS-переменные, скоуп локальный.
   При смене города меняется только контент, стили общие.
   ================================================================== */
.ash {
  --navy: #0C265A;
  --navy-mid: #1A3A6B;
  --navy-deep: #0a1f4a;
  --red: #CA0237;
  --red-hover: #a8011e;
  --white: #fff;
  --gray-bg: #F0F2F5;
  --gray-line: #E2E8F0;
  --gray-mid: #8B9BAE;
  --gray-dark: #4A5568;
  --blue-light: #B8C8E0;
  --success: #3ddc84;
  --r-lg: 20px;
  --r-md: 14px;
  --r-sm: 8px;
  font-family: 'PT Sans', 'Nunito Sans', Arial, sans-serif;
  color: var(--gray-dark);
  line-height: 1.5;
}

.ash * {
  box-sizing: border-box
}

.ash a {
  color: inherit
}

.ash h1,
.ash h2,
.ash h3 {
  margin: 0;
  font-weight: 700;
  color: var(--navy);
  letter-spacing: -.01em
}

.ash .kick {
  color: var(--red);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin: 0 0 8px
}

.ash h2 {
  font-size: 32px;
  line-height: 1.2;
  margin: 0 0 8px
}

.ash .alfa-sep {
  border: 0;
  height: 1px;
  background: var(--gray-line);
  margin: 46px 0;
}

.ash .lead {
  color: var(--gray-dark);
  font-size: 16px;
  line-height: 1.55;
  margin: 0 0 24px;
  max-width: 760px
}

.ash-hero {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 6px 0 24px;
  min-height: 460px;
  background: linear-gradient(100deg, var(--navy) 0%, var(--navy) 42%, rgba(12, 38, 90, .55) 62%, rgba(12, 38, 90, .15) 100%), var(--_hero-photo, linear-gradient(135deg, #1a3a6b, #0a1f4a)) center/cover no-repeat;
  color: var(--white);
  display: flex;
  align-items: center
}

.ash-hero:after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 78% 30%, rgba(202, 2, 55, .18), transparent 55%);
  pointer-events: none
}

.ash-hero-inner {
  position: relative;
  z-index: 1;
  padding: 52px 56px;
  max-width: 640px
}

.ash-hero .kick {
  color: var(--blue-light)
}

.ash-hero h1 {
  color: var(--white);
  font-size: 44px;
  line-height: 1.08;
  margin: 0 0 14px;
  font-weight: 700
}

.ash-hero .sub {
  color: var(--blue-light);
  font-size: 18px;
  line-height: 1.5;
  margin: 0 0 28px;
  max-width: 560px
}

.ash-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 20px;
  align-items: center;
  margin-bottom: 22px
}

.ash-phone {
  font-size: 30px;
  font-weight: 700;
  color: var(--white);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  letter-spacing: -.02em
}

.ash-phone:hover {
  color: var(--white)
}

.ash-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--red);
  color: var(--white) !important;
  font-weight: 700;
  padding: 14px 30px;
  border-radius: var(--r-sm);
  text-decoration: none;
  font-size: 16px;
  transition: background .2s;
  border: 0;
  cursor: pointer;
  font-family: inherit
}

.ash-btn:hover {
  background: var(--red-hover);
  color: var(--white)
}

.ash-btn--ghost {
  background: transparent;
  border: 2px solid rgba(255, 255, 255, .5);
  padding: 12px 28px
}

.ash-btn--ghost:hover {
  background: rgba(255, 255, 255, .1);
  border-color: var(--white)
}

.ash-urg {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: rgba(202, 2, 55, .18);
  border: 1px solid rgba(202, 2, 55, .5);
  padding: 10px 18px;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 700;
  color: var(--white)
}

.ash-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 8px rgba(61, 220, 132, .6)
}

.ash-hero-photo-m {
  display: none
}

.ash-trust {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  background: var(--gray-bg);
  border-radius: var(--r-md);
  padding: 18px 12px;
  margin: 0 0 44px
}

.ash-trust>div {
  padding: 6px 20px;
  border-right: 1px solid var(--gray-line);
  font-size: 14px;
  color: var(--navy);
  font-weight: 600;
  text-align: center;
  line-height: 1.4
}

.ash-trust>div:last-child {
  border-right: 0
}

.ash-trust b {
  color: var(--red);
  display: block;
  font-size: 22px;
  line-height: 1;
  margin-bottom: 6px
}

.ash-sec {
  margin: 0 0 52px
}

.ash-sec-head {
  margin: 0 0 26px
}

.ash-cards {
  display: grid;
  gap: 18px
}

.ash-cards--4 {
  grid-template-columns: repeat(4, 1fr)
}

.ash-cards--3 {
  grid-template-columns: repeat(3, 1fr)
}

.ash-cards--3>.ash-card:last-child:nth-child(3n+1) {
  grid-column-start: 2
}

.ash-cards--2 {
  grid-template-columns: repeat(2, 1fr)
}
.ash-cards--1{grid-template-columns:1fr;max-width:640px}

.ash-card {
  background: var(--white);
  border: 1px solid var(--gray-line);
  border-radius: var(--r-md);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: .2s;
  text-decoration: none;
  color: inherit
}

.ash-card:hover {
  border-color: var(--navy);
  box-shadow: 0 8px 24px rgba(12, 38, 90, .1);
  transform: translateY(-2px)
}

.ash-card-photo {
  aspect-ratio: 16/10;
  background: var(--gray-bg) center/cover no-repeat;
  position: relative;
  overflow: hidden
}

.ash-card-photo:after {
  content: attr(data-ph);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gray-mid);
  font-size: 13px;
  font-weight: 600;
  background: linear-gradient(135deg, #e8ecf1, #f4f6f9);
  z-index: 0
}

.ash-card-photo img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover
}

.ash-card-body {
  padding: 20px 22px 22px;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.ash-card-badge {
  display: inline-flex;
  align-items: center;
  background: rgba(202, 2, 55, .1);
  color: var(--red);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 20px;
  align-self: flex-start;
  margin-bottom: 6px
}

.ash-card-title {
  font-size: 17px;
  color: var(--navy);
  font-weight: 700;
  margin: 0
}

.ash-card-desc {
  font-size: 14px;
  color: var(--gray-mid);
  line-height: 1.45;
  margin: 0
}

.ash-card-arr {
  margin-top: auto;
  padding-top: 12px;
  font-size: 13px;
  font-weight: 700;
  color: var(--navy);
  display: inline-flex;
  align-items: center;
  gap: 6px
}

.ash-card:hover .ash-card-arr {
  color: var(--red)
}

.ash-card--cta {
  grid-column: span 2;
  background: linear-gradient(135deg, var(--navy), var(--navy-deep));
  border: 0;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  transition: .2s
}

.ash-card--cta:hover {
  background: linear-gradient(135deg, var(--navy-mid), var(--navy));
  border: 0;
  box-shadow: 0 8px 24px rgba(12, 38, 90, .25);
  transform: translateY(-2px)
}

.ash-card--cta:after {
  content: "";
  position: absolute;
  right: -80px;
  top: -80px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(202, 2, 55, .22), transparent 60%);
  pointer-events: none
}

.ash-cta-card-body {
  padding: 32px 36px;
  position: relative;
  z-index: 1;
  width: 100%
}

.ash-cta-card-kick {
  color: var(--blue-light);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin: 0 0 10px
}

.ash-cta-card-title {
  color: #fff;
  font-size: 18px;
  line-height: 1.35;
  font-weight: 700;
  margin-bottom: 20px;
  max-width: 420px
}

.ash-cta-card-phone {
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -.02em;
  line-height: 1;
  margin-bottom: 8px;
  display: inline-flex;
  align-items: center;
  gap: 12px
}

.ash-cta-card-phone:after {
  content: "→";
  color: var(--red);
  font-size: 24px;
  transition: transform .2s
}

.ash-card--cta:hover .ash-cta-card-phone:after {
  transform: translateX(4px)
}

.ash-cta-card-note {
  color: var(--blue-light);
  font-size: 13px;
  font-weight: 600
}

.ash-card--cta-newrow {
  grid-column: 1/-1
}

.ash-cards--2 .ash-card--cta {
  grid-column: 1/-1
}

.ash-wide {
  display: grid;
  grid-template-columns: 280px 1fr;
  gap: 0;
  background: var(--white);
  border: 1px solid var(--gray-line);
  border-radius: var(--r-md);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: .2s
}

.ash-wide:hover {
  border-color: var(--navy);
  box-shadow: 0 8px 24px rgba(12, 38, 90, .1)
}

.ash-wide .ash-card-photo {
  aspect-ratio: auto;
  height: 100%;
  min-height: 180px
}

.ash-wide .ash-card-body {
  padding: 26px 30px
}

.ash-usp {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px
}

.ash-usp .it {
  background: var(--gray-bg);
  border-radius: var(--r-md);
  padding: 26px 24px;
  position: relative
}

.ash-usp .num {
  font-size: 44px;
  font-weight: 700;
  color: var(--red);
  line-height: 1;
  margin-bottom: 12px;
  letter-spacing: -.03em
}

.ash-usp b {
  display: block;
  font-size: 16px;
  color: var(--navy);
  margin-bottom: 6px;
  font-weight: 700
}

.ash-usp span {
  font-size: 14px;
  color: var(--gray-mid);
  line-height: 1.45
}

.ash-addr {
  background: var(--navy);
  border-radius: var(--r-lg);
  padding: 36px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 30px;
  align-items: stretch;
  color: var(--white);
  overflow: hidden
}

.ash-addr h2 {
  color: var(--white) !important;
  font-size: 28px;
  margin-bottom: 16px
}

.ash-addr .kick {
  color: var(--blue-light)
}

.ash-addr-info .row {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 0 0 12px;
  color: var(--white)
}

.ash-addr-info .row svg {
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  stroke: var(--blue-light);
  fill: none;
  stroke-width: 1.6;
  margin-top: 3px
}

.ash-addr-info .row b {
  color: var(--white);
  font-weight: 700;
  display: block;
  margin-bottom: 2px;
  font-size: 15px
}

.ash-addr-info .row span {
  color: var(--blue-light);
  font-size: 14px;
  line-height: 1.45
}

.ash-addr-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px
}

.ash-addr-photo {
  border-radius: var(--r-md);
  overflow: hidden;
  min-height: 280px;
  background: var(--gray-bg) center/cover no-repeat;
  position: relative
}

.ash-addr-photo:after {
  content: "Фото сервисного центра";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gray-mid);
  font-size: 13px;
  font-weight: 600;
  background: linear-gradient(135deg, #e8ecf1, #f4f6f9);
  z-index: 0
}

.ash-addr-photo img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block
}

.ash-city {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px
}
.ash-city_col_3 {
  grid-template-columns: repeat(3, 1fr);
}

.ash-city .it {
  background: var(--white);
  border: 1px solid var(--gray-line);
  border-radius: var(--r-md);
  padding: 22px 22px 20px;
  text-decoration: none;
  color: inherit;
  transition: .2s;
  display: flex;
  flex-direction: column;
  gap: 6px;
  position: relative
}

.ash-city .it:hover {
  border-color: var(--navy);
  box-shadow: 0 8px 24px rgba(12, 38, 90, .08);
  transform: translateY(-2px)
}

.ash-city .it.is-current {
  background: var(--navy);
  color: var(--white);
  border-color: var(--navy)
}

.ash-city .it.is-current b,
.ash-city .it.is-current span,
.ash-city .it.is-current .ash-city-arr {
  color: var(--white)
}

.ash-city .it b {
  display: block;
  font-size: 17px;
  color: var(--navy);
  font-weight: 700
}

.ash-city .it span {
  font-size: 13px;
  color: var(--gray-mid);
  line-height: 1.4;
  min-height: 36px
}

.ash-city-tag {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .6px;
  text-transform: uppercase;
  color: var(--red);
  background: rgba(202, 2, 55, .1);
  padding: 3px 9px;
  border-radius: 20px;
  align-self: flex-start;
  margin-bottom: 4px
}

.ash-city .it.is-current .ash-city-tag {
  background: rgba(255, 255, 255, .15);
  color: var(--white)
}

.ash-city-arr {
  margin-top: auto;
  padding-top: 10px;
  font-size: 12px;
  font-weight: 700;
  color: var(--navy)
}

.ash-form-block {
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%);
  color: var(--white);
  border-radius: var(--r-lg);
  padding: 44px;
  margin-bottom: 32px;
  position: relative;
  overflow: hidden
}

.ash-form-block:after {
  content: "";
  position: absolute;
  right: -100px;
  top: -100px;
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(202, 2, 55, .15), transparent 60%);
  pointer-events: none
}

.ash-form-block .kick {
  color: var(--blue-light);
  position: relative
}

.ash-form-block h2 {
  color: var(--white) !important;
  font-size: 30px;
  margin: 0 0 8px;
  position: relative
}

.ash-form-block .lead {
  color: var(--blue-light) !important;
  max-width: 560px;
  position: relative
}

.ash-form-phone {
  font-size: 32px;
  font-weight: 700;
  color: var(--white) !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 8px 0 4px;
  position: relative
}

.ash-form-note {
  color: var(--gray-mid);
  font-size: 13px;
  margin-bottom: 26px;
  position: relative
}

.ash-form-wrap {
  background: rgba(255, 255, 255, .06);
  border-radius: var(--r-md);
  padding: 28px;
  position: relative;
  border: 1px solid rgba(255, 255, 255, .1)
}

.ash-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 18px
}

.ash-form-input {
  width: 100%;
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, .3) !important;
  border-radius: var(--r-sm);
  padding: 14px 16px;
  color: var(--white) !important;
  font-size: 15px;
  font-family: inherit;
  transition: border-color .2s
}

.ash-form-input::placeholder {
  color: rgba(184, 200, 224, .7)
}

.ash-form-input:focus {
  outline: 0;
  border-color: var(--white) !important
}

textarea.ash-form-input {
  resize: vertical;
  min-height: 80px
}

.ash-form-row {
  margin-bottom: 14px
}

.ash-form-check{display:flex;align-items:center;gap:10px;font-size:14px;color:#B8C8E0;margin-bottom:16px}
.ash-form-check input{accent-color:#CA0237;width:16px;height:16px}

.ash-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
  margin-top: 6px
}

.ash-form-consent {
  color: var(--blue-light);
  font-size: 12px;
  line-height: 1.5;
  flex: 1;
  min-width: 260px
}

.ash-form-consent a {
  color: var(--white);
  text-decoration: underline
}

.ash-seo {
  background: var(--gray-bg);
  border-radius: var(--r-md);
  padding: 36px 40px;
  margin-bottom: 24px
}

.ash-seo h2 {
  font-size: 22px;
  margin-bottom: 14px
}

.ash-seo p {
  font-size: 15px;
  line-height: 1.7;
  color: var(--gray-dark);
  margin: 0 0 14px
}

.ash-seo p:last-child {
  margin-bottom: 0
}

/* === COMPONENT: alfa-hero (шаблон хаба) === */
.alfa-hero {
  position: relative;
  border-radius: var(--r-lg);
  overflow: hidden;
  margin: 6px 0 24px;
  min-height: 460px;
  background: linear-gradient(90deg, var(--navy) 0%, var(--navy) 40%, rgba(12, 38, 90, .6) 65%, rgba(12, 38, 90, .2) 100%), linear-gradient(135deg, var(--navy), var(--navy-deep));
  color: var(--white);
  display: grid;
  grid-template-columns: minmax(0, 640px) 1fr;
  align-items: center;
  gap: 0
}

.alfa-hero-truck {
  position: relative;
  z-index: 1;
  padding: 20px 30px 20px 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  height: 100%
}

.alfa-hero-truck img {
  max-height: 420px;
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  display: block
}

.alfa-hero:after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 78% 30%, rgba(202, 2, 55, .18), transparent 55%);
  pointer-events: none
}

.alfa-hero-inner {
  position: relative;
  z-index: 1;
  padding: 52px 56px;
  max-width: 640px
}

.alfa-hero-badge {
  display: inline-flex;
  align-items: center;
  background: rgba(202, 2, 55, .15);
  border: 1px solid rgba(202, 2, 55, .5);
  color: #fff;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 6px 14px;
  border-radius: 20px;
  margin-bottom: 14px
}

.ash .alfa-hero h1 {
  color: var(--white);
  font-size: 44px;
  line-height: 1.08;
  margin: 0 0 14px;
  font-weight: 700
}

.ash .alfa-hero h1 .ac {
  display: inline;
  background: linear-gradient(transparent 65%, rgba(202, 2, 55, .85) 65%);
  padding: 0 4px
}

.alfa-hero-sub {
  color: var(--blue-light);
  font-size: 18px;
  line-height: 1.5;
  margin: 0 0 28px;
  max-width: 560px
}

.alfa-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 20px;
  align-items: center;
  margin-bottom: 22px
}

.alfa-phone {
  font-size: 30px;
  font-weight: 700;
  color: var(--white) !important;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  letter-spacing: -.02em
}

.alfa-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--red);
  color: var(--white) !important;
  font-weight: 700;
  padding: 14px 30px;
  border-radius: var(--r-sm);
  text-decoration: none;
  font-size: 16px;
  transition: .2s;
  border: 0;
  cursor: pointer;
  font-family: inherit
}

.alfa-btn:hover {
  background: var(--red-hover)
}

.alfa-btn--ghost {
  background: transparent;
  border: 2px solid rgba(255, 255, 255, .5);
  padding: 12px 28px
}

.alfa-btn--ghost:hover {
  background: rgba(255, 255, 255, .1);
  border-color: #fff
}

.alfa-urg {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  background: rgba(202, 2, 55, .18);
  border: 1px solid rgba(202, 2, 55, .5);
  padding: 10px 18px;
  border-radius: 30px;
  font-size: 13px;
  font-weight: 700;
  color: var(--white)
}

.alfa-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 8px rgba(61, 220, 132, .6)
}

/* === COMPONENT: alfa-service-grid variant='icons' — услуги по Sitrak (8 карточек с SVG) === */
.alfa-svc-icons {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px
}

.alfa-svc-icons .it {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #fff;
  border: 1px solid var(--gray-line);
  border-radius: 14px;
  padding: 22px 20px;
  transition: .2s
}

.alfa-svc-icons .it:hover {
  border-color: var(--navy);
  box-shadow: 0 4px 16px rgba(12, 38, 90, .08);
  transform: translateY(-2px)
}

.alfa-svc-icons .it-ico {
  width: 44px;
  height: 44px;
  background: rgba(12, 38, 90, .06);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--navy)
}

.alfa-svc-icons .it-ico svg {
  width: 24px;
  height: 24px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round
}

.alfa-svc-icons .it b {
  display: block;
  font-size: 16px;
  color: var(--navy);
  font-weight: 700;
  line-height: 1.25
}

.alfa-svc-icons .it span {
  font-size: 13px;
  color: var(--gray-mid);
  line-height: 1.45
}


/* === ГАЛЕРЕЯ === */
.alfa-gal {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 0 0 30px
}

.alfa-gal .it {
  position: relative;
  border-radius: var(--r-md);
  overflow: hidden;
  aspect-ratio: 5/4;
  background: linear-gradient(135deg, #e8ecf1, #f4f6f9)
}

.alfa-gal .it:after {
  content: attr(data-ph);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gray-mid);
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  padding: 20px;
  z-index: 0
}

.alfa-gal img {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block
}


/* === COMPONENT: alfa-brand-tiles — другие марки === */
.alfa-brand-tiles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 22px
}

.alfa-brand-tiles a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  border: 1px solid var(--gray-line);
  border-radius: 14px;
  padding: 22px 26px;
  font-weight: 700;
  font-size: 17px;
  color: var(--navy);
  text-decoration: none;
  transition: .2s
}

.alfa-brand-tiles a:hover {
  border-color: var(--navy);
  background: var(--navy);
  color: #fff
}

.alfa-brand-tiles a:hover .alfa-brand-tile-arr {
  color: #fff
}

.alfa-brand-tile-arr {
  color: var(--red);
  font-size: 18px;
  transition: .2s
}


/* === ФОРМА-КОНСУЛЬТАЦИЯ (inline) === */
.alfa-form-inline {
  background: var(--gray-bg);
  border-radius: var(--r-lg);
  padding: 36px 40px
}

.alfa-form-inline h2 {
  margin-bottom: 6px
}

.alfa-form-inline .alfa-lead {
  margin-bottom: 22px
}

/* === B2B БЛОК === */
.alfa-b2b {
  background: var(--gray-bg);
  border-radius: var(--r-lg);
  padding: 40px
}

.alfa-b2b h2 {
  margin-bottom: 8px
}

.alfa-b2b-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 26px
}

.alfa-b2b-grid .it {
  background: #fff;
  border-radius: var(--r-md);
  padding: 22px 18px;
  text-align: center;
  border: 1px solid var(--gray-line)
}

.alfa-b2b-grid .ico {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: rgba(202, 2, 55, .08);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 12px
}

.alfa-b2b-grid .ico svg {
  width: 26px;
  height: 26px;
  fill: none;
  stroke: var(--red);
  stroke-width: 1.6
}

.alfa-b2b-grid b {
  display: block;
  font-size: 15px;
  color: var(--navy);
  line-height: 1.3;
  margin-bottom: 4px
}

.alfa-b2b-grid span {
  font-size: 13px;
  color: var(--gray-mid);
  line-height: 1.4
}

.alfa-b2b-cta {
  margin-top: 26px;
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap
}

.alfa-b2b-cta .note {
  font-size: 14px;
  color: var(--gray-dark)
}

.alfa-b2b-cta .note a {
  color: var(--navy);
  font-weight: 700;
  text-decoration: none
}


/* === ПЛИТКИ ПРОБЛЕМ === */
.alfa-prob {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px
}

.alfa-prob>div {
  background: #fff;
  border: 1px solid var(--gray-line);
  border-radius: 14px;
  padding: 20px 22px;
  color: var(--navy)
}

.alfa-prob strong {
  display: block;
  font-size: 16px;
  color: var(--navy);
  line-height: 1.3;
  margin-bottom: 4px
}

.alfa-prob span {
  display: block;
  font-size: 13px;
  color: var(--gray-mid)
}

/* === FAQ === */
.alfa-faq {
  max-width: 880px
}

.alfa-faq details {
  border: 1px solid var(--gray-line);
  border-radius: 12px;
  margin-bottom: 10px;
  background: #fff;
  overflow: hidden
}

.alfa-faq summary {
  list-style: none;
  cursor: pointer;
  padding: 18px 22px;
  font-weight: 700;
  font-size: 17px;
  color: var(--navy);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px
}

.alfa-faq summary::-webkit-details-marker {
  display: none
}

.alfa-faq summary:after {
  content: "+";
  color: var(--red);
  font-size: 26px;
  line-height: 1;
  flex: 0 0 auto
}

.alfa-faq details[open] summary:after {
  content: "–"
}

.alfa-faq .a {
  padding: 0 22px 20px;
  color: var(--gray-dark);
  font-size: 15px;
  line-height: 1.6
}

@media(max-width:1100px) {

  .ash-cards--4,
  .ash-cards--3 {
    grid-template-columns: repeat(2, 1fr)
  }

  .ash-cards--3>.ash-card:last-child:nth-child(3n+1) {
    grid-column-start: auto
  }

  .ash-card--cta,
  .ash-card--cta-newrow {
    grid-column: auto
  }

  .ash-cards--3>.ash-card:last-child:nth-child(2n+1) {
    grid-column: 1/-1
  }

  .ash-usp,
  .ash-city,
  .ash-trust,
  .alfa-prob,
  .alfa-b2b-grid,
  .alfa-gal {
    grid-template-columns: repeat(2, 1fr)
  }

  .ash-trust>div {
    border-right: 0;
    border-bottom: 1px solid var(--gray-line);
    padding: 14px 20px
  }

  .ash-trust>div:nth-last-child(-n+2) {
    border-bottom: 0
  }

  .alfa-svc-icons {
    grid-template-columns: repeat(2, 1fr)
  }

  .alfa-brand-tiles {
    grid-template-columns: repeat(3, 1fr)
  }
}

@media(max-width:820px) {
  .ash-hero {
    min-height: auto;
    display: block;
    padding: 0;
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%)
  }

  .ash-hero:after {
    display: none
  }

  .ash-hero-inner {
    padding: 32px 24px;
    max-width: 100%
  }

  .ash-hero h1 {
    font-size: 30px
  }

  .ash-hero .sub {
    font-size: 16px
  }

  .ash-hero-photo-m {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16/10;
    object-fit: cover
  }

  .ash h2 {
    font-size: 24px
  }

  .ash-addr {
    grid-template-columns: 1fr;
    padding: 28px
  }

  .ash-wide {
    grid-template-columns: 1fr
  }

  .ash-wide .ash-card-photo {
    aspect-ratio: 16/10;
    min-height: auto
  }

  .ash-form-block {
    padding: 28px 22px
  }

  .ash-form-grid {
    grid-template-columns: 1fr
  }

  .ash-seo {
    padding: 26px 22px
  }

  .alfa-hero {
    min-height: auto;
    display: block;
    padding: 0;
    background: linear-gradient(135deg, var(--navy) 0%, var(--navy-deep) 100%)
  }

  .alfa-hero:after {
    display: none
  }

  .alfa-hero-inner {
    padding: 32px 24px;
    max-width: 100%
  }

  .ash .alfa-hero h1 {
    font-size: 30px
  }

  .alfa-hero-sub {
    font-size: 16px
  }

  .alfa-hero-truck {
    padding: 0 20px 20px;
    justify-content: center
  }

  .alfa-hero-truck img {
    max-height: 220px;
    width: 100%;
    object-fit: contain
  }

  .alfa-brand-tiles {
    grid-template-columns: 1fr
  }

  .alfa-b2b,
  .alfa-form-inline {
    padding: 28px 22px
  }

}

@media(max-width:520px) {

  .ash-cards--4,
  .ash-cards--3,
  .ash-cards--2,
  .alfa-gal {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px
  }

  .ash-city {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px
  }

  .ash-usp {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px
  }

  .ash-usp .it {
    padding: 20px 16px
  }

  .ash-usp .num {
    font-size: 32px;
    margin-bottom: 8px
  }

  .ash-usp b {
    font-size: 14px
  }

  .ash-usp span {
    font-size: 12px
  }

  .ash-trust {
    grid-template-columns: repeat(2, 1fr);
    padding: 12px 8px
  }

  .ash-trust>div {
    padding: 12px 10px;
    font-size: 12px;
    border-right: 0;
    border-bottom: 1px solid var(--gray-line)
  }

  .ash-trust>div:nth-last-child(-n+2) {
    border-bottom: 0
  }

  .ash-trust b {
    font-size: 18px;
    margin-bottom: 4px
  }

  .ash-card-body {
    padding: 14px 14px 16px;
    gap: 4px
  }

  .ash-card-title {
    font-size: 14px;
    line-height: 1.25
  }

  .ash-card-desc {
    font-size: 12px
  }

  .ash-card-badge {
    font-size: 9px;
    padding: 3px 8px;
    margin-bottom: 4px
  }

  .ash-card-arr {
    font-size: 11px;
    padding-top: 8px
  }

  .ash-city .it {
    padding: 14px 14px 12px
  }

  .ash-city .it b {
    font-size: 14px
  }

  .ash-city .it span {
    font-size: 11px;
    min-height: 32px
  }

  .ash-city-arr {
    font-size: 11px;
    padding-top: 6px
  }

  .ash-city-tag {
    font-size: 9px;
    padding: 2px 7px
  }

  .ash-cta {
    gap: 10px
  }

  .ash-cta-card-body {
    padding: 16px 14px
  }

  .ash-cta-card-kick {
    font-size: 9px;
    letter-spacing: .9px;
    margin-bottom: 6px
  }

  .ash-cta-card-title {
    font-size: 12px;
    line-height: 1.3;
    margin-bottom: 10px;
    max-width: 100%
  }

  .ash-cta-card-phone {
    font-size: 17px;
    letter-spacing: -.01em;
    gap: 6px;
    flex-wrap: wrap
  }

  .ash-cta-card-phone:after {
    font-size: 16px
  }

  .ash-cta-card-note {
    font-size: 10px;
    line-height: 1.3
  }

  .ash-card--cta:after {
    display: none
  }

  .ash-phone {
    font-size: 24px
  }

  .alfa-svc-icons {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px
  }

  .alfa-svc-icons .it {
    padding: 16px 14px
  }

  .alfa-svc-icons .it b {
    font-size: 14px
  }

  .alfa-svc-icons .it span {
    font-size: 12px
  }

  .alfa-cta {
    gap: 10px
  }

  .alfa-phone {
    font-size: 24px
  }

  .alfa-prob {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px
  }

  .alfa-prob>div {
    padding: 14px 14px
  }

  .alfa-prob strong {
    font-size: 14px;
    line-height: 1.25
  }

  .alfa-prob span {
    font-size: 12px
  }

  .alfa-b2b-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px
  }

  .alfa-b2b-grid .it {
    padding: 16px 12px
  }

  .alfa-b2b-grid b {
    font-size: 13px
  }

  .alfa-b2b-grid span {
    font-size: 11px
  }

  .alfa-b2b-grid .ico {
    width: 44px;
    height: 44px;
    margin-bottom: 8px
  }
}




/* страница "грузовой сервис" */
.page-gruzovoy-servis .alfa-hero {
  background: linear-gradient(100deg, var(--navy) 0%, var(--navy) 42%, rgba(12, 38, 90, .55) 62%, rgba(12, 38, 90, .15) 100%), var(--_hero-photo, linear-gradient(135deg, #1a3a6b, #0a1f4a)) center / cover no-repeat;
}

.page-gruzovoy-servis .alfa-hero-inner {
  max-width: 720px;
}

.page-gruzovoy-servis .alfa-hero-photo-m {
  display: none;
}

@media(max-width:820px) {
  .page-gruzovoy-servis .alfa-hero {
    background: linear-gradient(135deg, var(--navy), var(--navy-deep))
  }

  .page-gruzovoy-servis .alfa-hero-inner {
    max-width: 100%
  }

  .page-gruzovoy-servis .alfa-hero h1 {
    font-size: 28px
  }

  .page-gruzovoy-servis .alfa-hero-photo-m {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16/10;
    object-fit: cover
  }
}
/*  */


/* === ТИПЫ ПОЛУПРИЦЕПОВ (5×2 карточек) === */
.alfa-types-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.alfa-types-grid .it{background:var(--gray-bg);border-radius:var(--r-md);padding:22px 14px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;transition:.2s}
.alfa-types-grid .it:hover{background:#e8ecf1;transform:translateY(-2px)}
.alfa-types-grid .it .ico{width:52px;height:52px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center}
.alfa-types-grid .it svg{width:28px;height:28px;stroke:var(--red);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.alfa-types-grid .it b{font-size:14px;color:var(--navy);font-weight:700;line-height:1.25}
@media(max-width:1100px){
  .alfa-types-grid{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:820px){
  .alfa-types-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:520px){
  .alfa-types-grid {grid-template-columns:repeat(2,1fr);gap:10px}
  .alfa-types-grid .it{padding:16px 8px 14px;gap:8px}
  .alfa-types-grid .it b{font-size:12px;line-height:1.2}
  .alfa-types-grid .it .ico{width:42px;height:42px}
  .alfa-types-grid .it svg{width:22px;height:22px}
}

/* === УСЛУГИ РЕМОНТА (2×5) === */
.alfa-services{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.alfa-services .it{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--gray-line);border-radius:var(--r-md);padding:18px 22px}
.alfa-services .it svg{flex:0 0 26px;width:26px;height:26px;fill:none;stroke:var(--red);stroke-width:1.7}
.alfa-services .it b{font-size:16px;color:var(--navy);font-weight:600;line-height:1.35}
.alfa-note{margin-top:24px;background:var(--navy);color:#fff;border-radius:var(--r-md);padding:22px 28px;font-size:16px;line-height:1.55}
.alfa-note b{color:#B8C8E0;font-weight:700}

@media(max-width:1100px){
  .alfa-services{grid-template-columns:1fr}
}
@media(max-width:520px){
  .alfa-services{grid-template-columns:repeat(2,1fr);gap:10px}
  .alfa-services .it{padding:12px 12px;gap:10px}
  .alfa-services .it svg{flex:0 0 20px;width:20px;height:20px}
  .alfa-services .it b{font-size:12px;line-height:1.3}
}

/* === МОСТИК К КУЗОВНОМУ === */
.alfa-bridge{background:var(--gray-bg);border:1px solid var(--gray-line);border-radius:var(--r-md);padding:22px 28px;display:flex;justify-content:space-between;align-items:center;gap:22px;flex-wrap:wrap;margin-top:22px}
.alfa-bridge-text b{display:block;font-size:17px;color:var(--navy);font-weight:700;margin-bottom:4px}
.alfa-bridge-text span{font-size:14px;color:var(--gray-mid);line-height:1.45}
.alfa-bridge .alfa-btn{background:transparent;color:var(--navy)!important;border:2px solid var(--navy);padding:11px 22px}
.alfa-bridge .alfa-btn:hover{background:var(--navy);color:#fff!important}
@media(max-width:820px){
  .alfa-bridge{padding:20px 22px;flex-direction:column;align-items:flex-start;text-align:left}
}
@media(max-width:520px){
  .alfa-bridge-text b{font-size:15px}
  .alfa-bridge-text span{font-size:13px}
}

/* === КАК РАБОТАЕМ === */
.alfa-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:s;margin-top:14px}
.alfa-step{position:relative;background:var(--gray-bg);border-radius:var(--r-md);padding:32px 20px 22px}
.alfa-step:before{counter-increment:s;content:counter(s);position:absolute;top:-15px;left:20px;width:36px;height:36px;border-radius:50%;background:var(--red);color:#fff;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:15px}
.alfa-step b{display:block;color:var(--navy);font-size:16px;margin-bottom:6px;font-weight:700}
.alfa-step span{font-size:13px;color:var(--gray-mid);line-height:1.45}
@media(max-width:1100px){
  .alfa-steps{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:820px){
  .alfa-steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .alfa-steps{grid-template-columns:repeat(2,1fr);gap:10px}
  .alfa-steps .alfa-step:nth-child(5){grid-column:span 2}
  .alfa-step{padding:26px 14px 16px}
  .alfa-step b{font-size:14px}
  .alfa-step span{font-size:12px}
}

/* страница "ремонт полуприцепов" */
.page-remont-polupricepov .alfa-hero,
.page-remont-refrigeratorov .alfa-hero,
.page-kuzovnoy-remont .alfa-hero {background:linear-gradient(135deg,var(--navy),var(--navy-deep));grid-template-columns:1.15fr .85fr;align-items: stretch;}
.page-remont-polupricepov .alfa-hero:after,
.page-remont-refrigeratorov .alfa-hero:after,
.page-kuzovnoy-remont .alfa-hero:after {right:-100px;top:-80px;width:460px;height:460px;background:radial-gradient(circle,rgba(202,2,55,.22),transparent 60%);z-index:0}
.page-remont-polupricepov .alfa-hero-inner,
.page-remont-refrigeratorov .alfa-hero-inner,
.page-kuzovnoy-remont .alfa-hero-inner {display:flex;flex-direction:column;justify-content:center}
.page-remont-polupricepov .alfa-hero h1,
.page-remont-refrigeratorov .alfa-hero h1,
.page-kuzovnoy-remont .alfa-hero h1 {font-size:40px;line-height:1.1;margin:0 0 16px;}
.page-remont-polupricepov .alfa-hero-sub,
.page-remont-refrigeratorov .alfa-hero-sub,
.page-kuzovnoy-remont .alfa-hero-sub {font-size:17px;line-height:1.55;max-width:580px}
.page-remont-polupricepov .alfa-hero-sub b,
.page-remont-refrigeratorov .alfa-hero-sub b,
.page-kuzovnoy-remont .alfa-hero-sub b {color:#fff;font-weight:700}
.page-remont-polupricepov .alfa-cta {margin-bottom:0}
.page-remont-polupricepov .alfa-hero-photo,
.page-remont-refrigeratorov .alfa-hero-photo,
.page-kuzovnoy-remont .alfa-hero-photo {position:relative;z-index:1;background:var(--gray-bg) center/cover no-repeat;min-height:100%;overflow:hidden}
.page-remont-polupricepov .alfa-hero-photo:after,
.page-remont-refrigeratorov .alfa-hero-photo:after,
.page-kuzovnoy-remont .alfa-hero-photo:after {content:"Фото полуприцепа";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--gray-mid);font-size:13px;font-weight:600;background:linear-gradient(135deg,#e8ecf1,#f4f6f9);z-index:0}
.page-remont-polupricepov .alfa-hero-photo img,
.page-remont-refrigeratorov .alfa-hero-photo img,
.page-kuzovnoy-remont .alfa-hero-photo img {position:relative;z-index:1;width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:1100px){
  .page-remont-polupricepov .alfa-hero,
  .page-remont-refrigeratorov .alfa-hero,
  .page-kuzovnoy-remont .alfa-hero {grid-template-columns:1fr;min-height:auto}
  .page-remont-polupricepov .alfa-hero-photo,
  .page-remont-refrigeratorov .alfa-hero-photo,
  .page-kuzovnoy-remont .alfa-hero-photo {min-height:260px;order:2}
}
@media(max-width:820px){
  .page-remont-polupricepov .alfa-hero-inner,
  .page-remont-refrigeratorov .alfa-hero-inner,
  .page-kuzovnoy-remont .alfa-hero-inner {padding:32px 24px}
  .page-remont-polupricepov .alfa-hero h1,
  .page-remont-refrigeratorov .alfa-hero h1,
  .page-kuzovnoy-remont .alfa-hero h1 {font-size:28px}
  .page-remont-polupricepov .alfa-hero-sub,
  .page-remont-refrigeratorov .alfa-hero-sub,
  .page-kuzovnoy-remont .alfa-hero-sub {font-size:15px}
}
@media(max-width:520px){
  .page-remont-polupricepov .alfa-cta,
  .page-remont-refrigeratorov .alfa-cta,
  .page-kuzovnoy-remont .alfa-cta {gap:10px}
  .page-remont-polupricepov .alfa-phone,
  .page-remont-refrigeratorov .alfa-phone,
  .page-kuzovnoy-remont .alfa-phone {font-size:24px}
}
/*  */




/* страница ремонт рефрижераторов */
/* === ТИПЫ ХОУ (3 карточки) === */
.alfa-types{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.alfa-types .it{background:var(--gray-bg);border-radius:var(--r-md);padding:32px 26px;text-align:center}
.alfa-types .it .c{width:64px;height:64px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.alfa-types .it .c svg{width:32px;height:32px;fill:none;stroke:var(--red);stroke-width:1.5}
.alfa-types .it b{display:block;font-size:18px;color:var(--navy);margin-bottom:6px;font-weight:700}
.alfa-types .it span{font-size:14px;color:var(--gray-mid);line-height:1.5}
@media(max-width:1100px){
  .alfa-types{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .alfa-types{grid-template-columns:repeat(2,1fr);gap:10px}
  .alfa-types .it:nth-child(3){grid-column:span 2}
  .alfa-types .it{padding:22px 16px}
  .alfa-types .it b{font-size:15px}
  .alfa-types .it span{font-size:12px}
  .alfa-types .it .c{width:52px;height:52px;margin-bottom:10px}
  .alfa-types .it .c svg{width:26px;height:26px}
}

/* === CTA-БАННЕР «Знаете код ошибки?» === */
.alfa-code{background:linear-gradient(135deg,var(--red),var(--red-hover));color:#fff;border-radius:var(--r-lg);padding:32px 40px;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;position:relative;overflow:hidden}
.alfa-code:after{content:"";position:absolute;right:-80px;bottom:-80px;width:260px;height:260px;background:radial-gradient(circle,rgba(255,255,255,.15),transparent 60%);pointer-events:none}
.alfa-code-text{position:relative;z-index:1}
.alfa-code b{font-size:22px;display:block;margin-bottom:6px;color:#fff;font-weight:700}
.alfa-code span{color:rgba(255,255,255,.9);font-size:15px}
.alfa-code .alfa-btn{background:#fff;color:var(--red)!important;position:relative;z-index:1}
.alfa-code .alfa-btn:hover{background:var(--gray-bg);color:var(--navy)!important}
@media(max-width:820px){
  .alfa-code{padding:24px 26px;flex-direction:column;text-align:center}
}
@media(max-width:520px){
  .alfa-code b{font-size:18px}
}
/*  */


/* страница кузовной ремонт */
/* === УСЛУГИ (4 карточки) === */
.alfa-services5{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.alfa-services5 .it{background:var(--gray-bg);border-radius:var(--r-md);padding:26px 20px 22px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;transition:.2s}
.alfa-services5 .it:hover{background:#e8ecf1;transform:translateY(-2px)}
.alfa-services5 .it .ico{width:60px;height:60px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center}
.alfa-services5 .it svg{width:32px;height:32px;stroke:var(--red);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.alfa-services5 .it b{font-size:15px;color:var(--navy);font-weight:700;line-height:1.3}
@media(max-width:1100px){
  .alfa-services5{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .alfa-services5{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .alfa-services5{grid-template-columns:repeat(2,1fr);gap:10px}
  .alfa-services5 .it{padding:18px 10px 14px;gap:8px}
  .alfa-services5 .it b{font-size:13px;line-height:1.25}
  .alfa-services5 .it .ico{width:48px;height:48px}
  .alfa-services5 .it svg{width:26px;height:26px}
}

/* === 4 УТП === */
.alfa-utp{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.alfa-utp .it{background:#fff;border:1px solid var(--gray-line);border-radius:var(--r-md);padding:26px 22px;display:flex;flex-direction:column;gap:10px}
.alfa-utp .it .ico{width:52px;height:52px;border-radius:50%;background:rgba(202,2,55,.08);display:flex;align-items:center;justify-content:center}
.alfa-utp .it svg{width:26px;height:26px;stroke:var(--red);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.alfa-utp .it b{color:var(--navy);font-size:16px;font-weight:700;line-height:1.3;margin:2px 0 0}
.alfa-utp .it span{color:var(--gray-mid);font-size:13px;line-height:1.5}
@media(max-width:1100px){
  .alfa-utp{grid-template-columns:repeat(2,1fr)}
}@media(max-width:520px){
  .alfa-utp{grid-template-columns:repeat(2,1fr);gap:10px}
  .alfa-utp .it{padding:18px 14px}
  .alfa-utp .it b{font-size:14px}
  .alfa-utp .it span{font-size:12px}
}

/* === КАСКО/ОСАГО БЛОК === */
.alfa-kasko{background:linear-gradient(135deg,var(--navy),var(--navy-deep));border-radius:var(--r-lg);padding:44px;color:#fff;display:grid;grid-template-columns:1.15fr .85fr;gap:36px;position:relative;overflow:hidden}
.alfa-kasko:after{content:"";position:absolute;right:-120px;bottom:-120px;width:420px;height:420px;background:radial-gradient(circle,rgba(202,2,55,.18),transparent 60%);pointer-events:none}
.alfa-kasko-content{position:relative;z-index:1}
.alfa-kasko-tag{display:inline-flex;align-items:center;gap:9px;background:var(--red);padding:8px 16px;border-radius:24px;font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;margin-bottom:16px}
.alfa-kasko h2{color:#fff!important;font-size:28px;margin:0 0 12px}
.alfa-kasko .alfa-lead{color:var(--blue-light)!important;margin:0 0 22px;max-width:560px}
.alfa-kasko-list{list-style:none;padding:0;margin:0 0 26px}
.alfa-kasko-list li{position:relative;padding:8px 0 8px 32px;color:#fff;font-size:15px;line-height:1.45;border-top:1px solid rgba(255,255,255,.08)}
.alfa-kasko-list li:first-child{border-top:0}
.alfa-kasko-list li:before{content:"";position:absolute;left:0;top:12px;width:20px;height:20px;background:rgba(61,220,132,.15);border-radius:50%}
.alfa-kasko-list li:after{content:"";position:absolute;left:6px;top:17px;width:8px;height:4px;border-left:2px solid var(--success);border-bottom:2px solid var(--success);transform:rotate(-45deg)}
.alfa-kasko-partners{position:relative;z-index:1;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-md);padding:24px}
.alfa-kasko-partners-title{color:var(--blue-light);font-size:13px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;margin-bottom:14px}
.alfa-kasko-logos{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.alfa-kasko-logos .lg{background:#fff;color:var(--navy);border-radius:var(--r-sm);padding:14px 12px;font-size:13px;font-weight:700;text-align:center;line-height:1.2;min-height:52px;display:flex;align-items:center;justify-content:center}
@media(max-width:1100px){
  .alfa-kasko{grid-template-columns:1fr;padding:32px 26px}
}
@media(max-width:820px){
  .alfa-kasko-logos{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:520px){
  .alfa-kasko-logos{grid-template-columns:repeat(2,1fr)}
  .alfa-kasko-logos .lg{font-size:12px;min-height:44px}
}

/* === ПОРТФОЛИО (пары до/после) === */
.alfa-portfolio{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.alfa-port-card{background:#fff;border:1px solid var(--gray-line);border-radius:var(--r-md);overflow:hidden;transition:.2s}
.alfa-port-card:hover{border-color:var(--navy);box-shadow:0 8px 24px rgba(12,38,90,.08);transform:translateY(-2px)}
.alfa-port-pair{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--gray-line)}
.alfa-port-half{position:relative;aspect-ratio:4/3;background:var(--gray-bg) center/cover no-repeat;overflow:hidden}
.alfa-port-half:after{content:attr(data-ph);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--gray-mid);font-size:12px;font-weight:600;background:linear-gradient(135deg,#e8ecf1,#f4f6f9);z-index:0}
.alfa-port-half img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;z-index:1}
.alfa-port-tag{position:absolute;top:12px;left:12px;z-index:2;background:rgba(12,38,90,.9);color:#fff;font-size:11px;font-weight:800;letter-spacing:.8px;padding:6px 12px;border-radius:4px;text-transform:uppercase}
.alfa-port-half--after .alfa-port-tag{background:rgba(202,2,55,.95)}
@media(max-width:1100px){
  .alfa-portfolio{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:820px){
  .alfa-portfolio{grid-template-columns:1fr}
}
@media(max-width:520px){
  .alfa-portfolio{grid-template-columns:1fr;gap:12px}
}
/*  */


/* страница установки гбо */
/* === HERO === */
.page-gbo .alfa-hero{background:linear-gradient(135deg,var(--navy),var(--navy-deep));grid-template-columns:1.1fr .9fr;min-height:500px}
.page-gbo .alfa-hero:after{right:-100px;top:-80px;width:460px;height:460px;background:radial-gradient(circle,rgba(202,2,55,.22),transparent 60%);z-index:0}
.page-gbo .alfa-hero-inner{display:flex;flex-direction:column;justify-content:center}
/* .page-gbo .alfa-badge{display:inline-flex;align-items:center;gap:8px;background:var(--red);color:#fff;font-size:13px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:7px 14px;border-radius:20px;margin-bottom:18px;align-self:flex-start} */
/* .page-gbo .alfa-badge:before{content:"🔥";font-size:14px} */
.page-gbo .alfa-hero h1{font-size:38px;line-height:1.1;}
.page-gbo .alfa-hero h1 .ac{padding:0 6px}
.page-gbo .alfa-hero-sub{font-size:17px;line-height:1.55;margin:0 0 24px;max-width:580px}
.page-gbo .alfa-hero-bullets{list-style:none;padding:0;margin:0 0 28px}
.page-gbo .alfa-hero-bullets li{position:relative;padding:7px 0 7px 32px;color:#fff;font-size:15px;line-height:1.4}
.page-gbo .alfa-hero-bullets li:before{content:"";position:absolute;left:0;top:9px;width:20px;height:20px;background:rgba(61,220,132,.2);border-radius:50%}
.page-gbo .alfa-hero-bullets li:after{content:"";position:absolute;left:6px;top:14px;width:8px;height:4px;border-left:2px solid var(--success);border-bottom:2px solid var(--success);transform:rotate(-45deg)}
.page-gbo .alfa-cta{margin-bottom:0}
.page-gbo .alfa-phone{font-size:28px;}
.page-gbo .alfa-hero-photo{position:relative;z-index:1;background:transparent;min-height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:20px}
.page-gbo .alfa-hero-photo img{position:relative;z-index:1;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
@media(max-width:1100px){
  .page-gbo .alfa-hero{grid-template-columns:1fr;min-height:auto}
  .page-gbo .alfa-hero-photo{min-height:280px;order:2}
}
@media(max-width:820px){
  .page-gbo .alfa-hero-inner{padding:32px 24px;text-align:left;align-items:flex-start}
  .page-gbo .alfa-hero h1,.alfa-hero-sub{text-align:left}
  .page-gbo .alfa-hero h1{font-size:26px;display:block}
  .page-gbo .alfa-hero-sub{font-size:15px}
  .page-gbo .alfa-cta{justify-content:flex-start}
  .page-gbo .alfa h2{font-size:24px}
}

/* === 6 ПРИЧИН === */
.alfa-reasons{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.alfa-reason{background:#fff;border:1px solid var(--gray-line);border-radius:var(--r-md);padding:22px 24px;display:flex;flex-direction:column;gap:10px;transition:.2s}
.alfa-reason:hover{border-color:var(--navy);transform:translateY(-2px);box-shadow:0 8px 24px rgba(12,38,90,.06)}
.alfa-reason .n{width:34px;height:34px;border-radius:50%;background:var(--navy);color:#fff;font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center}
.alfa-reason b{color:var(--navy);font-size:16px;font-weight:700;line-height:1.35}
@media(max-width:1100px){
  .alfa-reasons{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .alfa-reasons{grid-template-columns:repeat(2,1fr);gap:10px}
  .alfa-reason{padding:16px 14px}
  .alfa-reason b{font-size:14px}
}


/* === КАЛЬКУЛЯТОР === */
.alfa-calc{background:linear-gradient(135deg,var(--navy),var(--navy-deep));border-radius:var(--r-lg);padding:44px;color:#fff;display:grid;grid-template-columns:1fr 1fr;gap:40px;position:relative;overflow:hidden}
.alfa-calc:after{content:"";position:absolute;right:-120px;bottom:-120px;width:420px;height:420px;background:radial-gradient(circle,rgba(202,2,55,.18),transparent 60%);pointer-events:none}
.alfa-calc-form{position:relative;z-index:1}
.alfa-calc-form h2{color:#fff!important;margin-bottom:10px}
.alfa-calc-form .alfa-lead{color:var(--blue-light)!important;margin-bottom:28px}
.alfa-calc-field{margin-bottom:22px}
.alfa-calc-field label{display:block;color:var(--blue-light);font-size:13px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;margin-bottom:10px}
.alfa-calc-field .row{display:flex;align-items:center;gap:16px}
.alfa-calc-slider{flex:1;appearance:none;height:4px;background:rgba(255,255,255,.2);border-radius:4px;outline:0}
.alfa-calc-slider::-webkit-slider-thumb{appearance:none;width:22px;height:22px;border-radius:50%;background:var(--red);cursor:pointer;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.alfa-calc-slider::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--red);cursor:pointer;border:3px solid #fff}
.alfa-calc-value{min-width:120px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:var(--r-sm);padding:10px 14px;color:#fff;font-size:16px;font-weight:700;text-align:center}
.alfa-calc-result{position:relative;z-index:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:var(--r-md);padding:32px;display:flex;flex-direction:column;justify-content:center}
.alfa-calc-result-label{color:var(--blue-light);font-size:14px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;margin-bottom:12px}
.alfa-calc-result-value{color:var(--success);font-size:52px;font-weight:800;line-height:1;margin-bottom:8px;letter-spacing:-.03em}
.alfa-calc-result-unit{color:var(--blue-light);font-size:16px;margin-bottom:24px}
.alfa-calc-result-sub{color:rgba(255,255,255,.8);font-size:13px;line-height:1.55;border-top:1px solid rgba(255,255,255,.1);padding-top:16px}
.alfa-calc-result-sub b{color:#fff}
.alfa-calc-result .alfa-btn{margin-top:20px}
@media(max-width:1100px){
  .alfa-calc{grid-template-columns:1fr;padding:32px 26px}
}
@media(max-width:520px){
  .alfa-calc-value{min-width:90px;font-size:14px;padding:8px 10px}
  .alfa-calc-result-value{font-size:40px}
  .alfa-calc{padding:26px 20px}
}

/* === ПРИМЕРЫ ТЕХНИКИ (5 карточек) === */
.alfa-examples{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.alfa-example{background:#fff;border:1px solid var(--gray-line);border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column;transition:.2s}
.alfa-example:hover{border-color:var(--navy);transform:translateY(-2px);box-shadow:0 8px 24px rgba(12,38,90,.08)}
.alfa-example-photo{aspect-ratio:4/3;background:var(--gray-bg) center/cover no-repeat;position:relative;overflow:hidden}
.alfa-example-photo:after{content:attr(data-ph);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--gray-mid);font-size:12px;font-weight:600;background:linear-gradient(135deg,#e8ecf1,#f4f6f9);z-index:0;padding:0 10px;text-align:center}
.alfa-example-photo img{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover}
.alfa-example-body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:4px;flex:1}
.alfa-example-model{color:var(--navy);font-weight:700;font-size:15px;margin-bottom:8px;line-height:1.25}
.alfa-example-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--gray-mid);line-height:1.3;padding:3px 0}
.alfa-example-row b{color:var(--navy);font-weight:700}
.alfa-example-save{margin-top:auto;padding-top:12px;border-top:1px solid var(--gray-line);display:flex;flex-direction:column;gap:2px}
.alfa-example-save-label{font-size:11px;color:var(--red);font-weight:700;letter-spacing:.5px;text-transform:uppercase}
.alfa-example-save-value{color:var(--navy);font-size:18px;font-weight:800;line-height:1}
.alfa-examples-note{margin-top:16px;color:var(--gray-mid);font-size:12px;line-height:1.5}
@media(max-width:1100px){
  .alfa-examples{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:820px){
  /* Примеры -> горизонтальный слайдер (видно часть следующей карточки) */
  .alfa-examples{
    display:flex;
    grid-template-columns:none;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    gap:12px;
    margin:0 -24px;
    padding:4px 24px 14px;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .alfa-examples::-webkit-scrollbar{display:none}
  .alfa-example{flex:0 0 78%;scroll-snap-align:start}
}
@media(max-width:520px){
  .alfa-example{flex:0 0 82%}
  .alfa-example-model{font-size:14px}
  .alfa-example-save-value{font-size:16px}
}

/* === 6 ЭТАПОВ === */
.page-gbo .alfa-steps{grid-template-columns:repeat(3,1fr);gap:16px;}
.page-gbo .alfa-step{background:#fff;border:1px solid var(--gray-line);padding:28px 24px 22px;display:flex;flex-direction:column;gap:10px}
.page-gbo .alfa-step:before{content:none;}
.page-gbo .alfa-step .n{counter-increment:s;content:counter(s);width:42px;height:42px;border-radius:50%;background:var(--red);color:#fff;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center}
.page-gbo .alfa-step b{line-height:1.3}
.page-gbo .alfa-step span{line-height:1.5}
.page-gbo .alfa-steps-cta{background:linear-gradient(135deg,var(--navy),var(--navy-deep));color:#fff;border-radius:var(--r-md);padding:26px 32px;margin-top:20px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.page-gbo .alfa-steps-cta b{color:#fff;font-size:22px;font-weight:800}
.page-gbo .alfa-steps-cta span{color:var(--blue-light);font-size:14px}
.page-gbo .alfa-steps-note{margin-top:16px;color:var(--gray-mid);font-size:12px;line-height:1.6}
@media(max-width:1100px){
  .page-gbo .alfa-steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .page-gbo .alfa-steps .alfa-step:nth-child(5) {
    grid-column: span 1;
  }
  .page-gbo .alfa-step{padding:22px 18px 18px}
}

/* === КОМПЛЕКТ ГАЗОДИЗЕЛЬНОЙ СИСТЕМЫ === */
.alfa-kit{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.alfa-kit .it{background:var(--gray-bg);border-radius:var(--r-md);padding:20px 16px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;transition:.2s}
.alfa-kit .it:hover{background:#e8ecf1}
.alfa-kit .it .ico{width:50px;height:50px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center}
.alfa-kit .it svg{width:28px;height:28px;stroke:var(--red);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.alfa-kit .it b{color:var(--navy);font-size:13px;font-weight:700;line-height:1.25}
.alfa-kit-note{margin-top:14px;color:var(--gray-mid);font-size:12px}
@media(max-width:1100px){
  .alfa-kit{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:820px){
  .alfa-kit{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .alfa-kit{font-size:20px}
  .alfa-kit .it{padding:14px 10px}
  .alfa-kit .it b{font-size:12px}
}

/* === 6 ВЫГОД === */
.alfa-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.alfa-benefit{background:#fff;border:1px solid var(--gray-line);border-radius:var(--r-md);padding:24px 22px;display:flex;gap:14px;align-items:flex-start}
.alfa-benefit .ico{flex:0 0 46px;width:46px;height:46px;border-radius:50%;background:rgba(202,2,55,.08);display:flex;align-items:center;justify-content:center}
.alfa-benefit svg{width:22px;height:22px;stroke:var(--red);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.alfa-benefit b{display:block;color:var(--navy);font-size:16px;font-weight:700;line-height:1.3;margin-bottom:4px}
.alfa-benefit span{color:var(--gray-mid);font-size:13px;line-height:1.5}
@media(max-width:1100px){
  .alfa-benefits{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .alfa-benefits{font-size:20px}
  .alfa-benefit{padding:18px 14px;gap:10px}
  .alfa-benefit b{font-size:14px}
  .alfa-benefit span{font-size:12px}
}

/* === 3 ПРОГРАММЫ === */
.alfa-programs{display:grid;grid-template-columns:1fr;gap:14px}
.alfa-program{background:#fff;border:1px solid var(--gray-line);border-radius:var(--r-md);overflow:hidden}
.alfa-program-head{background:var(--navy);color:#fff;padding:18px 28px;display:flex;align-items:center;gap:14px}
.alfa-program-head b{font-size:17px;font-weight:700}
.alfa-program-tag{display:inline-flex;align-items:center;background:var(--red);padding:4px 12px;border-radius:16px;font-size:12px;font-weight:800;letter-spacing:.5px;text-transform:uppercase}
.alfa-program-body{padding:22px 28px;display:grid;grid-template-columns:1fr 1fr;gap:16px 32px}
.alfa-program-row{display:flex;align-items:flex-start;gap:12px}
.alfa-program-row .dot{flex:0 0 8px;width:8px;height:8px;border-radius:50%;background:var(--red);margin-top:7px}
.alfa-program-row .label{color:var(--navy);font-weight:700;font-size:14px;line-height:1.4}
.alfa-program-row .value{color:var(--gray-mid);font-size:14px;line-height:1.5;margin-top:3px}
.alfa-program-note{color:var(--gray-mid);font-size:13px;margin-top:14px;padding-left:32px;font-style:italic}
@media(max-width:1100px){
  .alfa-program-body{grid-template-columns:1fr}
}

/* === ПАРТНЁРЫ === */
.alfa-partners{background:var(--gray-bg);border-radius:var(--r-lg);padding:40px;display:grid;grid-template-columns:1.5fr 1fr;gap:36px;align-items:center}
.alfa-partners h2{margin-bottom:8px}
.alfa-partners-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}
.alfa-partner{background:#fff;border-radius:var(--r-md);padding:18px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:110px}
.alfa-partner-logo{height:30px;display:flex;align-items:center;justify-content:center;color:var(--navy);font-weight:800;font-size:16px;letter-spacing:-.02em}
.alfa-partner-count{color:var(--red);font-size:22px;font-weight:800;line-height:1}
.alfa-partner-unit{color:var(--gray-mid);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.alfa-partners-stats{background:var(--navy);color:#fff;border-radius:var(--r-md);padding:28px 32px;display:flex;flex-direction:column;gap:22px}
.alfa-partners-stat b{color:#fff;font-size:38px;font-weight:800;line-height:1;letter-spacing:-.03em;display:block;margin-bottom:4px}
.alfa-partners-stat span{color:var(--blue-light);font-size:14px}
@media(max-width:1100px){
  .alfa-partners{grid-template-columns:1fr;padding:32px 26px}
}
@media(max-width:820px){
  .alfa-partners{padding:28px 22px}
  .alfa-partners-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .alfa-partners-grid
  .alfa-partner-count{font-size:20px}
  .alfa-partners-stat b{font-size:30px}
}

/* === ФОРМА === */
@media(min-width:1101px){
  .page-gbo .ash-form-grid{grid-template-columns:1fr 1fr 1fr;gap:16px;margin-bottom:18px}
}
/*  */