/* Final responsive canvas for the homepage hero. */
:root {
  --hero-canvas: #faf5f4;
}

body.home-page,
.home-page .page-shell,
.home-page .hero-section,
.home-page .hero-section > .container,
.home-page .hero-surface {
  background-color: var(--hero-canvas) !important;
}

.home-page .hero-section {
  width: 100%;
  max-width: none;
  margin: 0;
}

.home-page .hero-section > .container,
.home-page .hero-surface {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

.home-page .hero-surface {
  overflow: hidden !important;
  background-image: url("assets/hero-background-new.png") !important;
}

.home-page .hero-surface::before {
  opacity: 0.62;
}

.home-page .hero-grid {
  position: relative !important;
}

.home-page .hero-product-art {
  display: none;
  position: absolute;
  top: 50%;
  right: clamp(5%, 8vw, 150px);
  z-index: 2;
  width: clamp(310px, 30vw, 490px);
  aspect-ratio: 0.82;
  pointer-events: none;
  transform: translateY(-43%);
}

.home-page .hero-device-shell {
  position: absolute;
  z-index: 3;
  top: 4%;
  right: 12%;
  width: 53%;
  padding: 8px;
  overflow: hidden;
  border: 1px solid rgba(255, 158, 87, 0.78);
  border-radius: 34px;
  background: linear-gradient(138deg, rgba(255, 255, 255, 0.94), rgba(255, 214, 178, 0.78));
  box-shadow: 0 26px 50px rgba(211, 102, 40, 0.22), inset 0 0 0 2px rgba(255, 255, 255, 0.66);
  transform: rotate(5deg);
}

.home-page .hero-device-shell::after {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(130deg, rgba(189, 230, 255, 0.34), transparent 31%, rgba(255, 192, 134, 0.32));
  content: "";
  pointer-events: none;
}

.home-page .hero-device-shell img {
  display: block;
  width: 100%;
  border-radius: 27px;
}

.home-page .hero-device-highlight {
  position: absolute;
  z-index: 2;
  top: 10%;
  left: 7%;
  width: 37%;
  height: 50%;
  border-radius: 50%;
  background: linear-gradient(115deg, rgba(255, 255, 255, 0.72), transparent 68%);
  filter: blur(3px);
  transform: rotate(18deg);
}

.home-page .hero-flow {
  position: absolute;
  z-index: 1;
  border: 15px solid rgba(255, 181, 119, 0.26);
  border-left-color: rgba(255, 255, 255, 0.1);
  border-radius: 50%;
  filter: blur(1px);
}

.home-page .hero-flow-one {
  top: 15%;
  right: 0;
  width: 88%;
  height: 60%;
  transform: rotate(-20deg);
}

.home-page .hero-flow-two {
  right: 11%;
  bottom: 2%;
  width: 74%;
  height: 40%;
  border-width: 9px;
  transform: rotate(14deg);
}

.home-page .hero-orbit {
  position: absolute;
  z-index: 4;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: linear-gradient(135deg, #fff9ee, #ff9a3d);
  box-shadow: 0 0 18px rgba(255, 137, 47, 0.64);
}

.home-page .hero-orbit-one { top: 24%; left: 9%; }
.home-page .hero-orbit-two { right: 1%; bottom: 27%; width: 12px; height: 12px; }

.home-page .hero-glass-card {
  position: absolute;
  z-index: 5;
  min-width: 104px;
  padding: 12px 15px;
  border: 1px solid rgba(255, 255, 255, 0.78);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(235, 248, 255, 0.82), rgba(255, 237, 223, 0.72));
  box-shadow: 0 15px 28px rgba(187, 103, 48, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.82);
  color: #e66e25;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.05;
  backdrop-filter: blur(10px);
}

.home-page .hero-glass-card small {
  color: #63748a;
  font-size: 10px;
  font-weight: 500;
}

.home-page .hero-glass-card-top { top: 10%; left: 0; transform: rotate(-8deg); }
.home-page .hero-glass-card-side { right: -3%; bottom: 18%; color: #5d89b9; transform: rotate(5deg); }
.home-page .hero-glass-card-side strong { color: #f07428; font-size: 15px; }

.home-page .hero-arrow-light {
  position: absolute;
  z-index: 4;
  right: 7%;
  bottom: 7%;
  color: #ff8b37;
  font-size: clamp(50px, 5vw, 82px);
  font-weight: 300;
  line-height: 1;
  opacity: 0.78;
  text-shadow: 0 0 24px rgba(255, 163, 91, 0.68);
  transform: rotate(-20deg);
}

.home-page .hero-title-comma {
  display: inline !important;
}

@media (min-width: 721px) and (max-width: 1023px) {
  .home-page .hero-section,
  .home-page .hero-section > .container,
  .home-page .hero-surface {
    min-height: clamp(540px, 70svh, 680px) !important;
  }

  .home-page .hero-product-art {
  display: none;
    right: 4%;
    width: clamp(250px, 37vw, 360px);
    transform: translateY(-35%);
  }
}

@media (max-width: 720px) {
  .home-page .hero-section,
  .home-page .hero-section > .container,
  .home-page .hero-surface {
    background-color: var(--hero-canvas) !important;
  }

  .home-page .hero-subtitle {
    display: none;
  }

  .home-page .hero-title-comma {
    display: none !important;
  }

  .home-page .hero-product-art {
  display: none;
    top: auto !important;
    right: 50% !important;
    bottom: 0 !important;
    width: 260px !important;
    height: 250px !important;
    aspect-ratio: auto !important;
    transform: translateX(50%) !important;
  }

  .home-page .hero-glass-card,
  .home-page .hero-arrow-light,
  .home-page .hero-flow-two {
    display: none;
  }

  .home-page .hero-device-shell {
    top: 10px !important;
    right: 62px !important;
    width: 105px !important;
    border-radius: 23px;
    padding: 5px;
  }

  .home-page .hero-device-shell img {
    border-radius: 18px;
  }

  .home-page .hero-flow-one {
    top: 16px;
    right: 0;
    width: 230px;
    height: 178px;
    border-width: 9px;
  }

  .home-page .hero-orbit-one {
    top: 42px;
    left: 16px;
  }

  .home-page .hero-orbit-two {
    right: 12px;
    bottom: 72px;
  }
}


/* Final artwork fit: keep the 1960x802 hero image complete and edge-to-edge. */
body.home-page {
  overflow-x: hidden !important;
}

.home-page .page-shell {
  background: #faf5f4 !important;
}

.home-page .hero-section {
  width: 100vw !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 64px 0 0 calc(50% - 50vw) !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #faf5f4 !important;
}

.home-page .hero-section > .container,
.home-page .hero-surface {
  width: 100vw !important;
  max-width: 100vw !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
}

.home-page .hero-surface {
  position: relative !important;
  aspect-ratio: 1960 / 802 !important;
  height: calc(100vw * 802 / 1960) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: #faf5f4 url("assets/hero-background-new.png") center center / 100% 100% no-repeat !important;
}

.home-page .hero-surface::before,
.home-page .hero-surface::after {
  content: none !important;
}

.home-page .hero-grid {
  position: absolute !important;
  inset: 0 !important;
  left: 50% !important;
  z-index: 1 !important;
  display: flex !important;
  width: min(calc(100% - 48px), var(--container)) !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: center !important;
  justify-content: flex-start !important;
  transform: translateX(-50%) !important;
}

.home-page .hero-copy {
  max-width: 690px !important;
  margin: 0 0 0 24px !important;
  padding: 0 !important;
}

.home-page .hero-product-art {
  display: none !important;
}

@media (max-width: 720px) {
  .home-page .hero-section {
    margin-top: 78px !important;
  }

  .home-page .hero-surface {
    height: calc(100vw * 802 / 1960) !important;
    min-height: 0 !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
  }

  .home-page .hero-grid {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    align-items: flex-start !important;
    justify-content: center !important;
    padding-top: 10px !important;
  }

  .home-page .hero-copy {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-align: center !important;
  }

  .home-page .hero-copy h1 {
    margin: 0 !important;
  }

  .home-page .hero-title .hero-title-service {
    font-size: clamp(20px, 7vw, 28px) !important;
    line-height: 1.16 !important;
  }
}

/* Mobile header is in normal flow, so the hero should start immediately below it. */
@media (max-width: 720px) {
  .home-page .hero-section {
    margin-top: 0 !important;
  }
}

/* Keep mobile copy on the image's empty left area so it does not cover the phone. */
@media (max-width: 720px) {
  .home-page .hero-grid {
    justify-content: flex-start !important;
    padding-top: 18px !important;
  }

  .home-page .hero-copy {
    width: min(62vw, 238px) !important;
    max-width: min(62vw, 238px) !important;
    margin-left: 18px !important;
    text-align: left !important;
  }

  .home-page .hero-title,
  .home-page .hero-title .hero-title-service {
    text-align: left !important;
  }

  .home-page .hero-title .hero-title-service {
    font-size: clamp(19px, 6vw, 24px) !important;
    line-height: 1.14 !important;
  }

  .home-page .hero-download-entry {
    display: inline-flex !important;
    margin: 12px 0 0 !important;
  }

  .home-page .hero-download-trigger {
    min-height: 38px;
    padding: 0 14px;
    font-size: 14px;
  }

  .home-page .hero-download-popover {
    display: none;
  }
}

/* Product feature carousel polish: keep selected cards visible and remove module shadow. */
.home-page .smart-bill-shell {
  overflow: visible !important;
  box-shadow: none !important;
}

.home-page .smart-bill-carousel {
  margin-top: 32px !important;
  padding: 12px 0 8px !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}

@media (max-width: 720px) {
  .home-page .smart-bill-carousel {
    padding: 12px 20px 15px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }
}

.home-page .smart-bill-carousel-track {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.home-page .smart-bill-card,
.home-page .smart-bill-card:hover {
  box-shadow: none !important;
}

.home-page .smart-bill-card:hover {
  transform: translateY(-2px) !important;
}

/* Keep feature cards stable when selected or hovered; border highlight only. */
.home-page .smart-bill-card:hover,
.home-page .smart-bill-card:focus-within {
  transform: none !important;
  box-shadow: none !important;
}

/* White footer treatment. */
.home-page .site-footer,
.home-page .site-footer-home {
  background: #ffffff !important;
  color: #17202a !important;
  border-top: 1px solid #e4e9ee !important;
}

.home-page .site-footer .footer-shell,
.home-page .site-footer-home .footer-shell {
  background: #ffffff !important;
  box-shadow: none !important;
}

.home-page .footer-brand-block p,
.home-page .footer-hotline,
.home-page .footer-address,
.home-page .footer-bottom p,
.home-page .footer-qr-item figcaption {
  color: #586574 !important;
}

.home-page .footer-links a {
  color: #17202a !important;
}

.home-page .footer-links a:hover,
.home-page .footer-links a:focus-visible {
  color: #f36f21 !important;
}

.home-page .footer-bottom {
  border-top-color: #e4e9ee !important;
}

.home-page .footer-qr-item {
  background: #ffffff !important;
  border-color: #e4e9ee !important;
  box-shadow: none !important;
}

.home-page .footer-qr-item img {
  background: #ffffff !important;
}

@media (max-width: 720px) {
  .home-page .site-footer-home .footer-links {
    border-top-color: #e4e9ee !important;
    border-bottom-color: #e4e9ee !important;
  }

  .home-page .site-footer-home .footer-links a {
    color: #17202a !important;
  }

  .home-page .site-footer-home .footer-links a + a {
    border-left-color: #e4e9ee !important;
  }

  .home-page .site-footer-home .footer-bottom p {
    color: #687586 !important;
  }
}

/* Gray footer treatment. */
.home-page .site-footer,
.home-page .site-footer-home {
  background: #f4f6f8 !important;
  color: #17202a !important;
  border-top: 1px solid #dde3ea !important;
}

.home-page .site-footer .footer-shell,
.home-page .site-footer-home .footer-shell {
  background: #f4f6f8 !important;
  box-shadow: none !important;
}

.home-page .footer-brand-block p,
.home-page .footer-hotline,
.home-page .footer-address,
.home-page .footer-bottom p,
.home-page .footer-qr-item figcaption {
  color: #586574 !important;
}

.home-page .footer-links a {
  color: #17202a !important;
}

.home-page .footer-links a:hover,
.home-page .footer-links a:focus-visible {
  color: #f36f21 !important;
}

.home-page .footer-bottom {
  border-top-color: #dde3ea !important;
}

.home-page .footer-qr-item {
  background: #ffffff !important;
  border-color: #dde3ea !important;
  box-shadow: none !important;
}

@media (max-width: 720px) {
  .home-page .site-footer-home .footer-links {
    border-top-color: #dde3ea !important;
    border-bottom-color: #dde3ea !important;
  }

  .home-page .site-footer-home .footer-links a + a {
    border-left-color: #dde3ea !important;
  }
}

/* Trust section: use the provided phone image directly, without the old device frame. */
.home-page .trust-stage-phone {
  box-sizing: border-box !important;
  left: 39% !important;
  top: -18px !important;
  width: min(300px, 54%) !important;
  height: auto !important;
  aspect-ratio: 592 / 1280 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: translateX(-50%) !important;
}

.home-page .trust-stage-phone img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  filter: drop-shadow(0 20px 28px rgba(17, 24, 32, 0.14)) !important;
}

.home-page .trust-stage-phone::before,
.home-page .trust-stage-phone::after {
  content: none !important;
}

/* Trust section phone sizing: keep the direct phone artwork inside its module. */
.home-page .trust-stage {
  min-height: 500px !important;
}

.home-page .trust-stage-phone {
  top: 18px !important;
  left: 38% !important;
  width: min(245px, 43%) !important;
}

.home-page .trust-stage-qr {
  top: 146px !important;
}

@media (min-width: 1024px) {
  .home-page .trust-stage-phone {
    width: min(260px, 46%) !important;
  }
}

@media (min-width: 769px) and (max-width: 1023px) {
  .home-page .trust-stage {
    min-height: 440px !important;
  }

  .home-page .trust-stage-phone {
    top: 24px !important;
    width: min(210px, 42%) !important;
  }

  .home-page .trust-stage-qr {
    top: 136px !important;
    right: 24px !important;
    width: 178px !important;
  }
}

/* Nudge trust section phone upward. */
.home-page .trust-stage-phone {
  top: -2px !important;
}

@media (min-width: 769px) and (max-width: 1023px) {
  .home-page .trust-stage-phone {
    top: 6px !important;
  }
}

/* Slightly reduce trust section phone artwork. */
.home-page .trust-stage-phone {
  width: min(225px, 39%) !important;
}

@media (min-width: 1024px) {
  .home-page .trust-stage-phone {
    width: min(235px, 41%) !important;
  }
}

@media (min-width: 769px) and (max-width: 1023px) {
  .home-page .trust-stage-phone {
    width: min(190px, 38%) !important;
  }
}

/* Scenario one: use the supplied wide scene image as the visual background. */
.home-page #scenarios .scenario-flow-item:first-child .scenario-visual {
  padding: 0 !important;
  background: #fff7f0 !important;
  overflow: hidden !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card {
  width: 100% !important;
  height: 100% !important;
  min-height: 400px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card::before,
.home-page #scenarios .scenario-flow-item:first-child .scenario-shot-card {
  display: none !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-media {
  width: 100% !important;
  height: 100% !important;
  min-height: 400px !important;
  object-fit: cover !important;
  object-position: left center !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-copy {
  order: 2;
}

@media (max-width: 720px) {
  .home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card,
  .home-page #scenarios .scenario-flow-item:first-child .scenario-photo-media {
    min-height: 260px !important;
  }
}

/* Scenario one: reference-style left image and right copy layout. */
.home-page #scenarios .scenario-flow-item:first-child {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 0 !important;
  min-height: 420px !important;
  padding: 32px 44px !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, #ffffff 0%, #f5f8fb 100%) !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-visual {
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card {
  width: min(520px, 88%) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 auto !important;
  aspect-ratio: 1160 / 757 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-media {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-copy {
  min-height: 0 !important;
  padding: 0 40px !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-copy h3 {
  max-width: 14em !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-copy p {
  max-width: 30em !important;
}

@media (max-width: 720px) {
  .home-page #scenarios .scenario-flow-item:first-child {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    min-height: 0 !important;
    padding: 22px !important;
  }

  .home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card {
    width: 100% !important;
  }

  .home-page #scenarios .scenario-flow-item:first-child .scenario-copy {
    padding: 0 !important;
  }
}

/* Scenario one crop fit: match the tightened image bounds and remove side padding. */
.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card {
  width: min(540px, 100%) !important;
  aspect-ratio: 970 / 658 !important;
  margin: 0 !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-visual {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
}

.home-page #scenarios .scenario-flow-item:first-child {
  column-gap: clamp(36px, 5vw, 72px) !important;
}

@media (max-width: 720px) {
  .home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card {
    width: 100% !important;
  }
}

/* Scenario one corner alignment. */
.home-page #scenarios .scenario-flow-item:first-child {
  overflow: hidden !important;
  border-radius: 16px !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card {
  border-radius: 16px !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-media {
  border-radius: inherit !important;
}

/* Scenario one image corner fit: match the bitmap's rounded card. */
.home-page #scenarios .scenario-flow-item:first-child {
  border-radius: 16px !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card {
  aspect-ratio: 966 / 656 !important;
  border-radius: 28px !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-media {
  border-radius: 28px !important;
}

/* Scenario one requested image radius. */
.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-card,
.home-page #scenarios .scenario-flow-item:first-child .scenario-photo-media {
  border-radius: 30px !important;
}

/* Scenario two: use supplied rounded image crop and keep original copy. */
.home-page #scenarios .scenario-flow-item:nth-child(2) {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: clamp(36px, 5vw, 72px) !important;
  min-height: 420px !important;
  padding: 32px 44px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: linear-gradient(90deg, #ffffff 0%, #f5f8fb 100%) !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-visual {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-photo-card {
  width: min(540px, 100%) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  aspect-ratio: 930 / 586 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 30px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-photo-card::before,
.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-shot-card {
  display: none !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-photo-media {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 30px !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-copy {
  min-height: 0 !important;
  padding: 0 40px !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-copy h3 {
  max-width: 14em !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-copy p {
  max-width: 30em !important;
}

@media (max-width: 720px) {
  .home-page #scenarios .scenario-flow-item:nth-child(2) {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    min-height: 0 !important;
    padding: 22px !important;
  }

  .home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-photo-card {
    width: 100% !important;
  }

  .home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-copy {
    padding: 0 !important;
  }
}

/* Scenario two must stay left-copy / right-image. */
.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-copy {
  order: 1 !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-visual {
  order: 2 !important;
}

@media (max-width: 720px) {
  .home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-copy {
    order: 1 !important;
  }

  .home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-visual {
    order: 2 !important;
  }
}

/* Scenario three: use supplied rounded image crop and keep original copy. */
.home-page #scenarios .scenario-flow-item:nth-child(3) {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: center !important;
  gap: clamp(36px, 5vw, 72px) !important;
  min-height: 420px !important;
  padding: 32px 44px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: linear-gradient(90deg, #ffffff 0%, #f5f8fb 100%) !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-visual {
  display: flex !important;
  justify-content: flex-start !important;
  align-items: center !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-photo-card {
  width: min(540px, 100%) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  aspect-ratio: 944 / 638 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 30px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-photo-card::before,
.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-shot-card {
  display: none !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-photo-media {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 30px !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-copy {
  min-height: 0 !important;
  padding: 0 40px !important;
  background: transparent !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-copy h3 {
  max-width: 14em !important;
}

.home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-copy p {
  max-width: 30em !important;
}

@media (max-width: 720px) {
  .home-page #scenarios .scenario-flow-item:nth-child(3) {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    min-height: 0 !important;
    padding: 22px !important;
  }

  .home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-photo-card {
    width: 100% !important;
  }

  .home-page #scenarios .scenario-flow-item:nth-child(3) .scenario-copy {
    padding: 0 !important;
  }
}

/* Scenario two crop correction: include the full rounded visual content. */
.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-photo-card {
  aspect-ratio: 930 / 650 !important;
}

/* Roll back scenario two crop correction. */
.home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-photo-card {
  aspect-ratio: 930 / 586 !important;
}

/* Mobile scenario two: image first, copy second. Desktop remains left-copy/right-image. */
@media (max-width: 720px) {
  .home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-visual {
    order: 1 !important;
  }

  .home-page #scenarios .scenario-flow-item:nth-child(2) .scenario-copy {
    order: 2 !important;
  }
}