/* ArtPlus v22: subpage rhythm, editable showreel loop and footer typography. */

/* Text-only subpage heroes use the page width instead of an empty media column. */
body:not(.home) .apb-hero.home-hero.apb-hero--text {
  min-height: clamp(400px, 56svh, 620px);
  padding-top: clamp(70px, 8vw, 120px);
  padding-bottom: clamp(70px, 8vw, 120px);
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: center;
}

body:not(.home) .apb-hero--text .home-hero-copy {
  grid-column: 1 !important;
  justify-self: stretch;
  width: min(1180px, 100%);
  max-width: 1180px;
  margin: 0 auto;
}

/* Caacupe is deliberately condensed, so subpage display lines need more air
   than the homepage's short headings. This fixes both line and glyph overlap. */
body:not(.home) .apb-hero .home-hero-copy h1,
.service-page .page-intro h1,
.case-title h1,
.archive-heading h1 {
  max-width: 1180px;
  font-size: clamp(58px, 5.4vw, 96px);
  line-height: 1.18 !important;
  letter-spacing: .025em !important;
  word-spacing: .08em;
  text-wrap: balance;
}

body:not(.home) .apb-text h2,
body:not(.home) .apb-image-text h2,
.case-content h2,
.case-content h3,
.page-body h2,
.page-body h3 {
  line-height: 1.16 !important;
  letter-spacing: .018em !important;
}

/* Editable animated placeholder inside the existing showreel card. */
body.home .ap-showreel-player-shell {
  position: relative;
  min-width: 0;
  width: 100%;
}

body.home .ap-showreel-player-shell .ap-showreel-player {
  width: 100%;
}

body.home .ap-showreel-preview-video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: screen;
  pointer-events: none;
}

body.home .ap-showreel-player-shell .ap-showreel-shade,
body.home .ap-showreel-player-shell .ap-showreel-play,
body.home .ap-showreel-player-shell .ap-showreel-label {
  z-index: 2;
}

body.home .ap-showreel-motion-toggle {
  position: absolute;
  right: 18px;
  bottom: 18px;
  z-index: 4;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.42);
  border-radius: 999px;
  color: #fff;
  background: rgba(9,14,14,.58);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease, transform .25s var(--ap-ease);
}

body.home .ap-showreel-motion-toggle:hover {
  border-color: var(--ap-v19-orange);
  background: var(--ap-v19-orange);
  transform: translateY(-2px);
}

/* The editable footer may contain a heading block or a large paragraph block.
   Its principal message follows the site's Caacupe display typography. */
.site-footer .footer-tagline,
.site-footer-editable .wp-block-heading,
.site-footer-editable .has-large-font-size,
.site-footer-editable .has-x-large-font-size,
.site-footer-editable .has-huge-font-size,
.site-footer-editable p[style*="font-size"],
.site-footer-editable .wp-block-columns > .wp-block-column:nth-child(2) > p:first-child {
  font-family: var(--ap-display-font) !important;
  font-weight: 400 !important;
  font-synthesis: none;
  line-height: 1.08 !important;
  letter-spacing: .01em !important;
}

@media (max-width: 900px) {
  body:not(.home) .apb-hero.home-hero.apb-hero--text {
    min-height: 0;
    padding: 58px 20px 68px;
  }

  body:not(.home) .apb-hero .home-hero-copy h1,
  .service-page .page-intro h1,
  .case-title h1,
  .archive-heading h1 {
    font-size: clamp(46px, 11.5vw, 66px);
    line-height: 1.2 !important;
  }

  body.home .ap-showreel-motion-toggle {
    right: 12px;
    bottom: 12px;
    min-height: 34px;
    padding: 7px 10px;
    font-size: 9px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.home .ap-showreel-motion-toggle {
    transition: none;
  }
}
