/* =========================================================================
   AXIOMAXS — /about page components.  Everything is namespaced .ab-*
   so nothing here can collide with css/site.css or css/hero.css.
   Load AFTER css/site.css.
   ========================================================================= */

.ab-sec{ padding:clamp(64px,10vw,140px) 0; }
.ab-sec + .ab-sec{ padding-top:0; }
.ab-lead{
  font-family:var(--f-disp); font-weight:500;
  font-size:clamp(1.4rem,3.1vw,2.5rem); line-height:1.24; letter-spacing:-.02em;
  max-width:22ch;
}
.ab-body{ color:var(--mut); max-width:58ch; line-height:1.75; }
.ab-body + .ab-body{ margin-top:1.1rem; }
.ab-split{
  display:grid; gap:clamp(28px,5vw,72px);
  grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  align-items:start;
}
@media (max-width:900px){ .ab-split{grid-template-columns:1fr} }

/* ---------- ORIGIN / PHASES -------------------------------------------- */
.ab-phases{ counter-reset:ph; margin-top:clamp(28px,4vw,48px); }
.ab-phase{
  display:grid; gap:clamp(12px,3vw,44px);
  grid-template-columns:5.5rem minmax(0,1fr);
  padding:clamp(22px,3vw,34px) 0;
  border-top:1px solid var(--ln);
  transition:background .4s var(--ease);
}
.ab-phase:last-child{ border-bottom:1px solid var(--ln); }
.ab-phase:hover{ background:rgba(36,56,255,.035); }
.ab-phase-n{
  font-family:var(--f-mono); font-size:.72rem; letter-spacing:.14em;
  color:var(--cobalt); padding-top:.45rem;
}
.ab-phase h3{
  font-family:var(--f-disp); font-weight:600;
  font-size:clamp(1.15rem,2.1vw,1.6rem); letter-spacing:-.01em; margin-bottom:.5rem;
}
.ab-phase p{ color:var(--mut); max-width:62ch; line-height:1.7; }
@media (max-width:640px){ .ab-phase{grid-template-columns:1fr; gap:.5rem} .ab-phase-n{padding-top:0} }

/* ---------- PRINCIPLES -------------------------------------------------- */
.ab-grid{
  display:grid; gap:1px; background:var(--ln);
  border:1px solid var(--ln); margin-top:clamp(28px,4vw,48px);
  grid-template-columns:repeat(3,1fr);   /* 6 cells -> a clean 3x2, never an orphan */
}
@media (max-width:1040px){ .ab-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){  .ab-grid{grid-template-columns:1fr} }
.ab-cell{
  background:var(--bg); padding:clamp(24px,3vw,38px);
  transition:background .35s var(--ease), transform .35s var(--ease);
}
.ab-cell:hover{ background:rgba(36,56,255,.04); }
.ab-cell .ab-k{
  font-family:var(--f-mono); font-size:.68rem; letter-spacing:.16em;
  color:var(--cobalt); display:block; margin-bottom:1rem;
}
.ab-cell h3{
  font-family:var(--f-disp); font-weight:600;
  font-size:clamp(1.05rem,1.6vw,1.3rem); letter-spacing:-.01em; margin-bottom:.6rem;
}
.ab-cell p{ color:var(--mut); font-size:.95rem; line-height:1.7; }

