:root {
  --cn-black: #050505;
  --cn-white: #ffffff;
  --cn-soft: rgba(255,255,255,.72);
  --cn-soft-2: rgba(255,255,255,.12);
}

html, body {
  min-height: 100%;
}

body.cn-minimal-body {
  margin: 0;
  color: var(--cn-white);
  background: #000;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.cn-minimal-hero {
  position: relative;
  min-height: 100vh;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  background: linear-gradient(180deg, #010101 0%, #090909 100%);
}

.cn-bg-scene {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 0;
}

.cn-bg-noise {
  position: absolute;
  inset: 0;
  opacity: .16;
  background-image:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.06), transparent 22%),
    radial-gradient(circle at 80% 30%, rgba(255,255,255,.05), transparent 18%),
    radial-gradient(circle at 60% 80%, rgba(255,255,255,.04), transparent 18%);
}

.cn-bg-vignette {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at center, rgba(255,255,255,.03), rgba(255,255,255,0) 28%),
    linear-gradient(180deg, rgba(0,0,0,.34), rgba(0,0,0,.62));
}

.cn-road {
  position: absolute;
  left: -10%;
  width: 120%;
  height: 92px;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 1px solid rgba(255,255,255,.05);
  background: linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01));
  filter: blur(.2px);
}

.cn-road::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 2px;
  transform: translateY(-50%);
  background: repeating-linear-gradient(90deg, rgba(255,255,255,.4) 0 70px, transparent 70px 140px);
  opacity: .35;
}

.cn-road-top { top: 16.5%; }
.cn-road-bottom { bottom: 16.5%; }

.cn-car-pass {
  position: absolute;
  width: clamp(250px, 24vw, 430px);
  height: 102px;
  opacity: .52;
  filter: blur(.1px);
}

.cn-car-pass-small {
  width: clamp(190px, 18vw, 300px);
  height: 74px;
  opacity: .34;
}

.cn-car-pass-faint {
  opacity: .22;
}

.cn-car-pass-one { top: calc(16.5% - 8px); animation: cnDriveRight 11s linear infinite; }
.cn-car-pass-two { bottom: calc(16.5% - 8px); animation: cnDriveLeft 13s linear infinite; animation-delay: -4s; }
.cn-car-pass-three { top: calc(16.5% + 4px); animation: cnDriveRight 8.4s linear infinite; animation-delay: -2.6s; }
.cn-car-pass-four { bottom: calc(16.5% + 6px); animation: cnDriveLeft 9.5s linear infinite; animation-delay: -1.7s; }
.cn-car-pass-five { top: calc(16.5% - 12px); animation: cnDriveRight 15.5s linear infinite; animation-delay: -8.2s; }
.cn-car-pass-six { bottom: calc(16.5% - 10px); animation: cnDriveLeft 16.2s linear infinite; animation-delay: -6.1s; }

.cn-car-body,
.cn-coupe-glass,
.cn-coupe-cut,
.cn-coupe-grille,
.cn-wheel,
.cn-headlight,
.cn-beam {
  position: absolute;
}

.cn-car-body {
  inset: 22px 0 14px;
  border: 1.6px solid rgba(255,255,255,.46);
  border-top-color: transparent;
  border-radius: 64px 108px 26px 22px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}

.cn-car-body::before {
  content: "";
  position: absolute;
  left: 17%;
  right: 17%;
  top: -28px;
  height: 44px;
  border: 1.6px solid rgba(255,255,255,.42);
  border-bottom: 0;
  border-radius: 120px 128px 0 0;
  clip-path: polygon(0 100%, 5% 40%, 22% 0, 72% 0, 100% 72%, 100% 100%);
}

.cn-coupe-glass {
  left: 31%;
  right: 25%;
  top: 10px;
  height: 30px;
  border-top: 1.4px solid rgba(255,255,255,.26);
  border-right: 1.4px solid rgba(255,255,255,.22);
  border-radius: 80px 80px 0 0;
  opacity: .8;
}

