/* ===== Reviews carousel (What Our Customers Say) ===== */
.reviews--modern {
  margin-top: -130px;
}
.reviews-carousel {
  margin-top: 0;
  margin-bottom: 20px;
  padding: 30px 0;
  overflow: hidden;
  position: relative;
}
.reviews-carousel-track {
  display: flex;
  animation: reviews-carousel-move 35s linear infinite;
}

.review-carousel-slide {
  flex: 0 0 350px;
  margin-right: 20px;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
  padding: 20px;
  margin-top: 10px;
  margin-bottom: 10px;
}
.review-carousel-rating {
  color: #ffb400;
  font-size: 18px;
  letter-spacing: 2px;
  margin-bottom: 8px;
}
.review-carousel-text {
  margin: 0 0 10px 0;
  color: #333;
  line-height: 1.45;
  font-style: italic;
}
.review-carousel-author {
  color: #555;
  font-size: 0.95rem;
}

@keyframes reviews-carousel-move {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-5 * (350px + 20px)));
  }
}
/* ===== Portfolio carousel (Our Recent Sub-Zero Work) ===== */
.portfolio-carousel {
  margin-top: 48px;
  margin-bottom: 24px;
  padding: 20px 0;
  overflow: hidden;
  position: relative;
}

.carousel-track {
  display: flex;
  animation: carousel-smooth 40s linear infinite;
}

.carousel-slide {
  flex: 0 0 300px;
  margin-right: 24px;
  border-radius: 14px;
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.carousel-slide:last-child {
  margin-right: 0;
}
.carousel-slide img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}
.slide-info {
  padding: 12px 12px 14px;
}
.carousel-slide:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}

@keyframes carousel-smooth {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-5 * (300px + 24px)));
  }
}
/* Sub-Zero header: prevent global .btn-call::after phone duplication */
body.page-subzero header .btn-call::after {
  content: none !important;
}
/* ===== Scope: только страница Sub-Zero ===== */

/* Breadcrumbs */
.page-subzero .brand-crumbs {
  max-width: 1200px;
  margin: 12px auto 4px;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #666;
}

.page-subzero .brand-crumbs .home-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #ff6600;
  text-decoration: none;
  font-weight: 700;
}

.page-subzero .brand-crumbs .home-link svg {
  width: 16px;
  height: 16px;
  stroke: #ff6600;
}

/* Hero — чистый фон, без оверлеев */
.page-subzero .sub-hero {
  background: #fff;
  position: relative;
  padding: 12px 0 8px;
  margin-top: 20px;
}

