/* Adapt existing approved components to informationsystem detail pages.
   The production bundles remain the source of tokens and component styling. */
/* The shared desktop menu must fit its container without shrinking the logo. */
@media (min-width: 1024px) {
  .site-header .logo {
    flex-shrink: 0;
  }
  .site-header .site-header__container,
  .site-header .nav-menu__list {
    gap: var(--space-md);
  }
  .site-header .nav-menu__link {
    font-size: var(--font-size-md);
  }
}

.information-detail .hero-offer__title {
  overflow-wrap: anywhere;
}

.information-detail .hero-offer__subtitle > :first-child {
  margin-top: 0;
}

.information-detail .information-detail__image {
  display: block;
  width: 100%;
  max-height: 320px;
  margin-top: var(--space-xl);
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--radius-2xl);
}

.information-detail__benefits {
  display: grid;
  gap: var(--space-sm);
  margin-block: var(--space-lg);
  padding-left: var(--space-lg);
  color: var(--color-text-secondary);
}

.information-detail__benefits li::marker {
  color: var(--color-primary);
}

.information-detail .cta-card__input {
  min-height: 48px;
}

/* Keep the existing CMS HTML inside the same container as the hero.
   These rules do not affect approved pages or the global CTA/footer. */
.information-detail__body {
  min-width: 0;
  overflow-wrap: anywhere;
}

.information-detail__body .txt > :is(p, ul, ol, blockquote) {
  max-width: var(--container-narrow);
}

.information-detail__body .txt :is(ul, ol) {
  margin-block: var(--space-lg);
  padding-left: var(--space-lg);
}

.information-detail__body .txt ul {
  list-style: disc;
}

.information-detail__body .txt ol {
  list-style: decimal;
}

.information-detail__body .txt li + li {
  margin-top: var(--space-sm);
}

.information-detail__body .txt img {
  max-width: 100%;
  height: auto;
}

.information-detail__body .punkt-fl-row > .fl-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-lg);
  margin-top: var(--space-lg);
}

.information-detail__body .punkt-fl-row > .fl-row > .col {
  width: auto;
  min-width: 0;
}

.information-detail__body .punkt-bl {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
  height: 100%;
  padding: var(--space-lg);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-xl);
  background: var(--color-bg-base);
}

.information-detail__body .punkt-bl > img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

.information-detail__body .punkt-bl > p {
  margin: 0;
}

@media (min-width: 768px) {
  .information-detail__body .punkt-fl-row > .fl-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .information-detail__body .punkt-fl-row > .fl-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.information-detail .tbl-wrap > p {
  padding-inline: var(--space-lg);
}

.information-detail .tbl-row[data-information-table] {
  display: block;
  width: 100%;
  overflow-x: auto;
}

.information-detail .tbl-row[data-information-table] table {
  min-width: 560px;
  margin: 0;
}

.information-detail .tbl-row[data-information-table] th {
  text-align: left;
}

.information-detail .tbl-row[data-information-table] tbody th {
  background: var(--color-bg-base);
  color: var(--color-text-main);
  font-weight: var(--font-weight-medium);
}

.information-detail .tbl-row[data-information-table] td {
  white-space: nowrap;
}

.information-detail .tbl-row[data-information-table]:focus-visible,
.page-services .category-bl:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: -2px;
}

/* Delivery hero: scope by its existing accessible label, preserving CMS HTML.
   Runtime grid--2 uses auto minimums; long NBSP-linked headings widen tracks.
   Stack the main columns until both the offer and 2x2 cards have enough room. */
.hero-section .grid-blueprint__grid:has(> .grid-blueprint__aside[aria-label="Ключевые условия доставки"]) {
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
}

.hero-section .grid-blueprint__aside[aria-label="Ключевые условия доставки"] > .grid--2 {
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-md);
}

.hero-section .grid-blueprint__aside[aria-label="Ключевые условия доставки"] .feature-card {
  min-width: 0;
  padding: var(--space-lg);
  overflow-wrap: anywhere;
}

.hero-section .grid-blueprint__aside[aria-label="Ключевые условия доставки"] .feature-card__title {
  font-size: var(--font-size-lg);
}

@media (min-width: 768px) {
  .hero-section .grid-blueprint__aside[aria-label="Ключевые условия доставки"] > .grid--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1280px) {
  .hero-section .grid-blueprint__grid:has(> .grid-blueprint__aside[aria-label="Ключевые условия доставки"]) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Existing information-system lists: keep CMS links, classes and pagination. */
.page-services > .area-category > .page-bl,
.area-category.page-services > .page-bl,
.area-articles > .page-bl,
.area-articles + .area-text > .page-bl,
.area-quiz-new > .page-bl {
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding-mobile);
}

.page-services > .area-category,
.area-category.page-services {
  padding-block: var(--space-3xl);
}

.page-services .h-3_mobile {
  display: none;
}

.page-services > .area-category h1,
.area-category.page-services h1,
.area-articles h1 {
  margin-block: var(--space-lg) var(--space-2xl);
  font-size: clamp(1.75rem, 4vw, 3rem);
  line-height: var(--line-height-heading);
}

.information-detail--article .grid-blueprint__grid {
  grid-template-columns: minmax(0, 1fr);
  max-width: var(--container-narrow);
  margin-inline: auto;
}

.information-detail--article .hero-offer__title {
  font-size: clamp(1.75rem, 4vw, 3rem);
}

.information-detail--article .information-detail__body {
  max-width: var(--container-narrow);
}

.information-prices .tbl-wrap {
  margin-block: var(--space-2xl);
}

.information-prices .tbl-row[data-information-table] {
  overflow-x: auto;
  max-width: 100%;
}

.information-prices table {
  min-width: 560px;
}

.information-detail--regional > .section > .page-bl {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-padding-mobile);
}

.information-detail--regional .box-main {
  padding-block: var(--space-lg);
  background: var(--color-bg-base);
}

.information-detail--regional h1 {
  font-size: clamp(1.75rem, 4vw, 3rem);
  line-height: var(--line-height-heading);
  overflow-wrap: anywhere;
}

.information-detail--regional .box-main > .txt > .fl-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-xl);
}

.information-detail--regional .box-main .desktop-bl,
.information-detail--regional .main-inf + .mobile-bl {
  display: none;
}

.information-detail--regional .main-inf {
  display: grid;
  gap: var(--space-md);
  padding: var(--space-lg);
  margin-block: var(--space-lg);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-xl);
}

.information-detail--regional .main-inf li {
  display: flex;
  align-items: center;
  gap: var(--space-md);
}

.information-detail--regional .main-inf img {
  width: 24px;
  height: 24px;
}

