* {
  padding: 0;
  margin: 0;
  border: 0;
}

*, *:before, *:after {
  box-sizing: border-box;
}

:focus, :active {
  outline: none;
}

a:focus, a:active {
  outline: none;
}

nav, footer, header, aside {
  display: block;
}

html, body {
  height: 100%;
  width: 100%;
  font-size: 100%;
  line-height: 1;
  -ms-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

input, button, textarea {
  font-family: inherit;
}

input::-ms-clear {
  display: none;
}

button {
  cursor: pointer;
  background: none;
}

button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

ul, ol, li {
  list-style: none;
}

img {
  vertical-align: top;
  max-width: 100%;
}

h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
}

@font-face {
  font-family: "Barlow Semi Condensed";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("../fonts/BarlowSemiCondensed-Light.ttf") format("truetype");
}
@font-face {
  font-family: "Barlow Semi Condensed";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/BarlowSemiCondensed-Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Barlow Semi Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/BarlowSemiCondensed-Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Barlow Semi Condensed";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/BarlowSemiCondensed-ExtraBold.ttf") format("truetype");
}
.container {
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(25px, 100vw / 1600 * 25, 40px);
  max-width: 100%;
}
@media (min-width: 575px) {
  .container {
    max-width: 540px;
  }
}
@media (min-width: 820px) {
  .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}
@media (min-width: 1280px) {
  .container {
    max-width: 1140px;
  }
}
@media (min-width: 1536px) {
  .container {
    max-width: 1300px;
  }
}
@media (min-width: 1600px) {
  .container {
    max-width: clamp(1320px, 100vw / 1600 * 1320, 2112px);
  }
}

body {
  color: #26292D;
  font-size: 18px;
  font-family: "Barlow Semi Condensed", sans-serif;
}

html {
  height: 100%;
  margin-top: 0 !important;
}

body {
  display: flex;
  flex-direction: column;
  height: 100%;
}

header {
  flex: 0 0 auto;
}

main {
  position: relative;
  flex: 1 0 auto;
}

footer {
  flex: 0 0 auto;
}

html :where(.wp-block) {
  max-width: 90% !important;
}

.editor-styles-wrapper {
  padding-bottom: 0 !important;
  overflow: hidden;
}

h1,
h2 {
  font-size: clamp(40px, 100vw / 1600 * 75, 120px);
  font-weight: 800;
  line-height: 0.9;
  text-transform: uppercase;
}

h3 {
  font-size: clamp(42px, 100vw / 1600 * 60, 96px);
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}

h4 {
  font-size: clamp(24px, 100vw / 1600 * 40, 64px);
  font-weight: 800;
  line-height: 1;
}

h5 {
  font-size: clamp(22px, 100vw / 1600 * 25, 40px);
  font-weight: 400;
  line-height: 1.3;
}

h6 {
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  font-weight: 800;
  line-height: 1.2;
}

p {
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  font-weight: 400;
  line-height: 1.5;
}
p a {
  text-decoration: underline;
  color: #F32735;
  transition: 0.3s;
}
p a:hover {
  text-decoration: none;
}

.title-sm {
  font-size: clamp(35px, 100vw / 1600 * 35, 56px);
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
}
.title-sm small {
  font-size: clamp(25px, 100vw / 1600 * 25, 40px);
  font-weight: 400;
  line-height: 1.3;
  text-transform: none;
}

.badge {
  display: inline-flex;
  padding: clamp(5px, 100vw / 1600 * 5, 8px) clamp(23px, 100vw / 1600 * 23, 36.8px);
  border-radius: clamp(40px, 100vw / 1600 * 40, 64px);
  background: #F32735;
  color: #fff;
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: clamp(6px, 100vw / 1600 * 6, 9.6px);
  text-transform: uppercase;
}

.subtitle {
  margin-bottom: clamp(16px, 100vw / 1600 * 16, 25.6px);
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  font-weight: 400;
  line-height: 1;
  letter-spacing: clamp(6px, 100vw / 1600 * 6, 9.6px);
  text-transform: uppercase;
  color: #F32735;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: clamp(20px, 100vw / 1600 * 20, 32px);
  text-align: center;
  border-radius: clamp(10px, 100vw / 1600 * 10, 16px);
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(5px);
  border: none;
  color: #fff;
  font-size: clamp(18px, 100vw / 1600 * 18, 28.8px);
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
  height: clamp(55px, 100vw / 1600 * 55, 88px);
  white-space: nowrap;
  padding: 0 clamp(25px, 100vw / 1600 * 25, 40px);
  transition: 0.3s;
}
.btn img {
  flex-shrink: 0;
  transition: transform 0.3s;
}
.btn:hover {
  background: #F32735;
}
.btn:hover img {
  transform: translateX(3px);
}

header {
  position: absolute;
  top: 0;
  left: 0;
  right: var(--scrollbar, 0px);
  z-index: 100;
}
header:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: clamp(137px, 100vw / 1600 * 137, 219.2px);
  background: linear-gradient(to bottom, #000, rgba(0, 0, 0, 0));
  opacity: 0.2;
  pointer-events: none;
}

.wrapper-menu {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: clamp(844px, 100vw / 1600 * 844, 1350.4px);
  max-width: 100%;
  height: clamp(69px, 100vw / 1600 * 69, 110.4px);
  margin: 0 auto;
  padding: 0 clamp(30px, 100vw / 1600 * 30, 48px) 0 clamp(31px, 100vw / 1600 * 31, 49.6px);
  border-radius: 0 0 clamp(10px, 100vw / 1600 * 10, 16px) clamp(10px, 100vw / 1600 * 10, 16px);
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(5px);
}
@media (max-width: 992px) {
  .wrapper-menu {
    width: calc(100% - 50px);
  }
}
@media (max-width: 576px) {
  .wrapper-menu {
    width: calc(100% - 57px);
    height: 68px;
    padding: 0 10px;
  }
}

.logo {
  position: absolute;
  left: 50%;
  top: clamp(15px, 100vw / 1600 * 15, 24px);
  transform: translateX(-50%);
  transition: opacity 0.3s;
}
@media (max-width: 576px) {
  .logo {
    top: 22px;
  }
}
.logo img {
  display: block;
  width: clamp(239px, 100vw / 1600 * 239, 382.4px);
  height: auto;
}
@media (max-width: 576px) {
  .logo img {
    width: 133px;
  }
}
.logo:hover {
  opacity: 0.8;
}

.burger {
  position: relative;
  width: clamp(25px, 100vw / 1600 * 25, 40px);
  height: clamp(17.5px, 100vw / 1600 * 17.5, 28px);
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}
.burger span {
  position: absolute;
  left: 0;
  width: clamp(25px, 100vw / 1600 * 25, 40px);
  height: 1.5px;
  border-radius: 1px;
  background: #fff;
  transition: top 0.25s 0.25s, width 0.25s, transform 0.25s, opacity 0.25s 0.25s;
}
.burger span:nth-child(1) {
  top: 0;
}
.burger span:nth-child(2) {
  top: clamp(8px, 100vw / 1600 * 8, 12.8px);
  width: clamp(20px, 100vw / 1600 * 20, 32px);
}
.burger span:nth-child(3) {
  top: clamp(16px, 100vw / 1600 * 16, 25.6px);
}
.burger:hover span:nth-child(2) {
  width: clamp(25px, 100vw / 1600 * 25, 40px);
}

