/* Direction 2: Clarity. Light and calm; the logo's circle and triangles become picture frames. */
@font-face{font-family:"Plus Jakarta Sans";font-weight:200 800;font-display:swap;src:url(/assets/fonts/plus-jakarta-sans-latin-wght-normal.woff2) format("woff2")}
:root{
  --font-head:"Plus Jakarta Sans",system-ui,sans-serif;--font-body:"Plus Jakarta Sans",system-ui,sans-serif;--head-weight:750;--head-track:-.03em;
  --bg:#FFFFFF;--surface:#FFFFFF;--surface-2:#F2F5F8;--line:#E2E8EE;
  --text:#1E2A34;--muted:#566674;--head-color:#16212A;
  --accent:#FF5723;--accent-hover:#E8481A;--accent-ink:#fff;--accent-text:#C83C10;--link:#C83C10;--accent-soft:#FFEDE6;
  --head-bg:rgba(255,255,255,.88);--head-text:#1E2A34;--head-line:#EDF1F4;
  --band-alt:#F2F5F8;--hero-bg:#F2F5F8;--hero-text:#1E2A34;--hero-muted:#566674;
  --cta-bg:#1E2A34;--cta-text:#fff;--foot-bg:#16212A;--foot-text:#AAB7C2;
  --radius:22px;--radius-sm:12px;--radius-btn:999px;
}
body{font-size:1.05rem}
.btn-primary{background:#1E2A34;color:#fff;box-shadow:0 12px 26px -14px rgba(30,42,52,.7)}.btn-primary:hover{background:#FF5723}
.cta-band .btn-primary{background:#FF5723;color:#16212A}.cta-band .btn-primary:hover{background:#fff}
.b-ico{background:#1E2A34}
.page-hero{position:relative;overflow:hidden}
.page-hero::after{content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border-radius:50%;background:var(--accent);opacity:.9}
.page-hero.has-image::after{display:none}
.page-hero .wrap{position:relative;z-index:1}
.page-hero-img img{clip-path:circle(48% at 50% 50%);aspect-ratio:1/1;border-radius:0}
.why{border-left:0;border-radius:var(--radius);background:var(--surface-2)}
.svc-card{border-color:transparent;background:var(--surface-2)}.svc-card:hover{background:#fff}

/* hero */
.cl-hero{padding:clamp(2.5rem,6vw,5rem) 0 clamp(3rem,7vw,6rem);overflow:hidden}
.cl-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.cl-copy h1{font-size:clamp(2.9rem,6.4vw,5.4rem);line-height:1;letter-spacing:-.045em;font-weight:800;max-width:9ch;margin-bottom:1.5rem}
.cl-copy .lede{font-size:1.2rem;max-width:33rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin:2rem 0 2.6rem}
.cl-facts{list-style:none;display:flex;flex-wrap:wrap;gap:1.2rem 2.4rem;margin:0;padding:1.6rem 0 0;border-top:1px solid var(--line)}
.cl-facts li{color:var(--muted);font-size:.92rem;max-width:11rem;line-height:1.35}
.cl-facts b{display:block;font-size:1.9rem;color:#16212A;letter-spacing:-.03em;font-weight:800;margin-bottom:.2rem}
.cl-shapes{position:relative;aspect-ratio:1/1;max-width:560px;width:100%;justify-self:end}
.sh{position:absolute;overflow:hidden}.sh img{width:100%;height:100%;object-fit:cover}
.sh-o{left:0;top:6%;width:62%;aspect-ratio:1;border-radius:50%;background:var(--accent);animation:float 9s ease-in-out infinite}
.sh-o img{object-position:50% 10%;transform:translateY(8%) scale(1.02)}
.sh-v{right:0;top:0;width:44%;aspect-ratio:1/.92;clip-path:polygon(0 0,100% 0,50% 100%);animation:float 11s ease-in-out -3s infinite}
.sh-v img{object-position:60% 50%}
.sh-a{right:4%;bottom:0;width:52%;aspect-ratio:1/.9;clip-path:polygon(50% 0,100% 100%,62% 100%,50% 76%,38% 100%,0 100%);animation:float 10s ease-in-out -6s infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@media (max-width:900px){.cl-hero-grid{grid-template-columns:1fr}.cl-shapes{justify-self:center;max-width:440px;order:-1}}

/* services split */
.cl-split{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,5rem);align-items:start}
.cl-split-head{position:sticky;top:110px}
.cl-list{list-style:none;margin:0;padding:0}
.cl-list a{display:grid;grid-template-columns:auto 1fr;gap:1.2rem;align-items:center;padding:1.3rem 1rem;border-bottom:1px solid var(--line);color:var(--text);text-decoration:none;border-radius:var(--radius-sm);transition:background .2s}
.cl-list li:first-child a{border-top:1px solid var(--line)}
.cl-list b{display:block;font-size:1.15rem;margin-bottom:.15rem;color:#16212A}
.cl-list a>span>span{color:var(--muted);font-size:.97rem}
.cl-list .svc-ico{border-radius:50%;background:var(--surface-2);color:#1E2A34;transition:background .2s,color .2s}
.cl-list a:hover{background:var(--surface-2)}.cl-list a:hover .svc-ico{background:var(--accent);color:#fff}
@media (max-width:900px){.cl-split{grid-template-columns:1fr}.cl-split-head{position:static}}

/* steps */
.cl-how h2{text-align:center;margin-bottom:3rem}
.cl-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;counter-reset:s}
.cl-steps li{text-align:center;padding:0 1rem;counter-increment:s}
.step-shape{display:grid;place-items:center;width:84px;height:84px;margin:0 auto 1.3rem;background:var(--accent-soft);color:var(--accent-text);font-weight:800;font-size:1.4rem}
.step-shape::after{content:counter(s)}
.s1{border-radius:50%}.s2{clip-path:polygon(0 0,100% 0,50% 100%);padding-bottom:28px}.s3{clip-path:polygon(50% 0,100% 100%,0 100%);padding-top:30px}
.cl-steps p{color:var(--muted)}
@media (max-width:760px){.cl-steps{grid-template-columns:1fr}}

/* people */
.cl-people{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,5rem);align-items:center}
.cl-people-img img{aspect-ratio:1;object-fit:cover;width:100%;border-radius:50% 50% 50% 0}
@media (max-width:860px){.cl-people{grid-template-columns:1fr}.cl-people-img{max-width:380px}}

.cl-row-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:2rem}
.cl-row-head a{font-weight:700}
.cl-partners{margin:3.5rem auto 0;text-align:center;color:var(--muted);max-width:60ch}
:root{--btn-ink:#fff}
.cta-band .btn-primary{color:#16212A}
.cl-facts{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:1.2rem 2.4rem}
@media (max-width:480px){.cl-facts{grid-template-columns:1fr 1fr}}
/* four-stage method (borrowed from Direction 3, restyled for Clarity) */
.cl-method-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,5rem);align-items:start}
.cl-method-head{position:sticky;top:110px}
.cl-meter{height:6px;border-radius:999px;background:var(--surface-2);margin:1.8rem 0 2rem;overflow:hidden}
.cl-meter span{display:block;height:100%;width:var(--p,0%);background:var(--accent);border-radius:999px;transition:width .5s}
.cl-stages{list-style:none;margin:0;padding:0}
.cl-stages li{display:grid;grid-template-columns:auto 1fr;gap:1.4rem;padding:2rem 0;border-top:1px solid var(--line);opacity:.35;transition:opacity .5s}
.cl-stages li:last-child{border-bottom:1px solid var(--line)}
.cl-stages li.on{opacity:1}
.st-shape{display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:var(--surface-2);color:#1E2A34;transition:background .4s,color .4s,border-radius .4s}
.st-shape .i{width:26px;height:26px}
.cl-stages li.on .st-shape{background:var(--accent);color:#fff}
.cl-stages h3{font-size:1.5rem;margin-bottom:.35rem}
.cl-stages p{margin:0;color:var(--muted)}
@media (max-width:860px){.cl-method-grid{grid-template-columns:1fr}.cl-method-head{position:static}}