:root {
  --color-canvas: #eceee7;
  --color-surface: #f8f7f0;
  --color-paper: #ffffff;
  --color-ink: #121714;
  --color-muted: #606a63;
  --color-line: #c6cdc5;
  --color-line-strong: #8e9991;
  --color-signal: #0b7756;
  --color-signal-deep: #07543f;
  --color-accent: #f1cf43;
  --color-danger: #a03d32;
  --color-success: #075d45;
  --content-width: 1360px;
  --section-space: clamp(72px, 8vw, 124px);
  --page-gutter: clamp(20px, 4vw, 48px);
  --radius-small: 4px;
  --radius-medium: 12px;
  --radius-large: 20px;
  --shadow-map: 0 28px 70px rgba(0, 0, 0, 0.24);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 92px;
}

body {
  margin: 0;
  background: var(--color-canvas);
  color: var(--color-ink);
  font-family: "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  text-rendering: optimizeLegibility;
}

button,
input,
textarea {
  font: inherit;
}

button,
a {
  color: inherit;
}

a {
  text-decoration: none;
}

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

h1,
h2,
h3,
p,
dl,
dd {
  margin: 0;
}

h1,
h2,
h3,
strong,
b {
  font-weight: 400;
}

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

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

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.section-inner {
  width: min(calc(100% - (var(--page-gutter) * 2)), var(--content-width));
  margin-inline: auto;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding-inline: max(var(--page-gutter), calc((100vw - var(--content-width)) / 2));
  border-bottom: 1px solid rgba(18, 23, 20, 0.1);
  background: rgba(246, 247, 244, 0.96);
  color: var(--color-ink);
  box-shadow: 0 8px 24px rgba(18, 23, 20, 0.06);
  backdrop-filter: blur(14px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  font-size: 21px;
  font-weight: 400;
  letter-spacing: -0.02em;
}

.brand img {
  width: 42px;
  height: 42px;
  object-fit: contain;
}

.nav {
  display: flex;
  align-items: center;
  gap: clamp(20px, 2.3vw, 36px);
  color: #35443b;
  font-size: 16px;
}

.nav a,
.site-footer nav a,
.footer-email,
.site-footer .ai-info-link {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  border-bottom: 1px solid transparent;
}

.nav a:hover,
.site-footer nav a:hover,
.footer-email:hover,
.site-footer .ai-info-link:hover {
  border-color: var(--color-accent);
  color: var(--color-ink);
}

.site-header .nav a:hover {
  color: var(--color-ink);
}

.hero {
  min-height: 760px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(480px, 0.92fr);
  align-items: center;
  gap: clamp(48px, 6vw, 96px);
  padding: clamp(72px, 8vw, 120px) max(var(--page-gutter), calc((100vw - var(--content-width)) / 2));
  background: #f6f7f4;
  color: #0f1b14;
}

.hero-copy {
  align-self: center;
}

.hero-copy h1 {
  max-width: 760px;
  font-size: clamp(46px, 4.6vw, 70px);
  line-height: 1.01;
  letter-spacing: -0.048em;
}

.hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px 28px;
  margin-top: 36px;
}

.primary-action,
.lead-submit {
  min-height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 22px;
  border: 1px solid #c7a91e;
  border-radius: var(--radius-small);
  background: var(--color-accent);
  color: #171b18;
  cursor: pointer;
  font-weight: 400;
  box-shadow: 0 0 0 rgba(241, 207, 67, 0);
  transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
}

.primary-action:hover,
.lead-submit:hover {
  transform: translateY(-2px);
  background: #f8db5a;
  box-shadow: 0 10px 28px rgba(241, 207, 67, 0.18);
}

.secondary-action,
.share-action {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.hero .secondary-action {
  color: var(--color-signal-deep);
}

.site-map {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(15, 27, 20, 0.18);
  border-radius: var(--radius-medium);
  background: var(--color-surface);
  box-shadow: 0 28px 70px rgba(18, 23, 20, 0.16);
}

.site-map img {
  display: block;
  width: 100%;
  height: auto;
}

.solutions-section,
.midscale-section,
.request-section,
.signal-section,
.objects-section,
.capabilities-section,
.catalog-section,
.process-section,
.faq-section {
  padding-block: var(--section-space);
}

.section-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
  align-items: end;
  gap: 40px clamp(48px, 7vw, 110px);
  margin-bottom: clamp(42px, 5vw, 72px);
}

.section-heading h2,
.request-heading h2 {
  max-width: 900px;
  font-size: clamp(42px, 4.8vw, 68px);
  line-height: 1;
  letter-spacing: -0.045em;
}

.section-heading p,
.request-heading p {
  max-width: 680px;
  color: var(--color-muted);
  font-size: 18px;
  line-height: 1.6;
}

.section-heading-single {
  display: block;
}

.section-heading-single h2 {
  max-width: 1100px;
}

.solutions-section {
  background: var(--color-surface);
}

.solution-rows {
  border-top: 2px solid var(--color-ink);
}

.solution-rows article {
  display: grid;
  grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.8fr) minmax(150px, 0.5fr);
  align-items: center;
  gap: 28px clamp(32px, 5vw, 80px);
  min-height: 118px;
  padding: 24px 18px;
  border-bottom: 1px solid var(--color-line);
  transition: background-color 140ms ease;
}

.solution-rows article:hover {
  background: #eef2ec;
}

.solution-rows h3 {
  font-size: 22px;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.solution-rows article > div:first-child p {
  margin-top: 8px;
  color: var(--color-signal-deep);
  font-size: 16px;
  overflow-wrap: anywhere;
}

.solution-copy {
  max-width: 760px;
  color: var(--color-muted);
}

.solution-rows .solution-price {
  color: var(--color-signal-deep);
  font-size: clamp(26px, 2.1vw, 34px);
  line-height: 1.2;
  text-align: right;
}

.price-note {
  display: block;
  margin-top: 6px;
  color: var(--color-muted);
  font-size: 16px;
  font-weight: 400;
}

.solutions-note,
.midscale-note,
.catalog-meta,
.share-status {
  color: var(--color-muted);
  font-size: 16px;
}

.solutions-note,
.midscale-note {
  max-width: 880px;
  margin-top: 22px;
}

.budget-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-top: 34px;
}

.share-action {
  color: var(--color-signal-deep);
  font-size: 16px;
}

.share-status {
  min-height: 24px;
  margin-top: 10px;
  color: var(--color-signal-deep);
}

.midscale-section {
  border-top: 1px solid var(--color-line);
  background: var(--color-canvas);
}

.midscale-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 2px solid var(--color-ink);
  border-bottom: 1px solid var(--color-line);
}

.midscale-grid article {
  min-width: 0;
  min-height: 340px;
  display: flex;
  flex-direction: column;
  padding: 30px clamp(22px, 2.5vw, 36px);
  border-right: 1px solid var(--color-line);
}

.midscale-grid article:last-child {
  border-right: 0;
}

.midscale-grid h3 {
  font-size: 25px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.midscale-grid article > p:not(.midscale-maker) {
  margin-top: 30px;
  color: var(--color-muted);
}

.midscale-grid strong {
  margin-top: auto;
  padding-top: 32px;
  color: var(--color-signal-deep);
  font-size: clamp(25px, 2vw, 32px);
}

.request-section {
  position: relative;
  border-top: 1px solid var(--color-line);
  background: #eef3ed;
  color: var(--color-ink);
}

.request-anchor {
  position: absolute;
  inset: 0 auto auto 0;
  width: 1px;
  height: 1px;
  scroll-margin-top: 92px;
}

.request-layout {
  max-width: 1180px;
}

.request-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 34px;
  margin-bottom: 42px;
}

.request-heading p {
  max-width: 720px;
  margin-top: 20px;
  color: var(--color-muted);
}

.request-heading a {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  border-bottom: 1px solid var(--color-signal-deep);
  color: var(--color-signal-deep);
}

.lead-form {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: 22px 24px;
  padding: clamp(24px, 4vw, 44px);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-large);
  background: #fbfbf7;
  color: var(--color-ink);
  box-shadow: 0 22px 60px rgba(18, 23, 20, 0.1);
}

.form-trap {
  position: absolute !important;
  left: -10000px !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  border: 0 !important;
}

.contact-method,
.optional-details,
.request-notes,
.form-progress,
.lead-submit,
.form-status,
.lead-context {
  grid-column: 1 / -1;
}

.lead-context {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 15px 18px;
  border: 1px solid #9bb9aa;
  border-radius: var(--radius-medium);
  background: #edf6f1;
}

.lead-context[hidden],
.lead-success[hidden],
.lead-form[hidden] {
  display: none;
}

.lead-context div {
  display: grid;
  gap: 3px;
}

.lead-context span {
  color: var(--color-muted);
  font-size: 16px;
}

.lead-context strong {
  overflow-wrap: anywhere;
}

.lead-context button,
.lead-success button,
.catalog-request {
  min-height: 44px;
  padding: 9px 14px;
  border: 1px solid var(--color-signal);
  border-radius: var(--radius-small);
  background: #fff;
  color: var(--color-signal-deep);
  cursor: pointer;
  font-weight: 400;
}

.lead-success {
  max-width: 760px;
  padding: clamp(24px, 4vw, 44px);
  border: 1px solid #9bb9aa;
  border-radius: var(--radius-large);
  background: #fbfbf7;
  color: var(--color-ink);
  box-shadow: 0 22px 60px rgba(18, 23, 20, 0.1);
}

.lead-success > p:first-child {
  color: var(--color-success);
  font-weight: 400;
}

.lead-success h3 {
  margin-top: 8px;
  font-size: clamp(30px, 4vw, 46px);
}

.lead-success dl {
  display: grid;
  gap: 1px;
  margin: 28px 0;
  border: 1px solid var(--color-line);
  background: var(--color-line);
}

.lead-success dl div {
  display: grid;
  grid-template-columns: minmax(150px, 0.55fr) minmax(0, 1fr);
  gap: 18px;
  padding: 14px 16px;
  background: #fff;
}

.lead-success dt {
  color: var(--color-muted);
}

.lead-success dd {
  overflow-wrap: anywhere;
}

.lead-success > div {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.lead-success-status {
  min-height: 24px;
  margin-top: 14px;
  color: var(--color-success);
}

.lead-form label > span,
.contact-method legend {
  display: block;
  margin-bottom: 9px;
  color: #334038;
  font-size: 16px;
  font-weight: 400;
}

.lead-form label small,
.optional-details small {
  color: #707b73;
  font-size: 16px;
  font-weight: 400;
}

.contact-field > small {
  display: block;
  margin-top: 8px;
}

.lead-form input,
.lead-form textarea {
  width: 100%;
  border: 1px solid #aab4ad;
  border-radius: var(--radius-small);
  background: var(--color-paper);
  color: var(--color-ink);
  outline: 0;
}

.lead-form input {
  height: 56px;
  padding: 0 16px;
}

.lead-form textarea {
  min-height: 132px;
  padding: 15px 16px;
  resize: vertical;
}

.lead-form input:focus,
.lead-form textarea:focus {
  border-color: var(--color-signal);
  box-shadow: 0 0 0 4px rgba(11, 119, 86, 0.13);
}

.contact-method {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
  padding: 0;
  border: 0;
}

.contact-method legend {
  grid-column: 1 / -1;
  width: 100%;
}

.method-option {
  cursor: pointer;
}

.method-option input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}

.method-option > span {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin: 0;
  padding: 10px;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-medium);
  background: var(--color-paper);
  color: #344039;
  transition: border-color 140ms ease, background-color 140ms ease, transform 140ms ease;
}

.method-option:hover > span {
  transform: translateY(-2px);
  border-color: var(--color-line-strong);
}

.method-option i {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 9px;
}

.method-option img {
  width: 23px;
  height: 23px;
}

.method-phone i {
  background: var(--color-signal);
}

.method-sms i {
  background: #3979e8;
}

.method-whatsapp i {
  background: #20b86a;
}

.method-telegram i {
  background: #25a5df;
}

.method-max i {
  background: #fff;
  border: 1px solid var(--color-line);
}

.method-option input:checked + span {
  border: 2px solid var(--color-signal);
  background: #e2efe8;
  color: var(--color-signal-deep);
}

.method-option input:focus-visible + span {
  outline: 3px solid var(--color-accent);
  outline-offset: 3px;
}

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

.optional-details summary {
  position: relative;
  min-height: 56px;
  display: flex;
  align-items: center;
  padding: 12px 48px 12px 0;
  color: #465249;
  cursor: pointer;
  list-style: none;
}

.optional-details summary::-webkit-details-marker,
.faq-list summary::-webkit-details-marker {
  display: none;
}

.optional-details summary::after {
  content: "+";
  position: absolute;
  right: 8px;
  font-size: 28px;
  color: var(--color-signal-deep);
}

.optional-details[open] summary::after {
  content: "−";
}

.optional-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  padding: 6px 0 20px;
}

.optional-grid .wide {
  grid-column: 1 / -1;
}

.lead-submit {
  width: fit-content;
  min-width: 280px;
}

.lead-submit:disabled {
  cursor: wait;
  opacity: 0.64;
  transform: none;
}

.form-status {
  min-height: 25px;
  font-size: 16px;
}

.form-status.success {
  color: var(--color-success);
}

.form-status.error {
  color: var(--color-danger);
}

.signal-section {
  background: var(--color-surface);
}

.compact-heading {
  grid-template-columns: minmax(0, 1.15fr) minmax(340px, 0.85fr);
}

.signal-flow {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 2px solid var(--color-ink);
  border-bottom: 1px solid var(--color-line);
}

.signal-flow article {
  min-height: 260px;
  padding: 30px 28px 34px;
  border-right: 1px solid var(--color-line);
}

.signal-flow article:first-child {
  padding-left: 0;
}

.signal-flow article:last-child {
  border-right: 0;
}

.signal-flow h3 {
  max-width: 260px;
  font-size: 24px;
  line-height: 1.16;
}

.signal-flow p {
  margin-top: 22px;
  color: var(--color-muted);
}

.objects-section {
  background: #f6f7f4;
  color: var(--color-ink);
}

.objects-heading {
  align-items: start;
}

.object-size-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 2px solid var(--color-ink);
  border-left: 1px solid var(--color-line);
}

.object-size-grid article {
  min-height: 340px;
  display: flex;
  flex-direction: column;
  padding: clamp(26px, 3vw, 42px);
  border-right: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
  background: rgba(255, 255, 255, 0.42);
}

.object-size-grid h3 {
  max-width: 640px;
  font-size: clamp(24px, 2.1vw, 32px);
  line-height: 1.15;
  letter-spacing: -0.025em;
}

.object-size-grid p {
  max-width: 680px;
  margin-top: 24px;
  color: var(--color-muted);
  font-size: 17px;
  line-height: 1.6;
}

.object-size-grid a {
  width: fit-content;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  margin-top: auto;
  padding-top: 24px;
  border-bottom: 1px solid var(--color-signal-deep);
  color: var(--color-signal-deep);
  font-size: 16px;
  font-weight: 400;
}

.capabilities-section {
  background: var(--color-canvas);
}

.capability-layout {
  overflow: hidden;
  border: 1px solid var(--color-line-strong);
  border-radius: var(--radius-medium);
  background: var(--color-paper);
}

.capability-tabs {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  border-bottom: 1px solid var(--color-line);
}

.capability-tabs button {
  min-height: 76px;
  padding: 14px 16px;
  border: 0;
  border-right: 1px solid var(--color-line);
  background: #e4e8e1;
  color: #475148;
  cursor: pointer;
  text-align: left;
}

.capability-tabs button:last-child {
  border-right: 0;
}

.capability-tabs button:hover {
  background: #edf0ea;
}

.capability-tabs button.active {
  background: var(--color-paper);
  color: var(--color-signal-deep);
  box-shadow: inset 0 -4px 0 var(--color-signal);
}

.capability-tabs span {
  display: block;
  font-weight: 400;
}

.capability-view {
  display: grid;
  grid-template-columns: minmax(340px, 0.9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(40px, 6vw, 90px);
  padding: clamp(30px, 5vw, 72px);
}

.capability-visual {
  overflow: hidden;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-small);
  background: #eef0eb;
}

.capability-visual img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.capability-view h3 {
  max-width: 560px;
  font-size: clamp(32px, 3vw, 46px);
  line-height: 1.08;
  letter-spacing: -0.035em;
}

.capability-view > div:last-child > p {
  max-width: 620px;
  margin-top: 24px;
  color: var(--color-muted);
  font-size: 17px;
}