header.is-menu-open:before {
  opacity: 0;
}
header.is-menu-open .wrapper-menu {
  background: none;
  backdrop-filter: none;
}
header.is-menu-open .burger span {
  transition: top 0.25s, width 0.25s, transform 0.25s 0.25s, opacity 0.25s;
}
header.is-menu-open .burger span:nth-child(1), header.is-menu-open .burger span:nth-child(3) {
  top: clamp(8px, 100vw / 1600 * 8, 12.8px);
  width: clamp(25px, 100vw / 1600 * 25, 40px);
}
header.is-menu-open .burger span:nth-child(1) {
  transform: rotate(45deg);
}
header.is-menu-open .burger span:nth-child(2) {
  opacity: 0;
  transform: translateX(-12px);
}
header.is-menu-open .burger span:nth-child(3) {
  transform: rotate(-45deg);
}

.header-link {
  font-size: clamp(18px, 100vw / 1600 * 18, 28.8px);
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
  color: #fff;
  transition: color 0.3s;
}
@media (max-width: 576px) {
  .header-link {
    width: 88px;
    font-size: 16px;
    line-height: 1;
    text-align: right;
  }
}
.header-link:hover {
  color: #F32735;
}

.main_menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100);
  padding: clamp(218px, 100vw / 1600 * 218, 348.8px) clamp(25px, 100vw / 1600 * 25, 40px) clamp(60px, 100vw / 1600 * 60, 96px);
  overflow-y: auto;
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(5px);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s, visibility 0.3s;
  z-index: -1;
}
@media (max-width: 576px) {
  .main_menu {
    padding-top: 140px;
  }
}
.main_menu ul {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(62.5px, 100vw / 1600 * 62.5, 100px);
}
@media (max-width: 576px) {
  .main_menu ul {
    gap: 40px;
  }
}
.main_menu a {
  display: block;
  color: #fff;
  font-size: clamp(35px, 100vw / 1600 * 35, 56px);
  font-weight: 800;
  line-height: 0.9;
  text-transform: uppercase;
  text-align: center;
}
@media (max-width: 576px) {
  .main_menu a {
    font-size: 28px;
  }
}
.main_menu a {
  transition: color 0.3s, transform 0.3s;
}
.main_menu a:hover {
  color: #F32735;
  transform: scale(1.05);
}

header.is-menu-open .main_menu {
  opacity: 1;
  visibility: visible;
}

.bg-mob,
.logo-mob,
.glow-mob,
.image-mob {
  display: none;
}

.s-hero {
  position: relative;
  isolation: isolate;
  aspect-ratio: 1600/1000;
  overflow: hidden;
}
@media (max-width: 576px) {
  .s-hero {
    aspect-ratio: 393/714;
  }
}
.s-hero .brand,
.s-hero .glow,
.s-hero .vehicle,
.s-hero .logo-mob,
.s-hero .glow-mob {
  position: absolute;
  height: auto;
}
.s-hero .brand {
  left: 6.269%;
  top: 52.4%;
  width: 88.606%;
}
.s-hero .glow {
  left: 37.559%;
  top: 48.779%;
  width: 18.377%;
}
.s-hero .vehicle {
  left: 40.634%;
  top: 4.749%;
  width: 25.279%;
}
@media (max-width: 576px) {
  .s-hero .vehicle {
    left: 34.1%;
    top: 13.03%;
    width: 64.12%;
  }
}
.s-hero .logo-mob {
  left: 7.63%;
  top: 64.57%;
  width: 84.86%;
}
.s-hero .glow-mob {
  left: 20.36%;
  top: 47.9%;
  width: 58.02%;
}
.s-hero .btn {
  position: absolute;
  left: 50%;
  bottom: 6.2%;
  transform: translateX(-50%);
  z-index: 1;
}
@media (max-width: 576px) {
  .s-hero .btn {
    bottom: 5.46%;
  }
}
.s-hero .btn img {
  width: clamp(17px, 100vw / 1600 * 17, 27.2px);
  height: auto;
}
@media (max-width: 576px) {
  .s-hero .bg-pc,
  .s-hero .brand,
  .s-hero .glow {
    display: none;
  }
}
@media (max-width: 576px) {
  .s-hero .bg-mob,
  .s-hero .logo-mob,
  .s-hero .glow-mob {
    display: block;
  }
}

.s-ride {
  padding: clamp(225.5px, 100vw / 1600 * 451, 721.6px) 0 clamp(123px, 100vw / 1600 * 246, 393.6px) 0;
  position: relative;
  isolation: isolate;
  color: #fff;
}
@media (max-width: 576px) {
  .s-ride {
    height: 372px;
    padding: 0;
  }
}
.s-ride:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 46.8%;
  height: 100%;
  background: linear-gradient(to right, #000, rgba(0, 0, 0, 0));
  opacity: 0.4;
  z-index: -1;
}
@media (max-width: 576px) {
  .s-ride:after {
    content: none;
  }
}
.s-ride .subtitle {
  margin-bottom: clamp(13px, 100vw / 1600 * 13, 20.8px);
}
@media (max-width: 576px) {
  .s-ride .container {
    display: none;
  }
}

