/* ---------- Hero ---------- */
.b-hero__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:clamp(24px,3cqi,48px);align-items:center}
.b-hero__text{padding-top:clamp(40px,5.5cqi,80px);padding-bottom:clamp(64px,7.5cqi,112px)}
.b-label{display:flex;align-items:center;gap:12px;margin:0 0 22px;font-size:16px;font-weight:500;line-height:1.6;color:#202526}
.b-label::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:#167D8D}

/* The gathering: loose threads of AI noise drawn into one clear teal line */
.b-art{align-self:stretch;position:relative;min-height:440px;container-type:inline-size}
.b-art svg{position:absolute;top:0;left:0;width:100%;height:100%;display:block}
.b-art__line{position:absolute;left:calc(50% - 1.5px);top:71.43cqi;bottom:0;width:3px;background:#167D8D;transform-origin:top center}
.b-thread{fill:none;stroke:#566361;stroke-width:1.25;stroke-linecap:round}
.b-knot{fill:#167D8D;stroke:#E5EFED;stroke-width:5}

/* ---------- Recognition: the argument as a path from noise to answer ---------- */
.b-recog{padding-top:clamp(80px,8.9cqi,128px);padding-bottom:clamp(88px,9.4cqi,136px)}
.b-recog .b-h2-band{max-width:24ch;color:#FAF9F6}
.b-steps{--b-gap:clamp(32px,4cqi,56px);list-style:none;margin:clamp(48px,5.5cqi,80px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--b-gap)}
.b-step{position:relative;padding-top:44px}
.b-step::before{content:"";position:absolute;left:0;top:0;width:13px;height:13px;border-radius:50%;border:1.5px solid #A9B1AE}
.b-step::after{content:"";position:absolute;top:6px;left:21px;right:calc(var(--b-gap) * -1 + 8px);height:1px;background:#4A5254;transform-origin:left center}
.b-step--answer::before{top:-1px;width:15px;height:15px;border-color:#167D8D;background:#167D8D}
.b-step--answer::after{top:6px;right:0;height:2px;background:#167D8D}
.b-step p{margin:0;max-width:24em;font-size:19px;line-height:1.6;color:#E7E9E6}
.b-step--answer p{color:#FAF9F6;font-weight:500;font-size:clamp(20px,1.6cqi,23px);line-height:1.45}

/* ---------- Split sections: heading left, content right ---------- */
.b-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:clamp(32px,5cqi,72px);align-items:start}
.b-split__head{position:sticky;top:32px}
.b-split__head .b-h2{max-width:12ch}

/* Improvement areas: five branches from one line */
.b-tree{list-style:none;margin:6px 0 0;padding:0}
.b-branch{position:relative;padding:0 0 40px 68px}
.b-branch:last-child{padding-bottom:0}
.b-branch::before{content:"";position:absolute;left:0;top:-6px;width:44px;height:22px;border-left:1px solid #566361;border-bottom:1px solid #566361;border-bottom-left-radius:16px}
.b-branch:first-child::before{top:0;height:16px}
.b-branch::after{content:"";position:absolute;left:0;top:0;bottom:0;border-left:1px solid #566361}
.b-branch:last-child::after{display:none}
.b-branch .b-dot{position:absolute;left:42px;top:11px}
.b-branch h3{margin:0;font-weight:500;font-size:clamp(22px,1.75cqi,25px);line-height:1.25}
.b-branch p{margin:10px 0 0;max-width:32em;font-size:17px;line-height:1.6;color:#566361}

/* ---------- Four ways we help: four stops on one line you can join anywhere ---------- */
.b-services__head .b-h2{max-width:17ch}
.b-line{--b-gap:clamp(24px,3cqi,40px);position:relative;list-style:none;margin:clamp(56px,6cqi,88px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--b-gap)}
.b-line::before{content:"";position:absolute;top:7px;height:2px;left:calc((100% - 100cqi) / 2);right:calc((100% - 100cqi) / 2);background:#167D8D;transform-origin:left center}
.b-stop{position:relative;padding-top:44px}
.b-stop::before{content:"";position:absolute;left:0;top:0;width:16px;height:16px;border-radius:50%;background:#E5EFED;border:2px solid #167D8D}
.b-stop h3{margin:0;font-size:21px;font-weight:500;line-height:1.25}
.b-stop h3 a{color:#202526;text-decoration:none;text-underline-offset:5px}
.b-stop h3 a:hover{text-decoration:underline;text-decoration-thickness:1px}
.b-stop__body{margin:14px 0 0;font-size:17px;line-height:1.6;color:#3B4446}

.b-routes{margin-top:clamp(56px,6cqi,88px);background:#FAF9F6;border-radius:4px;padding:clamp(24px,3cqi,40px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:clamp(20px,3cqi,40px);align-items:start}
.b-route{position:relative;padding-left:22px}
.b-route .b-dot{position:absolute;left:0;top:9px;width:8px;height:8px}
.b-route p{margin:0;font-size:17px;line-height:1.5}
.b-route strong{display:block;margin-bottom:4px;font-weight:500;font-size:19px}
.b-routes .b-link{align-self:center;white-space:nowrap}

/* ---------- What we commit to: each promise is a stop on a line ---------- */
.b-commit__grid{list-style:none;margin:clamp(40px,4.5cqi,64px) 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(32px,5cqi,72px)}
.b-commit{position:relative;padding:28px 0 40px;border-top:1px solid #CCD5D2}
.b-commit .b-dot{position:absolute;left:0;top:-5px;width:9px;height:9px}
.b-commit h3{margin:0;font-size:20px;font-weight:500;line-height:1.3}
.b-commit p{margin:10px 0 0;max-width:30em;font-size:17px;line-height:1.6;color:#566361}

.b-commit-section{padding-bottom:clamp(40px,4.4cqi,64px)}

/* ---------- Questions: the system's accordion ---------- */
.b-faq-section .b-wrap > .b-split{border-top:1px solid #CCD5D2;padding-top:clamp(64px,7cqi,104px)}
.b-faq-section{padding-top:0}
.b-faq details{border-top:1px solid #CCD5D2}
.b-faq details:last-child{border-bottom:1px solid #CCD5D2}
.b-faq summary{cursor:pointer;list-style:none;position:relative;padding:20px 48px 20px 0;font-weight:500;font-size:20px;line-height:1.35;color:#202526;border-radius:2px}
.b-faq summary::-webkit-details-marker{display:none}
.b-faq summary::after{content:"";position:absolute;right:8px;top:26px;width:11px;height:11px;border-right:2px solid #167D8D;border-bottom:2px solid #167D8D;transform:rotate(45deg);transition:transform 200ms ease,top 200ms ease}
.b-faq details[open] summary::after{transform:rotate(225deg);top:32px}
.b-faq summary:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.b-faq details p{margin:0;max-width:36em;padding:0 48px 24px 0;font-size:18px;line-height:1.6;color:#566361}

@container bpage (max-width:900px){
  .b-hero__grid{grid-template-columns:minmax(0,1fr)}
  .b-art{order:-1;min-height:0;height:clamp(220px,52cqi,360px);margin-top:8px}
  .b-art__line{top:64.52%}
  .b-hero__text{padding-top:24px}
  .b-split{grid-template-columns:minmax(0,1fr);row-gap:40px}
  .b-split__head{position:static}
  .b-line{grid-template-columns:minmax(0,1fr);row-gap:40px}
  .b-line::before{top:-28px;bottom:-28px;left:7px;right:auto;width:2px;height:auto;transform-origin:top center}
  .b-stop{padding-top:0;padding-left:44px}
  .b-stop::before{top:3px}
  .b-routes{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@container bpage (max-width:820px){
  .b-steps{grid-template-columns:minmax(0,1fr);row-gap:36px}
  .b-step{padding-top:0;padding-left:40px}
  .b-step::before{top:6px}
  .b-step::after{top:27px;left:6px;right:auto;width:1px;height:auto;bottom:-34px}
  .b-step--answer::before{top:5px}
  .b-step--answer::after{display:none}
  .b-commit__grid{grid-template-columns:minmax(0,1fr)}
}
@container bpage (max-width:600px){
  .b-branch{padding-left:56px}
  .b-branch::before{width:34px}
  .b-branch .b-dot{left:32px}
  .b-routes{grid-template-columns:minmax(0,1fr)}
  .b-routes .b-link{justify-self:start}
  .b-faq summary{font-size:19px}
  .b-faq details p{padding-right:0;font-size:17px}
}

@media (prefers-reduced-motion:no-preference){
  .b-thread{stroke-dasharray:1;animation:b-trace 1100ms cubic-bezier(.3,.6,.2,1) both}
  .b-thread:nth-child(2){animation-delay:60ms}.b-thread:nth-child(3){animation-delay:120ms}.b-thread:nth-child(4){animation-delay:180ms}
  .b-thread:nth-child(5){animation-delay:240ms}.b-thread:nth-child(6){animation-delay:300ms}.b-thread:nth-child(7){animation-delay:360ms}
  .b-thread:nth-child(8){animation-delay:420ms}.b-thread:nth-child(9){animation-delay:90ms}.b-thread:nth-child(10){animation-delay:210ms}
  .b-knot{transform-box:fill-box;transform-origin:center;animation:b-pop 320ms cubic-bezier(.3,1.4,.5,1) 1250ms both}
  .b-art__line{animation:b-draw-y 700ms cubic-bezier(.2,.7,.2,1) 1450ms both}
  .b-faq details::details-content{height:0;overflow:clip;transition:height 200ms ease,content-visibility 200ms allow-discrete}
  .b-faq details[open]::details-content{height:auto}
  .b-faq{interpolate-size:allow-keywords}
  @supports (animation-timeline:view()){
    .b-step::after{animation:b-draw-x linear both;animation-timeline:view();animation-range:entry 20% cover 50%}
    .b-line::before{animation:b-draw-x linear both;animation-timeline:view();animation-range:entry 10% cover 40%}
  }
}
@container bpage (max-width:900px){
  @media (prefers-reduced-motion:no-preference){
    @supports (animation-timeline:view()){
      .b-line::before{animation-name:b-draw-y}
    }
  }
}