/**
 * Approach page — Phase 5 refinement
 * Hero geometry · OSM clarity · dense modules · anchor texture · footer
 * Scoped: body.approach · load last on approach.html
 */

/* -------------------------------------------------------------------------
   Hero — diamond geometry · stronger definition · right bleed preserved
   ------------------------------------------------------------------------- */
body.approach .ap-hero-visual .ap-arch__mesh{
  opacity:0.84;
}

body.approach .ap-hero-visual .ap-arch__engineered{
  opacity:0.56;
}

body.approach .ap-hero-visual .ap-arch__ribs{
  opacity:0.94;
}

body.approach .ap-hero-visual .ap-arch__datum{
  opacity:0.68;
}

body.approach .ap-hero-visual .ap-arch__facet--1{
  width:50%;
  height:46%;
  top:6%;
  right:-9%;
  clip-path:polygon(50% 0%,100% 36%,86% 100%,14% 100%,0% 36%);
  background:linear-gradient(148deg,#f0eeea 0%,#4a4845 100%);
  border-color:rgba(17,17,17,0.1);
}

body.approach .ap-hero-visual .ap-arch__facet--2{
  width:40%;
  height:40%;
  bottom:10%;
  left:-8%;
  clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);
  background:linear-gradient(22deg,#d8d4ce 0%,#6e6b66 100%);
}

body.approach .ap-hero-visual .ap-arch__facet--3{
  width:38%;
  height:38%;
  top:30%;
  left:26%;
  clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);
  background:linear-gradient(135deg,rgba(34,162,159,0.48) 0%,#2e2e2c 90%);
  border-color:rgba(34,162,159,0.46);
}

body.approach .ap-hero-visual .ap-arch__crop{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.68),
    inset 0 -1px 0 rgba(17,17,17,0.08);
}

body.approach .ap-hero-visual .ap-arch__crop::after{
  background:linear-gradient(
    90deg,
    var(--bh-bg) 0%,
    var(--bh-bg) 14%,
    rgba(255,255,255,0.36) 38%,
    rgba(255,255,255,0.06) 58%,
    transparent 90%
  );
}

/* -------------------------------------------------------------------------
   Enterprise decomposition model — line · grid · hierarchy clarity
   ------------------------------------------------------------------------- */
body.approach .ap-osm{
  border-color:rgba(17,17,17,0.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.98);
}

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

body.approach .ap-osm__head{
  border-bottom-color:rgba(17,17,17,0.22);
}

body.approach .ap-osm__node{
  padding:var(--bh-space-3) var(--bh-space-3);
  border-width:1px;
  border-color:rgba(17,17,17,0.3);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.96);
}

body.approach .ap-osm__node--outcome{
  border-color:rgba(17,17,17,0.38);
  border-left:2px solid var(--bh-accent);
  background:linear-gradient(180deg,#EEEDEA 0%,#E0DED9 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.98),0 1px 0 rgba(17,17,17,0.06);
}

body.approach .ap-osm__node--outcome .ap-osm__lvl{
  color:rgba(17,17,17,0.58);
  font-size:9px;
  letter-spacing:0.16em;
}

body.approach .ap-osm__node--outcome .ap-osm__name{
  font-size:var(--bh-text-md);
  font-weight:600;
  color:var(--bh-ink);
}

body.approach .ap-osm__node--driver{
  border-color:rgba(17,17,17,0.32);
  border-top:2px solid rgba(17,17,17,0.22);
  background:linear-gradient(145deg,rgba(247,247,247,0.98) 0%,rgba(255,255,255,0.92) 100%);
}

body.approach .ap-osm__node--driver .ap-osm__lvl{
  color:rgba(34,162,159,0.88);
  font-size:9px;
}

body.approach .ap-osm__node--driver .ap-osm__name{
  font-weight:600;
  color:var(--bh-ink-2);
}

body.approach .ap-osm__node--sub{
  padding:var(--bh-space-2) var(--bh-space-3);
  border-style:dashed;
  border-color:rgba(17,17,17,0.34);
  background:rgba(255,255,255,0.94);
}

body.approach .ap-osm__node--sub .ap-osm__lvl{
  color:rgba(17,17,17,0.52);
  font-size:8px;
  letter-spacing:0.12em;
}

body.approach .ap-osm__node--sub .ap-osm__name{
  font-size:var(--bh-text-sm);
  font-weight:500;
  color:var(--bh-ink-3);
}

body.approach .ap-osm__lvl{
  font-weight:600;
}

body.approach .ap-osm__name{
  line-height:1.32;
}

body.approach .ap-osm__hint{
  color:var(--bh-ink-3);
  font-size:var(--bh-text-xs);
}

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

body.approach .ap-osm__joint{
  width:7px;
  height:7px;
  background:var(--bh-accent);
  box-shadow:0 0 0 1px rgba(34,162,159,0.25);
}

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

body.approach .ap-osm__fan-leg{
  width:2px;
  height:20px;
  background:linear-gradient(180deg,rgba(17,17,17,0.74),rgba(17,17,17,0.36));
}

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

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

body.approach .ap-diag-rail{
  border-color:rgba(17,17,17,0.22);
}

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

/* -------------------------------------------------------------------------
   Framework modules — ~30% shorter · tighter · larger text · no SaaS cards
   ------------------------------------------------------------------------- */
body.approach .ap-modules{
  gap:clamp(var(--bh-space-3),2.8vw,var(--bh-space-4));
  align-items:start;
}

body.approach .ap-module{
  padding:var(--bh-space-2) clamp(var(--bh-space-3),2.2vw,var(--bh-space-4));
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.96);
  background:linear-gradient(165deg,rgba(255,255,255,0.98) 0%,rgba(247,247,247,0.72) 100%);
}