.s-model {
  padding: 0 0 clamp(85px, 100vw / 1600 * 170, 272px) 0;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #182023;
  color: #fff;
}
@media (max-width: 576px) {
  .s-model {
    padding: 73px 0 113px;
  }
}
.s-model .glow {
  position: absolute;
  top: clamp(67px, 100vw / 1600 * 67, 107.2px);
  left: 50%;
  width: clamp(1572px, 100vw / 1600 * 1572, 2515.2px);
  max-width: none;
  height: auto;
  transform: translateX(-50%);
  z-index: -1;
}
@media (max-width: 576px) {
  .s-model .glow {
    display: none;
  }
}
.s-model .glow-mob {
  position: absolute;
  top: clamp(-265.6px, 100vw / 1600 * -166, -166px);
  left: 50%;
  max-width: none;
  margin-left: clamp(-1012.8px, 100vw / 1600 * -633, -633px);
  z-index: -1;
}
@media (max-width: 576px) {
  .s-model .glow-mob {
    display: block;
  }
}
.s-model .image {
  display: flex;
  justify-content: center;
}
@media (max-width: 576px) {
  .s-model .image {
    display: none;
  }
}
.s-model .image img {
  display: block;
  width: clamp(1600px, 100vw / 1600 * 1600, 2560px);
  max-width: none;
  height: auto;
  flex-shrink: 0;
}
@media (max-width: 820px) {
  .s-model .image img {
    width: 165vw;
  }
}
.s-model .image img {
  -webkit-mask-image: linear-gradient(to bottom, #000 85%, transparent);
  mask-image: linear-gradient(to bottom, #000 85%, transparent);
}
.s-model .image-mob {
  position: relative;
  width: clamp(334px, 100vw / 1600 * 334, 534.4px);
  max-width: calc(100% - clamp(50px, 100vw / 1600 * 50, 80px));
  margin: 0 auto;
}
@media (max-width: 576px) {
  .s-model .image-mob {
    display: block;
  }
}
.s-model .image-mob img {
  display: block;
  width: 100%;
  height: auto;
}
.s-model .image-mob .shadow,
.s-model .image-mob .atv {
  width: clamp(331px, 100vw / 1600 * 331, 529.6px);
  max-width: 100%;
}
.s-model .image-mob .shadow {
  margin-top: clamp(44px, 100vw / 1600 * 44, 70.4px);
  opacity: 0.7;
  mix-blend-mode: multiply;
}
.s-model .image-mob .atv {
  position: absolute;
  left: 0;
  bottom: 0;
}
.s-model .stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  height: clamp(158px, 100vw / 1600 * 158, 252.8px);
  margin-top: clamp(13px, 100vw / 1600 * 13, 20.8px);
  padding: 0 clamp(40px, 100vw / 1600 * 40, 64px);
  align-items: center;
  text-align: center;
  border: 1px solid #656565;
  border-radius: clamp(10px, 100vw / 1600 * 10, 16px);
  background: rgba(125, 125, 125, 0.2);
  backdrop-filter: blur(5px);
}
@media (max-width: 992px) {
  .s-model .stats {
    grid-template-columns: repeat(2, 1fr);
    row-gap: 40px;
    height: auto;
    padding: 34px 20px;
  }
}
@media (max-width: 576px) {
  .s-model .stats {
    grid-template-columns: 1fr;
    width: 227px;
    margin: 114px auto 0;
    padding: 34px 0 53px;
  }
}
.s-model .stats .item {
  position: relative;
}
.s-model .stats .item:not(:first-child):before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 1px;
  height: clamp(54px, 100vw / 1600 * 54, 86.4px);
  margin-top: clamp(-43.2px, 100vw / 1600 * -27, -27px);
  background: #656565;
}
@media (max-width: 576px) {
  .s-model .stats .item:not(:first-child):before {
    top: -20px;
    left: 50%;
    width: 104px;
    height: 1px;
    margin: 0 0 0 -52px;
  }
}
@media (max-width: 992px) {
  .s-model .stats .item:nth-child(3):before {
    content: none;
  }
}
@media (max-width: 576px) {
  .s-model .stats .item:nth-child(3):before {
    content: "";
  }
}
.s-model .stats .value {
  font-size: clamp(60px, 100vw / 1600 * 60, 96px);
  font-weight: 800;
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
}
.s-model .stats .unit {
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
}
.s-model .stats .label {
  margin-top: clamp(-6.4px, 100vw / 1600 * -4, -4px);
  font-size: clamp(18px, 100vw / 1600 * 18, 28.8px);
  line-height: 1.2;
}
.s-model .inner-box {
  position: relative;
  margin-top: clamp(140px, 100vw / 1600 * 140, 224px);
  text-align: center;
}
@media (max-width: 576px) {
  .s-model .inner-box {
    margin-top: 107px;
  }
}
.s-model .logo-bg {
  position: absolute;
  top: clamp(58px, 100vw / 1600 * 58, 92.8px);
  left: 50%;
  width: clamp(1100px, 100vw / 1600 * 1100, 1760px);
  max-width: none;
  height: auto;
  transform: translateX(-50%);
  opacity: 0.04;
  z-index: -1;
}
@media (max-width: 576px) {
  .s-model .logo-bg {
    top: 124px;
    width: 336px;
  }
}
.s-model h5 {
  margin-top: clamp(56px, 100vw / 1600 * 56, 89.6px);
}
@media (max-width: 576px) {
  .s-model h5 {
    max-width: 282px;
    margin: 41px auto 0;
  }
}
@media (max-width: 576px) {
  .s-model h5 br {
    display: none;
  }
}
.s-model .btn {
  margin-top: clamp(71px, 100vw / 1600 * 71, 113.6px);
  gap: clamp(60px, 100vw / 1600 * 60, 96px);
  background: #F32735;
  backdrop-filter: none;
}
@media (max-width: 576px) {
  .s-model .btn {
    margin-top: 51px;
  }
}
.s-model .btn:hover {
  background: #C91E2A;
}
.s-model .btn img {
  width: clamp(11px, 100vw / 1600 * 11, 17.6px);
  height: auto;
  transform: rotate(180deg);
}

.s-model .stats .item,
.s-model .stats .item:before {
  transition: opacity 0.6s, transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}

.s-model .stats.is-hidden .item {
  opacity: 0;
  transform: translateY(30px);
}
.s-model .stats.is-hidden .item:not(:first-child):before {
  transform: scaleY(0);
}

.s-model .stats .item:nth-child(1), .s-model .stats .item:nth-child(1):before {
  transition-delay: 0s;
}
.s-model .stats .item:nth-child(2), .s-model .stats .item:nth-child(2):before {
  transition-delay: 0.15s;
}
.s-model .stats .item:nth-child(3), .s-model .stats .item:nth-child(3):before {
  transition-delay: 0.3s;
}
.s-model .stats .item:nth-child(4), .s-model .stats .item:nth-child(4):before {
  transition-delay: 0.45s;
}

.s-model .stats .value.is-done {
  animation: stat-pop 0.5s ease-out;
}

