/* ============================================================
   Supreme Employment — About Us Page
   Scope: .ab-* | Navy #16293A | Gold #C8972A | Montserrat
      ============================================================ */

/* ── RESET ────────────────────────────────────────────────── */
.ab-hero *,.ab-who *,.ab-what *,.ab-why *,.ab-process *,.ab-cta *,
.ab-hero *::before,.ab-who *::before,.ab-what *::before,
.ab-why *::before,.ab-process *::before,.ab-cta *::before,
.ab-hero *::after,.ab-who *::after,.ab-what *::after,
.ab-why *::after,.ab-process *::after,.ab-cta *::after {
  box-sizing:border-box;margin:0;padding:0;
}

/* ── SHARED ───────────────────────────────────────────────── */
.ab-hero,.ab-who,.ab-what,.ab-why,.ab-process,.ab-cta {
  font-family:'Montserrat',sans-serif;
  -webkit-font-smoothing:antialiased;
}

.ab-w { max-width:1180px;margin:0 auto;padding:0 clamp(20px,5vw,60px); }

.ab-eye {
  display:inline-flex;align-items:center;gap:9px;
  font-size:11px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:#C8972A;margin-bottom:14px;
}
.ab-eye::before {
  content:'';width:26px;height:2px;background:#C8972A;
  display:block;flex-shrink:0;
}

