@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-Thin.woff2") format("woff2"),
      url("../fonts/Geist-Thin.woff") format("woff");
   font-weight: 100;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-ExtraLight.woff2") format("woff2"),
      url("../fonts/Geist-ExtraLight.woff") format("woff");
   font-weight: 200;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-Light.woff2") format("woff2"),
      url("../fonts/Geist-Light.woff") format("woff");
   font-weight: 300;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-Regular.woff2") format("woff2"),
      url("../fonts/Geist-Regular.woff") format("woff");
   font-weight: 400;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-Medium.woff2") format("woff2"),
      url("../fonts/Geist-Medium.woff") format("woff");
   font-weight: 500;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-SemiBold.woff2") format("woff2"),
      url("../fonts/Geist-SemiBold.woff") format("woff");
   font-weight: 600;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-Bold.woff2") format("woff2"),
      url("../fonts/Geist-Bold.woff") format("woff");
   font-weight: 700;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-ExtraBold.woff2") format("woff2"),
      url("../fonts/Geist-ExtraBold.woff") format("woff");
   font-weight: 800;
   font-style: normal;
   font-display: swap;
}
@font-face {
   font-family: "Geist";
   src:
      url("../fonts/Geist-Black.woff2") format("woff2"),
      url("../fonts/Geist-Black.woff") format("woff");
   font-weight: 900;
   font-style: normal;
   font-display: swap;
}

:root {
   --navy-950: #071522;
   --navy-900: #0b1d2d;
   --navy-800: #102c40;
   --navy-700: #16384d;
   --ink-900: #10202e;
   --ink-700: #354657;
   --ink-500: #617181;
   --line: #dce3ea;
   --surface: #ffffff;
   --surface-soft: #f5f8fb;
   --surface-cream: #f5f2eb;
   --blue-600: #2563eb;
   --blue-700: #1d4ed8;
   --orange-500: #ff9b45;
   --orange-400: #ffad65;
   --container: 1180px;
   --header-h: 82px;
   --radius-lg: 30px;
   --radius-md: 20px;
   --shadow-sm: 0 12px 32px rgba(16, 32, 46, 0.08);
   --shadow-lg: 0 26px 70px rgba(2, 13, 24, 0.22);
}

*,
*::before,
*::after {
   box-sizing: border-box;
}
html {
   scroll-behavior: smooth;
   scroll-padding-top: calc(var(--header-h) + 20px);
}
body {
   margin: 0;
   color: var(--ink-900);
   background: var(--surface);
   font-family: "Geist", Arial, sans-serif;
   font-size: 16px;
   line-height: 1.5;
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
}
body.nav-open {
   overflow: hidden;
}
a {
   color: inherit;
   text-decoration: none;
}
button,
a {
   -webkit-tap-highlight-color: transparent;
}
img {
   display: block;
   max-width: 100%;
}
.container {
   width: min(calc(100% - 48px), var(--container));
   margin-inline: auto;
}
.visually-hidden {
   position: absolute;
   width: 1px;
   height: 1px;
   padding: 0;
   margin: -1px;
   overflow: hidden;
   clip: rect(0 0 0 0);
   white-space: nowrap;
   border: 0;
}
.skip-link {
   position: fixed;
   z-index: 100;
   top: 10px;
   left: 10px;
   padding: 10px 14px;
   border-radius: 10px;
   color: #fff;
   background: var(--blue-600);
   transform: translateY(-150%);
   transition: transform 0.2s ease;
}
.skip-link:focus {
   transform: translateY(0);
}
.site-header {
   position: fixed;
   z-index: 50;
   inset: 0 0 auto;
   height: var(--header-h);
   color: #fff;
   background: rgba(7, 21, 34, 0.92);
   border-bottom: 1px solid rgba(255, 255, 255, 0.08);
   backdrop-filter: blur(14px);
   transition:
      background 0.2s ease,
      box-shadow 0.2s ease;
}
.site-header.is-scrolled {
   background: rgba(7, 21, 34, 0.98);
   box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}
