/* =========================================================================
   about-page.css — styles for the standalone /about-us page.
   The page's <main> carries BOTH .contactpage and .aboutpage, so the hero,
   buttons, cards and brand vars (--cp-*) come straight from contact-page.css;
   this file only adds the About-specific sections, scoped under .aboutpage.
   ========================================================================= */

/* Hero figure: the real office photo is landscape, so allow it wider than the
   portrait plumber cutout the contact page uses. */
.aboutpage .cp-hero__figure img{max-width:480px;}

/* ------------------------------ INTRO ----------------------------------- */
.aboutpage .ab-intro{padding:52px 0 56px;background:#fff;}
.aboutpage .ab-intro__grid{display:grid;grid-template-columns:1.25fr .75fr;gap:34px;align-items:start;}
.aboutpage .ab-intro__copy p{color:var(--cp-ink);font-size:16px;line-height:1.7;margin:0 0 16px;max-width:70ch;}
.aboutpage .ab-intro__copy .cp-h2{color:var(--cp-navy);margin-bottom:14px;}
.aboutpage .ab-areas{margin-top:26px;}
.aboutpage .ab-areas .cp-h3{margin-bottom:12px;}

/* Sticky-feel credentials card (mirrors .cp-card chrome) */
.aboutpage .ab-factcard{background:#fff;border:1px solid var(--cp-line);border-radius:16px;padding:24px 22px;box-shadow:0 10px 30px -24px rgba(3,25,54,.5);}
.aboutpage .ab-factcard__title{font-family:'Gilroy-ExtraBoldItalic',var(--display),sans-serif;font-style:normal;color:var(--cp-navy);font-size:19px;margin:0 0 14px;}
.aboutpage .ab-facts{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:11px;}
.aboutpage .ab-facts li{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;line-height:1.45;color:var(--cp-ink);}
.aboutpage .ab-facts .cp-ic{width:19px;height:19px;color:var(--cp-blue);flex:none;margin-top:1px;}
.aboutpage .ab-factcard__btn{width:100%;justify-content:center;}

/* --------------------------- CREDENTIALS -------------------------------- */
.aboutpage .ab-creds{padding:52px 0 56px;background:var(--cp-bg);}
.aboutpage .ab-creds .cp-h2{color:var(--cp-navy);margin-bottom:8px;}
.aboutpage .ab-lede{color:var(--cp-muted);font-size:16px;line-height:1.6;margin:0 0 26px;max-width:72ch;}
.aboutpage .ab-creds__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.aboutpage .ab-cred{background:#fff;border:1px solid var(--cp-line);border-radius:16px;padding:24px 22px;box-shadow:0 10px 30px -24px rgba(3,25,54,.5);}
.aboutpage .ab-cred__ic{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:12px;background:#eef3fb;margin-bottom:14px;}
.aboutpage .ab-cred__ic .cp-ic{width:24px;height:24px;color:var(--cp-blue);}
.aboutpage .ab-cred h3{font-family:'Gilroy-ExtraBoldItalic',var(--display),sans-serif;font-style:normal;color:var(--cp-navy);font-size:17.5px;margin:0 0 8px;}
.aboutpage .ab-cred p{color:var(--cp-ink);font-size:14.5px;line-height:1.6;margin:0;}
.aboutpage .ab-cred a{color:var(--cp-blue);font-weight:600;}

/* Full-width team/fleet photo inside the credentials section */
.aboutpage .ab-team{margin:26px 0 0;border-radius:16px;overflow:hidden;border:1px solid var(--cp-line);box-shadow:0 10px 30px -24px rgba(3,25,54,.5);background:#fff;}
.aboutpage .ab-team img{display:block;width:100%;height:auto;}
.aboutpage .ab-team figcaption{padding:12px 18px;color:var(--cp-muted);font-size:13.5px;}

/* ------------------------------ FOUNDER --------------------------------- */
.aboutpage .ab-founder{padding:52px 0 0;background:#fff;}
.aboutpage .ab-founder__grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:center;}
.aboutpage .ab-founder__photo{margin:0;}
.aboutpage .ab-founder__photo img{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;}
.aboutpage .ab-founder__bio .cp-h2{color:var(--cp-navy);margin-bottom:10px;}
.aboutpage .ab-founder__name{font-family:'Gilroy-ExtraBoldItalic',var(--display),sans-serif;font-style:normal;color:var(--cp-navy);font-size:19px;margin:0 0 14px;}
.aboutpage .ab-founder__name span{display:block;font-family:'Inter',sans-serif;font-weight:600;color:var(--cp-muted);font-size:13.5px;margin-top:3px;}
.aboutpage .ab-founder__bio p:not(.ab-founder__name){color:var(--cp-ink);font-size:15.5px;line-height:1.65;margin:0 0 14px;max-width:70ch;}

/* ------------------- LOCAL EXPERIENCE + HOW WE WORK --------------------- */
.aboutpage .ab-local{padding:52px 0 56px;background:#fff;}
.aboutpage .ab-local__grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start;}
.aboutpage .ab-local .cp-h2{color:var(--cp-navy);margin-bottom:12px;}
.aboutpage .ab-local p{color:var(--cp-ink);font-size:15.5px;line-height:1.65;margin:0 0 16px;max-width:70ch;}
.aboutpage .ab-local a{color:var(--cp-blue);font-weight:600;}
.aboutpage .ab-checklist{list-style:none;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:13px;}
.aboutpage .ab-checklist li{display:flex;align-items:flex-start;gap:11px;font-size:15px;line-height:1.55;color:var(--cp-ink);}
.aboutpage .ab-checklist .cp-ic{width:19px;height:19px;color:#22c55e;flex:none;margin-top:3px;}

.aboutpage .ab-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px;counter-reset:none;}
.aboutpage .ab-steps li{display:flex;align-items:flex-start;gap:14px;background:var(--cp-bg);border:1px solid var(--cp-line);border-radius:14px;padding:16px 18px;}
.aboutpage .ab-step__num{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:50%;background:var(--cp-yellow);color:var(--cp-navy);font:800 15px/1 'Inter',sans-serif;margin-top:2px;}
.aboutpage .ab-steps h3{font-family:'Gilroy-ExtraBoldItalic',var(--display),sans-serif;font-style:normal;color:var(--cp-navy);font-size:16px;margin:0 0 4px;}
.aboutpage .ab-steps p{color:var(--cp-ink);font-size:14px;line-height:1.55;margin:0;max-width:none;}

/* --------------------------- TRANSPARENCY ------------------------------- */
.aboutpage .ab-trans{padding:0 0 56px;background:#fff;}
.aboutpage .ab-trans__box{background:var(--cp-bg);border:1px solid var(--cp-line);border-left:4px solid var(--cp-yellow);border-radius:12px;padding:22px 24px;}
.aboutpage .ab-trans__box .cp-h3{margin-bottom:10px;}
.aboutpage .ab-trans__box p{color:var(--cp-ink);font-size:14.5px;line-height:1.65;margin:0;max-width:90ch;}
.aboutpage .ab-trans__box a{color:var(--cp-blue);font-weight:600;}

/* ------------------------------ CTA BAND -------------------------------- */
.aboutpage .ab-cta{background:linear-gradient(160deg,#12294a 0%,var(--cp-navy) 60%,#06101f 100%);color:#fff;padding:44px 0;}
.aboutpage .ab-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:26px;flex-wrap:wrap;}
.aboutpage .ab-cta__title{font-family:'Gilroy-HeavyItalic','Gilroy-ExtraBoldItalic',var(--display);font-style:normal;font-weight:400;color:#fff;text-transform:uppercase;font-size:clamp(22px,3.2vw,32px);letter-spacing:.4px;margin:0 0 6px;}
.aboutpage .ab-cta__lead{color:#d7e2f0;font-size:15.5px;margin:0;}

/* ---------------------------- RESPONSIVE -------------------------------- */
@media (max-width:900px){
  .aboutpage .ab-intro__grid,
  .aboutpage .ab-founder__grid,
  .aboutpage .ab-local__grid{grid-template-columns:1fr;}
  .aboutpage .ab-creds__grid{grid-template-columns:1fr;}
  .aboutpage .ab-founder__photo img{max-width:340px;}
}
@media (max-width:560px){
  .aboutpage .ab-intro,
  .aboutpage .ab-creds,
  .aboutpage .ab-local{padding:40px 0 44px;}
  .aboutpage .ab-cta__inner{display:block;}
  .aboutpage .ab-cta__inner .cp-hero__cta{margin-top:18px;}
}