@keyframes stat-pop {
  0% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.12);
    text-shadow: 0 0 25px rgba(243, 39, 53, 0.8);
  }
  100% {
    transform: scale(1);
  }
}
.s-ways {
  margin: clamp(83px, 100vw / 1600 * 166, 265.6px) 0 clamp(94.5px, 100vw / 1600 * 189, 302.4px) 0;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #fff;
  color: #000;
  text-align: center;
}
@media (max-width: 576px) {
  .s-ways {
    margin: 71px 0 88px;
  }
}
@media (max-width: 576px) {
  .s-ways .subtitle {
    margin-bottom: 10px;
  }
}
.s-ways h5 {
  margin-top: clamp(25px, 100vw / 1600 * 25, 40px);
}
@media (max-width: 576px) {
  .s-ways h5 {
    margin-top: 31px;
  }
}
.s-ways .logo-720 {
  position: absolute;
  top: clamp(473px, 100vw / 1600 * 473, 756.8px);
  left: 50%;
  max-width: none;
  width: clamp(627px, 100vw / 1600 * 627, 1003.2px);
  height: auto;
  transform: rotate(-84.47deg);
  transition: opacity 0.5s;
  z-index: -1;
}
@media (max-width: 576px) {
  .s-ways .logo-720 {
    top: 389px;
    width: 342px;
    height: auto;
  }
}
.s-ways .logo-720-left {
  margin-left: clamp(-1656px, 100vw / 1600 * -1035, -1035px);
}
@media (max-width: 576px) {
  .s-ways .logo-720-left {
    margin-left: -330px;
  }
}
.s-ways .logo-720-right {
  margin-left: clamp(401px, 100vw / 1600 * 401, 641.6px);
  opacity: 0;
}
@media (max-width: 576px) {
  .s-ways .logo-720-right {
    margin-left: -12px;
  }
}
.s-ways .swiper {
  margin-top: clamp(84px, 100vw / 1600 * 84, 134.4px);
  text-align: left;
}
@media (max-width: 576px) {
  .s-ways .swiper {
    margin-top: 53px;
  }
}
.s-ways .swiper-slide {
  position: relative;
  width: clamp(523px, 100vw / 1600 * 523, 836.8px);
  border-radius: clamp(10px, 100vw / 1600 * 10, 16px);
  overflow: hidden;
}
@media (max-width: 820px) {
  .s-ways .swiper-slide {
    width: 400px;
  }
}
@media (max-width: 576px) {
  .s-ways .swiper-slide {
    width: 293px;
  }
}
.s-ways .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.6s;
}
.s-ways .swiper-slide:hover img {
  transform: scale(1.05);
}
.s-ways .swiper-slide h4 {
  position: absolute;
  left: clamp(40px, 100vw / 1600 * 40, 64px);
  bottom: clamp(44px, 100vw / 1600 * 44, 70.4px);
  color: #fff;
}
@media (max-width: 820px) {
  .s-ways .swiper-slide h4 {
    left: 30px;
    bottom: 30px;
  }
}
@media (max-width: 576px) {
  .s-ways .swiper-slide h4 {
    left: 22px;
    bottom: 25px;
  }
}
.s-ways .controls {
  margin-top: clamp(92px, 100vw / 1600 * 92, 147.2px);
}
@media (max-width: 576px) {
  .s-ways .controls {
    margin-top: 44px;
  }
}

.s-ways.is-scrolled .logo-720-left {
  opacity: 0;
}

.s-ways.is-end .logo-720-right {
  opacity: 1;
}

.s-features {
  padding: clamp(50px, 100vw / 1600 * 100, 160px) 0 clamp(50px, 100vw / 1600 * 100, 160px) 0;
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: clamp(1000px, 100vw / 1600 * 1000, 1600px);
  color: #fff;
}
@media (max-width: 820px) {
  .s-features {
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
    padding: 0;
  }
}
.s-features .container {
  display: flex;
  justify-content: flex-end;
}
@media (max-width: 820px) {
  .s-features .container {
    order: 1;
    padding: 0;
  }
}
.s-features .m-accordion {
  width: clamp(523px, 100vw / 1600 * 523, 836.8px);
  padding: clamp(40px, 100vw / 1600 * 40, 64px);
  border-radius: clamp(10px, 100vw / 1600 * 10, 16px);
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(5px);
}
@media (max-width: 820px) {
  .s-features .m-accordion {
    width: 100%;
    border-radius: 10px 10px 0 0;
    background: #182023;
    backdrop-filter: none;
  }
}
@media (max-width: 820px) {
  .s-features .bg {
    position: static;
    order: 2;
    height: 420px;
  }
}
@media (max-width: 576px) {
  .s-features .bg {
    height: 245px;
  }
}

.s-equipment {
  padding: clamp(90px, 100vw / 1600 * 180, 288px) 0 clamp(93px, 100vw / 1600 * 186, 297.6px) 0;
  background: #182023;
  color: #fff;
  text-align: center;
}
@media (max-width: 576px) {
  .s-equipment {
    padding: 95px 0 90px;
  }
}
@media (max-width: 576px) {
  .s-equipment h3 {
    max-width: 324px;
    margin: 0 auto;
  }
}
.s-equipment h5 {
  margin-top: clamp(25px, 100vw / 1600 * 25, 40px);
}
@media (max-width: 576px) {
  .s-equipment h5 {
    margin-top: 22px;
  }
}
.s-equipment .cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 100vw / 1600 * 12, 19.2px);
  margin-left: clamp(-2.4px, 100vw / 1600 * -1.5, -1.5px);
  margin-right: clamp(-2.4px, 100vw / 1600 * -1.5, -1.5px);
  margin-top: clamp(113px, 100vw / 1600 * 113, 180.8px);
  text-align: left;
}
@media (max-width: 576px) {
  .s-equipment .cards {
    margin-top: 67px;
  }
}
.s-equipment .card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: clamp(416px, 100vw / 1600 * 416, 665.6px);
  border-radius: clamp(10px, 100vw / 1600 * 10, 16px);
  overflow: hidden;
  background: rgba(255, 255, 255, 0.1);
  transition: transform 0.3s, background 0.3s;
}
@media (max-width: 576px) {
  .s-equipment .card {
    width: 100%;
  }
}
.s-equipment .card img {
  display: block;
  width: 100%;
  height: auto;
}
@media (max-width: 576px) {
  .s-equipment .card img {
    height: 223px;
    -o-object-fit: cover;
    object-fit: cover;
  }
}
.s-equipment .card:hover {
  transform: translateY(-6px);
  background: rgba(255, 255, 255, 0.15);
}
.s-equipment .badge {
  position: absolute;
  top: clamp(172px, 100vw / 1600 * 172, 275.2px);
  left: clamp(40px, 100vw / 1600 * 40, 64px);
}
@media (max-width: 576px) {
  .s-equipment .badge {
    left: 32px;
    padding: 5px 20px;
    font-size: 18px;
    letter-spacing: 5.4px;
  }
}
.s-equipment .inner-box {
  display: flex;
  flex-direction: column;
  gap: clamp(30px, 100vw / 1600 * 30, 48px);
  padding: clamp(37px, 100vw / 1600 * 37, 59.2px) clamp(40px, 100vw / 1600 * 40, 64px) clamp(40px, 100vw / 1600 * 40, 64px);
}
@media (max-width: 576px) {
  .s-equipment .inner-box {
    padding: 37px 30px 40px;
  }
}

