/* Visual refinements requested after the first preview. */
.kicker {
  font-size: 1.02rem;
}

.hero .eyebrow {
  max-width: 720px;
  font-size: 1.08rem;
  justify-content: center;
}

.hero h1 {
  font-size: clamp(2.25rem, 4.45vw, 4.15rem);
}

.hero h1 em {
  color: var(--yellow);
}

.brand-logo {
  display: block;
  object-fit: contain;
}

.hero-logo {
  width: clamp(190px, 20vw, 290px);
  max-height: 142px;
  margin: 0 auto 22px;
  object-position: center;
}

.hero-copy {
  text-align: center;
}

.hero-copy > p {
  margin-right: auto;
  margin-left: auto;
}

.footer-logo {
  width: 200px;
  max-height: 126px;
  margin: 0 auto 16px;
}

.frame {
  overflow: hidden;
}

.frame img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center;
}

.cris-photo {
  position: relative;
  min-height: 500px;
  margin: 0;
  overflow: hidden;
  border: 8px solid #fff;
  border-radius: 44px;
  background: #eaf7ff;
  box-shadow: 0 24px 55px #153f7426;
}

.cris-photo img {
  width: 100%;
  height: 100%;
  min-height: 500px;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center 18%;
}

.cris-photo figcaption {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  padding: 18px 22px;
  border: 1px solid #ffffff80;
  border-radius: 22px;
  background: #153f74e8;
  color: #fff;
  text-align: center;
  backdrop-filter: blur(6px);
}

.cris-photo figcaption p {
  margin: 0;
  color: #fff;
  font-family: Fredoka, "Trebuchet MS", Arial, sans-serif;
  font-size: 1.6rem;
  font-weight: 900;
}

.cris-photo figcaption small {
  color: #eaf7ff;
}

.bonus-sos > div {
  padding: 12px;
}

.bonus-sos img {
  max-height: 320px;
}

.bonus-extra {
  margin-top: -2px;
  padding-top: 12px;
  border-top: 1px solid #d9eee3;
  color: var(--darkgreen) !important;
  font-weight: 800;
}

.features .seed {
  border-color: #dfedf5;
  background: #f8fcff;
}

.garden-options {
  display: inline-block;
  margin-bottom: 12px;
  padding: 7px 12px;
  border-radius: 999px;
  background: #eaf8ef;
  color: var(--darkgreen) !important;
  font-size: .86rem !important;
  font-weight: 900;
}

.imagine-night {
  width: 100%;
  max-height: 650px;
  border: 8px solid #fff;
  border-radius: 38px;
  object-fit: cover;
  object-position: center;
  box-shadow: 0 24px 55px #153f7426;
}

.products {
  padding-bottom: 112px;
}

.products > div {
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}

.products > div img {
  max-height: 190px;
  transform: scale(1.12);
  transform-origin: center bottom;
}

@media (max-width: 900px) {
  .hero-logo {
    margin-right: auto;
    margin-left: auto;
  }

  .cris-photo {
    max-width: 650px;
    margin: 0 auto;
  }
}

@media (max-width: 620px) {
  .kicker {
    font-size: .95rem;
  }

  .hero .eyebrow {
    font-size: .95rem;
    line-height: 1.5;
  }

  .hero h1 {
    font-size: 2.15rem;
  }

  .hero-logo {
    width: 205px;
    max-height: 108px;
    margin-bottom: 18px;
  }

  .frame img {
    aspect-ratio: 4 / 5;
  }

  .cris-photo,
  .cris-photo img {
    min-height: 420px;
  }

  .cris-photo figcaption {
    right: 12px;
    bottom: 12px;
    left: 12px;
  }

  .products > div img {
    max-height: 145px;
    transform: scale(1.08);
  }
}

