/* Full-width headings and one six-step process, using the homepage's visual language. */
.approach .approach-editorial-hero{padding:56px 0 88px;text-align:left}
.approach .approach-editorial-hero .label{font-size:16px;line-height:1.4;margin-bottom:16px}
.approach .approach-editorial-hero h1{width:100%;max-width:none;font-size:clamp(36px,4.5vw,60px);line-height:1.12;text-wrap:balance;white-space:normal;letter-spacing:-.035em;margin:0}
.approach-editorial-hero>p{font-size:20px;line-height:1.6;color:#6b5f63;max-width:none;margin:30px 0 0}
.approach-photo-pair{display:grid;grid-template-columns:2fr 1fr;gap:24px;align-items:end;margin-top:42px}
.approach-photo-pair figure{height:330px;overflow:hidden;margin:0;background:#eef3f5}
.approach-photo-pair figure:last-child{height:270px;box-shadow:none}
.approach-photo-pair img{width:100%;height:100%;object-fit:cover;object-position:center 50%}
.approach-photo-pair figure:last-child img{object-position:center 40%}
.approach-process{padding-bottom:70px}
.approach-section-intro{margin-bottom:30px}
.approach .approach-section-intro h2{max-width:none;width:100%;font-size:clamp(32px,3.5vw,46px);margin:0}
.approach-section-intro>p{font-size:18px;line-height:1.65;color:#6b5f63;margin:20px 0 0;max-width:none}
.approach-stages{border-top:1px solid #ddcfd5}
.approach-stage{display:grid;grid-template-columns:114px 260px minmax(0,1fr);gap:30px;align-items:center;padding:27px 0;border-bottom:1px solid #e5d9dd}
.stage-marker{display:flex;gap:14px;align-items:center}
.stage-marker>span{font:13px var(--labs-font-mono);color:#8b1e2d}
.approach .stage-marker .service-motion{width:76px;height:76px;margin:0;flex-shrink:0}
.approach-stage h3{font:400 25px/1.3 var(--labs-font-display);letter-spacing:-.025em;margin:0}
.stage-detail p{font-size:17px;line-height:1.7;color:#6b5f63;margin:0}
.assessment-text-link{display:inline-block;margin-top:14px;color:#8b1e2d;text-underline-offset:4px;font-size:15px}
.build-transition{display:flex;gap:25px;align-items:center;background:#f8f2f3;border-left:3px solid #8b1e2d;padding:19px 23px;margin:26px 0 0}
.build-transition>span{font-size:16px;font-weight:500;color:#8b1e2d;white-space:nowrap}
.build-transition p{font-size:14px;color:#6b5f63;line-height:1.6;margin:0}
@media(min-width:1000px){.approach .approach-section-intro h2{white-space:nowrap}}
@media(max-width:1050px){.approach-stage{grid-template-columns:90px 220px minmax(0,1fr);gap:22px}.approach .stage-marker .service-motion{width:58px;height:64px}.stage-marker{gap:8px}.approach-stage h3{font-size:23px}.build-transition{flex-wrap:wrap;gap:8px}}
@media(max-width:750px){.approach .approach-editorial-hero{padding-top:32px;padding-bottom:60px}.approach-editorial-hero>p{font-size:18px}.approach .approach-editorial-hero .label{font-size:15px}.approach-photo-pair{gap:14px;margin-top:26px}.approach-photo-pair figure{height:195px}.approach-photo-pair figure:last-child{height:170px}.approach-stage{grid-template-columns:70px minmax(0,1fr);gap:12px 20px;padding:25px 0;align-items:start}.stage-marker{grid-row:1/3;flex-direction:column;gap:10px;align-items:flex-start}.stage-detail{grid-column:2}.stage-detail p{font-size:16px}.approach-stage h3{font-size:24px}.approach-section-intro>p{font-size:17px}.build-transition{padding:18px;display:block}.build-transition>span{white-space:normal;display:block;margin-bottom:8px}.approach-process{padding-bottom:45px}}

.approach-stage h3 .step-optional{display:block;font:400 15px/1.5 var(--labs-font);letter-spacing:0;color:#6b5f63;margin-top:6px}

/* Approved split hero, with compact text spacing. */
.approach .approach-editorial-hero{display:grid;grid-template-columns:1.1fr 1fr;column-gap:52px;padding-top:64px;padding-bottom:90px;align-items:start;row-gap:0;grid-template-rows:auto auto 1fr}.approach-editorial-hero .label{grid-column:1;margin-bottom:12px}.approach .approach-editorial-hero h1{grid-column:1;font-size:clamp(36px,4vw,56px);text-wrap:pretty}.approach-editorial-hero>p{grid-column:1;font-size:19px;line-height:1.55;margin-top:18px}.approach-photo-pair{grid-column:2;grid-row:1/4;display:block;position:relative;margin:0 0 50px 0}.approach-photo-pair figure:first-child{height:490px}.approach-photo-pair figure:last-child{width:51%;height:210px;position:absolute;right:-20px;bottom:-48px;border:8px solid white}.approach-photo-pair figure:first-child img{object-position:60% center}@media(max-width:750px){.approach .approach-editorial-hero{display:block;padding-top:32px}.approach-photo-pair{margin-top:32px;margin-right:15px}.approach-photo-pair figure:first-child{height:300px}.approach-photo-pair figure:last-child{height:155px}}

/* Center the text within the approved split hero. */
.approach .approach-editorial-hero{text-align:center}

/* Vertically center the copy beside the photographs while keeping text left aligned. */
.approach .approach-editorial-hero{align-items:center;grid-template-rows:auto;text-align:left}
.approach-hero-copy{grid-column:1;grid-row:1}
.approach .approach-hero-copy .label{margin-bottom:12px}
.approach .approach-hero-copy h1{margin:0}
.approach-hero-copy>p{font-size:19px;line-height:1.55;color:#6b5f63;max-width:none;margin:18px 0 0}
.approach .approach-photo-pair{grid-column:2;grid-row:1}
@media(max-width:750px){.approach-hero-copy>p{font-size:18px}}

/* Slightly reduce both photographs while preserving the split composition. */
.approach .approach-photo-pair{width:94%;justify-self:center}
.approach .approach-photo-pair figure:first-child{height:450px}
.approach .approach-photo-pair figure:last-child{width:49%;height:190px}
@media(max-width:750px){.approach .approach-photo-pair{width:calc(100% - 24px)}.approach .approach-photo-pair figure:first-child{height:280px}.approach .approach-photo-pair figure:last-child{height:140px}}

/* Separate the process from the opening composition and close on adoption. */
.approach .approach-process{border-top:1px solid #ddcfd5;padding-top:48px}
.approach .approach-section-intro h2{font-family:var(--labs-font-display);font-size:clamp(32px,3.5vw,46px);line-height:1.1;font-weight:400;letter-spacing:-.035em}
.approach-outcomes{background:#f8f2f3;padding:60px 0 66px}
.approach-outcomes .label{margin-bottom:18px}
.approach-outcomes h2{max-width:none;font-size:clamp(30px,3.4vw,46px);line-height:1.15}
.approach-outcome-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px;margin-top:38px}
.approach-outcome-grid article{border-top:1px solid #d8c8cd;padding-top:19px}
.outcome-number{display:block;font:13px var(--labs-font-mono);color:#8b1e2d;margin-bottom:17px}
.approach-outcome-grid h3{font-size:21px;line-height:1.3;margin:0 0 13px}
.approach-outcome-grid p{font-size:17px;line-height:1.65;color:#6b5f63;margin:0}
@media(max-width:750px){.approach .approach-process{padding-top:32px}.approach .approach-section-intro h2{font-size:32px}.approach-outcomes{padding:42px 0}.approach-outcome-grid{grid-template-columns:1fr;gap:28px;margin-top:28px}}

/* Decision criteria and practical questions close the approach page. */
.approach-evaluation{background:#f8f2f3;padding:62px 0 68px}
.approach-evaluation h2,.approach-faq h2{font-size:clamp(30px,3.4vw,46px);line-height:1.15;max-width:none}
.evaluation-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:34px;margin-top:35px}
.evaluation-icon{display:block;width:80px;height:80px;margin-bottom:18px;overflow:visible}
.evaluation-grid h3{font-size:21px;line-height:1.3;margin:0 0 14px}
.evaluation-grid p{font-size:17px;line-height:1.65;color:#6b5f63;margin:0}
.eval-check{stroke-dasharray:36;animation:evalCheck 6s ease-in-out infinite}
.eval-packet{animation:evalPacket 4s ease-in-out infinite}
.eval-bar{animation:evalColor 5s ease-in-out infinite}
.eval-node{animation:evalColor 5s ease-in-out infinite}.eval-node-late{animation-delay:2.5s}
@keyframes evalCheck{0%,100%{stroke-dashoffset:36}35%,80%{stroke-dashoffset:0}}
@keyframes evalPacket{0%,100%{transform:translateX(0)}50%{transform:translateX(10px)}}
@keyframes evalColor{0%,100%{stroke:#939495;fill:transparent}50%{stroke:#8b1e2d;fill:#eed6dc}}
.approach-faq{padding-top:64px;padding-bottom:70px;display:grid;grid-template-columns:1fr 1.5fr;gap:64px}
.approach-faq details:first-child{padding-top:0}.approach-faq summary{font-size:19px}.approach-faq details p{font-size:17px;color:#6b5f63;line-height:1.65}
@media(max-width:1000px){.evaluation-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}}
@media(max-width:750px){.approach-evaluation{padding:42px 0}.approach-faq{display:block;padding-top:42px;padding-bottom:45px}.approach-faq-items{margin-top:28px}}
@media(max-width:480px){.evaluation-grid{grid-template-columns:1fr}.evaluation-icon{width:66px;height:66px;margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){.evaluation-icon *{animation:none!important}.eval-check{stroke-dashoffset:0}}

/* Give each criterion a clear question and a quieter explanation. */
.evaluation-icon{width:90px;height:90px;margin-bottom:22px}
.evaluation-grid h3{font-size:19px;margin-bottom:18px;color:#8b1e2d;font-weight:500}
.evaluation-grid .evaluation-question{font-size:20px;line-height:1.4;font-weight:500;color:#251c20;margin:0 0 14px}
.evaluation-grid .evaluation-explanation{font-size:16px;line-height:1.7;font-weight:400;color:#6b5f63}
.eval-balance{transform-origin:45px 30px;animation:evalBalance 7s ease-in-out infinite}
@keyframes evalBalance{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
.eval-system-packet{transform-box:view-box;animation:evalConnection 5s linear infinite}
@keyframes evalConnection{0%{transform:translate(0,0)}16%{transform:translate(20px,0)}20%{transform:translate(25.25px,.75px)}24%{transform:translate(29px,3px)}28%{transform:translate(31.25px,6.75px)}32%{transform:translate(32px,12px)}46%{transform:translate(32px,30px)}72%{transform:translate(-2px,30px)}76%{transform:translate(-7.69px,29.25px)}80%{transform:translate(-11.75px,27px)}84%{transform:translate(-14.19px,23.25px)}88%{transform:translate(-15px,18px)}94%{transform:translate(-15px,0)}100%{transform:translate(0,0)}}
.eval-route{animation:evalRoute 9s ease-in-out infinite}.route-two{animation-delay:3s}.route-three{animation-delay:6s}
@keyframes evalRoute{0%,32%,100%{stroke:#939495}8%,24%{stroke:#8b1e2d}}
@media(prefers-reduced-motion:reduce){.evaluation-icon *{animation:none!important}.eval-system-packet{transform:translate(20px,0);opacity:1}}

.eval-system-source{animation:evalSource 5s linear infinite}
.eval-system-target{animation:evalTarget 5s linear infinite}
@keyframes evalSource{0%,12%,94%,100%{stroke:#8b1e2d;fill:#f3d9de}25%,82%{stroke:#939495;fill:white}}
@keyframes evalTarget{0%,22%,65%,100%{stroke:#939495;fill:white}34%,48%{stroke:#8b1e2d;fill:#f3d9de}}
.eval-balance{transform-box:view-box}
.eval-route{animation-delay:-9s}.route-two{animation-delay:-6s}.route-three{animation-delay:-3s}
@media(prefers-reduced-motion:reduce){.evaluation-icon *{animation:none!important}.eval-system-source,.eval-system-target{stroke:#8b1e2d;fill:#f8f2f3}}

/* Use the blush band for the process and white for evaluation criteria. */
.approach .approach-process{background:#f8f2f3;border-top:0;padding-top:52px;padding-bottom:60px}
.approach-evaluation{background:white}
@media(max-width:750px){.approach .approach-process{padding-top:36px;padding-bottom:42px}}

/* Highlight the full middle column of the process, not the whole section. */
.approach .approach-process{background:white}
.approach-stages{background:linear-gradient(to right,transparent 0,transparent 129px,#f8f2f3 129px,#f8f2f3 419px,transparent 419px)}
@media(max-width:1050px){.approach-stages{background:linear-gradient(to right,transparent 0,transparent 101px,#f8f2f3 101px,#f8f2f3 343px,transparent 343px)}}
@media(max-width:750px){.approach-stages{background:none}.approach-stage h3{background:#f8f2f3;padding:12px 14px;margin:-12px -14px 0}}

/* Align the hero/process divider with the page content. */
.approach .approach-process{position:relative}
.approach .approach-process::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:min(1220px,90%);height:1px;background:#ddcfd5}

.approach-faq h2{color:#8b1e2d}

.approach-faq-band{background:#8b1e2d;color:white}
.approach-faq-band .approach-faq h2,.approach-faq-band summary{color:white}
.approach-faq-band .approach-faq details p{color:#f5e8ec}
.approach-faq-band details{border-color:rgba(255,255,255,.28)}
.approach-faq-band summary:focus-visible{outline:2px solid white;outline-offset:6px}