.s-compare {
  margin: clamp(76.5px, 100vw / 1600 * 153, 244.8px) 0 clamp(50px, 100vw / 1600 * 100, 160px) 0;
  background: #fff;
  color: #000;
  text-align: center;
}
@media (max-width: 576px) {
  .s-compare {
    margin: 95px 0 60px;
  }
}
.s-compare .swiper {
  left: clamp(-14.4px, 100vw / 1600 * -9, -9px);
  width: clamp(785px, 100vw / 1600 * 785, 1256px);
  margin-top: clamp(81px, 100vw / 1600 * 81, 129.6px);
  text-align: left;
}
@media (max-width: 820px) {
  .s-compare .swiper {
    left: 0;
    width: calc(100% - 50px);
  }
}
@media (max-width: 576px) {
  .s-compare .swiper {
    width: calc(100% - 56px);
    margin-top: 50px;
  }
}
.s-compare .photo {
  display: block;
  width: clamp(364px, 100vw / 1600 * 364, 582.4px);
  height: auto;
}
@media (max-width: 820px) {
  .s-compare .photo {
    width: 100%;
  }
}
.s-compare .colors,
.s-compare .title-sm,
.s-compare .specs {
  margin-left: clamp(18px, 100vw / 1600 * 18, 28.8px);
}
@media (max-width: 820px) {
  .s-compare .colors,
  .s-compare .title-sm,
  .s-compare .specs {
    margin-left: 0;
  }
}
.s-compare .colors {
  position: relative;
  margin-top: clamp(-27.2px, 100vw / 1600 * -17, -17px);
  display: flex;
  gap: clamp(6.5px, 100vw / 1600 * 6.5, 10.4px);
}
@media (max-width: 576px) {
  .s-compare .colors {
    margin-top: 5px;
  }
}
.s-compare .colors span {
  width: clamp(33px, 100vw / 1600 * 33, 52.8px);
  height: clamp(33px, 100vw / 1600 * 33, 52.8px);
  border-radius: 50%;
  background: linear-gradient(var(--top) 50%, var(--bottom) 50%);
}
.s-compare .title-sm {
  min-height: clamp(70px, 100vw / 1600 * 70, 112px);
  margin-top: clamp(17px, 100vw / 1600 * 17, 27.2px);
}
@media (max-width: 576px) {
  .s-compare .title-sm {
    max-width: 134px;
    min-height: 60px;
    margin-top: 30px;
    font-size: 20px;
  }
}
.s-compare .specs {
  position: relative;
  display: grid;
  gap: clamp(35px, 100vw / 1600 * 35, 56px);
  margin-top: clamp(31px, 100vw / 1600 * 31, 49.6px);
  padding-top: clamp(20px, 100vw / 1600 * 20, 32px);
}
@media (max-width: 576px) {
  .s-compare .specs {
    gap: 40px;
    margin-top: 27px;
    padding-top: 32px;
  }
}
.s-compare .specs:before {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(-4.8px, 100vw / 1600 * -3, -3px);
  width: calc(100% + clamp(78px, 100vw / 1600 * 78, 124.8px));
  height: 1px;
  background: #D5D5D2;
}
@media (max-width: 820px) {
  .s-compare .specs:before {
    left: 0;
    width: calc(100% + 57px);
  }
}
@media (max-width: 576px) {
  .s-compare .specs:before {
    width: calc(100% + 16px);
  }
}
.s-compare .specs li {
  display: grid;
  grid-template-columns: clamp(49px, 100vw / 1600 * 49, 78.4px) 1fr;
  -moz-column-gap: clamp(20px, 100vw / 1600 * 20, 32px);
  column-gap: clamp(20px, 100vw / 1600 * 20, 32px);
  align-items: center;
}
@media (max-width: 576px) {
  .s-compare .specs li {
    grid-template-columns: 1fr;
    row-gap: 8px;
  }
}
.s-compare .specs .icon-wheel {
  width: clamp(42px, 100vw / 1600 * 42, 67.2px);
}
.s-compare .specs .icon-clearance,
.s-compare .specs .icon-display {
  width: clamp(49px, 100vw / 1600 * 49, 78.4px);
}
.s-compare .specs .icon-damper {
  width: clamp(37px, 100vw / 1600 * 37, 59.2px);
}
.s-compare .specs .icon-winch {
  width: clamp(38px, 100vw / 1600 * 38, 60.8px);
}
.s-compare .specs .icon-bumper {
  width: clamp(44px, 100vw / 1600 * 44, 70.4px);
}
.s-compare .specs img {
  height: auto;
  grid-row: span 2;
  justify-self: center;
}
@media (max-width: 576px) {
  .s-compare .specs img {
    grid-row: auto;
    justify-self: start;
  }
}
.s-compare .value {
  align-self: end;
  font-size: clamp(25px, 100vw / 1600 * 25, 40px);
  font-weight: 700;
  line-height: 1.3;
  color: #090A0C;
}
.s-compare .label {
  align-self: start;
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  line-height: 1.5;
  color: #26292D;
}
@media (max-width: 576px) {
  .s-compare .label {
    font-size: 18px;
    line-height: 1.3;
  }
}
.s-compare .controls {
  width: clamp(272px, 100vw / 1600 * 272, 435.2px);
  margin: clamp(60px, 100vw / 1600 * 60, 96px) auto 0;
}
@media (max-width: 576px) {
  .s-compare .controls {
    width: 158px;
  }
}
.s-compare .controls:has(.swiper-scrollbar-lock) {
  display: none;
}

.s-gallery {
  margin: clamp(101.5px, 100vw / 1600 * 203, 324.8px) 0 clamp(96px, 100vw / 1600 * 192, 307.2px) 0;
  background: #fff;
  overflow: hidden;
}
@media (max-width: 576px) {
  .s-gallery {
    margin: 120px 0 155px;
  }
}
.s-gallery .swiper-slide {
  width: clamp(1271px, 100vw / 1600 * 1271, 2033.6px);
  height: auto;
  aspect-ratio: 1271/745;
  border-radius: clamp(10px, 100vw / 1600 * 10, 16px);
  overflow: hidden;
}
@media (max-width: 1367px) {
  .s-gallery .swiper-slide {
    width: 85vw;
  }
}
@media (max-width: 576px) {
  .s-gallery .swiper-slide {
    width: 90vw;
  }
}
.s-gallery .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}
.s-gallery .controls {
  margin-top: clamp(70px, 100vw / 1600 * 70, 112px);
}
@media (max-width: 576px) {
  .s-gallery .controls {
    margin-top: 46px;
  }
}

.s-specs {
  padding: clamp(66px, 100vw / 1600 * 132, 211.2px) 0 clamp(88px, 100vw / 1600 * 176, 281.6px) 0;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #182023;
  color: #fff;
}
@media (max-width: 576px) {
  .s-specs {
    padding: 158px 0 142px;
  }
}
.s-specs .subtitle,
.s-specs h3 {
  text-align: center;
}
@media (max-width: 576px) {
  .s-specs h3 {
    font-size: 60px;
  }
}
.s-specs .m-spec {
  margin-top: clamp(194px, 100vw / 1600 * 194, 310.4px);
}
@media (max-width: 992px) {
  .s-specs .m-spec {
    margin-top: 120px;
  }
}
.s-specs h3 + .m-spec {
  margin-top: clamp(122px, 100vw / 1600 * 122, 195.2px);
}
@media (max-width: 576px) {
  .s-specs h3 + .m-spec {
    margin-top: 92px;
  }
}