/* Approved headline and complete product combo. */
.hero .hero-copy { text-align:left; }
.hero .hero-logo { margin:0 0 24px; }
.hero .hero-copy > p { margin-left:0; margin-right:0; }
.hero h1.hero-title { font-size:clamp(2rem,3.1vw,2.8rem); line-height:1.15; letter-spacing:-.025em; }
.hero-title span { display:block; color:#fff; font-size:inherit; }
.hero-title span + span { margin-top:16px; }
.hero .hero-benefit { font-size:clamp(1.65rem,2.35vw,2.05rem); line-height:1.35; margin-top:14px; font-weight:800; max-width:720px; }
.hero-benefit em { color:var(--yellow); font-style:normal; }
.hero-copy .micro { justify-content:flex-start; }
.offer-grid { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:36px; }
.combo-products { width:100%; max-width:700px; margin:auto; position:relative; }
.combo-app { width:88%; margin:0 auto; filter:drop-shadow(0 14px 18px #153f7420); }
.combo-extras { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px 8px; position:relative; margin-top:-42px; }
.combo-extras figure { margin:0; min-width:0; display:flex; flex-direction:column; align-items:center; }
.combo-extras img { width:100%; height:180px; object-fit:contain; filter:drop-shadow(0 8px 8px #17324d24); }
.combo-extras figcaption { font-size:14px; font-weight:800; line-height:1.3; text-align:center; color:var(--navy); margin-top:7px; }
@media(max-width:900px) { .offer-grid { grid-template-columns:1fr; } .combo-products { max-width:620px; } .combo-extras img { height:200px; } }
@media(max-width:620px) { .hero h1.hero-title { font-size:2rem; } .hero .hero-benefit { font-size:1.5rem; line-height:1.32; margin-top:10px; } .combo-app { width:96%; } .combo-extras { margin-top:-24px; gap:16px 5px; } .combo-extras img { height:125px; } .combo-extras figcaption { font-size:14px; } }
/* Unified overlapping product composition requested from the reference. */
.combo-products { aspect-ratio:1 / 1.02; isolation:isolate; max-width:700px; }
.combo-app { position:absolute; width:83%; height:76%; object-fit:contain; top:0; left:8.5%; margin:0; z-index:2; }
.combo-extras { display:block; position:absolute; inset:0; margin:0; }
.combo-extras figure { position:absolute; width:32%; height:34%; display:block; }
.combo-extras img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 9px 7px #17324d30); }
.combo-extras figcaption { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.combo-extras figure:nth-child(1) { left:0; top:47%; z-index:4; transform:rotate(-9deg); }
.combo-extras figure:nth-child(2) { right:0; top:45%; z-index:3; transform:rotate(8deg); }
.combo-extras figure:nth-child(3) { left:19%; top:60%; z-index:6; transform:rotate(-5deg); }
.combo-extras figure:nth-child(4) { right:16%; top:66%; z-index:7; transform:rotate(5deg); }
.combo-extras figure:nth-child(5) { right:0; top:65%; z-index:5; transform:rotate(9deg); }
.combo-extras figure:nth-child(6) { left:0; top:69%; z-index:5; transform:rotate(-8deg); }
@media(max-width:620px) { .combo-products { aspect-ratio:1 / 1.06; } .combo-app { width:88%; left:6%; } .combo-extras img { height:100%; } }

/* Layout aligned to the supplied hero reference and replacement artwork. */
.hero-grid { grid-template-columns: minmax(0, 1fr) minmax(360px, .9fr); }
.hero-top { grid-column: 1 / -1; display: grid; justify-items: center; text-align: center; max-width: 1120px; margin: 0 auto 32px; }
.hero-top .hero-logo { width: clamp(185px, 15vw, 245px); max-height: 120px; margin: 0 0 24px; }
.hero h1.hero-title { max-width: 1000px; font-size: clamp(2.25rem, 3.7vw, 3.55rem); line-height: 1.12; }
.hero-copy { align-self: center; }
.hero-copy .hero-benefit { max-width: 620px; }
.hero-grid { row-gap: 18px; }
.hero-copy { margin-top: -8px; }
.culpa-section .split { row-gap: 30px; }
.culpa-bridge { display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:42px; text-align:center; }
.culpa-bridge mark { margin:0; font-size:clamp(1.35rem,2.4vw,2rem); padding:10px 22px; }
.culpa-bridge p { max-width:760px; margin:0; color:var(--navy); font-size:clamp(1.15rem,2vw,1.55rem); line-height:1.4; font-weight:800; }
.combo-products { display: grid; place-items: center; aspect-ratio: 1.16 / 1; max-width: 720px; }
.combo-pack { width: 100%; max-height: 540px; object-fit: contain; filter: drop-shadow(0 14px 16px #153f7428); }
.guarantee-seal { width: clamp(110px, 13vw, 165px); height: auto; flex: 0 0 auto; }
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-top { margin-bottom: 18px; }
  .hero-copy { order: 2; }
  .hero-art { order: 3; }
  .hero-grid { row-gap: 12px; }
  .culpa-section .split { gap: 26px; }
  .culpa-bridge { margin-top: 32px; }
}
@media (max-width: 620px) {
  .hero-top { margin-bottom: 10px; }
  .hero-top .hero-logo { width: 180px; margin-bottom: 18px; }
  .hero h1.hero-title { font-size: 2.05rem; }
  .hero-copy { margin-top: -2px; }
  .culpa-section .split { gap: 22px; }
  .culpa-bridge { margin-top: 28px; gap: 12px; }
  .culpa-bridge mark { font-size:1.3rem; line-height:1.25; }
  .culpa-bridge p { font-size:1.15rem; line-height:1.4; }
  .combo-products { aspect-ratio: 1 / 1; }
  .combo-pack { max-height: 410px; }
  .guarantee-seal { width: 128px; margin: 0 auto; }
}