/* Top strip under header: reuse global styles if present */
.top-strip {
  position: sticky;
  top: 72px;
  z-index: 90;
  background: linear-gradient(90deg, #1e90ff, #007bff);
  color: #fff;
  font-family: "Montserrat", Arial, sans-serif;
  transition: transform 0.25s ease, opacity 0.25s ease;
  margin-top: 0;
}
.top-strip .container {
  padding: 1px 24px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 20px;
}
.top-strip-text {
  font-weight: 700;
  letter-spacing: 1px;
  font-size: 0.9rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: none;
  max-width: 100%;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.top-strip-text--full {
  display: inline-block;
}
.top-strip-text--short {
  display: none;
}
.top-strip.hidden {
  transform: translateY(-110%);
  opacity: 0;
  pointer-events: none;
}
@media (max-width: 480px) {
  .top-strip {
    top: 72px;
  }
  .top-strip .container {
    padding: 1px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 18px;
  }
  .top-strip-text {
    font-size: 0.8rem;
    letter-spacing: 1px;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  }
  .top-strip-text--full {
    display: none;
  }
  .top-strip-text--short {
    display: inline-block;
  }
}

.page-subzero .sub-hero::before,
.page-subzero .sub-hero::after {
  display: none !important;
  content: none !important;
}

/* Логотип */
.page-subzero .brand-logo-large {
  width: 420px;
  max-width: 92vw;
  height: auto;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
  margin: 0 auto 8px;
  display: block;
}

@media (min-width: 992px) {
  .page-subzero .brand-logo-large {
    width: 480px;
  }
}

@media screen and (width: 430px) and (orientation: portrait) {
  .page-subzero .brand-logo-large {
    width: 460px;
  }
}

/* Бейджи + CTA компактнее */
.page-subzero .license-minimal {
  margin: 6px 0 0;
}
/* Inline license line like index */
.page-subzero .license-line {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
}
.page-subzero .license-item {
  font-family: "Montserrat", Arial, sans-serif;
  font-weight: 800;
  letter-spacing: 0.14em;
  color: #111;
  font-size: 1rem;
  text-transform: uppercase;
}
.page-subzero .license-item:not(:last-child)::after {
  content: "\2022";
  display: inline-block;
  width: 1.2em;
  text-align: center;
  margin: 0 12px;
  color: #9aa3af;
}

/* iPhone: license в одну строку */
@media (max-width: 480px) {
  .page-subzero .license-line {
    flex-wrap: nowrap;
    white-space: nowrap;
    gap: 0;
    font-size: 0.85rem;
  }
  .page-subzero .license-item {
    font-size: 0.85rem;
    letter-spacing: 0.1em;
  }
  .page-subzero .license-item:not(:last-child)::after {
    width: 1em;
    margin: 0 6px;
  }
}

@media (max-width: 390px) {
  .page-subzero .license-minimal .license-buttons a {
    min-width: auto;
    font-size: 13px;
    padding: 8px 12px;
  }
}

/* CTA — без «свечки», чуть меньше и ближе к бейджам */
.page-subzero .sub-hero .cta-button {
  margin-top: 10px;
  padding: 16px 28px;
  font-size: 16px;
  border-radius: 28px;
  box-shadow: none !important;
  filter: none !important;
  text-shadow: none !important;
}

.page-subzero .sub-hero .cta-button::before,
.page-subzero .sub-hero .cta-button::after {
  content: none !important;
}

/* Why Choose ближе к кнопке */
.page-subzero .hero + .features-block {
  margin-top: 12px;
  padding-top: 0;
}

.page-subzero .features-title {
  margin: 10px 0 22px;
}

/* Why modern grid like index */
.page-subzero .features-grid-modern {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}
@media (max-width: 1024px) {
  .page-subzero .features-grid-modern {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}
@media (max-width: 600px) {
  .page-subzero .features-grid-modern {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

.page-subzero .why-card {
  position: relative;
  background: #fff;
  border: none;
  border-radius: 14px;
  padding: 18px 18px 16px;
  text-align: left;
  box-shadow: 0 6px 16px rgba(20, 32, 50, 0.06);
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.page-subzero .why-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 3px;
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
  background: linear-gradient(90deg, #1e90ff, #ff6600);
}
.page-subzero .why-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 34px rgba(20, 32, 50, 0.12);
}
.page-subzero .why-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}
.page-subzero .why-icon {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1e90ff 0%, #007bff 60%);
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: 0 8px 18px rgba(30, 144, 255, 0.22);
}
.page-subzero .why-icon svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
}
.page-subzero .why-title {
  font-weight: 800;
  font-size: 1.02rem;
  color: #142032;
  line-height: 1.2;
}
.page-subzero .why-text {
  color: #516070;
  font-size: 0.95rem;
  line-height: 1.4;
  margin-left: 66px;
}

/* iPhone compact: 2x2 icons + titles only */
@media (max-width: 480px) {
  .page-subzero .why-card {
    padding: 14px 10px;
    text-align: center;
  }
  .page-subzero .why-card::before {
    content: none;
  }
  .page-subzero .why-head {
    flex-direction: column;
    gap: 8px;
    margin-bottom: 0;
  }
  .page-subzero .why-icon {
    width: 48px;
    height: 48px;
  }
  .page-subzero .why-title {
    font-size: 0.95rem;
  }
  .page-subzero .why-text {
    display: none;
  }
}

/* Блок карточек под Why — без фоновых эффектов hero */
.page-subzero .brand-cards {
  background: #fff;
  position: relative;
  padding: 12px 0;
}

.page-subzero .brand-cards::before,
.page-subzero .brand-cards::after {
  display: none !important;
  content: none !important;
}

/* Портфолио: размеры как на главной */
.page-subzero .portfolio-block .portfolio-swiper--subzero .swiper-slide {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
}

.page-subzero .portfolio-block .portfolio-swiper--subzero .swiper-slide img {
  display: block;
  width: 100%;
  height: 220px;
  object-fit: cover;
  transform: translateZ(0);
}

@media (min-width: 640px) {
  .page-subzero .portfolio-block .portfolio-swiper--subzero .swiper-slide img {
    height: 240px;
  }
}

@media (min-width: 1024px) {
  .page-subzero .portfolio-block .portfolio-swiper--subzero .swiper-slide img {
    height: 260px;
  }
}

@media (min-width: 1440px) {
  .page-subzero .portfolio-block .portfolio-swiper--subzero .swiper-slide img {
    height: 280px;
  }
}

/* Если нужно, чтобы Our Recent не был виден above-the-fold */
.page-subzero .features-block + .portfolio-block {
  margin-top: 28px;
}

/* или 32vh если хочешь гарантированно ниже первого экрана */
/* Reveal-анимация (если используешь .defer-recent на секции портфолио) */
.page-subzero .defer-recent {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.35s ease, transform 0.35s ease;
  pointer-events: none;
}

.page-subzero .defer-recent.is-revealed {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

/* Плавающая CTA — только на мобиле и только когда .is-visible */
.page-subzero .sticky-cta {
  display: none;
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: calc(12px + env(safe-area-inset-bottom));
  z-index: 1000;
  text-align: center;
  font-weight: 800;
  letter-spacing: 0.2px;
  padding: 14px 16px;
  border-radius: 999px;
  background: linear-gradient(180deg, #ff7a1a 0%, #ff6600 100%);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 14px 30px rgba(255, 102, 0, 0.28);
}

@media (max-width: 768px) {
  .page-subzero .sticky-cta {
    display: none;
  }

  .page-subzero .sticky-cta.is-visible {
    display: block;
  }
}

body.modal-open .sticky-cta {
  display: none;
}

/* ===== Sub-Zero hero: компактнее, как на главной ===== */
.page-subzero .sub-hero {
  padding-top: 18px;
  /* было больше */
  padding-bottom: 6px;
  /* было больше */
}

.page-subzero .brand-logo-large {
  width: 420px;
  max-width: 92vw;
  margin: 0 auto 6px;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
}

.page-subzero .hero-title-bg {
  margin: 8px auto;
}

/* синяя табличка */
.page-subzero .hero .license-minimal {
  margin: 6px 0 0;
}

/* ряд бейджей */
.page-subzero .license-minimal .license-buttons {
  display: flex;
  justify-content: center;
  gap: 12px;
}

.page-subzero .license-minimal .license-buttons a {
  padding: 10px 18px;
  border-radius: 22px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
  white-space: nowrap;
}

.page-subzero .hero .cta-button {
  margin-top: 14px;
  /* кнопка ближе к бейджам */
  box-shadow: 0 10px 26px rgba(255, 102, 0, 0.2);
  /* мягкая, как на главной */
}

/* ===== Переход к Why Choose — ближе к кнопке ===== */
.page-subzero .features-block {
  margin-top: -500px !important;
  /* поднимаем секцию выше, чтобы все 4 кнопки поместились на главном экране */
}

/* Планшеты */
@media (min-width: 768px) and (max-width: 1199px) {
  .page-subzero .features-block {
    margin-top: -300px !important;
    /* поднимаем секцию выше на планшетах */
  }
}

.page-subzero .features-title {
  margin-bottom: 18px;
}

/* карточки why choose чуть плотнее на десктопе */
.page-subzero .features-inner {
  gap: 18px;
}

/* ===== Дальше по странице — ровные шаги ===== */
.page-subzero .portfolio-block {
  margin-top: 36px;
}

.page-subzero .reviews-block {
  margin-top: 28px;
}

.page-subzero .brand-cards {
  margin-top: 28px;
}

/* ===== iPhone 16 Pro Max (430px) — проверенный компакт ===== */
@media screen and (width: 430px) and (orientation: portrait) {
  .page-subzero .brand-logo-large {
    width: 460px;
  }

  .page-subzero .hero-title-bg {
    margin: 6px auto;
  }

  .page-subzero .hero .cta-button {
    margin-top: 12px;
  }

  .page-subzero .features-block {
    margin-top: 12px;
    /* возвращаем как было на мобильных */
  }
}

/* универсальная мобильная мелкая косметика */
@media (max-width: 480px) {
  .page-subzero .license-minimal .license-buttons {
    gap: 10px;
  }

  .page-subzero .license-minimal .license-buttons a {
    padding: 9px 14px;
  }

  .page-subzero .features-inner {
    gap: 14px;
  }
}

body.page-subzero .sub-hero + .features-block {
  margin-top: 12px !important;
  /* возвращаем как было на мобильных */
}
@media (max-width: 480px) {
  body.page-subzero .license-buttons a {
    padding: 10px 12px;
    font-size: 13px;
  }
}

@media (max-width: 480px) {
  body.page-subzero .features-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px !important;
  }
}

body.page-subzero .hero-mini-links {
  margin-top: 10px;
  font-size: 14px;
  opacity: 0.85;
}

body.page-subzero .hero-mini-links a {
  color: #1e90ff;
  text-decoration: none;
}

body.page-subzero .features-block::before,
body.page-subzero .features-block::after,
body.page-subzero .portfolio-block::before,
body.page-subzero .portfolio-block::after,
body.page-subzero .portfolio-block .container {
  box-shadow: none !important;
  border-top: 0 !important;
  background: #fff !important;
}
/* ——— Убрать серую полоску между Why Choose и портфолио ——— */
body.page-subzero .features-block {
  margin-bottom: 12px !important;
}

body.page-subzero .portfolio-block {
  position: relative;
  padding-top: 16px !important;
  background: #fff !important;
  border-top: 0 !important;
  box-shadow: none !important;
}

/* если полоска рисуется глобальным псевдо-элементом — отключаем его */
body.page-subzero main::before,
body.page-subzero .features-block::after,
body.page-subzero .features-block::before,
body.page-subzero .features-block + .portfolio-block::before,
body.page-subzero .features-block + .section-divider {
  display: none !important;
  content: none !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* страховка: белая «маска», перекрывающая любую линию сверху портфолио */
body.page-subzero .portfolio-block::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -18px;
  height: 18px;
  background: #fff;
  pointer-events: none;
}

/* Убрать серую полосу между Why и портфолио — только на Sub-Zero */
.page-subzero .features-block {
  background: #fff !important;
  margin-bottom: 8px !important;
}

.page-subzero .portfolio-block {
  background: #fff !important;
  margin-top: -12px !important;
  /* перекрываем возможный разделитель */
  padding-top: 16px !important;
}

/* если полоса рисуется псевдо-элементами/разделителями — глушим их */
.page-subzero main::before,
.page-subzero .features-block::after,
.page-subzero .features-block::before,
.page-subzero .features-block + .portfolio-block::before {
  content: none !important;
  display: none !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* ===== SUB-ZERO: только белый фон по всей странице ===== */
body.page-subzero {
  background: #fff !important;
}

/* секции страницы */
body.page-subzero main,
body.page-subzero section,
body.page-subzero .hero,
body.page-subzero .sub-hero,
body.page-subzero .features-block,
body.page-subzero .portfolio-block,
body.page-subzero .reviews-block,
body.page-subzero .wf-faq,
body.page-subzero .brand-cards,
body.page-subzero .site-footer,
body.page-subzero .footer-brand,
body.page-subzero .footer-copy {
  background: #fff !important;
}

/* убираем любые разделители/градиенты/полосы между секциями */
body.page-subzero main::before,
body.page-subzero main::after,
body.page-subzero .hero::before,
body.page-subzero .hero::after,
body.page-subzero .features-block::before,
body.page-subzero .features-block::after,
body.page-subzero .portfolio-block::before,
body.page-subzero .portfolio-block::after,
body.page-subzero .reviews-block::before,
body.page-subzero .reviews-block::after,
body.page-subzero .wf-faq::before,
body.page-subzero .wf-faq::after,
body.page-subzero .brand-cards::before,
body.page-subzero .brand-cards::after {
  content: none !important;
  display: none !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border: 0 !important;
}

/* на всякий случай — убираем верх/низовые разделительные бордеры */
body.page-subzero .features-block,
body.page-subzero .portfolio-block,
body.page-subzero .reviews-block,
body.page-subzero .wf-faq {
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
}

/* небольшая стыковка, чтобы «Why» было ближе к hero */
body.page-subzero .features-block {
  margin-top: 12px !important;
}

body.page-subzero .features-block + .portfolio-block {
  margin-top: 8px !important;
  padding-top: 16px !important;
}

/* если где-то есть hr/разделители — глушим */
body.page-subzero hr,
body.page-subzero .divider,
body.page-subzero .section-divider {
  display: none !important;
}

/* Breadcrumbs — аккуратное выравнивание */
.brand-crumbs {
  max-width: 1200px;
  margin: 12px auto 0;
  padding: 0 16px;
  display: flex;
  align-items: center;
  font-weight: 700;
  gap: 8px;
  color: #6b7280;
  /* серый для неактивного */
}

.brand-crumbs * {
  line-height: 1;
}

.brand-crumbs .home-link {
  display: inline-flex;
  align-items: center;
  color: #ff6600;
  /* оранжевый "Home" */
  text-decoration: none;
  gap: 6px;
}

.brand-crumbs .home-link:hover {
  text-decoration: underline;
}

.brand-crumbs .crumb-back {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  display: block;
  /* убирает "просветы" слева */
}

.brand-crumbs .crumb-sep {
  opacity: 0.35;
  margin: 0 4px;
}

.brand-crumbs .crumb-current {
  color: #6b7280;
  font-weight: 600;
}

@media (max-width: 480px) {
  .brand-crumbs {
    font-size: 14px;
  }

  .brand-crumbs .crumb-back {
    width: 12px;
    height: 12px;
  }
}
/* -------- BREADCRUMBS HARD RESET -------- */
.brand-crumbs,
.brand-crumbs * {
  background: transparent !important;
  box-shadow: none !important;
}

/* Убиваем любые старые «стрелочки»/полоски */
.brand-crumbs::before,
.brand-crumbs::after,
.brand-crumbs .home-link::before,
.brand-crumbs .home-link::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  background: none !important;
}

/* Точные отступы/выравнивание */
.brand-crumbs {
  max-width: 1200px;
  margin: 12px auto 0;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1;
}

.brand-crumbs .home-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #ff6600;
  text-decoration: none;
  font-weight: 700;
}

.brand-crumbs .crumb-sep {
  opacity: 0.35;
  margin: 0 4px;
}

.brand-crumbs .crumb-current {
  color: #6b7280;
  font-weight: 600;
}

/* SVG-стрелка, если используешь её */
.brand-crumbs .crumb-back {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  display: block;
  /* чтобы ничего не «обрезало» */
}

/* ==== HARD RESET для крошек только на brand-странице ==== */

/* убрать любые фоновые подложки/тени */
.brand-crumbs,
.brand-crumbs * {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Убить любые стрелочки/полоски, которые рисуются псевдо-элементами */
.brand-crumbs::before,
.brand-crumbs::after,
.brand-crumbs *::before,
.brand-crumbs *::after {
  content: none !important;
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  border: 0 !important;
  background: none !important;
}

/* На случай, если это list-style или маркер */
.brand-crumbs,
.brand-crumbs * {
  list-style: none !important;
}

/* базовая верстка самих крошек */
.brand-crumbs {
  max-width: 1200px;
  margin: 12px auto 0;
  padding: 0 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1;
}

.brand-crumbs .home-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #ff6600;
  text-decoration: none;
  font-weight: 700;
}

.brand-crumbs .crumb-sep {
  opacity: 0.35;
  margin: 0 4px;
}

.brand-crumbs .crumb-current {
  color: #6b7280;
  font-weight: 600;
}

/* поднять крошки над любыми фонами/оверлеями */
.page-subzero .brand-crumbs {
  position: relative;
  z-index: 10;
  overflow: visible;
  /* на случай clip/overflow */
}

/* сам SVG-иконке тоже задам явный слой */
.page-subzero .brand-crumbs .home-link svg {
  position: relative;
  z-index: 11;
}

/* на этой странице отключаем любые псевдо-оверлеи hero */
.page-subzero .sub-hero::before,
.page-subzero .sub-hero::after {
  content: none !important;
  display: none !important;
}

/* и убедимся, что секции не создают «полос» и не перекрывают */
.page-subzero .sub-hero,
.page-subzero main,
.page-subzero .features-block,
.page-subzero .portfolio-block,
.page-subzero .reviews-block,
.page-subzero .wf-faq,
.page-subzero .brand-cards {
  background: #fff !important;
  position: relative;
  z-index: 1;
}

/* Скрыть стрелки Swiper на мобильных, оставить пагинацию */
@media (max-width: 767px) {
  .portfolio-swiper .swiper-button-prev,
  .portfolio-swiper .swiper-button-next,
  .reviews-swiper .swiper-button-prev,
  .reviews-swiper .swiper-button-next {
    display: none !important;
  }

  .portfolio-swiper .swiper-pagination {
    display: block;
  }
}

/* Мобильная плотность (iPhone 13/16 Pro Max и похожие) */
@media (max-width: 480px) {
  .page-subzero .sub-hero {
    padding: 16px 0 8px;
  }

  .page-subzero .brand-logo-large {
    width: 220px;
    margin: 6px auto 8px;
  }

  .page-subzero .hero-title {
    font-size: 22px;
    padding: 8px 14px;
  }

  .page-subzero .license-minimal .license-buttons a {
    padding: 8px 12px;
    font-size: 12.5px;
  }

  .page-subzero .features-inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .page-subzero .feature {
    padding: 14px;
  }

  .page-subzero .feature svg {
    width: 36px;
    height: 36px;
  }

  .page-subzero .feature div {
    font-size: 14px;
  }
}

/* Sticky CTA — безопасная зона iOS */
.sticky-cta {
  bottom: max(12px, env(safe-area-inset-bottom));
}

/* Универсальные фокусы (чуть заметнее, но не агрессивно) */
a:focus-visible,
button:focus-visible {
  outline: 2px solid #007bff;
  outline-offset: 2px;
}

.reviews-swiper {
  position: relative;
  overflow: hidden;
}

.reviews-swiper .swiper-wrapper {
  align-items: stretch;
}

.reviews-swiper .swiper-slide {
  height: auto;
}

.reviews-swiper .swiper-button-prev,
.reviews-swiper .swiper-button-next {
  z-index: 5;
  pointer-events: auto;
}

.reviews-swiper--subzero {
  overflow: hidden;
}

.reviews-swiper--subzero .swiper-wrapper {
  align-items: stretch;
}

.reviews-swiper--subzero .swiper-slide {
  height: auto;
}

/* === Sub-Zero: mobile-only (как на index), desktop не трогаем === */
@media (max-width: 430px) {
  /* компактные заголовки секций */
  .page-subzero .section-title,
  .page-subzero .reviews-block h3,
  .page-subzero .reviews-title {
    font-family: "Montserrat", Arial, sans-serif;
    font-weight: 800;
    font-size: 22px;
    line-height: 1.2;
    letter-spacing: 0.2px;
    color: #1e90ff;
    margin: 12px 0 10px;
    text-align: center;
  }

  /* контейнеры ближе к краям, как на главной */
  .page-subzero .container {
    padding: 0 12px;
  }

  /* портфолио: фикс. формат 4:3 и обрезка по краям */
  .page-subzero .portfolio-swiper--subzero .swiper-slide {
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 16px;
  }

  .page-subzero .portfolio-swiper--subzero .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  .page-subzero .portfolio-swiper--subzero .swiper-pagination {
    position: static;
    margin-top: 8px;
  }

  /* отзывы: карточки компактнее, стрелки скрываем на мобиле */
  .page-subzero .reviews-swiper--subzero .review-card {
    padding: 18px 16px;
  }

  .page-subzero .reviews-swiper--subzero .swiper-button-next,
  .page-subzero .reviews-swiper--subzero .swiper-button-prev {
    display: none !important;
  }

  /* мелкие шрифты внутри карточек отзывов */
  .page-subzero .review-card .review-text {
    font-size: 15px;
  }

  .page-subzero .review-card .review-author {
    font-size: 13px;
  }
}

/* iPhone 13/14/15/16 — ещё на «клик» меньше */
@media (max-width: 390px) {
  .page-subzero .section-title,
  .page-subzero .reviews-block h3,
  .page-subzero .reviews-title {
    font-size: 20px;
  }
}
/* === Sub-Zero (iPhone): bigger titles + non-square photos === */
@media (max-width: 430px) {
  /* крупнее заголовки двух секций */
  .page-subzero .section-title,
  .page-subzero .reviews-block h3,
  .page-subzero .reviews-title {
    font-family: "Montserrat", Arial, sans-serif;
    font-weight: 900;
    font-size: clamp(26px, 6.6vw, 32px);
    line-height: 1.15;
    letter-spacing: 0.3px;
    margin: 14px 0 10px;
    text-align: center;
  }

  /* портфолио: слайды прямоугольные (более вытянутые) */
  .page-subzero .portfolio-swiper--subzero .swiper-slide {
    aspect-ratio: 3 / 2 !important;
    /* было «квадрат», теперь 1.5:1 */
    border-radius: 16px;
    overflow: hidden;
  }

  .page-subzero .portfolio-swiper--subzero .swiper-slide img {
    width: 100%;
    height: 100% !important;
    /* заполняем контейнер */
    object-fit: cover;
    /* без полос по краям */
    object-position: center;
    display: block;
  }

  /* чуть меньше «воздуха» под слайдером */
  .page-subzero .portfolio-swiper--subzero .swiper-pagination {
    position: static;
    margin-top: 8px;
  }
}
/* === iPhone: портфолио выше и почти вплотную к Reviews === */
@media (max-width: 430px) {
  /* сам контейнер слайдера */
  .page-subzero .portfolio-swiper--subzero {
    position: relative;
    padding-bottom: 0 !important;
    /* убираем внутренние отступы снизу */
    margin-bottom: 8px !important;
    /* почти вплотную к следующему блоку */
  }

  /* делаем каждый слайд высоким и прямоугольным */
  .page-subzero .portfolio-swiper--subzero .swiper-slide {
    height: clamp(360px, 64vh, 620px) !important;
    /* занимает ~2/3 экрана */
    border-radius: 18px;
    overflow: hidden;
  }

  .page-subzero .portfolio-swiper--subzero .swiper-slide img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    /* без белых полей */
    object-position: center;
    display: block;
  }

  /* пагинация — поверх фото, чтобы не съедала место снизу */
  .page-subzero .portfolio-swiper--subzero .swiper-pagination {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 10px;
    margin: 0 !important;
    z-index: 2;
  }

  .page-subzero .portfolio-swiper--subzero .swiper-pagination-bullet {
    background: rgba(255, 255, 255, 0.8);
  }

  .page-subzero .portfolio-swiper--subzero .swiper-pagination-bullet-active {
    background: #1e90ff;
  }

  /* заголовок блока отзывов — чуть ближе к слайдеру */
  .page-subzero .reviews-block {
    margin-top: 6px !important;
    padding-top: 0 !important;
  }
}

.reviews-block {
  padding: 40px 0;
  background: #fff;
}

.section-title {
  color: #1e90ff;
  text-align: center;
  font-weight: 900;
  font-size: clamp(22px, 4.2vw, 44px);
  margin: 0 0 18px;
}

.reviews-swiper {
  position: relative;
  overflow: hidden;
}

.reviews-swiper .swiper-slide {
  height: auto;
}

.review-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 12px 26px rgba(30, 144, 255, 0.08);
  padding: 24px 28px;
  height: 100%;
}

.review-title {
  margin: 0 0 8px;
  font-weight: 800;
  color: #222;
  font-size: 18px;
}

.review-stars {
  color: #ffa500;
  margin-bottom: 10px;
}

.review-text {
  font-size: 18px;
  line-height: 1.4;
  margin: 0 0 12px;
  color: #222;
}

.review-author {
  color: #7a7a7a;
  font-style: italic;
  font-weight: 600;
}

/* стрелки — как на главной, внутри root */
.reviews-swiper .swiper-button-prev,
.reviews-swiper .swiper-button-next {
  color: #1e90ff;
  width: 36px;
  height: 36px;
  top: 50%;
  transform: translateY(-50%);
}

.reviews-swiper .swiper-button-prev::after,
.reviews-swiper .swiper-button-next::after {
  font-size: 28px;
  font-weight: 700;
}

@media (max-width: 767px) {
  .reviews-swiper .swiper-button-prev,
  .reviews-swiper .swiper-button-next {
    display: none !important;
  }
}

/* ---- Classic look for Sub-Zero reviews (scoped) ---- */
.reviews-block.reviews--classic .section-title {
  color: #1e90ff;
  text-align: center;
  font-weight: 900;
  font-size: clamp(26px, 4.6vw, 56px);
  letter-spacing: 0.5px;
  margin: 0 0 18px;
}

.reviews-block.reviews--classic .review-card {
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 14px 36px rgba(30, 144, 255, 0.1);
  padding: 26px 28px;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.reviews-block.reviews--classic .review-title {
  margin: 0 0 8px;
  color: #222;
  font-weight: 800;
  font-size: clamp(16px, 2vw, 22px);
  /* маленький, чёрный — как в старом дизайне */
}

.reviews-block.reviews--classic .review-stars {
  color: #ffa500;
  font-size: clamp(18px, 2vw, 22px);
  letter-spacing: 2px;
  margin-bottom: 10px;
}

.reviews-block.reviews--classic .review-text {
  color: #222;
  font-size: clamp(16px, 2.2vw, 20px);
  line-height: 1.45;
  margin: 0 0 12px;
}

.reviews-block.reviews--classic .review-author {
  margin-top: auto;
  color: #8a8a8a;
  font-style: italic;
  font-size: clamp(14px, 1.8vw, 18px);
}

/* стрелки и точки — аккуратно */
.reviews-block.reviews--classic .swiper-button-prev,
.reviews-block.reviews--classic .swiper-button-next {
  color: #1e90ff;
}

.reviews-block.reviews--classic .swiper-pagination-bullet-active {
  background: #1e90ff;
}

.reviews-swiper,
.reviews-swiper .swiper-wrapper {
  direction: ltr !important;
}

/* только на странице Sub-Zero */
.page-subzero .features-block {
  /* больше воздуха после Why Choose Wolfix */
  margin-bottom: clamp(64px, 8vw, 120px);
}

.page-subzero .portfolio-block {
  /* на всякий — тоже немного отодвинем сам портфолио-блок */
  margin-top: clamp(24px, 4vw, 48px);
}

/* Наше портфолио: сделать заголовок как у блока с отзывами */
.page-subzero .portfolio-block .section-title {
  font-size: clamp(28px, 3.2vw, 40px);
  /* как у reviews */
  line-height: 1.1;
  font-weight: 800;
  margin-bottom: 18px;
  /* по желанию */
}

.page-subzero .portfolio-block {
  margin-top: clamp(140px, 8vw, 120px) !important;
}

.page-subzero .portfolio-block {
  margin-top: 0 !important;
}

/* опускаем карточки от заголовка Why Choose, но зазор до следующей секции уменьшаем */
.page-subzero .features-block .features-inner {
  margin-top: clamp(48px, 8vh, 110px);
}

/* Уменьшаем зазор до портфолио */
.page-subzero .features-block {
  margin-bottom: clamp(24px, 3vh, 48px) !important;
}

.page-subzero .portfolio-block {
  margin-top: clamp(16px, 2vh, 32px) !important;
}

/* === CTA (hero) — аккуратная ширина === */
.page-subzero .cta-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 380px;
  /* десктоп: не слишком широкая */
  padding: 16px 28px;
  font-size: clamp(16px, 1.8vw, 20px);
  border-radius: 16px;
  box-shadow: 0 12px 26px rgba(255, 102, 0, 0.32);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

@media (hover: hover) {
  .page-subzero .cta-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 16px 32px rgba(255, 102, 0, 0.42);
  }
}

/* === MOBILE: статичная CTA уже, по центру === */
@media (max-width: 640px) {
  .page-subzero .cta-button {
    width: auto;
    /* НЕ растягиваем на всю */
    max-width: 320px;
    /* можно 300–340px по вкусу */
    padding: 14px 22px;
    font-size: 16px;
    margin-inline: auto;
    /* центрируем */
  }

  /* Плавающая (sticky) — широкая и заметная */
  .sticky-cta {
    width: calc(100% - 24px);
    /* почти на всю */
    left: 12px;
    /* если есть position:fixed */
    right: 12px;
    max-width: none;
    border-radius: 14px;
  }
}

.issues-block {
  margin: clamp(40px, 6vh, 72px) 0;
}

.issues-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 768px) {
  .issues-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1200px) {
  .issues-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.issues-grid li {
  list-style: none;
}

.issues-grid button {
  width: 100%;
  padding: 14px 16px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 24px rgba(23, 41, 80, 0.06);
  border: 1px solid #eef1f5;
  text-align: left;
  font-weight: 700;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.issues-grid button:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 28px rgba(23, 41, 80, 0.1);
}

.process-block {
  margin: clamp(40px, 6vh, 72px) 0;
}

.process-steps {
  display: grid;
  gap: 22px;
  grid-template-columns: 1fr;
}

@media (min-width: 900px) {
  .process-steps {
    grid-template-columns: repeat(3, 1fr);
  }
}

.process-steps li {
  list-style: none;
  background: #fff;
  border: 1px solid #eef1f5;
  border-radius: 16px;
  padding: 22px;
  box-shadow: 0 12px 28px rgba(23, 41, 80, 0.07);
}

.p-num {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  background: #2f6bff;
  color: #fff;
  font-weight: 800;
  margin-bottom: 10px;
}

.process-steps h4 {
  margin: 0 0 6px;
  font-weight: 800;
}

.process-steps p {
  margin: 0;
  color: #5b6472;
}

.areas-block {
  margin: clamp(48px, 7vh, 84px) 0;
}

.areas-lead {
  text-align: center;
  color: #5b6472;
  margin: 6px 0 18px;
}

.areas-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(2, 1fr);
  max-width: 900px;
  margin: 0 auto 18px;
}