.s-connect {
  margin: clamp(88.5px, 100vw / 1600 * 177, 283.2px) 0 clamp(113.5px, 100vw / 1600 * 227, 363.2px) 0;
  background: #fff;
  color: #000;
  text-align: center;
}
@media (max-width: 576px) {
  .s-connect {
    margin: 95px 0 140px;
  }
}
.s-connect .cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: clamp(12px, 100vw / 1600 * 12, 19.2px);
  margin-left: clamp(-2.4px, 100vw / 1600 * -1.5, -1.5px);
  margin-right: clamp(-2.4px, 100vw / 1600 * -1.5, -1.5px);
  margin-top: clamp(122px, 100vw / 1600 * 122, 195.2px);
  text-align: left;
}
@media (max-width: 576px) {
  .s-connect .cards {
    gap: 28px;
    margin-top: 67px;
  }
}
.s-connect .card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: clamp(309px, 100vw / 1600 * 309, 494.4px);
  min-height: clamp(348px, 100vw / 1600 * 348, 556.8px);
  padding: clamp(36px, 100vw / 1600 * 36, 57.6px);
  border-radius: clamp(10px, 100vw / 1600 * 10, 16px);
  background: #F32735;
  color: #fff;
  transition: transform 0.3s, box-shadow 0.3s;
}
@media (max-width: 576px) {
  .s-connect .card {
    width: 100%;
  }
}
.s-connect .card img {
  align-self: flex-start;
  height: auto;
}
.s-connect .card .icon-sos {
  width: clamp(67px, 100vw / 1600 * 67, 107.2px);
}
.s-connect .card .icon-theft {
  width: clamp(55px, 100vw / 1600 * 55, 88px);
}
.s-connect .card .icon-gps {
  width: clamp(56px, 100vw / 1600 * 56, 89.6px);
}
.s-connect .card .icon-data {
  width: clamp(50px, 100vw / 1600 * 50, 80px);
}
.s-connect .card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 40px rgba(243, 39, 53, 0.3);
}
.s-connect .inner-box {
  display: flex;
  flex-direction: column;
  gap: clamp(18px, 100vw / 1600 * 18, 28.8px);
}

.s-final {
  position: relative;
  isolation: isolate;
  aspect-ratio: 1600/1000;
  overflow: hidden;
}
@media (max-width: 576px) {
  .s-final {
    aspect-ratio: 394/722;
  }
}
.s-final .brand {
  position: absolute;
  top: 54.08%;
  left: 50.41%;
  width: 74.69%;
  height: auto;
  transform: translate(-50%, -50%);
}
@media (max-width: 576px) {
  .s-final .brand {
    display: none;
  }
}
.s-final .logo-mob {
  position: absolute;
  top: 47.23%;
  left: 7.63%;
  width: 84.86%;
  height: auto;
}
@media (max-width: 576px) {
  .s-final .logo-mob {
    display: block;
  }
}
@media (max-width: 576px) {
  .s-final .bg-pc {
    display: none;
  }
}
@media (max-width: 576px) {
  .s-final .bg-mob {
    display: block;
  }
}

.s-page-title {
  padding: clamp(110px, 100vw / 1600 * 220, 352px) 0 clamp(60px, 100vw / 1600 * 120, 192px) 0;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #182023;
  color: #fff;
  text-align: center;
}
@media (max-width: 576px) {
  .s-page-title {
    padding: 150px 0 70px;
  }
}
.s-page-title .glow {
  position: absolute;
  width: clamp(1396px, 100vw / 1600 * 1396, 2233.6px);
  height: auto;
  top: clamp(-832px, 100vw / 1600 * -520, -520px);
  left: 50%;
  max-width: none;
  margin-left: clamp(-1116.8px, 100vw / 1600 * -698, -698px);
  z-index: -1;
}

.s-content-page {
  margin: clamp(60px, 100vw / 1600 * 120, 192px) 0 clamp(80px, 100vw / 1600 * 160, 256px) 0;
  background: #fff;
  color: #26292D;
}
@media (max-width: 576px) {
  .s-content-page {
    margin: 60px 0 80px;
  }
}
.s-content-page h4, .s-content-page h6, .s-content-page p, .s-content-page ul, .s-content-page ol {
  max-width: clamp(920px, 100vw / 1600 * 920, 1472px);
}
.s-content-page h4 {
  margin: clamp(60px, 100vw / 1600 * 60, 96px) 0 clamp(25px, 100vw / 1600 * 25, 40px);
  color: #000;
}
@media (max-width: 576px) {
  .s-content-page h4 {
    margin: 40px 0 18px;
  }
}
.s-content-page h4:first-child {
  margin-top: 0;
}
.s-content-page h6 {
  margin: clamp(35px, 100vw / 1600 * 35, 56px) 0 clamp(12px, 100vw / 1600 * 12, 19.2px);
  color: #000;
}
.s-content-page p + p {
  margin-top: clamp(20px, 100vw / 1600 * 20, 32px);
}
.s-content-page ul, .s-content-page ol {
  margin: clamp(20px, 100vw / 1600 * 20, 32px) 0;
  padding-left: clamp(24px, 100vw / 1600 * 24, 38.4px);
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  line-height: 1.5;
}
.s-content-page ul li + li, .s-content-page ol li + li {
  margin-top: clamp(8px, 100vw / 1600 * 8, 12.8px);
}
.s-content-page ul li {
  list-style: disc;
}
.s-content-page ol li {
  list-style: decimal;
}
.s-content-page li::marker {
  color: #F32735;
}

.m-accordion .item:not(:first-child) {
  margin-top: clamp(30px, 100vw / 1600 * 30, 48px);
  padding-top: clamp(30px, 100vw / 1600 * 30, 48px);
  border-top: 1px solid #fff;
}
.m-accordion .head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(20px, 100vw / 1600 * 20, 32px);
  cursor: pointer;
}
.m-accordion .head h6 {
  transition: color 0.3s;
}
.m-accordion .head .toggle {
  display: flex;
  flex-shrink: 0;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}
.m-accordion .head img {
  flex-shrink: 0;
  width: clamp(17px, 100vw / 1600 * 17, 27.2px);
  height: auto;
  transition: transform 0.3s;
}
.m-accordion .head:hover h6 {
  color: #F32735;
}
.m-accordion .head:hover img {
  transform: rotate(90deg);
}
.m-accordion .icon-minus {
  display: none;
}
.m-accordion .content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.4s ease;
}
.m-accordion .inner-box {
  min-height: 0;
  overflow: hidden;
}
.m-accordion .inner-box p {
  padding-top: clamp(30px, 100vw / 1600 * 30, 48px);
}

.m-accordion .item.active .icon-plus {
  display: none;
}
.m-accordion .item.active .icon-minus {
  display: block;
}
.m-accordion .item.active .content {
  grid-template-rows: 1fr;
}