.information-detail--regional .area-text :is(p, ul, ol) {
  max-width: var(--container-narrow);
}

.information-detail--regional .area-text ul {
  list-style: disc;
  padding-left: var(--space-lg);
}

.area-category.page-services .cities-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-md);
  margin-block: var(--space-lg);
}

.area-category.page-services .cities-list a {
  display: block;
  padding: var(--space-lg);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-lg);
}

html[data-information-view="legal"] main > .area-text > .page-bl,
html[data-information-view="map"] main > .area-text > .page-bl,
html[data-information-view="error"] main > .area-404 {
  max-width: var(--container-narrow);
  margin-inline: auto;
  padding-inline: var(--container-padding-mobile);
}

html[data-information-view="legal"] main > .area-text h2,
html[data-information-view="map"] main > .area-text h2 {
  margin-block: var(--space-xl) var(--space-lg);
  font-size: var(--font-size-xl);
}

html[data-information-view="legal"] main > .area-text :is(ul, ol),
html[data-information-view="map"] main > .area-text ul {
  padding-left: var(--space-lg);
  list-style: revert;
}

html[data-information-view="legal"] main > .area-text p,
html[data-information-view="map"] main > .area-text li {
  margin-bottom: var(--space-md);
}

html[data-information-view="error"] main > .area-404 {
  text-align: center;
  padding-block: var(--space-3xl);
}

html[data-information-view="error"] main > .area-404 img {
  max-width: 100%;
  max-height: 280px;
  margin: var(--space-lg) auto;
}

@media (min-width: 768px) {
  .area-category.page-services .cities-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.page-services .category-row,
.area-articles .articles-items {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-lg);
  margin-block: var(--space-lg);
}

.page-services .category-row > .col,
.area-articles .page-row > .col {
  min-width: 0;
  width: auto;
}

.page-services .category-bl,
.area-articles .article-box {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: var(--space-lg);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-xl);
  background: var(--color-bg-base);
  color: var(--color-text-main);
  text-decoration: none;
  overflow-wrap: anywhere;
}

.page-services .category-bl:hover,
.area-articles .article-box:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-sm);
}

.page-services .category-bl .bg:empty,
.area-articles .article-box .img:empty {
  display: none;
}

.page-services .category-bl img,
.area-articles .article-box img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-md);
}

.page-services .category-bl h3,
.area-articles .article-box .h-3 {
  margin: 0;
  font-size: var(--font-size-lg);
  line-height: var(--line-height-heading);
}

.area-articles .article-box .date {
  display: block;
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
  margin-bottom: var(--space-sm);
}

.area-articles .article-box .txt > :last-child:not(.h-3):not(.date) {
  margin-top: var(--space-md);
}

.area-articles .categories_list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
  padding: 0;
  margin-block: var(--space-lg);
}

.page-services .rss {
  margin-top: var(--space-xl);
  font-size: var(--font-size-sm);
}

/* Scoped replacement for missing legacy quiz styling. No slider dependency. */
.area-quiz-new .quiz-row,
.area-quiz-new .quiz-chk {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-md);
}

.area-quiz-new .col {
  min-width: 0;
  width: auto;
}

.area-quiz-new .quiz-box,
.area-quiz-new .quiz-slider {
  display: block;
  padding: var(--space-lg);
  margin-block: var(--space-lg);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-xl);
  background: var(--color-bg-base);
  overflow-wrap: anywhere;
}

.area-quiz-new .q-img img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: var(--radius-lg);
  margin-bottom: var(--space-md);
}

.area-quiz-new .quiz-box {
  margin: 0;
  height: 100%;
}

.area-quiz-new .quiz-row {
  margin-block: var(--space-lg);
}

.area-quiz-new .proc-row,
.area-quiz-new .quiz-inf,
.area-quiz-new .sw-btns-bl,
.area-quiz-new .quiz-sbmts span.next {
  display: none;
}

.area-quiz-new [data-information-quiz] .swiper-wrapper {
  display: block;
  transform: none;
  height: auto;
}

.area-quiz-new [data-information-quiz] .swiper-slide {
  width: 100%;
}

.area-quiz-new [hidden] {
  display: none !important;
}

.area-quiz-new .quiz-bl .h-2 {
  margin-bottom: var(--space-md);
  font-size: clamp(1.25rem, 2vw, 1.75rem);
  line-height: var(--line-height-heading);
}

.area-quiz-new .quiz-bl p {
  margin-bottom: var(--space-lg);
  color: var(--color-text-secondary);
}

.area-quiz-new .quiz-chk label,
.area-quiz-new .rd-row label {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  min-height: 48px;
  padding: var(--space-md);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-lg);
  cursor: pointer;
}

.area-quiz-new label:has(input:checked) {
  border-color: var(--color-primary);
  background: var(--color-bg-muted);
}

.area-quiz-new input:is([type="radio"], [type="checkbox"]) {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  accent-color: var(--color-primary);
  margin: 0;
}

.area-quiz-new .quiz-sbmts {
  margin-top: var(--space-xl);
}

.area-quiz-new .quiz-sbmts .line {
  height: 4px;
  background: var(--color-border-soft);
  margin-bottom: var(--space-md);
}

.area-quiz-new .quiz-sbmts .line > span {
  display: block;
  height: 100%;
  background: var(--color-primary);
}

.area-quiz-new .q-txt,
.area-quiz-new .q-txt > div,
.area-quiz-new .rd-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
}

.area-quiz-new .quiz-sbmts button,
.area-quiz-new .quiz-form button {
  min-height: 48px;
  padding: var(--space-md) var(--space-lg);
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-lg);
  background: var(--color-primary);
  color: var(--color-bg-base);
  cursor: pointer;
}

.area-quiz-new .quiz-sbmts button.prev {
  background: var(--color-bg-base);
  color: var(--color-primary);
}

.area-quiz-new button:disabled {
  opacity: .45;
  cursor: default;
}

.area-quiz-new .quiz-form .inp-bl {
  margin-bottom: var(--space-md);
}

.area-quiz-new .quiz-form input:not([type="radio"]):not([type="hidden"]) {
  width: 100%;
  min-height: 48px;
  padding: var(--space-md);
  border: 1px solid var(--color-border-soft);
  border-radius: var(--radius-lg);
  background: var(--color-bg-base);
}

.area-quiz-new .quiz-discount {
  margin-top: var(--space-xl);
  padding: var(--space-lg);
  border-radius: var(--radius-lg);
  background: var(--color-bg-muted);
}

.area-quiz-new .quiz-discount p {
  margin-top: var(--space-sm);
}

.area-quiz-new :is(button, input, a):focus-visible,
.area-articles .article-box:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
}