@media (min-width: 900px) {
  .areas-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.areas-grid ul {
  margin: 0;
  padding-left: 18px;
}

.areas-grid li {
  margin: 4px 0;
}

.areas-cta {
  text-align: center;
}
/* Issues grid – фиксим текст на кнопках */
.issues-grid button {
  color: #1f2937;
  /* темный текст */
  font-size: clamp(14px, 1.05vw, 16px);
  font-weight: 800;
  line-height: 1.25;
  background: #fff;
  border: 1px solid #eef1f5;
  border-radius: 12px;
  padding: 14px 16px;
  text-align: left;
  cursor: pointer;
}

.issues-grid button:focus {
  outline: 2px solid #2f6bff;
  outline-offset: 2px;
}

/* Pills в стиле бейджей — чисто и компактно */
.issues-pills {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 18px;
}

@media (max-width: 1200px) {
  .issues-pills {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .issues-pills {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .issues-pills {
    grid-template-columns: 1fr;
  }
}

.issues-pills .pill {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 12px 16px;
  border-radius: 999px;
  border: 1px solid #e9eef6;
  background: #fff;
  box-shadow: 0 2px 6px rgba(23, 41, 80, 0.05);
  color: #1f2937;
  font-weight: 800;
  font-size: clamp(14px, 1.05vw, 16px);
  line-height: 1.25;
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.05s;
}

.issues-pills .pill::after {
  content: "›";
  font-size: 18px;
  color: #c8d4f8;
  margin-left: 12px;
  transition: color 0.15s, transform 0.15s;
}

.issues-pills .pill:hover {
  border-color: #2f6bff;
  box-shadow: 0 10px 24px rgba(46, 67, 255, 0.12);
  transform: translateY(-1px);
}

.issues-pills .pill:hover::after {
  color: #2f6bff;
  transform: translateX(2px);
}

/* ==== Issues (polish) ==== */

/* убираем маркеры у списка и лишние отступы */
.issues-pills,
.issues-pills li {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* шрифт и визуал в стиле сайта */
.issues-pills .pill {
  font-family: inherit;
  /* возьми Montserrat как у body */
  font-weight: 700;
  /* вместо 800 — смотрится легче */
  font-size: clamp(15px, 1vw, 17px);
  letter-spacing: 0.2px;
  color: #1f2937;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;

  padding: 12px 16px;
  border-radius: 999px;
  border: 1px solid #e9eef6;
  background: #fff;
  box-shadow: 0 2px 6px rgba(23, 41, 80, 0.05);
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.05s;
}

/* стрелочка поскромнее */
.issues-pills .pill::after {
  content: "›";
  font-weight: 700;
  font-size: 16px;
  color: #9bb2ff;
  margin-left: 10px;
  transition: color 0.15s, transform 0.15s;
}

.issues-pills .pill:hover {
  border-color: #2f6bff;
  box-shadow: 0 10px 24px rgba(46, 67, 255, 0.12);
  transform: translateY(-1px);
}

.issues-pills .pill:hover::after {
  color: #2f6bff;
  transform: translateX(2px);
}

/* === How the Repair Works — polish === */
.how-works .step-card {
  padding: 28px;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 40px rgba(23, 41, 80, 0.08);
}

/* оборачиваем круг + заголовок в одну линию */
.how-works .step-head {
  display: flex;
  align-items: baseline;
  /* цифра по базовой линии с h4 */
  gap: 12px;
  margin-bottom: 10px;
}

/* круг-номер: оранжевый, компактнее */
.how-works .step-num {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: var(--brand-orange, #ff7a00);
  box-shadow: 0 8px 18px rgba(255, 122, 0, 0.25);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  line-height: 1;
}

/* заголовок шага в линии с числом */
.how-works .step-title {
  margin: 0;
  font-weight: 800;
  font-size: clamp(18px, 1.6vw, 22px);
  line-height: 1.05;
}

/* подзаголовок/текст шага */
.how-works .step-text {
  margin: 8px 0 0;
  color: #5b6472;
  font-weight: 700;
  font-size: clamp(15px, 1.2vw, 18px);
}

/* чуть плотнее на мобильных */
@media (max-width: 640px) {
  .how-works .step-card {
    padding: 22px;
  }

  .how-works .step-num {
    width: 40px;
    height: 40px;
  }
}

/* === How the Repair Works (scoped) === */
.how-works {
  margin: clamp(28px, 4vw, 56px) 0;
}

.how-works .step-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: 1fr;
}

@media (min-width: 980px) {
  .how-works .step-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.how-works .step-card {
  padding: 28px;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 14px 40px rgba(23, 41, 80, 0.08);
}

.how-works .step-head {
  display: flex;
  align-items: baseline;
  /* число в линию с заголовком */
  gap: 12px;
  margin-bottom: 8px;
}

.how-works .step-num {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: var(--brand-orange, #ff7a00);
  /* фирменный оранжевый */
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 8px 18px rgba(255, 122, 0, 0.25);
  flex: 0 0 auto;
}

.how-works .step-title {
  margin: 0;
  font-weight: 800;
  font-size: clamp(18px, 1.6vw, 22px);
  line-height: 1.05;
}

.how-works .step-text {
  margin: 8px 0 0;
  color: #5b6472;
  font-weight: 700;
  font-size: clamp(15px, 1.2vw, 18px);
}

@media (max-width: 640px) {
  .how-works .step-card {
    padding: 22px;
  }

  .how-works .step-num {
    width: 40px;
    height: 40px;
  }
}

/* Насколько опустить кнопку (легко менять одно число) */
.page-subzero #main-cta {
  /* Поднять кнопку выше и убрать отрицательный отступ */
  margin-top: 32px !important;
  margin-bottom: 0 !important;
  position: relative;
  z-index: 3; /* поверх любых фоновых масок */
  display: inline-block;
}

/* Если хочешь только на десктопе — оставь мобильный как есть */
@media (max-width: 767px) {
  .page-subzero #main-cta {
    --cta-shift: 0px;
    /* на мобилке без сдвига */
  }
}

/* Sub-Zero: подтянуть карточки под заголовок */
.page-subzero .features-block .features-inner {
  margin-top: 46px;
  /* подними/опусти, меняя это значение */
}

/* На мобильных поднимаем помягче */
@media (max-width: 767px) {
  .page-subzero .features-block .features-inner {
    margin-top: -10px;
  }
}

/* iPhone-only: больше воздуха над Why Choose */
@supports (-webkit-touch-callout: none) {
  /* WebKit/iOS */
  @media screen and (max-width: 430px) {
    /* iPhone widths */
    /* отодвигаем секцию преимуществ ниже */
    .features-block {
      margin-top: 34px !important;
      /* было 12px — стало больше */
    }

    /* чтобы остальная страница не уезжала вниз — держим прежний нижний отступ */
    .features-block {
      margin-bottom: 140px !important;
      /* твое текущее значение */
    }

    /* можно чуть увеличить зазор между заголовком и первыми карточками */
    .features-title {
      margin-bottom: 18px !important;
    }
  }
}

/* --- iPhone-only overrides --- */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 430px) {
    /* 1) Why Choose -> карточки: меньше вертикальный зазор */
    .features-block .features-title {
      margin-bottom: 10px !important;
      /* было больше — стало компактнее */
    }

    .features-block .features-inner {
      margin-top: 6px !important;
      /* подстраховка, если сетка задаёт отступ сверху */
    }

    /* 2) Бэйджи LICENSED / EPA CERTIFIED / INSURED — всегда в одну строку */
    .license-minimal .license-buttons a {
      white-space: nowrap !important;
      word-break: normal !important;
      overflow-wrap: normal !important;
      /* чуть уменьшенный шрифт на айфонах, чтобы не было переполнения */
      font-size: clamp(13px, 3.1vw, 15px) !important;
      padding-left: 18px !important;
      padding-right: 18px !important;
    }
  }
}

/* ================================
   iPhone-only tweaks (iOS Safari)
   ================================ */
@supports (-webkit-touch-callout: none) {
  /* iPhone 12..16 Pro/Pro Max — ширина до 430px */
  @media (max-width: 430px) {
    /* 1) Логотип Sub-Zero почти на всю ширину, с учётом «чёлки» */
    .page-subzero .sub-hero .brand-logo-large {
      display: block;
      width: calc(
        100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 24px
      ) !important;
      max-width: none !important;
      height: auto !important;
      margin: 8px auto 10px !important;
    }

    .page-subzero .sub-hero .container {
      padding-left: 12px !important;
      padding-right: 12px !important;
    }

    /* 2) Пилюли LICENCED/EPA/INSURED — всегда в одну строку */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      font-size: clamp(12.5px, 3.6vw, 14px) !important;
      letter-spacing: 0.2px;
      padding: 10px 16px !important;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    /* 3) Вертикальные отступы возле "Why Choose Wolfix"
          — кнопку опускаем чуть ниже, а заголовок ближе к карточкам */
    .page-subzero .sub-hero .cta-button {
      margin-top: 6px !important;
      margin-bottom: 14px !important;
      /* дистанция до Why Choose */
    }

    .page-subzero .features-block {
      margin-top: 6px !important;
      /* чтобы Why не уезжал вниз */
    }

    .page-subzero .features-title {
      margin: 8px 0 10px !important;
      /* меньше зазор между H2 и карточками */
      line-height: 1.1;
    }

    .page-subzero .features-inner {
      margin-top: 6px !important;
      /* ближе карточки к заголовку */
    }
  }
}
/* iPhone-only (iOS Safari/Chrome) */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 430px) {
    /* 1) Логотип Sub-Zero — почти на весь экран */
    .page-subzero .sub-hero .brand-logo-large {
      display: block;
      width: calc(
        100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 12px
      ) !important;
      max-width: none !important;
      height: auto !important;
      margin: 10px auto 12px !important;
      /* сверху/снизу компактно */
    }

    /* 2) Пилюли — всегда в одну строку */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      font-size: clamp(12.5px, 3.6vw, 14px) !important;
      padding: 10px 16px !important;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    /* 3) Сближаем кнопку и блок "Why Choose Wolfix" */
    .page-subzero .sub-hero .cta-button {
      margin-top: 6px !important;
      margin-bottom: 8px !important;
      /* меньше зазор под кнопкой */
    }

    .page-subzero .features-block {
      margin-top: 2px !important;
      /* ближе секцию Why к кнопке */
    }

    .page-subzero .features-title {
      margin: 6px 0 10px !important;
      /* компактнее заголовок */
      line-height: 1.1;
    }
  }
}

