/* css/tokens.css */
:root {
  --color-white: #ffffff;
  --color-background: #ffffff;
  --color-background-soft: #f6f7fa;
  --color-background-muted: #efefef;
  --color-brand: #cc0000;
  --color-brand-dark: #9b0000;
  --color-text: #384b60;
  --color-text-strong: #243447;
  --color-muted: #68778a;
  --color-info: #3483ca;
  --color-info-dark: #236aa8;
  --color-cta: #29ce90;
  --color-cta-dark: #167a58;
  --color-line: #e4e8ed;
  --color-footer: #384b60;
  --color-overlay: rgb(22 32 44 / 58%);
  --gradient-cta: linear-gradient(135deg, #167a58 0%, #236aa8 100%);
  --gradient-dark: linear-gradient(135deg, #384b60 0%, #26394e 100%);
  --container-max: 1240px;
  --header-height: 80px;
  --topbar-height: 34px;
  --space-page: 32px;
  --space-section: 64px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --radius-button: 14px;
  --radius-card: 16px;
  --radius-input: 12px;
  --radius-pill: 999px;
  --shadow-soft: 0 8px 24px rgb(17 24 39 / 8%);
  --shadow-menu: 0 18px 48px rgb(17 24 39 / 16%);
  --shadow-modal: 0 24px 80px rgb(17 24 39 / 28%);
  --focus-ring: 0 0 0 3px rgb(52 131 202 / 32%);
  --transition-fast: 160ms ease;
  --transition-base: 240ms ease;
  --font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}
/* css/reset.css */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  color-scheme: light;
  scroll-behavior: smooth;
}

body,
h1,
h2,
h3,
p,
ol,
ul {
  margin: 0;
}

ol,
ul {
  padding: 0;
}

img,
svg,
video {
  display: block;
  max-width: 100%;
}

button,
input,
textarea,
select {
  font: inherit;
}

button,
summary {
  -webkit-tap-highlight-color: transparent;
}

[hidden] {
  display: none;
}
/* css/base.css */
body {
  min-width: 320px;
  overflow-x: clip;
  background: var(--color-background);
  color: var(--color-text);
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
}

body.is-scroll-locked {
  overflow: hidden;
}

a {
  color: var(--color-info);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}

a:hover {
  text-decoration-thickness: 2px;
}

button {
  color: inherit;
}

:focus-visible {
  outline: 3px solid var(--color-info);
  outline-offset: 3px;
}

h1,
h2,
h3 {
  color: var(--color-text-strong);
  line-height: 1.18;
  text-wrap: balance;
}

h1 {
  font-size: clamp(2.5rem, 5vw, 3.5rem);
  font-weight: 900;
}

h2 {
  font-size: clamp(1.5rem, 2.7vw, 2rem);
  font-weight: 800;
}

h3 {
  font-size: 1.125rem;
  font-weight: 800;
}

.eyebrow {
  color: var(--color-cta);
  font-size: 0.8125rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.skip-link {
  position: fixed;
  z-index: 2000;
  top: 8px;
  left: 8px;
  display: flex;
  min-height: 44px;
  align-items: center;
  padding: 10px 14px;
  transform: translateY(-150%);
  border-radius: var(--radius-button);
  background: var(--color-white);
  box-shadow: var(--shadow-soft);
  color: var(--color-text);
}

.skip-link:focus {
  transform: translateY(0);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* css/layout.css */
.container {
  width: min(calc(100% - (2 * var(--space-page))), var(--container-max));
  margin-inline: auto;
}

main {
  min-height: calc(100vh - var(--header-height) - var(--topbar-height));
}

.section-heading {
  display: grid;
  max-width: 760px;
  gap: var(--space-3);
  margin-bottom: var(--space-8);
}

.section-heading > p:not(.eyebrow) {
  color: var(--color-muted);
  font-size: 1.0625rem;
}

.component-row,
.button-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-4);
}

.error-page {
  padding-block: 120px;
}

.error-page h1 {
  margin-block: 8px 16px;
}

.error-page .button {
  margin-top: 24px;
}
/* css/components/topbar.css */
.topbar {
  min-height: var(--topbar-height);
  background: var(--color-text);
  color: var(--color-white);
  font-size: 0.8125rem;
}

.topbar__inner {
  display: flex;
  min-height: var(--topbar-height);
  align-items: center;
  gap: var(--space-6);
}

.topbar__hours {
  color: rgb(255 255 255 / 76%);
}

.topbar__phone {
  margin-left: auto;
  color: var(--color-white);
  font-weight: 800;
  text-decoration: none;
}
/* css/components/header.css */
.site-shell-header {
  position: sticky;
  z-index: 300;
  top: 0;
  border-bottom: 1px solid var(--color-line);
  background: rgb(255 255 255 / 96%);
  box-shadow: 0 4px 18px rgb(17 24 39 / 5%);
  backdrop-filter: blur(12px);
}

.site-shell-header.is-scrolled {
  box-shadow: var(--shadow-soft);
}

.site-header__inner {
  display: flex;
  min-height: var(--header-height);
  align-items: center;
  gap: var(--space-6);
}

.site-logo {
  display: inline-flex;
  flex: 0 0 auto;
  flex-direction: column;
  color: var(--color-text);
  line-height: 1;
  text-decoration: none;
}

.site-logo__text,
.site-logo--footer {
  font-size: 1.25rem;
  font-weight: 900;
}

.site-logo__note {
  margin-top: 5px;
  color: var(--color-muted);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.site-header__actions {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  margin-left: auto;
}

.header-phone {
  color: var(--color-text);
  font-weight: 850;
  text-decoration: none;
  white-space: nowrap;
}

.menu-toggle,
.icon-button {
  display: inline-grid;
  min-width: 44px;
  min-height: 44px;
  place-items: center;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-button);
  background: var(--color-white);
  cursor: pointer;
}

.menu-toggle {
  display: none;
  grid-auto-flow: column;
  gap: var(--space-2);
  padding-inline: var(--space-4);
  font-weight: 800;
}

.menu-toggle__icon,
.menu-toggle__icon::before,
.menu-toggle__icon::after {
  width: 20px;
  height: 2px;
  border-radius: var(--radius-pill);
  background: currentColor;
}

.menu-toggle__icon {
  position: relative;
}

.menu-toggle__icon::before,
.menu-toggle__icon::after {
  position: absolute;
  left: 0;
  content: "";
}

.menu-toggle__icon::before { top: -6px; }
.menu-toggle__icon::after { top: 6px; }

.icon-button--close::before,
.icon-button--close::after {
  position: absolute;
  width: 20px;
  height: 2px;
  border-radius: var(--radius-pill);
  background: currentColor;
  content: "";
}

.icon-button--close::before { transform: rotate(45deg); }
.icon-button--close::after { transform: rotate(-45deg); }

.icon-button--close {
  position: relative;
}
/* css/components/navigation.css */
.desktop-nav {
  display: flex;
  align-items: center;
  gap: clamp(14px, 1.6vw, 24px);
  margin-left: auto;
}

.desktop-nav > a,
.desktop-nav__item > button {
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--color-text);
  font-size: 0.9375rem;
  font-weight: 750;
  line-height: 44px;
  text-decoration: none;
  white-space: nowrap;
}

.desktop-nav > a:hover,
.desktop-nav > a[aria-current="page"],
.desktop-nav__item > button:hover,
.desktop-nav__item > button[aria-expanded="true"] {
  color: var(--color-brand);
}

.desktop-nav__item {
  position: relative;
}

.desktop-nav__item > button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
}

.desktop-nav__item > button::after {
  width: 7px;
  height: 7px;
  transform: translateY(-2px) rotate(45deg);
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  content: "";
  transition: transform var(--transition-fast);
}

.desktop-nav__item > button[aria-expanded="true"]::after {
  transform: translateY(2px) rotate(225deg);
}

.dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: -20px;
  display: grid;
  width: max-content;
  min-width: 230px;
  padding: 10px;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  background: var(--color-white);
  box-shadow: var(--shadow-menu);
}

.dropdown-menu[hidden] {
  display: none;
}

.dropdown-menu a,
.dropdown-menu .nav-label {
  display: flex;
  min-height: 44px;
  align-items: center;
  padding: 10px 12px;
  border-radius: 10px;
  color: var(--color-text);
  font-weight: 700;
  text-decoration: none;
}

.dropdown-menu .nav-label[aria-disabled="true"] { color: var(--color-muted); cursor: default; }

.dropdown-menu a:hover,
.dropdown-menu a:focus-visible {
  background: var(--color-background-soft);
  color: var(--color-brand);
}

.mobile-menu-nojs {
  display: none;
}
/* css/components/mobile-menu.css */
.mobile-menu__backdrop {
  position: fixed;
  z-index: 600;
  inset: 0;
  background: var(--color-overlay);
}

.mobile-menu {
  position: fixed;
  z-index: 610;
  top: 0;
  right: 0;
  width: min(92vw, 430px);
  height: 100dvh;
  overflow-y: auto;
  padding: var(--space-6);
  padding-bottom: calc(var(--space-6) + env(safe-area-inset-bottom, 0px));
  background: var(--color-white);
  box-shadow: var(--shadow-menu);
}

