/* The desktop opening is retained; the photograph leads on phones. */
.hbt-site .hbt-mobile-hero-title { display: none; }
@media(max-width:700px) {
  .hbt-site .hbt-home-hero.hbt-mobile-first-hero {
    --hbt-opening-height: max(390px,calc(100svh - var(--hbt-opening-offset,114px)));
    display: block;
    min-height: 0;
    height: auto;
    padding: 0 0 32px;
    background: #f6f5ed;
    color: #244335;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-cinema-layer {
    top: 0;
    bottom: auto;
    height: var(--hbt-opening-height);
  }
  .hbt-site .hbt-mobile-first-hero .hbt-cinema-layer>img.hbt-hero-image {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    object-position: 86% 50%;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-cinema-layer>img.hbt-hero-image:not([data-scene="elephant"]) { object-position: 50% 50%; }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-shade {
    top: 0;
    bottom: auto;
    height: var(--hbt-opening-height);
    background: linear-gradient(0deg,#0b1011eb 0%,#0d131580 18%,#0b101100 48%),linear-gradient(180deg,#10151255,transparent 25%);
  }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-contours { display: none; }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-content {
    position: relative;
    width: 100%;
    margin: 0;
    padding: calc(var(--hbt-opening-height) + 30px) 24px 0;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-content>.hbt-eyebrow {
    position: absolute;
    top: 24px;
    left: 24px;
    right: 24px;
    margin: 0 !important;
    font-size: 9px;
    letter-spacing: .08em;
    line-height: 1.65;
    color: #fff5db;
    text-shadow: 0 1px 9px #102216aa;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-content>h1 {
    position: absolute;
    top: calc(var(--hbt-opening-height) - 174px);
    left: 24px;
    right: 24px;
    margin: 0;
    line-height: 1.08;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-africa-word { font-size: clamp(58px,17vw,72px); line-height: 1.08; }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-promise { display: none; }
  .hbt-site .hbt-mobile-first-hero .hbt-mobile-hero-title {
    display: block;
    margin: 0 0 18px;
    max-width: 360px;
    font-size: clamp(30px,8.7vw,36px);
    line-height: 1.16;
    letter-spacing: -.02em;
    color: #244335;
    text-shadow: none;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-content>p:not(.hbt-eyebrow) {
    margin: 0;
    max-width: 360px;
    font-size: 16px;
    line-height: 1.85;
    color: #455b4d;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-actions { display: block; position: static; margin-top: 15px; }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-actions>.hbt-btn {
    position: absolute;
    top: calc(var(--hbt-opening-height) - 80px);
    left: 24px;
    right: 24px;
    width: calc(100% - 48px);
    min-height: 56px;
    justify-content: space-between;
    font-size: 14px;
    padding: 15px 20px;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-secondary { color: #315740; font-size: 13px; min-height: 44px; gap: 18px; }
  .hbt-site .hbt-mobile-first-hero .hbt-hero-secondary>span { border-color: #abbc9b; background: #e4ebdb; color: #315740; }
  .hbt-site .hbt-mobile-first-hero .hbt-horizon-dock {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    width: calc(100% - 48px);
    margin: 22px 24px 28px;
    padding: 14px;
    background: linear-gradient(120deg,#233c33,#112c26);
    border-color: #9fae8f;
    box-shadow: inset 0 1px 0 #e8edcf24,0 12px 25px #18392b15;
  }
  .hbt-site .hbt-mobile-first-hero .hbt-horizon-dock>p { font-size: 10px; color: #f5edd5; }
  .hbt-site .hbt-mobile-first-hero .hbt-horizon-dock button { height: 90px; }
  .hbt-site .hbt-mobile-first-hero .hbt-horizon-dock button>span { font-size: 9px; }
}