/**
 * Locations template hero (loc_landing) — CMS-driven overrides.
 * Loaded only on page-locations.php. All selectors scoped under .loc_landing.
 */

/* —— Hero height (theme defaults: desktop 100dvh, tablet 100dvh, mobile 83dvh) —— */
.loc_landing {
  height: var(--loc-hero-height-desktop, 100dvh);
}

@media only screen and (max-width: 1023px) {
  .loc_landing {
    height: var(
      --loc-hero-height-tablet,
      var(--loc-hero-height-desktop, 100dvh)
    );
  }
}

@media only screen and (max-width: 699px) {
  .loc_landing {
    height: var(
      --loc-hero-height-mobile,
      var(--loc-hero-height-tablet, 83dvh)
    );
  }
}

/* —— Typography —— */
.loc_landing .loc_txt_ttl h1 {
  font-size: var(--loc-h1-size-desktop, calc(50px + 2dvh));
}

.loc_landing .loc_txt_btm p {
  font-size: var(--loc-tagline-size-desktop, var(--font-h3));
}

@media only screen and (max-width: 1023px) {
  .loc_landing .loc_txt_ttl h1 {
    font-size: var(
      --loc-h1-size-tablet,
      var(--loc-h1-size-desktop, calc(50px + 2dvh))
    );
  }

  .loc_landing .loc_txt_btm p {
    font-size: var(
      --loc-tagline-size-tablet,
      var(--loc-tagline-size-desktop, var(--font-h3))
    );
  }

  .loc_landing .loc_img img,
  .loc_landing .loc_img picture img {
    object-position: var(--loc-img-pos-tablet, var(--loc-img-pos-desktop, 10% 100%));
  }
}

@media only screen and (max-width: 699px) {
  .loc_landing .loc_txt_ttl h1 {
    font-size: var(
      --loc-h1-size-mobile,
      var(--loc-h1-size-tablet, calc(34px + 1dvh))
    );
    line-height: 1.18;
  }

  .loc_landing .loc_txt_btm p {
    font-size: var(
      --loc-tagline-size-mobile,
      var(--loc-tagline-size-tablet, var(--font-h3))
    );
  }

  .loc_landing .loc_img img,
  .loc_landing .loc_img picture img {
    object-position: var(
      --loc-img-pos-mobile,
      var(--loc-img-pos-tablet, var(--loc-img-pos-desktop, 10% 100%))
    );
  }
}

@media only screen and (min-width: 1024px) {
  .loc_landing .loc_img img,
  .loc_landing .loc_img picture img {
    object-position: var(--loc-img-pos-desktop, center);
  }
}

/* —— Heading alignment: left | center | right | justify (per breakpoint) —— */
@media only screen and (min-width: 1024px) {
  .loc_landing.loc_hero-align-desktop-left .loc_ttl,
  .loc_landing.loc_hero-align-desktop-left .loc_txt_ttl,
  .loc_landing.loc_hero-align-desktop-left .loc_txt_btm,
  .loc_landing.loc_hero-align-desktop-left .loc_txt_p {
    text-align: left;
  }

  .loc_landing.loc_hero-align-desktop-left .loc_txt_btm,
  .loc_landing.loc_hero-align-desktop-left .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .loc_landing.loc_hero-align-desktop-center .loc_ttl,
  .loc_landing.loc_hero-align-desktop-center .loc_txt_ttl,
  .loc_landing.loc_hero-align-desktop-center .loc_txt_btm,
  .loc_landing.loc_hero-align-desktop-center .loc_txt_p {
    text-align: center;
  }

  .loc_landing.loc_hero-align-desktop-center .loc_txt_btm,
  .loc_landing.loc_hero-align-desktop-center .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .loc_landing.loc_hero-align-desktop-right .loc_ttl,
  .loc_landing.loc_hero-align-desktop-right .loc_txt_ttl,
  .loc_landing.loc_hero-align-desktop-right .loc_txt_btm,
  .loc_landing.loc_hero-align-desktop-right .loc_txt_p {
    text-align: right;
  }

  .loc_landing.loc_hero-align-desktop-right .loc_txt_btm,
  .loc_landing.loc_hero-align-desktop-right .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }

  .loc_landing.loc_hero-align-desktop-justify .loc_ttl,
  .loc_landing.loc_hero-align-desktop-justify .loc_txt_ttl,
  .loc_landing.loc_hero-align-desktop-justify .loc_txt_btm,
  .loc_landing.loc_hero-align-desktop-justify .loc_txt_p {
    text-align: justify;
  }

  .loc_landing.loc_hero-align-desktop-justify .loc_txt_btm {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
  }

  .loc_landing.loc_hero-align-desktop-justify .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