.site-header__inner {
   display: flex;
   align-items: center;
   gap: 28px;
   height: 100%;
}
.brand {
   display: inline-flex;
   align-items: center;
   gap: 0;
   flex: 0 0 auto;
}
.brand__text {
   display: grid;
   line-height: 1;
}
.brand__text strong {
   margin-bottom: 5px;
   color: #fff;
   font-size: 17px;
   font-weight: 800;
}
.brand__text small {
   color: rgba(255, 255, 255, 0.62);
   font-size: 12px;
   font-weight: 600;
   line-height: 1.15;
   text-transform: uppercase;
}
.main-nav {
   display: flex;
   align-items: center;
   gap: 28px;
   margin-left: auto;
}
.main-nav a {
   position: relative;
   padding-block: 8px;
   color: rgba(255, 255, 255, 0.76);
   font-size: 14px;
   font-weight: 600;
   transition: color 0.2s ease;
}
.main-nav a::after {
   content: "";
   position: absolute;
   right: 0;
   bottom: 0;
   left: 0;
   height: 1px;
   background: var(--orange-500);
   transform: scaleX(0);
   transform-origin: left;
   transition: transform 0.2s ease;
}
.main-nav a:hover {
   color: #fff;
}
.main-nav a:hover::after {
   transform: scaleX(1);
}
.header-phone {
   display: grid;
   align-content: center;
   justify-items: center;
   min-width: 184px;
   min-height: 50px;
   margin-left: 8px;
   padding: 7px 14px;
   border: 1px solid rgba(255, 255, 255, 0.16);
   border-radius: 10px;
   background: rgba(255, 255, 255, 0.035);
   color: #fff;
   line-height: 1;
   text-align: center;
   text-decoration: none;
   white-space: nowrap;
   box-sizing: border-box;
   box-shadow: none;
   transform: none;
   transition:
      border-color 0.2s ease,
      background-color 0.2s ease,
      box-shadow 0.2s ease;
}

.header-phone span {
   margin-bottom: 5px;
   color: #fff;
   font-size: 15px;
   font-weight: 800;
   line-height: 1;
}

.header-phone small {
   color: rgba(255, 255, 255, 0.58);
   font-size: 11px;
   font-weight: 700;
   line-height: 1.1;
   text-transform: uppercase;
   transition: color 0.2s ease;
}

@media (hover: hover) {
   .header-phone:hover {
      border-color: #ff9b45;
      background: rgba(255, 155, 69, 0.08);
      box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
      transform: none;
   }

   .header-phone:hover small {
      color: #ff9b45;
   }
}