@media (min-width: 768px) {
  .page-services .category-row,
  .area-articles .articles-items,
  .area-quiz-new .quiz-row,
  .area-quiz-new .quiz-chk {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .page-services .category-row,
  .area-articles .articles-items {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .area-quiz-new .quiz-row {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

/* Shared navigation: retain the layer so opening and closing can reverse. */
.mobile-drawer {
  display: block;
  visibility: hidden;
  pointer-events: none;
  z-index: var(--z-modal);
  transition: visibility 0s linear 240ms;
}
.mobile-drawer.mobile-drawer--open {
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}
.mobile-drawer .mobile-drawer__dialog {
  transform: translate3d(100%, 0, 0);
  transition: transform 240ms cubic-bezier(.22, .61, .36, 1);
  animation: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  backface-visibility: hidden;
}
.mobile-drawer--moving .mobile-drawer__dialog {
  will-change: transform;
}
.mobile-drawer.mobile-drawer--open .mobile-drawer__dialog {
  transform: translate3d(0, 0, 0);
  animation: none;
}
.mobile-drawer .mobile-drawer__backdrop {
  opacity: 0;
  transition: opacity 240ms ease;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  animation: none;
}
.mobile-drawer.mobile-drawer--open .mobile-drawer__backdrop {
  opacity: 1;
  animation: none;
}
@media (prefers-reduced-motion: reduce) {
  .mobile-drawer,
  .mobile-drawer .mobile-drawer__dialog,
  .mobile-drawer .mobile-drawer__backdrop {
    transition: none;
  }
}

/* HostCMS emits both named items and plain li in its existing lists. */
:is(.breadcrumbs__list, ul.breadcrumbs, .breadcrumbs-section ul.breadcrumbs) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-xs) var(--space-sm);
  margin: 0 0 var(--space-lg);
  padding: 0;
  list-style: none;
  font-family: var(--font-family-base);
  font-size: var(--font-size-md);
  line-height: 1.5;
  color: var(--color-text-muted);
}
:is(.breadcrumbs__list, ul.breadcrumbs, .breadcrumbs-section ul.breadcrumbs) > li {
  display: inline-flex;
  align-items: baseline;
  gap: var(--space-sm);
  min-width: 0;
  overflow-wrap: anywhere;
}
:is(.breadcrumbs__list, ul.breadcrumbs, .breadcrumbs-section ul.breadcrumbs) > li:not(:last-child)::after {
  content: "/";
  flex-shrink: 0;
  color: var(--color-text-muted);
  font-weight: var(--font-weight-regular);
}
:is(.breadcrumbs__list, ul.breadcrumbs, .breadcrumbs-section ul.breadcrumbs) > li:last-child::after {
  content: none;
}
:is(.breadcrumbs__list, ul.breadcrumbs, .breadcrumbs-section ul.breadcrumbs) a {
  color: var(--color-text-muted);
  text-decoration: none;
}
:is(.breadcrumbs__list, ul.breadcrumbs, .breadcrumbs-section ul.breadcrumbs) a:hover {
  color: var(--color-primary-hover);
  text-decoration: underline;
}
:is(.breadcrumbs__list, ul.breadcrumbs, .breadcrumbs-section ul.breadcrumbs) > li:last-child {
  color: var(--color-text-main);
  font-weight: var(--font-weight-medium);
}

/* Keep navigation at the viewport edge without changing document flow. */
.site-header {
  position: sticky !important;
  top: 0;
  z-index: var(--z-header);
}

/* Decorative photography sits below the blueprint and readable content. */
.hero-section > .hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}
.hero-section > .hero__media .hero__media-image {
  width: 100%;
  height: 100%;
  max-height: none;
  margin: 0;
  border-radius: 0;
  object-fit: cover;
  object-position: center;
  filter: grayscale(1) invert(1) contrast(1.2);
  mix-blend-mode: screen;
  opacity: .32;
}
.hero-section > .hero__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(18,61,53,.82), rgba(18,61,53,.18));
}
.hero-section.grid-blueprint::before {
  z-index: 1;
}
.hero-section > .container {
  position: relative;
  z-index: 2;
}

/* Notices stay below navigation; preserve the CMS text and close handler. */
.alert-fz {
  position: fixed !important;
  top: auto !important;
  bottom: var(--space-md) !important;
  left: var(--space-md) !important;
  right: auto !important;
  width: min(520px, calc(100% - 32px)) !important;
  max-height: min(220px, 35vh);
  margin: 0 !important;
  padding: 16px 52px 16px 20px !important;
  overflow-y: auto;
  background: var(--color-bg-base) !important;
  color: var(--color-text-main) !important;
  border: 1px solid var(--color-border-base);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  font-size: 12px;
  line-height: 1.5;
  z-index: var(--z-overlay);
}
.alert-fz p {
  color: inherit;
}
.alert-fz .alert-fz-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 36px;
  height: 36px;
}

@media (max-width: 1023px) {
  .geography-section__grid,
  .geography-section__list-box,
  .geography-section__details-box {
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }
  .geography-section__list-box {
    display: block;
    overflow: visible;
    padding-right: 0;
  }
  .geography-section__list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: visible;
  }
  .geography-section__item,
  .geography-section__city-btn,
  .geography-section__city-btn > div {
    min-width: 0;
    width: 100%;
    max-width: 100%;
  }
  .geography-section__city-btn-name,
  .geography-section__city-btn-districts {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .geography-details__header {
    flex-wrap: wrap;
  }
}
@media (min-width: 640px) and (max-width: 1023px) {
  .geography-section__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 767px) {
  .hero-section > .hero__media::after {
    background: rgba(18,61,53,.62);
  }
  #catalog .catalog-carousel,
  #catalog .catalog-carousel__track,
  #catalog .catalog-carousel__slide,
  #catalog .catalog-card {
    min-width: 0;
  }
  #catalog .catalog-controls,
  #catalog .catalog-controls__status,
  .hero__actions {
    flex-wrap: wrap;
  }
}