/* ---------- PROCESS ----------------------------------------------------- */
.ab-flow{
  display:grid; gap:1px; background:rgba(239,236,227,.16);
  grid-template-columns:repeat(5,1fr);
  margin-top:clamp(28px,4vw,48px);
  border:1px solid rgba(239,236,227,.16);
}
@media (max-width:1100px){ .ab-flow{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){  .ab-flow{grid-template-columns:1fr} }
.ab-step{ background:#fff; color:var(--ink); padding:clamp(22px,2.6vw,34px); position:relative; }
.ab-step b{
  font-family:var(--f-mono); font-weight:400; font-size:.68rem; letter-spacing:.16em;
  color:var(--cobalt); display:block; margin-bottom:1.6rem;
}
.ab-step h3{ font-family:var(--f-disp); font-weight:600; font-size:1.1rem; margin-bottom:.55rem; }
.ab-step p{ color:#8B897F; font-size:.9rem; line-height:1.65; }
.ab-step small{
  display:block; margin-top:1.1rem; font-family:var(--f-mono);
  font-size:.64rem; letter-spacing:.12em; color:rgba(239,236,227,.42);
}

/* ---------- CAPABILITIES ------------------------------------------------ */
.ab-cap{ border-top:1px solid var(--ln); margin-top:clamp(28px,4vw,48px); }
.ab-cap-row{
  display:grid; gap:clamp(10px,3vw,40px);
  grid-template-columns:3.2rem minmax(0,1.1fr) minmax(0,1.4fr);
  padding:clamp(20px,2.6vw,30px) 0; border-bottom:1px solid var(--ln);
  align-items:baseline;
}
.ab-cap-row span:first-child{ font-family:var(--f-mono); font-size:.7rem; color:var(--cobalt); }
.ab-cap-row h3{ font-family:var(--f-disp); font-weight:600; font-size:clamp(1.05rem,1.9vw,1.45rem); letter-spacing:-.01em; }
.ab-cap-row p{ color:var(--mut); line-height:1.7; font-size:.95rem; }
.ab-tags{ margin-top:.7rem; display:flex; flex-wrap:wrap; gap:.4rem; }
.ab-tags b{
  font-family:var(--f-mono); font-weight:400; font-size:.62rem; letter-spacing:.1em;
  border:1px solid var(--ln); padding:.28rem .55rem; color:var(--mut); text-transform:uppercase;
}
@media (max-width:820px){ .ab-cap-row{grid-template-columns:1fr; gap:.6rem} }

/* ---------- ENGAGEMENT -------------------------------------------------- */
.ab-plans{
  display:grid; gap:clamp(16px,2vw,24px);
  grid-template-columns:repeat(3,1fr);
  margin-top:clamp(28px,4vw,48px);
}
@media (max-width:900px){ .ab-plans{grid-template-columns:1fr} }
.ab-plan{
  border:1px solid var(--ln); padding:clamp(24px,3vw,36px);
  display:flex; flex-direction:column; gap:.9rem;
  transition:border-color .35s var(--ease), transform .35s var(--ease);
}
.ab-plan:hover{ border-color:var(--cobalt); transform:translateY(-4px); }
.ab-plan .ab-k{ font-family:var(--f-mono); font-size:.66rem; letter-spacing:.16em; color:var(--cobalt); }
.ab-plan h3{ font-family:var(--f-disp); font-weight:600; font-size:1.25rem; }
.ab-plan p{ color:var(--mut); font-size:.94rem; line-height:1.7; }
.ab-plan ul{ list-style:none; display:flex; flex-direction:column; gap:.45rem; margin-top:auto; padding-top:.6rem; }
.ab-plan li{ font-size:.88rem; color:var(--mut); padding-left:1.1rem; position:relative; }
.ab-plan li::before{ content:"—"; position:absolute; left:0; color:var(--cobalt); }

/* ---------- FAQ --------------------------------------------------------- */
.ab-faq{ margin-top:clamp(28px,4vw,48px); border-top:1px solid var(--ln); }
.ab-q{ border-bottom:1px solid var(--ln); }
.ab-q summary{
  list-style:none; cursor:pointer; padding:clamp(20px,2.4vw,28px) 3rem clamp(20px,2.4vw,28px) 0;
  position:relative; font-family:var(--f-disp); font-weight:500;
  font-size:clamp(1rem,1.7vw,1.28rem); letter-spacing:-.01em;
  transition:color .3s;
}
.ab-q summary::-webkit-details-marker{ display:none; }
.ab-q summary:hover{ color:var(--cobalt); }
.ab-q summary::after{
  content:"+"; position:absolute; right:.2rem; top:50%; transform:translateY(-50%);
  font-family:var(--f-mono); font-size:1.2rem; color:var(--cobalt); transition:transform .3s var(--ease);
}
.ab-q[open] summary::after{ transform:translateY(-50%) rotate(45deg); }
.ab-q p{ color:var(--mut); line-height:1.75; max-width:70ch; padding:0 3rem 1.6rem 0; }

/* ---------- FACT STRIP -------------------------------------------------- */
.ab-strip{
  display:grid; gap:1px; background:var(--ln); border:1px solid var(--ln);
  grid-template-columns:repeat(4,1fr);
  margin-top:clamp(28px,4vw,48px);
}
.ab-fact{ background:var(--bg); padding:clamp(20px,2.4vw,30px); }
.ab-fact b{
  display:block; font-family:var(--f-disp); font-weight:600;
  font-size:clamp(1.6rem,3.4vw,2.6rem); letter-spacing:-.03em; line-height:1;
}
.ab-fact span{
  display:block; margin-top:.6rem; font-family:var(--f-mono);
  font-size:.64rem; letter-spacing:.14em; color:var(--mut); text-transform:uppercase;
}