.header-phone:focus-visible {
   outline: 2px solid #ff9b45;
   outline-offset: 3px;
}
.nav-toggle {
   display: none;
   place-content: center;
   gap: 4px;
   width: 46px;
   height: 46px;
   margin-left: auto;
   padding: 0;
   border: 1px solid rgba(255, 255, 255, 0.14);
   border-radius: 12px;
   background: rgba(255, 255, 255, 0.05);
   cursor: pointer;
}
.nav-toggle__line {
   display: block;
   width: 20px;
   height: 2px;
   margin-inline: auto;
   background: #fff;
   transition:
      transform 0.2s ease,
      opacity 0.2s ease;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__line:nth-child(1) {
   transform: translateY(6px) rotate(45deg);
}
.nav-toggle[aria-expanded="true"] .nav-toggle__line:nth-child(2) {
   opacity: 0;
}
.nav-toggle[aria-expanded="true"] .nav-toggle__line:nth-child(3) {
   transform: translateY(-6px) rotate(-45deg);
}

.hero {
   min-height: 820px;
   padding: calc(var(--header-h) + 78px) 0 78px;
   color: #fff;
   background: var(--navy-950);
}
.hero__grid {
   display: grid;
   grid-template-columns: minmax(0, 1.05fr) minmax(420px, 0.95fr);
   align-items: center;
   gap: 72px;
}
.hero__content,
.hero__visual {
   min-width: 0;
}
.hero__content {
   position: relative;
   z-index: 2;
}
.eyebrow {
   display: flex;
   align-items: center;
   gap: 12px;
   margin-bottom: 24px;
   color: #b8c7d2;
   font-size: 13px;
   font-weight: 700;
   line-height: 1.3;
   text-transform: uppercase;
}
.eyebrow::before {
   content: "";
   width: 28px;
   height: 2px;
   background: var(--orange-500);
}
.hero h1 {
   max-width: 680px;
   margin: 0 0 20px;
   font-size: clamp(48px, 5.7vw, 76px);
   font-weight: 800;
   line-height: 0.98;
}
.hero h1 span {
   display: block;
   color: var(--orange-500);
}
.hero__lead {
   max-width: 610px;
   margin: 0 0 34px;
   color: #b9c9d6;
   font-size: 18px;
   line-height: 1.65;
}
.hero__actions {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
   margin-bottom: 42px;
}
.button {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   min-height: 52px;
   padding: 0 20px;
   border: 1px solid transparent;
   border-radius: 12px;
   font-size: 14px;
   font-weight: 750;
   cursor: pointer;
   transition:
      transform 0.2s ease,
      background 0.2s ease,
      border-color 0.2s ease,
      box-shadow 0.2s ease;
}
.button:hover {
   transform: translateY(-2px);
}
.button:focus-visible {
   outline: 3px solid rgba(97, 214, 230, 0.42);
   outline-offset: 3px;
}
.button--primary {
   color: var(--navy-950);
   background: var(--orange-500);
   box-shadow: 0 14px 34px rgba(255, 155, 69, 0.18);
}
.button--primary:hover {
   background: var(--orange-400);
}
.button--ghost {
   color: #fff;
   border-color: rgba(255, 255, 255, 0.16);
   background: transparent;
}
.button--ghost:hover {
   border-color: rgba(255, 255, 255, 0.32);
   background: rgba(255, 255, 255, 0.06);
}
.hero__badges {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   max-width: 610px;
   margin: 0;
   padding: 0;
   list-style: none;
   border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.hero__badges li {
   display: grid;
   gap: 3px;
   padding: 22px 18px 0 0;
}
.hero__badges li + li {
   padding-left: 20px;
   border-left: 1px solid rgba(255, 255, 255, 0.12);
}
.hero__badges strong {
   font-size: 24px;
   font-weight: 800;
}
.hero__badges span {
   color: #9fb0bd;
   font-size: 12px;
   font-weight: 600;
   line-height: 1.3;
   text-transform: uppercase;
}
.hero__visual {
   position: relative;
}
.hero-card {
   position: relative;
   padding: 14px;
   border: 1px solid rgba(255, 255, 255, 0.12);
   border-radius: 24px;
   background: #0d2638;
   box-shadow: var(--shadow-lg);
}
.hero-card__topline {
   display: flex;
   align-items: center;
   justify-content: space-between;
   min-height: 42px;
   padding: 0 6px 10px;
   color: #c5d3e0;
   font-size: 12px;
   font-weight: 700;
   line-height: 1.25;
   text-transform: uppercase;
}
.hero-card__status {
   color: #fff;
}
.hero-card__media {
   position: relative;
   overflow: hidden;
   aspect-ratio: 900 / 740;
   border-radius: 16px;
   background: #163247;
}
.hero-card__media::after {
   content: "Фото склада";
   position: absolute;
   inset: 0;
   display: grid;
   place-items: center;
   color: rgba(255, 255, 255, 0.48);
   font-size: 13px;
   font-weight: 600;
}
.warehouse-illustration {
   position: relative;
   z-index: 1;
   width: 100%;
   height: 100%;
   border-radius: inherit;
   object-fit: cover;
}
.hero-card__note {
   position: absolute;
   z-index: 3;
   right: 14px;
   bottom: 14px;
   max-width: 300px;
   padding: 14px 16px;
   border: 1px solid rgba(255, 255, 255, 0.12);
   border-radius: 14px;
   background: rgba(7, 21, 34, 0.9);
   box-shadow: 0 14px 34px rgba(0, 0, 0, 0.2);
   backdrop-filter: blur(12px);
}
.hero-card__note span {
   display: grid;
}
.hero-card__note strong {
   margin-bottom: 3px;
   font-size: 14px;
}
.hero-card__note small {
   color: #a4b5c1;
   font-size: 12px;
   line-height: 1.3;
}

.trust-strip {
   border-bottom: 1px solid var(--line);
   background: #fff;
}
.trust-strip__grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
}
.trust-item {
   display: flex;
   align-items: center;
   min-height: 112px;
   padding: 20px 26px;
}
.trust-item + .trust-item {
   border-left: 1px solid var(--line);
}
.trust-item > span {
   display: grid;
}
.trust-item strong {
   margin-bottom: 4px;
   font-size: 18px;
   font-weight: 750;
}
.trust-item small {
   color: var(--ink-500);
   font-size: 14px;
   line-height: 1.4;
}

.section {
   padding: 112px 0;
}
.section--light {
   background: var(--surface-soft);
}
.section--dark {
   color: #fff;
   background: var(--navy-900);
}
.section--cream {
   background: var(--surface-cream);
}
.section-heading {
   display: grid;
   grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
   align-items: end;
   gap: 54px;
   margin-bottom: 48px;
}
.section-kicker {
   display: inline-block;
   margin-bottom: 12px;
   color: var(--blue-600);
   font-size: 12px;
   font-weight: 800;
   line-height: 1.3;
   text-transform: uppercase;
}
.section-heading h2,
.specs-copy h2,
.contact-card h2 {
   margin: 0;
   font-size: clamp(38px, 4vw, 56px);
   font-weight: 800;
   line-height: 1.04;
}
.section-heading p {
   max-width: 500px;
   margin: 0 0 4px auto;
   color: var(--ink-500);
   font-size: 16px;
   line-height: 1.65;
}
.section-heading--dark p {
   color: #9fb1c0;
}

.feature-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 14px;
}
.feature-card {
   position: relative;
   display: grid;
   grid-template-columns: minmax(0, 1fr) auto;
   grid-template-rows: auto auto;
   align-content: start;
   column-gap: 14px;
   row-gap: 14px;
   min-height: 220px;
   padding: 26px 24px 24px;
   overflow: hidden;
   border: 1px solid var(--line);
   border-radius: var(--radius-md);
   background: #fff;
   box-shadow: 0 10px 28px rgba(16, 32, 46, 0.04);
}
.feature-card--accent {
   color: #fff;
   border-color: var(--blue-600);
   background: var(--blue-600);
   box-shadow: 0 18px 42px rgba(37, 99, 235, 0.18);
}
.feature-card__number {
   grid-column: 2;
   grid-row: 1;
   align-self: start;
   color: #9fb1bf;
   font-size: 18px;
   font-weight: 800;
   line-height: 1.18;
}
.feature-card--accent .feature-card__number {
   color: rgba(255, 255, 255, 0.58);
}
.feature-card h3 {
   grid-column: 1;
   grid-row: 1;
   margin: 0;
   font-size: 21px;
   line-height: 1.18;
}
.feature-card p {
   grid-column: 1 / -1;
   grid-row: 2;
   margin: 0;
   color: var(--ink-500);
   font-size: 15px;
   line-height: 1.6;
}
.feature-card--accent p {
   color: rgba(255, 255, 255, 0.76);
}