.ab-h1 {
  font-size:clamp(32px,5.5vw,64px);font-weight:900;
  line-height:1.06;color:#fff;text-transform:uppercase;margin-bottom:18px;
}
.ab-h1 em { font-style:normal;color:#C8972A; }

.ab-h2 {
  font-size:clamp(24px,3.8vw,44px);font-weight:800;
  line-height:1.1;text-transform:uppercase;color:#16293A;margin-bottom:16px;
}
.ab-h2 em { font-style:normal;color:#C8972A; }
.ab-h2w { color:#fff; }

.ab-p { font-size:15px;color:#3d5166;line-height:1.78;margin-bottom:18px;font-weight:500; }

.ab-tag {
  display:inline-block;
  background:rgba(200,151,42,.14);border:1px solid rgba(200,151,42,.35);
  color:#C8972A;font-size:11px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 16px;border-radius:2px;margin-bottom:22px;
}

.ab-sec-head { text-align:center;margin-bottom:clamp(40px,5vw,60px); }
.ab-sec-head__sub {
  font-size:15px;color:#6b7f90;line-height:1.7;
  max-width:520px;margin:0 auto;font-weight:500;
}
.ab-sec-head--light .ab-eye { justify-content:center; }
.ab-sec-head--light .ab-eye::after {
  content:'';width:26px;height:2px;background:#C8972A;display:block;flex-shrink:0;
}
.ab-sec-head__sub--light { color:rgba(255,255,255,.58); }

/* ── HERO ─────────────────────────────────────────────────── */
.ab-hero {
  background:#0d1c27;
  padding:clamp(110px,14vw,150px) 0 clamp(64px,8vw,96px);
  position:relative;overflow:hidden;
}
.ab-hero::before {
  content:'';position:absolute;left:0;top:0;bottom:0;
  width:5px;background:#C8972A;
}
.ab-hero::after {
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(200,151,42,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(200,151,42,.03) 1px,transparent 1px);
  background-size:52px 52px;pointer-events:none;
}
.ab-hero__inner { position:relative;z-index:2; }

.ab-hero__sub {
  font-size:clamp(15px,2vw,18px);color:rgba(255,255,255,.62);
  max-width:560px;line-height:1.72;font-weight:500;
}

/* ── WHO WE ARE ───────────────────────────────────────────── */
.ab-who { background:#fff;padding:clamp(60px,8vw,96px) 0; }

.ab-who__grid {
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(40px,6vw,80px);align-items:center;
}

.ab-facts {
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:0;margin-top:32px;
  border:1px solid rgba(200,151,42,.2);border-radius:12px;overflow:hidden;
}
.ab-fact {
  padding:20px 16px;text-align:center;
  border-right:1px solid rgba(200,151,42,.15);
  background:#f7f6f3;
}
.ab-fact:last-child { border-right:none; }
.ab-fact strong {
  display:block;font-size:clamp(20px,3vw,30px);font-weight:900;
  color:#C8972A;line-height:1;margin-bottom:5px;
}
.ab-fact span {
  font-size:10px;font-weight:600;color:#6b7f90;
  text-transform:uppercase;letter-spacing:.05em;line-height:1.4;display:block;
}

.ab-who__visual { position:relative; }

.ab-img-block {
  border-radius:14px;overflow:hidden;
  aspect-ratio:4/3;position:relative;
}
.ab-img-block img {
  width:100%;height:100%;object-fit:cover;display:block;
}

.ab-location-badge {
  position:absolute;bottom:-16px;left:-16px;
  background:#16293A;border-left:4px solid #C8972A;
  padding:14px 18px;border-radius:0 10px 10px 0;
  display:flex;align-items:center;gap:12px;
  box-shadow:0 8px 28px rgba(13,28,39,.28);z-index:10;
}
.ab-location-badge svg {
  width:20px;height:20px;stroke:#C8972A;flex-shrink:0;
}
.ab-location-badge strong {
  display:block;font-size:13px;font-weight:700;
  color:#fff;margin-bottom:2px;
}
.ab-location-badge span {
  font-size:11px;color:rgba(255,255,255,.55);font-weight:500;
}

/* ── WHAT WE DO ───────────────────────────────────────────── */
.ab-what { background:#f7f6f3;padding:clamp(60px,8vw,96px) 0; }

.ab-services {
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}

.ab-service {
  background:#fff;border-radius:14px;padding:32px 28px;
  border:1px solid rgba(22,41,58,.08);
  text-decoration:none;display:flex;flex-direction:column;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.ab-service:hover {
  transform:translateY(-6px);
  box-shadow:0 20px 48px rgba(22,41,58,.11);
  border-color:rgba(200,151,42,.3);
}

.ab-service__icon {
  width:50px;height:50px;border-radius:10px;
  background:#f5e9cc;border:1px solid rgba(200,151,42,.25);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:18px;flex-shrink:0;
}
.ab-service__icon svg { width:22px;height:22px;stroke:#C8972A; }

.ab-service__t {
  font-size:15px;font-weight:800;text-transform:uppercase;
  color:#16293A;margin-bottom:10px;line-height:1.25;letter-spacing:.02em;
}

.ab-service__d {
  font-size:13.5px;color:#6b7f90;line-height:1.7;
  margin-bottom:20px;flex:1;
}

.ab-service__link {
  font-size:12px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:#C8972A;
  transition:gap .2s ease;
}

/* ── WHY CHOOSE US ────────────────────────────────────────── */
.ab-why { background:#fff;padding:clamp(60px,8vw,96px) 0; }

.ab-why__grid {
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}

.ab-why-card {
  background:#f7f6f3;border-radius:14px;padding:32px 28px;
  border:1px solid rgba(22,41,58,.06);
  transition:background .25s ease,border-color .25s ease;
}
.ab-why-card:hover {
  background:#fff;
  border-color:rgba(200,151,42,.25);
  box-shadow:0 12px 36px rgba(22,41,58,.08);
}

.ab-why-card__num {
  font-size:36px;font-weight:900;color:rgba(200,151,42,.25);
  line-height:1;margin-bottom:14px;
}

.ab-why-card__t {
  font-size:14px;font-weight:800;text-transform:uppercase;
  color:#16293A;letter-spacing:.04em;margin-bottom:10px;line-height:1.3;
}

.ab-why-card__d {
  font-size:13.5px;color:#6b7f90;line-height:1.68;
}

/* ── PROCESS ──────────────────────────────────────────────── */
.ab-process { background:#16293A;padding:clamp(60px,8vw,96px) 0; }

.ab-steps {
  display:flex;align-items:flex-start;
  gap:clamp(16px,3vw,32px);margin-top:48px;
}

.ab-step { flex:1;text-align:center; }

.ab-step__num {
  width:72px;height:72px;border-radius:50%;
  background:#0d1c27;border:2px solid #C8972A;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 20px;
  font-size:24px;font-weight:900;color:#C8972A;
  transition:.25s ease;
}
.ab-step:hover .ab-step__num {
  background:#C8972A;color:#0d1c27;
}

.ab-step__t {
  font-size:14px;font-weight:800;text-transform:uppercase;
  letter-spacing:.05em;color:#fff;margin-bottom:10px;
}

.ab-step__d {
  font-size:13px;color:rgba(255,255,255,.52);line-height:1.65;
}

.ab-step__arrow {
  font-size:24px;color:rgba(200,151,42,.4);
  padding-top:24px;flex-shrink:0;
}

/* ── CTA ──────────────────────────────────────────────────── */
.ab-cta { background:#f7f6f3;padding:clamp(60px,8vw,96px) 0; }

.ab-cta-box {
  background:#16293A;border-radius:16px;
  padding:clamp(44px,6vw,72px) clamp(28px,5vw,64px);
  display:grid;grid-template-columns:1fr auto;
  gap:36px;align-items:center;
  position:relative;overflow:hidden;
}
.ab-cta-box::after {
  content:'';position:absolute;top:-70px;right:-70px;
  width:300px;height:300px;border-radius:50%;
  background:rgba(200,151,42,.05);border:60px solid rgba(200,151,42,.04);
  pointer-events:none;
}

.ab-cta-box__t {
  font-size:clamp(22px,3.5vw,36px);font-weight:900;
  text-transform:uppercase;color:#fff;line-height:1.1;
  margin-bottom:8px;position:relative;z-index:1;
}
.ab-cta-box__d {
  font-size:14px;color:rgba(255,255,255,.55);
  line-height:1.65;font-weight:500;position:relative;z-index:1;
}
.ab-cta-box__btns {
  display:flex;flex-direction:column;gap:12px;
  flex-shrink:0;position:relative;z-index:1;
}

.ab-btn {
  display:inline-flex;align-items:center;justify-content:center;
  background:#C8972A;color:#0d1c27;
  font-family:'Montserrat',sans-serif;
  font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  padding:15px 28px;border-radius:6px;text-decoration:none;
  border:2px solid #C8972A;white-space:nowrap;
  transition:.25s ease;
}
.ab-btn:hover { background:#d9a832;border-color:#d9a832;transform:translateY(-2px); }
.ab-btn--ghost { background:transparent;color:#C8972A; }
.ab-btn--ghost:hover { background:#C8972A;color:#0d1c27; }

/* ── TABLET ≤960px ────────────────────────────────────────── */
@media(max-width:960px){
  .ab-who__grid { grid-template-columns:1fr; }
  .ab-location-badge { position:static;margin-top:16px;border-radius:10px;border-left:4px solid #C8972A; }
  .ab-services { grid-template-columns:1fr 1fr; }
  .ab-why__grid { grid-template-columns:1fr 1fr; }
  .ab-steps { flex-direction:column;align-items:center; }
  .ab-step { width:100%;max-width:400px; }
  .ab-step__arrow { transform:rotate(90deg);padding:0; }
  .ab-cta-box { grid-template-columns:1fr; }
  .ab-cta-box__btns { flex-direction:row;flex-wrap:wrap; }
  .ab-facts { grid-template-columns:repeat(2,1fr); }
  .ab-fact:nth-child(2) { border-right:none; }
  .ab-fact:nth-child(1),.ab-fact:nth-child(2) { border-bottom:1px solid rgba(200,151,42,.15); }
}

/* ── MOBILE ≤600px ────────────────────────────────────────── */
@media(max-width:600px){
  .ab-hero__tag,.ab-tag { margin-top:48px;display:inline-block; }
  .ab-services { grid-template-columns:1fr; }
  .ab-why__grid { grid-template-columns:1fr; }
  .ab-facts { grid-template-columns:1fr 1fr; }
  .ab-cta-box__btns { flex-direction:column; }
  .ab-btn { width:100%; }
}

/* ── SMALL MOBILE ≤480px ──────────────────────────────────── */
@media(max-width:480px){
  .ab-hero__tag,.ab-tag { margin-top:6px; }
  .ab-facts { grid-template-columns:1fr 1fr; }
}

@media(min-width:961px){
  .ab-services { grid-template-columns:repeat(4,1fr); }
}
.ab-team { padding:clamp(60px,8vw,90px) 0;background:#f7f6f3; }
.ab-team__card { max-width:760px;margin:0 auto;background:#ffffff;border:1px solid rgba(22,41,58,.08);border-radius:14px;padding:32px;display:flex;gap:24px;align-items:flex-start; }
.ab-team__avatar { flex:0 0 88px;width:88px;height:88px;border-radius:50%;background:#16293A;color:#C8972A;border:3px solid #C8972A;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:26px;letter-spacing:.04em; }
.ab-team__name { margin:0 0 2px;font-size:20px;font-weight:800;color:#16293A; }
.ab-team__role { margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#C8972A; }
.ab-team__bio { margin:0;font-size:15px;line-height:1.75;color:#3d5166; }
@media(max-width:600px){
  .ab-team__card { flex-direction:column;align-items:center;text-align:center;padding:24px; }
}