body.approach .ap-module--emphasis{
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.1);
  background:linear-gradient(155deg,#2a2a2a 0%,#181818 52%,#1e1e1e 100%);
}

body.approach .ap-module__head{
  margin-bottom:var(--bh-space-1);
  padding-bottom:var(--bh-space-1);
  border-bottom-color:rgba(17,17,17,0.14);
}

body.approach .ap-module--emphasis .ap-module__head{
  border-bottom-color:rgba(255,255,255,0.12);
}

body.approach .ap-module__id{
  min-width:22px;
  height:22px;
  margin-bottom:var(--bh-space-1);
  font-size:9px;
}

body.approach .ap-module__title{
  font-size:clamp(1.3125rem,1.45vw,1.4375rem);
  line-height:1.22;
  font-weight:500;
}

body.approach .ap-module--emphasis .ap-module__title{
  font-size:clamp(1.3125rem,1.45vw,1.4375rem);
}

body.approach .ap-module__role{
  margin-top:2px;
  font-size:var(--bh-text-sm);
}

body.approach .ap-module__list li{
  padding:calc(var(--bh-space-1) + 1px) 0 calc(var(--bh-space-1) + 1px) var(--bh-space-3);
  font-size:clamp(1.25rem,1.2vw,1.3125rem);
  line-height:1.48;
  border-top-color:rgba(17,17,17,0.12);
}

body.approach .ap-module__list li:first-child{
  border-top:none;
  padding-top:var(--bh-space-1);
}

body.approach .ap-module__accent{
  width:3px;
}

/* -------------------------------------------------------------------------
   Dark transition — From Visibility to Control
   ------------------------------------------------------------------------- */
body.approach .ap-anchor__texture{
  opacity:0.94;
  background-image:
    repeating-linear-gradient(-11deg,transparent 0,transparent 18px,rgba(255,255,255,0.078) 18px,rgba(255,255,255,0.078) 19px),
    linear-gradient(90deg,rgba(255,255,255,0.085) 1px,transparent 1px),
    repeating-linear-gradient(0deg,transparent 0,transparent 32px,rgba(34,162,159,0.04) 32px,rgba(34,162,159,0.04) 33px);
  background-size:auto,48px 100%,100% 100%;
}

body.approach .ap-anchor__texture::after{
  background:
    radial-gradient(ellipse 72% 58% at 94% 36%,rgba(255,255,255,0.1) 0%,transparent 56%),
    linear-gradient(118deg,transparent 48%,rgba(34,162,159,0.09) 48.4%,transparent 48.8%),
    repeating-linear-gradient(-14deg,transparent 0,transparent 32px,rgba(255,255,255,0.048) 32px,rgba(255,255,255,0.048) 33px);
  opacity:0.72;
}

body.approach .ap-anchor{
  background:
    radial-gradient(88% 75% at 8% 22%,rgba(34,162,159,0.14) 0%,transparent 52%),
    linear-gradient(168deg,#060606 0%,#101010 42%,#040404 100%);
}

body.approach .ap-anchor__grid-mark{
  background:linear-gradient(90deg,var(--bh-accent) 0%,var(--bh-accent) 36%,rgba(255,255,255,0.32) 36%,rgba(255,255,255,0.32) 100%);
}

/* -------------------------------------------------------------------------
   Footer — text contrast · dividers · structural clarity
   ------------------------------------------------------------------------- */
body.approach .bh-footer{
  border-top-color:rgba(255,255,255,0.2);
}

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

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

body.approach .bh-footer .bh-footer__nav{
  border-left-color:rgba(255,255,255,0.2);
  border-right-color:rgba(255,255,255,0.2);
}

body.approach .bh-footer__intel{
  border-left-color:rgba(34,162,159,0.68);
}

body.approach .bh-footer__quote{
  color:rgba(255,255,255,0.96);
}

body.approach .bh-footer__rule::before{
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,0.2) 10%,
    rgba(255,255,255,0.38) 50%,
    rgba(255,255,255,0.2) 90%,
    transparent
  );
}

body.approach .bh-footer__base{
  border-top-color:rgba(255,255,255,0.18);
}

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