.storage-grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 16px;
}
.storage-card {
   overflow: hidden;
   border: 1px solid rgba(255, 255, 255, 0.1);
   border-radius: var(--radius-md);
   background: rgba(255, 255, 255, 0.05);
   transition:
      transform 0.22s ease,
      border-color 0.22s ease,
      background 0.22s ease;
}
.storage-card:hover {
   transform: translateY(-5px);
   border-color: rgba(255, 255, 255, 0.18);
   background: rgba(255, 255, 255, 0.07);
}
.storage-card__visual {
   position: relative;
   display: grid;
   place-items: center;
   height: 245px;
   background: #123247;
}
.storage-card__visual::after {
   content: "Фото";
   position: absolute;
   inset: 0;
   display: grid;
   place-items: center;
   color: rgba(255, 255, 255, 0.42);
   font-size: 14px;
   font-weight: 600;
}
.storage-card__image {
   position: absolute;
   z-index: 1;
   inset: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.storage-card__label {
   position: absolute;
   z-index: 2;
   top: 18px;
   left: 18px;
   padding: 7px 10px;
   border: 1px solid rgba(255, 255, 255, 0.12);
   border-radius: 8px;
   color: #d6e3ec;
   background: rgba(5, 18, 29, 0.64);
   font-size: 12px;
   font-weight: 700;
   line-height: 1.2;
   text-transform: uppercase;
}
.storage-card__content {
   padding: 26px;
}
.storage-card h3 {
   margin: 0 0 12px;
   font-size: 21px;
}
.storage-card p {
   margin: 0 0 20px;
   color: #aebdca;
   font-size: 14px;
   line-height: 1.65;
}
.storage-card ul {
   display: flex;
   flex-wrap: wrap;
   gap: 6px;
   margin: 0;
   padding: 0;
   list-style: none;
}
.storage-card li {
   padding: 7px 9px;
   border: 1px solid rgba(255, 255, 255, 0.1);
   border-radius: 7px;
   color: #c9d5de;
   font-size: 12px;
   font-weight: 650;
   line-height: 1.25;
}

.specs-layout {
   display: grid;
   grid-template-columns: 0.9fr 1.1fr;
   gap: 78px;
   align-items: stretch;
}
.specs-copy,
.spec-table {
   min-width: 0;
}
.specs-copy {
   display: flex;
   flex-direction: column;
}
.specs-copy h2 {
   margin-bottom: 22px;
}
.specs-copy > p {
   max-width: 500px;
   margin: 0 0 34px;
   color: var(--ink-500);
   font-size: 15px;
   line-height: 1.7;
}
.specs-callout {
   margin-bottom: 20px;
   padding: 18px;
   border: 1px solid #d7e5f0;
   border-radius: 14px;
   background: rgba(255, 255, 255, 0.74);
}
.specs-callout p {
   margin: 0;
   color: var(--ink-700);
   font-size: 14px;
   line-height: 1.6;
}
.specs-callout strong {
   color: var(--ink-900);
}
.specs-photo {
   flex: 1 1 auto;
   min-height: 280px;
   margin: 0;
   overflow: hidden;
   aspect-ratio: 16 / 10;
   border: 1px solid rgba(54, 50, 40, 0.08);
   border-radius: 16px;
   background: #dce3e8;
   box-shadow: 0 12px 30px rgba(16, 32, 46, 0.08);
}
.specs-photo img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
}
.spec-table {
   display: grid;
   grid-template-rows: repeat(9, minmax(0, 1fr));
   height: 100%;
   overflow: hidden;
   border: 1px solid rgba(54, 50, 40, 0.08);
   border-radius: var(--radius-md);
   background: #fff;
   box-shadow: var(--shadow-sm);
}
.spec-row {
   display: grid;
   grid-template-columns: minmax(150px, 0.8fr) minmax(210px, 1.2fr);
   align-items: center;
   gap: 20px;
   min-height: 0;
   padding: 18px 24px;
}
.spec-row + .spec-row {
   border-top: 1px solid #e9eef1;
}
.spec-row span {
   color: var(--ink-500);
   font-size: 15px;
   line-height: 1.4;
}
.spec-row strong {
   text-align: right;
   font-size: 15px;
   font-weight: 750;
   line-height: 1.4;
}

