@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap");
:root {
   --navy: #061a35;
   --navy2: #0d2b50;
   --ink: #102341;
   --muted: #64748b;
   --red: #d7192f;
   --red-hover: #b51226;
   --blue: #0a3b70;
   --bg: #f4f7fa;
   --line: #e5ebf1;
   --white: #fff;
   --shadow: 0 15px 45px rgba(12, 31, 59, 0.07);
}
* {
   box-sizing: border-box;
}
html {
   scroll-behavior: smooth;
   scroll-padding-top: 90px;
}
body {
   margin: 0;
   font-family: Manrope, Arial, Helvetica, sans-serif;
   color: var(--ink);
   background: #fff;
   -webkit-font-smoothing: antialiased;
   font-size: 15px;
   line-height: 1.55;
}
a {
   text-decoration: none;
   color: inherit;
}
button,
input {
   font: inherit;
}
button {
   cursor: pointer;
}
img {
   max-width: 100%;
   display: block;
}
h1,
h2,
h3,
p {
   margin-top: 0;
}
h1,
h2,
h3 {
   line-height: 1.17;
   letter-spacing: -0.04em;
}
h2 {
   font-size: clamp(27px, 3.1vw, 42px);
}
.container {
   width: min(1220px, calc(100% - 48px));
   margin: auto;
}
.icon {
   width: 21px;
   height: 21px;
   fill: none;
   stroke: currentColor;
   stroke-width: 1.75;
   stroke-linecap: round;
   stroke-linejoin: round;
   flex: none;
}
.skip-link {
   position: absolute;
   top: -90px;
   left: 15px;
   padding: 10px;
   background: #fff;
   z-index: 400;
}
.skip-link:focus {
   top: 10px;
}
:focus-visible {
   outline: 3px solid #f9b233;
   outline-offset: 3px;
}
.site-header {
   position: relative;
   z-index: 50;
   background: #fff;
   box-shadow: 0 3px 14px rgba(0, 0, 0, 0.04);
}
.header-mob-actions {
   display: flex;
   gap: 16px;
}
.header-inner {
   display: flex;
   justify-content: space-between;
   align-items: center;
   min-height: 79px;
   gap: 28px;
}
.logo-link {
   flex: none;
   display: flex;
   align-items: center;
}
.logo-link img {
   width: 184px;
   height: auto;
   max-height: 63px;
   object-fit: contain;
}
.desktop-nav {
   display: flex;
   align-items: center;
   gap: 30px;
   font-size: 13px;
   font-weight: 800;
}
.desktop-nav a,
.footer a {
   transition: color 0.2s;
}
.desktop-nav a:hover,
.footer a:hover {
   color: var(--red);
}
.header-actions {
   display: flex;
   align-items: center;
   gap: 20px;
}
.header-phone {
   display: flex;
   gap: 8px;
   align-items: center;
   white-space: nowrap;
   font-weight: 800;
   font-size: 13px;
}
.header-phone .icon {
   width: 18px;
   color: var(--red);
}
.btn {
   display: inline-flex;
   align-items: center;
   justify-content: center;
   gap: 11px;
   padding: 14px 22px;
   min-height: 52px;
   border-radius: 11px;
   white-space: nowrap;
   border: 1.5px solid transparent;
   font-size: 14px;
   font-weight: 800;
   transition:
      background-color 0.2s,
      color 0.2s,
      border-color 0.2s,
      transform 0.2s,
      box-shadow 0.2s;
}
.btn:hover {
   transform: translateY(-2px);
}
.btn .icon {
   width: 18px;
   height: 18px;
}
.btn-red {
   background: var(--red);
   color: white;
   box-shadow: 0 10px 22px rgba(215, 25, 47, 0.19);
}
.btn-red:hover {
   background: var(--red-hover);
   box-shadow: 0 13px 30px rgba(215, 25, 47, 0.28);
}
.btn-sm {
   min-height: 43px;
   padding: 10px 16px;
   font-size: 12px;
}
.btn-ghost {
   border-color: rgba(255, 255, 255, 0.55);
   color: #fff;
   background: rgba(8, 20, 40, 0.23);
}
.btn-ghost:hover {
   background: rgba(255, 255, 255, 0.16);
}
.btn-outline {
   background: #fff;
   border-color: #ccd7e4;
   color: var(--ink);
}
.btn-outline:hover {
   border-color: var(--red);
   color: var(--red);
}
.btn-blue {
   background: var(--navy2);
   color: white;
}
.btn-blue:hover {
   background: var(--blue);
}
.btn-full {
   width: 100%;
}
.menu-toggle,
.mobile-nav {
   display: none;
}
.hero {
   position: relative;
   isolation: isolate;
   overflow: hidden;
   background: linear-gradient(110deg, #07182e 7%, #092748 55%, #092a4d 100%);
   color: #fff;
   min-height: 650px;
}
.hero-photo {
   position: absolute;
   z-index: -3;
   right: 0;
   top: 0;
   bottom: 0;
   width: 55%;
   background: url("assets/store-parts-sign.webp") center 41% / cover no-repeat;
}
.hero:before {
   content: "";
   position: absolute;
   z-index: -2;
   inset: 0;
   background: linear-gradient(
      91deg,
      #071a34 0%,
      #071a34 38%,
      rgba(7, 26, 52, 0.97) 52%,
      rgba(7, 26, 52, 0.54) 75%,
      rgba(7, 26, 52, 0.18) 100%
   );
}
.hero-glow {
   position: absolute;
   inset: auto auto -200px -180px;
   width: 700px;
   height: 600px;
   border-radius: 50%;
   background: radial-gradient(circle, rgba(15, 65, 121, 0.5), transparent 70%);
   z-index: -1;
}
.hero-grid {
   display: grid;
   grid-template-columns: 1.27fr 0.73fr;
   align-items: center;
   gap: 35px;
   min-height: 650px;
   padding-top: 68px;
   padding-bottom: 64px;
}
.hero-copy {
   align-self: center;
}
.eyebrow,
.section-kicker {
   font-size: 11px;
   color: var(--red);
   font-weight: 900;
   letter-spacing: 0.15em;
}
.hero-eyebrow {
   color: #ff5b69;
   display: flex;
   gap: 11px;
   align-items: center;
   margin-bottom: 20px;
   text-transform: uppercase;
}
.small-line {
   display: inline-block;
   width: 25px;
   height: 2px;
   background: #ff5b69;
}
.hero h1 {
   font-size: clamp(34px, 4.15vw, 59px);
   line-height: 1.16;
   max-width: 750px;
   font-weight: 800;
   margin: 0 0 23px;
}
.hero h1 em {
   color: #ff4050;
   font-style: normal;
}
.hero-description {
   font-size: 16px;
   line-height: 1.8;
   max-width: 545px;
   color: #d9e2f0;
   margin-bottom: 30px;
}
.hero-buttons {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 12px;
}
.trust-list {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 8px;
   margin-top: 58px;
   max-width: 610px;
}
.trust-list > div {
   text-align: center;
   border-right: 1px solid #304d6e;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 1px;
}
.trust-list > div:last-child {
   border-right: none;
}
.trust-icon {
   display: grid;
   place-items: center;
   width: 41px;
   height: 41px;
   border-radius: 11px;
   background: rgba(255, 255, 255, 0.08);
   margin-bottom: 10px;
}
.trust-icon .icon {
   width: 25px;
   height: 25px;
   color: #fff;
}
.trust-list strong {
   font-size: 12px;
   line-height: 1.35;
}
.trust-list small {
   font-size: 11px;
   line-height: 1.4;
   color: #c5d2e4;
}
.hero-side {
   align-self: end;
}
.hero-picture-note {
   display: flex;
   gap: 8px;
   align-items: center;
   justify-content: flex-end;
   color: #eef4fc;
   text-shadow: 0 2px 5px rgba(0, 0, 0, 0.7);
   font-size: 11px;
   font-weight: 800;
   margin-bottom: 14px;
}
.hero-picture-note .icon {
   width: 16px;
}
.lead-card {
   border-radius: 19px;
   background: #fff;
   color: var(--ink);
   padding: 25px;
   box-shadow: 0 22px 65px rgba(0, 0, 0, 0.3);
   max-width: 385px;
   margin-left: auto;
   scroll-margin-top: 90px;
}
.lead-head {
   display: flex;
   gap: 11px;
}
.form-icon {
   width: 44px;
   height: 44px;
   display: grid;
   place-items: center;
   border-radius: 12px;
   background: #f7e7e9;
   color: var(--red);
   flex: none;
}
.tiny-red {
   display: block;
   font-size: 9px;
   color: var(--red);
   font-weight: 900;
   letter-spacing: 0.1em;
   margin-bottom: 3px;
}
.lead-head h2 {
   font-size: 21px;
   letter-spacing: -0.055em;
   margin-bottom: 4px;
}
.lead-head p {
   font-size: 11px;
   color: var(--muted);
   margin-bottom: 14px;
}
.lead-form label {
   display: block;
   font-size: 11px;
   font-weight: 800;
   margin-bottom: 5px;
}
.lead-form label span {
   color: var(--red);
}
.lead-form input {
   width: 100%;
   height: 43px;
   border: 1px solid #e1e7f0;
   background: #f5f7fa;
   border-radius: 9px;
   padding: 10px 12px;
   margin-bottom: 10px;
   color: #14243a;
   outline: none;
   min-width: 0;
   font-size: 12px;
}
.lead-form input:focus {
   border-color: #4879ae;
   box-shadow: 0 0 0 3px rgba(18, 86, 156, 0.1);
   background: white;
}
.lead-form .btn {
   min-height: 47px;
   margin-top: 3px;
}
.form-note {
   margin: 12px 0 0;
   display: flex;
   align-items: flex-start;
   gap: 7px;
   color: #73839b;
   font-size: 10px;
   line-height: 1.5;
}
.form-note .icon {
   width: 13px;
   height: 13px;
   margin-top: 1px;
   color: var(--blue);
}
.form-feedback {
   font-size: 11px;
   color: #127452;
   margin: 7px 0 0;
}
.form-feedback.is-error {
   color: #b61830;
}
.form-feedback:empty {
   display: none;
}
.section {
   padding: 50px 0;
}
.section-kicker {
   margin-bottom: 12px;
}
.section-heading {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   gap: 30px;
   margin-bottom: 32px;
}
.section-heading h2 {
   margin: 0;
   max-width: 650px;
}
.section-heading h2 span {
   color: var(--red);
}
.section-heading p {
   max-width: 345px;
   font-size: 13px;
   line-height: 1.8;
   color: #67788e;
   margin: 0;
}
.benefits {
   background: linear-gradient(#f5f8fc, #fff);
}
.benefit-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 16px;
}
.benefit-card {
   min-height: 230px;
   border-radius: 17px;
   background: #fff;
   border: 1px solid #edf1f5;
   padding: 27px 23px;
   box-shadow: var(--shadow);
   transition: transform 0.2s;
}
.benefit-card:hover {
   transform: translateY(-5px);
}
.benefit-icon {
   display: grid;
   place-items: center;
   width: 51px;
   height: 51px;
   margin-bottom: 23px;
   color: var(--red);
   background: #fff1f2;
   border-radius: 13px;
}
.benefit-icon .icon {
   width: 26px;
   height: 26px;
}
.benefit-card h3 {
   font-size: 17px;
   margin-bottom: 12px;
}
.benefit-card p {
   font-size: 13px;
   color: #6d7c90;
   line-height: 1.8;
   margin-bottom: 0;
}
.how {
   background: #fff;
}
.steps {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 22px;
}
.step {
   position: relative;
   min-height: 220px;
   border-top: 1px solid #dae3ed;
   padding: 28px 35px 10px 75px;
}
.step:after {
   content: "→";
   position: absolute;
   top: 69px;
   right: -17px;
   color: #c3d2e3;
   font-size: 30px;
}
.step:last-child:after {
   display: none;
}
.step-number {
   position: absolute;
   top: 20px;
   left: 15px;
   font-size: 42px;
   color: #e5ecf4;
   font-weight: 900;
   letter-spacing: -0.1em;
}
.step-icon {
   display: grid;
   place-items: center;
   width: 50px;
   height: 50px;
   border-radius: 14px;
   background: #f7e7e9;
   color: var(--red);
   margin-bottom: 23px;
}
.step-icon .icon {
   width: 27px;
   height: 27px;
}
.step h3 {
   font-size: 17px;
   margin-bottom: 10px;
}
.step p {
   font-size: 13px;
   color: #667990;
   line-height: 1.75;
   margin: 0;
}
.categories {
   background: #f3f7fb;
}
.category-grid {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 16px;
}
.category-card {
   text-align: left;
   position: relative;
   display: flex;
   flex-direction: column;
   overflow: hidden;
   border: 1px solid #e8eef4;
   border-radius: 16px;
   min-height: 230px;
   background: #fff;
   padding: 0;
   transition:
      transform 0.2s,
      box-shadow 0.2s;
   box-shadow: 0 8px 25px rgba(17, 39, 68, 0.035);
}
.category-card:hover {
   transform: translateY(-5px);
   box-shadow: 0 15px 35px rgba(11, 40, 72, 0.1);
}
.category-art {
   position: relative;
   display: grid;
   place-items: center;
   height: 162px;
   background:
      radial-gradient(ellipse at 50% 95%, #dae4ef, transparent 70%),
      linear-gradient(148deg, #fff, #f1f5fa);
   overflow: hidden;
}
.category-art:before {
   position: absolute;
   content: "";
   width: 147px;
   height: 147px;
   border-radius: 50%;
   border: 1px solid rgba(45, 85, 132, 0.11);
   transform: translate(23px, 1px);
}
.category-art .icon {
   width: 102px;
   height: 102px;
   stroke-width: 1.25;
   color: #315a82;
   filter: drop-shadow(5px 11px 4px rgba(6, 35, 63, 0.13));
   transform: rotate(-10deg);
   transition: transform 0.2s;
}
.category-card:hover .category-art .icon {
   transform: rotate(-6deg) scale(1.06);
}
.cat-oil .category-art .icon,
.cat-battery .category-art .icon {
   color: #1c3552;
}
.cat-filter .category-art .icon,
.cat-flask .category-art .icon {
   color: #b45f26;
}
.cat-brake .category-art .icon,
.cat-plug .category-art .icon {
   color: #a52a38;
}
.cat-suspension .category-art .icon,
.cat-more .category-art .icon {
   color: #505e70;
}
.category-bottom {
   min-height: 65px;
   padding: 13px 14px;
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 9px;
   width: 100%;
}
.category-bottom strong {
   font-size: 13px;
   line-height: 1.35;
}
.cat-arrow {
   width: 30px;
   height: 30px;
   border: 1px solid #f0c9ce;
   display: grid;
   place-items: center;
   color: var(--red);
   border-radius: 50%;
   flex: none;
}
.cat-arrow .icon {
   width: 16px;
   height: 16px;
}
.cta-section {
   background:
      radial-gradient(circle at 7% 30%, #104272, transparent 33%),
      linear-gradient(120deg, #061a35, #072344);
   overflow: hidden;
   color: #fff;
}
.cta-inner {
   position: relative;
   min-height: 300px;
   display: grid;
   grid-template-columns: 1.45fr 1fr;
   align-items: center;
   gap: 90px;
   padding: 55px 0 58px 180px;
}
.cta-decoration {
   position: absolute;
   left: -124px;
   top: 32px;
   opacity: 0.16;
   transform: rotate(-18deg);
}
.cta-decoration .icon {
   width: 310px;
   height: 310px;
   stroke-width: 0.8;
}
.cta-copy {
   position: relative;
}
.cta-copy h2 {
   font-size: clamp(26px, 3.5vw, 45px);
   max-width: 600px;
   margin: 0 0 12px;
}
.cta-copy h2 span {
   color: #ff6975;
}
.cta-copy p {
   font-size: 14px;
   color: #c8d5e4;
   max-width: 550px;
   margin-bottom: 23px;
}
.cta-actions {
   display: flex;
   gap: 12px;
   flex-wrap: wrap;
}
.cta-points {
   list-style: none;
   margin: 0;
   padding: 0;
   display: grid;
   gap: 18px;
   color: #ecf3fc;
   font-size: 13px;
   font-weight: 700;
}
.cta-points li {
   display: flex;
   align-items: center;
   gap: 12px;
}
.cta-points .icon {
   color: #fa6474;
   width: 22px;
   height: 22px;
}
.stores {
   background: #fff;
}
.store-grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 23px;
}
.store-card {
   border: 1px solid #edf0f3;
   box-shadow: 0 15px 38px rgba(13, 34, 65, 0.08);
   background: #fff;
   border-radius: 17px;
   overflow: hidden;
}
.store-photo {
   position: relative;
   height: 277px;
   background: #e1e8f0;
}
.store-photo img {
   height: 100%;
   width: 100%;
   object-fit: cover;
   object-position: center 56%;
}
.store-card:nth-child(2) .store-photo img {
   object-position: center 55%;
}
.store-badge {
   position: absolute;
   top: 16px;
   left: 16px;
   display: inline-flex;
   background: var(--red);
   color: #fff;
   border-radius: 8px;
   padding: 8px 13px;
   font-weight: 800;
   font-size: 12px;
   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
}
.store-body {
   padding: 24px;
}
.store-body h3 {
   font-size: 20px;
   margin-bottom: 18px;
}
.store-body h3 span {
   color: var(--red);
}
.store-detail {
   display: flex;
   align-items: flex-start;
   gap: 11px;
   margin: 0 0 14px;
   font-size: 13px;
   font-weight: 800;
   line-height: 1.6;
}
.store-detail .icon {
   width: 20px;
   color: var(--red);
   margin-top: 1px;
}
.store-detail small {
   display: block;
   color: #7a8999;
   font-size: 11px;
   font-weight: 600;
   margin-top: 1px;
}
.store-buttons {
   display: grid;
   grid-template-columns: 1fr 1fr;
   gap: 10px;
   margin-top: 23px;
}
.store-buttons .btn {
   padding: 13px 10px;
   font-size: 12px;
}
.final-cta {
   background: #f1f6fb;
}
.final-cta-inner {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 30px;
}
.final-cta h2 {
   margin-bottom: 10px;
}
.final-cta p {
   margin-bottom: 0;
   color: var(--muted);
}
.final-actions {
   display: flex;
   gap: 12px;
}
.footer {
   background: #06152a;
   color: #fff;
   padding: 66px 0 20px;
}
.footer-columns {
   display: grid;
   grid-template-columns: 1.55fr 0.85fr 1.15fr;
   gap: 70px;
   padding-bottom: 55px;
}
.footer-about {
   position: relative;
   padding-left: 80px;
}
.footer-mark {
   position: absolute;
   left: 0;
   top: 0;
   width: 61px;
   height: 61px;
   object-fit: contain;
}
.footer-about h2 {
   font-size: 32px;
   margin: 0 0 14px;
}
.footer-about h2 span {
   display: block;
   font-size: 13px;
   letter-spacing: 0;
   font-weight: 500;
   color: #c9d5e6;
}
.footer-about p {
   font-size: 13px;
   line-height: 1.75;
   color: #aebdd1;
   max-width: 320px;
}
.footer h3 {
   font-size: 15px;
   margin: 0 0 22px;
}
.footer-columns > div:not(:first-child) {
   display: flex;
   flex-direction: column;
   gap: 13px;
}
.footer a,
.footer-text {
   font-size: 13px;
   color: #c8d5e4;
   display: flex;
   align-items: center;
   gap: 9px;
}
.footer .icon {
   width: 18px;
   height: 18px;
   color: #ef6875;
}
.footer-bottom {
   display: flex;
   justify-content: space-between;
   align-items: center;
   padding-top: 20px;
   border-top: 1px solid #263951;
   color: #8ea3bb;
   font-size: 12px;
}
.footer-bottom a {
   font-size: 12px;
}
.mobile-sticky {
   display: none;
}
@media (max-width: 1170px) {
   .desktop-nav {
      gap: 17px;
   }
   .header-actions {
      gap: 8px;
   }
   .header-phone {
      width: 45px;
      height: 45px;
      justify-content: center;
      background: #f3f6f9;
      border-radius: 10px;
   }
   .header-phone span {
      display: none;
   }
   .hero h1 {
      font-size: clamp(34px, 4.3vw, 52px);
   }
   .hero-grid {
      grid-template-columns: 1.1fr 0.9fr;
      gap: 18px;
   }
   .cta-inner {
      gap: 35px;
      padding-left: 125px;
   }
   .footer-columns {
      gap: 40px;
   }
}
@media (max-width: 970px) {
   .header-actions .header-cta,
   .desktop-nav {
      display: none;
   }
   .header-actions {
      margin-left: auto;
   }
   .menu-toggle {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 45px;
      height: 45px;
      background: #eff4f9;
      color: var(--ink);
      border: 0;
      border-radius: 10px;
   }
   .menu-toggle .icon {
      width: 23px;
      height: 23px;
   }
   .menu-toggle .close-icon {
      display: none;
   }
   .menu-toggle[aria-expanded="true"] .close-icon {
      display: block;
   }
   .menu-toggle[aria-expanded="true"] .menu-icon {
      display: none;
   }
   .mobile-nav:not([hidden]) {
      display: flex;
      flex-direction: column;
      gap: 0;
      background: #fff;
      padding: 5px 24px 20px;
      border-top: 1px solid #e9edf3;
      box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
   }
   .mobile-nav a {
      padding: 13px 0;
      border-bottom: 1px solid #e7edf4;
      font-size: 14px;
      font-weight: 800;
   }
   .hero-grid {
      grid-template-columns: 1fr;
      gap: 0;
      padding-top: 57px;
      padding-bottom: 55px;
   }
   .hero-photo {
      width: 100%;
      opacity: 0.32;
   }
   .hero:before {
      background: linear-gradient(
         90deg,
         rgba(7, 26, 52, 0.99),
         rgba(7, 26, 52, 0.81)
      );
   }
   .hero-copy {
      max-width: 720px;
   }
   .hero h1 {
      max-width: 680px;
   }
   .hero-side {
      padding-top: 38px;
      align-self: start;
   }
   .lead-card {
      margin-left: 0;
      max-width: 600px;
   }
   .hero-picture-note {
      display: none;
   }
   .trust-list {
      margin-top: 40px;
   }
   .benefit-grid {
      grid-template-columns: repeat(2, 1fr);
   }
   .category-grid {
      grid-template-columns: repeat(4, 1fr);
   }
   .cta-inner {
      grid-template-columns: 1fr;
      gap: 20px;
      padding-left: 55px;
   }
   .cta-points {
      grid-template-columns: 1fr 1fr;
   }
   .steps .step {
      padding-left: 55px;
   }
   .footer-columns {
      grid-template-columns: 1.3fr 0.7fr 1fr;
      gap: 20px;
   }
   .footer-about {
      padding-left: 0;
      padding-top: 75px;
   }
}
@media (max-width: 650px) {
   html {
      scroll-padding-top: 75px;
   }
   body {
      padding-bottom: 76px;
   }
   .header-phone {
      width: 39px;
      height: 39px;
   }
   .container {
      width: min(100% - 34px, 520px);
   }
   .site-header .header-inner {
      min-height: 68px;
   }
   .logo-link img {
      width: 151px;
      max-height: 52px;
   }
   .menu-toggle {
      width: 39px;
      height: 39px;
   }
   .hero-grid {
      padding-top: 45px;
      padding-bottom: 45px;
   }
   .hero h1 {
      font-size: clamp(33px, 9vw, 45px);
      letter-spacing: -0.055em;
   }
   .hero h1 br {
      display: none;
   }
   .hero-description {
      font-size: 14px;
      line-height: 1.8;
   }
   .hero-eyebrow {
      font-size: 10px;
   }
   .hero-buttons {
      align-items: stretch;
      flex-direction: column;
   }
   .hero-buttons .btn {
      width: 100%;
      font-size: 13px;
   }
   .trust-list {
      margin-top: 32px;
      grid-template-columns: repeat(2, 1fr);
      row-gap: 18px;
   }
   .trust-list > div:nth-child(2) {
      border-right: none;
   }
   .trust-icon {
      margin-bottom: 6px;
   }
   .hero-side {
      padding-top: 32px;
   }
   .lead-card {
      padding: 22px;
   }
   .lead-head h2 {
      font-size: 20px;
   }
   .section {
      padding: 30px 0;
   }
   .section-heading {
      display: block;
      margin-bottom: 24px;
   }
   .section-heading h2 {
      font-size: clamp(27px, 7.5vw, 35px);
      margin-bottom: 10px;
   }
   .section-heading p {
      font-size: 13px;
   }
   .benefit-grid {
      grid-template-columns: 1fr 1fr;
      gap: 10px;
   }
   .benefit-card {
      min-height: 195px;
      padding: 18px 14px;
   }
   .benefit-card h3 {
      font-size: 14px;
   }
   .benefit-card p {
      font-size: 11px;
   }
   .benefit-icon {
      width: 42px;
      height: 42px;
      margin-bottom: 16px;
   }
   .benefit-icon .icon {
      width: 23px;
   }
   .steps {
      grid-template-columns: 1fr;
      gap: 9px;
   }
   .step {
      min-height: 0;
      padding: 19px 15px 21px 76px !important;
      border: 1px solid #e7edf4;
      border-radius: 13px;
   }
   .step-number {
      font-size: 31px;
      top: 18px;
      left: 19px;
   }
   .step-icon {
      width: 42px;
      height: 42px;
      margin: 0 0 12px;
   }
   .step h3 {
      font-size: 16px;
   }
   .step p {
      font-size: 12px;
   }
   .step:after {
      display: none;
   }
   .category-grid {
      grid-template-columns: 1fr 1fr;
      gap: 11px;
   }
   .category-card {
      min-height: 175px;
   }
   .category-art {
      height: 112px;
   }
   .category-art .icon {
      width: 72px;
      height: 72px;
   }
   .category-art:before {
      width: 110px;
      height: 110px;
   }
   .category-bottom {
      min-height: 64px;
      padding: 10px;
   }
   .category-bottom strong {
      font-size: 11px;
   }
   .cat-arrow {
      width: 25px;
      height: 25px;
   }
   .cat-arrow .icon {
      width: 13px;
      height: 13px;
   }
   .cta-inner {
      padding: 32px 0;
      display: block;
   }
   .cta-decoration {
      opacity: 0.08;
      left: auto;
      right: -150px;
      top: 10px;
   }
   .cta-copy h2 {
      font-size: 30px;
   }
   .cta-actions {
      flex-direction: column;
      margin-bottom: 28px;
   }
   .cta-actions .btn {
      width: 100%;
   }
   .cta-points {
      grid-template-columns: 1fr;
      gap: 11px;
      font-size: 12px;
   }
   .store-grid {
      grid-template-columns: 1fr;
      gap: 18px;
   }
   .store-photo {
      height: 215px;
   }
   .store-body {
      padding: 18px;
   }
   .store-body h3 {
      font-size: 18px;
   }
   .store-buttons .btn {
      font-size: 11px;
   }
   .final-cta-inner {
      display: block;
   }
   .final-cta h2 {
      font-size: 28px;
   }
   .final-actions {
      flex-direction: column;
      margin-top: 24px;
   }
   .footer {
      padding: 50px 0 20px;
   }
   .footer-columns {
      grid-template-columns: 1fr 1fr;
      gap: 32px 20px;
      padding-bottom: 33px;
   }
   .footer-about {
      grid-column: 1/-1;
      padding: 0 0 0 75px;
   }
   .footer-about h2 {
      font-size: 26px;
   }
   .footer-columns > div:last-child {
      grid-column: 1/-1;
   }
   .footer-bottom {
      align-items: flex-start;
      gap: 15px;
      flex-wrap: wrap;
   }
   .mobile-sticky {
      position: fixed;
      z-index: 65;
      bottom: 0;
      left: 0;
      right: 0;
      display: flex;
      gap: 10px;
      align-items: center;
      padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
      background: #fff;
      box-shadow: 0 -6px 25px rgba(7, 24, 46, 0.13);
   }
   .mobile-call {
      display: grid;
      place-items: center;
      flex: none;
      width: 52px;
      height: 52px;
      border: 1px solid #cad6e6;
      border-radius: 10px;
      color: var(--navy);
   }
   .mobile-lead {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      flex: 1;
      min-height: 52px;
      background: var(--red);
      border-radius: 10px;
      color: #fff;
      font-weight: 800;
      font-size: 13px;
   }
   .mobile-lead .icon {
      width: 18px;
   }
}
@media (prefers-reduced-motion: reduce) {
   *,
   *:before,
   *:after {
      scroll-behavior: auto !important;
      transition: none !important;
      animation: none !important;
   }
}

/* AMG 1.1.1 — contact options and context-aware mobile CTA. */
.amg-contact-dialog {
   width: min(92vw, 420px);
   max-width: none;
   border: 0;
   padding: 0;
   border-radius: 18px;
   background: #fff;
   color: #14284b;
   box-shadow: 0 30px 90px #06163055;
}
.amg-contact-dialog::backdrop {
   background: rgba(5, 18, 36, 0.68);
   backdrop-filter: blur(4px);
}
.amg-contact-panel {
   position: relative;
   padding: 28px 24px;
}
.amg-contact-panel h2 {
   font-size: 22px;
   line-height: 1.25;
   padding-right: 38px;
   margin: 0 0 9px;
}
.amg-contact-panel p {
   color: #62748d;
   font-size: 13px;
   line-height: 1.6;
   margin: 0 0 19px;
}
.amg-contact-close {
   position: absolute;
   right: 17px;
   top: 15px;
   width: 38px;
   height: 38px;
   display: grid;
   place-items: center;
   border: 0;
   border-radius: 10px;
   background: #eff3f8;
   color: #18334f;
   font-size: 26px;
   line-height: 1;
}
.amg-contact-options {
   display: grid;
   gap: 10px;
}
.amg-contact-options a {
   display: flex;
   align-items: center;
   gap: 13px;
   min-height: 54px;
   padding: 12px 15px;
   background: #f5f8fc;
   border: 1px solid #dfe8f2;
   border-radius: 12px;
   color: #183a61;
   font-size: 14px;
   font-weight: 800;
}
.amg-contact-options a:hover,
.amg-contact-options a:focus-visible {
   background: #e8f1fb;
   border-color: #91b3d9;
}
.amg-contact-options .icon {
   width: 22px;
   height: 22px;
   color: #c91d31;
}
.amg-contact-viber-icon {
   display: grid;
   place-items: center;
   width: 22px;
   height: 22px;
   border-radius: 7px;
   background: #7460a7;
   color: white;
   font-size: 13px;
   font-weight: 900;
}
.amg-contact-panel small {
   display: block;
   margin-top: 15px;
   font-size: 11px;
   color: #738399;
   line-height: 1.6;
}
.form-note a {
   text-decoration: underline;
   text-underline-offset: 3px;
   color: #174d81;
   font-weight: 800;
}
@media (max-width: 650px) {
   /* Keep the panel mounted so it can slide and fade in both directions. */
   .mobile-sticky {
      display: flex;
      visibility: hidden;
      opacity: 0;
      pointer-events: none;
      transform: translate3d(0, calc(100% + 12px), 0);
      transition:
         transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
         opacity 0.28s ease,
         visibility 0s linear 0.42s;
   }
   .mobile-sticky.is-visible {
      visibility: visible;
      opacity: 1;
      pointer-events: auto;
      transform: translate3d(0, 0, 0);
      transition-delay: 0s;
   }
   .store-buttons .btn {
      font-size: 12px;
      min-width: 0;
   }
   .store-buttons button.btn {
      width: 100%;
      justify-content: center;
   }
   .amg-contact-panel {
      padding: 25px 19px;
   }
}
/* AMG motion polish — deliberate easing without animating every DOM element. */
.site-header {
   position: sticky;
   top: 0;
   z-index: 90;
   background: rgba(255, 255, 255, 0.985);
   -webkit-backdrop-filter: blur(12px);
   backdrop-filter: blur(12px);
   transition:
      box-shadow 0.32s ease,
      background-color 0.32s ease;
}
.site-header.is-scrolled {
   box-shadow: 0 8px 28px rgba(7, 25, 48, 0.14);
   background: rgba(255, 255, 255, 0.97);
}
.store-card {
   transition:
      transform 0.32s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.32s ease;
}
@media (hover: hover) {
   .store-card:hover {
      transform: translateY(-4px);
      box-shadow: 0 20px 42px rgba(7, 25, 48, 0.13);
   }
}
.btn {
   transition:
      background-color 0.25s ease,
      color 0.25s ease,
      border-color 0.25s ease,
      transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
      box-shadow 0.3s ease;
}

/* Burger dropdown stays in the DOM and grows/fades below the sticky header. */
@media (max-width: 970px) {
   .site-header .mobile-nav {
      display: flex;
      position: absolute;
      top: 100%;
      left: 0;
      right: 0;
      z-index: 2;
      max-height: 0;
      padding: 0 24px;
      overflow: hidden;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(-9px);
      box-shadow: none;
      transition:
         max-height 0.42s cubic-bezier(0.22, 1, 0.36, 1),
         padding 0.35s ease,
         opacity 0.28s ease,
         transform 0.38s cubic-bezier(0.22, 1, 0.36, 1),
         visibility 0s linear 0.42s;
   }
   .site-header .mobile-nav[hidden] {
      display: none;
   }
   .site-header.is-menu-open .mobile-nav {
      max-height: 420px;
      padding: 5px 24px 20px;
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(0);
      box-shadow: 0 14px 28px rgba(7, 25, 48, 0.13);
      transition-delay: 0s;
   }
   .site-header .menu-toggle {
      position: relative;
      overflow: hidden;
   }
   .site-header .menu-toggle .icon {
      position: absolute;
      top: 50%;
      left: 50%;
      display: block;
      transition:
         opacity 0.22s ease,
         transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
   }
   .site-header .menu-toggle .menu-icon {
      opacity: 1;
      transform: translate(-50%, -50%) rotate(0);
   }
   .site-header .menu-toggle .close-icon {
      opacity: 0;
      transform: translate(-50%, -50%) rotate(-80deg);
   }
   .site-header .menu-toggle[aria-expanded="true"] .menu-icon {
      display: block;
      opacity: 0;
      transform: translate(-50%, -50%) rotate(80deg);
   }
   .site-header .menu-toggle[aria-expanded="true"] .close-icon {
      display: block;
      opacity: 1;
      transform: translate(-50%, -50%) rotate(0);
   }
}
/* Respect the operating system's reduced-motion setting, including dialog entrances. */
@keyframes amg-dialog-arrive {
   from {
      opacity: 0;
      transform: translateY(12px) scale(0.985);
   }
   to {
      opacity: 1;
      transform: translateY(0) scale(1);
   }
}
@keyframes amg-backdrop-arrive {
   from {
      opacity: 0;
   }
   to {
      opacity: 1;
   }
}
.amg-contact-dialog[open],
.lead-success-dialog[open],
.parts-modal[open] {
   animation: amg-dialog-arrive 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}
.amg-contact-dialog[open]::backdrop,
.lead-success-dialog[open]::backdrop,
.parts-modal[open]::backdrop {
   animation: amg-backdrop-arrive 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
   .site-header,
   .site-header .mobile-nav,
   .site-header .menu-toggle .icon,
   .mobile-sticky,
   .store-card,
   .btn {
      transition: none !important;
   }
   .amg-contact-dialog[open],
   .lead-success-dialog[open],
   .parts-modal[open],
   .amg-contact-dialog[open]::backdrop,
   .lead-success-dialog[open]::backdrop,
   .parts-modal[open]::backdrop {
      animation: none !important;
   }
}