/* ============================================================
   POL — About page sections (header B + mission/approach/tools/team)
   Reuses tokens + .sec/.eyebrow-rule from pol.css / pol-home.css.
   ============================================================ */

/* ---- header B · ambient scene video ---------------------- */
.ab-hero{position:relative;min-height:88vh;overflow:hidden;background:var(--deep);color:var(--paper);
  display:flex;flex-direction:column}
.ab-hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% center;
  filter:saturate(1.04) contrast(1.12) brightness(.8)}
.ab-hero .ab-scrim{position:absolute;inset:0;z-index:1;background:
  linear-gradient(90deg,rgba(18,15,14,.88) 0,rgba(18,15,14,.5) 44%,transparent 74%),
  linear-gradient(0deg,rgba(18,15,14,.82) 0,rgba(18,15,14,.05) 42%,transparent 60%)}
.ab-hero .hb-nav{position:relative;z-index:6}
.ab-hero .ab-live{position:absolute;top:128px;right:48px;z-index:5;display:flex;align-items:center;gap:9px;
  font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:rgba(246,244,240,.85)}
.ab-hero .ab-live .dot{width:8px;height:8px;border-radius:50%;background:var(--orange);
  box-shadow:0 0 0 0 rgba(255,127,0,.5);animation:abpulse 1.9s infinite}
@keyframes abpulse{0%{box-shadow:0 0 0 0 rgba(255,127,0,.5)}70%{box-shadow:0 0 0 8px rgba(255,127,0,0)}100%{box-shadow:0 0 0 0 rgba(255,127,0,0)}}
.ab-hero .ab-head{position:relative;z-index:5;margin-top:auto;max-width:1240px;width:100%;
  margin-left:auto;margin-right:auto;padding:0 48px 64px;box-sizing:border-box}
.ab-eyebrow{display:flex;align-items:center;gap:14px;font-family:"IBM Plex Mono",monospace;
  font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--sage)}
.ab-eyebrow::before{content:"";width:34px;height:1px;background:var(--orange)}
.ab-hero h1{font-family:"Archivo",sans-serif;font-weight:800;letter-spacing:-.025em;line-height:1.0;
  font-size:clamp(40px,5.6vw,72px);margin:22px 0 0;max-width:17ch;color:var(--paper)}
.ab-hero h1 em{font-style:normal;color:var(--orange)}
.ab-hero .ab-lead{font-family:"Inter",sans-serif;font-size:clamp(16px,1.4vw,19px);line-height:1.55;
  color:rgba(246,244,240,.8);margin:22px 0 0;max-width:54ch}

/* ---- intro statement band -------------------------------- */
.ab-intro .ab-statement{font-family:"Archivo",sans-serif;font-weight:700;letter-spacing:-.015em;
  line-height:1.18;font-size:clamp(24px,2.9vw,40px);max-width:24ch;margin:26px 0 0;text-wrap:balance}
.ab-intro .ab-statement b{color:var(--orange);font-weight:700}

/* ---- mission --------------------------------------------- */
.ab-mission .ab-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:30px;align-items:start}
.ab-mission .ab-grid h2{font-size:clamp(30px,3.6vw,46px);max-width:14ch}
.ab-mission .ab-grid p{font-size:17px;line-height:1.6;color:inherit}
.ab-mission .ab-grid p + p{margin-top:18px}
.ab-mission .dim{opacity:.72}

/* ---- approach: numbered steps ---------------------------- */
.ab-approach .ab-intro-p{font-size:18px;line-height:1.6;max-width:60ch;margin-top:24px;color:rgba(246,244,240,.82)}
.ab-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:48px;background:var(--line-dark)}
.ab-step{background:var(--deep);padding:30px 28px}
.ab-step .sn{font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.14em;color:var(--orange)}
.ab-step h3{font-family:"Archivo",sans-serif;font-weight:700;font-size:20px;letter-spacing:-.01em;
  margin:16px 0 0;color:var(--paper)}
.ab-step p{font-size:15px;line-height:1.55;color:rgba(246,244,240,.66);margin:10px 0 0}
.ab-approach .ab-coda{font-family:"Archivo",sans-serif;font-weight:700;letter-spacing:-.01em;
  font-size:clamp(20px,2.2vw,28px);line-height:1.3;max-width:26ch;margin:44px 0 0;color:var(--paper)}
.ab-approach .ab-coda b{color:var(--orange);font-weight:700}

/* ---- tools grid ------------------------------------------ */
.ab-tools .tools-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:22px;margin-top:48px}
.tool-card{flex:0 1 calc((100% - 44px) / 3);min-width:240px;display:flex;flex-direction:column;background:#fff;border:1px solid rgba(34,30,30,.1);
  border-radius:6px;overflow:hidden}
.tool-card image-slot,.tool-card .tc-img{width:100%;height:200px;display:block;object-fit:cover}
.tool-card img.tc-img[src*="tool-pdtr"]{object-fit:cover;object-position:center;background:#fff}
.tool-card .tc-body{padding:22px 22px 26px}
.tool-card .tc-tag{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sage)}
.tool-card h3{font-family:"Archivo",sans-serif;font-weight:800;font-size:21px;letter-spacing:-.01em;
  margin:8px 0 0;color:var(--charcoal)}
.tool-card p{font-size:14.5px;line-height:1.55;color:rgba(50,47,47,.78);margin:11px 0 0}

/* ---- team ------------------------------------------------ */
.ab-team .team-member{display:grid;grid-template-columns:0.8fr 1.2fr;gap:56px;align-items:center}
.ab-team .team-member + .team-member{margin-top:80px}
.ab-team .team-member:nth-child(even) .tm-photo{order:2}
.ab-team .tm-photo{width:100%;aspect-ratio:4/5;display:block;border-radius:6px;overflow:hidden}
.ab-team img.tm-photo{object-fit:cover;object-position:center top}
.ab-team .tm-tag{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--orange)}
.ab-team .tm-body h3{font-family:"Archivo",sans-serif;font-weight:800;font-size:clamp(28px,3vw,40px);
  letter-spacing:-.02em;margin:12px 0 0;color:var(--paper)}
.ab-team .tm-body p{font-size:16px;line-height:1.62;color:rgba(246,244,240,.78);margin:16px 0 0;max-width:60ch}

/* ---- responsive ------------------------------------------ */
@media (max-width:900px){
  .ab-hero{min-height:84vh}
  .ab-hero .ab-head{padding:0 22px calc(40px + env(safe-area-inset-bottom))}
  .ab-hero .ab-live{top:74px;right:16px;font-size:10px}
  .ab-hero .ab-lead{max-width:none}
  .ab-mission .ab-grid{grid-template-columns:1fr;gap:24px}
  .ab-steps{grid-template-columns:1fr}
  .ab-tools .tools-grid{gap:16px}
  .tool-card{flex-basis:100%}
  .ab-team .team-member{grid-template-columns:1fr;gap:24px}
  .ab-team .team-member:nth-child(even) .tm-photo{order:0}
  .ab-team .tm-photo{max-width:340px}
}
@media (min-width:901px) and (max-width:1180px){
  .tool-card{flex-basis:calc((100% - 22px) / 2)}
}