/* Blueprint paper, with a photographic approximation of light drawing strokes. */
:is(.hero-section, .catalog-hero).grid-blueprint {
  background: #123D35;
  color: #F4F8F5;
  isolation: isolate;
}
:is(.hero-section, .catalog-hero).grid-blueprint::before {
  background-image:
    linear-gradient(rgba(184,218,204,.25) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184,218,204,.25) 1px, transparent 1px),
    linear-gradient(rgba(184,218,204,.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(184,218,204,.14) 1px, transparent 1px);
  background-size: 120px 120px, 120px 120px, 24px 24px, 24px 24px;
  opacity: 1;
}
:is(.hero-section, .catalog-hero).grid-blueprint :is(h1, .hero-offer__title, .catalog-hero__title) {
  color: #F4F8F5;
}
:is(.hero-section, .catalog-hero).grid-blueprint :is(.hero-offer__subtitle, .catalog-hero__text, .breadcrumbs__list, .breadcrumbs__list a, .breadcrumbs__list > li:last-child, .breadcrumbs__list > li::after) {
  color: #D8E7DF;
}
.hero-section > .hero__media { background: #123D35; }
.information-category-hero { padding-block: clamp(40px, 6vw, 80px); }
.information-category-hero .hero-offer__title { margin: 0; }

:is(.hero-section, .catalog-hero).grid-blueprint :is(.hero-offer__benefits, .hero-offer__benefit, .stats-strip__value, .stats-strip__label, .hero-offer__eyebrow, .hero-offer__note, ul.breadcrumbs, ul.breadcrumbs a, ul.breadcrumbs > li:last-child, ul.breadcrumbs > li::after) { color: #D8E7DF; }

:is(.hero-section, .catalog-hero).grid-blueprint :is(.hero__proof-list, .hero__proof-item, .hero-offer__tag, .premium-slogan) { color: #D8E7DF; }

:is(.hero-section, .catalog-hero).grid-blueprint :is(.breadcrumbs__list, ul.breadcrumbs) [aria-current="page"] { color: #F4F8F5; }
.hero-section.grid-blueprint .hero-offer__tag {
  background: rgba(216,231,223,.12);
  border-color: rgba(216,231,223,.35);
  color: #D8E7DF;
}
.hero-section.grid-blueprint .premium-slogan span {
  background: none;
  color: #AED0BF;
  -webkit-text-fill-color: #AED0BF;
}

/* Light panels retain their own text palette inside the green hero. */
:is(.hero-section, .catalog-hero).grid-blueprint :is(.grid-blueprint__aside, .catalog-card, .calculator-card, .feature-card, .media-card) {
  color: var(--color-text-main);
}
.hero-section.grid-blueprint .premium-slogan {
  background: none;
  color: #AED0BF;
  -webkit-text-fill-color: #AED0BF;
}
.hero-section.grid-blueprint .premium-slogan::after { background-color: #AED0BF; }
.hero-section.grid-blueprint .product-summary__badges .badge,
.catalog-hero.grid-blueprint .grid-blueprint__content > .badge {
  background: #E5EFE9;
  border-color: #E5EFE9;
  color: #214B3F;
}
.hero-section.grid-blueprint .product-summary__badges .badge--outline {
  background: transparent;
  border-color: #AED0BF;
  color: #D8E7DF;
}

/* Shared service content: existing HostCMS rich text and prices stay intact. */
.information-service-content { padding-block: 32px; }
.information-service-content [data-service-section] {
  margin-block: 24px; padding: clamp(20px, 4vw, 40px);
  border: 1px solid #DCE8E1; border-radius: 24px; background: #F2F6F3;
  color: #1A1F26;
}
.information-service-content [data-service-section]:nth-of-type(even) { background: #fff; }
.information-service-content [data-service-section] .page-bl { width: 100%; max-width: none; padding: 0; margin: 0; }
.information-service-content [data-service-section] :is(h2,.h-2) { color: #214B3F; font-size: clamp(22px, 2.5vw, 32px); line-height: 1.3; margin-top: 0; scroll-margin-top: 120px; }
.information-service-content [data-service-section] :is(p,li) { line-height: 1.75; }
.information-service-content .information-content-block + .information-content-block { margin-top: 32px; padding-top: 32px; border-top: 1px solid #DCE8E1; }
.information-service-content .information-topic-card { max-width: none; padding: 20px 24px; background: #E5EFE9; border-left: 3px solid #009966; border-radius: 0 16px 16px 0; }
.information-topic-card > strong:first-child { display: block; margin-bottom: 8px; color: #214B3F; }
.information-service-nav { padding: 20px 24px; border: 1px solid #DCE8E1; border-radius: 20px; background: #fff; }
.information-service-nav > p { margin: 0 0 12px; font-weight: 700; color: #214B3F; }
.information-service-nav ul { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0; padding: 0; }
.information-service-nav a { display: block; padding: 10px 14px; border-radius: 12px; background: #E5EFE9; color: #214B3F; font-size: 14px; text-decoration: none; }
.information-service-nav a:hover { background: #D3E5DA; }
.information-service-nav a:focus-visible { outline: 2px solid #009966; outline-offset: 3px; }
.information-service-content .punkt-bl.process-card { border-color: #DCE8E1; text-align: left; align-items: flex-start; }
.information-service-content .process-card__number-bg { color: #DCE8E1; }
.information-service-content .process-card__step { flex-shrink: 0; margin-bottom: 0; }
.information-service-content .punkt-bl > p { position: relative; z-index: 1; margin: 0; }
.information-service-photo { display: block; width: 100%; height: auto; max-height: 440px; object-fit: contain; padding: 16px; border-radius: 20px; background: #E5EFE9; box-sizing: border-box; }
.information-service-content .area-why .fl-row { display: grid; gap: 32px; grid-template-columns: minmax(0,1fr); }
.information-service-content .area-why .col { width: auto; min-width: 0; }
.information-service-content .sw-why .swiper { overflow: visible; }
.information-service-content .sw-why .swiper-wrapper { display: grid; gap: 12px; transform: none !important; width: 100%; }
.information-service-content .sw-why .swiper-slide { width: 100% !important; height: auto; margin: 0 !important; }
.information-service-content .why-info { display: flex; gap: 12px; padding: 16px; background: #fff; border: 1px solid #DCE8E1; border-radius: 14px; }
.information-service-content .why-info > img { display: none; }
.information-service-content .why-info::before { content: ''; flex: 0 0 8px; height: 8px; margin-top: 10px; border-radius: 50%; background: #009966; }
.information-service-content .why-info p { margin: 0; }
.information-service-content .sw-why :is(.swiper-button-prev,.swiper-button-next,.swiper-scrollbar,.swiper-pagination) { display: none; }
.information-service-content .information-service-section--prices { background: #E5EFE9 !important; }
.information-service-content .information-price-table { width: 100%; min-width: 0 !important; border-collapse: separate; border-spacing: 0; }
.information-service-content .information-price-table thead th { background: #123D35; color: #F4F8F5; padding: 18px; }
.information-service-content .information-price-table tbody :is(th,td) { padding: 18px; white-space: normal; vertical-align: middle; background: #fff; border-bottom: 1px solid #DCE8E1; text-align: left; }
.information-service-content .information-price-table tbody tr:nth-child(even) :is(th,td) { background: #F2F6F3; }
.information-service-content .information-price-table .h-4 { margin: 0; font-size: 16px; line-height: 1.5; color: #214B3F; text-align: left; }
.information-service-content .information-price-table .information-price-value { color: #007A53; font-weight: 700; font-size: 18px; }
@media (min-width: 900px) {
  .information-service-content .area-why .fl-row { grid-template-columns: minmax(0,2fr) minmax(0,3fr); align-items: start; }
}
@media (max-width: 767px) {
  .information-service-content [data-service-section] { border-radius: 18px; margin-block: 16px; }
  .information-service-nav { padding: 16px; }
  .information-service-content .information-price-table { display: block; }
  .information-service-content .information-price-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .information-service-content .information-price-table tbody { display: grid; gap: 12px; }
  .information-service-content .information-price-table tbody tr { display: grid; padding: 16px; border: 1px solid #DCE8E1; border-radius: 16px; background: #fff; }
  .information-service-content .information-price-table tbody :is(th,td) { display: block; padding: 8px 0; border: 0; background: transparent !important; }
  .information-service-content .information-price-table tbody td { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; }
  .information-service-content .information-price-table tbody td::before { content: attr(data-label); color: #52645B; font-size: 14px; font-weight: 400; }
}
.information-service-content [data-service-section] .text-inf { padding: 24px; margin-block: 16px; border: 1px solid #DCE8E1; border-radius: 16px; background: #E5EFE9; }
.information-service-content [data-service-section] .text-inf > img[src$="/point1.svg"] { width: 32px; height: 32px; object-fit: contain; filter: grayscale(1); opacity: .65; }
.information-service-content [data-service-section] li::marker { color: #007A53; }

.alert-fz[hidden] { display: none !important; }
.alert-fz .alert-fz-close {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; padding: 0; border: 1px solid #DCE8E1;
  border-radius: 12px; background: #E5EFE9; color: #214B3F;
  font: 28px/1 Arial, sans-serif; cursor: pointer;
}
.alert-fz .alert-fz-close:hover { background: #D3E5DA; }
.alert-fz .alert-fz-close:focus-visible { outline: 2px solid #009966; outline-offset: 2px; }

.hero-section.grid-blueprint .information-detail__benefits {
  color: #E8F1EB; font-family: var(--font-family-base); font-size: 16px;
  font-weight: 500; line-height: 1.6; gap: 12px; padding-left: 22px;
}
.hero-section.grid-blueprint .information-detail__benefits li { color: inherit; }
.hero-section.grid-blueprint .information-detail__benefits li::marker { color: #AED0BF; }
.hero-section.grid-blueprint .grid-blueprint__content > .hero-offer__subtitle {
  font-family: var(--font-family-base); font-weight: 400; line-height: 1.65; color: #D8E7DF;
}

.information-service-panels { min-width: 0; }
.information-service-panels > [data-service-section]:first-child { margin-top: 0; }
@media (min-width: 1100px) {
  .information-service-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 24px; align-items: start; }
  .information-service-layout > .information-service-nav { position: sticky; top: 120px; max-height: calc(100vh - 144px); overflow-y: auto; padding: 20px; }
  .information-service-layout > .information-service-nav ul { display: grid; gap: 8px; }
  .information-service-layout > .information-service-nav a { line-height: 1.55; }
  .information-service-panels .punkt-fl-row > .fl-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1099px) {
  .information-service-layout > .information-service-nav { margin-bottom: 24px; }
}

/* Regional catalog uses the approved hero and card components. */
.information-detail--regional .area-main { position: relative; overflow: hidden; }
.information-detail--regional .area-main > .container { position: relative; z-index: 2; }
.information-detail--regional .area-main .box-main { background: transparent; padding: 0; }
.information-detail--regional .area-main .hero-offer { max-width: 850px; }
.information-detail--regional .area-main h1 { color: #F4F8F5; }
.information-detail--regional .area-main .hero-offer__subtitle,
.information-detail--regional .area-main .hero-offer__subtitle p { color: #D8E7DF; }
.information-detail--regional .area-main .hero-offer__subtitle p { margin-block: 0 16px; }
.regional-catalog-grid.catalog-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 0; }
.regional-catalog-grid > .catalog__item { width: auto; max-width: none; min-width: 0; padding: 0; margin: 0; }
.regional-catalog-grid .catalog-card { height: 100%; }
.regional-catalog-grid .catalog-card__title a { color: inherit; text-decoration: none; }
.regional-catalog-grid .catalog-card__title a:hover { color: var(--color-primary); }
.regional-catalog-grid .catalog-card__spec-value { text-align: right; }
@media (max-width: 1100px) { .regional-catalog-grid.catalog-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .regional-catalog-grid.catalog-row { grid-template-columns: minmax(0, 1fr); gap: 16px; } }
html[data-information-view="error"] main > .area-404 { max-width: var(--container-max); padding: clamp(32px, 6vw, 80px) var(--container-padding-mobile); text-align: left; }
html[data-information-view="error"] .area-404 > .page-bl,
html[data-information-view="error"] .area-404 .err404__txt { max-width: 760px; margin-inline: auto; }
html[data-information-view="error"] .area-404 h1 { color: #214B3F; font-size: clamp(2rem, 5vw, 3.5rem); margin-block: 24px; }
html[data-information-view="error"] .area-404 .err404-wrap { margin-top: 24px; padding: 32px; background: #E5EFE9; border: 1px solid #CADCD2; border-radius: var(--radius-xl); }
html[data-information-view="error"] .area-404 .err404__txt > .h-2 { font-size: var(--font-size-xl); color: #214B3F; }
html[data-information-view="error"] .area-404 p { color: #394A42; line-height: 1.65; }
html[data-information-view="error"] .area-404 .btn { margin: 12px 0; }
@media (max-width: 767px) { html[data-information-view="error"] .area-404 .err404-wrap { padding: 20px; } }

/* Legacy regional documents keep their content, inside the shared container. */
html[data-regional-catalog] main > :is(.area-catalog, .area-text, .area-category, .area-quiz-new, .area-questions) > .page-bl,
.information-detail--regional > [data-service-section],
.information-detail--regional > .information-service-layout {
  width: calc(100% - 64px); max-width: var(--container-max); margin-inline: auto;
}
html[data-regional-catalog] .area-category.page-services .cities-list { list-style: none; padding-left: 0; }
html[data-regional-catalog] .area-catalog .page-row > .col { min-width: 0; width: auto; }
html[data-regional-catalog] .area-catalog .page-row > .col-medium .regional-catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html[data-regional-catalog] .area-catalog .catalog__sidebar { position: static; }
html[data-regional-catalog] .area-catalog .cat-links { display: block; margin-bottom: 20px; color: #214B3F; }
@media (min-width: 1101px) {
  html[data-regional-catalog] .area-catalog .page-row:has(> .col-small) { display: grid; grid-template-columns: 280px minmax(0, 1fr); align-items: start; gap: 24px; }
}
@media (max-width: 767px) {
  html[data-regional-catalog] main > :is(.area-catalog, .area-text, .area-category, .area-quiz-new, .area-questions) > .page-bl,
  .information-detail--regional > [data-service-section],
  .information-detail--regional > .information-service-layout { width: calc(100% - 32px); }
  html[data-regional-catalog] .area-catalog .page-row > .col-medium .regional-catalog-grid { grid-template-columns: minmax(0, 1fr); }
}

html[data-regional-catalog] .information-prices > [data-service-section] { padding: 32px; border: 1px solid #DCE8E1; border-radius: 24px; background: #E5EFE9; }
html[data-regional-catalog] .information-prices [data-information-table] { border-radius: 16px; }
html[data-regional-catalog] .area-questions .fl-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
html[data-regional-catalog] .area-questions .col { width: auto; min-width: 0; }
html[data-regional-catalog] .area-questions .swiper { overflow: visible; }
html[data-regional-catalog] .area-questions .swiper-wrapper { display: grid; gap: 16px; width: 100%; height: auto !important; transform: none !important; }
html[data-regional-catalog] .area-questions .swiper-slide { width: 100% !important; height: auto; margin: 0 !important; }
html[data-regional-catalog] .area-questions .sw-btns-bl { display: none; }
html[data-regional-catalog] .area-questions .faq-item { background: #fff; border-color: #DCE8E1; }
html[data-regional-catalog] .area-questions summary { cursor: pointer; list-style: none; }
html[data-regional-catalog] .area-questions summary::-webkit-details-marker { display: none; }
html[data-regional-catalog] .area-questions summary::after { content: '+'; color: #007A53; font-size: 24px; }
html[data-regional-catalog] .area-questions details[open] summary::after { content: '−'; }
html[data-regional-catalog] .area-questions summary:focus-visible { outline: 2px solid #009966; outline-offset: -4px; }
html[data-regional-catalog] .area-questions .faq-item__answer p { margin-bottom: 12px; font-size: 16px; line-height: 1.65; }
@media (min-width: 1101px) { html[data-regional-catalog] .area-questions .fl-row { grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); align-items: start; } }
@media (max-width: 767px) { html[data-regional-catalog] .information-prices > [data-service-section] { padding: 20px; } }

/* Service photographs: existing Shop 6 media, separate from equipment cutouts. */
.product-page .hero-section .media-card:has(.media-card__content[src^="/upload/shop_6/"]) {
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  justify-items: start;
}
.product-page .hero-section .media-card:has(.media-card__content[src^="/upload/shop_6/"]) .media-card__link {
  height: auto;
  max-width: 540px;
}
.product-page .hero-section .media-card .media-card__content[src^="/upload/shop_6/"] {
  width: 100%;
  height: auto;
  max-width: 540px;
  max-height: none;
  border-radius: var(--radius-2xl);
  border: 1px solid rgba(255, 255, 255, 0.24);
  box-shadow: 0 14px 30px -16px rgba(8, 35, 26, 0.65),
              0 22px 24px -24px rgba(255, 255, 255, 0.7);
}
/* The original select remains the submitted field; the popup follows DS tokens. */
.ds-select { position: relative; width: 100%; min-width: 0; }
.ds-select select.ds-select__native { position: absolute; width: 1px; height: 1px; padding: 0; margin: 0; opacity: 0; pointer-events: none; }
.ds-select__trigger { display: block; position: relative; width: 100%; min-height: 48px; padding: 12px 42px 12px 16px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-xl); background: var(--color-bg-base); color: var(--color-text-main); font: inherit; font-size: 14px; line-height: 1.5; text-align: left; cursor: pointer; }
.ds-select__trigger::after { content: ''; position: absolute; top: 50%; right: 18px; width: 7px; height: 7px; border-right: 1.5px solid var(--color-text-muted); border-bottom: 1.5px solid var(--color-text-muted); transform: translateY(-70%) rotate(45deg); }
.ds-select__trigger:focus-visible, .ds-select--open .ds-select__trigger { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.ds-select__trigger:disabled { opacity: .55; cursor: default; }
.ds-select__trigger[aria-invalid='true'] { border-color: #b42318; }
.ds-select--open { z-index: 30; }
.ds-select__list { position: absolute; top: calc(100% + 8px); left: 0; right: 0; z-index: 40; padding: 6px; max-height: min(240px, 40vh); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--color-border-soft) transparent; border: 1px solid var(--color-border-soft); border-radius: var(--radius-xl); background: var(--color-bg-base); box-shadow: var(--shadow-lg); }
.ds-select__list[hidden] { display: none; }
.ds-select--up .ds-select__list { top: auto; bottom: calc(100% + 8px); }
.ds-select__option { padding: 10px 12px; border-radius: var(--radius-md); color: var(--color-text-main); font: inherit; font-size: 14px; line-height: 1.5; cursor: pointer; overflow-wrap: anywhere; }
.ds-select__option:hover, .ds-select__option.is-active { background: var(--color-primary-soft); }
.ds-select__option[aria-selected='true'] { color: var(--color-primary); font-weight: 600; background: var(--color-bg-page); }

/* Existing Shop 6 area cards: photographs without inset media frames. */
.catalog-card:has(.catalog-card__img[src^="/upload/shop_6/"]) .catalog-card__media {
  aspect-ratio: auto;
  padding: 0;
  min-height: 0;
  border: 0;
  border-radius: var(--radius-2xl);
  background: transparent;
  box-shadow: none;
  overflow: visible;
}
.catalog-card .catalog-card__img[src^="/upload/shop_6/"] {
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  max-height: none;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border: 0;
  border-radius: var(--radius-2xl);
  box-shadow: 0 12px 22px -18px rgba(8, 35, 26, .45);
}

@media (min-width: 768px) {
  .catalog-scenario-bar .ds-select { display: none; }
  .catalog-toolbar > .ds-select { max-width: 260px; }
}

/* Service destination cards: equal tracks and a shared footer baseline. */
.catalog__products,
.regional-catalog-grid {
  grid-auto-rows: 1fr;
  align-items: stretch;
}
.catalog-card .catalog-card__body {
  flex: 1;
  padding-inline: 0;
}
.catalog-card:has(.js-catalog-order[data-order-kind="service"]) .catalog-card__footer {
  margin-top: var(--space-lg);
}
.catalog-advice-section {
  padding-bottom: clamp(32px, 5vw, 64px);
}

.catalog-card {
  height: 100%;
  align-self: stretch;
}

/* Use the full card width and keep the measurement and unit together. */
.catalog-card .catalog-card__spec-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-xs);
  align-items: baseline;
}
.catalog-card .catalog-card__spec-value {
  white-space: nowrap;
  overflow-wrap: normal;
}

/* Keep the phone icon and number together; override stacked runtime contacts. */
.site-header .site-header__phone {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  color: var(--color-text-main);
  line-height: 1.4;
  white-space: nowrap;
}
.site-header .site-header__phone > span { color: inherit; }
.site-header .site-header__phone > .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
}
.site-header .site-header__phone .icon svg { display: block; width: 100%; height: 100%; }
.site-header .site-header__phone:hover { color: var(--color-primary); }

/* Landing copy uses the existing typography and muted blueprint palette. */
[data-seo-landing] { background: var(--color-bg-body, #f4f7f5); }
[data-seo-landing] .legal-page__content { max-width: 860px; color: var(--color-text-main, #1a1f26); font-size: 16px; line-height: 1.75; }
[data-seo-landing] h3 { margin: 32px 0 12px; padding-left: 16px; border-left: 3px solid var(--color-primary, #32745d); font-size: clamp(20px, 2vw, 24px); line-height: 1.35; color: var(--color-text-main, #1a1f26); }
[data-seo-landing] p { margin: 0 0 16px; }
[data-seo-landing] a { color: var(--color-primary, #32745d); text-decoration: underline; text-underline-offset: 3px; }
[data-seo-landing] a:hover { color: var(--color-text-main, #1a1f26); }
@media (max-width: 767px) { [data-seo-landing] .legal-page__content { font-size: 15px; line-height: 1.7; } }

/* Separate landing copy from cards, tabs, pagination and the next CTA. */
[data-seo-landing] {
  margin-block: clamp(24px, 4vw, 48px);
  padding-block: clamp(32px, 5vw, 64px);
}

/* Reserve enough desktop footer space for an unbroken telephone number. */
.site-footer .site-footer__phone {
  white-space: nowrap;
  flex-shrink: 0;
  gap: 8px;
  line-height: 1.4;
}
.site-footer .site-footer__phone::before {
  flex: none;
  line-height: 1;
}
@media (min-width: 1024px) {
  .site-footer .site-footer__col--brands { grid-column: span 2; }
  .site-footer .site-footer__col--contacts { grid-column: span 3; }
}

/* Reuse the framed service-panel treatment for all landing text blocks. */
[data-seo-landing] { padding-block: 0; background: transparent; }
[data-seo-landing] > .container {
  padding: clamp(24px, 4vw, 40px);
  border: 1px solid var(--color-border-soft, #dce8e1);
  border-radius: var(--radius-xl, 24px);
  background: #E5EFE9;
}
[data-seo-landing] .section-title-block { text-align: left; margin-bottom: 24px; }
[data-seo-landing] .section-title-block__title { color: #214B3F; text-align: left; }

/* Service landing cards share the borderless rounded-photo treatment. */
.information-service-index .articles-item,
.information-service-index .item-bl { display: flex; flex-direction: column; height: 100%; }
.information-service-index .article-box {
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.information-service-index .article-box .img { overflow: hidden; border-radius: var(--radius-lg); }
.information-service-index .article-box img { display: block; margin: 0; }
.information-service-index .article-box .txt { padding: var(--space-md) 4px 0; }
.information-service-index .article-box .h-3 { color: var(--color-text-main); font-family: var(--font-family-heading); }
.information-service-index .article-box .txt p { color: var(--color-text-secondary); line-height: var(--line-height-base); }
.information-service-index .article-box:hover .h-3 { color: var(--color-primary); }
.information-service-index .article-box:hover .img { box-shadow: var(--shadow-sm); }

/* Fieldset legends are outside the grid track; give their option rows a real gap. */
.catalog-selector__legend + .catalog-selector__options { margin-top: var(--space-sm, 12px); }
.information-rich-panel > :is(h2,h3) { font-family: var(--font-family-heading); color: #214B3F; font-size: clamp(20px, 2vw, 28px); line-height: 1.35; margin: 0 0 20px; scroll-margin-top: 120px; }
.information-rich-panel > p { margin: 0 0 16px; }
.information-rich-panel > :last-child { margin-bottom: 0; }
.information-rich-panel :is(ul,ol) { padding-left: 24px; }
.information-rich-panel li + li { margin-top: 12px; }
.information-rich-panel li > p { margin: 0; }
.information-rich-panel .numbers { counter-reset: service-step; padding: 0; list-style: none; }
.information-rich-panel .numbers > li { counter-increment: service-step; position: relative; padding: 20px 20px 20px 76px; border: 1px solid #DCE8E1; border-radius: 16px; background: #fff; }
.information-rich-panel .numbers > li::before { content: counter(service-step, decimal-leading-zero); position: absolute; left: 20px; top: 20px; color: #32745D; font-family: var(--font-family-heading); font-size: 20px; }
.information-rich-panel .table-responsive { max-width: 100%; overflow-x: auto; border-radius: 12px; }
.information-rich-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.information-rich-table :is(th,td) { padding: 16px; border: 1px solid #DCE8E1; text-align: left; }
.information-rich-table thead th { background: #123D35; color: #F4F8F5; }
.information-rich-table tbody tr:nth-child(even) { background: #F2F6F3; }
.information-rich-panel table caption { padding: 12px 0; color: var(--color-text-secondary); text-align: left; }

/* Preserve legible columns in wide legacy price matrices. */
.information-rich-table { min-width: 960px; }
.information-rich-table tr > :first-child { min-width: 130px; }
.information-rich-table thead th { min-width: 120px; }

.information-rich-panel .table-responsive { margin-bottom: 24px; }
.information-rich-table :is(th,td) { overflow-wrap: normal; word-break: normal; }
.information-rich-table tr > :first-child { min-width: 150px; }

/* Keep the existing catalog filter accessible below the sticky header. */
@media (min-width: 1200px) {
  .catalog__sidebar {
    max-height: calc(100dvh - var(--header-height, 96px) - 2 * var(--space-lg));
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--color-border-soft) transparent;
  }
}

/* Compact catalog controls, with native dual range handles. */
.catalog__sidebar .catalog-filter { padding: 16px; gap: 14px; }
.catalog__sidebar .catalog-filter__advanced-body { gap: 12px; padding-top: 0; }
.catalog__sidebar .catalog-filter__group { gap: 4px; margin: 0; }
.catalog__sidebar .catalog-seo-filter { margin: 0; }
.catalog__sidebar .catalog-filter__group-title { line-height: 1.3; }
.catalog__sidebar .catalog-filter__input { min-height: 44px; padding: 9px 12px; }
.catalog__sidebar .ds-select__trigger { min-height: 44px; padding-top: 9px; padding-bottom: 9px; }
.catalog-range { position: relative; height: 28px; margin: 0 10px; cursor: pointer; }
.catalog-range[hidden] { display: none; }
.catalog-range__track { position: absolute; top: 12px; width: 100%; height: 4px; overflow: visible; }
.catalog-range__track line { stroke: var(--color-border); stroke-width: 4; stroke-linecap: round; }
.catalog-range__track .catalog-range__selection { stroke: var(--color-primary); }
.catalog-range__handle { appearance: none; -webkit-appearance: none; position: absolute; inset: 0; left: -10px; width: calc(100% + 20px); height: 28px; margin: 0; padding: 0; background: transparent; pointer-events: none; }
.catalog-range__handle--from { z-index: 2; }
.catalog-range__handle--to { z-index: 3; }
.catalog-range__handle:focus { z-index: 4; outline: none; }
.catalog-range__handle::-webkit-slider-runnable-track { height: 4px; background: transparent; }
.catalog-range__handle::-moz-range-track { height: 4px; background: transparent; }
.catalog-range__handle::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 20px; height: 20px; margin-top: -8px; border: 2px solid var(--color-primary); border-radius: 50%; background: var(--color-bg-base); box-shadow: var(--shadow-xs); pointer-events: auto; cursor: grab; }
.catalog-range__handle::-moz-range-thumb { width: 16px; height: 16px; border: 2px solid var(--color-primary); border-radius: 50%; background: var(--color-bg-base); box-shadow: var(--shadow-xs); pointer-events: auto; cursor: grab; }
.catalog-range__handle:focus-visible::-webkit-slider-thumb { outline: 3px solid var(--color-primary-soft); outline-offset: 2px; }
.catalog-range__handle:focus-visible::-moz-range-thumb { outline: 3px solid var(--color-primary-soft); outline-offset: 2px; }
.catalog-range__handle:active::-webkit-slider-thumb { cursor: grabbing; }
.catalog-range__handle:active::-moz-range-thumb { cursor: grabbing; }

/* Exact numeric entry: compact desktop fields without native spin buttons. */
.catalog__sidebar .catalog-filter__input[type="number"] { appearance: textfield; -moz-appearance: textfield; min-height: 40px; padding: 9px 10px; font-size: 14px; line-height: 20px; }
.catalog__sidebar .catalog-filter__input[type="number"]::-webkit-inner-spin-button,
.catalog__sidebar .catalog-filter__input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; appearance: none; margin: 0; }
@media (max-width: 767px) {
  .catalog__sidebar .catalog-filter__input[type="number"] { min-height: 44px; }
}

/* Native HostCMS product variants: links beside specifications and estimate CTA. */
.product-page .catalog-card__specs:has(+ .product-variants) { margin-bottom: 0; padding-bottom: 12px; }
.product-variants { margin: 0 0 8px; padding: 0; border: 0; }
.product-variants__title { margin: 0 0 12px; color: var(--color-text-main); font-family: var(--font-family-heading); font-size: 1rem; line-height: 1.4; }
.product-variants__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.product-variant { display: flex; flex-direction: column; justify-content: center; gap: 4px; min-width: 0; padding: 12px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); background: var(--color-bg-base); color: var(--color-text-main); text-decoration: none; transition: border-color .15s ease, background-color .15s ease; }
.product-variant:hover { border-color: var(--color-primary); background: var(--color-primary-soft); color: var(--color-text-main); text-decoration: none; }
.product-variant:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 3px; }
.product-variant--current { border-color: var(--color-primary); background: var(--color-primary-soft); }
.product-variant__name { font-family: var(--font-family-base); font-size: var(--font-size-md); font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
.product-variant__hint { font-family: var(--font-family-base); color: var(--color-text-muted); font-size: .75rem; line-height: 1.4; }
.product-variant--current .product-variant__hint { font-family: var(--font-family-base); color: var(--color-primary); font-weight: 600; }
.product-description { max-width: 960px; margin-inline: auto; }
.product-description .info-panel__text { margin-bottom: 0; }
@media (max-width: 359px) { .product-variants__list { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .product-variant { transition: none; } }

/* Native modal image viewer for existing HostCMS gallery links. */
html.has-image-gallery { overflow: hidden; }
.image-gallery { width: min(1100px, calc(100% - 24px)); max-width: calc(100% - 24px); max-height: calc(100dvh - 24px); margin: auto; padding: 16px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-xl); background: var(--color-bg-base); color: var(--color-text-main); box-sizing: border-box; }
.image-gallery::backdrop { background: rgb(10 28 23 / .82); }
.image-gallery__toolbar, .image-gallery__controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.image-gallery__counter { font-size: .875rem; }
.image-gallery__button { display: inline-flex; justify-content: center; align-items: center; min-width: 44px; min-height: 44px; padding: 8px; border: 1px solid var(--color-border-soft); border-radius: var(--radius-md); background: var(--color-primary-soft); color: var(--color-text-main); font-size: 1.5rem; line-height: 1; cursor: pointer; }
.image-gallery__button:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
.image-gallery__button:disabled { opacity: .4; cursor: default; }
.image-gallery__stage { display: grid; place-items: center; min-height: 180px; margin-block: 12px; }
.image-gallery__image { display: block; max-width: 100%; max-height: calc(100dvh - 190px); width: auto; height: auto; object-fit: contain; }
.image-gallery__status { color: var(--color-text-muted); }
.image-gallery [hidden] { display: none; }
@media (max-width: 480px) { .image-gallery { padding: 12px; } }

/* The hero offer is a stationary panel, rather than an interactive catalog tile. */
.product-page .hero-section .catalog-card,
.product-page .hero-section .catalog-card:hover {
  padding: var(--space-lg);
  border: 1px solid var(--color-border);
  border-radius: 28px;
  box-shadow: var(--shadow-xs);
  transform: none;
  transition: none;
  font-family: var(--font-family-base);
}
.product-page .hero-section .catalog-card__specs { font-family: var(--font-family-base); font-size: var(--font-size-md); }
.product-page .hero-section .catalog-card__price-actual { font-family: var(--font-family-heading); font-size: var(--font-size-xl); line-height: 1.3; }
.product-page .hero-section .catalog-card__actions .btn { font-family: var(--font-family-heading); font-size: var(--font-size-md); }