.home-page {
  --home-header-height: 101px;
  --home-opening: #100e0c;
  --home-image-height: clamp(300px, 79vw, 520px);
}
.home-page > header {
  margin-bottom: calc(-1 * var(--home-header-height));
  background: transparent;
  border-bottom-color: transparent;
}
.home-page > header.home-header-pinned {
  background: #100e0cf5;
  border-bottom-color: var(--line);
}
.home-page .hero {
  min-height: 0;
  background: var(--home-opening);
}
.home-page .hero-inner {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: clamp(20px, 3.2dvh, 45px);
  min-height: min(100dvh, 1060px, calc(100vw * 9 / 16 + 100px));
  width: min(90%, 1540px);
  padding-block: calc(var(--home-header-height) + clamp(24px, 7dvh, 96px)) clamp(16px, 3dvh, 36px);
}
.home-page .hero-copy { width: min(49%, 780px); max-width: none; }
.home-page .hero-copy .eyebrow { margin: 0 0 17px; }
.home-page .hero-copy h1 {
  max-width: none;
  min-height: 0;
  color: #fff4df;
  font: 400 clamp(39px, min(5.2vw, 9dvh), 88px)/1.02 Georgia, 'Times New Roman', serif;
  letter-spacing: -.045em;
}
.home-page .hero-copy h1 em { color: #e9c28b; }
.home-page .hero-couple h1 em { font-style: normal; }
.home-page .hero .hero-copy .intro {
  max-width: min(100%, 545px);
  margin: clamp(14px, 2.3dvh, 29px) 0 clamp(18px, 3.4dvh, 34px);
  color: #f3eade;
  font-size: clamp(16px, 1.48vw, 23px);
  line-height: 1.55;
}
.home-page .hero .actions { align-items: center; gap: 14px 25px; }
.home-page .hero .actions .button { min-height: 52px; padding: 11px 22px; }
.home-page .home-clinic-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: #fff4e5; font-size: 16px; }
.home-page .home-clinic-link > span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #d4af77; border-radius: 50%; color: #e9c28b; }
.home-page .home-clinic-link svg { width: 16px; height: 16px; }
.home-page .home-clinic-link:hover { text-decoration: underline; }
.home-page .campaign-controls { margin-top: 14px; }
.home-page .hero-couple .hero-visual { width: 100%; }
.home-page .hero-couple .hero-visual > .photo {
  inset: 0 0 auto auto;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: right top;
  mask-image: linear-gradient(to bottom, #000 84%, transparent);
}
.home-page .hero-couple .hero-shade {
  background: linear-gradient(180deg, #100d0b44, transparent 19%, transparent 70%, #100e0caa),
    linear-gradient(90deg, #100d0b4d 0%, #100d0b11 42%, transparent 64%);
}
.home-page .home-treatment-links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
  width: 100%;
  margin: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}
.home-page .home-treatment-links > a {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 7px;
  min-width: 0;
  min-height: clamp(95px, 15dvh, 145px);
  overflow: hidden;
  padding: 13px 15px;
  border: 1px solid #b795638a;
  border-radius: 12px;
  background: #1d1712;
  color: #fff2de;
  font: 400 clamp(18px, 1.62vw, 27px)/1.08 Georgia, 'Times New Roman', serif;
  white-space: normal;
}
.home-page .home-treatment-links img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
}
.home-page .home-treatment-links > a::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(0deg, #110d0afa, #110d0a1a 95%);
}
.home-page .home-treatment-arrow {
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  border: 1px solid #d2aa75;
  border-radius: 50%;
  color: #e9c28b;
  font: 15px/1 Arial, sans-serif;
}
.home-page .home-treatment-links > a:hover,
.home-page .home-treatment-links > a:focus-visible { border-color: #f0ca90; }
.home-page .home-treatment-links > a:focus-visible { outline: 2px solid #f0ca90; outline-offset: 2px; }
.home-page .whatsapp-float {
  right: 13px;
  width: 44px;
  height: 44px;
  min-width: 0;
  min-height: 0;
  justify-content: center;
  padding: 0;
  border-radius: 50%;
}
.home-page .whatsapp-float span { display: none; }
.home-page .home-benefits {
  width: min(88%, 1400px);
  margin: 28px auto 0;
  padding: 0;
}
@media (max-width: 1180px) {
  .home-page { --home-header-height: 89px; }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .home-page .hero-couple .hero-shade {
    background: linear-gradient(90deg, #100d0bb3, #100d0b4d 42%, transparent 68%),
      linear-gradient(0deg, #100e0caa, transparent 30%);
  }
}
@media (min-width: 761px) and (max-height: 720px) {
  .home-page .hero-inner {
    gap: 16px;
    padding-top: calc(var(--home-header-height) + 28px);
  }
  .home-page .hero-copy .eyebrow { margin-bottom: 12px; }
  .home-page .hero .hero-copy .intro { margin-block: 13px 19px; }
}
@media (max-width: 760px) {
  .home-page .hero-inner {
    min-height: 0;
    padding-block: var(--home-image-height) 26px;
  }
  .home-page .hero-copy { width: 100%; }
  .home-page .hero-copy h1 { font-size: clamp(37px, 8.2vw, 59px); }
  .home-page .hero-couple .hero-visual,
  .home-page .hero-couple .hero-visual > .photo,
  .home-page .hero-couple .hero-shade { height: calc(var(--home-image-height) + 26px); }
  .home-page .hero-couple .hero-visual > .photo {
    width: 100%;
    object-fit: cover;
    object-position: right 20%;
    mask-image: none;
  }
  .home-page .hero-couple .hero-shade {
    background: linear-gradient(180deg, #100d0b66, transparent 30%, transparent 58%, var(--home-opening) 100%);
  }
  .home-page .hero .actions { display: flex; flex-wrap: wrap; }
  .home-page .home-treatment-links { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .home-page .home-treatment-links > a { min-height: 100px; padding: 10px; }
  .home-page .home-treatment-arrow { width: 22px; height: 22px; font-size: 13px; }
}

/* Preserve the complete source frame across every campaign. */
.home-page .hero { --campaign-ratio: 1.777; }
.home-page .hero .hero-visual {
  inset: 0 0 auto;
  width: 100%;
  height: calc(100vw / var(--campaign-ratio));
}
.home-page .hero .hero-visual > img.photo,
.home-page .hero .hero-visual > img.hero-campaign-img,
.home-page .hero .hero-visual > img.hero-campaign-img[src] {
  inset: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: none;
  padding: 0;
  object-fit: contain;
  object-position: center top;
  mask-image: none;
  -webkit-mask-image: none;
}
.home-page .home-treatment-links img {
  object-fit: contain;
  object-position: center top;
  padding-bottom: 42px;
}
.home-page .home-treatment-links > a { min-height: 160px; }
@media (min-width: 761px) {
  .home-page .hero { height: 100dvh; min-height: 0; }
  .home-page .hero .hero-visual { height: 100%; }
  .home-page .hero .hero-visual > img { object-position: right center; }
  .home-page .hero-inner {
    box-sizing: border-box;
    height: 100%;
    min-height: 0;
    padding-block: calc(var(--home-header-height) + clamp(16px, 4dvh, 45px)) 20px;
    gap: 16px;
  }
  .home-page .home-treatment-links > a {
    min-height: 0;
    height: clamp(100px, 16dvh, 150px);
  }
}
@media (min-width: 761px) and (max-height: 740px) {
  .home-page .hero-copy h1 { font-size: clamp(30px, 6.5dvh, 48px); }
  .home-page .hero-copy .eyebrow { margin-bottom: 8px; }
  .home-page .hero .hero-copy .intro { margin-block: 10px 14px; font-size: 15px; line-height: 1.4; }
  .home-page .hero .actions .button { min-height: 40px; padding-block: 8px; }
  .home-page .campaign-controls { margin-top: 8px; }
  .home-page .home-treatment-links > a { height: 100px; font-size: 17px; }
}

@media (max-width: 760px) {
  .home-page .hero-inner {
    padding-top: max(calc(100vw / var(--campaign-ratio)), var(--home-header-height));
  }
  .home-page .hero .hero-shade { height: calc(100vw / var(--campaign-ratio)); }
}

/* Preserve the original colours of campaign photos 2–5. */
.home-page .hero:not(.hero-couple) .hero-shade { background: transparent; }
.home-page .hero:not(.hero-couple) .hero-campaign-img { filter: none; opacity: 1; mix-blend-mode: normal; }
.home-page .hero:not(.hero-couple) .hero-copy h1,
.home-page .hero:not(.hero-couple) .hero-copy .intro,
.home-page .hero:not(.hero-couple) .hero-copy .eyebrow { text-shadow: 0 2px 5px #000c, 0 0 16px #0008; }

/* The first campaign retains its approved photo with a separate brand layer. */
.home-page .home-photo-brand { display:none; position:absolute; left:12%; bottom:23%; z-index:2; color:#e7c58e; text-align:center; opacity:.65; pointer-events:none; text-shadow:0 0 12px #d9ae6c88; }
.home-page .hero-couple .home-photo-brand { display:block; }
.home-page .home-photo-brand span { display:block; font:400 clamp(38px,4.5vw,72px)/.85 Georgia,serif; letter-spacing:-.08em; }
.home-page .home-photo-brand small { display:block; margin-top:9px; font:500 clamp(10px,1vw,16px)/1.2 Arial,sans-serif; letter-spacing:.28em; }
@media(max-width:760px) { .home-page .home-photo-brand { left:6%; bottom:15%; } }
@media(max-width:1024px) {
 .home-page .hero { height:auto; min-height:0; }
 .home-page .hero-inner { height:auto; min-height:0; max-height:none; justify-content:flex-start; padding-block:calc(100vw / var(--campaign-ratio) + 24px) 28px; gap:24px; }
 .home-page .hero-copy { width:100%; flex-shrink:0; }
 .home-page .hero .hero-visual, .home-page .hero .hero-shade { height:calc(100vw / var(--campaign-ratio)); }
 .home-page .hero-copy h1 { font-size:clamp(36px,6.4vw,58px); }
 .home-page .hero .actions { display:flex; flex-wrap:wrap; }
 .home-page .home-photo-brand { bottom:15%; }
}