/* Malta 360 — CTA band. Figma 228:4239: 1440×339, py 48; content 672 wide, gap 24. */

.m360-cta-band {
  display: flex;
  align-items: center;
  min-height: 339px;
  padding-block: 48px;
  background: var(--m360-bg);
  color: var(--m360-white);
}

/* Photo: 864 wide, 800 tall from the top (cut by the band), 70%; image box h 108% at −32.24%. */
.m360-cta-band__media {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 0;
  width: calc(864 * var(--u));
  height: 800px;
  overflow: hidden;
}

.m360-cta-band__img {
  position: absolute;
  left: 0;
  top: -32.24%;
  width: 100%;
  max-width: none;
  height: 108%;
  object-fit: cover;
  opacity: .7;
}

/* #050505 → 60% at the middle → transparent, left to right. */
.m360-cta-band__media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #050505, rgba(5, 5, 5, .6) 50%, rgba(5, 5, 5, 0));
}

/* Rectangle 8: 319.426×331.496 @49.51°, bbox 459.517×458.175 at (1267, −228.78). */
.m360-cta-band__rect {
  right: calc(-216.48 * var(--u));
  top: calc(-165.44 * var(--u));
  width: calc(319.426 * var(--u));
  height: calc(331.496 * var(--u));
}

/* Polygon 1 in a 656.179 box @−43.48°, bbox 927.65 at (783, −19.78). */
.m360-cta-band__triangle {
  right: calc(-134.92 * var(--u));
  top: calc(115.96 * var(--u));
  width: calc(656.179 * var(--u));
  height: calc(656.179 * var(--u));
}

.m360-cta-band__inner {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

.m360-cta-band__heading { max-width: none; white-space: nowrap; }

.m360-cta-band__sub {
  font-size: clamp(18px, 1.67vw, 24px);
  line-height: 1.625;
  letter-spacing: .1406px;
  color: var(--m360-text-2);
}

.m360-cta-band__actions { display: flex; flex-wrap: wrap; gap: 16px; }

@media (max-width: 1024px) {
  .m360-cta-band { padding-block: 72px; }
  .m360-cta-band__media { width: 100%; }
  .m360-cta-band__heading { white-space: normal; }
}

@media (max-width: 640px) {
  .m360-cta-band__actions { flex-direction: column; align-items: stretch; }
}

/* Figma mobile 228:4583: py 48, px 24; 50/54 heading; 24/39 sub; full-width button.
   Photo stays 864 wide on the right; its own shapes sit closer in. */
@media (max-width: 640px) {
  .m360-cta-band { padding-block: 48px; }
  .m360-cta-band__media { width: 864px; }
  .m360-cta-band__media::after {
    background: linear-gradient(90deg, #050505 46.635%, rgba(5, 5, 5, .6) 69.712%, rgba(5, 5, 5, .24) 91.827%);
  }
  .m360-cta-band__heading { font-family: var(--m360-font-display); font-size: 50px; line-height: 54px; letter-spacing: -3px; }
  .m360-cta-band__sub { font-size: 24px; line-height: 39px; }
  .m360-cta-band__actions { align-self: stretch; }
  .m360-cta-band__rect     { right: -182.48px; top: -268.66px; width: 319.426px; height: 331.496px; }
  .m360-cta-band__triangle { right: -493.9px; top: -38.26px; width: 656.179px; height: 656.179px; }
}