/* Aquatic Bliss Hero Split — homepage hero (direction D8) */
.ab-hs{
  --ab-hs-ink:#111;
  --ab-hs-hover:#2f6b1a;
  --ab-hs-gap:20px;
  --ab-hs-pad:24px;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  height:calc(100svh - var(--abx-header-offset,0px));
  min-height:620px;
  padding-top:var(--abx-header-height,79px);
  background:#fff;
  color:var(--ab-hs-ink);
  font-family:"AB Mona Sans",system-ui,sans-serif;
}
.ab-hs *,.ab-hs *::before,.ab-hs *::after{box-sizing:border-box}
.ab-hs ::selection{background:var(--ab-hs-ink);color:#fff}

.ab-hs__left{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  gap:36px;
  padding:26px var(--ab-hs-pad) var(--ab-hs-pad);
  border-right:1px solid var(--ab-hs-ink);
  min-width:0;
}
.ab-hs .ab-hs__title{
  margin:0;
  font-family:"AB Mona Sans",system-ui,sans-serif;
  font-stretch:75%;
  font-weight:800;
  font-size:clamp(46px,8.6vw,156px);
  line-height:.84;
  letter-spacing:-.01em;
  text-transform:uppercase;
  color:var(--ab-hs-ink);
}
.ab-hs__cta{border-top:1px solid var(--ab-hs-ink);padding-top:22px}
.ab-hs .ab-hs__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:72px;
  padding:0 56px;
  background:radial-gradient(rgb(136,173,53) 44%,rgb(105,137,39) 100%);
  color:#fff;
  font-family:"AB Mona Sans",system-ui,sans-serif;
  font-stretch:90%;
  font-weight:700;
  font-size:22px;
  letter-spacing:.02em;
  text-decoration:none;
  border-radius:999px;
  box-shadow:0 10px 24px -12px rgba(79,109,18,.7);
  transition:filter .2s ease,transform .2s ease;
}
.ab-hs .ab-hs__btn:hover,.ab-hs .ab-hs__btn:focus-visible{filter:brightness(.92);color:#fff;transform:translateY(-1px)}
.ab-hs .ab-hs__btn:focus-visible{outline:2px solid #4f6d12;outline-offset:4px}
.ab-hs .ab-hs__btn-img{
  display:inline-block;
  width:clamp(300px,30vw,480px);
  margin:-6px 0 -10px -8px;
  line-height:0;
  border-radius:999px;
  transition:filter .2s ease,transform .2s ease;
}
.ab-hs .ab-hs__btn-img img{display:block;width:100%;height:auto;max-width:none}
.ab-hs .ab-hs__btn-img:hover,.ab-hs .ab-hs__btn-img:focus-visible{filter:brightness(1.06) saturate(1.05);transform:translateY(-2px)}
.ab-hs .ab-hs__btn-img:focus-visible{outline:2px solid #4f6d12;outline-offset:2px}

.ab-hs__photos{
  min-height:0;
  display:grid;
  grid-template-columns:1.4fr 1fr;
  grid-template-rows:minmax(0,1fr) auto;
  gap:var(--ab-hs-gap);
  padding:18px var(--ab-hs-pad) var(--ab-hs-pad) 20px;
}
.ab-hs .ab-hs__photo{margin:0;min-height:0;overflow:hidden;background:#eef1ec}
.ab-hs__photo--main{grid-column:1/3}
.ab-hs__photo--three{aspect-ratio:1/1}
.ab-hs .ab-hs__img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;transition:transform 1.2s cubic-bezier(.16,1,.3,1)}
.ab-hs__photo:hover .ab-hs__img{transform:scale(1.035)}

@media (max-width:900px){
  .ab-hs{grid-template-columns:1fr;height:auto;min-height:0}
  .ab-hs__left{border-right:0;border-bottom:1px solid var(--ab-hs-ink);gap:24px;padding:20px 16px}
  .ab-hs .ab-hs__title{font-size:clamp(44px,14vw,88px)}
  .ab-hs .ab-hs__btn{width:100%;height:64px;font-size:19px}
  .ab-hs .ab-hs__btn-img{display:block;width:min(100%,380px);margin:-4px auto -8px}
  .ab-hs__photos{gap:10px;padding:14px 16px 16px;grid-template-rows:auto auto}
  .ab-hs__photo--main{height:60vw}
  .ab-hs__photo--two{height:auto}
}
@media (prefers-reduced-motion:reduce){.ab-hs__img,.ab-hs .ab-hs__btn,.ab-hs .ab-hs__btn-img{transition:none}}

/* Halloween spider (Lottie). Desktop: dangles from the rule above the CTA, right of the button.
   Mobile: hangs from the top of the column, which gets extra room above the headline. */
.ab-hs__left{position:relative}
.ab-hs__cta{position:relative}
.ab-hs .ab-hs__spider{
  position:absolute;
  top:-1px;
  right:clamp(0px,2vw,40px);
  height:calc(100% + 18px);
  aspect-ratio:1/1;
  pointer-events:none;
}
.ab-hs__spider svg{display:block}
@media (max-width:900px){
  .ab-hs__cta{position:static}
  .ab-hs:has(.ab-hs__spider) .ab-hs__left{padding-top:calc(20px + 24vw)}
  .ab-hs .ab-hs__spider{top:0;right:4px;height:34vw;max-height:200px}
}