/* iPhone only (Safari/Chrome) — делаем лого почти на весь экран */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 430px) {
    /* LOGO: игнорируем ограничение .container и тянем на ширину вьюпорта */
    .page-subzero .sub-hero .brand-logo-large {
      /* ширина почти на весь экран + центрирование независимо от контейнера */
      width: 96vw !important;
      /* можно 94–98vw, если захочешь плотнее */
      max-width: none !important;
      height: auto !important;
      position: relative !important;
      left: 50% !important;
      transform: translateX(-50%) !important;
      margin: 10px 0 12px !important;
      /* компактные отступы вокруг */
      display: block !important;
    }

    /* Пилюли — гарантированно в одну строку на iPhone 16 Pro Max */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      font-size: clamp(12px, 3.4vw, 14px) !important;
      padding: 10px 14px !important;
      letter-spacing: 0 !important;
      /* чтобы не разъезжалась надпись */
    }

    /* Сближаем "Why Choose" к кнопке BOOK на айфонах */
    .page-subzero .sub-hero .cta-button {
      margin-top: 6px !important;
      margin-bottom: 8px !important;
      /* меньше зазор под кнопкой */
    }

    .page-subzero .features-block {
      margin-top: 0 !important;
      /* поддвигаем блок ближе */
    }

    .page-subzero .features-title {
      margin: 6px 0 10px !important;
      line-height: 1.1;
    }
  }
}
/* iPhone only (Safari/Chrome iOS) */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 430px) {
    /* снимаем боковые паддинги контейнера геро-блока */
    .page-subzero .sub-hero .container {
      padding-left: 0 !important;
      padding-right: 0 !important;
    }

    /* логотип — почти на всю ширину экрана, с учётом «чёлки» */
    .page-subzero .sub-hero .brand-logo-large {
      width: calc(
        100vw - env(safe-area-inset-left) - env(safe-area-inset-right)
      ) !important;
      max-width: none !important;
      height: auto !important;
      display: block !important;
      margin: 8px auto 12px !important;
    }

    /* пилюли — всегда в одну строку на больших iPhone */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      font-size: clamp(12px, 3.4vw, 14px) !important;
      padding: 10px 14px !important;
      letter-spacing: 0 !important;
    }

    /* «Why Choose» ближе к кнопке BOOK */
    .page-subzero .sub-hero .cta-button {
      margin-bottom: 8px !important;
    }

    .page-subzero .features-block {
      margin-top: 0 !important;
    }

    .page-subzero .features-title {
      margin: 6px 0 10px !important;
    }
  }
}