.mobile-menu[hidden],
.mobile-menu__backdrop[hidden] {
  display: none;
}

.mobile-menu__top,
.mobile-menu__quick-actions,
.mobile-menu__meta {
  display: flex;
  align-items: center;
  gap: var(--space-3);
}

.mobile-menu__top {
  justify-content: space-between;
  margin-bottom: var(--space-6);
}

.mobile-menu__title {
  color: var(--color-text-strong);
  font-size: 1.25rem;
  font-weight: 800;
}

.mobile-menu__quick-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-bottom: var(--space-6);
}

.mobile-nav {
  display: grid;
  border-top: 1px solid var(--color-line);
}

.mobile-nav > a,
.mobile-nav > .nav-label,
.mobile-nav summary,
.mobile-nav details a,
.mobile-nav details .nav-label {
  display: flex;
  min-height: 50px;
  align-items: center;
  padding: 12px 4px;
  color: var(--color-text);
  font-weight: 750;
  text-decoration: none;
}

.mobile-nav > a,
.mobile-nav > .nav-label,
.mobile-nav details {
  border-bottom: 1px solid var(--color-line);
}

.mobile-nav summary {
  cursor: pointer;
  list-style: none;
}

.mobile-nav summary::-webkit-details-marker { display: none; }

.mobile-nav summary::after {
  width: 8px;
  height: 8px;
  margin-left: auto;
  transform: rotate(45deg);
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  content: "";
}

.mobile-nav details[open] summary::after { transform: rotate(225deg); }

.mobile-nav details a,
.mobile-nav details .nav-label {
  min-height: 44px;
  padding-left: 20px;
  color: var(--color-muted);
  font-weight: 650;
}

.mobile-nav .nav-label[aria-disabled="true"] { cursor: default; opacity: .68; }

.mobile-menu__meta {
  display: grid;
  margin-top: var(--space-8);
  padding: var(--space-5);
  border-radius: var(--radius-card);
  background: var(--color-background-soft);
}

.mobile-menu__meta a {
  color: var(--color-text);
  font-weight: 850;
  text-decoration: none;
}

.mobile-menu__meta span {
  color: var(--color-muted);
  font-size: 0.875rem;
}
/* css/components/breadcrumbs.css */
.breadcrumbs {
  padding-block: 24px 8px;
  font-size: 0.875rem;
}

.breadcrumbs ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  list-style: none;
}

.breadcrumbs li + li::before {
  margin-right: 8px;
  color: var(--color-muted);
  content: "/";
}

.breadcrumbs a {
  color: var(--color-muted);
}

.breadcrumbs [aria-current="page"] {
  color: var(--color-text);
  font-weight: 700;
}
/* css/components/buttons.css */
.button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  border: 1px solid transparent;
  border-radius: var(--radius-button);
  background: var(--gradient-cta);
  box-shadow: var(--shadow-soft);
  color: var(--color-white);
  font-weight: 850;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: transform var(--transition-fast), box-shadow var(--transition-fast), filter var(--transition-fast);
}

.button:hover,
.button.is-hover-demo {
  transform: translateY(-1px);
  box-shadow: 0 12px 30px rgb(17 24 39 / 14%);
  filter: saturate(1.08);
}

.button:active {
  transform: translateY(1px);
}

.button.is-focus-demo {
  box-shadow: var(--focus-ring), var(--shadow-soft);
}

.button--primary { background: var(--gradient-cta); }

.button--secondary {
  border-color: var(--color-line);
  background: var(--color-white);
  box-shadow: none;
  color: var(--color-text);
}

.button--on-dark {
  border-color: rgb(255 255 255 / 46%);
  background: rgb(255 255 255 / 10%);
  color: var(--color-white);
}

.button--light {
  background: var(--color-white);
  color: var(--color-info-dark);
}

.button--small {
  min-height: 44px;
  padding: 9px 18px;
  font-size: 0.875rem;
}

.button:disabled {
  transform: none;
  background: #d5dae1;
  box-shadow: none;
  color: #657181;
  cursor: not-allowed;
  filter: none;
}
/* css/components/cards.css */
.card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-6);
}

.card {
  display: flex;
  min-width: 0;
  min-height: 250px;
  flex-direction: column;
  gap: var(--space-4);
  padding: var(--space-6);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  background: var(--color-white);
  box-shadow: var(--shadow-soft);
  overflow-wrap: anywhere;
}

.card p { color: var(--color-muted); }
.card a,
.card .button { margin-top: auto; align-self: flex-start; }

.card__marker {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 12px;
  background: var(--color-background-soft);
  color: var(--color-info);
  font-weight: 900;
}

.card--accent { border-top: 4px solid var(--color-cta); }

.card--dark {
  border-color: transparent;
  background: var(--gradient-dark);
  color: var(--color-white);
}

.card--dark h3,
.card--dark a { color: var(--color-white); }
.card--dark p { color: rgb(255 255 255 / 76%); }

.form-card {
  display: grid;
  max-width: 640px;
  gap: var(--space-5);
  padding: var(--space-6);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  background: var(--color-white);
  box-shadow: var(--shadow-soft);
}

.form-card label {
  display: grid;
  gap: var(--space-2);
  color: var(--color-text-strong);
  font-weight: 750;
}

.form-card input {
  min-height: 50px;
  width: 100%;
  padding: 11px 14px;
  border: 1px solid #cfd6df;
  border-radius: var(--radius-input);
  background: var(--color-white);
  color: var(--color-text);
}

.form-card input:focus {
  border-color: var(--color-info);
  box-shadow: var(--focus-ring);
  outline: 0;
}

