/* Homepage + specialty heroes: full-bleed image with a soft curved transition into the purple content area. */

/* Keep the floating contact button as the WhatsApp SVG icon. */
.floating-contact {
  font-size: 0;
}
.floating-contact svg {
  display: block !important;
  width: 42px !important;
  height: 42px !important;
  fill: currentColor !important;
}

/* The emphasized second line in the gastro process heading sits on a dark background. */
.content-page:not(.weight-page) .gastro-process-head h2 em {
  color: #fff !important;
}

@media (min-width: 901px) {
  body:not(.content-page) .site-header {
    background: rgba(252,249,253,.98);
  }

  body:not(.content-page) .hero {
    position: relative;
    grid-template-columns: 40% 60%;
    min-height: 590px;
    background: var(--mint);
  }

  body:not(.content-page) .hero-copy,
  .weight-page .gastro-hero-copy,
  .content-page:not(.weight-page) .gastro-hero-copy {
    position: relative;
    z-index: 4;
    background: var(--mint);
  }

  body:not(.content-page) .hero-copy {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  body:not(.content-page) .hero h1 em {
    display: inline-block;
    white-space: nowrap;
  }
  body:not(.content-page) .hero-actions .primary-button,
  body:not(.content-page) .hero-actions .text-link {
    white-space: nowrap;
  }

  body:not(.content-page) .hero-copy::before,
  .weight-page .gastro-hero-copy::before,
  .content-page:not(.weight-page) .gastro-hero-copy::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: -135px;
    width: 195px;
    background: var(--mint);
    border-radius: 50% 0 0 50% / 52% 0 0 48%;
    box-shadow: -18px 0 0 rgba(169,139,194,.42);
    pointer-events: none;
  }

  body:not(.content-page) .hero-visual {
    background: transparent;
    padding: 0;
    min-height: 590px;
    overflow: hidden;
  }

  body:not(.content-page) .hero-visual .sun-shape,
  body:not(.content-page) .hero-visual .leaf-shape,
  body:not(.content-page) .hero-visual .expertise-card {
    display: none;
  }

  body:not(.content-page) .hero-visual .portrait-frame {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    overflow: hidden;
  }

  body:not(.content-page) .hero-visual .portrait-frame::after {
    display: none;
  }

  body:not(.content-page) .hero-visual .portrait-frame img {
    content: url('/images/weight-loss-hero.jpeg');
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: 50% 48%;
  }

  body:not(.content-page) .hero-actions .text-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 54px;
    padding: 15px 24px;
    border: 1px solid var(--forest);
    border-radius: 999px;
    color: var(--forest);
    background: transparent;
    text-decoration: none;
    transition: transform .2s, background .2s, color .2s;
  }

  body:not(.content-page) .hero-actions .text-link:hover {
    transform: translateY(-2px);
    background: var(--forest);
    color: white;
  }

  .weight-page .gastro-hero,
  .content-page:not(.weight-page) .gastro-hero {
    position: relative;
    min-height: 590px;
    grid-template-columns: 40% 60%;
    gap: 0;
    padding: 0;
    background: var(--mint);
    overflow: hidden;
  }

  .weight-page .gastro-hero-copy,
  .content-page:not(.weight-page) .gastro-hero-copy {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 64px clamp(38px,5vw,82px);
  }

  .weight-page .gastro-hero-photo,
  .content-page:not(.weight-page) .gastro-hero-photo {
    position: relative;
    width: 100%;
    height: 690px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: hidden;
    justify-self: stretch;
  }

  .weight-page .gastro-hero-photo img,
  .content-page:not(.weight-page) .gastro-hero-photo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }

  .weight-page .gastro-hero-photo img {
    content: url('/images/ofir-hero-new.png');
    object-position: 50% 42%;
  }

  .content-page:not(.weight-page) .gastro-hero-photo {
    background: #f7f2f8;
  }
  .content-page:not(.weight-page) .gastro-hero-photo img {
    object-fit: cover;
    object-position: 64% 42%;
    transform: none;
  }
}

@media (max-width: 900px) {
  body:not(.content-page) .site-header {
    background: rgba(252,249,253,.98);
  }

  body:not(.content-page) .hero h1 em {
    display: inline-block;
    white-space: nowrap;
  }

  body:not(.content-page) .hero-actions .primary-button,
  body:not(.content-page) .hero-actions .text-link {
    white-space: nowrap;
  }

  body:not(.content-page) .hero-visual .portrait-frame img {
    content: url('/images/weight-loss-hero.jpeg');
  }

  .weight-page .gastro-hero-photo img {
    content: url('/images/ofir-hero-new.png');
  }

  body:not(.content-page) .hero-actions .text-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 22px;
    border: 1px solid var(--forest);
    border-radius: 999px;
    color: var(--forest);
    text-decoration: none;
  }

  .content-page:not(.weight-page) .gastro-hero-photo img {
    object-position: 66% 38%;
  }

  .floating-contact svg {
    width: 36px !important;
    height: 36px !important;
  }
}