.process-section {
   background: #fff;
}
.process-list {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   margin: 0;
   padding: 0;
   list-style: none;
   border: 1px solid var(--line);
   border-radius: var(--radius-md);
   overflow: hidden;
}
.process-list li {
   position: relative;
   min-height: 164px;
   padding: 22px;
   background: #fff;
}
.process-list li + li {
   border-left: 1px solid var(--line);
}
.process-list li::after {
   content: "";
   position: absolute;
   z-index: 2;
   top: 50%;
   right: -6px;
   width: 12px;
   height: 12px;
   border-top: 1px solid var(--line);
   border-right: 1px solid var(--line);
   background: #fff;
   transform: translateY(-50%) rotate(45deg);
}
.process-list li:last-child::after {
   display: none;
}
.process-list > li > span {
   display: block;
   margin-bottom: 18px;
   color: var(--blue-600);
   font-size: 17px;
   font-weight: 800;
}
.process-list h3 {
   margin: 0 0 12px;
   font-size: 20px;
   line-height: 1.25;
}
.process-list p {
   margin: 0;
   color: var(--ink-500);
   font-size: 15px;
   line-height: 1.6;
}

.contact-section {
   padding: 0 0 112px;
   background: #fff;
}
.contact-card {
   display: grid;
   grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
   gap: 8px;
   padding: 8px;
   border-radius: var(--radius-lg);
   color: #fff;
   background: var(--navy-900);
   box-shadow: 0 24px 58px rgba(12, 30, 45, 0.14);
}
.contact-card__content {
   padding: 56px 48px;
}
.section-kicker--light {
   color: #8eb1ff;
}
.contact-card h2 {
   max-width: 620px;
   margin-bottom: 20px;
   font-size: clamp(36px, 3.1vw, 46px);
   line-height: 1.08;
}
.contact-card h2 span {
   display: block;
}
.contact-card__content > p {
   max-width: 540px;
   margin: 0 0 30px;
   color: #b5c4cf;
   font-size: 15px;
   line-height: 1.65;
}
.contact-card__actions {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   margin-bottom: 34px;
}
.button--light {
   color: var(--navy-950);
   background: #fff;
}
.button--light:hover {
   background: #f3f6f8;
}
.button--outline-light {
   color: #fff;
   border-color: rgba(255, 255, 255, 0.18);
   background: transparent;
}
.button--outline-light:hover {
   border-color: rgba(255, 255, 255, 0.34);
   background: rgba(255, 255, 255, 0.06);
}
.contact-details {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 24px 28px;
   margin: 0;
   padding-top: 26px;
   border-top: 1px solid rgba(255, 255, 255, 0.1);
}
.contact-details div {
   display: grid;
   align-content: start;
}
.contact-details div:first-child {
   grid-column: 1 / -1;
}
.contact-details span {
   margin-bottom: 8px;
   color: #91a6b5;
   font-size: 12px;
   font-weight: 700;
   line-height: 1.25;
   text-transform: uppercase;
}
.contact-details strong,
.contact-details a {
   margin: 0;
   color: #fff;
   font-size: 14px;
   line-height: 1.5;
}
.contact-details a:hover {
   text-decoration: underline;
   text-underline-offset: 3px;
}
.contact-card__map {
   position: relative;
   min-height: 540px;
   overflow: hidden;
   border-radius: 24px;
   background: #e8eef2;
}
.contact-card__map iframe {
   position: absolute;
   z-index: 1;
   inset: 0;
   width: 100%;
   height: 100%;
   border: 0;
}
.map-fallback {
   position: absolute;
   inset: 0;
   display: grid;
   place-content: center;
   gap: 6px;
   padding: 24px;
   color: var(--ink-700);
   text-align: center;
   background: #e8eef2;
}
.map-fallback strong {
   font-size: 16px;
}
.map-fallback span {
   color: var(--ink-500);
   font-size: 14px;
}
.map-link {
   position: absolute;
   z-index: 2;
   right: 16px;
   bottom: 16px;
   padding: 12px 16px;
   border-radius: 10px;
   color: #fff;
   background: var(--navy-950);
   font-size: 14px;
   font-weight: 700;
   box-shadow: 0 10px 26px rgba(7, 21, 34, 0.24);
}
.map-link:hover {
   background: var(--navy-800);
}

