/* About page (SA Coder) — prefix .ab-  */
.ab{background:var(--bg);color:var(--ink);overflow-x:clip}
.ab *{box-sizing:border-box}
.ab h1,.ab h2,.ab h3{font-family:var(--f-head);letter-spacing:-.03em;margin:0}
.ab em{font-style:normal;color:var(--accent)}
.ab-kicker{display:inline-flex;align-items:center;gap:10px;font:600 11px/1.2 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-deep);margin:0 0 18px}
.ab-kicker:before{content:"";width:24px;height:2px;background:var(--accent)}

/* ---------- HERO ---------- */
.ab-hero{position:relative;isolation:isolate;overflow:hidden;padding:clamp(124px,14vw,172px) 0 clamp(56px,7vw,100px)}
.ab-hero__glow{position:absolute;inset:0;z-index:-1;pointer-events:none}
.ab-hero__glow span{position:absolute;border-radius:50%;filter:blur(80px);opacity:.42}
.ab-hero__glow span:first-child{width:620px;height:620px;right:-180px;top:-220px;background:radial-gradient(circle,#E5252A,transparent 70%)}
.ab-hero__glow span:last-child{width:440px;height:440px;left:8%;bottom:-290px;background:radial-gradient(circle,#FF7A59,transparent 70%)}
.ab-hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,5vw,72px);align-items:center}
.ab-hero h1{font-size:clamp(2.8rem,5.6vw,5.4rem);line-height:.99;font-weight:700;max-width:12ch}
.ab-hero__lead{margin:24px 0 32px;max-width:50ch;color:var(--ink-soft);font-size:clamp(1rem,1.25vw,1.15rem);line-height:1.7}
.ab-hero__actions{display:flex;flex-wrap:wrap;gap:12px}

.ab-badge{position:relative;justify-self:center;width:min(82vw,430px);aspect-ratio:1;display:grid;place-items:center}
.ab-badge__text{position:absolute;inset:0;width:100%;height:100%;animation:abSpin 32s linear infinite}
.ab-badge__text text{font:600 10.5px var(--f-mono);letter-spacing:.2em;fill:var(--ink);text-transform:uppercase}
.ab-badge__ring{position:absolute;inset:17%;border-radius:50%;border:1px dashed rgba(229,37,42,.45);animation:abSpin 48s linear infinite reverse}
.ab-badge__ring b{position:absolute;left:50%;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--accent);box-shadow:0 0 26px 5px rgba(229,37,42,.55)}
.ab-badge__core{position:relative;width:46%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;text-align:center;color:#fff;background:radial-gradient(circle at 34% 28%,var(--coral),var(--accent) 58%,#5c0a0e);box-shadow:0 30px 70px -20px rgba(229,37,42,.7),inset 0 0 36px rgba(255,255,255,.2)}
.ab-badge__core strong{display:block;font:800 clamp(2rem,4.4vw,3.4rem)/1 var(--f-head);letter-spacing:-.04em}
.ab-badge__core span{display:block;margin-top:6px;font:500 10px/1.3 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;opacity:.9}
.ab-chip{position:absolute;display:inline-flex;align-items:center;gap:8px;padding:9px 14px 9px 10px;border-radius:99px;font:700 13px/1 var(--f-body);color:var(--ink);background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow);animation:abFloat 5.5s ease-in-out infinite}
.ab-chip i{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--coral));color:#fff}
.ab-chip .ico{width:14px;height:14px}
.ab-chip--1{left:-2%;top:16%}
.ab-chip--2{right:-2%;top:38%;animation-delay:-1.8s}
.ab-chip--3{left:8%;bottom:8%;animation-delay:-3.4s}
@keyframes abSpin{to{transform:rotate(360deg)}}
@keyframes abFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* ---------- STATEMENT (words light up on scroll) ---------- */
.ab-statement{padding:clamp(40px,6vw,90px) 0 clamp(72px,10vw,140px)}
.ab-statement__text{font:700 clamp(1.9rem,4.4vw,3.9rem)/1.1 var(--f-head);letter-spacing:-.035em;max-width:24ch;margin:0}
.ab-statement__text .ab-w{display:inline-block;opacity:.16;transition:opacity .2s}
.ab-statement__text .ab-w.is-hl{color:var(--accent)}
.ab-statement__foot{margin-top:clamp(28px,4vw,48px);display:flex;flex-wrap:wrap;gap:10px}
.ab-pill{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:99px;border:1px solid var(--line);background:#fff;font-weight:700;font-size:14px}
.ab-pill .ico{width:16px;height:16px;color:var(--accent)}

/* ---------- PRINCIPLES ---------- */
.ab-values{padding:0 0 clamp(72px,10vw,140px)}
.ab-head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,64px);align-items:end;margin-bottom:clamp(32px,4vw,56px)}
.ab-head h2{font-size:clamp(2.2rem,4.6vw,4rem);line-height:1.02;font-weight:700}
.ab-head p{margin:0;color:var(--muted);line-height:1.7;max-width:46ch;font-size:1.05rem}
.ab-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.ab-card{position:relative;padding:clamp(26px,3vw,40px);border-radius:var(--r-lg,32px);background:#fff;border:1px solid var(--line);box-shadow:0 30px 70px -48px rgba(120,20,25,.5);transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .3s,box-shadow .4s}
.ab-card:nth-child(even){margin-top:clamp(0px,5vw,64px)}
.ab-card:hover{transform:translateY(-8px);border-color:rgba(229,37,42,.4);box-shadow:0 40px 80px -44px rgba(229,37,42,.5)}
.ab-card--dark{background:var(--dark);color:#F6F4F1;border-color:rgba(246,244,241,.12)}
.ab-card--red{background:linear-gradient(140deg,var(--accent-deep),var(--accent) 60%,var(--coral));color:#fff;border-color:transparent}
.ab-card__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(36px,5vw,70px)}
.ab-card__n{font:600 12px/1 var(--f-mono);letter-spacing:.14em;color:var(--accent-deep)}
.ab-card--dark .ab-card__n{color:var(--coral)}.ab-card--red .ab-card__n{color:#fff}
.ab-card__ic{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),var(--coral));box-shadow:0 12px 26px -10px rgba(229,37,42,.8)}
.ab-card--red .ab-card__ic{background:rgba(255,255,255,.2);box-shadow:none}
.ab-card__ic .ico{width:24px;height:24px}
.ab-card h3{font-size:clamp(1.6rem,2.6vw,2.2rem);line-height:1.08;margin-bottom:12px;font-weight:700}
.ab-card p{margin:0;color:var(--muted);line-height:1.7;max-width:40ch}
.ab-card--dark p{color:rgba(246,244,241,.7)}.ab-card--red p{color:rgba(255,255,255,.88)}

/* ---------- TOOLS ORBIT ---------- */
.ab-tools{position:relative;isolation:isolate;overflow:hidden;background:var(--dark);color:#F6F4F1;border-radius:var(--r-lg,32px);padding:clamp(72px,9vw,130px) 0}
.ab-tools:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(52% 60% at 80% 50%,rgba(229,37,42,.3),transparent 70%),radial-gradient(34% 40% at 4% 0%,rgba(255,122,89,.14),transparent 70%)}
.ab-tools__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(32px,6vw,90px);align-items:center}
.ab-tools .ab-kicker{color:var(--coral)}
.ab-tools h2{font-size:clamp(2.2rem,4.4vw,3.8rem);line-height:1.02;font-weight:700;margin-bottom:18px;color:#F6F4F1;max-width:14ch}
.ab-tools h2 em{color:var(--coral)}
.ab-tools__copy>p{color:rgba(246,244,241,.7);line-height:1.7;max-width:44ch;margin:0 0 26px}
.ab-tools__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ab-tools__list li{padding:8px 14px;border-radius:99px;border:1px solid rgba(246,244,241,.16);background:rgba(255,255,255,.05);font-size:13px;font-weight:600}
.ab-orbit{--size:min(92vw,520px);--R:calc(var(--size) * .4);position:relative;justify-self:center;width:var(--size);height:var(--size)}
.ab-orbit__ring{position:absolute;inset:0}
.ab-orbit__circle{position:absolute;inset:10%;border-radius:50%;border:1px solid rgba(246,244,241,.14)}
.ab-orbit__circle--b{inset:26%;border:1px dashed rgba(255,122,89,.4)}
.ab-orbit__core{position:absolute;left:50%;top:50%;width:30%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;display:grid;place-items:center;text-align:center;background:radial-gradient(circle at 34% 28%,var(--coral),var(--accent) 58%,#5c0a0e);box-shadow:0 0 90px 12px rgba(229,37,42,.5),inset 0 0 30px rgba(255,255,255,.2)}
.ab-orbit__core span{font:800 clamp(1.1rem,2.4vw,1.8rem)/1.05 var(--f-head);letter-spacing:-.03em;color:#fff}
.ab-tool{position:absolute;left:50%;top:50%;width:0;height:0;transform:rotate(var(--a)) translateY(calc(var(--R) * -1))}
.ab-tool span{position:absolute;left:0;top:0;transform:translate(-50%,-50%) rotate(calc(var(--a) * -1));display:block;white-space:nowrap;padding:9px 15px;border-radius:99px;font:700 clamp(11px,1.4vw,14px)/1 var(--f-body);color:#F6F4F1;background:rgba(20,11,12,.88);border:1px solid rgba(246,244,241,.2);box-shadow:0 14px 30px -14px rgba(0,0,0,.9)}
.ab-tool:nth-child(3n+1) span{border-color:rgba(255,122,89,.6)}

/* ---------- WORKING TOGETHER ---------- */
.ab-work{padding:clamp(72px,10vw,140px) 0 clamp(40px,5vw,72px)}
.ab-work__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ab-work__item{padding:clamp(24px,2.6vw,34px);border-radius:var(--r-md,24px);border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.55);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:var(--shadow)}
.ab-work__item .gi{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),var(--coral));margin-bottom:22px;box-shadow:0 10px 24px -10px rgba(229,37,42,.8)}
.ab-work__item .gi .ico{width:22px;height:22px}
.ab-work__item h3{font-size:1.35rem;margin-bottom:8px;font-weight:700}
.ab-work__item p{margin:0;color:var(--muted);line-height:1.65}
.ab-regions{margin-top:28px;display:flex;flex-wrap:wrap;align-items:center;gap:10px;color:var(--muted);font:500 12px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase}
.ab-regions b{padding:9px 16px;border-radius:99px;background:var(--ink);color:#fff;font-weight:600}

/* ---------- CTA ---------- */
.ab-cta{padding:clamp(40px,6vw,90px) 0 clamp(72px,9vw,130px)}
.ab-cta__panel{position:relative;isolation:isolate;overflow:hidden;text-align:center;border-radius:var(--r-lg,32px);background:#140B0C;color:#F6F4F1;padding:clamp(48px,8vw,110px) clamp(22px,5vw,64px)}
.ab-cta__panel:before{content:"";position:absolute;left:50%;bottom:-60%;width:720px;height:720px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(circle,rgba(229,37,42,.5),transparent 68%);z-index:-1}
.ab-cta__ring{position:absolute;left:50%;top:50%;border-radius:50%;pointer-events:none;z-index:-1;transform:translate(-50%,-50%)}
.ab-cta__ring--a{width:min(120vw,900px);aspect-ratio:1;border:1px solid rgba(246,244,241,.1);animation:abSpinC 60s linear infinite}
.ab-cta__ring--b{width:min(88vw,620px);aspect-ratio:1;border:1px dashed rgba(255,122,89,.35);animation:abSpinC 40s linear infinite reverse}
@keyframes abSpinC{to{transform:translate(-50%,-50%) rotate(360deg)}}
.ab-cta .ab-kicker{color:var(--coral)}
.ab-cta h2{font-size:clamp(2.2rem,5vw,4.4rem);line-height:1.02;font-weight:700;max-width:16ch;margin:0 auto 18px;color:#F6F4F1}
.ab-cta h2 em{color:var(--coral)}
.ab-cta__panel>p{margin:0 auto 30px;max-width:46ch;color:rgba(246,244,241,.72);line-height:1.7}
.ab-cta__sig{display:block;margin-top:34px;font:500 11px/1 var(--f-mono);letter-spacing:.3em;color:rgba(246,244,241,.5)}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1024px){
  .ab-cards{gap:18px}
}
@media (max-width:900px){
  .ab-hero__grid,.ab-head,.ab-tools__grid{grid-template-columns:1fr}
  .ab-hero h1{max-width:13ch}
  .ab-badge{order:-1;width:min(74vw,340px)}
  .ab-cards,.ab-work__grid{grid-template-columns:1fr}
  .ab-card:nth-child(even){margin-top:0}
  .ab-chip--1{left:0}.ab-chip--2{right:0}
}
@media (max-width:480px){
  .ab-chip{font-size:12px;padding:7px 11px 7px 8px}
  .ab-chip i{width:22px;height:22px}
}
@media (prefers-reduced-motion:reduce){
  .ab-badge__text,.ab-badge__ring,.ab-chip,.ab-cta__ring{animation:none}
  .ab-statement__text .ab-w{opacity:1}
}