/* iOS-устройства (Safari/Chrome на iPhone) */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 430px) {
    /* Разрешаем блоку-герою занимать ширину экрана */
    .page-subzero .sub-hero {
      overflow: visible !important;
    }

    /* ЛОГОТИП Sub-Zero: full-bleed во всю ширину экрана */
    .page-subzero .sub-hero img.brand-logo-large {
      display: block !important;

      /* ширина экрана (с учётом safe-area), без ограничений */
      width: -webkit-fill-available !important;
      width: 100vw !important;
      max-width: 100vw !important;
      height: auto !important;

      /* «прорываемся» за пределы контейнера */
      margin-left: calc(50% - 50vw) !important;
      margin-right: calc(50% - 50vw) !important;

      /* немного воздуха сверху/снизу — можно подстроить */
      margin-top: 8px !important;
      margin-bottom: 12px !important;
    }

    /* Если у контейнера есть паддинги — не мешаемся */
    .page-subzero .sub-hero .container {
      padding-left: 0 !important;
      padding-right: 0 !important;
    }

    /* Пилюли, чтобы НИКОГДА не переносились и влезали на 16 Pro Max */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      font-size: clamp(11px, 3.1vw, 13px) !important;
      letter-spacing: 0 !important;
      padding: 10px 14px !important;
      line-height: 1.15 !important;
    }

    /* Сближаем WHY CHOOSE с кнопкой BOOK только на iPhone */
    .page-subzero .sub-hero .cta-button {
      margin-bottom: 8px !important;
    }

    .page-subzero .features-block {
      margin-top: 0 !important;
    }

    .page-subzero .features-title {
      margin: 6px 0 10px !important;
    }
  }
}

/* iPhone-only (через флаг из JS) */
.is-ios .page-subzero .sub-hero .container {
  /* делаем контейнер «full-bleed», чтобы лого реально заняло ширину экрана */
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible !important;
}

/* ЛОГОТИП Sub-Zero: почти на всю ширину экрана */
.is-ios .page-subzero .sub-hero img.brand-logo-large,
.is-ios .page-subzero .sub-hero img[alt="Sub-Zero"] {
  display: block !important;
  width: 96vw !important;
  /* оставим чуть воздуха по бокам */
  max-width: 96vw !important;
  height: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 8px !important;
  margin-bottom: 12px !important;
}

/* Сближаем кнопку и WHY только на iOS */
.is-ios .page-subzero .sub-hero .cta-button {
  margin-bottom: 8px !important;
}

.is-ios .page-subzero .features-block {
  margin-top: 8px !important;
}

.is-ios .page-subzero .features-title {
  margin: 6px 0 10px !important;
}

/* Пилюли: запрещаем перенос и экстремальные разрывы слов на iPhone */
.is-ios .page-subzero .license-buttons a {
  white-space: nowrap !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  hyphens: manual !important;

  /* компактность, чтобы точно влезало на 16 Pro/Max */
  font-size: clamp(11px, 3.2vw, 13px) !important;
  padding: 10px 14px !important;
  line-height: 1.15 !important;
}
/* iPhone only: узкий экран + тач + наш флаг is-ios */
@media screen and (max-width: 520px) and (hover: none) and (pointer: coarse) {
  .is-ios .page-subzero .sub-hero .container {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible !important;
  }

  /* Логотип почти на всю ширину экрана */
  .is-ios .page-subzero .sub-hero img.brand-logo-large,
  .is-ios .page-subzero .sub-hero img[alt="Sub-Zero"] {
    display: block !important;
    width: 96vw !important;
    max-width: 96vw !important;
    height: auto !important;
    margin: 8px auto 12px !important;
  }

  /* Сближаем кнопку и WHY только на iPhone */
  .is-ios .page-subzero .sub-hero .cta-button {
    margin-bottom: 8px !important;
  }

  .is-ios .page-subzero .features-block {
    margin-top: 8px !important;
  }

  .is-ios .page-subzero .features-title {
    margin: 6px 0 10px !important;
  }

  /* Пилюли: всегда в одну строку на iPhone */
  .is-ios .page-subzero .license-buttons a {
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: manual !important;
    font-size: clamp(11px, 3.2vw, 13px) !important;
    padding: 10px 14px !important;
    line-height: 1.15 !important;
  }
}

/* iPhone-только: webkit + тач + узкая ширина (не затронет десктоп/Android) */
@supports (-webkit-touch-callout: none) and (-webkit-text-size-adjust: none) {
  @media (max-width: 430px) {
    /* ЛОГО: почти на весь экран */
    .page-subzero .sub-hero img.brand-logo-large,
    .page-subzero .sub-hero img[alt="Sub-Zero"] {
      display: block !important;
      width: 96vw !important;
      /* почти во всю */
      max-width: 96vw !important;
      height: auto !important;
      margin: 6px auto 10px !important;
      /* по центру */
    }

    /* Чуть ближе CTA к заголовку Why */
    .page-subzero .sub-hero .cta-button {
      margin-top: 14px !important;
      margin-bottom: 10px !important;
    }

    .page-subzero .features-block {
      margin-top: 10px !important;
    }

    /* Пилюли: не переносить текст ни при каких условиях */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      word-break: keep-all !important;
      overflow-wrap: normal !important;
      -webkit-hyphens: none !important;
      hyphens: none !important;
      letter-spacing: 0 !important;
      font-size: clamp(12px, 3.2vw, 14px) !important;
      line-height: 1.2 !important;
      padding: 10px 14px !important;
    }
  }
}

/* 1) Десктоп/планшет: вернуть нормальный размер лого */
@media (min-width: 768px) {
  .page-subzero .sub-hero img.brand-logo-large,
  .page-subzero .sub-hero img[alt="Sub-Zero"] {
    width: auto !important;
    max-width: clamp(320px, 34vw, 580px) !important;
    /* как раньше */
    height: auto !important;
    margin: 8px auto 14px !important;
  }
}

/* 2) iPhone-только: лого почти на всю ширину */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 430px) and (hover: none) and (pointer: coarse) {
    .page-subzero .sub-hero img.brand-logo-large,
    .page-subzero .sub-hero img[alt="Sub-Zero"] {
      display: block !important;
      width: 96vw !important;
      max-width: 96vw !important;
      height: auto !important;
      margin: 6px auto 10px !important;
    }

    /* Чуть ближе Why Choose к кнопке (только на iPhone) */
    .page-subzero .sub-hero .cta-button {
      margin-bottom: 12px !important;
    }

    .page-subzero .features-block {
      margin-top: 12px !important;
    }

    /* Пилюли: всегда в одну строку */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      overflow-wrap: normal !important;
      word-break: keep-all !important;
      -webkit-hyphens: none !important;
      hyphens: none !important;
    }
  }
}

/* ===== 1) ДЕСКТОП/ПЛАНШЕТ: вернуть нормальный размер лого ===== */
@media (min-width: 768px) {
  .page-subzero .sub-hero img.brand-logo-large,
  .page-subzero .sub-hero img[alt="Sub-Zero"] {
    width: auto !important;
    max-width: clamp(320px, 34vw, 580px) !important;
    height: auto !important;
    margin: 8px auto 14px !important;
  }
}

/* ===== 2) iPhone-ТОЧНО: лого почти во всю ширину вьюпорта ===== */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 430px) and (hover: none) and (pointer: coarse) {
    .page-subzero .sub-hero img.brand-logo-large,
    .page-subzero .sub-hero img[alt="Sub-Zero"] {
      display: block !important;

      /* выходим из паддингов контейнера и тянем на весь viewport */
      width: 100vw !important;
      max-width: 100vw !important;
      height: auto !important;

      position: relative !important;
      left: 50% !important;
      transform: translateX(-50%) !important;
      margin: 6px 0 12px !important;
    }

    /* пилюли — всегда в одну строку */
    .page-subzero .license-buttons a {
      white-space: nowrap !important;
      word-break: keep-all !important;
      -webkit-hyphens: none !important;
      hyphens: none !important;
    }

    /* расстояние между кнопкой и Why Choose — компактнее */
    .page-subzero .sub-hero .cta-button {
      margin-bottom: 10px !important;
    }

    .page-subzero .features-block {
      margin-top: 12px !important;
    }
  }
}