@media only screen and (max-width: 1023px) {
  .loc_landing.loc_hero-align-tablet-left .loc_ttl,
  .loc_landing.loc_hero-align-tablet-left .loc_txt_ttl,
  .loc_landing.loc_hero-align-tablet-left .loc_txt_btm,
  .loc_landing.loc_hero-align-tablet-left .loc_txt_p {
    text-align: left;
  }

  .loc_landing.loc_hero-align-tablet-left .loc_txt_btm,
  .loc_landing.loc_hero-align-tablet-left .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .loc_landing.loc_hero-align-tablet-center .loc_ttl,
  .loc_landing.loc_hero-align-tablet-center .loc_txt_ttl,
  .loc_landing.loc_hero-align-tablet-center .loc_txt_btm,
  .loc_landing.loc_hero-align-tablet-center .loc_txt_p {
    text-align: center;
  }

  .loc_landing.loc_hero-align-tablet-center .loc_txt_btm,
  .loc_landing.loc_hero-align-tablet-center .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .loc_landing.loc_hero-align-tablet-right .loc_ttl,
  .loc_landing.loc_hero-align-tablet-right .loc_txt_ttl,
  .loc_landing.loc_hero-align-tablet-right .loc_txt_btm,
  .loc_landing.loc_hero-align-tablet-right .loc_txt_p {
    text-align: right;
  }

  .loc_landing.loc_hero-align-tablet-right .loc_txt_btm,
  .loc_landing.loc_hero-align-tablet-right .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
  }

  .loc_landing.loc_hero-align-tablet-justify .loc_ttl,
  .loc_landing.loc_hero-align-tablet-justify .loc_txt_ttl,
  .loc_landing.loc_hero-align-tablet-justify .loc_txt_btm,
  .loc_landing.loc_hero-align-tablet-justify .loc_txt_p {
    text-align: justify;
  }

  .loc_landing.loc_hero-align-tablet-justify .loc_txt_btm {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
  }
}

@media only screen and (max-width: 699px) {
  .loc_landing.loc_hero-align-mobile-left .loc_ttl,
  .loc_landing.loc_hero-align-mobile-left .loc_txt_ttl,
  .loc_landing.loc_hero-align-mobile-left .loc_txt_btm,
  .loc_landing.loc_hero-align-mobile-left .loc_txt_p {
    text-align: left;
  }

  .loc_landing.loc_hero-align-mobile-left .loc_txt_btm,
  .loc_landing.loc_hero-align-mobile-left .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  .loc_landing.loc_hero-align-mobile-center .loc_ttl,
  .loc_landing.loc_hero-align-mobile-center .loc_txt_ttl,
  .loc_landing.loc_hero-align-mobile-center .loc_txt_btm,
  .loc_landing.loc_hero-align-mobile-center .loc_txt_p {
    text-align: center;
  }

  .loc_landing.loc_hero-align-mobile-center .loc_txt_btm,
  .loc_landing.loc_hero-align-mobile-center .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .loc_landing.loc_hero-align-mobile-right .loc_ttl,
  .loc_landing.loc_hero-align-mobile-right .loc_txt_ttl,
  .loc_landing.loc_hero-align-mobile-right .loc_txt_btm,
  .loc_landing.loc_hero-align-mobile-right .loc_txt_p {
    text-align: right;
  }

  .loc_landing.loc_hero-align-mobile-right .loc_txt_btm,
  .loc_landing.loc_hero-align-mobile-right .loc_txt_btm > div:not(.loc_txt_p) {
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
  }

  .loc_landing.loc_hero-align-mobile-justify .loc_ttl,
  .loc_landing.loc_hero-align-mobile-justify .loc_txt_ttl,
  .loc_landing.loc_hero-align-mobile-justify .loc_txt_btm,
  .loc_landing.loc_hero-align-mobile-justify .loc_txt_p {
    text-align: justify;
  }

  .loc_landing.loc_hero-align-mobile-justify .loc_txt_btm {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
  }
}

/* —— Picture element —— */
.loc_landing .loc_img picture,
.loc_landing .loc_img picture img {
  display: block;
  width: 100%;
  height: 100%;
}

/* —— Background image mode —— */
.loc_landing.loc_hero--bg .loc_img--bg {
  background-image: var(--loc-bg-image-desktop, none);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: var(--loc-img-pos-desktop, center);
}

@media only screen and (max-width: 1023px) {
  .loc_landing.loc_hero--bg .loc_img--bg {
    background-image: var(--loc-bg-image-tablet, var(--loc-bg-image-desktop, none));
    background-position: var(
      --loc-img-pos-tablet,
      var(--loc-img-pos-desktop, 10% 100%)
    );
  }
}

@media only screen and (max-width: 699px) {
  .loc_landing.loc_hero--bg .loc_img--bg {
    background-image: var(
      --loc-bg-image-mobile,
      var(--loc-bg-image-tablet, var(--loc-bg-image-desktop, none))
    );
    background-position: var(
      --loc-img-pos-mobile,
      var(--loc-img-pos-tablet, var(--loc-img-pos-desktop, 10% 100%))
    );
  }
}