.cn-coupe-cut {
  right: 31%;
  top: 24px;
  width: 1.4px;
  height: 26px;
  background: rgba(255,255,255,.22);
  transform: rotate(9deg);
  transform-origin: top center;
}

.cn-coupe-grille {
  right: 8px;
  top: 43px;
  width: 28px;
  height: 11px;
  border-radius: 999px 12px 12px 999px;
  border: 1.4px solid rgba(255,255,255,.18);
  border-left: 0;
}

.cn-wheel {
  bottom: 0;
  width: 38px;
  height: 38px;
  border: 1.5px solid rgba(255,255,255,.58);
  border-radius: 50%;
}

.cn-wheel::before {
  content: "";
  position: absolute;
  inset: 7px;
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 50%;
}

.cn-wheel-left { left: 44px; }
.cn-wheel-right { right: 44px; }

.cn-headlight,
.cn-beam {
  top: 49px;
  right: 10px;
}

.cn-headlight {
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: rgba(255,255,255,.94);
  box-shadow: 0 0 18px rgba(255,255,255,.82);
}

.cn-headlight-left { right: 24px; }
.cn-headlight-right { right: 8px; }

.cn-beam {
  width: 160px;
  height: 32px;
  border-radius: 999px;
  background: radial-gradient(ellipse at center, rgba(255,255,255,.46), rgba(255,255,255,0) 72%);
  filter: blur(11px);
  transform: translateX(16px);
  opacity: .7;
}

.cn-beam-left { top: 43px; }
.cn-beam-right { top: 55px; }

.cn-car-pass-two .cn-headlight,
.cn-car-pass-two .cn-beam,
.cn-car-pass-four .cn-headlight,
.cn-car-pass-four .cn-beam,
.cn-car-pass-six .cn-headlight,
.cn-car-pass-six .cn-beam {
  right: auto;
  left: 10px;
}

.cn-car-pass-two .cn-headlight-left,
.cn-car-pass-four .cn-headlight-left,
.cn-car-pass-six .cn-headlight-left { left: 24px; }

.cn-car-pass-two .cn-headlight-right,
.cn-car-pass-four .cn-headlight-right,
.cn-car-pass-six .cn-headlight-right { left: 8px; }

.cn-car-pass-two .cn-beam,
.cn-car-pass-four .cn-beam,
.cn-car-pass-six .cn-beam { transform: translateX(-16px); }

.cn-car-pass-small .cn-car-body { inset: 17px 0 10px; }
.cn-car-pass-small .cn-car-body::before { top: -20px; height: 32px; }
.cn-car-pass-small .cn-coupe-glass { top: 8px; height: 22px; }
.cn-car-pass-small .cn-coupe-cut { top: 18px; height: 20px; }
.cn-car-pass-small .cn-wheel { width: 28px; height: 28px; }
.cn-car-pass-small .cn-wheel::before { inset: 5px; }
.cn-car-pass-small .cn-wheel-left { left: 32px; }
.cn-car-pass-small .cn-wheel-right { right: 32px; }
.cn-car-pass-small .cn-headlight,
.cn-car-pass-small .cn-beam { top: 35px; }
.cn-car-pass-small .cn-headlight { width: 8px; height: 8px; }
.cn-car-pass-small .cn-beam { width: 108px; height: 22px; }
.cn-car-pass-small .cn-beam-left { top: 30px; }
.cn-car-pass-small .cn-beam-right { top: 40px; }
.cn-car-pass-small .cn-coupe-grille { top: 31px; width: 20px; height: 8px; }

.cn-light-streak {
  position: absolute;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.55), rgba(255,255,255,0));
  filter: blur(5px);
  opacity: .44;
}