/* На случай более узких устройств (SE и т.п.) — тоже во всю */
@media (max-width: 360px) {
  .page-subzero .sub-hero img.brand-logo-large,
  .page-subzero .sub-hero img[alt="Sub-Zero"] {
    width: 100vw !important;
    max-width: 100vw !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
}

/* === 0) БАЗА — вернуть нормальный размер на десктопе/планшете === */
.page-subzero .sub-hero img.brand-logo-large {
  width: auto;
  max-width: 560px;
  height: auto;
  margin: 8px auto 14px;
  display: block;
}

/* Десктоп/планшет — как было */
@media (min-width: 768px) {
  .page-subzero .sub-hero img.brand-logo-large {
    max-width: clamp(340px, 34vw, 560px);
  }
}

/* === 1) iPhone-портрет: лого почти на всю ширину, Why Choose ближе к кнопке === */
@media screen and (max-width: 430px) and (hover: none) and (pointer: coarse) {
  /* слегка уменьшим внутренние поля контейнера, чтобы лого «дышало» */
  .page-subzero .sub-hero .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  .page-subzero .sub-hero img.brand-logo-large {
    width: 96vw;
    /* почти во всю ширину экрана */
    max-width: 96vw;
    height: auto;
    margin: 6px auto 12px;
  }

  /* пилюли всегда в одну строку */
  .page-subzero .license-buttons a {
    white-space: nowrap;
    word-break: keep-all;
    -webkit-hyphens: none;
    hyphens: none;
  }

  /* расстояние между кнопкой и Why Choose — ближе */
  .page-subzero .sub-hero .cta-button {
    margin-bottom: 10px;
  }

  .page-subzero .features-block {
    margin-top: 14px;
  }
}

/* сверх-узкие экраны (SE и т.п.) — ещё чуть шире */
@media (max-width: 360px) {
  .page-subzero .sub-hero img.brand-logo-large {
    width: 98vw;
    max-width: 98vw;
  }
}

/* Desktop: ещё сильнее подтянуть блок с 4 плитками к CTA */
@media (min-width: 1200px) {
  /* уменьшаем низ геро-секции, чтобы освободить высоту */
  .page-subzero .sub-hero {
    padding-bottom: 8px !important;
  }

  .page-subzero .sub-hero .cta-button {
    margin-bottom: 8px !important;
  }

  /* поднимаем Why Choose поверх (отрицательный отступ) */
  .page-subzero .features-block {
    margin-top: -172px !important;
    /* было -142px, поднимаем ещё на 30px выше */
    margin-bottom: 24px !important;
    /* чтобы не тянуло всё вниз */
  }

  /* чуть уменьшим зазор внутри блока, чтобы компактнее влезало */
  .page-subzero .features-title {
    margin-bottom: 10px !important;
  }
}

/* Очень широкие десктопы — чуть выше ещё */
@media (min-width: 1440px) {
  .page-subzero .features-block {
    margin-top: -196px !important;
    /* было -166px, поднимаем ещё на 30px выше */
  }
}

/* Desktop: ещё выше «Same-Day» плитки */
@media (min-width: 1200px) {
  .page-subzero .sub-hero {
    padding-bottom: 0 !important;
  }

  .page-subzero .sub-hero .cta-button {
    margin-bottom: 4px !important;
  }

  .page-subzero .features-block {
    margin-top: -232px !important;
    /* было -202px, поднимаем ещё на 30px выше */
    margin-bottom: 20px !important;
    /* чтобы ниже не тянуло */
  }
}

/* Очень широкие экраны — ещё чуток выше */
@media (min-width: 1440px) {
  .page-subzero .features-block {
    margin-top: -268px !important;
    /* было -238px, поднимаем ещё на 30px выше */
  }
}

/* Desktop: поднимаем блок с 4 кнопками выше */
@media (min-width: 1200px) {
  .page-subzero .sub-hero .cta-button {
    margin-bottom: 8px !important;
  }

  /* поднимаем Why Choose поверх (отрицательный отступ) */
  .page-subzero .features-block {
    margin-top: 0 !important;
    /* на всякий */
    transform: translateY(-210px);
    /* было -180px, поднимаем ещё на 30px выше */
  }
}

/* очень широкие – ещё чуть выше */
@media (min-width: 1440px) {
  .page-subzero .features-block {
    transform: translateY(-130px);
  }
}

/* --- Desktop: подтянуть блок с 4 карточками без перекрытий --- */
@media (min-width: 1200px) {
  /* 1) отменяем прошлые эксперименты */
  .page-subzero .features-block {
    transform: none !important;
  }

  /* 2) уменьшаем «воздух» в HERO, чтобы всё естественно подъехало */
  .page-subzero .sub-hero {
    padding-bottom: 12px !important;
  }

  .page-subzero .brand-logo-large {
    margin-bottom: 14px !important;
  }

  .page-subzero .hero-title-bg {
    margin: 8px auto 10px !important;
  }

  .page-subzero .license-minimal {
    margin: 4px 0 8px !important;
  }

  .page-subzero #main-cta {
    margin: 10px auto 12px !important;
  }

  /* 3) «Why Choose» ещё ближе, но без налезания */
  .page-subzero .features-block {
    margin-top: -500px !important;
    /* поднимаем секцию выше */
  }

  .page-subzero .features-title {
    margin: 10px 0 22px !important;
  }

  /* 4) чуть компактнее сами карточки, чтобы 4 влезали в первый экран */
  .page-subzero .features-inner {
    gap: 18px !important;
  }

  .page-subzero .feature {
    padding: 24px 22px !important;
  }
}

/* На очень широких — ещё капельку ближе */
@media (min-width: 1440px) {
  .page-subzero .sub-hero {
    padding-bottom: 8px !important;
  }
  .page-subzero #main-cta {
    margin-bottom: 10px !important;
  }
  .page-subzero .features-title {
    margin-bottom: 20px !important;
  }
}

/* Why Choose: поднимаем выше на планшетах */
@media (min-width: 768px) {
  .page-subzero .sub-hero + .features-block {
    margin-top: -200px !important;
  }
}

/* Ещё выше на широких, чтобы 4 карточки влезали в первый экран */
@media (min-width: 1200px) {
  .page-subzero .sub-hero {
    padding-bottom: 6px !important;
  }
  .page-subzero .brand-logo-large {
    margin-bottom: 10px !important;
  }
  .page-subzero .hero-title-bg {
    margin: 6px auto 8px !important;
  }
  .page-subzero .license-minimal {
    margin: 2px 0 6px !important;
  }
  /* Центрируем CTA по горизонтали, не трогая вертикальные отступы */
  .page-subzero #main-cta {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .page-subzero .sub-hero + .features-block {
    margin-top: -500px !important;
  }
  .page-subzero .features-title {
    margin-bottom: 12px !important;
  }
  .page-subzero .features-grid-modern {
    gap: 16px !important;
  }
}

@media (min-width: 1440px) {
  .page-subzero #main-cta {
    margin-top: 40px !important;
    margin-bottom: 0 !important;
  }

  /* Дать место под кнопкой, чтобы фон не "наступал" */
  .page-subzero .sub-hero {
    padding-bottom: 56px !important;
  }
  @media (min-width: 1440px) {
    .page-subzero .sub-hero {
      padding-bottom: 72px !important;
    }
  }

  /* Поднять Why Choose ближе к кнопке (без налезания) */
  @media (min-width: 768px) and (max-width: 1199px) {
    .page-subzero .sub-hero + .features-block {
      margin-top: -200px !important;
    }
  }
  @media (min-width: 1200px) {
    .page-subzero .sub-hero + .features-block {
      margin-top: -500px !important;
    }
    .page-subzero .features-title {
      margin-bottom: 10px !important;
    }
  }

  /* Mobile: do not shift CTA */
  @media (max-width: 767px) {
    .page-subzero #main-cta {
      margin-top: 0 !important;
      margin-bottom: 0 !important;
    }
  }
}

/* === Desktop final override: ensure Why Choose is raised === */
@media (min-width: 1200px) {
  .page-subzero .sub-hero + .features-block {
    margin-top: -500px !important; /* ensure 4 cards fit above the fold */
  }
  .page-subzero .features-title {
    margin-bottom: 8px !important;
  }
  .page-subzero .features-inner {
    gap: 14px !important;
  }
  .page-subzero .feature {
    padding: 18px 18px !important;
  }
}

/* === ULTIMATE DESKTOP OVERRIDE === */
@media (min-width: 1200px) {
  body.page-subzero .sub-hero + .features-block,
  body.page-subzero .features-block,
  .page-subzero .sub-hero + .features-block,
  .page-subzero .features-block {
    margin-top: -70px !important;
    transform: none !important;
    position: relative !important;
    z-index: 10 !important;
  }
}

/* ===== MODAL STYLES ===== */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 10000;
  display: none;
  align-items: center;
  justify-content: center;
}

.modal-overlay.is-open {
  display: flex;
}

.modal-container {
  background: white;
  border-radius: 12px;
  max-width: 500px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  z-index: 10001;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

/* Ensure modal is above everything */
.modal-overlay,
.modal-overlay * {
  z-index: 10000;
}

.modal-container,
.modal-container * {
  z-index: 10001;
}

/* Prevent body scroll when modal is open */
body.modal-open {
  overflow: hidden;
}

/* Ensure form elements don't interfere with modal */
.request-form-modern input,
.request-form-modern select,
.request-form-modern textarea,
.request-form-modern button {
  z-index: 10002;
  position: relative;
}

/* ===== MODAL HEADER STYLES ===== */
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* margin-bottom: 20px; */
}

.modal-header h2 {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 700;
}

.modal-close {
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #666;
  padding: 0;
  width: 30px;
  height: 30px;
}

.modal-close:hover {
  color: #000;
}

/* (Removed old compact block to avoid conflicts — using 1:1 block below) */

/* ===== MODAL FORM: MATCH INDEX EXACTLY (scoped) ===== */
body.page-subzero .modal-overlay .modal-container .modal-body {
  padding: 32px;
}

