.ll {
  width: 100%;
  background: var(--color-white);
}

.ll img { max-width: none; }

.ll-frame {
  width: 1440px;
  max-width: 100%;
  margin: 0 auto;
  position: relative;
  height: 100%;
}

.ll .logo {
  width: 167px;
  height: 40px;
  object-fit: contain;
}

.ll-hero {
  position: relative;
  width: 100%;
  height: 662px;
  overflow: hidden;
  color: var(--color-white);
}

.ll-hero .banner {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ll-hero .overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(11, 11, 11, 0.88) 0%, rgba(11, 11, 11, 0.55) 38%, rgba(11, 11, 11, 0) 72%);
}

.ll-hero .eyebrow {
  position: absolute;
  left: 60px;
  top: 27px;
  margin: 0;
  font-size: var(--fs-24);
  font-weight: var(--fw-medium);
  text-transform: uppercase;
}

.ll-hero h1 {
  position: absolute;
  left: 54px;
  top: 89px;
  width: 385px;
  margin: 0;
  font-size: var(--fs-50);
  font-weight: var(--fw-bold);
  line-height: var(--lh-tight);
}

.ll-hero .hero-copy {
  position: absolute;
  left: 54px;
  top: 281px;
  width: 518px;
  margin: 0;
  font-size: var(--fs-21);
  font-weight: var(--fw-regular);
}

.ll-hero .btn-quote {
  position: absolute;
  left: 54px;
  top: 445px;
  width: 209px;
  height: 55px;
}

.ll-hero .btn-brochure {
  position: absolute;
  left: 299px;
  top: 443px;
  width: 209px;
  height: 55px;
  gap: 10px;
}

.ll-hero .btn-brochure img {
  width: 17px;
  height: 16px;
}

.ll-how {
  position: relative;
  height: calc(465px + var(--section-pad) * 2);
  overflow: hidden;
  background: var(--color-surface-soft);
}

.ll-how .ll-frame {
  height: 465px;
  margin-top: var(--section-pad);
}

.ll-how .kicker {
  position: absolute;
  left: 60px;
  top: 29px;
  margin: 0;
  font-size: var(--fs-21);
  font-weight: var(--fw-medium);
}

.ll-how .title {
  position: absolute;
  left: 60px;
  top: 74px;
  margin: 0;
  font-size: var(--fs-45);
  font-weight: var(--fw-bold);
  line-height: var(--lh-title);
}

.ll-how .body-text {
  position: absolute;
  left: 701px;
  top: 78px;
  width: 565px;
  margin: 0;
  font-size: var(--fs-20);
  font-weight: var(--fw-medium);
}

.step { position: absolute; top: 211px; width: 221px; }

.s1 { left: 60px; }
.s2 { left: 428px; width: 220px; }
.s3 { left: 794px; width: 220px; }
.s4 { left: 1159px; }

.shot {
  position: relative;
  height: 148px;
  overflow: hidden;
  border-radius: var(--radius-sm);
  border: 1px solid var(--color-black);
}

.shot img {
  width: 100%;
  height: 148px;
  max-width: 100%;
  object-fit: cover;
  object-position: center;
}

.shot span {
  position: absolute;
  top: 4px;
  left: 3px;
  width: 26px;
  height: 25px;
  background: var(--color-white);
  border-radius: var(--radius-circle);
  font-size: 8px;
  font-weight: var(--fw-medium);
  display: flex;
  align-items: center;
  justify-content: center;
}

.step h3 {
  margin: 9px 0 0;
  font-size: var(--fs-17);
  font-weight: var(--fw-bold);
}

.step p {
  margin-top: 4px;
  font-size: var(--fs-14);
  font-weight: var(--fw-medium);
}

.arr {
  position: absolute;
  top: 290px;
  width: 35px;
}

.a1 { left: 332px; }
.a2 { left: 704px; width: 34px; }
.a3 { left: 1069px; }

.ll-retail {
  position: relative;
  width: 100%;
  max-width: 1440px;
  margin-inline: auto;
  height: calc(450px + var(--section-pad) * 2);
  overflow: hidden;
}

.ll-retail .ll-frame {
  height: 450px;
  margin-top: var(--section-pad);
}

.retail-shot {
  position: absolute;
  left: var(--space-page);
  top: 0;
  width: calc(708px - var(--space-page));
  height: 100%;
  object-fit: cover;
  object-position: right center;
}

.ll-retail .kicker {
  position: absolute;
  left: 753px;
  top: 10px;
  margin: 0;
  font-size: var(--fs-21);
  font-weight: var(--fw-medium);
}

.ll-retail .title {
  position: absolute;
  left: 753px;
  top: 56px;
  margin: 0;
  font-size: var(--fs-40);
  font-weight: var(--fw-bold);
  line-height: var(--lh-title);
}