.capability-view dl {
  margin-top: 34px;
}

.capability-view dl div {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 22px;
  padding: 16px 0;
  border-top: 1px solid var(--color-line);
}

.capability-view dt {
  color: var(--color-muted);
}

.catalog-section {
  scroll-margin-top: 86px;
  padding-block: clamp(34px, 4vw, 56px) var(--section-space);
  background: var(--color-surface);
}

.catalog-heading {
  grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
  margin-bottom: clamp(22px, 2.4vw, 32px);
}

.catalog-heading h2 {
  max-width: 1040px;
}

.catalog-toolbar {
  display: grid;
  gap: 20px;
  padding: clamp(18px, 2vw, 26px);
  border: 1px solid rgba(116, 139, 132, 0.42);
  border-radius: 28px;
  background:
    radial-gradient(circle at 8% 0%, rgba(255, 255, 255, 0.98), transparent 38%),
    radial-gradient(circle at 93% 112%, rgba(197, 228, 255, 0.36), transparent 42%),
    linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(239, 246, 242, 0.78));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.96),
    0 20px 55px rgba(32, 67, 55, 0.1);
  -webkit-backdrop-filter: blur(20px) saturate(1.35);
  backdrop-filter: blur(20px) saturate(1.35);
}

.catalog-filter-group {
  display: grid;
  gap: 12px;
}

.catalog-filter-title {
  color: #45524a;
  font-size: 18px;
  line-height: 1.3;
}

.filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.price-filters {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.filters button,
.price-filters button,
.catalog-more {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(126, 148, 141, 0.48);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(230, 241, 237, 0.72)),
    rgba(255, 255, 255, 0.78);
  color: #26332c;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.98),
    inset 0 -1px 0 rgba(77, 112, 100, 0.1),
    0 8px 22px rgba(32, 67, 55, 0.08);
  cursor: pointer;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
}

.filters button {
  min-height: 88px;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  padding: 16px 18px;
  text-align: left;
}

.price-filters button {
  min-height: 56px;
  padding: 10px 16px;
  font-size: 17px;
}

.filters button::after,
.price-filters button::after,
.catalog-more::after {
  content: "";
  position: absolute;
  inset: -70% 45% -70% -65%;
  background: linear-gradient(105deg, transparent 15%, rgba(255, 255, 255, 0.84) 48%, transparent 78%);
  transform: translateX(-135%) rotate(9deg);
  transition: transform 520ms cubic-bezier(0.22, 0.72, 0.25, 1);
  pointer-events: none;
}

.filters button > *,
.catalog-more > * {
  position: relative;
  z-index: 1;
}

.filters svg {
  width: 36px;
  height: 36px;
  fill: none;
  stroke: #087455;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.filter-label {
  display: grid;
  gap: 4px;
  font-size: 18px;
  line-height: 1.24;
}

.filter-label small {
  color: #53645b;
  font-size: 16px;
  line-height: 1.25;
}

.filters button:hover,
.price-filters button:hover,
.catalog-more:hover {
  border-color: rgba(11, 119, 86, 0.72);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 1), rgba(214, 242, 233, 0.8)),
    rgba(255, 255, 255, 0.9);
  box-shadow:
    inset 0 1px 0 #fff,
    0 13px 28px rgba(24, 93, 69, 0.14);
  transform: translateY(-2px);
}

.filters button:hover::after,
.price-filters button:hover::after,
.catalog-more:hover::after,
.filters button:focus-visible::after,
.price-filters button:focus-visible::after,
.catalog-more:focus-visible::after {
  transform: translateX(245%) rotate(9deg);
}

.filters button.active,
.price-filters button.active {
  border-color: rgba(0, 119, 84, 0.82);
  background:
    radial-gradient(circle at 18% 10%, rgba(255, 255, 255, 0.98), transparent 34%),
    linear-gradient(135deg, rgba(204, 246, 231, 0.96), rgba(213, 235, 255, 0.9));
  color: #064a37;
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 0 0 1px rgba(255, 255, 255, 0.54),
    0 12px 30px rgba(11, 119, 86, 0.18),
    0 0 0 3px rgba(11, 119, 86, 0.08);
}

.filters button.active svg {
  stroke: #055f46;
}

.filters .filter-interceptor {
  border-color: rgba(190, 146, 15, 0.68);
  background:
    radial-gradient(circle at 15% 0%, rgba(255, 255, 255, 1), transparent 34%),
    linear-gradient(135deg, rgba(255, 244, 183, 0.92), rgba(221, 241, 255, 0.9));
  color: #2f351e;
  box-shadow:
    inset 0 1px 0 #fff,
    0 10px 28px rgba(154, 118, 18, 0.15),
    0 0 0 3px rgba(241, 207, 67, 0.11);
}

.filters .filter-interceptor svg {
  stroke: #8d6500;
}

