.about-page{background:#fff;color:#15151a}
.about-hero{position:relative;overflow:hidden;background:#0c0d11;color:#fff;padding:clamp(7rem,12vw,11rem) 0 clamp(6rem,10vw,9rem)}
.about-hero:before,.about-hero:after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.about-hero:before{width:34rem;height:34rem;right:-12rem;top:-15rem;border:1px solid rgba(255,255,255,.09)}
.about-hero:after{width:24rem;height:24rem;left:-11rem;bottom:-12rem;background:radial-gradient(circle,rgba(170,0,0,.35),transparent 70%)}
.about-hero__inner{position:relative;z-index:1;width:min(920px,100%);margin:0 auto;text-align:center}
.about-hero__logo{width:min(240px,55vw);margin:0 auto 1.5rem;filter:brightness(0) invert(1)}
.about-hero__eyebrow{margin:0 0 1rem;color:#ffb200;font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.about-hero h1{max-width:840px;margin:0 auto;color:#fff;font-family:"League Spartan",sans-serif;font-size:clamp(3rem,6vw,5.4rem);font-weight:900;line-height:.96;letter-spacing:-.045em;text-transform:uppercase}
.about-hero__lead{max-width:720px;margin:1.8rem auto 0;color:rgba(255,255,255,.78);font-size:clamp(1.05rem,1.6vw,1.3rem);line-height:1.55}
.about-hero__actions{display:flex;justify-content:center;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.about-section{padding:clamp(5rem,9vw,8rem) 0}
.about-intro{background:radial-gradient(circle at 10% 20%,rgba(170,0,0,.07),transparent 26%),radial-gradient(circle at 95% 80%,rgba(255,178,0,.11),transparent 28%),#fff}
.about-intro__grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(3rem,7vw,7rem);align-items:center}
.about-intro h2,.about-donut h2,.about-journey h2,.about-capabilities h2{margin:0;font-family:"League Spartan",sans-serif;font-size:clamp(2.6rem,4.6vw,4.4rem);font-weight:900;line-height:.98;letter-spacing:-.04em;text-transform:uppercase}
.about-intro__copy>p{color:#5f6067;font-size:1.12rem;line-height:1.7}
.about-badge{display:inline-flex;align-items:center;gap:.65rem;margin-bottom:1.2rem;padding:.65rem .95rem;border-radius:999px;background:#f5ecec;color:#aa0000;font-size:.82rem;font-weight:800}
.about-badge i{width:.7rem;height:.7rem;border-radius:50%;background:#aa0000;box-shadow:0 0 0 .35rem rgba(170,0,0,.12)}
.about-intro__panel{padding:clamp(2rem,5vw,4rem);border:1px solid #e3e3e7;border-radius:2rem;background:#f7f7f8}
.about-intro__panel h3{margin:0 0 1.5rem;font-size:1.05rem;text-transform:uppercase;letter-spacing:.12em}
.about-intro__list{display:grid}
.about-intro__list div{display:grid;grid-template-columns:3.2rem 1fr;gap:1rem;padding:1.2rem 0;border-top:1px solid #dedee3}
.about-intro__list span{color:#aa0000;font-weight:900}
.about-intro__list strong{display:block;margin-bottom:.25rem;font-size:1.05rem}
.about-intro__list p{margin:0;color:#666872}
.about-donut{background:#f6f6f7}
.about-donut__heading{max-width:850px;margin-bottom:4rem}
.about-donut__heading p{max-width:680px;color:#656771;font-size:1.08rem}
.about-donut__layout{display:grid;grid-template-columns:minmax(310px,.85fr) minmax(420px,1.15fr);gap:clamp(3rem,8vw,8rem);align-items:start}
.about-donut__sticky{position:sticky;top:8rem;display:grid;place-items:center;min-height:500px}
.about-donut__ring{--value:22;position:relative;width:min(35vw,430px);aspect-ratio:1;border-radius:50%;background:conic-gradient(from -90deg,#ffb200 calc(var(--value)*1%),#dedfe3 0);transition:background .7s ease}
.about-donut__ring:before{content:"";position:absolute;inset:13%;border-radius:50%;background:#f6f6f7;box-shadow:inset 0 0 0 1px #e2e2e6}
.about-donut__center{position:absolute;inset:0;z-index:1;display:grid;place-content:center;text-align:center}
.about-donut__center span{color:#6c6e76;font-size:1rem}
.about-donut__center strong{margin-top:.3rem;font-family:"League Spartan",sans-serif;font-size:clamp(4rem,8vw,7rem);line-height:.9;letter-spacing:-.05em}
.about-donut__center small{margin-top:.7rem;color:#aa0000;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.about-donut__steps{display:grid;gap:2rem}
.about-donut__step{min-height:58vh;padding:clamp(2rem,5vw,3.5rem);border:1px solid #dedee4;border-radius:1.8rem;background:rgba(255,255,255,.72);opacity:.42;transform:scale(.97);transition:opacity .35s,transform .35s,border-color .35s,box-shadow .35s}
.about-donut__step.is-active{opacity:1;transform:scale(1);border-color:rgba(170,0,0,.36);box-shadow:0 24px 60px rgba(27,18,18,.1)}
.about-donut__step .step-number{color:#aa0000;font-size:.82rem;font-weight:900;letter-spacing:.12em}
.about-donut__step h3{margin:1.1rem 0 .8rem;font-family:"League Spartan",sans-serif;font-size:clamp(2rem,3vw,3rem);line-height:1;text-transform:uppercase}
.about-donut__step p{max-width:620px;color:#646670;font-size:1.04rem;line-height:1.65}
.about-donut__step ul{display:grid;gap:.7rem;padding:0;margin:1.5rem 0 0;list-style:none}
.about-donut__step li{position:relative;padding-left:1.6rem;font-weight:700}
.about-donut__step li:before{content:"→";position:absolute;left:0;color:#ffb200}
.about-journey{position:relative;min-height:760px;display:flex;align-items:center;overflow:hidden;color:#fff;background:linear-gradient(90deg,rgba(11,12,15,.88),rgba(11,12,15,.55)),url("../images/about-office-bg.svg") center/cover no-repeat}
.about-journey__content{position:relative;z-index:1}
.about-journey h2{max-width:520px;color:#fff}
.about-journey__grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:4rem}
.about-journey__item{min-height:270px;padding:1.4rem 2rem;border-left:1px solid rgba(255,255,255,.38)}
.about-journey__item span{display:inline-block;padding:.4rem .7rem;border:1px solid rgba(255,255,255,.65);border-radius:999px;font-size:.72rem;font-weight:800;text-transform:uppercase}
.about-journey__item h3{margin:1.4rem 0 1rem;color:#fff;font-size:1.35rem}
.about-journey__item p{color:rgba(255,255,255,.8);line-height:1.6}
.about-capabilities{background:#fff}
.about-capabilities__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:3rem}
.about-capability-card{min-height:240px;padding:2rem;border:1px solid #dedee4;border-radius:1.5rem;background:#f7f7f8}
.about-capability-card:nth-child(2),.about-capability-card:nth-child(5){background:#aa0000;color:#fff}
.about-capability-card:nth-child(3){background:#ffb200}
.about-capability-card h3{margin:0 0 .8rem;font-size:1.45rem;text-transform:uppercase}
.about-capability-card p{margin:0;color:inherit;opacity:.78;line-height:1.6}
@media(max-width:900px){.about-intro__grid,.about-donut__layout{grid-template-columns:1fr}.about-donut__sticky{position:sticky;top:5.4rem;min-height:auto;padding:1rem 0 2rem;z-index:3;background:linear-gradient(#f6f6f7 80%,rgba(246,246,247,0))}.about-donut__ring{width:min(72vw,340px)}.about-donut__step{min-height:48vh}.about-journey__grid{grid-template-columns:1fr}.about-journey__item{min-height:auto;border-left:0;border-top:1px solid rgba(255,255,255,.34)}.about-capabilities__grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.about-hero{padding-top:8rem;text-align:left}.about-hero__inner{text-align:left}.about-hero__logo{margin-left:0}.about-hero__actions{justify-content:flex-start}.about-capabilities__grid{grid-template-columns:1fr}.about-donut__step{min-height:auto}.about-donut__center strong{font-size:4.2rem}}


/* v2.9.1 rendering safety */
.about-page .about-hero .reveal {
  opacity: 1;
  transform: none;
}

.about-page .about-intro .reveal.visible,
.about-page .about-journey .reveal.visible,
.about-page .cta .reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* DataXsys v2.9.2 */
.about-hero img{max-width:120px;height:auto}
.about-hero h1{font-size:clamp(3rem,6vw,4.8rem)!important;line-height:.95}
.about-hero h2{font-size:24px!important}
.about-intro h2,.about-donut h2,.about-image h2,.about-capabilities h2,.cta h2{font-size:80%!important;line-height:1.1}
.about-intro p,.about-donut p,.about-image p,.about-capabilities p{font-size:95%}


/* DataXsys Design System v2.9.3 — corrected heading hierarchy and hero mark */
.about-hero__logo{
  display:block;
  width:142px!important;
  max-width:142px!important;
  height:auto!important;
  margin:0 auto 1.35rem!important;
  filter:none!important;
  object-fit:contain;
}
.about-hero__title{
  max-width:760px;
  margin:0 auto;
  color:#fff;
  font-family:"League Spartan",sans-serif;
  font-size:clamp(2rem,3.2vw,2.8rem)!important;
  font-weight:900;
  line-height:1;
  letter-spacing:-.025em;
  text-transform:uppercase;
}
.about-intro__title{
  margin:0;
  max-width:620px;
  font-family:"League Spartan",sans-serif;
  font-size:clamp(1.75rem,2.8vw,2.5rem)!important;
  font-weight:900;
  line-height:1.05;
  letter-spacing:-.025em;
  text-transform:uppercase;
}
.about-hero__eyebrow{font-size:.75rem!important;letter-spacing:.16em;}
.about-intro h2{font-size:inherit!important;}
@media(max-width:640px){
  .about-hero__logo{width:118px!important;max-width:118px!important;margin-left:0!important;}
  .about-hero__title{font-size:clamp(1.75rem,9vw,2.25rem)!important;}
  .about-intro__title{font-size:clamp(1.55rem,8vw,2rem)!important;}
}


/* =========================================================
   v2.9.5 — ABOUT MOBILE DONUT: SMALLER BUT STILL STICKY
   ========================================================= */
@media(max-width:900px){
  .about-donut__layout{
    grid-template-columns:1fr!important;
  }
  .about-donut__sticky{
    position:sticky!important;
    top:72px!important;
    z-index:20!important;
    min-height:0!important;
    padding:.55rem 0 .8rem!important;
    margin:0!important;
    background:linear-gradient(#f6f6f7 88%,rgba(246,246,247,.96))!important;
  }
  .about-donut__ring{
    width:min(52vw,190px)!important;
    max-width:190px!important;
    margin:auto!important;
  }
  .about-donut__center span{
    font-size:.68rem!important;
  }
  .about-donut__center strong{
    margin-top:.1rem!important;
    font-size:clamp(2.35rem,11vw,3.15rem)!important;
    line-height:.86!important;
  }
  .about-donut__center small{
    max-width:130px!important;
    margin:.35rem auto 0!important;
    font-size:.54rem!important;
    line-height:1.25!important;
    letter-spacing:.06em!important;
  }
  .about-donut__steps{
    gap:1.25rem!important;
  }
  .about-donut__step{
    min-height:auto!important;
    padding:1.25rem 1rem!important;
  }
  .about-donut__step h3{
    font-size:clamp(1.55rem,7vw,2rem)!important;
  }
}
@media(max-width:520px){
  .about-donut__ring{
    width:min(48vw,165px)!important;
    max-width:165px!important;
  }
  .about-donut__center strong{
    font-size:clamp(2rem,10vw,2.7rem)!important;
  }
  .about-donut__center small{
    max-width:112px!important;
    font-size:.48rem!important;
  }
}


/* DATAXSYS v3.0.5 — yellow pill action button */
.btn-yellow-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 48px !important;
  border: 2px solid #ffb800 !important;
  border-radius: 999px !important;
  background: #ffb800 !important;
  color: #111 !important;
  padding: .92rem 1.65rem !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
  box-shadow: 0 10px 24px rgba(255,184,0,.22) !important;
}

.btn-yellow-action:hover,
.btn-yellow-action:focus-visible {
  border-color: #ffc83d !important;
  background: #ffc83d !important;
  color: #111 !important;
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(255,184,0,.30) !important;
}

.btn-client-website{
display:inline-flex;align-items:center;justify-content:center;
padding:16px 30px;border-radius:999px;
background:#fff!important;color:#111!important;
border:2px solid #fff!important;font-weight:700;
text-decoration:none;transition:all .25s ease}
.btn-client-website:hover{
background:#f2f2f2!important;color:#111!important;
border-color:#f2f2f2!important;
box-shadow:0 10px 24px rgba(0,0,0,.18);
transform:translateY(-2px)}