.rf {
  position: absolute;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.r1 { left: 753px; top: 197px; }
.r2 { left: 1096px; top: 197px; }
.r3 { left: 753px; top: 320px; }
.r4 { left: 1096px; top: 318px; }

.rf h3 {
  font-size: var(--fs-17);
  font-weight: var(--fw-bold);
}

.rf p {
  margin-top: 8px;
  width: 232px;
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
}

.ll-ico {
  width: 29px;
  height: 29px;
  overflow: hidden;
  position: relative;
  flex-shrink: 0;
}

.ll-ico img {
  position: absolute;
  max-width: none;
}

.ll-1 img { height: 285%; width: 845%; left: -53%; top: -70%; }
.ll-2 img { height: 268%; width: 796%; left: -254%; top: -63%; }
.ll-3 img { height: 268%; width: 608%; left: -329%; top: -65%; }
.ll-4 img { height: 268%; width: 770%; left: -620%; top: -61%; }

.ll-apps {
  position: relative;
  height: calc(589px + var(--section-pad) * 2);
  overflow: hidden;
  background: var(--color-white);
}

.ll-apps .ll-frame {
  height: 589px;
  margin-top: var(--section-pad);
}

.ll-apps .kicker {
  position: absolute;
  left: 61px;
  top: 36px;
  margin: 0;
  font-size: var(--fs-21);
  font-weight: var(--fw-medium);
}

.ll-apps .title {
  position: absolute;
  left: 61px;
  top: 72px;
  width: 446px;
  margin: 0;
  font-size: var(--fs-40);
  font-weight: var(--fw-bold);
  line-height: var(--lh-title);
}

.ll-apps .body-text {
  position: absolute;
  left: 543px;
  top: 68px;
  width: 581px;
  margin: 0;
  font-size: var(--fs-20);
  font-weight: var(--fw-medium);
}

.ll-apps .explore-link {
  position: absolute;
  left: 1185px;
  top: 73px;
}

.app { position: absolute; top: 211px; width: 237px; }

.ap1 { left: 60px; }
.ap2 { left: 330px; width: 238px; }
.ap3 { left: 602px; }
.ap4 { left: 871px; width: 238px; }
.ap5 { left: 1143px; }

.app img {
  width: 100%;
  height: 236px;
  object-fit: cover;
  border-radius: var(--radius-tile);
}

.app h3 {
  margin-top: 12px;
  font-size: var(--fs-17);
  font-weight: var(--fw-bold);
}

.app p {
  margin-top: 4px;
  font-size: var(--fs-16);
  font-weight: var(--fw-medium);
}

.ll-xtravu {
  position: relative;
  width: 100%;
  height: calc(444px + var(--section-pad) * 2);
  overflow: hidden;
  background: var(--color-navy);
  color: var(--color-white);
}

.ll-xtravu .ll-frame {
  height: 444px;
  margin-top: var(--section-pad);
}

.ll-xtravu .kicker {
  position: absolute;
  left: 60px;
  top: 43px;
  margin: 0;
  font-size: var(--fs-21);
  font-weight: var(--fw-medium);
}

.ll-xtravu .title {
  position: absolute;
  left: 60px;
  top: 82px;
  width: 534px;
  margin: 0;
  font-size: var(--fs-40);
  font-weight: var(--fw-bold);
  line-height: var(--lh-title);
}

.ll-xtravu .body-text {
  position: absolute;
  left: 60px;
  top: 193px;
  width: 548px;
  margin: 0;
  font-size: var(--fs-20);
  font-weight: var(--fw-medium);
}

.btn-ghost {
  position: absolute;
  left: 60px;
  top: 338px;
  width: 209px;
  height: 55px;
  background: var(--color-white);
  color: var(--color-primary);
}

.plat-shot {
  position: absolute;
  left: 584px;
  top: 46px;
  width: 554px;
  height: 369px;
  object-fit: cover;
}

.side {
  position: absolute;
  left: 1159px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: var(--fs-20);
  font-weight: var(--fw-medium);
}

.sd1 { top: 147px; }
.sd2 { top: 202px; }
.sd3 { top: 256px; }
.sd4 { top: 312px; }

.side-ico {
  width: 29px;
  height: 24px;
  object-fit: contain;
  flex-shrink: 0;
}

.ll-case {
  padding: var(--section-pad) 0;
  background: var(--color-surface-soft);
}

.ll-case .ll-frame {
  height: auto;
  padding: 0 var(--space-page);
}

.case-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 48px;
}

.case-shot {
  width: 100%;
  aspect-ratio: 564 / 360;
  object-fit: cover;
  border-radius: var(--radius-image);
}

.case-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}

.ll-case .kicker {
  margin: 0;
  font-size: var(--fs-21);
  font-weight: var(--fw-medium);
}

.ll-case .title {
  margin: 0;
  font-size: var(--fs-40);
  font-weight: var(--fw-bold);
  line-height: var(--lh-title);
}

.ll-case .body-text {
  margin: 0;
  font-size: var(--fs-20);
  font-weight: var(--fw-medium);
}

.case-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 40px;
  list-style: none;
}

.case-stats strong {
  display: block;
  font-size: var(--fs-24);
  font-weight: var(--fw-bold);
  color: var(--color-primary);
}

.case-stats span {
  font-size: var(--fs-15);
  font-weight: var(--fw-medium);
}

.ll-cta {
  position: relative;
  width: 100%;
  height: calc(208px + var(--section-pad));
  overflow: hidden;
  background: var(--color-cta-bg);
}

.ll-cta .ll-frame {
  height: 208px;
  margin-top: calc(var(--section-pad) / 2);
}

.ll-cta .kicker {
  position: absolute;
  left: 64px;
  top: 25px;
  margin: 0;
  font-size: var(--fs-21);
  font-weight: var(--fw-medium);
}

.ll-cta .title {
  position: absolute;
  left: 64px;
  top: 64px;
  margin: 0;
  font-size: var(--fs-40);
  font-weight: var(--fw-bold);
  line-height: var(--lh-title);
}

.ll-cta .body-text {
  position: absolute;
  left: 64px;
  top: 125px;
  width: 729px;
  margin: 0;
  font-size: var(--fs-20);
  font-weight: var(--fw-medium);
}

.ll-cta .btn-quote {
  position: absolute;
  left: 926px;
  top: 68px;
  width: 209px;
  height: 55px;
}

.ll-cta .btn-expert {
  position: absolute;
  left: 1174px;
  top: 68px;
  width: 209px;
  height: 55px;
}