.m-spec {
  position: relative;
  display: grid;
  grid-template-columns: clamp(523px, 100vw / 1600 * 523, 836.8px) clamp(624px, 100vw / 1600 * 624, 998.4px);
  -moz-column-gap: clamp(172px, 100vw / 1600 * 172, 275.2px);
  column-gap: clamp(172px, 100vw / 1600 * 172, 275.2px);
  align-items: start;
}
@media (max-width: 1367px) {
  .m-spec {
    grid-template-columns: 1fr 1fr;
    -moz-column-gap: 60px;
    column-gap: 60px;
  }
}
@media (max-width: 992px) {
  .m-spec {
    grid-template-columns: 1fr;
    row-gap: 60px;
  }
}
.m-spec .glow {
  position: absolute;
  width: clamp(1396px, 100vw / 1600 * 1396, 2233.6px);
  height: auto;
  top: clamp(-638.4px, 100vw / 1600 * -399, -399px);
  left: clamp(297px, 100vw / 1600 * 297, 475.2px);
  max-width: none;
  z-index: -1;
  pointer-events: none;
}
@media (max-width: 1367px) {
  .m-spec .glow {
    left: calc(75% + 15px - 698px);
  }
}
@media (max-width: 992px) {
  .m-spec .glow {
    top: auto;
    bottom: -330px;
    left: calc(50% - 698px);
  }
}
@media (max-width: 576px) {
  .m-spec .glow {
    display: none;
  }
}
.m-spec .glow-mob {
  position: absolute;
  top: clamp(-683.2px, 100vw / 1600 * -427, -427px);
  left: 50%;
  max-width: none;
  margin-left: clamp(-907.2px, 100vw / 1600 * -567, -567px);
  z-index: -1;
  pointer-events: none;
}
@media (max-width: 576px) {
  .m-spec .glow-mob {
    display: block;
  }
}
.m-spec .switch {
  position: absolute;
  top: 50%;
  left: clamp(-35.2px, 100vw / 1600 * -22, -22px);
  right: clamp(-14.4px, 100vw / 1600 * -9, -9px);
  display: flex;
  justify-content: space-between;
  transform: translateY(-50%);
  pointer-events: none;
}
@media (max-width: 576px) {
  .m-spec .switch {
    left: -29px;
    right: -28px;
  }
}
.m-spec .switch button {
  display: flex;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  pointer-events: auto;
}
.m-spec .switch button img {
  transition: transform 0.3s;
}
.m-spec .switch .switch-prev:hover img {
  transform: translateX(-4px);
}
.m-spec .switch .switch-next:hover img {
  transform: translateX(4px);
}
@media (max-width: 576px) {
  .m-spec > .right-box {
    order: -1;
  }
}
.m-spec .list {
  margin-top: clamp(27px, 100vw / 1600 * 27, 43.2px);
}
.m-spec .list li {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: clamp(20px, 100vw / 1600 * 20, 32px);
  padding: clamp(19px, 100vw / 1600 * 19, 30.4px) 0;
  border-bottom: 1px solid #383838;
}
.m-spec .list .is-hidden {
  display: none;
}
.m-spec .label {
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  line-height: 1.5;
  color: #8E9296;
}
.m-spec .value {
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  font-weight: 700;
  line-height: 1.3;
  text-align: right;
}
.m-spec .more {
  display: flex;
  align-items: center;
  gap: clamp(6px, 100vw / 1600 * 6, 9.6px);
  padding: clamp(15px, 100vw / 1600 * 15, 24px) 0 0;
  border: none;
  background: none;
  color: #fff;
  font-family: inherit;
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  font-weight: 700;
  line-height: 1.3;
  cursor: pointer;
  transition: color 0.3s;
}
.m-spec .more img {
  width: clamp(15px, 100vw / 1600 * 15, 24px);
  height: auto;
  transition: transform 0.3s;
}
.m-spec .more:hover {
  color: #F32735;
}
.m-spec .wrapper-btn {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(12px, 100vw / 1600 * 12, 19.2px);
  margin-top: clamp(46px, 100vw / 1600 * 46, 73.6px);
}
@media (max-width: 576px) {
  .m-spec .wrapper-btn {
    gap: 11px;
  }
}
.m-spec .btn {
  border: 1px solid #626262;
}
.m-spec .btn img {
  width: clamp(16px, 100vw / 1600 * 16, 25.6px);
  height: auto;
}
.m-spec .btn-share img {
  width: clamp(24px, 100vw / 1600 * 24, 38.4px);
}
.m-spec .btn:hover {
  border-color: #F32735;
}
.m-spec .photo-box {
  position: relative;
  width: clamp(624px, 100vw / 1600 * 624, 998.4px);
  margin-top: clamp(18px, 100vw / 1600 * 18, 28.8px);
}
@media (max-width: 1367px) {
  .m-spec .photo-box {
    width: 100%;
  }
}
@media (max-width: 992px) {
  .m-spec .photo-box {
    max-width: 624px;
    margin: 0 auto;
  }
}
@media (max-width: 576px) {
  .m-spec .photo-box {
    width: 294px;
  }
}
.m-spec .photo {
  display: block;
  width: 100%;
  height: auto;
  transition: opacity 0.2s;
}
.m-spec .colors {
  display: flex;
  justify-content: center;
  gap: clamp(17px, 100vw / 1600 * 17, 27.2px);
  margin: clamp(48px, 100vw / 1600 * 48, 76.8px) clamp(43px, 100vw / 1600 * 43, 68.8px) 0 0;
}
@media (max-width: 1367px) {
  .m-spec .colors {
    margin-right: 0;
  }
}
@media (max-width: 576px) {
  .m-spec .colors {
    margin-top: 24px;
  }
}
.m-spec .colors button {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(15px, 100vw / 1600 * 15, 24px);
  padding: 0;
  border: none;
  background: none;
  color: #fff;
  font-family: inherit;
  font-size: clamp(16px, 100vw / 1600 * 16, 25.6px);
  line-height: 1.3;
  cursor: pointer;
}
.m-spec .colors span {
  width: clamp(33px, 100vw / 1600 * 33, 52.8px);
  height: clamp(33px, 100vw / 1600 * 33, 52.8px);
  border-radius: 50%;
  background: linear-gradient(var(--top) 50%, var(--bottom) 50%);
  box-shadow: 0 0 0 0.5px #fff;
  transition: box-shadow 0.3s, transform 0.3s;
}
.m-spec .colors button:hover span {
  transform: scale(1.1);
}

.m-spec.is-open .list .is-hidden {
  display: flex;
}
.m-spec.is-open .more img {
  transform: rotate(180deg);
}

.m-spec .colors .active span {
  box-shadow: 0 0 0 3px #fff;
}

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

.overflow_body {
  overflow: hidden;
  padding-right: var(--scrollbar, 0px);
}

.bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  z-index: -1;
}

.btn-up {
  position: fixed;
  right: calc(clamp(69px, 100vw / 1600 * 69, 110.4px) + var(--scrollbar, 0px));
  bottom: clamp(59px, 100vw / 1600 * 59, 94.4px);
  width: clamp(41px, 100vw / 1600 * 41, 65.6px);
  height: clamp(41px, 100vw / 1600 * 41, 65.6px);
  opacity: 0;
  pointer-events: none;
  transition: 0.3s;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  z-index: 999;
}
@media (max-width: 576px) {
  .btn-up {
    right: calc(20px + var(--scrollbar, 0px));
    bottom: 20px;
  }
}
.btn-up.show {
  opacity: 1;
  pointer-events: visible;
}
.btn-up img {
  flex-shrink: 0;
  width: clamp(49px, 100vw / 1600 * 49, 78.4px);
  height: auto;
  max-width: none;
  margin: 0 clamp(-6.4px, 100vw / 1600 * -4, -4px) clamp(-12.8px, 100vw / 1600 * -8, -8px);
}
.btn-up:hover {
  transform: translateY(-4px);
}