.filters .filter-interceptor.active {
  border-color: #b28200;
  background:
    radial-gradient(circle at 18% 4%, #fff, transparent 33%),
    linear-gradient(135deg, rgba(255, 232, 112, 0.98), rgba(188, 232, 255, 0.94));
  color: #2c351d;
  box-shadow:
    inset 0 1px 0 #fff,
    0 15px 34px rgba(154, 118, 18, 0.2),
    0 0 0 4px rgba(241, 207, 67, 0.16);
}

.catalog-meta {
  display: flex;
  justify-content: space-between;
  gap: 28px;
  padding: 17px 2px;
}

.catalog-meta p:last-child {
  text-align: right;
}

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.catalog-card {
  min-width: 0;
  min-height: 310px;
  display: flex;
  flex-direction: column;
  padding: 26px;
  border: 1px solid var(--color-line);
  border-radius: var(--radius-medium);
  background: var(--color-paper);
}

.catalog-request {
  width: fit-content;
  margin-top: 20px;
}

.catalog-card h3 {
  font-size: 23px;
  line-height: 1.16;
  overflow-wrap: anywhere;
}

.catalog-card > p {
  margin-top: 20px;
  color: var(--color-muted);
}

.catalog-price-row {
  margin-top: auto;
  padding-top: 22px;
  border-top: 1px solid var(--color-line);
}

.catalog-price {
  color: var(--color-signal-deep);
  font-size: clamp(26px, 2.2vw, 34px);
  line-height: 1.08;
  font-weight: 400;
}

.catalog-card.shared-product {
  border-color: var(--color-signal);
  box-shadow: inset 0 0 0 2px var(--color-signal);
}

.catalog-card mark {
  background: #fff0a8;
  color: inherit;
}

.catalog-empty {
  grid-column: 1 / -1;
  padding: 42px;
  border: 1px solid var(--color-line);
  background: var(--color-paper);
}

.catalog-more {
  display: block;
  min-width: 230px;
  min-height: 58px;
  margin: 28px auto 0;
  padding: 10px 22px;
}

.catalog-more[hidden] {
  display: none;
}

.process-section {
  border-top: 1px solid var(--color-line);
  border-bottom: 1px solid var(--color-line);
  background: #f6f7f4;
  color: var(--color-ink);
}

.process-heading {
  display: block;
}

.process-list {
  border-top: 2px solid var(--color-ink);
}

.process-list article {
  display: grid;
  grid-template-columns: minmax(250px, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(40px, 8vw, 140px);
  padding: 28px 0;
  border-bottom: 1px solid var(--color-line);
}

.process-list h3 {
  font-size: 23px;
}

.process-list p {
  max-width: 730px;
  color: var(--color-muted);
}

.faq-section {
  background: var(--color-canvas);
}

.faq-layout {
  max-width: 1040px;
}

.faq-intro {
  margin-bottom: clamp(38px, 5vw, 64px);
  text-align: center;
}

.faq-intro h2 {
  font-size: clamp(42px, 5.4vw, 72px);
  line-height: 1;
  letter-spacing: -0.045em;
}

.faq-list {
  border-top: 2px solid var(--color-ink);
}

.faq-list > h3 {
  margin: 48px 0 8px;
  color: var(--color-signal-deep);
  font-size: 20px;
  line-height: 1.3;
}

.faq-list > h3:first-child {
  margin-top: 26px;
}

.faq-list details {
  position: relative;
  border-bottom: 1px solid var(--color-line-strong);
  transition: background-color 220ms ease;
}

.faq-list details::before {
  content: "";
  position: absolute;
  top: 17px;
  bottom: 17px;
  left: -18px;
  width: 3px;
  border-radius: 3px;
  background: linear-gradient(180deg, #63d89b, var(--color-signal-deep));
  opacity: 0;
  transform: scaleY(0.35);
  transform-origin: top;
  transition: opacity 180ms ease, transform 280ms cubic-bezier(0.2, 0.75, 0.25, 1);
}

.faq-list details[open] {
  background: linear-gradient(90deg, rgba(30, 149, 105, 0.075), rgba(30, 149, 105, 0) 68%);
}

.faq-list details[open]::before {
  opacity: 1;
  transform: scaleY(1);
}

.faq-list summary {
  position: relative;
  min-height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 16px 0;
  cursor: pointer;
  list-style: none;
  font-size: 22px;
  font-weight: 400;
}

.faq-list summary > span {
  max-width: 720px;
}

.faq-list summary i {
  position: relative;
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  filter: drop-shadow(0 4px 5px rgba(5, 88, 63, 0.16));
  transition: transform 240ms cubic-bezier(0.2, 0.8, 0.25, 1), filter 220ms ease;
}

.faq-list summary i::before,
.faq-list summary i::after {
  content: "";
  position: absolute;
  inset: 50% auto auto 50%;
  width: 30px;
  height: 7px;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(224, 255, 236, 0.56) 0%, rgba(224, 255, 236, 0.08) 42%, rgba(3, 67, 48, 0.2) 100%),
    linear-gradient(108deg, #064b39 0%, #0c7655 22%, #1eaa78 40%, #85e8b2 52%, #20ad7b 66%, #087052 84%, #043f31 100%);
  background-size: 100% 100%, 240% 100%;
  box-shadow: inset 0 1px 0 rgba(236, 255, 244, 0.72), inset 0 -1px 0 rgba(2, 55, 40, 0.28);
  transform: translate(-50%, -50%);
  animation: faq-plus-shimmer 3.8s ease-in-out infinite alternate;
}

.faq-list summary i::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.faq-list details[open] summary i {
  transform: rotate(45deg);
}

.faq-list summary:hover i {
  filter: drop-shadow(0 7px 8px rgba(5, 105, 74, 0.26));
  transform: translateY(-1px) scale(1.12);
}

.faq-list details[open] summary:hover i {
  transform: translateY(-1px) rotate(45deg) scale(1.12);
}

.faq-list summary:active i {
  filter: drop-shadow(0 2px 3px rgba(5, 88, 63, 0.14));
  transform: scale(0.9);
}

.faq-list details[open] summary:active i {
  transform: rotate(45deg) scale(0.9);
}

.faq-list summary:focus-visible {
  outline: 3px solid rgba(19, 120, 90, 0.32);
  outline-offset: 5px;
}

.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 300ms cubic-bezier(0.2, 0.75, 0.25, 1), opacity 200ms ease;
}

.faq-list details[open] .faq-answer {
  grid-template-rows: 1fr;
  opacity: 1;
}

.faq-answer p {
  min-height: 0;
  overflow: hidden;
  max-width: 880px;
  padding: 0 72px 30px 0;
  color: var(--color-muted);
  font-size: 17px;
}

@keyframes faq-plus-shimmer {
  from { background-position: 0 0, 105% 50%; }
  to { background-position: 0 0, -5% 50%; }
}

@media (max-width: 1120px) {
  .hero {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .hero-copy h1 {
    max-width: 900px;
  }

  .site-map {
    width: min(100%, 880px);
  }

  .midscale-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .midscale-grid article:nth-child(2) {
    border-right: 0;
  }

  .midscale-grid article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--color-line);
  }

  .catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .price-filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  :root {
    --section-space: 72px;
  }

  html {
    scroll-padding-top: 78px;
  }

  .site-header {
    min-height: 72px;
  }

  .nav {
    display: none;
  }

  .hero {
    gap: 44px;
    padding-block: 64px 74px;
  }

  .hero-copy h1 {
    font-size: clamp(42px, 9vw, 58px);
  }

  .object-size-grid {
    grid-template-columns: 1fr;
  }

  .section-heading,
  .compact-heading {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .section-heading h2,
  .request-heading h2 {
    font-size: clamp(39px, 8vw, 54px);
  }

  .solution-rows article {
    grid-template-columns: 1fr auto;
    gap: 14px 24px;
    padding-inline: 0;
  }

  .solution-copy {
    grid-column: 1 / -1;
  }

  .solution-rows .solution-price {
    grid-column: 2;
    grid-row: 1;
  }

  .request-heading {
    grid-template-columns: 1fr;
  }

  .request-heading a {
    justify-self: start;
  }

  .lead-form {
    grid-template-columns: 1fr;
  }

  .contact-method,
  .optional-details,
  .lead-submit,
  .form-status {
    grid-column: 1;
  }

  .signal-flow {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .signal-flow article:nth-child(2) {
    border-right: 0;
  }

  .signal-flow article:nth-child(-n + 2) {
    border-bottom: 1px solid var(--color-line);
  }

  .capability-tabs {
    grid-template-columns: repeat(3, 1fr);
  }

  .capability-tabs button:nth-child(3n) {
    border-right: 0;
  }

  .capability-tabs button:nth-child(-n + 3) {
    border-bottom: 1px solid var(--color-line);
  }

  .capability-view {
    grid-template-columns: 1fr;
  }

  .capability-visual {
    max-width: 620px;
  }

  .catalog-meta {
    display: grid;
  }

  .catalog-heading {
    grid-template-columns: 1fr;
  }

  .filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .catalog-meta p:last-child {
    text-align: left;
  }

  .process-list article {
    grid-template-columns: 1fr;
    gap: 12px;
  }

}

@media (max-width: 560px) {
  :root {
    --section-space: 60px;
  }

  .brand {
    font-size: 18px;
  }

  .brand img {
    width: 38px;
    height: 38px;
  }

  .hero {
    padding-block: 54px 64px;
  }

  .hero-copy h1 {
    font-size: 39px;
    line-height: 1.02;
  }

  .hero-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .primary-action,
  .hero .secondary-action {
    width: 100%;
    justify-content: center;
  }

  .site-map {
    border-radius: var(--radius-small);
  }

  .section-heading h2,
  .request-heading h2 {
    font-size: 39px;
  }

  .section-heading p,
  .request-heading p {
    font-size: 16px;
  }

  .solution-rows article {
    grid-template-columns: 1fr;
    gap: 9px;
    padding-block: 24px;
  }

  .object-size-grid article {
    min-height: 0;
    padding: 26px 20px;
  }

  .object-size-grid a {
    margin-top: 10px;
  }

  .solution-rows .solution-price {
    grid-column: 1;
    grid-row: auto;
    text-align: left;
  }

  .solution-copy {
    grid-column: 1;
  }

  .budget-action {
    align-items: stretch;
    flex-direction: column;
  }

  .budget-action .primary-action {
    width: 100%;
  }

  .share-action {
    align-self: flex-start;
  }

  .midscale-grid {
    grid-template-columns: 1fr;
  }

  .midscale-grid article,
  .midscale-grid article:nth-child(2) {
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid var(--color-line);
  }

  .midscale-grid article > p:not(.midscale-maker) {
    margin-top: 22px;
  }

  .midscale-grid strong {
    margin-top: 28px;
    padding-top: 0;
  }

  .lead-form {
    padding: 22px 18px;
    border-radius: var(--radius-medium);
  }

  .contact-method {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .method-option:last-child {
    grid-column: 1 / -1;
  }

  .method-option > span {
    min-height: 72px;
  }

  .optional-grid {
    grid-template-columns: 1fr;
  }

  .optional-grid .wide {
    grid-column: 1;
  }

  .lead-submit {
    width: 100%;
    min-width: 0;
  }

  .lead-context {
    align-items: flex-start;
    flex-direction: column;
  }

  .lead-context button,
  .lead-success button {
    width: 100%;
  }

  .lead-success dl div {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .signal-flow {
    grid-template-columns: 1fr;
  }

  .signal-flow article,
  .signal-flow article:first-child,
  .signal-flow article:nth-child(2) {
    min-height: 0;
    padding: 24px 0;
    border-right: 0;
    border-bottom: 1px solid var(--color-line);
  }

  .capability-tabs {
    grid-template-columns: repeat(2, 1fr);
  }

  .capability-tabs button,
  .capability-tabs button:nth-child(3n) {
    border-right: 1px solid var(--color-line);
    border-bottom: 1px solid var(--color-line);
  }

  .capability-tabs button:nth-child(even) {
    border-right: 0;
  }

  .capability-view {
    padding: 20px;
  }

  .capability-visual {
    max-width: none;
  }

  .capability-view h3 {
    font-size: 32px;
  }

  .capability-view dl div {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .catalog-toolbar {
    gap: 20px;
    padding: 16px;
    border-radius: 22px;
  }

  .price-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .filters {
    gap: 8px;
  }

  .filters button {
    min-height: 116px;
    grid-template-columns: 1fr;
    align-content: start;
    gap: 9px;
    padding: 15px;
  }

  .filters svg {
    width: 32px;
    height: 32px;
  }

  .filter-label {
    font-size: 17px;
  }

  .price-filters button {
    min-height: 58px;
    padding-inline: 12px;
  }

  .catalog-grid {
    grid-template-columns: 1fr;
  }

  .catalog-card {
    min-height: 0;
    padding: 22px;
  }

  .catalog-price-row {
    align-items: flex-start;
    flex-direction: column;
  }

  .faq-list summary {
    min-height: 74px;
    gap: 18px;
    font-size: 19px;
  }

  .faq-list summary i {
    width: 36px;
    height: 36px;
  }

  .faq-list details p {
    padding-right: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* Open product overview, September 2026. */
:root { --color-canvas: #fafbf8; --color-surface: #f2f5ef; --content-width: 1280px; }
body { font-size: 18px; }
.site-header { background: #fafbf8; }
.hero { display: grid; grid-template-columns: 1.05fr 1fr; gap: 48px; align-items: center; padding-block: 64px; min-height: 0; }
.hero-copy { max-width: none; padding: 0; }
.hero h1 { font-size: clamp(40px, 4.8vw, 70px); line-height: 1.08; letter-spacing: -.045em; max-width: 15ch; }
.hero-intro { font-size: 20px; line-height: 1.6; max-width: 38ch; margin-top: 28px; }
.hero-actions { margin-top: 30px; gap: 12px; flex-wrap: wrap; }
.hero .site-map { width: 100%; min-height: 0; margin: 0; border: 0; border-radius: 8px; box-shadow: none; }
.hero .site-map img { width: 100%; height: 470px; object-fit: cover; object-position: 54% center; }
.examples-section { background: #eef3ed; padding-block: 64px; border-block: 1px solid var(--color-line); }
.example-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.example-card { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding: 8px 24px 8px 0; border-right: 1px solid var(--color-line); }
.example-card:last-child { border-right: 0; }
.example-purpose { font-size: 26px; line-height: 1.25; letter-spacing: -.02em; }
.example-card h3 { font-size: 17px; color: var(--color-muted); }
.example-card > p:not([class]) { font-size: 18px; line-height: 1.6; }
.example-card .example-price { margin-top: auto; padding-top: 12px; font-size: 32px; }
.example-card .catalog-request { width: 100%; margin-top: 0; }
.device-nav { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-bottom: 48px; }
.device-nav a { display: inline-flex; align-items: center; min-height: 44px; border-bottom: 1px solid var(--color-line-strong); }
.device-story { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 64px; padding-block: 48px; border-top: 1px solid var(--color-line); scroll-margin-top: 100px; }
.device-story:nth-child(even) .device-picture { order: 2; }
.device-picture img { width: 100%; height: auto; border-radius: 8px; }
.device-copy { display: grid; gap: 20px; }
.device-label { color: var(--color-muted); font-size: 17px; }
.device-copy h3 { font-size: clamp(28px, 3vw, 42px); line-height: 1.15; letter-spacing: -.03em; }
.device-copy p { max-width: 55ch; }
.device-copy dl { display: grid; gap: 14px; }
.device-copy dl > div { display: grid; grid-template-columns: 110px 1fr; gap: 16px; border-top: 1px solid var(--color-line); padding-top: 12px; }
.device-copy dt { color: var(--color-muted); }
.device-copy .secondary-action { justify-self: start; margin-top: 6px; }
.object-size-grid article { border-radius: 0; background: transparent; box-shadow: none; }
.solution-rows .solution-price { display: block; font-size: 30px; white-space: nowrap; }
.catalog-toolbar { background: #f2f5ef; border-radius: 8px; box-shadow: none; }
.catalog-card { background: #fff; border-radius: 8px; box-shadow: none; }
.primary-action, .secondary-action, .catalog-request { min-height: 48px; }
@media (max-width: 1000px) {
  .hero { gap: 28px; }
  .hero .site-map img { height: 400px; }
  .device-story { gap: 32px; }
  .example-grid { gap: 20px; }
}
@media (max-width: 700px) {
  .hero { grid-template-columns: 1fr; gap: 32px; padding-block: 36px; }
  .hero h1 { font-size: 44px; }
  .hero-intro { font-size: 18px; margin-top: 22px; }
  .hero .site-map img { height: 240px; }
  .hero-actions { display: grid; grid-template-columns: 1fr; }
  .example-grid { grid-template-columns: 1fr; gap: 28px; }
  .example-card { border-right: 0; border-bottom: 1px solid var(--color-line); padding: 0 0 28px; }
  .example-card:last-child { border-bottom: 0; padding-bottom: 0; }
  .examples-section { padding-block: 44px; }
  .device-nav { gap: 6px 20px; margin-bottom: 24px; }
  .device-story { grid-template-columns: 1fr; gap: 24px; padding-block: 32px; }
  .device-story:nth-child(even) .device-picture { order: 0; }
  .device-copy dl > div { grid-template-columns: 1fr; gap: 4px; }
  .device-copy .secondary-action { width: 100%; }
  .solution-rows .solution-price { font-size: 28px; }
}

/* Contact choices share one light glass material. */
.request-section { background: #eef3ed; }
.lead-form { border: 1px solid #d2ddd4; border-radius: 24px; background: #fbfdf9; box-shadow: 0 16px 48px #264d3510; padding: clamp(22px, 3vw, 42px); }
.contact-method { gap: 12px; }
.method-option { --channel: 24, 111, 82; }
.method-telegram { --channel: 24, 119, 170; }
.method-whatsapp { --channel: 16, 126, 83; }
.method-sms { --channel: 70, 113, 50; }
.method-max { --channel: 84, 78, 164; }
.method-phone { --channel: 63, 98, 81; }
.method-option > span { position: relative; min-height: 94px; border-radius: 16px; border: 1px solid rgba(var(--channel), .23); background: linear-gradient(125deg, #fff 5%, rgba(var(--channel), .07) 60%, #fff 100%); color: #17251d; box-shadow: inset 0 1px 1px #fff, 0 4px 12px rgba(var(--channel), .06); backdrop-filter: blur(12px) saturate(1.12); transition: background-position 300ms ease, box-shadow 200ms ease, transform 160ms ease; background-size: 180% 180%; }
.method-option > span i { width: 36px; height: 36px; border: 0; box-shadow: none; background: transparent; color: rgb(var(--channel)); }
.method-name { font-size: 16px; font-weight: 400; }
.method-option:hover > span { background-position: 100% 60%; box-shadow: inset 0 1px 1px #fff, 0 5px 16px rgba(var(--channel), .13); }
.method-option input:checked + span { background: linear-gradient(125deg, #fff, rgba(var(--channel), .13), #f8fcf7); color: #17251d; border: 2px solid rgb(var(--channel)); box-shadow: inset 0 1px 1px #fff, 0 5px 16px rgba(var(--channel), .10); }
.method-option input:checked + span::after { content: '✓'; position: absolute; right: 8px; top: 5px; font-size: 16px; color: rgb(var(--channel)); }
.method-option input:focus-visible + span { outline: 3px solid #6c836f; outline-offset: 4px; }
.method-option:active > span { transform: scale(.98); }
.request-notes { grid-column: 1 / -1; border-top: 1px solid #d3ddd4; padding-top: 20px; }
.request-notes .optional-grid { padding-bottom: 4px; }
.lead-form .optional-grid label > small,
.lead-form .request-message > small { display: block; margin-top: 8px; color: #707b73; font-size: 15px; font-weight: 400; }
.form-progress { grid-column: 1 / -1; margin: 0; padding: 12px 16px; border: 1px solid #cfe0d2; border-radius: 12px; background: #f4f9f4; color: #3c4c40; font-size: 16px; font-weight: 400; }
.form-progress[data-state="ready"] { border-color: #cbdcc0; background: #f2f8ee; }
.request-notes > summary { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 6px 18px; min-height: 48px; cursor: pointer; list-style: none; }
.request-notes > summary::-webkit-details-marker { display: none; }
.request-notes > summary::after { content: '+'; font-size: 26px; color: #296648; }
.request-notes[open] > summary::after { content: '−'; }
.request-notes > summary span { color: #59695d; font-size: 16px; }
.request-notes-body { display: grid; gap: 20px; padding-top: 20px; }
.lead-form .lead-submit { display: flex; justify-content: center; gap: 16px; min-height: 60px; border-radius: 16px; border: 1px solid #a69b45; background: linear-gradient(120deg, #fff8c9 0%, #f5df86 45%, #e7efd6 100%); color: #19241c; box-shadow: inset 0 1px 1px #fff, 0 5px 16px #79723615; background-size: 170% 170%; }
.lead-form .lead-submit:hover { background-position: 100% 50%; box-shadow: inset 0 1px 1px #fff, 0 7px 20px #79723624; transform: translateY(-1px); }
.lead-form .lead-submit:active { transform: translateY(1px); }
.lead-form .lead-submit:disabled { opacity: .7; cursor: wait; }
.lead-form input:not([type=radio]), .lead-form textarea { background: #fff; border-radius: 12px; }
@media (max-width: 700px) {
 .contact-method { grid-template-columns: repeat(2, minmax(0,1fr)); }
 .method-option > span { min-height: 84px; }
 .method-option:last-child { grid-column: 1 / -1; }
 .request-notes > summary { justify-content: flex-start; }
 .request-notes > summary::after { margin-left: auto; }
}
@media (prefers-reduced-transparency: reduce) {
 .method-option > span { backdrop-filter: none; background: #f4f8f3; }
 .method-option input:checked + span { background: #eaf2e7; }
 .lead-form .lead-submit { background: #f4e6aa; }
}
@media (prefers-reduced-motion: reduce) {
 .method-option > span, .lead-form .lead-submit { transition: none; transform: none; }
}

/* The request stays short, with one required contact. */
.request-section { background:radial-gradient(ellipse at 15% 15%,#e5edcd,transparent 55%),#eff3eb; }
.request-layout { max-width:1080px; }
.request-heading { grid-template-columns:1fr; gap:16px; max-width:780px; margin-bottom:30px; }
.request-heading h2 { font-size:clamp(32px,4.1vw,52px); line-height:1.13; letter-spacing:-1.5px; }
.request-heading p { margin-top:16px; max-width:65ch; }
.request-heading a { justify-self:start; }
.lead-form { grid-template-columns:1fr 1fr; padding:36px; border:1px solid #cdd8bf; border-radius:28px; background:#ffffffd9; box-shadow:inset 0 1px 0 #fff,0 20px 60px #30422209; gap:24px; }
.contact-method { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.method-option > span { min-height:82px; border-radius:17px; border:1px solid #c4d1bf; background:linear-gradient(145deg,#fff,#f1f5eccc); box-shadow:inset 0 1px 0 #fff,0 3px 10px #324b2610; }
.method-option input:checked + span { background:linear-gradient(135deg,#f5f9ee,#e3edcf); border:2px solid #477032; box-shadow:inset 0 1px 0 #fff,0 5px 16px #3d662318; }
.method-option > span i { width:36px; height:36px; }
.method-option > span i svg { width:26px; height:26px; }
.lead-form .contact-field,.request-message { grid-column:1 / -1; }
.request-message > span { display:flex; align-items:baseline; gap:10px; }
.request-message small { font-size:16px; color:#65705c; }
.lead-form .contact-field input { min-height:60px; font-size:20px; border:1px solid #a9bb99; border-radius:14px; background:#fcfdf9; }
.lead-form textarea { min-height:94px; border:1px solid #bac9ab; background:#fcfdf9; }
.lead-form .lead-submit { min-height:66px; justify-content:space-between; padding-inline:24px; font-size:20px; border-radius:18px; border:1px solid #8f973e; background:linear-gradient(115deg,#f7edaa,#e9edb6 55%,#d9e9ba); box-shadow:inset 0 1px 0 #fff,0 6px 20px #65792620; }
.request-notes { padding-top:12px; }
.request-notes .optional-grid { padding-top:16px; }
@media(max-width:700px){.lead-form{padding:24px 20px;gap:20px;border-radius:24px}.contact-method{grid-template-columns:repeat(2,minmax(0,1fr))}.method-option>span{min-height:66px;flex-direction:row;gap:10px}.method-option:last-child{grid-column:1 / -1}.request-heading h2{letter-spacing:-1px}.lead-form .lead-submit{font-size:18px;padding-inline:18px}.request-heading{margin-bottom:24px}.request-message>span{flex-wrap:wrap}.lead-form .contact-field input{font-size:18px}}
@media(prefers-reduced-transparency:reduce){.lead-form{background:#fff}.method-option>span{background:#f5f7ee;backdrop-filter:none}}
.lead-form > .contact-method,.lead-form > .lead-submit,.lead-form > .optional-details,.lead-form > .form-status { grid-column:1 / -1; width:100%; }
.method-phone svg,.method-sms svg { stroke:currentColor; }
@media(max-width:700px){.lead-form{grid-template-columns:1fr}.method-option>span{padding:12px 8px}.method-option>span i{flex-shrink:0;width:28px;height:28px}.method-option input:checked+span::after{right:5px;top:2px}}
.lead-form .method-option > span { display:flex; flex-direction:column; align-items:center; justify-content:center; }
@media(min-width:370px) and (max-width:700px){.contact-method{grid-template-columns:repeat(6,minmax(0,1fr))}.method-option{grid-column:span 2}.method-option:nth-last-child(-n+2){grid-column:span 3}.lead-form .method-option>span{padding:12px 5px;gap:7px}}

/* Shared WhatsApp contact action. */
.whatsapp-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex: 0 0 auto;
  min-height: 76px;
  padding: 12px 20px;
  border: 1px solid #81b99e;
  border-radius: 20px;
  color: #123d2c;
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(218,243,228,.88));
  box-shadow: inset 0 1px 0 #fff, 0 5px 16px rgba(26,91,59,.09);
  backdrop-filter: blur(12px);
  font-size: 17px;
  line-height: 1.4;
  font-weight: 400;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.email-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex: 0 0 auto;
  min-height: 76px;
  padding: 12px 20px;
  border: 1px solid #81b99e;
  border-radius: 20px;
  color: #123d2c;
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(218,243,228,.88));
  box-shadow: inset 0 1px 0 #fff, 0 5px 16px rgba(26,91,59,.09);
  backdrop-filter: blur(12px);
  line-height: 1.4;
  font-weight: 400;
  text-decoration: none;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.email-contact:hover { border-color: #278657; box-shadow: inset 0 1px 0 #fff, 0 7px 20px rgba(26,91,59,.15); }
.email-contact:active { transform: translateY(1px); }
.email-contact:focus-visible { outline: 3px solid #087b43; outline-offset: 4px; }
/* Фирменный зелёный круг с белым глифом — так WhatsApp узнают, не читая подпись. */
.contact-badge { flex: 0 0 auto; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; }
.contact-badge svg { display: block; }
.contact-badge-whatsapp { background: #25d366; color: #fff; box-shadow: 0 2px 8px rgba(18,124,68,.28); }
.contact-badge-email { background: #0f6b45; color: #fff; box-shadow: 0 2px 8px rgba(15,107,69,.26); }
.contact-lines { display: grid; gap: 2px; }
.contact-action { font-size: 16px; color: #3f5147; }
.contact-value { display: block; font-size: 21px; font-weight: 500; color: #10331f; white-space: nowrap; letter-spacing: .01em; }
.header-contacts { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.site-header .whatsapp-contact,
.site-header .email-contact { min-height: 60px; padding: 8px 16px; gap: 11px; border-radius: 16px; }
.site-header .contact-action { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.site-header .contact-badge { width: 44px; height: 44px; }
.site-header .contact-badge svg { width: 27px; height: 27px; }
.site-header .contact-value { font-size: 19px; }
.site-header .whatsapp-contact-arrow { display: none; }
.whatsapp-contact-arrow { font-size: 24px; margin-left: 6px; }
.whatsapp-contact-arrow { font-size: 24px; margin-left: 6px; }
.whatsapp-contact:hover { border-color: #278657; box-shadow: inset 0 1px 0 #fff, 0 7px 20px rgba(26,91,59,.15); }
.whatsapp-contact:active { transform: translateY(1px); }
.whatsapp-contact:focus-visible { outline: 3px solid #087b43; outline-offset: 4px; }
.site-header { flex-wrap: wrap; gap: 12px 14px; padding-block: 10px; padding-inline: max(var(--page-gutter), calc((100vw - 1360px) / 2)); }
.site-header .brand img { width: 56px; height: 56px; }
.site-header .nav { flex: 0 1 auto; justify-content: center; flex-wrap: nowrap; gap: 4px 13px; white-space: nowrap; margin-inline: auto; }
@media (max-width: 1100px) {
  .site-header .nav { display: none; }
}
@media (max-width: 540px) {
  .site-header { position: relative; gap: 10px; padding-block: 12px; }
  .site-header .whatsapp-contact,
  .site-header .email-contact { width: 100%; }
  .header-contacts { width: 100%; gap: 10px; }
  .site-header .contact-action { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; clip-path: none; }
  .site-header .whatsapp-contact,
  .site-header .email-contact { min-height: 68px; justify-content: flex-start; }
  .contact-value { font-size: 19px; white-space: normal; overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .whatsapp-contact, .email-contact { transition: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .whatsapp-contact, .email-contact { background: #e8f5ec; backdrop-filter: none; }
}
@supports not (backdrop-filter: blur(12px)) {
  .whatsapp-contact, .email-contact { background: #e8f5ec; }
}

/* Readable layer, 10 September 2026: one font, one background, 18 px minimum, tight blocks. */
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/golos-text-cyrillic-ext.woff2") format("woff2"); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/golos-text-cyrillic.woff2") format("woff2"); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/golos-text-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Golos Text"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/golos-text-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root { --color-canvas: #f7f7f2; --color-surface: #f7f7f2; --section-space: 36px; }
body { font-family: "Golos Text", "Avenir Next", "Helvetica Neue", Arial, sans-serif; font-size: 18px; line-height: 1.55; background: var(--color-canvas); }
*, *::before, *::after { font-weight: 400 !important; }

.site-header, .hero, .examples-section, .capabilities-section, .objects-section, .solutions-section, .midscale-section, .signal-section, .catalog-section, .request-section, .faq-section, .seo-home-directory, .site-footer { background: var(--color-canvas); }
.site-header { border-bottom: 1px solid var(--color-line); }
.examples-section, .request-section, .midscale-section, .site-footer, .objects-section, .catalog-section { border-top: 1px solid var(--color-line); border-bottom: 0; }
.catalog-toolbar { background: #fff; border-radius: 12px; }
.lead-form { background: #fff; box-shadow: none; }
.catalog-card { background: #fff; }

.hero { padding-block: 36px; }
.examples-section, .capabilities-section, .objects-section, .solutions-section, .midscale-section, .signal-section, .request-section, .faq-section { padding-block: 36px; }
.catalog-section { padding-block: 36px; }
.section-heading { margin-bottom: 22px; gap: 20px 48px; }
.catalog-heading { margin-bottom: 18px; }
.request-heading { margin-bottom: 18px; }
.request-heading p { margin-top: 12px; }
.hero-intro { margin-top: 20px; }
.hero-actions { margin-top: 22px; }

.nav, .nav a, .site-footer nav a, .site-footer .ai-info-link, .contact-action, .method-name, .device-label, .example-card h3, .catalog-meta p, .catalog-filter-title, .filter, .filter-label, .filter-label small, .price-filter, .footer-legal, .footer-legal span, .dept-name, .dept-note, .footer-departments-head p, .footer-heritage p, .contact-method legend, .lead-form label > span, .lead-form small, .form-status, .lead-success p, .lead-success dt, .lead-success dd, .lead-success-status, .lead-context, .lead-context span, .lead-context button, .catalog-empty, .midscale-maker, .price-note, .section-heading p, .request-heading p, .capability-note, .catalog-card p, .faq-section p, .faq-section summary, .objects-section p, .solution-copy p, .signal-flow p, .midscale-grid p, .example-card p, .hero-intro, .seo-home-directory, .seo-home-directory a, .site-footer address, .footer-certifications li, .footer-patents dt, .footer-patents dd, .lead-form input, .lead-form textarea, .lead-form button, .catalog-request, small { font-size: 18px; }
.method-option input:checked + span::after { font-size: 18px; }
.method-email { --channel: 15, 107, 69; }
.contact-method { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.form-status:empty { display: none; }
.object-size-grid article a, .objects-section article a, .price-filters .price-filter, .contact-lines .contact-action, .footer-contacts .footer-email, .site-header .contact-action, .site-footer .contact-action { font-size: 18px; }

/* Corporate footer, 10 September 2026: one grid, site map from the SEO catalogue, departments, live office time. */
.site-footer { padding-block: 40px 22px; border-top: 1px solid var(--color-line); background: var(--color-canvas); color: var(--color-ink); }
.footer-shell { display: grid; gap: 30px; }
.footer-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 32px; }
.footer-brand-block { display: grid; gap: 10px; max-width: 560px; }
.footer-brand { width: fit-content; font-size: 20px; }
.footer-brand img { width: 44px; height: 44px; }
.footer-tagline { margin: 0; color: #3d4b43; font-size: 18px; line-height: 1.5; }
.footer-contacts-main { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 12px; }
.footer-contacts-main .whatsapp-contact, .footer-contacts-main .email-contact { min-height: 60px; padding: 8px 18px 8px 10px; gap: 11px; border-radius: 16px; }
.footer-contacts-main .contact-badge { width: 44px; height: 44px; }
.footer-contacts-main .contact-badge svg { width: 27px; height: 27px; }
.footer-contacts-main .contact-action { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.footer-contacts-main .contact-value { font-size: 19px; white-space: nowrap; }
.footer-contacts-main .whatsapp-contact-arrow { display: none; }

.footer-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px 28px; padding-top: 28px; border-top: 1px solid var(--color-line); }
.footer-sitemap { display: contents; }
.footer-col { min-width: 0; }
.footer-col summary { list-style: none; cursor: default; pointer-events: none; }
.footer-col summary::-webkit-details-marker { display: none; }
.footer-col h3 { margin: 0 0 12px; color: var(--color-ink); font-size: 18px; line-height: 1.3; letter-spacing: .01em; }
.footer-col ul { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.footer-col li { margin: 0; }
.footer-col li > a, .footer-col li > span, .footer-col li > address { display: block; min-height: 44px; padding: 9px 0; color: #3d4b43; font-size: 18px; line-height: 1.45; text-decoration: none; }
.footer-col li > a { transition: color .15s ease; }
.footer-col li > a:hover { color: var(--color-signal); }
.footer-col li > a:focus-visible { outline: 3px solid #087b43; outline-offset: 2px; border-radius: 6px; }
.footer-col address { font-style: normal; }
.footer-col-departments li > a { display: grid; gap: 2px; }
.footer-col-departments li > a > span:first-child { color: var(--color-ink); }
.dept-mail { color: var(--color-signal); overflow-wrap: anywhere; text-decoration: underline; text-decoration-color: rgba(11, 119, 86, .35); text-underline-offset: 4px; }
.footer-col-departments li > a:hover .dept-mail { text-decoration-color: var(--color-signal); }
.footer-company-name { color: var(--color-ink); }
.footer-office { color: var(--color-ink); }
.footer-office[data-office-state="open"] { color: var(--color-success); }

.footer-legal-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 28px; padding-top: 18px; border-top: 1px solid var(--color-line); }
.footer-legal { display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; color: #68736c; font-size: 18px; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 18px; }
.footer-nav a { display: inline-flex; align-items: center; min-height: 44px; color: #3d4b43; text-decoration: none; }
.footer-nav a:hover { color: var(--color-ink); }
.footer-nav a:focus-visible { outline: 3px solid #087b43; outline-offset: 2px; border-radius: 6px; }

@media (max-width: 1120px) {
  .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-col-company { grid-column: span 2; }
}

@media (max-width: 820px) {
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-col-company { grid-column: span 2; }
  .footer-contacts-main .contact-value { white-space: normal; overflow-wrap: anywhere; }
}

@media (max-width: 560px) {
  .site-footer { padding-block: 32px 18px; }
  .footer-shell { gap: 22px; }
  .footer-top { gap: 16px; }
  .footer-contacts-main { width: 100%; gap: 10px; }
  .footer-contacts-main .whatsapp-contact, .footer-contacts-main .email-contact { width: 100%; justify-content: flex-start; }
  .footer-contacts-main .contact-action { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; clip-path: none; }
  .footer-grid { grid-template-columns: 1fr; gap: 0; padding-top: 0; border-top: 0; }
  .footer-col-company { grid-column: auto; }
  .footer-col { border-top: 1px solid var(--color-line); }
  .footer-col summary { display: flex; align-items: center; justify-content: space-between; min-height: 56px; cursor: pointer; pointer-events: auto; }
  .footer-col summary::after { content: ""; width: 10px; height: 10px; margin-right: 6px; border-right: 1.5px solid #3d4b43; border-bottom: 1.5px solid #3d4b43; transform: rotate(45deg); }
  .footer-col[open] summary::after { transform: rotate(225deg); }
  .footer-col h3 { margin: 0; }
  .footer-col ul { padding-bottom: 12px; }
  .footer-col li > a, .footer-col li > span, .footer-col li > address { padding: 8px 0; }
  .footer-legal-row { padding-top: 16px; }
  .footer-nav { gap: 0 20px; }
}
.footer-certs > span { white-space: nowrap; }

/* ==== Шапка corporate-v3: служебная полоса (контакты, язык) + основная строка (бренд, навигация, одно действие). ==== */
.utility-bar { background: #eef0ea; border-bottom: 1px solid var(--color-line); color: var(--color-ink); }
.utility-inner { width: min(calc(100% - (var(--page-gutter) * 2)), 1360px); margin-inline: auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 28px; min-height: 52px; }
.utility-contacts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 32px; }
.utility-bar .whatsapp-contact,
.utility-bar .email-contact { min-height: 44px; padding: 4px 0; gap: 10px; border: 0; border-radius: 0; background: none; box-shadow: none; backdrop-filter: none; color: var(--color-ink); }
.utility-bar .whatsapp-contact:hover,
.utility-bar .email-contact:hover { box-shadow: none; transform: none; color: var(--color-signal-deep); }
.utility-bar .whatsapp-contact:hover .contact-value,
.utility-bar .email-contact:hover .contact-value { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--color-line-strong); }
.utility-bar .contact-badge { width: 30px; height: 30px; box-shadow: none; }
.utility-bar .contact-badge svg { width: 19px; height: 19px; }
.utility-bar .contact-action { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.utility-bar .contact-value { font-size: 18px; color: inherit; letter-spacing: 0; }
.utility-bar .whatsapp-contact-arrow { display: none; }
.lang-switch { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 4px 0; color: var(--color-ink); text-decoration: none; }
.lang-switch:hover { color: var(--color-signal-deep); }
.lang-switch:hover .lang-switch-text { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--color-line-strong); }
.lang-switch:focus-visible { outline: 3px solid #087b43; outline-offset: 3px; border-radius: 6px; }
.lang-switches { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 22px; }
.utility-bar .contact-badge-lang { width: 38px; height: 38px; background: var(--color-accent); color: #121714; box-shadow: 0 0 0 2px #121714 inset; }
.contact-badge-lang svg { width: 20px; height: 20px; }
.lang-badge-code { display: block; line-height: 1; letter-spacing: 0.02em; }
.lang-badge-en { font-size: 15px; }
.lang-badge-zh { font-size: 19px; }
.lang-switch-text { font-size: 18px; white-space: nowrap; }
.site-header { position: sticky; top: 0; min-height: 76px; flex-wrap: nowrap; gap: 16px 36px; padding-block: 8px; padding-inline: max(var(--page-gutter), calc((100vw - 1360px) / 2)); box-shadow: 0 6px 18px rgba(18, 23, 20, 0.05); }
.site-header .brand img { width: 52px; height: 52px; }
.site-header nav.nav { flex: 1 1 auto; justify-content: flex-start; margin-inline: 0; gap: 4px 26px; }
.header-action { flex: 0 0 auto; min-height: 50px; padding: 10px 22px; font-size: 18px; white-space: nowrap; }
.header-action:hover { transform: none; }
@media (max-width: 1100px) {
  .site-header nav.nav { display: none; }
  .site-header { justify-content: space-between; }
}
@media (max-width: 640px) {
  .header-action { display: none; }
  .site-header { position: relative; min-height: 68px; }
  .utility-inner { gap: 0 20px; padding-block: 2px; }
  .utility-contacts { gap: 0 20px; }
  .lang-switches { gap: 0 12px; }
  .lang-switch-text { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
}
@media (max-width: 460px) {
  .utility-inner { display: grid; grid-template-columns: 1fr auto; align-items: center; }
  .utility-contacts { display: grid; gap: 0; }
  .lang-switches { grid-column: 2; grid-row: 1; align-self: center; }
}

/* ==== Подвал corporate-v3: приглашение с контактами, карточка компании, колонка закупщика, выделенные заголовки. ==== */
.footer-cta { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 24px 48px; align-items: center; padding: 30px 32px; margin-bottom: 36px; border: 1px solid var(--color-line); border-radius: 14px; background: #fff; }
.footer-cta-copy { display: grid; gap: 14px; justify-items: start; }
.footer-cta h2 { margin: 0; font-size: clamp(24px, 2.2vw, 30px); line-height: 1.22; letter-spacing: -0.01em; color: var(--color-ink); }
.footer-cta p { margin: 0; color: #3d4b43; font-size: 18px; line-height: 1.5; }
.footer-cta .primary-action { margin-top: 6px; }
.footer-cta-contacts { display: grid; gap: 10px; justify-items: start; }
.footer-cta-label { color: #3d4b43; }
.footer-cta .footer-contacts-main { display: grid; gap: 10px; width: 100%; }
.footer-cta .whatsapp-contact, .footer-cta .email-contact { width: 100%; justify-content: flex-start; }
.footer-top { align-items: start; gap: 24px 48px; padding-bottom: 32px; }
.footer-company { display: grid; gap: 8px; max-width: 460px; }
.footer-company h3 { margin: 0 0 4px; }
.footer-company-name { margin: 0; color: var(--color-ink); font-size: 18px; }
.footer-company address { margin: 0; color: #3d4b43; font-style: normal; font-size: 18px; line-height: 1.45; }
.footer-certs { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 0; padding: 0; list-style: none; }
.footer-certs li { display: inline-flex; align-items: center; min-height: 36px; padding: 4px 12px; border: 1px solid var(--color-line-strong); border-radius: 999px; color: var(--color-ink); font-size: 18px; letter-spacing: .02em; }
.footer-office { margin: 4px 0 0; color: #3d4b43; font-size: 18px; }
.footer-office.is-open { color: var(--color-signal-deep); }
.footer-col h3, .footer-company h3 { position: relative; margin: 0 0 18px; padding-bottom: 10px; color: var(--color-ink); font-size: 18px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.footer-col h3::after, .footer-company h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 32px; height: 2px; background: var(--color-accent); }
.footer-col summary { margin: 0; }
.footer-legal-row { padding-top: 20px; }
@media (max-width: 980px) {
  .footer-cta { grid-template-columns: 1fr; padding: 24px; }
  .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .footer-col-company { grid-column: auto; }
}
@media (max-width: 760px) {
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .footer-cta { padding: 20px 18px; margin-bottom: 24px; gap: 18px; }
  .footer-grid { grid-template-columns: 1fr; }
  .footer-cta .primary-action { width: 100%; }
  .footer-top { padding-bottom: 20px; }
  .footer-company { max-width: none; }
  .footer-col h3 { margin: 0; padding-bottom: 0; text-transform: uppercase; }
  .footer-col h3::after { display: none; }
  .footer-col summary { min-height: 56px; }
}

/* ==== technical-seo-v1 (13.09.2026): тап-таргет заголовка карточки не меньше 44 px без сдвига макета; подпись каталога без JavaScript. ==== */
.catalog-card h3 a { display: inline-block; padding: 9px 0; margin: -9px 0; }
.catalog-noscript { margin: 0 0 20px; }

/* ==== zh-v1 (15.09.2026): китайская версия /zh/ — системные шрифты с иероглифами после Golos Text. ==== */
html[lang="zh-CN"] body { font-family: "Golos Text", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Source Han Sans SC", sans-serif; }

/* ==== form-brief-v1 (15.09.2026): три ряда кнопок вместо текстового поля, ответ до отправки, шесть каналов (WeChat). ==== */
.lead-form > .lead-brief { grid-column: 1 / -1; width: 100%; display: grid; gap: 14px; }
.lead-chips { margin: 0; padding: 0; border: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.lead-chips legend { float: left; width: 100%; margin-bottom: 4px; padding: 0; color: #465249; font-size: 18px; }
.chip { position: relative; cursor: pointer; }
.chip input { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; opacity: 0; pointer-events: none; }
.chip > span { display: inline-flex; align-items: center; min-height: 48px; padding: 10px 18px; border: 1px solid #b7c6b1; border-radius: 999px; background: #fff; color: #17251d; font-size: 18px; line-height: 1.2; white-space: nowrap; transition: border-color 140ms ease, background-color 140ms ease; }
.chip:hover > span { border-color: var(--color-signal-deep); }
.chip input:checked + span { border: 2px solid var(--color-signal); background: #e2efe8; color: var(--color-signal-deep); padding: 9px 17px; }
.chip input:focus-visible + span { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.lead-estimate { margin: 2px 0 0; padding: 14px 18px; border-left: 4px solid var(--color-accent); border-radius: 0 14px 14px 0; background: #fbf6dc; color: #17251d; font-size: 18px; line-height: 1.5; }
.lead-form .request-message > span small { font-size: 16px; color: #65705c; }
.method-wechat { --channel: 7, 193, 96; }
.contact-method { grid-template-columns: repeat(6, minmax(0, 1fr)); }
@media (max-width: 700px) {
  .contact-method { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .method-option, .method-option:last-child, .method-option:nth-last-child(-n+2) { grid-column: auto; }
  .lead-form .method-option > span { padding: 12px 6px; gap: 6px; }
  .chip > span { min-height: 46px; padding: 8px 14px; font-size: 18px; }
}
html[lang="zh-CN"] .chip > span, html[lang="zh-CN"] .method-name { letter-spacing: 0; }

/* ==== project-v1 (15.09.2026): проект защиты объекта за 70 000 ₽ — карточка сразу после первого экрана, только на русской главной. ==== */
.project-section { background: var(--color-canvas); padding-block: 0 36px; }
.project-card { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 28px 56px; padding: 34px 40px; border: 1px solid var(--color-line); border-left: 6px solid var(--color-accent); border-radius: 14px; background: #fff; }
.project-offer { display: grid; gap: 16px; align-content: start; justify-items: start; }
.project-offer h2 { margin: 0; font-size: clamp(28px, 2.6vw, 38px); line-height: 1.2; letter-spacing: -0.02em; color: var(--color-ink); }
.project-price { display: inline-block; padding: 2px 14px; border-radius: 10px; background: var(--color-accent); color: var(--color-ink); white-space: nowrap; }
.project-offer p { margin: 0; font-size: 18px; line-height: 1.55; color: #3d4b43; }
.project-offer p.project-who { color: var(--color-ink); }
.project-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 8px; }
.project-actions .primary-action { min-height: 56px; padding: 14px 26px; }
.project-actions-label { margin: 0; color: #3d4b43; }
.project-scope { display: grid; gap: 18px; align-content: start; padding: 22px 24px; border-radius: 12px; background: #f3f5ef; }
.project-scope h3 { position: relative; margin: 0; padding-bottom: 10px; color: var(--color-ink); font-size: 18px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.project-scope h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 32px; height: 2px; background: var(--color-accent); }
.project-steps { margin: 0; padding: 0; list-style: none; counter-reset: project-step; display: grid; gap: 14px; }
.project-steps li { position: relative; padding-left: 52px; font-size: 18px; line-height: 1.5; color: #3d4b43; counter-increment: project-step; }
.project-steps li::before { content: counter(project-step); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--color-ink); border-radius: 50%; background: #fff; color: var(--color-ink); font-size: 18px; line-height: 1; }
.project-step-title { color: var(--color-ink); }
.project-terms { margin: 0; padding-top: 16px; border-top: 1px solid var(--color-line); font-size: 18px; line-height: 1.5; color: #3d4b43; }
.project-terms-price { color: var(--color-ink); white-space: nowrap; }
@media (max-width: 980px) {
  .project-card { grid-template-columns: 1fr; padding: 26px 24px; gap: 24px; }
}
@media (max-width: 560px) {
  .project-card { padding: 20px 16px; border-left-width: 5px; }
  .project-offer h2 { font-size: 26px; }
  .project-actions { display: grid; grid-template-columns: 1fr; gap: 12px; }
  .project-actions .primary-action { width: 100%; }
  .project-contacts { display: grid; width: 100%; }
  .project-contacts .whatsapp-contact, .project-contacts .email-contact { width: 100%; justify-content: flex-start; }
}

/* ==== project-v2 (15.09.2026): вторая карточка — антидроновая защита крыши за 6 900 ₽/м². ==== */
.roof-scope-inline { display: grid; gap: 14px; width: 100%; margin-top: 6px; }
.project-inline-title { position: relative; margin: 0; padding-bottom: 10px; color: var(--color-ink); font-size: 18px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.project-inline-title::after { content: ""; position: absolute; left: 0; bottom: 0; width: 32px; height: 2px; background: var(--color-accent); }
.roof-target-list { display: grid; gap: 0; margin: 0; padding: 0; border-top: 1px solid var(--color-line); }
.roof-target-list > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 4px 16px; padding: 9px 0; border-bottom: 1px solid var(--color-line); }
.roof-target-list dt { margin: 0; color: var(--color-ink); font-size: 18px; line-height: 1.45; }
.roof-target-list dd { margin: 0; color: #3d4b43; font-size: 18px; line-height: 1.45; }
.roof-actions { display: grid; justify-items: start; gap: 12px; margin-top: 10px; }
.roof-actions .roof-actions-note { max-width: 60ch; line-height: 1.5; }
.project-note { margin: 0; font-size: 18px; line-height: 1.5; color: #3d4b43; }
.roof-start { display: grid; gap: 10px; }
.roof-start h3 { padding-bottom: 0; }
.roof-start h3::after { display: none; }
.roof-start p { margin: 0; }
@media (max-width: 560px) {
  .roof-target-list > div { grid-template-columns: 1fr; gap: 2px; }
  .roof-actions .roof-actions-note { max-width: none; }
}
/* project-v2: шестой пункт навигации («Проект») не помещается в шапку до 1220 px — прячем навигацию раньше, чем на 1100 px. */
@media (max-width: 1220px) {
  .site-header nav.nav { display: none; }
  .site-header { justify-content: space-between; }
}

/* ==== project-v3 (15.09.2026): расчёт сетки по площади, мобильная панель, список-бюджет, ссылки для плана после заявки, подсказка канала. ==== */
.budget-hint { margin: -6px 0 18px; color: #3d4b43; font-size: 18px; }
.solution-rows article { grid-template-columns: minmax(220px, 0.9fr) minmax(0, 1.8fr) minmax(150px, 0.5fr) auto; }
.solution-pick { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 8px 14px; border: 1px solid var(--color-line-strong); border-radius: 999px; background: #fff; color: var(--color-ink); font-size: 18px; line-height: 1.2; white-space: nowrap; cursor: pointer; }
.solution-pick input { width: 20px; height: 20px; margin: 0; accent-color: var(--color-signal); cursor: pointer; }
.solution-pick:has(input:focus-visible) { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.solution-rows article.is-picked { background: #eef5ee; }
.solution-rows article.is-picked .solution-pick { border-color: var(--color-signal); background: #e2efe8; color: var(--color-signal-deep); }
.budget-summary { position: sticky; bottom: 12px; z-index: 5; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 24px; align-items: center; margin-top: 18px; padding: 16px 22px; border: 1px solid var(--color-line); border-left: 6px solid var(--color-accent); border-radius: 14px; background: #fff; box-shadow: 0 10px 30px rgba(18, 23, 20, 0.08); }
.budget-summary[hidden] { display: none; }
.budget-summary-text { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px; margin: 0; color: var(--color-ink); font-size: 18px; }
.budget-total { font-size: 22px; }
.budget-summary-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.budget-clear { min-height: 48px; padding: 10px 16px; border: 1px solid var(--color-line-strong); border-radius: 4px; background: #fff; color: var(--color-ink); font: inherit; font-size: 18px; cursor: pointer; }
.contact-hint { display: block; margin-top: 6px; color: var(--color-signal-deep); font-size: 18px; }
.contact-hint[hidden] { display: none; }
.lead-success-attach { display: grid; gap: 10px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--color-line); }
.lead-success-attach p { margin: 0; }
.lead-success-attach-links { display: flex; flex-wrap: wrap; gap: 10px; }
.lead-attach-link { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 8px 16px; border: 1px solid #81b99e; border-radius: 999px; background: #fff; color: #123d2c; font-size: 18px; text-decoration: none; }
.lead-attach-link:hover { border-color: #278657; }
.lead-attach-link svg { width: 24px; height: 24px; color: #0f6b45; }
.lead-attach-whatsapp svg { color: #128c4b; }
.mobile-bar { display: none; }
@media (max-width: 640px) {
  .mobile-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: grid; grid-template-columns: minmax(0, 1fr) 56px; gap: 10px; align-items: center; padding: 10px 16px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--color-line); background: rgba(247, 247, 242, 0.96); backdrop-filter: blur(8px); }
  .mobile-bar[hidden] { display: none; }
  .mobile-bar-main { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding: 12px 16px; border: 1px solid #c7a91e; border-radius: 4px; background: var(--color-accent); color: #171b18; font-size: 18px; text-decoration: none; }
  .mobile-bar-whatsapp { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff; }
  .mobile-bar-whatsapp svg { width: 30px; height: 30px; }
  body.has-mobile-bar { padding-bottom: 84px; }
  .solution-rows article { grid-template-columns: 1fr; }
  .budget-summary { grid-template-columns: 1fr; bottom: 92px; }
  .budget-summary .primary-action, .budget-clear { width: 100%; }
}

/* ==== form-v4 (15.09.2026): чипы «Что интересует» — чекбоксы в том же стиле, что и радиокнопки брифа. ==== */
.lead-chips-interest .chip input:checked + span { border: 2px solid var(--color-signal); background: #e2efe8; color: var(--color-signal-deep); padding: 9px 17px; }
.lead-roof-area { display: grid; gap: 10px; }
.lead-roof-area[hidden] { display: none; }
.lead-roof-area-field { display: grid; gap: 6px; }
.lead-roof-area-field span { color: #465249; font-size: 18px; }
.lead-form .lead-roof-area-field input { width: 100%; max-width: 220px; }

/* ==== header-v4 (16.09.2026): телефон вверху и внизу, спокойная служебная полоса, меню на узких экранах, плитки устройств, группы цен, контрастные форма и фильтры. ==== */
/* Телефон: общий вид как у WhatsApp и почты, тёмный круглый бейдж с трубкой. */
.phone-contact { display: inline-flex; align-items: center; justify-content: center; gap: 14px; flex: 0 0 auto; min-height: 76px; padding: 12px 20px; border: 1px solid #81b99e; border-radius: 20px; color: #123d2c; background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(218,243,228,.88)); box-shadow: inset 0 1px 0 #fff, 0 5px 16px rgba(26,91,59,.09); font-size: 17px; line-height: 1.4; text-decoration: none; }
.phone-contact:hover { border-color: #278657; box-shadow: inset 0 1px 0 #fff, 0 7px 20px rgba(26,91,59,.15); }
.phone-contact:active { transform: translateY(1px); }
.phone-contact:focus-visible { outline: 3px solid #087b43; outline-offset: 4px; }
.contact-badge-phone { background: #1d2622; color: #fff; box-shadow: 0 2px 8px rgba(18,23,20,.22); }
.footer-contacts-main .phone-contact { min-height: 60px; padding: 8px 18px 8px 10px; gap: 11px; border-radius: 16px; }
.footer-cta .phone-contact { width: 100%; justify-content: flex-start; }
.footer-company-phone { display: inline-flex; align-items: center; width: fit-content; min-height: 44px; margin-top: 2px; color: var(--color-ink); font-size: 20px; text-decoration: none; border-bottom: 1px solid var(--color-line-strong); }
.footer-company-phone:hover { border-color: var(--color-ink); }

/* Служебная полоса: три тихих контакта слева, языки справа. */
.utility-inner { min-height: 48px; gap: 6px 24px; }
.utility-contacts { gap: 4px 26px; }
.utility-bar .phone-contact { min-height: 44px; padding: 4px 0; gap: 10px; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--color-ink); font-size: 18px; }
.utility-bar .phone-contact:hover { box-shadow: none; transform: none; color: var(--color-signal-deep); }
.utility-bar .phone-contact:hover .contact-value { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--color-line-strong); }

/* Основная строка: бренд, навигация, действие и кнопка меню (кнопка видна, когда навигация не помещается). */
.site-header { min-height: 80px; gap: 16px 32px; }
.header-actions { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.menu-toggle { display: none; align-items: center; gap: 10px; min-height: 50px; padding: 8px 14px; border: 1px solid var(--color-line-strong); border-radius: 4px; background: #fff; color: var(--color-ink); font: inherit; font-size: 18px; line-height: 1; cursor: pointer; }
.menu-toggle:hover { border-color: var(--color-ink); }
.menu-toggle:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.menu-toggle-bars { display: grid; gap: 4px; width: 22px; }
.menu-toggle-bars i { display: block; height: 2px; border-radius: 2px; background: currentColor; }
@media (max-width: 1220px) { .menu-toggle { display: inline-flex; } }

/* Меню на весь экран: разделы, контакты, одно действие. */
.site-menu { position: fixed; inset: 0; z-index: 140; overflow-y: auto; background: var(--color-canvas); }
.site-menu[hidden] { display: none; }
.site-menu-inner { width: min(calc(100% - (var(--page-gutter) * 2)), 720px); margin-inline: auto; display: grid; gap: 26px; padding-block: 10px 40px; }
.site-menu-head { display: flex; align-items: center; justify-content: space-between; min-height: 64px; }
.site-menu-brand { font-size: 19px; }
.site-menu-brand img { width: 44px; height: 44px; }
.menu-close { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 6px 14px; border: 1px solid var(--color-line-strong); border-radius: 4px; background: #fff; color: var(--color-ink); font: inherit; font-size: 18px; cursor: pointer; }
.menu-close:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.menu-close-mark { font-size: 26px; line-height: 1; }
.site-menu-nav { display: grid; }
.site-menu-nav a { display: flex; align-items: center; min-height: 60px; border-top: 1px solid var(--color-line); color: var(--color-ink); font-size: 24px; line-height: 1.2; text-decoration: none; }
.site-menu-nav a:last-child { border-bottom: 1px solid var(--color-line); }
.site-menu-nav a:hover { color: var(--color-signal-deep); }
.site-menu-contacts { display: grid; gap: 10px; }
.site-menu-contacts .phone-contact, .site-menu-contacts .whatsapp-contact, .site-menu-contacts .email-contact { width: 100%; justify-content: flex-start; min-height: 64px; padding: 8px 16px 8px 10px; gap: 12px; border-radius: 16px; }
.site-menu-contacts .contact-badge { width: 44px; height: 44px; }
.site-menu-contacts .contact-badge svg { width: 27px; height: 27px; }
.site-menu-contacts .whatsapp-contact-arrow { display: none; }
.site-menu-contacts .contact-value { font-size: 19px; white-space: normal; overflow-wrap: anywhere; }
.site-menu-action { width: 100%; }
body.menu-open { overflow: hidden; }

/* Телефон и до 640 px: шапка липкая и низкая, в служебной полосе телефон с номером, WhatsApp и почта иконками. */
@media (max-width: 640px) {
  .site-header { position: sticky; top: 0; min-height: 64px; padding-block: 6px; }
  .site-header .brand { font-size: 19px; }
  .site-header .brand img { width: 44px; height: 44px; }
  .menu-toggle { min-height: 46px; padding: 6px 12px; }
  .utility-inner { display: flex; flex-wrap: nowrap; justify-content: space-between; gap: 8px; min-height: 52px; padding-block: 4px; }
  .utility-contacts { display: flex; flex-wrap: nowrap; gap: 6px; }
  .utility-bar .whatsapp-contact, .utility-bar .email-contact { gap: 0; }
  .utility-bar .whatsapp-contact .contact-value, .utility-bar .email-contact .contact-value { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
  .utility-bar .contact-badge { width: 40px; height: 40px; }
  .utility-bar .contact-badge svg { width: 24px; height: 24px; }
  .utility-bar .phone-contact .contact-value { font-size: 18px; white-space: nowrap; }
  .lang-switches { gap: 0 8px; }
  .utility-bar .contact-badge-lang { width: 40px; height: 40px; }
  .mobile-bar { grid-template-columns: minmax(0, 1fr) 56px 56px; }
  .mobile-bar-phone { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #1d2622; color: #fff; }
  .mobile-bar-phone svg { width: 28px; height: 28px; }
}
@media (max-width: 460px) {
  .utility-inner { display: flex; }
  .utility-contacts { display: flex; }
  .utility-bar .email-contact { display: none; }
  .lang-switches { grid-column: auto; }
}

/* Устройства: шесть плиток с картинками и крупными подписями. */
.device-nav { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-bottom: 44px; } /* funnel-v1: пять плиток — микрофоны и сетка ушли в свои блоки выше */
.device-note { margin: 0; font-size: 18px; }
.device-note a { color: var(--color-ink); text-decoration: underline; text-underline-offset: 4px; text-decoration-color: var(--color-accent); text-decoration-thickness: 2px; }
.device-nav a { display: grid; gap: 12px; align-content: start; min-height: 0; padding: 10px 10px 14px; border: 1px solid var(--color-line); border-radius: 12px; background: #fff; color: var(--color-ink); font-size: 20px; line-height: 1.25; text-decoration: none; }
.device-nav a:hover { border-color: var(--color-ink); }
.device-nav a:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.device-nav img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }
.device-nav span { display: block; padding-inline: 4px; }
@media (max-width: 1120px) { .device-nav { display: flex; flex-wrap: wrap; justify-content: center; } .device-nav a { flex: 0 1 calc((100% - 28px) / 3); } }
@media (max-width: 700px) { .device-nav { gap: 10px; margin-bottom: 28px; } .device-nav a { flex-basis: calc((100% - 10px) / 2); font-size: 18px; padding: 8px 8px 12px; } }

/* Цены: четыре группы по задаче, под названием — что это за устройство, описание темнее. */
.solution-group { margin: 0; padding: 26px 18px 10px; border-bottom: 1px solid var(--color-line); color: var(--color-ink); font-size: 18px; line-height: 1.3; letter-spacing: .08em; text-transform: uppercase; }
.solution-rows .solution-group:first-child { padding-top: 18px; }
.solution-rows article > div:first-child p { margin-top: 6px; color: #3d4b43; font-size: 18px; line-height: 1.4; }
.solution-copy { color: #2c3630; }
@media (max-width: 700px) { .solution-group { padding-inline: 0; } }

/* Форма: белая карточка с тёмной рамкой, тёмные границы полей, жёлтая кнопка как в шапке. */
.request-section { background: #e6ebe3; }
.lead-form { border: 1px solid #8e9991; border-radius: 20px; background: #fff; box-shadow: 0 24px 60px rgba(18, 23, 20, 0.12); }
.lead-form-kicker { grid-column: 1 / -1; width: fit-content; margin: 0 0 -4px; padding: 6px 14px; border-radius: 999px; background: var(--color-ink); color: #fff; font-size: 18px; letter-spacing: .04em; }
.lead-form .contact-field input, .lead-form textarea, .lead-form .optional-grid input, .lead-form .lead-roof-area-field input { border: 1px solid #6f7d74; background: #fff; }
.lead-form .contact-field input:focus, .lead-form textarea:focus, .lead-form .optional-grid input:focus, .lead-form .lead-roof-area-field input:focus { border-color: var(--color-ink); outline: 3px solid var(--color-accent); outline-offset: 2px; }
.lead-form .chip > span { border-color: #6f7d74; }
.lead-form .chip:hover > span { border-color: var(--color-ink); }
.contact-method legend, .lead-chips legend, .lead-form label > span, .request-message > span { color: var(--color-ink); }
.lead-form .lead-submit { border: 1px solid #b0921a; background: var(--color-accent); color: var(--color-ink); font-size: 21px; box-shadow: 0 6px 20px rgba(200, 160, 20, 0.28); }
.lead-form .lead-submit:hover { background: #e9c62f; box-shadow: 0 8px 24px rgba(200, 160, 20, 0.34); }
/* Каналы ответа: иконка в скруглённом квадрате фирменного цвета, выбранный — рамка того же цвета. */
.method-phone { --channel: 29, 38, 34; }
.method-whatsapp { --channel: 37, 211, 102; }
.method-telegram { --channel: 42, 171, 238; }
.method-wechat { --channel: 7, 193, 96; }
.method-email { --channel: 15, 107, 69; }
.method-sms { --channel: 52, 199, 89; }
.method-option > span { min-height: 96px; border: 1px solid #b9c4bb; background: #fff; box-shadow: none; }
.method-option > span i { width: 46px; height: 46px; border-radius: 12px; background: rgb(var(--channel)); color: #fff; box-shadow: 0 2px 8px rgba(var(--channel), .35); }
.method-option > span i svg { width: 28px; height: 28px; }
.method-option:hover > span { border-color: rgb(var(--channel)); background: #fff; box-shadow: 0 4px 14px rgba(var(--channel), .18); }
.method-option input:checked + span { border: 2px solid rgb(var(--channel)); background: rgba(var(--channel), .08); box-shadow: none; }
.method-option input:checked + span::after { color: rgb(var(--channel)); font-size: 18px; }
.method-name { color: var(--color-ink); }
@media (prefers-reduced-transparency: reduce) { .method-option > span { background: #fff; } .method-option input:checked + span { background: rgba(var(--channel), .08); } .lead-form .lead-submit { background: var(--color-accent); } }

/* Каталог: белая панель, кнопки с тёмной рамкой, выбранная — тёмная с белым текстом. */
.catalog-toolbar { padding: clamp(18px, 2vw, 26px); border: 1px solid #b9c4bb; border-radius: 16px; background: #fff; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.catalog-filter-title { color: var(--color-ink); }
.filters button, .price-filters button { border: 1px solid #b9c4bb; border-radius: 12px; background: #fff; color: var(--color-ink); box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.filters button::after, .price-filters button::after { display: none; }
.filters button { min-height: 76px; }
.filters button:hover, .price-filters button:hover { border-color: var(--color-ink); background: #fff; box-shadow: none; transform: none; }
.filters button.active, .price-filters button.active { border-color: var(--color-ink); background: var(--color-ink); color: #fff; box-shadow: none; }
.filters button.active:hover, .price-filters button.active:hover { background: var(--color-ink); color: #fff; }
.filters svg { stroke: var(--color-signal-deep); }
.filters button.active svg { stroke: #fff; }
.filter-label { font-size: 18px; }
.price-filters button { min-height: 52px; font-size: 18px; }

/* ==== header-v4.1 (16.09.2026, $ui polish): спокойная шапка — служебная полоса без цветных дисков, одна линия вместо тени, воздух между пунктами. ==== */
.utility-bar { background: #e9ece5; border-bottom: 1px solid var(--color-line); }
.utility-inner { min-height: 44px; gap: 4px 24px; }
.utility-contacts { gap: 4px 30px; }
.utility-bar .phone-contact, .utility-bar .whatsapp-contact, .utility-bar .email-contact { gap: 8px; color: #2c3630; }
.utility-bar .contact-badge { width: 26px; height: 26px; background: transparent; box-shadow: none; color: var(--color-ink); }
.utility-bar .contact-badge svg { width: 21px; height: 21px; }
.utility-bar .contact-badge-whatsapp { color: #1aa84f; }
.utility-bar .contact-badge-email { color: var(--color-signal-deep); }
.utility-bar .contact-badge-phone { color: var(--color-ink); }
.utility-bar .contact-value { color: inherit; }
.utility-bar .phone-contact .contact-value { color: var(--color-ink); }
.utility-bar .phone-contact:hover, .utility-bar .whatsapp-contact:hover, .utility-bar .email-contact:hover { color: var(--color-signal-deep); }
.lang-switches { gap: 4px 20px; }
.lang-switch { gap: 8px; color: #2c3630; }
.utility-bar .contact-badge-lang { width: 30px; height: 30px; background: #fff; color: var(--color-ink); box-shadow: 0 0 0 1px var(--color-line-strong) inset; }
.lang-switch:hover .contact-badge-lang { box-shadow: 0 0 0 1.5px var(--color-ink) inset; }
.lang-badge-en { font-size: 14px; letter-spacing: .04em; }
.lang-badge-zh { font-size: 17px; }

.site-header { min-height: 84px; gap: 16px 40px; padding-block: 10px; border-bottom: 1px solid var(--color-line); background: rgba(247, 247, 242, 0.94); box-shadow: none; }
.site-header .brand { gap: 12px; font-size: 21px; }
.site-header .brand img { width: 48px; height: 48px; }
.site-header nav.nav { gap: 4px 30px; margin-left: 8px; color: #35443b; }
.site-header .nav a { padding-block: 2px; border-bottom-width: 2px; }
.site-header .nav a:hover { border-color: var(--color-ink); }
.header-action { min-height: 48px; padding: 9px 20px; box-shadow: none; }

@media (max-width: 640px) {
  .utility-inner { min-height: 48px; }
  .utility-contacts { gap: 4px 10px; }
  .utility-bar .contact-badge { width: 40px; height: 40px; }
  .utility-bar .contact-badge svg { width: 26px; height: 26px; }
  .utility-bar .whatsapp-contact, .utility-bar .email-contact { min-width: 44px; justify-content: center; }
  .utility-bar .contact-badge-lang { width: 38px; height: 38px; }
  .lang-switches { gap: 0 6px; }
}
@media (max-width: 640px) {
  .utility-contacts { flex: 1 1 auto; min-width: 0; }
  .lang-switches { flex: 0 0 auto; flex-wrap: nowrap; }
}
@media (max-width: 400px) {
  .utility-bar .phone-contact .contact-badge { display: none; }
  .utility-contacts { gap: 4px 6px; }
}
/* Узкие телефоны (320–360 px): fieldset по умолчанию не уже своего содержимого — снимаем, чтобы чипы формы переносились. */
.lead-form fieldset, .lead-brief, .lead-chips { min-width: 0; }
.chip > span { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.footer-cta, .footer-top, .footer-brand-block, .footer-cta-copy, .footer-cta-contacts { min-width: 0; }
.footer-tagline, .footer-cta h2, .footer-cta p { overflow-wrap: anywhere; }
@media (max-width: 400px) { .footer-contacts-main .contact-value, .site-menu-contacts .contact-value { font-size: 18px; } }

/* Acoustic detection block (RU-only): auto-rotating pictures, no controls */
.acoustic-section { padding-block: 0 36px; }
.project-card-acoustic { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 28px 56px; }
.acoustic-head { grid-column: 1 / -1; display: grid; gap: 12px; }
.acoustic-head h2 { margin: 0; font-size: clamp(28px, 2.6vw, 38px); line-height: 1.2; letter-spacing: -0.02em; color: var(--color-ink); }
.acoustic-head p { margin: 0; font-size: 18px; line-height: 1.55; color: var(--color-ink); }
.acoustic-slides { grid-column: 1 / -1; display: grid; margin: 0; border-radius: 12px; overflow: hidden; background: #e9ece6; }
.acoustic-slide { grid-area: 1 / 1; margin: 0; display: grid; opacity: 0; transition: opacity .9s ease; pointer-events: none; }
.acoustic-slide.is-active { opacity: 1; pointer-events: auto; }
.acoustic-slide img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.acoustic-slide figcaption { padding: 12px 18px 14px; font-size: 18px; line-height: 1.45; color: var(--color-ink); background: #f3f5ef; }
.acoustic-offer { gap: 16px; }
.acoustic-scope { gap: 16px; }
.acoustic-scope h3 + h3, .acoustic-scope .project-steps + h3 { margin-top: 8px; }
.acoustic-notes > div { grid-template-columns: minmax(0, .55fr) minmax(0, 1.45fr); }
.acoustic-products { grid-column: 1 / -1; display: grid; gap: 18px; padding-top: 22px; border-top: 1px solid var(--color-line); }
.acoustic-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.acoustic-product { display: grid; gap: 8px; align-content: start; padding: 18px 20px; border: 1px solid var(--color-line); border-radius: 12px; background: #fff; }
.acoustic-product-kind { margin: 0; font-size: 18px; line-height: 1.3; color: var(--color-muted); }
.acoustic-product h4 { margin: 0; font-size: 24px; line-height: 1.25; letter-spacing: -.02em; color: var(--color-ink); }
.acoustic-product p { margin: 0; font-size: 18px; line-height: 1.5; color: #3d4b43; }
.acoustic-product-price { margin-top: auto; padding-top: 6px; font-size: 26px; line-height: 1.2; color: var(--color-ink); }
.acoustic-product .catalog-request { width: 100%; margin-top: 4px; }
@media (prefers-reduced-motion: reduce) { .acoustic-slide { transition: none; } }
@media (max-width: 1120px) { .acoustic-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .project-card-acoustic { grid-template-columns: 1fr; gap: 24px; } .acoustic-notes > div { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .acoustic-head h2 { font-size: 26px; } .acoustic-product-grid { grid-template-columns: 1fr; gap: 12px; } .acoustic-slide figcaption { padding: 10px 14px 12px; } }

/* ==== faq-v2 (16.09.2026): 20 вопросов в шести темах, навигация по темам, крупный солидный плюс, ссылка на ответ, штамп даты проверки, чек-лист закупщика. ==== */
.faq-layout { max-width: 1080px; }
.faq-intro { margin-bottom: 30px; }
.faq-lead { max-width: 760px; margin: 18px auto 0; color: var(--color-muted); line-height: 1.5; }
.faq-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 0 30px; }
.faq-nav a { min-height: 46px; display: inline-flex; align-items: center; padding: 0 20px; border: 1.5px solid var(--color-ink); border-radius: 999px; background: #fff; color: var(--color-ink); font-size: 18px; line-height: 1.2; text-decoration: none; transition: background-color 160ms ease, color 160ms ease, transform 160ms ease; }
.faq-nav a:hover { background: var(--color-ink); color: #fff; transform: translateY(-1px); }
.faq-nav a:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.faq-list { border-top: 2px solid var(--color-ink); counter-reset: faqGroup; }
.faq-list > h3 { display: flex; align-items: baseline; gap: 14px; margin: 46px 0 6px; padding-top: 0; color: var(--color-ink); font-size: 22px; line-height: 1.25; scroll-margin-top: 112px; counter-increment: faqGroup; }
.faq-list > h3::before { content: counter(faqGroup, decimal-leading-zero); flex: 0 0 auto; color: var(--color-signal-deep); font-size: 18px; letter-spacing: 0.08em; }
.faq-list > h3:first-child { margin-top: 28px; }
.faq-list details { scroll-margin-top: 104px; }
.faq-list summary { min-height: 86px; gap: 28px; padding: 18px 0; font-size: 22px; line-height: 1.3; }
.faq-list summary > span { max-width: 800px; }
.faq-list summary i { width: 54px; height: 54px; border-radius: 50%; background: var(--color-ink); filter: none; box-shadow: 0 6px 16px rgba(18, 23, 20, 0.18); transition: transform 280ms cubic-bezier(0.2, 0.8, 0.25, 1), background-color 200ms ease, box-shadow 200ms ease; }
.faq-list summary i::before, .faq-list summary i::after { width: 24px; height: 4px; border-radius: 2px; background: #fff; background-size: auto; box-shadow: none; animation: none; }
.faq-list details[open] summary i { background: var(--color-signal-deep); transform: rotate(45deg); }
.faq-list summary:hover i { filter: none; box-shadow: 0 10px 22px rgba(18, 23, 20, 0.24); transform: scale(1.06); }
.faq-list details[open] summary:hover i { transform: rotate(45deg) scale(1.06); }
.faq-list summary:active i { filter: none; transform: scale(0.94); }
.faq-list details[open] summary:active i { transform: rotate(45deg) scale(0.94); }
.faq-list summary:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 4px; }
.faq-list details[open] { background: linear-gradient(90deg, rgba(7, 84, 63, 0.06), rgba(7, 84, 63, 0) 72%); }
.faq-answer-inner { min-height: 0; overflow: hidden; }
.faq-answer p { min-height: auto; overflow: visible; max-width: 860px; padding: 0 84px 16px 0; color: #2f3a34; line-height: 1.55; }
.faq-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; max-width: 860px; padding: 4px 84px 28px 0; }
.faq-stamp { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border: 1px solid var(--color-line-strong); border-radius: 999px; color: var(--color-muted); font-size: 18px; line-height: 1; white-space: nowrap; }
.faq-stamp::before { content: ""; width: 9px; height: 9px; border-radius: 50%; background: var(--color-signal); }
.faq-link { min-height: 44px; padding: 0; border: 0; background: none; color: var(--color-signal-deep); font-size: 18px; line-height: 1.2; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1.5px; cursor: pointer; }
.faq-link:hover { color: var(--color-ink); }
.faq-link:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; border-radius: 4px; }
.faq-link.is-copied, .faq-copy-checklist.is-copied { text-decoration: none; color: var(--color-ink); }
.faq-checklist { display: grid; gap: 16px; margin-top: 56px; padding: 36px 40px 34px; border: 2px solid var(--color-ink); border-radius: 20px; background: #fff; }
.faq-checklist h3 { margin: 0; font-size: clamp(24px, 2.4vw, 30px); line-height: 1.2; letter-spacing: -0.02em; color: var(--color-ink); }
.faq-checklist > p { margin: 0; max-width: 760px; color: var(--color-muted); line-height: 1.5; }
.faq-checklist ol { margin: 8px 0 0; padding: 0; list-style: none; columns: 2; column-gap: 44px; counter-reset: faqCheck; }
.faq-checklist li { position: relative; padding: 9px 0 9px 48px; break-inside: avoid; color: var(--color-ink); font-size: 18px; line-height: 1.45; counter-increment: faqCheck; border-top: 1px solid var(--color-line); }
.faq-checklist li::before { content: counter(faqCheck, decimal-leading-zero); position: absolute; left: 0; top: 10px; color: var(--color-signal-deep); font-size: 18px; letter-spacing: 0.08em; }
.faq-checklist-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: 8px; }
.faq-copy-checklist { font: inherit; font-size: 18px; }
.faq-ask { min-height: 44px; display: inline-flex; align-items: center; color: var(--color-ink); font-size: 18px; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1.5px; }
.faq-ask:hover { color: var(--color-signal-deep); }
@media (max-width: 900px) { .faq-checklist ol { columns: 1; } }
@media (max-width: 640px) {
  .faq-intro { margin-bottom: 22px; }
  .faq-nav { justify-content: flex-start; gap: 8px; margin-bottom: 22px; }
  .faq-nav a { min-height: 44px; padding: 0 16px; }
  .faq-list > h3 { margin: 36px 0 4px; font-size: 20px; scroll-margin-top: 96px; }
  .faq-list details { scroll-margin-top: 88px; }
  .faq-list summary { min-height: 74px; gap: 16px; padding: 14px 0; font-size: 19px; }
  .faq-list summary i { width: 46px; height: 46px; box-shadow: 0 4px 12px rgba(18, 23, 20, 0.16); }
  .faq-list summary i::before, .faq-list summary i::after { width: 20px; height: 4px; }
  .faq-answer p, .faq-tools { padding-right: 0; }
  .faq-tools { padding-bottom: 24px; }
  .faq-stamp { white-space: normal; line-height: 1.2; }
  .faq-checklist { margin-top: 40px; padding: 26px 20px 24px; border-radius: 16px; }
  .faq-checklist li { padding-left: 40px; }
  .faq-checklist-actions .primary-action { width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .faq-list summary i, .faq-nav a { transition: none; } }

/* Roof block video (RU-only): vertical clip in a quiet frame, custom controls, autoplay only in view */
.roof-media { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: 28px 48px; align-items: start; padding-top: 26px; border-top: 1px solid var(--color-line); }
.video-player { position: relative; width: 100%; max-width: 340px; aspect-ratio: 9 / 16; overflow: hidden; border-radius: 18px; background: #0f1512; box-shadow: 0 18px 40px rgba(15, 21, 18, .18), 0 2px 6px rgba(15, 21, 18, .12); outline: none; }
.video-player:focus-visible { box-shadow: 0 0 0 3px var(--color-accent), 0 18px 40px rgba(15, 21, 18, .18); }
.video-player-media { display: block; width: 100%; height: 100%; object-fit: cover; background: #0f1512; }
.video-player-big { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 84px; height: 84px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--color-ink); box-shadow: 0 10px 30px rgba(0, 0, 0, .28); cursor: pointer; transform: translate(-50%, -50%); transition: transform .2s ease, opacity .25s ease, background .2s ease; }
.video-player-big:hover { background: #fff; transform: translate(-50%, -50%) scale(1.05); }
.video-player-big:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.video-player-big svg { margin-left: 3px; fill: currentColor; }
.video-player.is-playing .video-player-big { opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.9); }
.video-player .video-icon-pause { display: none; }
.video-player.is-playing .video-player-button .video-icon-pause { display: block; }
.video-player.is-playing .video-player-button .video-icon-play { display: none; }
.video-player-bar { position: absolute; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 6px; padding: 26px 10px 10px; background: linear-gradient(to top, rgba(10, 14, 12, .78), rgba(10, 14, 12, 0)); color: #fff; opacity: 0; transition: opacity .25s ease; }
.video-player:hover .video-player-bar, .video-player:focus-within .video-player-bar, .video-player.is-paused .video-player-bar, .video-player.is-touched .video-player-bar { opacity: 1; }
.video-player-button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 12px; background: transparent; color: #fff; cursor: pointer; }
.video-player-button:hover { background: rgba(255, 255, 255, .14); }
.video-player-button:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 1px; }
.video-player-button svg { fill: currentColor; }
.video-player-seek { width: 100%; height: 44px; margin: 0; background: transparent; cursor: pointer; -webkit-appearance: none; appearance: none; --video-progress: 0%; }
.video-player-seek:focus-visible { outline: 2px solid var(--color-accent); outline-offset: -6px; border-radius: 8px; }
.video-player-seek::-webkit-slider-runnable-track { height: 4px; border-radius: 2px; background: linear-gradient(to right, var(--color-accent) var(--video-progress), rgba(255, 255, 255, .35) var(--video-progress)); }
.video-player-seek::-moz-range-track { height: 4px; border-radius: 2px; background: rgba(255, 255, 255, .35); }
.video-player-seek::-moz-range-progress { height: 4px; border-radius: 2px; background: var(--color-accent); }
.video-player-seek::-webkit-slider-thumb { width: 14px; height: 14px; margin-top: -5px; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .4); -webkit-appearance: none; appearance: none; }
.video-player-seek::-moz-range-thumb { width: 14px; height: 14px; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .4); }
.video-player-time { padding: 0 4px; font-size: 18px; line-height: 1; color: #fff; white-space: nowrap; font-variant-numeric: tabular-nums; }
.video-player:fullscreen { max-width: none; border-radius: 0; }
.video-player:fullscreen .video-player-media { object-fit: contain; }
.roof-media-copy { display: grid; gap: 16px; align-content: start; }
.roof-media-copy p { margin: 0; font-size: 18px; line-height: 1.55; color: #3d4b43; }
.roof-media-list > div { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
.roof-media-copy .secondary-action { justify-self: start; }
@media (prefers-reduced-motion: reduce) { .video-player-big, .video-player-bar { transition: none; } }
@media (min-width: 901px) { .roof-media { align-items: center; } .roof-media-copy { align-self: center; } } /* roof-text-v1 (16.09.2026): без абзаца правая колонка короче видео — держим её по центру, без пустоты снизу */
@media (max-width: 900px) { .roof-media { grid-template-columns: 1fr; gap: 22px; } .video-player { max-width: 360px; margin: 0 auto; } .roof-media-list > div { grid-template-columns: 1fr; } }
@media (hover: none) { .video-player-bar { opacity: 1; } }

/* ==== acoustic-v2 (16.09.2026): две колонки без пустот — картинки в левой колонке (около 60 % ширины), текст справа; шаги и калькулятор узлов рядом; таблица слоёв; «что вы получаете» в карточках. ==== */
.project-card-acoustic { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 28px 44px; align-items: stretch; }
.acoustic-media { display: grid; gap: 16px; align-content: start; }
.acoustic-slides { grid-column: auto; }
.acoustic-notes { border-top: 1px solid var(--color-line); }
.acoustic-notes > div { grid-template-columns: 132px minmax(0, 1fr); gap: 2px 14px; padding: 10px 0; }
.acoustic-notes dt { font-size: 18px; color: var(--color-ink); }
.acoustic-notes dd { font-size: 18px; line-height: 1.45; color: #3d4b43; }
.acoustic-offer { gap: 16px; align-content: start; }
.acoustic-scope, .acoustic-calc { gap: 16px; }
.acoustic-calc-lead, .acoustic-calc-note { margin: 0; font-size: 18px; line-height: 1.5; color: #3d4b43; }
.acoustic-calc-field { display: grid; gap: 8px; }
.acoustic-calc-field > span { font-size: 18px; color: var(--color-ink); }
.acoustic-calc-field input { width: 100%; min-height: 56px; padding: 12px 16px; border: 1.5px solid var(--color-ink); border-radius: 12px; background: #fff; color: var(--color-ink); font: inherit; font-size: 20px; }
.acoustic-calc-field input:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 2px; }
.acoustic-calc-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.acoustic-calc-presets button { min-height: 44px; padding: 0 16px; border: 1.5px solid var(--color-ink); border-radius: 999px; background: #fff; color: var(--color-ink); font: inherit; font-size: 18px; cursor: pointer; transition: background-color 160ms ease, color 160ms ease; }
.acoustic-calc-presets button:hover, .acoustic-calc-presets button.is-active { background: var(--color-ink); color: #fff; }
.acoustic-calc-presets button:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 2px; }
.acoustic-calc-result { margin: 0; }
.acoustic-compare { grid-column: 1 / -1; display: grid; gap: 18px; padding-top: 22px; border-top: 1px solid var(--color-line); }
.layer-table { width: 100%; border-collapse: collapse; font-size: 18px; line-height: 1.4; }
.layer-table th, .layer-table td { padding: 12px 14px 12px 0; border-bottom: 1px solid var(--color-line); text-align: left; vertical-align: top; font-weight: 400; }
.layer-table thead th { padding-top: 0; color: var(--color-muted); font-size: 18px; letter-spacing: 0.02em; }
.layer-table tbody th { color: var(--color-ink); width: 32%; }
.layer-table td { color: #3d4b43; }
.layer-table td.layer-yes { color: var(--color-signal-deep); }
.layer-table td.layer-no { color: var(--color-muted); }
.layer-table td.layer-price { color: var(--color-ink); font-size: 20px; }
.layer-table td.layer-yes::before, .layer-table td.layer-part::before, .layer-table td.layer-no::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 9px; border-radius: 50%; vertical-align: 1px; background: var(--color-signal); }
.layer-table td.layer-part::before { background: var(--color-accent); box-shadow: 0 0 0 1px #c7a91e inset; }
.layer-table td.layer-no::before { background: #fff; box-shadow: 0 0 0 1.5px var(--color-line-strong) inset; }
.acoustic-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.acoustic-product { gap: 10px; padding: 22px 24px; }
.acoustic-includes-title { margin: 6px 0 0; padding-top: 12px; border-top: 1px solid var(--color-line); color: var(--color-ink); font-size: 18px; }
.acoustic-includes { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.acoustic-includes li { position: relative; padding-left: 22px; font-size: 18px; line-height: 1.45; color: #3d4b43; }
.acoustic-includes li::before { content: ""; position: absolute; left: 0; top: 10px; width: 9px; height: 9px; border-radius: 50%; background: var(--color-signal); }
.acoustic-product .acoustic-product-price { margin-top: auto; padding-top: 10px; }
@media (max-width: 1120px) { .acoustic-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .project-card-acoustic { grid-template-columns: 1fr; gap: 24px; }
  .acoustic-notes > div { grid-template-columns: 1fr; }
  .acoustic-product-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .layer-table thead { display: none; }
  .layer-table tr { display: grid; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--color-line); }
  .layer-table th, .layer-table td { display: block; padding: 0; border: 0; width: auto; }
  .layer-table tbody th { padding-bottom: 4px; }
  .layer-table td::after { content: ""; }
  .layer-table td[data-layer]::before { content: attr(data-layer) ": "; display: inline; width: auto; height: auto; margin: 0; border-radius: 0; background: none; box-shadow: none; color: var(--color-muted); }
}
@media (max-width: 640px) { .acoustic-product { padding: 18px 16px; } .acoustic-calc-presets button { flex: 1 1 calc(50% - 8px); } }
/* acoustic-v2.1: колонки без пустот — слева картинки и шаги (шаги растягиваются до высоты правой колонки), справа текст и «что учесть»; ниже таблица слоёв и калькулятор. */
.acoustic-media { grid-template-rows: auto 1fr; gap: 20px; }
.acoustic-side { display: grid; align-content: start; gap: 20px; }
.acoustic-side .acoustic-notes { border-top: 1px solid var(--color-line); }
.acoustic-side .acoustic-notes > div { grid-template-columns: 1fr; gap: 2px; padding: 12px 0; }
.acoustic-compare { grid-column: auto; padding-top: 0; border-top: 0; }
.acoustic-calc { align-content: start; }
.layer-table tbody th { width: 30%; }
.layer-table th, .layer-table td { padding-right: 10px; }
@media (max-width: 900px) {
  .acoustic-media, .acoustic-side { display: contents; }
  .acoustic-slides { order: 1; }
  .acoustic-offer { order: 2; }
  .acoustic-side .acoustic-notes { order: 3; }
  .acoustic-scope { order: 4; }
  .acoustic-calc { order: 5; }
  .acoustic-compare { order: 6; }
  .acoustic-products { order: 7; }
}
/* includes-v1 (16.09.2026): «Что вы получаете» в карточках каталога — свёрнутый список, раскрывается кликом. */
.catalog-includes { margin: 0 0 12px; }
.catalog-includes summary { min-height: 44px; display: inline-flex; align-items: center; gap: 10px; cursor: pointer; list-style: none; color: var(--color-signal-deep); font-size: 18px; text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1.5px; }
.catalog-includes summary::-webkit-details-marker { display: none; }
.catalog-includes summary::before { content: ""; width: 10px; height: 10px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translateY(-3px); transition: transform 200ms ease; }
.catalog-includes[open] summary::before { transform: rotate(225deg) translateY(-1px); }
.catalog-includes summary:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 3px; }
.catalog-includes ul { margin: 10px 0 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.catalog-includes li { position: relative; padding-left: 22px; font-size: 18px; line-height: 1.45; color: #3d4b43; }
.catalog-includes li::before { content: ""; position: absolute; left: 0; top: 10px; width: 9px; height: 9px; border-radius: 50%; background: var(--color-signal); }

/* ==== request-bottom (16.09.2026): вторая, короткая форма после «Вопросов и ответов» — тёмная полоса и белая карточка с жёлтой рамкой, чтобы отличалась от основной формы и была заметна в конце длинной страницы. ==== */
.request-section-bottom { background: var(--color-ink); border-top: 0; border-bottom: 0; }
.request-section-bottom .request-heading h2, .request-section-bottom .request-heading p { color: #fff; }
.request-section-bottom .lead-form { border: 3px solid var(--color-accent); background: #fff; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.request-section-bottom .lead-form-kicker { background: var(--color-accent); color: var(--color-ink); }
.request-section-bottom .lead-success { border-color: var(--color-accent); box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.request-section-bottom .lead-success-short p { margin: 0; }
.request-section-bottom .lead-success-short h3 { margin: 10px 0 6px; font-size: clamp(28px, 3vw, 40px); letter-spacing: .02em; }
.request-section-bottom .lead-success-short > div { margin-top: 18px; }
/* acoustic-v2.2: ряды равной высоты — картинки | текст, шаги | калькулятор (панели с рамкой), таблица и «что учесть» во всю ширину. */
.acoustic-media { grid-template-rows: auto; }
.project-card-acoustic .acoustic-scope, .project-card-acoustic .acoustic-calc { border: 1px solid var(--color-line); background: #eef1ea; }
.acoustic-compare { grid-column: 1 / -1; padding-top: 22px; border-top: 1px solid var(--color-line); }
.project-card-acoustic .acoustic-notes { grid-column: 1 / -1; border-top: 1px solid var(--color-line); }
.project-card-acoustic .acoustic-notes > div { grid-template-columns: 150px minmax(0, 1fr); gap: 2px 18px; padding: 12px 0; }
.layer-table tbody th { width: 34%; }
@media (max-width: 900px) {
  .acoustic-media, .acoustic-scope, .acoustic-offer, .acoustic-calc, .acoustic-compare, .acoustic-products, .project-card-acoustic .acoustic-notes { order: 0; display: grid; }
  .acoustic-media { display: block; }
  .project-card-acoustic .acoustic-notes > div { grid-template-columns: 1fr; }
}

/* ==== header-v5 (18.09.2026): солидная шапка — тёмная служебная полоса с контактами и флагами языков (в два раза заметнее),
   основная строка выше, бренд и кнопка крупнее. Одна разметка для /, /eng/, /zh/ и /ar/ (scripts/lang-switches.cjs). ==== */
.utility-bar { background: #172420; border-bottom: 1px solid #0e1613; color: #e9ede9; }
.utility-inner { min-height: 60px; gap: 4px 28px; padding-block: 4px; }
.utility-contacts { gap: 4px 30px; }
.utility-bar .phone-contact, .utility-bar .whatsapp-contact, .utility-bar .email-contact { color: #e9ede9; }
.utility-bar .contact-value, .utility-bar .phone-contact .contact-value { color: #f4f6f3; }
.utility-bar .contact-badge { width: 28px; height: 28px; color: #f4f6f3; }
.utility-bar .contact-badge svg { width: 22px; height: 22px; }
.utility-bar .contact-badge-phone { color: #f4f6f3; }
.utility-bar .contact-badge-whatsapp { color: #4ade80; }
.utility-bar .contact-badge-email { color: var(--color-accent); }
.utility-bar .phone-contact:hover, .utility-bar .whatsapp-contact:hover, .utility-bar .email-contact:hover { color: #fff; }
.utility-bar .phone-contact:hover .contact-value, .utility-bar .whatsapp-contact:hover .contact-value, .utility-bar .email-contact:hover .contact-value { text-decoration-color: var(--color-accent); }
.lang-switches { gap: 4px 26px; }
.lang-switch { gap: 12px; min-height: 52px; color: #f4f6f3; }
.lang-switch:hover { color: #fff; }
.lang-switch:hover .lang-switch-text { text-decoration-color: var(--color-accent); }
.lang-switch:focus-visible { outline-color: var(--color-accent); }
.lang-flag { display: inline-grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; border-radius: 50%; overflow: hidden; background: #fff; box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.9), 0 2px 8px rgba(0, 0, 0, 0.45); transition: box-shadow .15s ease, transform .15s ease; }
.lang-flag svg { display: block; width: 100%; height: 100%; }
.lang-switch:hover .lang-flag { box-shadow: 0 0 0 2px var(--color-accent), 0 2px 10px rgba(0, 0, 0, 0.5); transform: translateY(-1px); }
.lang-switch-text { font-size: 19px; }

.site-header { min-height: 96px; gap: 16px 40px; padding-block: 12px; background: #fff; border-bottom: 1px solid var(--color-line); box-shadow: 0 10px 28px rgba(18, 23, 20, 0.07); }
.site-header .brand { gap: 14px; font-size: 24px; letter-spacing: -0.01em; }
.site-header .brand img { width: 60px; height: 60px; }
.site-header nav.nav { gap: 4px 34px; margin-inline: 10px 0; font-size: 19px; color: #2c3630; }
.site-header .nav a { padding-block: 4px; }
.header-action { min-height: 54px; padding: 12px 26px; font-size: 19px; box-shadow: 0 0 0 1px rgba(18, 23, 20, 0.18) inset; }
.menu-toggle { min-height: 50px; }

@media (max-width: 640px) {
  .utility-inner { min-height: 60px; padding-block: 4px; }
  .utility-contacts { gap: 4px 8px; }
  .utility-bar .contact-badge { width: 42px; height: 42px; }
  .utility-bar .contact-badge svg { width: 26px; height: 26px; }
  .lang-switches { gap: 0 10px; }
  .lang-flag { width: 40px; height: 40px; }
  .site-header { min-height: 72px; padding-block: 8px; }
  .site-header .brand { font-size: 21px; gap: 10px; }
  .site-header .brand img { width: 48px; height: 48px; }
}
@media (max-width: 400px) {
  .lang-switches { gap: 0 6px; }
  .lang-flag { width: 38px; height: 38px; }
}

/* ==== Арабская версия /ar/: письмо справа налево. Флексы и гриды зеркалятся сами, ниже — правила с физическими сторонами. ==== */
@font-face { font-family: "Noto Sans Arabic"; font-style: normal; font-weight: 400; font-display: swap; src: url("/assets/fonts/noto-sans-arabic.woff2") format("woff2"); unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
html[dir="rtl"] body { font-family: "Golos Text", "Noto Sans Arabic", "Segoe UI", "Geeza Pro", Tahoma, Arial, sans-serif; }
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3 { letter-spacing: 0; line-height: 1.35; }
html[dir="rtl"] .solution-rows .solution-price, html[dir="rtl"] .catalog-meta p:last-child { text-align: left; }
html[dir="rtl"] .capability-tabs button, html[dir="rtl"] .filters button, html[dir="rtl"] .layer-table th, html[dir="rtl"] .layer-table td { text-align: right; }
html[dir="rtl"] .optional-details summary::after { right: auto; left: 8px; }
html[dir="rtl"] .signal-flow article:first-child { padding-left: 0; padding-right: 0; }
html[dir="rtl"] .object-size-grid { border-left: 0; border-right: 1px solid var(--color-line); }
html[dir="rtl"] .faq-list details::before { left: auto; right: -18px; }
html[dir="rtl"] .method-option input:checked + span::after { right: auto; left: 8px; }
html[dir="rtl"] .request-notes > summary::after { margin-left: 0; margin-right: auto; }
html[dir="rtl"] .whatsapp-contact-arrow { margin-left: 0; margin-right: 6px; transform: scaleX(-1); }
html[dir="rtl"] .footer-col h3::after, html[dir="rtl"] .footer-company h3::after { left: auto; right: 0; }
html[dir="rtl"] .lead-estimate { border-left: 0; border-right: 4px solid var(--color-accent); border-radius: 14px 0 0 14px; }
html[dir="rtl"] .site-header nav.nav { margin-inline: 10px 0; }
html[dir="rtl"] .faq-checklist li::before { left: auto; right: 0; }
html[dir="rtl"] .catalog-includes li { padding-left: 0; padding-right: 22px; }
html[dir="rtl"] .catalog-includes li::before { left: auto; right: 0; }
html[dir="rtl"] .footer-col summary::after { margin-right: 0; margin-left: 6px; }
html[dir="rtl"] .lang-switch-text, html[dir="rtl"] .footer-lang { unicode-bidi: isolate; }
html[dir="rtl"] input[type="tel"], html[dir="rtl"] input[type="email"], html[dir="rtl"] input[inputmode="tel"], html[dir="rtl"] input[inputmode="email"] { direction: ltr; text-align: right; }
html[dir="rtl"] .lead-form input, html[dir="rtl"] .lead-form textarea { text-align: right; }
html[dir="rtl"] .contact-value, html[dir="rtl"] .footer-contacts-main .contact-value, html[dir="rtl"] .seo-contact-value { direction: ltr; unicode-bidi: isolate; }
html[dir="rtl"] .form-trap { left: auto !important; right: -10000px !important; } /* в RTL отрицательный left расширяет прокрутку страницы влево */
html[dir="rtl"] .footer-company-phone, html[dir="rtl"] .footer-lang, html[dir="rtl"] .whatsapp-contact .contact-value, html[dir="rtl"] .footer-certs > span, html[dir="rtl"] .lead-attach a, html[dir="rtl"] .catalog-card h3 { direction: ltr; unicode-bidi: isolate; }
html[dir="rtl"] .footer-company-phone { display: inline-block; }

/* ==== de-v1 (18.09.2026): пятый язык в служебной полосе. На узких экранах четыре флага по 40 px плюс номер телефона
   не помещаются в 390 px — до 430 px телефон показываем значком (как WhatsApp), номер остаётся в мобильной панели и подвале. ==== */
@media (max-width: 430px) {
  .utility-bar .phone-contact { gap: 0; }
  .utility-bar .phone-contact .contact-badge { display: inline-grid; }
  .utility-bar .phone-contact .contact-value { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
  .lang-switches { gap: 0 8px; }
}

/* ==== hero-v6 (18.09.2026): солидный первый экран. Тёмная полоса во всю ширину, фото объекта под затемнением,
   надзаголовок с жёлтой чертой, крупный заголовок и полоса фактов (решения, типы устройств, размеры объектов,
   сертификаты). Строка «Подберём оборудование…» и две кнопки сняты по команде владельца; действие — в шапке. ==== */
.hero { position: relative; display: block; min-height: 0; padding: 0; background: #0f1a15; color: #f4f6f2; overflow: hidden; isolation: isolate; }
.hero .site-map { position: absolute; inset: 0; z-index: 0; width: auto; min-height: 0; margin: 0; border: 0; border-radius: 0; background: #0f1a15; box-shadow: none; overflow: hidden; }
.hero .site-map picture, .hero .site-map img { display: block; width: 100%; height: 100%; }
.hero .site-map img { object-fit: cover; object-position: 74% 50%; filter: saturate(0.82) contrast(1.04); }
.hero .site-map::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15, 26, 21, 0.96) 0%, rgba(15, 26, 21, 0.9) 30%, rgba(15, 26, 21, 0.55) 58%, rgba(15, 26, 21, 0.2) 100%), linear-gradient(180deg, rgba(15, 26, 21, 0.2) 0%, rgba(15, 26, 21, 0) 45%, rgba(15, 26, 21, 0.86) 100%); }
.hero-copy { position: relative; z-index: 1; display: flex; flex-direction: column; width: min(calc(100% - (var(--page-gutter) * 2)), var(--content-width)); min-height: clamp(560px, calc(100vh - 156px), 780px); margin-inline: auto; padding: clamp(56px, 7vw, 104px) 0 clamp(40px, 4.5vw, 60px); }
.hero-eyebrow { display: flex; align-items: flex-start; gap: 16px; margin: 0 0 26px; color: #e3e8e1; font-size: 18px; line-height: 1.3; letter-spacing: 0.1em; text-transform: uppercase; }
.hero-eyebrow::before { content: ""; flex: none; width: 44px; height: 2px; margin-top: 11px; background: var(--color-accent); }
.hero-copy h1 { max-width: 20ch; margin: 0 0 64px; color: #fff; font-size: clamp(52px, 6.1vw, 92px); line-height: 0.98; letter-spacing: -0.045em; }
.hero-facts { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 40px; margin: auto 0 0; padding: 34px 0 0; border-top: 1px solid rgba(255, 255, 255, 0.24); }
.hero-facts li { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; }
.hero-fact-value { color: #fff; font-size: clamp(34px, 3.3vw, 46px); line-height: 1; letter-spacing: -0.03em; white-space: nowrap; }
.hero-fact-label { max-width: 28ch; color: #cdd5cc; font-size: 18px; line-height: 1.45; }
html[dir="rtl"] .hero .site-map img { object-position: 26% 50%; transform: scaleX(-1); } /* зеркало: опора с радаром уходит влево, под текст справа — в кадре нет надписей */
html[dir="rtl"] .hero .site-map::after { background: linear-gradient(270deg, rgba(15, 26, 21, 0.96) 0%, rgba(15, 26, 21, 0.9) 30%, rgba(15, 26, 21, 0.55) 58%, rgba(15, 26, 21, 0.2) 100%), linear-gradient(180deg, rgba(15, 26, 21, 0.2) 0%, rgba(15, 26, 21, 0) 45%, rgba(15, 26, 21, 0.86) 100%); }
@media (max-width: 1120px) {
  .hero-copy { min-height: clamp(520px, calc(100vh - 132px), 720px); }
  .hero-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 32px; }
}
@media (max-width: 700px) {
  .hero .site-map { position: relative; inset: auto; height: 240px; }
  .hero .site-map img { object-position: 70% 50%; }
  .hero .site-map::after { background: linear-gradient(180deg, rgba(15, 26, 21, 0.12) 0%, rgba(15, 26, 21, 0.1) 45%, rgba(15, 26, 21, 0.72) 75%, #0f1a15 100%); }
  .hero-copy { min-height: 0; margin-top: -60px; padding: 0 0 40px; }
  .hero-eyebrow { margin-bottom: 18px; }
  .hero-eyebrow::before { width: 32px; }
  .hero-copy h1 { max-width: none; margin-bottom: 36px; font-size: clamp(42px, 11.5vw, 52px); line-height: 1; }
  .hero-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 20px; padding-top: 26px; }
  .hero-fact-value { font-size: 30px; }
  .hero-fact-label { max-width: none; }
}

/* ==== project-v5 (19.09.2026): подраздел «Как проходит работа» — третья панель во всю ширину карточки проекта, пять шагов в две колонки (1–3 | 4–5), чтобы колонки над ней остались вровень. ==== */
#project .project-card { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
.project-flow-scope { grid-column: 1 / -1; }
.project-flow { display: block; columns: 2; column-gap: 40px; }
.project-flow li { break-inside: avoid; margin-bottom: 14px; }
.project-flow li:last-child { margin-bottom: 0; }
@media (max-width: 980px) {
  #project .project-card { grid-template-columns: 1fr; }
  .project-flow { columns: 1; }
}

/* ==== home-v7 (19.09.2026): форма сразу после трёх карточек; витрина «Решения» снята; одна кнопка на блок «Устройства» и «Ваш объект»; каталог показывает 9 карточек и крупную кнопку «Показать ещё»; строка «Три вопроса…» над кнопками формы. ==== */
.section-action { display: flex; justify-content: center; margin-top: 32px; }
.section-action .primary-action { min-height: 60px; padding: 16px 32px; font-size: 20px; }
.catalog-more { display: grid; justify-items: center; gap: 12px; margin-top: 28px; padding: 30px 24px; border: 1px solid var(--color-line); border-radius: 14px; background: #fff; text-align: center; }
.catalog-more-count { margin: 0; font-size: 18px; line-height: 1.4; color: #3d4b43; }
.catalog-more-button { width: 100%; max-width: 560px; min-height: 68px; padding: 18px 32px; border: 0; border-radius: 12px; background: var(--color-accent); color: var(--color-ink); font: inherit; font-size: 22px; line-height: 1.2; cursor: pointer; transition: filter .15s ease, transform .15s ease; }
.catalog-more-button:hover { filter: brightness(.95); }
.catalog-more-button:active { transform: translateY(1px); }
.catalog-more-button:focus-visible { outline: 3px solid var(--color-ink); outline-offset: 3px; }
.lead-brief-intro { margin: 0; font-size: 18px; line-height: 1.5; color: var(--color-ink); }
@media (max-width: 560px) {
  .section-action .primary-action { width: 100%; }
  .catalog-more { padding: 22px 16px; }
  .catalog-more-button { font-size: 20px; }
}

/* ==== catalog-lean-v1 (20.09.2026): путь клиента на первом экране — «С чего начать»: проект, микрофоны, сетка, остальные решения; каждая ступень — ссылка на свой блок. ==== */
.hero-path-title { margin: auto 0 0; padding-top: 34px; border-top: 1px solid rgba(255, 255, 255, 0.24); color: #e3e8e1; font-size: 18px; line-height: 1.3; letter-spacing: 0.1em; text-transform: uppercase; }
.hero-facts.hero-path { margin-top: 0; padding-top: 22px; border-top: 0; }
.hero-fact-link { display: flex; flex-direction: column; gap: 10px; min-height: 44px; color: inherit; text-decoration: none; }
.hero-fact-link .hero-fact-value { text-decoration: underline; text-decoration-color: rgba(255, 255, 255, 0.35); text-decoration-thickness: 2px; text-underline-offset: 8px; }
.hero-fact-link:hover .hero-fact-value, .hero-fact-link:focus-visible .hero-fact-value { text-decoration-color: var(--color-accent); }
.hero-fact-link:focus-visible { outline: 3px solid var(--color-accent); outline-offset: 6px; border-radius: 6px; }
.catalog-lead { max-width: 62ch; margin: 14px 0 0; font-size: 20px; line-height: 1.55; color: var(--color-muted, #4c5650); }
@media (max-width: 700px) {
  .hero-path-title { padding-top: 26px; }
  .hero-facts.hero-path { padding-top: 16px; }
}