.site-footer {
   color: #8ea2b1;
   background: var(--navy-950);
}
.site-footer__inner {
   display: flex;
   align-items: center;
   gap: 30px;
   min-height: 118px;
}
.brand--footer {
   color: #fff;
}
.site-footer p {
   margin: 0;
   font-size: 14px;
}
.site-footer__copyright {
   margin-left: auto;
   font-size: 13px;
}

.mobile-callbar {
   display: none;
}
[data-reveal] {
   opacity: 0;
   transform: translateY(16px);
   transition:
      opacity 0.62s ease,
      transform 0.62s cubic-bezier(0.2, 0.7, 0.2, 1);
   transition-delay: var(--reveal-delay, 0ms);
}
[data-reveal].is-visible {
   opacity: 1;
   transform: translateY(0);
}

.error-page {
   display: grid;
   min-height: 100vh;
   place-items: center;
   padding: 24px;
   color: #fff;
   background: var(--navy-950);
}
.error-card {
   width: min(520px, 100%);
   padding: 48px;
   border: 1px solid rgba(255, 255, 255, 0.1);
   border-radius: var(--radius-lg);
   text-align: center;
   background: var(--navy-900);
   box-shadow: var(--shadow-lg);
}
.error-card > span {
   display: block;
   margin-bottom: 8px;
   color: var(--orange-500);
   font-size: 14px;
   font-weight: 900;
}
.error-card h1 {
   margin: 0 0 14px;
   font-size: 40px;
}
.error-card p {
   margin: 0 0 28px;
   color: #a9bbc9;
   font-size: 16px;
   line-height: 1.55;
}
.error-card .button {
   width: auto;
}

@media (min-width: 621px) {
   .contact-card h2 span {
      white-space: nowrap;
   }
}

@media (max-width: 1080px) {
   :root {
      --container: 940px;
   }
   .site-header__inner {
      gap: 18px;
   }
   .main-nav {
      gap: 18px;
   }
   .main-nav a {
      font-size: 13px;
   }
   .hero__grid {
      grid-template-columns: 1fr 0.92fr;
      gap: 38px;
   }
   .feature-grid {
      grid-template-columns: repeat(2, 1fr);
   }
   .feature-card {
      min-height: 188px;
      padding: 22px 20px 20px;
      column-gap: 12px;
      row-gap: 10px;
   }
   .feature-card__number {
      font-size: 17px;
   }
   .feature-card h3 {
      font-size: 19px;
   }
   .feature-card p {
      font-size: 14px;
      line-height: 1.55;
   }
   .trust-strip__grid {
      grid-template-columns: repeat(2, 1fr);
   }
   .trust-item:nth-child(3) {
      border-left: 0;
      border-top: 1px solid var(--line);
   }
   .trust-item:nth-child(4) {
      border-top: 1px solid var(--line);
   }
   .specs-layout {
      grid-template-columns: 0.85fr 1.15fr;
      gap: 44px;
   }
   .contact-card__content {
      padding: 48px 36px;
   }
}