.field-error {
  color: var(--color-brand);
  font-size: 0.875rem;
  font-weight: 700;
}
/* css/components/service-articles.css */
.service-articles { padding: 0 0 105px; }
.service-articles h1,
.service-articles h2 { margin: 0 0 10px; color: #384b60; font-size: 25px; font-weight: 900; line-height: 1.18; }
.service-articles__lead { max-width: 60ch; margin: 0 0 13px; color: #6f7986; font-size: 16px; line-height: 1.5; }
.service-articles__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.service-articles__item { min-width: 0; }
.js .service-articles[data-initial-visible="4"]:not([data-service-articles-ready]) .service-articles__item:nth-child(n + 5) { display: none; }
.service-articles__item[hidden] { display: none; }
.service-article-card { position: relative; min-height: 220px; overflow: hidden; border-radius: 16px; background: #718294; color: #fff; }
.service-article-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.service-article-card__overlay { position: absolute; inset: 0; background: rgb(56 75 96 / 62%); }
.service-article-card__content { position: relative; z-index: 1; display: flex; min-height: 220px; flex-direction: column; align-items: flex-start; padding: 17px 15px 16px; }
.service-articles .service-article-card h2,
.service-articles .service-article-card h3 { margin: 0; color: #fff; font-size: 18px; font-weight: 900; line-height: 1.06; }
.service-article-card p { margin: 1px 0 0; color: #fff; font-size: 14px; line-height: 1.35; }
.service-article-card__link { display: inline-flex; min-width: 94px; min-height: 52px; align-items: center; justify-content: center; margin-top: auto; border: 2px solid rgb(255 255 255 / 75%); border-radius: 14px; color: #fff; font-size: 16px; font-weight: 800; text-decoration: none; }
.service-article-card__link:hover { background: rgb(255 255 255 / 15%); }
.service-article-card__link:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }
.service-articles__more { width: 100%; min-height: 53px; margin-top: 16px; border: 2px solid #e5e5e5; border-radius: 15px; background: #fff; color: #384b60; font: inherit; font-weight: 800; }
.service-articles__more:hover { border-color: #b7c2cd; background: #f8fafb; }
.service-articles__more:focus-visible { outline: 3px solid #3483ca; outline-offset: 3px; }
.service-articles__more[hidden] { display: none; }

@media (max-width: 900px) {
  .service-articles__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .service-articles { padding-bottom: 55px; }
  .service-articles h1,
  .service-articles h2 { margin-bottom: 9px; font-size: 24px; line-height: 1.16; }
  .service-articles__lead { margin-bottom: 14px; font-size: 14px; line-height: 1.5; }
  .service-articles__grid { grid-template-columns: 1fr; gap: 10px; }
  .service-article-card,
  .service-article-card__content { min-height: 220px; }
  .service-article-card__content { padding: 16px 14px 15px; }
  .service-articles__more { min-height: 50px; margin-top: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .service-articles__more { scroll-behavior: auto; transition: none; }
}
/* css/components/cta.css */
.cta {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--space-8);
  margin-block: var(--space-section);
  padding: clamp(28px, 5vw, 52px);
  border-radius: var(--radius-card);
  background: var(--gradient-cta);
  box-shadow: var(--shadow-menu);
  color: var(--color-white);
}

.cta > div {
  display: grid;
  gap: var(--space-3);
}

.cta h2,
.cta .eyebrow { color: var(--color-white); }
.cta p:not(.eyebrow) { color: rgb(255 255 255 / 82%); }
/* css/components/faq.css */
.faq {
  border-top: 1px solid var(--color-line);
}

.faq__item {
  border-bottom: 1px solid var(--color-line);
}

.faq__item h3 { font-size: 1rem; }

.faq__item button {
  display: grid;
  width: 100%;
  min-height: 60px;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: var(--space-5);
  padding: 16px 4px;
  border: 0;
  background: transparent;
  color: var(--color-text-strong);
  font-weight: 800;
  text-align: left;
  cursor: pointer;
}

.faq__item button::after {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 50%;
  background: var(--color-white);
  color: var(--color-cta-dark);
  content: "+";
  font-size: 1.35rem;
  box-shadow: 0 2px 8px rgb(17 24 39 / 8%);
}

.faq__item button[aria-expanded="true"]::after { content: "−"; }

.faq__answer {
  max-width: 820px;
  padding: 0 48px 20px 4px;
  color: var(--color-muted);
}

.faq__answer[hidden] {
  display: none;
}
/* css/components/modal.css */
.modal,
.gallery-lightbox {
  width: min(calc(100% - 32px), 620px);
  max-height: calc(100dvh - 32px - env(safe-area-inset-bottom, 0px));
  padding: 0;
  overflow: auto;
  border: 0;
  border-radius: var(--radius-card);
  background: transparent;
  box-shadow: var(--shadow-modal);
}

.modal::backdrop,
.gallery-lightbox::backdrop {
  background: var(--color-overlay);
  backdrop-filter: blur(3px);
}

.modal__panel,
.gallery-lightbox__panel {
  position: relative;
  display: grid;
  gap: var(--space-5);
  padding: clamp(24px, 5vw, 44px);
  padding-bottom: calc(clamp(24px, 5vw, 44px) + env(safe-area-inset-bottom, 0px));
  background: var(--color-white);
}

.modal__close,
.gallery-lightbox__close {
  position: absolute;
  z-index: 1;
  top: 12px;
  right: 12px;
}

.modal__panel > p:not(.eyebrow) { color: var(--color-muted); }
.modal__panel .button { justify-self: start; }
/* css/components/quiz.css */
.quiz-modal {
  width: min(calc(100% - 32px), 500px);
}

.quiz-modal__panel {
  display: block;
  min-height: 320px;
  padding: 20px 24px 24px;
}

.quiz-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  margin-bottom: 18px;
  padding-right: 48px;
}

.quiz-modal__header h2 {
  margin: 0;
  font-size: 24px;
  font-weight: 900;
  line-height: 1.2;
}

.quiz__progress {
  width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: var(--radius-pill);
  background: #e5e7eb;
}

.quiz__progress-bar {
  width: 0;
  height: 100%;
  border-radius: var(--radius-pill);
  background: var(--gradient-cta);
  transition: width 400ms cubic-bezier(0.4, 0, 0.2, 1);
}

[data-quiz-step-index="1"] .quiz__progress-bar { width: 12.5%; }
[data-quiz-step-index="2"] .quiz__progress-bar { width: 25%; }
[data-quiz-step-index="3"] .quiz__progress-bar { width: 37.5%; }
[data-quiz-step-index="4"] .quiz__progress-bar { width: 50%; }
[data-quiz-step-index="5"] .quiz__progress-bar { width: 62.5%; }
[data-quiz-step-index="6"] .quiz__progress-bar { width: 75%; }
[data-quiz-step-index="7"] .quiz__progress-bar { width: 87.5%; }
.quiz__progress-bar--complete { width: 100%; }

.quiz__progress-text {
  margin: 2px 0 0;
  color: var(--color-muted);
  font-size: 12px;
  text-align: center;
}

.quiz__step:not([hidden]) {
  animation: quiz-fade-in 500ms ease;
}

.quiz__heading,
.quiz__thanks-heading {
  margin: 0;
  color: var(--color-text-strong);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
}

.quiz__heading:focus,
.quiz__thanks-heading:focus {
  outline: 0;
}

.quiz__heading--range {
  margin-top: 10px;
  margin-bottom: 10px;
}

.quiz__heading--second-range {
  margin-top: 50px;
  margin-bottom: 10px;
}

.quiz__description {
  margin: 0 0 16px;
  color: var(--color-muted);
  font-size: 14px;
  line-height: 1.2;
}

.quiz__options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.quiz__option {
  display: flex;
  min-height: 44px;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  border: 2px solid var(--color-line);
  border-radius: var(--radius-card);
  background: var(--color-background);
  cursor: pointer;
  transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), background var(--transition-base);
}

.quiz__option:hover {
  transform: translateY(-4px);
  border-color: var(--color-cta);
  box-shadow: var(--shadow-soft);
}

.quiz__option[aria-pressed="true"] {
  transform: translateY(-2px);
  border-color: var(--color-cta);
  background: #effbf6;
  box-shadow: 0 0 0 4px rgb(41 206 144 / 12%);
}

.quiz__option-image {
  width: 100%;
  aspect-ratio: 4 / 3;
  margin-top: 5px;
  border-radius: 8px;
  object-fit: cover;
  transition: transform 300ms ease;
}

.quiz__option:hover .quiz__option-image {
  transform: scale(1.05);
}

.quiz__option-title {
  display: flex;
  min-height: 46px;
  flex: 1;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  color: var(--color-text-strong);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  text-align: center;
}

.quiz__navigation {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 24px;
}

.quiz__range {
  padding: 0 16px 32px;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  background: var(--color-background-soft);
  transition: box-shadow var(--transition-base);
}

.quiz__range:hover {
  box-shadow: var(--shadow-soft);
}

.quiz__range-value {
  display: block;
  margin: 8px 0;
  color: var(--color-cta-dark);
  font-size: 24px;
  font-weight: 900;
  text-align: center;
}

.quiz__range input[type="range"] {
  width: 100%;
  min-height: 44px;
  border-radius: 5px;
  outline: 0;
  appearance: none;
  background: linear-gradient(#dde2ea, #dde2ea) center / 100% 10px no-repeat;
}

.quiz__range input[type="range"]:focus-visible {
  outline: 3px solid var(--color-info);
  outline-offset: 3px;
}

.quiz__range input[type="range"]::-webkit-slider-thumb {
  width: 24px;
  height: 24px;
  appearance: none;
  border: 4px solid var(--color-white);
  border-radius: 50%;
  background: var(--gradient-cta);
  box-shadow: 0 4px 12px rgb(0 0 0 / 20%);
  cursor: pointer;
}

.quiz__range input[type="range"]::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border: 4px solid var(--color-white);
  border-radius: 50%;
  background: var(--color-cta-dark);
  box-shadow: 0 4px 12px rgb(0 0 0 / 20%);
  cursor: pointer;
}

.quiz__field-label {
  display: block;
  margin: 0 0 6px;
  color: var(--color-text-strong);
  font-weight: 700;
}

.quiz__messengers {
  display: flex;
  gap: 30px;
  justify-content: center;
  margin: 10px 0 16px;
}

.quiz__messenger {
  display: flex;
  width: 56px;
  height: 56px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 2px solid var(--color-line);
  border-radius: 14px;
  background: var(--color-background);
  cursor: pointer;
  transition: transform var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), background var(--transition-base);
}

.quiz__messenger:hover {
  transform: translateY(-2px);
  border-color: var(--color-cta);
  box-shadow: var(--shadow-soft);
}

.quiz__messenger[aria-pressed="true"] {
  transform: translateY(-1px);
  border-color: var(--color-cta);
  background: #effbf6;
  box-shadow: 0 0 0 4px rgb(41 206 144 / 12%);
}

.quiz__messenger img {
  width: 42px;
  height: 42px;
}

.quiz__gift-picked {
  margin-bottom: 24px;
  background: linear-gradient(90deg, var(--color-cta-dark), var(--color-info));
  background-clip: text;
  color: transparent;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.15;
  text-align: center;
}

.quiz__field {
  position: relative;
  margin-top: 10px;
}

.quiz__input {
  width: 100%;
  min-height: 48px;
  padding: 11px 14px;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-input);
  background: var(--color-white);
  color: var(--color-text);
}

.quiz__input:focus {
  border-color: var(--color-cta);
  outline: 0;
  box-shadow: 0 0 0 4px rgb(41 206 144 / 15%);
}

.quiz__input[aria-invalid="true"] {
  border-color: rgb(204 0 0 / 55%);
  background: #fff7f7;
  box-shadow: 0 0 0 4px rgb(204 0 0 / 10%);
}

.quiz__field-error,
.quiz__submit-error {
  margin-top: 6px;
  color: var(--color-brand);
  font-size: 12px;
}

.quiz__timer {
  margin-top: 16px;
  padding: 8px 16px;
  border: 1px solid var(--color-line);
  border-radius: 12px;
  background: var(--color-background-soft);
  color: var(--color-muted);
  font-size: 14px;
}

.quiz__timer strong {
  color: var(--color-cta-dark);
}

.quiz__privacy {
  margin-top: 14px;
  color: var(--color-muted);
  font-size: 12px;
  line-height: 1.4;
}

.quiz__consent {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 14px;
  font-size: 13px;
  line-height: 1.45;
}

.quiz__consent { min-height: 44px; }
.quiz__consent input { width: 22px; height: 22px; flex: 0 0 auto; margin-top: 1px; }

.quiz__thanks-heading {
  margin-top: 18px;
  margin-bottom: 16px;
}

.quiz__thanks-text {
  color: var(--color-muted);
}

@keyframes quiz-fade-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 479px) {
  .quiz-modal {
    width: min(calc(100% - 16px), 500px);
    max-height: calc(100dvh - 16px - env(safe-area-inset-bottom, 0px));
  }

  .quiz-modal__panel {
    padding: 16px;
  }

  .quiz-modal__header {
    margin-bottom: 12px;
  }

  .quiz-modal__header h2 {
    font-size: 21px;
  }

  .quiz__heading,
  .quiz__thanks-heading {
    font-size: 18px;
  }

  .quiz__option-title {
    padding-inline: 6px;
    font-size: 14px;
  }

  .quiz__navigation .button {
    min-width: 118px;
    padding-inline: 18px;
  }
}

@media (max-height: 520px) and (orientation: landscape) {
  .quiz-modal {
    max-height: calc(100dvh - 8px);
  }

  .quiz-modal__panel {
    padding-block: 12px;
  }

  .quiz__option-image {
    max-height: 96px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .quiz__step:not([hidden]),
  .quiz__progress-bar,
  .quiz__option,
  .quiz__option-image,
  .quiz__messenger {
    animation: none;
    transition: none;
  }
}
/* css/components/gallery.css */
.gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}

.gallery__item {
  position: relative;
  min-width: 0;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-card);
  box-shadow: var(--shadow-soft);
  cursor: zoom-in;
}

.gallery__item--blue { background: linear-gradient(145deg, #78b9ed, #2a6da7); }
.gallery__item--green { background: linear-gradient(145deg, #78e0ba, #1c8b65); }
.gallery__item--slate { background: linear-gradient(145deg, #758ba3, #384b60); }

.gallery__item span {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 24px 16px 14px;
  background: linear-gradient(transparent, rgb(17 24 39 / 72%));
  color: var(--color-white);
  font-weight: 800;
  text-align: left;
}

.gallery-lightbox { width: min(calc(100% - 32px), 900px); }

.gallery-lightbox__visual {
  aspect-ratio: 16 / 9;
  border-radius: var(--radius-card);
  background: linear-gradient(145deg, #78b9ed, #2a6da7);
}

.gallery-lightbox__visual[data-tone="1"] { background: linear-gradient(145deg, #78e0ba, #1c8b65); }
.gallery-lightbox__visual[data-tone="2"] { background: linear-gradient(145deg, #758ba3, #384b60); }

.gallery-lightbox__controls {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
}
/* css/components/cookie-banner.css */
.cookie-banner {
  position: fixed;
  z-index: 550;
  right: 20px;
  bottom: calc(20px + env(safe-area-inset-bottom, 0px));
  width: min(calc(100% - 40px), 480px);
  padding: var(--space-5);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-card);
  background: var(--color-white);
  box-shadow: var(--shadow-menu);
}

.cookie-banner__content {
  display: grid;
  gap: var(--space-4);
}

.cookie-banner__content p {
  color: var(--color-text);
  font-size: 0.9rem;
}

.cookie-banner__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-4);
}

.cookie-banner__actions a,
.cookie-banner__actions span { font-size: 0.875rem; }
.cookie-banner a:focus-visible { border-radius: 4px; }
.cookie-banner__actions span[aria-disabled="true"] { color: var(--color-muted); }

.floating-actions {
  position: fixed;
  z-index: 400;
  right: 20px;
  bottom: calc(180px + env(safe-area-inset-bottom, 0px));
  display: grid;
  gap: var(--space-3);
}

.floating-action {
  position: relative;
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border-radius: 50%;
  background: var(--color-white);
  box-shadow: var(--shadow-menu);
}

.floating-action--phone { background: var(--color-cta); }

.floating-action--phone::before {
  width: 15px;
  height: 22px;
  transform: rotate(-35deg);
  border: 3px solid var(--color-white);
  border-top-color: transparent;
  border-bottom-color: transparent;
  border-radius: 50%;
  content: "";
}

.floating-action--top::before {
  width: 12px;
  height: 12px;
  transform: translateY(3px) rotate(225deg);
  border-right: 3px solid var(--color-text);
  border-bottom: 3px solid var(--color-text);
  content: "";
}

body.is-scroll-locked .floating-actions,
body.is-scroll-locked .cookie-banner {
  visibility: hidden;
}
/* css/components/footer.css */
.site-footer {
  padding-block: 56px 24px;
  background: var(--color-footer);
  color: rgb(255 255 255 / 76%);
}

.site-footer__grid {
  display: grid;
  grid-template-columns: 1.4fr repeat(3, 1fr);
  gap: clamp(28px, 5vw, 64px);
}

.site-footer__brand,
.site-footer__nav,
.site-footer__contacts,
.site-footer__legal {
  display: grid;
  align-content: start;
  gap: var(--space-3);
}

.site-footer h2 {
  color: var(--color-white);
  font-size: 0.875rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.site-footer a,
.site-footer .nav-label { color: var(--color-white); }
.site-footer .nav-label[aria-disabled="true"] { opacity: .68; }
.site-logo--footer { font-size: 1.35rem; text-decoration: none; }

.site-footer__bottom {
  display: flex;
  justify-content: space-between;
  gap: var(--space-4);
  margin-top: 48px;
  padding-top: 20px;
  border-top: 1px solid rgb(255 255 255 / 14%);
  font-size: 0.75rem;
}
/* css/pages/home.css */
.page-home {
  --home-blue: #3494d1;
  --home-slate: #384b60;
  --home-muted: #737e8d;
  --home-panel: #f5f7fb;
  --home-footer: #838f9e;
  --home-green: #29ce90;
  --home-cyan: #1caee5;
  --home-radius: 18px;
  background: #fff;
  color: var(--home-slate);
  font-size: 16px;
}

.page-home main { padding-top: 80px; }
.page-home h1,
.page-home h2,
.page-home h3,
.page-home h4 { color: var(--home-slate); }

.page-home .container { width: min(calc(100% - 64px), 1240px); }
.home-section { padding-block: 72px; }
.home-heading { display: grid; gap: 8px; margin-bottom: 26px; }
.home-heading h1,
.home-heading h2 { font-size: 28px; font-weight: 900; }
.home-heading p { max-width: 760px; color: var(--home-muted); line-height: 1.48; }
.home-heading p + p { margin-top: -3px; }
.page-home .button { min-height: 52px; border-radius: 13px; font-size: 15px; }
.page-home .button--primary { background: linear-gradient(100deg, var(--home-green), var(--home-cyan)); }
.page-home .button--outline-light { border-color: rgb(255 255 255 / 58%); background: rgb(255 255 255 / 9%); box-shadow: none; color: #fff; }

/* Header and drawer */
.home-header {
  position: fixed;
  z-index: 500;
  inset: 0 0 auto;
  height: 80px;
  border-bottom: 1px solid #edf0f3;
  background: rgb(255 255 255 / 97%);
  box-shadow: 0 3px 14px rgb(36 52 71 / 5%);
}
.home-header__inner { display: flex; height: 80px; align-items: center; justify-content: space-between; }
.home-logo { display: flex; min-height: 44px; flex: 0 0 auto; width: 210px; align-items: center; text-decoration: none; }
.home-logo img { display: block; width: 100%; height: auto; }
.home-header__actions { display: flex; align-items: center; gap: 34px; }
.home-header__phone { display: inline-flex; min-height: 44px; align-items: center; gap: 10px; color: var(--home-slate); font-size: 18px; font-weight: 900; text-decoration: none; }
.home-header__phone-icon { position: relative; width: 16px; height: 22px; transform: rotate(-32deg); border: 4px solid currentColor; border-top-color: transparent; border-bottom-color: transparent; border-radius: 50%; }
.home-menu-toggle { display: inline-flex; min-height: 44px; align-items: center; gap: 10px; border: 0; background: transparent; color: var(--home-slate); font-weight: 700; cursor: pointer; }
.home-menu-toggle__icon,
.home-menu-toggle__icon::before,
.home-menu-toggle__icon::after { width: 20px; height: 2px; border-radius: 2px; background: currentColor; }
.home-menu-toggle__icon { position: relative; }
.home-menu-toggle__icon::before,
.home-menu-toggle__icon::after { position: absolute; left: 0; content: ""; }
.home-menu-toggle__icon::before { top: -6px; }
.home-menu-toggle__icon::after { top: 6px; }
.home-drawer { width: min(94vw, 520px); padding: 26px 30px 44px; }
.home-drawer__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.home-drawer__top p { color: var(--home-slate); font-size: 24px; font-weight: 900; }
.home-drawer__quick { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.home-drawer__search { display: grid; gap: 7px; margin-block: 22px; }
.home-drawer__search label { font-size: 13px; font-weight: 850; }
.home-drawer__search input { min-height: 48px; padding: 11px 14px; border: 1px solid #dce2e8; border-radius: 12px; background: #f7f9fb; }
.home-drawer__search-empty { color: #a12b2b; font-size: 13px; }
.home-drawer__nav { display: grid; border-top: 1px solid #e5e9ee; }
.home-drawer__link,
.home-drawer__group > summary { display: flex; min-height: 48px; align-items: center; padding: 10px 2px; border-bottom: 1px solid #e8ebef; color: var(--home-slate); font-weight: 800; text-decoration: none; }
.home-drawer__group > summary { cursor: pointer; list-style: none; }
.home-drawer__group > summary::-webkit-details-marker { display: none; }
.home-drawer__group > summary::after { width: 9px; height: 9px; margin-left: auto; transform: rotate(45deg); border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; content: ""; }
.home-drawer__group[open] > summary::after { transform: rotate(225deg); }
.home-drawer__children { padding-left: 18px; }
.home-drawer__children .home-drawer__link,
.home-drawer__children .home-drawer__group > summary { min-height: 44px; color: #627084; font-size: 14px; font-weight: 700; }
.home-drawer__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; padding: 18px; border-radius: 14px; background: var(--home-panel); }
.home-drawer__meta > div { display: grid; align-content: start; gap: 7px; }
.home-drawer__meta p { font-weight: 900; }
.home-drawer__meta a { color: var(--home-slate); font-size: 14px; font-weight: 700; text-decoration: none; }
.home-menu-nojs { display: none; }

/* Contact strip and hero */
.home-intro { padding-top: 0; }
.home-contact { margin-block: 8px; }
.home-contact > summary { display: none; }
.home-contact__grid { display: grid; grid-template-columns: 1.35fr .82fr .82fr 2.65fr; gap: 10px; }
.home-contact:not([open]) > .home-contact__grid { display: grid; }
.home-contact__cell { display: grid; min-height: 68px; align-content: center; gap: 3px; padding: 10px 14px; border: 1px solid #dfe4e9; border-radius: 14px; box-shadow: 0 2px 7px rgb(36 52 71 / 5%); }
.home-contact__cell > span { color: #687789; font-size: 11px; font-weight: 750; }
.home-contact__cell strong,
.home-contact__cell > a { display: inline-flex; min-height: 44px; align-items: center; color: var(--home-slate); font-size: 13px; font-weight: 850; line-height: 1.25; text-decoration: none; }
.home-contact__cities > div { display: flex; flex-wrap: wrap; gap: 6px; }
.home-contact__cities a { padding: 6px 10px; border: 1px solid #dce2e8; border-radius: 8px; color: var(--home-slate); font-size: 11px; font-weight: 850; text-decoration: none; }
.home-hero { position: relative; min-height: 707px; overflow: hidden; border-radius: 18px; background: #202630; color: #fff; }
.home-hero__image,
.home-hero__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-hero__image { object-fit: cover; }
.home-hero__shade { background: linear-gradient(90deg, rgb(18 25 35 / 92%) 0%, rgb(19 25 34 / 70%) 52%, rgb(19 25 34 / 35%) 100%); }
.home-hero__content { position: relative; z-index: 1; display: grid; width: min(760px, 68%); gap: 19px; padding: 54px 46px 36px; }
.home-hero h1 { max-width: 720px; color: #fff; font-size: 56px; font-weight: 950; line-height: 1.1; text-wrap: pretty; }
.home-hero__subtitle { margin-top: -8px; font-size: 28px; font-weight: 900; }
.home-hero__price { display: grid; gap: 2px; }
.home-hero__price strong { font-size: 16px; }
.home-hero__price span { color: rgb(255 255 255 / 78%); }
.home-hero__promo { display: inline-flex; width: fit-content; min-height: 64px; align-items: center; gap: 12px; padding: 10px 19px 10px 10px; border: 0; border-radius: 999px; background: rgb(91 100 114 / 62%); color: #fff; font-weight: 900; cursor: pointer; }
.home-hero__promo > span { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; background: rgb(255 255 255 / 13%); font-size: 25px; }
.home-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.home-hero__actions .button { min-width: 210px; }
.home-hero__guarantee { display: grid; max-width: 610px; gap: 2px; line-height: 1.42; }
.home-hero__guarantee strong { font-weight: 900; }
.home-hero__guarantee span { color: rgb(255 255 255 / 84%); }
.home-hero__features { display: grid; grid-template-columns: repeat(4, max-content); gap: 18px; margin-top: 4px; }
.home-hero__features li { display: flex; min-height: 44px; align-items: center; gap: 9px; padding: 7px 12px; border-radius: 10px; background: rgb(123 132 145 / 48%); font-size: 14px; font-weight: 760; white-space: nowrap; }
.home-hero__feature-icon { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 6px; background: #fff; }
.home-hero__feature-icon::after { width: 10px; height: 6px; transform: translateY(-1px) rotate(-45deg); border-bottom: 2px solid var(--home-green); border-left: 2px solid var(--home-green); content: ""; }

/* Trust */
.home-trust { padding-block: 94px 80px; }
.home-trust__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.home-trust__card { position: relative; min-height: 200px; overflow: hidden; border-radius: 14px; background: #718096; color: #fff; }
.home-trust__card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.home-trust__card::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgb(27 38 52 / 73%), rgb(27 38 52 / 28%)); content: ""; }
.home-trust__card--blue { background: #3493d1; }
.home-trust__card--blue::after,
.home-trust__card--slate::after,
.home-trust__card--dark::after { display: none; }
.home-trust__card--slate { background: #838e9e; }
.home-trust__card--dark { background: #3e5369; }
.home-trust__card > div { position: absolute; z-index: 1; right: 20px; bottom: 20px; left: 20px; }
.home-trust__card h3 { color: #fff; font-size: 27px; font-weight: 950; }
.home-trust__card p { margin-top: 4px; color: rgb(255 255 255 / 90%); font-size: 16px; line-height: 1.42; }

/* Estimate cards */
.home-estimates { padding-block: 64px 84px; }
.home-estimates__panel { padding: 52px 46px 64px; border-radius: 18px; background: var(--home-panel); }
.home-estimates__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.home-estimate-card { display: grid; gap: 9px; padding: 18px; border: 1px solid #e6e9ee; border-radius: 18px; background: #fff; box-shadow: 0 10px 24px rgb(36 52 71 / 8%); }
.home-estimate-card > img { width: 100%; aspect-ratio: 513 / 320; border-radius: 13px; object-fit: cover; }
.home-estimate-card h3 { font-size: 18px; font-weight: 900; }
.home-estimate-card__meta { min-height: 72px; color: #667386; font-size: 14px; line-height: 1.4; }
.home-estimate-card__price { width: fit-content; padding: 6px 10px; border: 2px solid #bdeee3; border-radius: 9px; color: var(--home-slate); font-size: 24px; font-weight: 950; }
.home-estimate-card small { color: #7d8794; font-size: 10px; }
.home-estimate-card__details { display: grid; gap: 9px; padding: 13px; border-radius: 10px; background: #f7f9fb; font-size: 12px; }
.home-estimate-card__details[hidden] { display: none; }
.home-estimate-card__details h4 { font-size: 13px; }
.home-estimate-card__details ul { display: grid; gap: 5px; }
.home-estimate-card__details li { display: flex; justify-content: space-between; gap: 8px; }
.home-estimate-card__details p { color: #697688; }

/* Solutions */
.home-solutions { padding-block: 98px 78px; }
.home-filter { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.home-filter button,
.home-review-list__top button { min-height: 44px; padding: 8px 17px; border: 1px solid #dbe1e7; border-radius: 999px; background: #fff; color: var(--home-slate); font-size: 13px; font-weight: 850; cursor: pointer; }
.home-filter button.is-active,
.home-review-list__top button.is-active { border-color: #7ae1bd; box-shadow: 0 0 0 2px rgb(41 206 144 / 12%); }
.home-solutions__grid { display: grid; grid-auto-flow: dense; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.home-solution-card { position: relative; min-height: 360px; overflow: hidden; border-radius: 14px; background: #3a424c; color: #fff; }
.home-solution-card--large { grid-column: span 2; }
.home-solution-card img,
.home-solution-card__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-solution-card img { object-fit: cover; filter: grayscale(1); }
.home-solution-card__shade { background: linear-gradient(180deg, rgb(22 27 34 / 72%) 0%, rgb(28 34 43 / 32%) 53%, rgb(24 31 40 / 80%) 100%); }
.home-solution-card__content { position: relative; z-index: 1; display: flex; height: 100%; flex-direction: column; padding: 22px; }
.home-solution-card__content > span { width: fit-content; padding: 5px 9px; border-radius: 999px; background: rgb(255 255 255 / 22%); font-size: 11px; font-weight: 850; }
.home-solution-card h3 { margin-top: 9px; color: #fff; font-size: 27px; font-weight: 950; }
.home-solution-card p { max-width: 420px; margin-top: 5px; color: rgb(255 255 255 / 87%); line-height: 1.35; }
.home-solution-card__content > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 14px; margin-top: auto; }
.home-solution-card strong { font-size: 25px; font-weight: 950; }
.home-solution-card a,
.home-solution-card__unavailable { display: inline-flex; min-height: 44px; align-items: center; padding: 10px 15px; border: 2px solid rgb(255 255 255 / 66%); border-radius: 12px; color: #fff; font-size: 13px; font-weight: 850; text-decoration: none; }
.home-solution-card__unavailable,
.home-drawer__link[aria-disabled="true"] { cursor: default; opacity: .72; }
.home-solutions__more { display: none; width: 100%; margin-top: 12px; }
.home-solutions__footnote { margin-top: 14px; color: #7d8794; font-size: 12px; }

/* Portfolio */
.home-portfolio { padding-block: 65px; }
.home-portfolio__panel { padding: 54px 46px; border-radius: 18px; background: #f4f7fb; }
.home-portfolio__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.home-portfolio__item { aspect-ratio: 1; overflow: hidden; border: 0; border-radius: 9px; background: #dfe5ea; cursor: zoom-in; }
.home-portfolio__item img { width: 100%; height: 100%; object-fit: cover; transition: transform 200ms ease; }
.home-portfolio__item:hover img { transform: scale(1.025); }
.home-portfolio__more { display: block; width: 100%; margin-top: 12px; }
.home-lightbox { width: min(calc(100% - 32px), 760px); }
.home-lightbox .gallery-lightbox__visual { aspect-ratio: 1; overflow: hidden; background: #e9edf1; }
.home-lightbox .gallery-lightbox__visual img { width: 100%; height: 100%; object-fit: contain; }

/* Platform reviews */
.home-reviews { padding-block: 70px; }
.home-reviews__panel { padding: 56px 38px 62px; border-radius: 20px; background: linear-gradient(135deg, #f3f8ff 0%, #f4fbf8 100%); }
.home-reviews .home-heading h1,
.home-reviews .home-heading h2 { font-size: 39px; }
.home-ratings { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.home-ratings article { display: flex; min-height: 88px; align-items: center; gap: 14px; padding: 15px; border: 1px solid #e3e8ed; border-radius: 16px; background: #fff; }
.home-platform-mark { display: inline-grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border-radius: 12px; background: #f0f4f8; color: #49627c; font-weight: 900; }
.home-ratings article div { display: grid; }
.home-ratings small { color: #707d8d; font-weight: 750; }
.home-ratings strong { color: var(--home-slate); font-size: 23px; }
.home-ratings strong span,
.home-review-card__rating span,
.home-footer__rating > span:nth-child(2) { color: #ffbd00; letter-spacing: 1px; }
.home-proof { display: grid; grid-template-columns: 1fr 1.4fr; gap: 24px; margin-top: 18px; padding: 24px; border-radius: 16px; background: #fff; }
.home-proof > div { display: grid; align-content: center; }
.home-proof > div strong { color: #348fd0; font-size: 56px; line-height: .9; }
.home-proof > div span { font-weight: 900; }
.home-proof ul { display: grid; grid-template-columns: 1fr 1fr; align-content: center; gap: 12px 30px; }
.home-proof li { position: relative; padding-left: 17px; font-size: 13px; font-weight: 800; }
.home-proof li::before { position: absolute; top: .42em; left: 0; width: 9px; height: 9px; border-radius: 50%; background: var(--home-green); content: ""; }
.home-proof .button { grid-column: 1 / -1; min-height: 45px; }
.home-review-list { margin-top: 20px; padding: 18px; border: 1px solid #e3e8ee; border-radius: 18px; background: rgb(255 255 255 / 88%); }
.home-review-list__top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; color: #7b8695; font-size: 12px; }
.home-review-list__top > div { display: flex; flex-wrap: wrap; gap: 8px; }
.home-review-list__top button { min-height: 44px; padding: 6px 13px; }
.home-review-card { display: grid; gap: 12px; margin-bottom: 14px; padding: 21px; border: 1px solid #dce2e8; border-radius: 15px; background: #fff; }
.home-review-card__source,
.home-review-card__bottom { display: flex; align-items: center; gap: 9px; color: #657386; font-size: 12px; font-weight: 800; }
.home-review-card__source .home-platform-mark,
.home-review-card__bottom .home-platform-mark { width: 26px; height: 26px; border-radius: 8px; }
.home-review-card header { display: flex; align-items: center; gap: 13px; }
.home-review-card__avatar { display: grid; width: 52px; height: 52px; flex: 0 0 auto; overflow: hidden; place-items: center; border-radius: 50%; background: #eef7ff; color: #318bd0; font-weight: 900; }
.home-review-card__avatar img { width: 100%; height: 100%; object-fit: cover; }
.home-review-card h3 { font-size: 16px; }
.home-review-card header p,
.home-review-card__place { color: #748091; font-size: 12px; }
.home-review-card__rating { display: flex; align-items: center; gap: 13px; font-size: 12px; }
.home-review-card__text { color: #28394b; font-size: 15.5px; line-height: 1.62; }
.home-review-card[data-platform="google"] .home-review-card__text { font-size: 17px; line-height: 1.55; }
.home-review-card[data-platform="gis"] .home-review-card__text { font-size: 16px; font-weight: 650; line-height: 1.48; }
.home-review-card__more { display: inline-flex; width: fit-content; min-height: 44px; align-items: center; border: 0; background: transparent; color: #2987ce; cursor: pointer; }
.home-review-card__note { color: #778391; font-size: 12px; }
.home-review-card__bottom { margin-top: 3px; }
.home-review-list__bottom { display: grid; gap: 10px; color: #7a8594; font-size: 12px; text-align: center; }

/* Video reviews and workflow */
.home-video-reviews { padding-block: 88px 45px; }
.home-video-reviews__wrap { position: relative; }
.home-video-reviews__track { display: grid; grid-auto-columns: calc((100% - 24px) / 3); grid-auto-flow: column; gap: 12px; overflow: hidden; scroll-behavior: smooth; scroll-snap-type: x mandatory; }
.home-video-card { position: relative; aspect-ratio: 400 / 250; overflow: hidden; scroll-snap-align: start; border: 0; border-radius: 15px; background: #dfe3e7; cursor: pointer; }
.home-video-card img { width: 100%; height: 100%; object-fit: cover; }
.home-video-card__play { position: absolute; top: 50%; left: 50%; width: 54px; height: 38px; transform: translate(-50%, -50%); border-radius: 10px; background: #f80000; }
.home-video-card__play::after { position: absolute; top: 50%; left: 52%; transform: translate(-50%, -50%); border-top: 9px solid transparent; border-bottom: 9px solid transparent; border-left: 14px solid #fff; content: ""; }
.home-carousel-arrow { position: absolute; z-index: 2; top: 50%; display: grid; width: 44px; height: 44px; transform: translateY(-50%); place-items: center; border: 1px solid #d8dee5; border-radius: 12px; background: rgb(255 255 255 / 86%); color: var(--home-slate); font-size: 27px; cursor: pointer; }
.home-carousel-arrow--prev { left: 10px; }
.home-carousel-arrow--next { right: 10px; }
.home-workflow { padding-block: 55px 86px; }
.home-workflow__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.home-workflow-card { position: relative; min-height: 270px; overflow: hidden; border-radius: 15px; color: #fff; }
.home-workflow-card img,
.home-workflow-card__shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.home-workflow-card img { object-fit: cover; }
.home-workflow-card__shade { background: linear-gradient(180deg, rgb(26 36 48 / 20%), rgb(27 38 51 / 78%)); }
.home-workflow-card > span { position: absolute; z-index: 1; top: 17px; left: 17px; padding: 7px 10px; border-radius: 10px; background: rgb(61 82 105 / 84%); font-size: 13px; font-weight: 900; text-transform: uppercase; }
.home-workflow-card > span b { display: inline-grid; width: 27px; height: 27px; place-items: center; margin-right: 6px; border: 2px solid #59d7ac; border-radius: 7px; }
.home-workflow-card > div:last-child { position: absolute; z-index: 1; right: 22px; bottom: 20px; left: 22px; }
.home-workflow-card h3 { color: #fff; font-size: 24px; font-weight: 950; }
.home-workflow-card p { margin-top: 5px; color: rgb(255 255 255 / 88%); line-height: 1.42; }

/* FAQ and copy */
.home-faq-copy { padding-block: 70px 85px; }
.home-faq-copy__grid { display: grid; grid-template-columns: minmax(0, .93fr) minmax(0, 1.07fr); gap: 68px; align-items: start; }
.home-faq-copy__grid--copy-only { grid-template-columns: minmax(0, 1fr); }
.home-faq .faq { display: grid; gap: 10px; border: 0; }
.home-faq .faq__item { overflow: hidden; border: 1px solid #e1e6eb; border-radius: 15px; background: #fff; box-shadow: 0 7px 20px rgb(36 52 71 / 5%); }
.home-faq .faq__item button { min-height: 66px; padding: 14px 14px 14px 18px; }
.home-faq .faq__item button::after { flex: 0 0 auto; border: 1px solid #dbe1e6; border-radius: 8px; box-shadow: none; }
.home-faq .faq__answer { padding: 0 18px 18px; }
.home-copy { display: grid; gap: 19px; color: #717c8b; line-height: 1.62; }
.home-copy section { display: grid; gap: 10px; }
.home-copy h2 { font-size: 27px; font-weight: 900; }
.home-copy strong { color: var(--home-green); }
.home-copy ul { display: grid; gap: 8px; padding-left: 19px; list-style: disc; }
.home-copy li::marker { color: var(--home-green); }
.home-copy__final { color: #6b7788; }

/* Footer, floating UI, cookie and demo */
.home-footer { padding-top: 56px; background: var(--home-footer); color: #566578; }
.home-footer__grid { display: grid; grid-template-columns: 1fr minmax(280px, 350px) 1fr; gap: 30px; align-items: start; }
.home-footer__side { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 34px; }
.home-footer__group { display: grid; align-content: start; gap: 6px; }
.home-footer__group h2 { margin-bottom: 4px; color: #dde3e8; font-size: 24px; font-weight: 700; }
.home-footer__group a,
.home-footer__group span { color: #5a687a; font-size: 14px; text-decoration: none; }
.home-footer__group span[aria-disabled="true"] { opacity: .72; }
.home-footer__card { display: grid; gap: 18px; padding: 34px; border-radius: 18px 18px 0 0; background: #e9f5ff; text-align: center; }
.home-footer__logo { display: block; min-height: 130px; padding: 30px 12px; border-radius: 10px; background: #fff; }
.home-footer__logo img { width: 100%; height: auto; }
.home-footer__phone { padding: 17px 12px; border-radius: 12px; background: #fff; color: var(--home-slate); font-size: 24px; font-weight: 950; text-decoration: none; }
.home-footer__email { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; color: var(--home-slate); font-size: 14px; font-weight: 800; overflow-wrap: anywhere; text-decoration: none; }
.home-footer__rating { display: grid; gap: 7px; padding: 25px 14px 14px; border-radius: 12px; background: #fff; }
.home-footer__rating-placeholder { display: block; width: 100%; height: 141px; border-radius: 7px; background: #eef2f5; }
.home-footer__rating > span:first-child { color: #9aa3af; font-size: 12px; }
.home-footer__bottom { margin-top: 0; padding: 10px 0; background: #747f8d; color: #cbd1d7; font-size: 12px; text-align: center; }
.home-cookie-banner { width: min(calc(100% - 32px), 430px); }
.home-cookie-banner .cookie-banner__content { grid-template-columns: 1fr auto; align-items: center; }
.home-demo-modal__eyebrow { color: var(--home-green); font-size: 13px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.home-demo-fields { display: grid; gap: 13px; padding: 16px; border-radius: 13px; background: #f5f7fa; }
.home-demo-fields label { display: grid; gap: 5px; font-size: 13px; font-weight: 800; }
.home-demo-fields input,
.home-demo-fields textarea { padding: 11px; border: 1px solid #dfe4e9; border-radius: 9px; background: #fff; }
.home-demo-fields .lead-form__consent { display: flex; grid-template-columns: auto 1fr; gap: 9px; align-items: flex-start; font-weight: 500; line-height: 1.4; }
.home-demo-fields .lead-form__consent input { margin-top: 3px; }
.page-home .floating-actions { bottom: 150px; }
.page-home[data-stitch-fragment] .floating-actions,
.page-home[data-stitch-fragment] .cookie-banner { display: none; }
.page-home[data-stitch-fragment] { padding-bottom: 48px; }
.page-home[data-stitch-fragment] .home-header { position: absolute; }
html[data-stitch-fragment] { overflow-y: scroll; scroll-behavior: auto; scrollbar-gutter: stable; }

/* Desktop parity corrections derived from the saved full-page reference. */
@media (min-width: 901px) {
  .home-hero { min-height: 631px; }
  .home-hero__content { gap: 14px; padding: 38px; }
  .home-hero__actions .button { min-height: 44px; }

  .home-estimates__panel { padding-block: 12px 24px; }
  .home-estimate-card > img { height: auto; }

  .home-solutions { padding-bottom: 5px; }

  .home-portfolio__panel { padding-block: 25px 28px; }
  .home-portfolio__item { aspect-ratio: 4 / 3; }

  .home-review-card__text {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }
  .home-review-card__text.is-expanded { display: block; -webkit-line-clamp: unset; }
  .home-reviews { padding-block: 28px 21px; }
  .home-reviews__panel { padding-block: 45px 21px; }

  .home-video-reviews { padding-block: 64px 40px; }
  .home-workflow { padding-block: 47px; }
  .home-workflow-card { min-height: 240px; }
}

@media (max-width: 1100px) {
  .page-home .container { width: min(calc(100% - 48px), 1240px); }
  .home-header__actions { gap: 20px; }
  .home-hero__content { width: 74%; }
  .home-hero__features { grid-template-columns: repeat(2, max-content); }
  .home-solutions__grid { grid-template-columns: 1fr 1fr; }
  .home-solution-card--large { grid-column: auto; }
  .home-footer__grid { grid-template-columns: .9fr minmax(270px, 330px) .9fr; }
  .home-footer__side { gap: 24px 18px; }
}

@media (max-width: 900px) {
  html:not(.js) .home-menu-toggle { display: none; }
  html:not(.js) .home-menu-nojs { position: relative; top: 72px; display: block; margin-bottom: 72px; }
  .page-home main { padding-top: 72px; }
  .home-header,
  .home-header__inner { height: 72px; }
  .home-logo { width: 176px; }
  .home-header__phone span:last-child { display: none; }
  .home-header__actions { gap: 8px; }
  .home-contact__grid { grid-template-columns: 1fr 1fr; }
  .home-contact__cities { grid-column: 1 / -1; }
  .home-hero__content { width: 88%; }
  .home-hero h1 { font-size: 48px; }
  .home-trust__grid { grid-template-columns: 1fr 1fr; }
  .home-estimates__grid { grid-template-columns: 1fr; }
  .home-estimate-card__meta { min-height: 0; }
  .home-portfolio__grid { grid-template-columns: repeat(3, 1fr); }
  .home-proof { grid-template-columns: 1fr; }
  .home-proof .button { grid-column: auto; }
  .home-video-reviews__track { grid-auto-columns: calc((100% - 12px) / 2); }
  .home-faq-copy__grid { grid-template-columns: 1fr; gap: 55px; }
  .home-footer__grid { grid-template-columns: minmax(280px, 350px); justify-content: center; }
  .home-footer__side { display: none; }
}

@media (max-width: 620px) {
  html:not(.js) .home-menu-nojs { top: 64px; margin-bottom: 64px; }
  .page-home { font-size: 14px; }
  .page-home .container { width: calc(100% - 20px); }
  .home-section { padding-block: 48px; }
  .home-heading { margin-bottom: 18px; }
  .home-heading h1,
  .home-heading h2,
  .home-reviews .home-heading h1,
  .home-reviews .home-heading h2 { font-size: 23px; }
  .home-heading p { font-size: 13px; }
  .home-header,
  .home-header__inner { height: 64px; }
  .page-home main { padding-top: 64px; }
  .home-logo { width: 94px; }
  .home-header__phone { min-width: 44px; justify-content: center; }
  .home-menu-toggle { min-width: 44px; padding: 0; }
  .home-menu-toggle > span:last-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .home-drawer { width: 100%; padding: 20px 18px 36px; }
  .home-drawer__quick { grid-template-columns: 1fr; }
  .home-drawer__meta { grid-template-columns: 1fr; }
  .home-contact { margin-block: 5px 8px; }
  .home-contact > summary { display: flex; min-height: 52px; align-items: center; gap: 9px; padding: 7px 10px; border: 1px solid #dfe4e9; border-radius: 13px; background: #fff; list-style: none; cursor: pointer; }
  .home-contact > summary::-webkit-details-marker { display: none; }
  .home-contact > summary > span:first-child { display: grid; width: 30px; height: 30px; place-items: center; border: 2px solid #82e6c2; border-radius: 50%; }
  .home-contact > summary > span:last-child { display: grid; }
  .home-contact > summary strong { font-size: 11px; }
  .home-contact > summary small { color: #7b8796; font-size: 8px; }
  .home-contact__grid { grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 6px; }
  .home-contact:not([open]) > .home-contact__grid { display: none; }
  .home-contact__cell { min-height: 64px; padding: 9px 10px; border-radius: 10px; }
  .home-contact__cell:first-child { grid-column: 1 / -1; }
  .home-contact__cities { grid-column: 1 / -1; }
  .home-contact__cities a { padding: 5px 8px; font-size: 9px; }
  .home-hero { min-height: 550px; border-radius: 15px; }
  .home-hero__image { object-position: 62% center; }
  .home-hero__shade { background: linear-gradient(180deg, rgb(18 25 35 / 90%), rgb(18 25 35 / 68%)); }
  .home-hero__content { width: 100%; gap: 14px; padding: 25px 15px 18px; }
  .home-hero h1 { font-size: 29px; line-height: 1.08; }
  .home-hero__subtitle { margin-top: -7px; font-size: 18px; }
  .home-hero__price { font-size: 13px; }
  .home-hero__promo { min-height: 58px; font-size: 13px; }
  .home-hero__promo > span { width: 40px; height: 40px; }
  .home-hero__actions { display: grid; gap: 9px; }
  .home-hero__actions .button { width: 100%; }
  .home-hero__guarantee { font-size: 12px; }
  .home-hero__features { grid-template-columns: 1fr 1fr; gap: 7px; }
  .home-hero__features li { min-height: 42px; padding: 6px 7px; font-size: 10px; white-space: normal; }
  .home-trust { padding-block: 52px; }
  .home-trust__grid { grid-template-columns: 1fr; gap: 8px; }
  .home-trust__card { min-height: 155px; }
  .home-trust__card h3 { font-size: 24px; }
  .home-trust__card p { font-size: 14px; }
  .home-estimates { padding-block: 45px 66px; }
  .home-estimates__panel,
  .home-portfolio__panel,
  .home-reviews__panel { width: calc(100% - 8px); padding: 24px 10px 30px; }
  .home-estimates__grid { gap: 10px; }
  .home-estimate-card { padding: 12px; border-radius: 14px; }
  .home-estimate-card__price { font-size: 20px; }
  .home-solutions { padding-block: 72px 55px; }
  .home-solutions .home-filter { display: none; }
  .home-solutions__grid { grid-template-columns: 1fr; gap: 7px; }
  .home-solution-card { min-height: 220px; order: var(--mobile-order, 0); }
  .home-solution-card:nth-child(1) { order: 1; }
  .home-solution-card:nth-child(2) { order: 5; }
  .home-solution-card:nth-child(3) { order: 6; }
  .home-solution-card:nth-child(4) { order: 7; }
  .home-solution-card:nth-child(5) { order: 8; }
  .home-solution-card:nth-child(6) { order: 9; }
  .home-solution-card:nth-child(7) { order: 4; }
  .home-solution-card:nth-child(8) { order: 3; }
  .home-solution-card:nth-child(9) { order: 10; }
  .home-solution-card:nth-child(10) { order: 11; }
  .home-solution-card:nth-child(11) { order: 2; }
  .home-solution-card:nth-child(12) { order: 12; }
  .home-solution-card:nth-child(13) { order: 13; }
  .home-solution-card h3 { font-size: 23px; }
  .home-solution-card p { font-size: 13px; }
  .home-solution-card strong { font-size: 19px; }
  .home-solutions__more { display: none; }
  .home-portfolio__grid { grid-template-columns: 1fr 1fr; gap: 7px; }
  .home-filter { gap: 7px; }
  .home-filter button { min-height: 44px; padding: 7px 13px; font-size: 11px; }
  .home-ratings { grid-template-columns: 1fr; gap: 7px; }
  .home-ratings article { min-height: 72px; }
  .home-proof { gap: 18px; padding: 16px; }
  .home-proof > div strong { font-size: 47px; }
  .home-proof ul { grid-template-columns: 1fr; gap: 9px; }
  .home-review-list { padding: 8px; }
  .home-review-list__top { display: grid; }
  .home-review-list__top > div { flex-wrap: nowrap; overflow-x: auto; }
  .home-review-card { gap: 10px; padding: 13px; }
  .home-review-card__text { display: -webkit-box; overflow: hidden; font-size: 13px; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 5; }
  .home-review-card__text.is-expanded { display: block; }
  .home-review-card__more { display: block; }
  .home-video-reviews { padding-block: 60px 35px; }
  .home-video-reviews__track { grid-auto-columns: 78%; overflow-x: auto; }
  .home-carousel-arrow { display: none; }
  .home-workflow { padding-block: 38px 65px; }
  .home-workflow__grid { grid-template-columns: 1fr; gap: 8px; }
  .home-workflow-card { min-height: 235px; }
  .home-workflow-card h3 { font-size: 20px; }
  .home-faq-copy { padding-block: 52px 0; }
  .home-faq-copy__grid { gap: 45px; }
  .home-faq .faq { gap: 8px; }
  .home-faq .faq__item button { min-height: 56px; padding-block: 10px; padding-left: 12px; font-size: 12px; }
  .home-copy { gap: 17px; padding-bottom: 46px; font-size: 14px; }
  .home-copy h2 { font-size: 22px; }
  .home-footer { padding-top: 18px; }
  .home-footer__grid { grid-template-columns: 1fr; }
  .home-footer__card { gap: 12px; padding: 18px 12px; }
  .home-footer__logo { min-height: 120px; }
  .home-footer__phone { font-size: 20px; }
  .home-cookie-banner .cookie-banner__content { grid-template-columns: 1fr; }
  .page-home .floating-actions { right: 9px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
  .page-home .floating-action { width: 45px; height: 45px; }
}

@media (max-width: 370px) {
  .page-home .container { width: calc(100% - 16px); }
  .home-hero { min-height: 560px; }
  .home-hero h1 { font-size: 28px; }
  .home-hero__features li { font-size: 9px; }
}

@media (orientation: landscape) and (max-height: 500px) {
  .home-drawer { padding-block: 14px 24px; }
  .home-drawer__quick { grid-template-columns: 1fr 1fr; }
  .home-drawer__search { margin-block: 10px; }
  .home-demo-modal { max-height: calc(100dvh - 12px); }
}

@media (prefers-reduced-motion: reduce) {
  .home-video-reviews__track { scroll-behavior: auto; }
  .home-portfolio__item img { transition: none; }
}
/* css/responsive.css */
@media (max-width: 1120px) {
  .header-phone { display: none; }
  .desktop-nav { gap: 14px; }
}

@media (max-width: 899px) {
  :root {
    --space-page: 24px;
    --space-section: 48px;
  }

  .desktop-nav { display: none; }
  .menu-toggle { display: inline-grid; }
  .topbar__location { display: none; }
  .topbar__hours { margin-right: auto; }
  .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card:last-child { grid-column: 1 / -1; }
  .site-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-logo__note { display: none; }

  .site-logo,
  .topbar__phone,
  .home-header__phone,
  nav[aria-label="Хлебные крошки"] a,
  .site-footer a,
  .service-faq__phone,
  .catalog-anchor-nav a,
  .catalog-cta a { display: inline-flex; min-width: 44px; min-height: 44px; align-items: center; }
  .catalog-filter button { min-width: 44px; min-height: 44px; }

  html:not(.js) .menu-toggle { display: none; }
  html:not(.js) .cookie-banner { display: none; }
  html:not(.js) .mobile-menu-nojs {
    display: block;
    padding-block: 10px;
  }
  html:not(.js) .mobile-menu-nojs nav {
    display: grid;
    padding-block: 10px;
  }
  html:not(.js) .mobile-menu-nojs a { min-height: 44px; }
}

@media (max-width: 620px) {
  :root {
    --space-page: 20px;
    --space-section: 40px;
  }

  html { scroll-padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }

  h1 { font-size: clamp(2.25rem, 12vw, 3rem); }
  .topbar__inner { gap: 10px; }
  .topbar__hours { font-size: 0.75rem; }
  .topbar__phone { font-size: 0.75rem; }
  .menu-toggle__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .menu-toggle { padding-inline: 11px; }
  .mobile-menu { width: 100%; }
  .mobile-menu__quick-actions { grid-template-columns: 1fr; }
  .scaffold-hero { min-height: 440px; }
  .button-row .button { width: 100%; }
  .placeholder-grid,
  .card-grid,
  .gallery { grid-template-columns: 1fr; }
  .card:last-child { grid-column: auto; }
  .cta { grid-template-columns: 1fr; }
  .cta .button { width: 100%; }
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__bottom { flex-direction: column; }
  .cookie-banner { position: static; width: calc(100% - 20px); margin: 10px auto calc(10px + env(safe-area-inset-bottom, 0px)); }
  .cookie-banner__actions { justify-content: space-between; }
  .floating-actions { right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
  .floating-action--top { display: none; }
  .site-footer__nav a,
  .site-footer__contacts a,
  .site-footer__legal a { width: 100%; }
  .site-footer { padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)); }
  .component-section { padding: 22px 18px; }
  .component-row .button { flex: 1 1 145px; }
  .gallery-lightbox__controls .button { flex: 1 1 130px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body *,
  body *::before,
  body *::after {
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
    scroll-behavior: auto;
    transition-duration: 0.01ms;
  }
}