body.page-subzero .modal-overlay .modal-container .request-form-modern {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

body.page-subzero .modal-overlay .modal-container .form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

body.page-subzero .modal-overlay .modal-container .form-group {
  display: flex;
  flex-direction: column;
}

body.page-subzero .modal-overlay .modal-container .form-group label {
  font-weight: 600;
  margin-bottom: 8px;
  color: #1a1a1a;
}

body.page-subzero .modal-overlay .modal-container .form-group input,
body.page-subzero .modal-overlay .modal-container .form-group select,
body.page-subzero .modal-overlay .modal-container .form-group textarea {
  padding: 12px 16px;
  border: 2px solid #e2e8f0;
  border-radius: 12px;
  font-size: 1rem;
  transition: 0.2s ease;
  font-family: inherit;
}

body.page-subzero .modal-overlay .modal-container .form-group input:focus,
body.page-subzero .modal-overlay .modal-container .form-group select:focus,
body.page-subzero .modal-overlay .modal-container .form-group textarea:focus {
  outline: none;
  border-color: #1e90ff;
  box-shadow: 0 0 0 3px rgba(30, 144, 255, 0.1);
}

body.page-subzero .modal-overlay .modal-container .consent-group {
  margin-top: 16px;
}

body.page-subzero .modal-overlay .modal-container .checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
}

body.page-subzero
  .modal-overlay
  .modal-container
  .checkbox-label
  input[type="checkbox"] {
  margin-top: 4px;
}

body.page-subzero .modal-overlay .modal-container .consent-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.page-subzero .modal-overlay .modal-container .consent-text span {
  font-size: 0.9rem;
  color: #666;
}

@media (max-width: 480px) {
  body.page-subzero .modal-overlay .modal-container .modal-body {
    padding: 24px;
  }
  body.page-subzero .modal-overlay .modal-container .form-row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* (Removed compact tweaks block to avoid conflicts) */

/* ===== SUBZERO MODAL FORM: 1:1 WITH MAIN (HIGH SPECIFICITY) ===== */
/* Overlay spacing like main */
body.page-subzero .modal-overlay {
  padding: 24px;
}

/* Container exactly like main */
body.page-subzero .modal-overlay .modal-container {
  background: #ffffff; /* var(--bg-white) */
  border-radius: 16px; /* var(--radius-lg) */
  max-width: 600px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 20px 25px rgba(0, 0, 0, 0.15); /* var(--shadow-xl) */
}

/* Header exactly like main */
body.page-subzero .modal-overlay .modal-container .modal-header {
  padding: 24px 32px;
  border-bottom: 1px solid #e2e8f0; /* var(--border-color) */
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: sticky;
  top: 0;
  background: white;
  z-index: 99999;
}

body.page-subzero .modal-overlay .modal-container .modal-header h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #1a1a1a; /* var(--text-dark) */
  margin: 0;
}

body.page-subzero .modal-overlay .modal-container .modal-close {
  background: none;
  border: none;
  font-size: 2rem;
  cursor: pointer;
  color: #666; /* var(--text-light) */
  transition: 0.2s ease; /* var(--transition) */
}

body.page-subzero .modal-overlay .modal-container .modal-close:hover {
  color: #1a1a1a; /* var(--text-dark) */
}

/* Force full-width inputs within 1:1 block */
body.page-subzero .modal-overlay .modal-container .form-group input,
body.page-subzero .modal-overlay .modal-container .form-group select,
body.page-subzero .modal-overlay .modal-container .form-group textarea {
  width: 100%;
  box-sizing: border-box;
}

/* Make submit button orange like main */
body.page-subzero .modal-overlay .modal-container .btn-book[type="submit"] {
  background: linear-gradient(90deg, #ff6600, #ff9900);
  color: #fff;
  border-radius: 18px;
  font-weight: 700;
  font-size: 0.98rem;
  padding: 6px 12px;
}
body.page-subzero
  .modal-overlay
  .modal-container
  .btn-book[type="submit"]:hover {
  background: linear-gradient(90deg, #ff9900, #ff6600);
}

/* ===== Issues section styling ===== */
.issue-category {
  margin-bottom: 48px;
}

.category-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.5rem;
  font-weight: 700;
  color: #1a1a1a;
  margin-bottom: 24px;
  text-align: left;
}

.category-title svg {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  color: #2f6bff;
}

.issues-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(2, 1fr);
}

.issue-card {
  background: #ffffff;
  border: 1px solid #eef1f5;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.06);
  transition: all 0.2s ease;
  cursor: pointer;
  text-align: left;
}

.issue-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
  border-color: #2f6bff;
}

.issue-icon {
  font-size: 24px;
  margin-bottom: 12px;
}

.issue-card h4 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 8px 0;
  line-height: 1.3;
}

.issue-card p {
  color: #666;
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.4;
}

.issues-cta {
  text-align: center;
  margin-top: 48px;
  padding: 40px 0;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  border-radius: 16px;
  border: 1px solid #e2e8f0;
}

.issues-cta p {
  font-size: 1.3rem;
  color: #1a1a1a;
  margin: 0 0 24px 0;
  font-weight: 600;
  line-height: 1.4;
}

.issues-cta .btn-book {
  display: inline-block;
  background: linear-gradient(90deg, #ff6600, #ff9900);
  color: white;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  border: none;
  border-radius: 25px;
  padding: 16px 32px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 6px 20px rgba(255, 102, 0, 0.3);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.issues-cta .btn-book:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(255, 102, 0, 0.4);
  background: linear-gradient(90deg, #ff5500, #ff8800);
}

@media (min-width: 768px) {
  .issues-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
}

@media (min-width: 1200px) {
  .issues-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
  }
}

/* ===== Diagnostic Modal Styling ===== */
#diagnostic-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
  z-index: 10003;
  display: none;
}

#diagnostic-modal .modal-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: white;
  border-radius: 16px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  max-width: 500px;
  width: 90%;
  padding: 40px;
  text-align: center;
}

#diagnostic-modal .modal-header h3 {
  font-size: 1.8rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 20px 0;
  font-family: "Montserrat", sans-serif;
}

#diagnostic-modal .modal-body p {
  font-size: 1.1rem;
  color: #666;
  line-height: 1.6;
  margin: 0;
  font-family: "Montserrat", sans-serif;
}

#diagnostic-modal .modal-close {
  position: absolute;
  top: 15px;
  right: 20px;
  background: none;
  border: none;
  font-size: 24px;
  cursor: pointer;
  color: #999;
  padding: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.2s ease;
}

#diagnostic-modal .modal-close:hover {
  background: #f5f5f5;
  color: #666;
}

/* Responsive adjustments */
@media (max-width: 600px) {
  #diagnostic-modal .modal-content {
    padding: 30px 20px;
    margin: 20px;
    width: calc(100% - 40px);
  }

  #diagnostic-modal .modal-header h3 {
    font-size: 1.5rem;
  }

  #diagnostic-modal .modal-body p {
    font-size: 1rem;
  }
}

/* ===== FAQ Styling in our style ===== */
.wf-faq {
  margin: clamp(40px, 6vh, 72px) 0;
}

.wf-title {
  font-size: clamp(32px, 4vw, 48px) !important;
  font-weight: 800 !important;
  color: #1a1a1a !important;
  text-align: center !important;
  margin-bottom: 16px !important;
  line-height: 1.1 !important;
  font-family: "Montserrat", sans-serif;
}

.wf-grid {
  display: grid;
  gap: 16px;
  max-width: 800px;
  margin: 0 auto;
}

.wf-item {
  background: #ffffff;
  border: 1px solid #eef1f5;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  transition: all 0.2s ease;
}

.wf-item:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  border-color: #2f6bff;
}

.wf-btn {
  width: 100%;
  padding: 20px 24px;
  background: none;
  border: none;
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "Montserrat", sans-serif;
  font-weight: 600;
  font-size: 1.05rem;
  color: #1a1a1a;
  line-height: 1.4;
  transition: all 0.2s ease;
}

.wf-btn:hover {
  background: #f8fafc;
  color: #2f6bff;
}

.wf-btn span {
  flex: 1;
  margin-right: 16px;
}

.wf-chev {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 2;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.wf-item.is-open .wf-chev {
  transform: rotate(180deg);
}

.wf-panel {
  padding: 0 24px 20px;
  color: #666;
  line-height: 1.6;
  font-size: 1rem;
  font-family: "Montserrat", sans-serif;
  display: none;
  opacity: 0;
  transform: translateY(-10px);
  transition: all 0.3s ease;
}

.wf-item.is-open .wf-panel {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

.wf-panel p {
  margin: 0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .wf-grid {
    gap: 12px;
    margin: 0 16px;
  }

  .wf-btn {
    padding: 18px 20px;
    font-size: 1rem;
  }

  .wf-panel {
    padding: 0 20px 18px;
  }
}

/* ===== FAQ overrides to match Monogram/Wolf (no fill, blue border, 24px chevrons) ===== */
.page-subzero .wf-faq .wf-btn {
  background: none !important;
  border: 1px solid #eaeef3 !important;
  border-radius: 18px !important;
  padding: 20px 24px !important;
  box-sizing: border-box !important;
  color: #1a1a1a !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  outline: none !important;
  box-shadow: none !important;
}
.page-subzero .wf-faq .wf-btn:hover {
  background: #f8fafc !important;
  color: #2f6bff !important;
  border-color: transparent !important;
  box-shadow: inset 0 0 0 2px #2f6bff !important;
}
.page-subzero .wf-faq .wf-chev {
  width: 24px !important;
  height: 24px !important;
  stroke: currentColor !important;
  flex: 0 0 24px !important;
  transition: transform 0.2s ease;
}
.page-subzero .wf-faq .wf-panel {
  display: none !important;
  padding: 0 24px 20px !important;
  color: #666 !important;
  line-height: 1.6 !important;
  border-top: 1px solid #eaeef3 !important;
}
.page-subzero .wf-faq .wf-item.is-open .wf-panel {
  display: block !important;
}
.page-subzero .wf-faq .wf-item.is-open .wf-btn {
  background: none !important;
  color: #1a1a1a !important;
  border-color: #eaeef3 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.page-subzero .wf-faq .wf-item.is-open {
  box-shadow: none !important;
  border-radius: 18px !important;
}
.page-subzero .wf-faq .wf-item.is-open .wf-chev {
  stroke: #2f6bff !important;
  transform: rotate(180deg);
}

/* Remove outer card to avoid double rounded corners; let the button render the only border */
.page-subzero .wf-faq .wf-item {
  background: #fff !important;
  box-shadow: none !important;
  border-radius: 18px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}
.page-subzero .wf-faq .wf-btn {
  display: block !important;
  width: 100% !important;
  border-radius: 18px !important;
}

/* Remove outer focus outline to avoid double border corners */
.page-subzero .wf-faq .wf-btn:focus,
.page-subzero .wf-faq .wf-btn:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border-color: #2f6bff !important;
}

/* Stronger ID-scoped overrides to eliminate any residual outer card/shadow */
#faq-subzero .wf-item {
  background: #fff !important;
  box-shadow: none !important;
  border-radius: 18px !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
}
#faq-subzero .wf-item.is-open {
  box-shadow: none !important;
}
#faq-subzero .wf-btn {
  background: none !important;
  border: 1px solid #eaeef3 !important;
  border-radius: 18px !important;
  padding: 20px 24px !important;
  box-sizing: border-box !important;
  color: #1a1a1a !important;
  width: 100% !important;
  outline: none !important;
  box-shadow: none !important;
}
#faq-subzero .wf-btn:hover {
  background: #f8fafc !important;
  color: #2f6bff !important;
  border-color: #2f6bff !important;
  box-shadow: none !important;
}
#faq-subzero .wf-item.is-open .wf-btn {
  background: none !important;
  color: #1a1a1a !important;
  border-color: #eaeef3 !important;
  box-shadow: none !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