@media (max-width: 860px) {
   :root {
      --header-h: 72px;
   }
   .container {
      width: min(100% - 32px, var(--container));
   }
   .nav-toggle {
      display: grid;
   }
   .header-phone {
      display: none;
   }
   .main-nav {
      position: fixed;
      inset: var(--header-h) 0 auto;
      display: grid;
      gap: 0;
      margin: 0;
      padding: 12px 16px 20px;
      border-top: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(7, 21, 34, 0.99);
      transform: translateY(-130%);
      opacity: 0;
      pointer-events: none;
      transition:
         transform 0.25s ease,
         opacity 0.25s ease;
   }
   .main-nav.is-open {
      transform: translateY(0);
      opacity: 1;
      pointer-events: auto;
   }
   .main-nav a {
      padding: 16px 8px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.07);
      font-size: 14px;
   }
   .main-nav a::after {
      display: none;
   }
   .hero {
      min-height: auto;
      padding-top: calc(var(--header-h) + 54px);
   }
   .hero__grid {
      grid-template-columns: 1fr;
   }
   .hero__content {
      text-align: center;
   }
   .eyebrow {
      justify-content: center;
   }
   .hero h1,
   .hero__lead {
      margin-inline: auto;
   }
   .hero__actions {
      justify-content: center;
   }
   .hero__badges {
      margin-inline: auto;
      text-align: left;
   }
   .hero__visual {
      max-width: 680px;
      margin-inline: auto;
   }
   .section {
      padding: 88px 0;
   }
   .section-heading {
      grid-template-columns: 1fr;
      gap: 18px;
   }
   .section-heading p {
      margin-left: 0;
   }
   .storage-grid {
      grid-template-columns: 1fr;
   }
   .storage-card {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
   }
   .storage-card__visual {
      height: 100%;
      min-height: 260px;
   }
   .specs-layout {
      grid-template-columns: 1fr;
   }
   .spec-table {
      grid-template-rows: none;
      height: auto;
   }
   .process-list {
      grid-template-columns: repeat(2, 1fr);
      gap: 12px;
      border: 0;
      overflow: visible;
   }
   .process-list li {
      display: grid;
      grid-template-columns: 36px minmax(0, 1fr);
      grid-template-rows: auto auto;
      align-content: start;
      column-gap: 12px;
      row-gap: 6px;
      min-height: 0;
      padding: 18px;
      border: 1px solid var(--line);
      border-radius: 18px;
   }
   .process-list li + li {
      border-left: 1px solid var(--line);
   }
   .process-list li::after {
      display: none;
   }
   .process-list > li > span {
      grid-column: 1;
      grid-row: 1 / span 2;
      align-self: start;
      margin: 1px 0 0;
      font-size: 16px;
   }
   .process-list h3 {
      grid-column: 2;
      margin: 0;
      font-size: 18px;
      line-height: 1.24;
   }
   .process-list p {
      grid-column: 2;
      margin: 0;
      font-size: 14px;
      line-height: 1.5;
   }
   .contact-card {
      grid-template-columns: 1fr;
   }
   .contact-card__map {
      min-height: 430px;
   }
   .site-footer__inner {
      flex-wrap: wrap;
      padding: 30px 0;
   }
   .site-footer__copyright {
      width: 100%;
      margin-left: 0;
   }
}