.cn-light-streak-one { top: 29%; left: -25%; width: 32%; animation: cnStreakRight 7s linear infinite; }
.cn-light-streak-two { bottom: 24%; right: -25%; width: 28%; animation: cnStreakLeft 9s linear infinite; }
.cn-light-streak-three { top: 66%; left: -18%; width: 22%; animation: cnStreakRight 6s linear infinite; animation-delay: -2.5s; }
.cn-light-streak-four { top: 48%; right: -18%; width: 18%; animation: cnStreakLeft 8.5s linear infinite; animation-delay: -3.2s; opacity: .22; }

.cn-center-card {
  position: relative;
  z-index: 2;
  width: min(980px, calc(100% - 32px));
  padding: 36px 22px;
  text-align: center;
}

.cn-center-logo {
  display: block;
  width: min(760px, 92vw);
  margin: 0 auto;
  height: auto;
  filter: drop-shadow(0 10px 28px rgba(0,0,0,.35));
}

.cn-center-description {
  max-width: 760px;
  margin: 24px auto 0;
  color: rgba(255,255,255,.78);
  font-size: clamp(16px, 2vw, 22px);
  line-height: 1.65;
}

.cn-center-whatsapp {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 28px;
  min-height: 56px;
  padding: 0 28px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .02em;
  backdrop-filter: blur(10px);
  transition: transform .18s ease, background .18s ease, border-color .18s ease;
}

.cn-center-whatsapp:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.34);
}

@keyframes cnDriveRight {
  0% { transform: translateX(-160%); opacity: 0; }
  8% { opacity: .34; }
  40% { opacity: .58; }
  92% { opacity: .34; }
  100% { transform: translateX(170vw); opacity: 0; }
}

@keyframes cnDriveLeft {
  0% { transform: translateX(170vw) scaleX(-1); opacity: 0; }
  8% { opacity: .3; }
  42% { opacity: .54; }
  92% { opacity: .3; }
  100% { transform: translateX(-170%) scaleX(-1); opacity: 0; }
}

@keyframes cnStreakRight {
  0% { transform: translateX(0); opacity: 0; }
  12% { opacity: .3; }
  100% { transform: translateX(150vw); opacity: 0; }
}

@keyframes cnStreakLeft {
  0% { transform: translateX(0); opacity: 0; }
  12% { opacity: .3; }
  100% { transform: translateX(-150vw); opacity: 0; }
}

@media (max-width: 767px) {
  .cn-road-top { top: 13%; }
  .cn-road-bottom { bottom: 13%; }
  .cn-road { height: 66px; }
  .cn-road::before { background: repeating-linear-gradient(90deg, rgba(255,255,255,.36) 0 34px, transparent 34px 72px); }
  .cn-car-pass { width: 220px; height: 68px; opacity: .34; }
  .cn-car-pass-small { width: 165px; height: 54px; opacity: .24; }
  .cn-car-pass-faint { display: none; }
  .cn-car-body { inset: 16px 0 10px; }
  .cn-car-body::before { top: -16px; height: 25px; }
  .cn-coupe-glass { top: 7px; height: 17px; }
  .cn-coupe-cut { top: 15px; height: 15px; }
  .cn-wheel { width: 24px; height: 24px; }
  .cn-wheel::before { inset: 4px; }
  .cn-wheel-left { left: 30px; }
  .cn-wheel-right { right: 30px; }
  .cn-headlight, .cn-beam { top: 31px; }
  .cn-headlight { width: 8px; height: 8px; }
  .cn-beam { width: 90px; height: 18px; }
  .cn-beam-left { top: 27px; }
  .cn-beam-right { top: 35px; }
  .cn-coupe-grille { top: 28px; width: 16px; height: 7px; }
  .cn-center-card { width: min(100% - 20px, 980px); padding: 28px 10px; }
  .cn-center-logo { width: min(94vw, 540px); }
  .cn-center-description { margin-top: 18px; font-size: 15px; }
  .cn-center-whatsapp { width: min(92vw, 360px); margin-top: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