.controls {
  position: relative;
  display: flex;
  gap: clamp(22px, 100vw / 1600 * 22, 35.2px);
  min-height: clamp(11px, 100vw / 1600 * 11, 17.6px);
  margin-left: clamp(-3.2px, 100vw / 1600 * -2, -2px);
}
@media (max-width: 576px) {
  .controls {
    gap: 15px;
    margin-left: 0;
  }
}
.controls button {
  display: flex;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  transition: opacity 0.3s;
}
.controls button img {
  width: clamp(18px, 100vw / 1600 * 18, 28.8px);
  height: auto;
  transition: transform 0.3s;
}
@media (max-width: 576px) {
  .controls button img {
    width: 15px;
    height: auto;
  }
}
@media (max-width: 576px) {
  .controls .slider-prev {
    margin-left: 6px;
  }
}
.controls .slider-prev:hover img {
  transform: translateX(-4px);
}
.controls .slider-next:hover img {
  transform: translateX(4px);
}
.controls .swiper-button-disabled {
  opacity: 0.3;
  cursor: default;
}

.controls .swiper-scrollbar.swiper-scrollbar-horizontal,
.controls .progress {
  width: clamp(272px, 100vw / 1600 * 272, 435.2px);
  height: clamp(11px, 100vw / 1600 * 11, 17.6px);
  border-radius: clamp(6px, 100vw / 1600 * 6, 9.6px);
  background: #EEEEEE;
  overflow: hidden;
  position: absolute;
  top: clamp(4px, 100vw / 1600 * 4, 6.4px);
  left: 50%;
  bottom: auto;
  margin: 0 0 0 clamp(-217.6px, 100vw / 1600 * -136, -136px);
}
@media (max-width: 576px) {
  .controls .swiper-scrollbar.swiper-scrollbar-horizontal,
  .controls .progress {
    top: 6px;
    width: 158px;
    margin-left: -79px;
  }
}

.controls .swiper-scrollbar-drag {
  border-radius: clamp(6px, 100vw / 1600 * 6, 9.6px);
  background: #474747;
  cursor: grab;
}

.controls .progress span {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: clamp(6px, 100vw / 1600 * 6, 9.6px);
  background: #474747;
  transform: scaleX(0);
  transform-origin: left top;
  transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1);
}

footer {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(103px, 100vw / 1600 * 103, 164.8px) 0 clamp(59px, 100vw / 1600 * 59, 94.4px);
  background: #182023;
}
@media (max-width: 576px) {
  footer {
    padding: 80px 0 36px;
  }
}
footer {
  color: #fff;
  text-align: center;
}
footer .glow {
  position: absolute;
  width: clamp(1760px, 100vw / 1600 * 1760, 2816px);
  height: auto;
  top: clamp(-1419.2px, 100vw / 1600 * -887, -887px);
  left: 50%;
  max-width: none;
  margin-left: clamp(-1408px, 100vw / 1600 * -880, -880px);
  z-index: -1;
  pointer-events: none;
}
@media (max-width: 576px) {
  footer .glow {
    display: none;
  }
}
footer .glow-mob {
  position: absolute;
  top: clamp(-840px, 100vw / 1600 * -525, -525px);
  left: 50%;
  max-width: none;
  margin-left: clamp(-990.4px, 100vw / 1600 * -619, -619px);
  z-index: -1;
  pointer-events: none;
}
@media (max-width: 576px) {
  footer .glow-mob {
    display: block;
  }
}
footer .brand-small {
  font-size: clamp(20px, 100vw / 1600 * 20, 32px);
  font-weight: 800;
  line-height: 1.4;
}
footer .brand-name {
  margin-top: clamp(-33.6px, 100vw / 1600 * -21, -21px);
  font-size: clamp(80px, 100vw / 1600 * 80, 128px);
  font-weight: 800;
  line-height: 1.4;
}
footer .contacts {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: clamp(44px, 100vw / 1600 * 44, 70.4px);
}
footer .contacts a {
  font-size: clamp(30px, 100vw / 1600 * 30, 48px);
  font-weight: 300;
  line-height: 1.4;
  transition: color 0.3s;
}
footer .contacts a:hover {
  color: #F32735;
}
footer address {
  margin-top: clamp(64px, 100vw / 1600 * 64, 102.4px);
  font-size: clamp(18px, 100vw / 1600 * 18, 28.8px);
  font-style: normal;
  line-height: 1.4;
}
footer address strong {
  font-weight: 800;
}
@media (max-width: 576px) {
  footer address strong {
    display: block;
  }
}
@media (max-width: 576px) {
  footer address .sep {
    display: none;
  }
}
footer .hours {
  display: inline-grid;
  grid-template-columns: auto auto;
  -moz-column-gap: clamp(8px, 100vw / 1600 * 8, 12.8px);
  column-gap: clamp(8px, 100vw / 1600 * 8, 12.8px);
  margin-top: clamp(18px, 100vw / 1600 * 18, 28.8px);
  font-size: clamp(18px, 100vw / 1600 * 18, 28.8px);
  line-height: 1.4;
  text-align: left;
}
footer .hours strong {
  font-weight: 800;
}
footer .site {
  display: table;
  margin: clamp(75px, 100vw / 1600 * 75, 120px) auto 0;
}
@media (max-width: 576px) {
  footer .site {
    margin-top: 49px;
  }
}
footer .site {
  color: #F32735;
  font-size: clamp(30px, 100vw / 1600 * 30, 48px);
  font-weight: 800;
  line-height: 1.2;
  transition: opacity 0.3s;
}
footer .site:hover {
  opacity: 0.75;
}
footer .bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(30px, 100vw / 1600 * 30, 48px);
  margin-top: clamp(87px, 100vw / 1600 * 87, 139.2px);
  padding-top: clamp(43px, 100vw / 1600 * 43, 68.8px);
  border-top: 1px solid #565656;
  text-align: left;
}
@media (max-width: 992px) {
  footer .bottom {
    flex-direction: column;
    text-align: center;
  }
}
@media (max-width: 576px) {
  footer .bottom {
    gap: 29px;
    margin-top: 64px;
    padding-top: 29px;
  }
}
footer .legal {
  display: flex;
  gap: clamp(23px, 100vw / 1600 * 23, 36.8px);
}
@media (max-width: 576px) {
  footer .legal {
    gap: 26px;
  }
}
footer .legal {
  font-size: clamp(18px, 100vw / 1600 * 18, 28.8px);
  line-height: 1.4;
}
footer .legal a {
  transition: color 0.3s;
}
footer .legal a:hover {
  color: #F32735;
}
footer .note {
  font-size: clamp(16px, 100vw / 1600 * 16, 25.6px);
  line-height: 1.4;
  text-align: right;
}
@media (max-width: 992px) {
  footer .note {
    text-align: center;
  }
}
/*# sourceMappingURL=main.min.css.map */