#faq-subzero .wf-item.is-open .wf-btn:hover {
  border-color: #2f6bff !important;
}
#faq-subzero .wf-btn:hover .wf-chev {
  stroke: #2f6bff !important;
}
#faq-subzero .wf-btn:focus,
#faq-subzero .wf-btn:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border-color: #eaeef3 !important;
}
/* Make chevron stick to the far right and reduce button height */
#faq-subzero .wf-btn {
  padding: 14px 18px !important;
  font-size: 1rem !important;
  line-height: 1.25 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}
#faq-subzero .wf-btn span {
  margin-right: 12px !important;
}
#faq-subzero .wf-chev {
  width: 24px !important;
  height: 24px !important;
  margin-left: auto !important;
  flex: 0 0 24px !important;
  align-self: center !important;
}

/* ===== Service Area Section Styling ===== */
.service-area-section {
  margin: clamp(40px, 6vh, 72px) 0;
  padding: 40px 0;
}

.service-area-header {
  text-align: center;
  margin-bottom: 40px;
}

.service-area-subtitle {
  font-size: 1.2rem;
  color: #666;
  text-align: center;
  margin-bottom: 32px;
  font-weight: 500;
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.4;
  font-family: "Montserrat", sans-serif;
}

.service-area-content {
  max-width: 1000px;
  margin: 0 auto;
}

.service-features {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-bottom: 40px;
}

.service-feature {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 24px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  border: 1px solid #eef1f5;
  transition: all 0.2s ease;
}

.service-feature:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  border-color: #2f6bff;
}

.feature-icon {
  font-size: 2rem;
  flex-shrink: 0;
  margin-top: 4px;
}

.feature-content h4 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 8px 0;
  font-family: "Montserrat", sans-serif;
}

.feature-content p {
  color: #666;
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.4;
  font-family: "Montserrat", sans-serif;
}

.service-cta {
  text-align: center;
  padding: 32px;
  background: #ffffff;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  border: 1px solid #eef1f5;
}

.service-cta h4 {
  font-size: 1.3rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 12px 0;
  font-family: "Montserrat", sans-serif;
}

.service-cta p {
  color: #666;
  margin: 0 0 24px 0;
  font-size: 1rem;
  font-family: "Montserrat", sans-serif;
}

.service-cta .btn-book {
  display: inline-block;
  background: linear-gradient(90deg, #ff6600, #ff9900);
  color: white;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  border: none;
  border-radius: 25px;
  padding: 16px 32px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 6px 20px rgba(255, 102, 0, 0.3);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.service-cta .btn-book:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(255, 102, 0, 0.4);
  background: linear-gradient(90deg, #ff5500, #ff8800);
}

/* Responsive adjustments */
@media (max-width: 1200px) {
  .service-features {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
  }
}

@media (max-width: 768px) {
  .service-area-section {
    margin: 32px 16px;
    padding: 32px 20px;
  }

  .service-features {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .service-feature {
    padding: 20px;
  }

  .service-cta {
    padding: 24px 20px;
  }
}

/* ===== Classic Footer with Lines and Logo ===== */
.site-footer {
  background: #ffffff;
  color: #1a1a1a;
  padding: 20px 0 15px;
  margin-top: 40px;
  text-align: center;
}

.footer-main {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 30px;
  gap: 30px;
  text-align: center;
}

.footer-brand {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.footer-logo {
  width: 600px;
  height: 160px;
  transition: all 0.3s ease;
}

.footer-logo:hover {
  transform: scale(1.05);
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.15));
}

.footer-contact-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}

.contact-item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.footer-phone {
  font-size: 1.3rem;
  font-weight: 700;
  color: #1a1a1a;
  text-decoration: none;
  font-family: "Montserrat", sans-serif;
  transition: all 0.3s ease;
}

.footer-phone:hover {
  color: #ff6600;
  transform: translateY(-2px);
}

.footer-email {
  color: #666;
  text-decoration: none;
  font-size: 1.1rem;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  transition: all 0.3s ease;
}

.footer-email:hover {
  color: #ff6600;
  transform: translateY(-2px);
}

.footer-hours {
  font-size: 1rem;
  color: #888;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
}

.footer-copy {
  padding-top: 15px;
}

.footer-copy p {
  color: #999;
  font-size: 0.9rem;
  line-height: 1.6;
  font-family: "Montserrat", sans-serif;
  margin: 0;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
  .footer-main {
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 30px;
  }

  .footer-contact-info {
    align-items: center;
    text-align: center;
  }

  .footer-logo {
    width: 500px;
    height: 133px;
  }
}

@media (max-width: 768px) {
  .site-footer {
    padding: 30px 0 20px;
    margin-top: 60px;
  }

  .footer-main {
    gap: 25px;
  }

  .footer-logo {
    width: 300px;
    height: 80px;
  }

  .footer-contact-info {
    gap: 14px;
  }

  .footer-phone {
    font-size: 1.2rem;
  }

  .footer-email {
    font-size: 1rem;
  }
}

/* ===== Enhanced CTA Styling ===== */
.service-cta {
  text-align: center;
  padding: 40px;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  border-radius: 20px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  margin-top: 40px;
}

.cta-content {
  max-width: 500px;
  margin: 0 auto;
}

.cta-title {
  font-size: 2rem;
  font-weight: 800;
  color: #1a1a1a;
  margin: 0 0 16px 0;
  font-family: "Montserrat", sans-serif;
  line-height: 1.2;
}

.cta-subtitle {
  font-size: 1.2rem;
  color: #666;
  margin: 0 0 32px 0;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  line-height: 1.5;
}

.service-cta .btn-book {
  display: inline-block;
  background: linear-gradient(90deg, #ff6600, #ff9900);
  color: white;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 1.2rem;
  border: none;
  border-radius: 30px;
  padding: 18px 36px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 8px 25px rgba(255, 102, 0, 0.3);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.service-cta .btn-book:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 35px rgba(255, 102, 0, 0.4);
  background: linear-gradient(90deg, #ff5500, #ff8800);
}

/* Responsive adjustments for CTA */
@media (max-width: 768px) {
  .service-cta {
    padding: 30px 20px;
    margin-top: 30px;
  }

  .cta-title {
    font-size: 1.6rem;
  }

  .cta-subtitle {
    font-size: 1.1rem;
    margin-bottom: 24px;
  }

  .cta-features {
    margin-bottom: 24px;
  }

  .service-cta .btn-book {
    font-size: 0.7rem;
    padding: 16px 28px;
  }
}

/* ===== iPhone Optimization ===== */
@media (max-width: 480px) {
  /* Hide About Us button on very small screens */
  .header-nav {
    display: none !important;
  }

  /* Adjust header spacing */
  .header-right {
    gap: 16px !important;
  }

  /* Make buttons slightly smaller on iPhone */
  .btn-book,
  .btn-call {
    font-size: 0.9rem !important;
    padding: 5px 10px !important;
  }
}

/* ===== About Modal Styling ===== */
#about-modal .modal-container {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 800px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  margin: 0;
}

#about-modal .modal-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

/* Ensure modal content fits without scroll */
#about-modal .modal-body {
  max-height: calc(90vh - 120px);
  overflow-y: auto;
  padding-top: 8px;
}

.about-content {
  padding: 0;
}

.about-hero {
  text-align: center;
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 2px solid #f0f0f0;
}

.about-logo {
  margin-bottom: 15px;
}

.about-logo img {
  width: 120px;
  height: auto;
  filter: brightness(0) invert(1);
}

.about-hero h3 {
  font-size: 1.8rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 20px 0;
  font-family: "Montserrat", sans-serif;
  line-height: 1.2;
}

.about-sections {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-bottom: 30px;
}

.about-section {
  text-align: center;
  padding: 20px 15px;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  border-radius: 15px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.about-section:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.section-icon {
  font-size: 2rem;
  margin-bottom: 12px;
  display: block;
}

.about-section h4 {
  font-size: 1.2rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 12px 0;
  font-family: "Montserrat", sans-serif;
}

.about-section p {
  font-size: 1rem;
  color: #666;
  line-height: 1.6;
  margin: 0;
  font-family: "Montserrat", sans-serif;
}

.about-cta {
  text-align: center;
  padding: 25px;
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  border-radius: 15px;
  border: 1px solid #e2e8f0;
}

.about-cta p {
  font-size: 1.2rem;
  color: #666;
  margin: 0 0 20px 0;
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
}

.about-cta .btn-book {
  display: inline-block;
  background: linear-gradient(90deg, #ff6600, #ff9900);
  color: white;
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 1.1rem;
  border: none;
  border-radius: 25px;
  padding: 14px 28px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 6px 20px rgba(255, 102, 0, 0.3);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.about-cta .btn-book:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(255, 102, 0, 0.4);
  background: linear-gradient(90deg, #ff5500, #ff8800);
}

/* Responsive adjustments for About modal */
@media (max-width: 768px) {
  .about-modal {
    width: 95% !important;
    margin: 20px;
  }

  .about-sections {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .about-section {
    padding: 20px 15px;
  }

  .about-hero h3 {
    font-size: 1.5rem;
  }

  .about-cta {
    padding: 25px 20px;
  }
}

/* Remove logo block in About modal to avoid large gap */
#about-modal .about-logo {
  display: none;
}

/* Remove extra top spacing on hero */
#about-modal .about-hero {
  margin-top: 0;
  padding-top: 0;
}

/* About modal: remove top gap under header */
#about-modal .modal-header {
  padding: 16px 24px;
  margin-bottom: 8px;
}
#about-modal .modal-body {
  padding: 12px 24px 24px;
}
#about-modal .about-hero {
  margin: 0 0 16px 0;
  padding: 0;
  border: none;
}
#about-modal .about-hero h3 {
  margin: 0 0 12px 0;
}

/* ===== Modal buttons: smaller text across modals ===== */
#about-modal .btn-book,
#request-modal .btn-book,
#diagnostic-modal .btn-book {
  font-size: 0.9rem;
  padding: 10px 16px;
  border-radius: 18px;
  letter-spacing: 0.3px;
}

@media (max-width: 480px) {
  #about-modal .btn-book,
  #request-modal .btn-book,
  #diagnostic-modal .btn-book {
    font-size: 0.85rem;
    padding: 9px 14px;
  }
}

.page-subzero .wf-faq .wf-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(12px, 2vw, 18px);
}
@media (min-width: 900px) {
  /* Make buttons longer so 2-line text fits comfortably */
  .page-subzero .wf-faq .wf-grid {
    grid-template-columns: repeat(2, minmax(560px, 1fr));
    justify-content: center;
  }
}
.page-subzero .wf-faq .wf-btn {
  width: 100% !important;
  max-width: 100% !important;
}
.page-subzero .wf-faq .wf-btn span {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (max-width: 767px) {
  .page-subzero .wf-faq .wf-grid {
    grid-template-columns: 1fr;
  }
}

/* MODAL STYLES */
/* ===== MODAL ===== */