/**
 * Approach page — Production Revision (approved architectural images)
 * Scoped: body.approach · load LAST on approach.html (after approach-phase5.css)
 *
 * Wires the approved image assets into the existing composition and retires
 * the competing CSS-only geometry so the photographs read as the structural
 * imagery. Structure, copy and section order are unchanged — image treatment,
 * targeted density/contrast and motion refinements only.
 */

/* =========================================================================
   HERO — Diamond Geometry image · right edge bleed · ~15% shorter
   ========================================================================= */
body.approach .ap-hero-inner{
  padding-top:clamp(20px,3.4vw,38px);
  padding-bottom:clamp(15px,2.5vw,29px);
}

body.approach .ap-hero-visual .ap-arch__crop{
  background-image:var(--bh-img-1);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:74% 36%;
  border-color:rgba(17,17,17,0.12);
}

/* let the photograph carry the geometry — retire the CSS mesh/facets */
body.approach .ap-hero-visual .ap-arch__mesh,
body.approach .ap-hero-visual .ap-arch__engineered,
body.approach .ap-hero-visual .ap-arch__facets,
body.approach .ap-hero-visual .ap-arch__ribs,
body.approach .ap-hero-visual .ap-arch__datum{
  opacity:0;
}

/* soft left veil keeps the image secondary to the headline */
body.approach .ap-hero-visual .ap-arch__crop::after{
  background:linear-gradient(
    90deg,
    var(--bh-bg) 0%,
    var(--bh-bg) 18%,
    rgba(255,255,255,0.5) 42%,
    rgba(255,255,255,0.08) 64%,
    transparent 92%
  );
}

/* =========================================================================
   FRAMEWORK MODULES — ~30% shorter · larger type · tighter internal padding
   ========================================================================= */
body.approach .ap-module{
  padding:var(--bh-space-1) clamp(var(--bh-space-3),2vw,var(--bh-space-4));
}

body.approach .ap-module__head{
  margin-bottom:calc(var(--bh-space-1) - 1px);
  padding-bottom:calc(var(--bh-space-1) - 1px);
}

body.approach .ap-module__id{
  min-width:20px;
  height:20px;
  margin-bottom:2px;
}

body.approach .ap-module__title,
body.approach .ap-module--emphasis .ap-module__title{
  font-size:clamp(1.4375rem,1.6vw,1.5625rem);
  line-height:1.18;
}

body.approach .ap-module__role{
  margin-top:1px;
}

body.approach .ap-module__list li{
  padding-top:calc(var(--bh-space-1) - 1px);
  padding-bottom:calc(var(--bh-space-1) - 1px);
  font-size:clamp(1.3125rem,1.35vw,1.4375rem);
  line-height:1.4;
}

body.approach .ap-module__list li:first-child{
  padding-top:2px;
}

/* =========================================================================
   ENTERPRISE DECOMPOSITION — stronger contrast · higher line visibility
   ========================================================================= */
body.approach .ap-osm{
  border-color:rgba(17,17,17,0.38);
}

body.approach .ap-osm__grid-ref{
  opacity:0.9;
  background-image:
    linear-gradient(to right,rgba(17,17,17,0.2) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(17,17,17,0.2) 1px,transparent 1px);
}

body.approach .ap-osm__node{
  border-color:rgba(17,17,17,0.42);
}

body.approach .ap-osm__node--outcome{
  border-color:rgba(17,17,17,0.5);
  border-left-width:3px;
}

body.approach .ap-osm__node--driver{
  border-top-width:3px;
  border-top-color:rgba(17,17,17,0.34);
}

body.approach .ap-osm__stem{
  width:3px;
  background:linear-gradient(180deg,rgba(17,17,17,0.95) 0%,rgba(17,17,17,0.62) 100%);
}

body.approach .ap-osm__joint{
  width:9px;
  height:9px;
  box-shadow:0 0 0 2px rgba(34,162,159,0.28);
}

body.approach .ap-osm__joint--wide{
  height:3px;
  background:linear-gradient(90deg,transparent 0%,rgba(17,17,17,0.9) 5%,rgba(17,17,17,0.9) 95%,transparent 100%);
}

body.approach .ap-osm__fan-leg{
  width:3px;
  height:26px;
  background:linear-gradient(180deg,rgba(17,17,17,0.92),rgba(17,17,17,0.5));
}

body.approach .ap-osm__baseline{
  background:rgba(17,17,17,0.42);
}

body.approach .ap-osm__baseline-teal{
  background:linear-gradient(90deg,var(--ap-teal) 0%,rgba(34,162,159,0.7) 100%);
}

body.approach .ap-diag-rail__line{
  background:linear-gradient(180deg,rgba(17,17,17,0.5),rgba(17,17,17,0.2));
}

/* =========================================================================
   DARK TRANSITION — Dark Architectural Texture image · higher contrast
   ========================================================================= */
body.approach .ap-anchor__texture{
  opacity:0.9;
  background-image:
    linear-gradient(104deg, rgba(6,6,6,0.92) 0%, rgba(6,6,6,0.5) 42%, transparent 76%),
    var(--bh-img-5);
  background-repeat:no-repeat,no-repeat;
  background-size:100% 100%,cover;
  background-position:center,70% 34%;
  filter:grayscale(0.1) contrast(1.24) brightness(1.04);
}

body.approach .ap-anchor__texture::after{
  background:
    radial-gradient(ellipse 72% 58% at 92% 34%,rgba(255,255,255,0.12) 0%,transparent 56%),
    linear-gradient(118deg,transparent 47%,rgba(34,162,159,0.12) 47.4%,transparent 47.8%);
  opacity:0.66;
}

/* =========================================================================
   CAROUSEL (footer intel rotator + section reveal) — slower · opacity only
   ========================================================================= */
body.approach{
  --bh-footer-fade:2000ms;
  --bh-footer-quote-interval:40000ms;
}

@media (prefers-reduced-motion:no-preference){
  body.approach .ap-reveal{
    transform:none;
    transition:opacity 1100ms ease;
  }
  body.approach .ap-reveal.is-visible{
    transform:none;
  }
}

body.approach .bh-footer .bh-footer__quote{
  transform:none;
  transition:opacity var(--bh-footer-fade) ease;
}

body.approach .bh-footer .bh-footer__quote.bh-footer__quote--out{
  transform:none;
}

/* =========================================================================
   FOOTER — reduced spacing · higher text contrast
   ========================================================================= */
body.approach .bh-footer{
  margin-top:clamp(var(--bh-space-3),3.2vw,var(--bh-space-4));
  padding:clamp(var(--bh-space-2),2vw,var(--bh-space-3)) var(--space-section-x)
    clamp(var(--bh-space-2),1.8vw,var(--bh-space-3));
}

body.approach .bh-footer__grid{
  gap:clamp(var(--bh-space-2),1.8vw,var(--bh-space-4));
}

body.approach .bh-footer .bh-footer__nav{
  padding:var(--bh-space-2) clamp(var(--bh-space-3),3vw,var(--bh-space-5));
}

body.approach .bh-footer__tagline,
body.approach .bh-footer__systems{
  color:rgba(255,255,255,0.94);
}

body.approach .bh-footer__links a{
  color:#fff;
}

body.approach .bh-footer__quote{
  color:#fff;
}

body.approach .bh-footer__copy{
  color:rgba(255,255,255,0.74);
}

body.approach .bh-footer__rule{
  margin-top:clamp(var(--bh-space-2),1.8vw,var(--bh-space-3));
}