@media (max-width: 620px) {
   :root {
      --radius-lg: 24px;
   }
   body {
      padding-bottom: 72px;
   }
   .brand__text small {
      display: none;
   }
   .hero {
      padding-bottom: 54px;
   }
   .hero h1 {
      font-size: clamp(40px, 12vw, 56px);
   }
   .hero__lead {
      font-size: 16px;
   }
   .hero__actions {
      display: grid;
   }
   .button {
      width: 100%;
   }
   .hero__badges {
      grid-template-columns: 1fr;
      border-top: 0;
   }
   .hero__badges li,
   .hero__badges li + li {
      grid-template-columns: 100px 1fr;
      align-items: baseline;
      padding: 14px 0;
      border-left: 0;
      border-top: 1px solid rgba(255, 255, 255, 0.1);
   }
   .hero__badges strong {
      font-size: 20px;
   }
   .hero-card {
      padding: 10px;
      border-radius: 20px;
   }
   .hero-card__topline {
      font-size: 12px;
   }
   .hero-card__status {
      display: none;
   }
   .hero-card__note {
      left: 12px;
      right: 12px;
      bottom: 12px;
      max-width: none;
      padding: 12px 14px;
   }
   .trust-strip__grid {
      grid-template-columns: 1fr;
      padding: 14px 0;
   }
   .trust-item,
   .trust-item + .trust-item,
   .trust-item:nth-child(3),
   .trust-item:nth-child(4) {
      min-height: 92px;
      padding: 14px 0;
      border: 0;
      border-top: 1px solid var(--line);
   }
   .trust-item:first-child {
      border-top: 0;
   }
   .section {
      padding: 72px 0;
   }
   .section-heading h2,
   .specs-copy h2 {
      font-size: 36px;
   }
   .contact-card h2 {
      max-width: 14ch;
      font-size: clamp(31px, 7vw, 36px);
      line-height: 1.08;
   }
   .contact-card h2 span {
      display: inline;
      white-space: normal;
   }
   .contact-card h2 span + span::before {
      content: " ";
   }
   .feature-grid {
      grid-template-columns: 1fr;
   }
   .feature-card {
      min-height: auto;
      padding: 18px;
      column-gap: 10px;
      row-gap: 10px;
   }
   .feature-card__number {
      font-size: 16px;
   }
   .feature-card h3 {
      font-size: 18px;
      line-height: 1.22;
   }
   .feature-card p {
      font-size: 14px;
      line-height: 1.5;
   }
   .storage-card {
      grid-template-columns: 1fr;
   }
   .storage-card__visual {
      min-height: 210px;
   }
   .spec-row {
      grid-template-columns: 1fr;
      gap: 6px;
      min-height: 0;
   }
   .spec-row strong {
      text-align: left;
   }
   .process-list {
      grid-template-columns: 1fr;
      gap: 10px;
   }
   .process-list li {
      grid-template-columns: 32px minmax(0, 1fr);
      column-gap: 10px;
      row-gap: 5px;
      min-height: 0;
      padding: 16px;
   }
   .process-list > li > span {
      margin: 1px 0 0;
      font-size: 15px;
   }
   .process-list h3 {
      margin: 0;
      font-size: 17px;
   }
   .process-list p {
      font-size: 14px;
      line-height: 1.45;
   }
   .contact-section {
      padding-bottom: 72px;
   }
   .contact-card {
      width: calc(100% - 20px);
      padding: 8px;
   }
   .contact-card__content {
      padding: 36px 24px;
   }
   .contact-card__actions {
      display: grid;
   }
   .contact-details {
      grid-template-columns: 1fr;
   }
   .contact-details div:first-child {
      grid-column: auto;
   }
   .contact-card__map {
      min-height: 360px;
   }
   .site-footer__inner {
      align-items: flex-start;
   }
   .mobile-callbar {
      position: fixed;
      z-index: 60;
      right: 10px;
      bottom: 10px;
      left: 10px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      min-height: 62px;
      padding: 10px 10px 10px 16px;
      border: 1px solid rgba(255, 255, 255, 0.1);
      border-radius: 15px;
      color: #fff;
      background: rgba(7, 21, 34, 0.97);
      box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
      backdrop-filter: blur(14px);
   }
   .mobile-callbar span {
      display: grid;
      line-height: 1.2;
   }
   .mobile-callbar small {
      margin-bottom: 4px;
      color: #9db0be;
      font-size: 12px;
   }
   .mobile-callbar strong {
      font-size: 15px;
   }
   .mobile-callbar a {
      padding: 12px 15px;
      border-radius: 10px;
      color: var(--navy-950);
      background: var(--orange-500);
      font-size: 14px;
      font-weight: 800;
   }
   .error-page {
      padding-bottom: 24px;
   }
   .error-card {
      padding: 38px 24px;
   }
}

@media (max-width: 340px) {
   .hero h1 {
      font-size: 36px;
   }
}

@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;
   }
   [data-reveal] {
      opacity: 1;
      transform: none;
   }
}

@media (max-width: 620px) {
   .hero-card__media {
      aspect-ratio: 4 / 3;
   }
}