/* About v2 (/about/ only; loaded via about.yaml css:). Port of about-redesign/mockup/about-v2.css, scoped to .t-about.
   No angled/cut block edges anywhere on this page; house illustration dropped. */
.t-about{--sky:#004C8D} /* v2 spec blue; About only, pages.css tokens untouched */



.t-about .sec{clip-path:none}
.t-about .ab-tl li{position:relative}
.t-about .ab-tl .cn{display:block;font:900 84px/1 var(--display);color:transparent;margin:0 0 6px}
.t-about .ab-yr{display:inline-block;font:800 12px/1 var(--display);letter-spacing:.1em;text-transform:uppercase;color:#00053E;background:var(--y);border-radius:999px;padding:5px 9px;margin:0 0 8px}
@media(max-width:899px){.t-about .ab-tl .cn{grid-row:1/span 3}.t-about .ab-yr{justify-self:start;align-self:end}}

.t-about .sec::before,.t-about .node{display:none}


.t-about video+img.still{display:none}
@media (prefers-reduced-motion:reduce){video{display:none}.t-about .ab-hrob video:not(#_){display:none}.t-about video+img.still{display:block}}
/* hero robot standing in the scene */
.t-about .ab-hero{position:relative}
.t-about .ab-hrob{position:absolute;right:max(24px,calc(50% - 600px));bottom:110px;width:250px;z-index:2;pointer-events:none}
.t-about .ab-hrob video,.t-about .ab-hrob img{width:100%;height:auto;display:block}
@media(max-width:899px){.t-about .ab-hrob{width:120px;right:8px;bottom:96px}}
.t-about .hero .trust{flex-wrap:nowrap}
.t-about .hero .trust li{white-space:nowrap}
.t-about .btn{white-space:nowrap}
/* glance facts: 4 across, 2x2 below 1100, never 2+1 */
.t-about .ab-gl{grid-template-columns:repeat(4,1fr)!important}
.t-about .ab-gl>div{min-width:0}
@media(max-width:1100px){.t-about .ab-gl{grid-template-columns:1fr 1fr!important}}
/* story */


.t-about .ab-pc{margin:0;position:relative;border-radius:var(--r);overflow:hidden;box-shadow:0 20px 44px -18px rgba(0,5,62,.35);background:#fff}
.t-about .ab-pc img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}

.t-about .ab-pc figcaption{position:absolute;left:12px;bottom:12px;background:var(--ink);color:#fff;border-radius:10px;padding:8px 12px;border-left:5px solid var(--y);font-size:13px;line-height:1.25}
.t-about .ab-pc figcaption b{display:block;font-family:var(--display);font-size:15px;color:var(--y)}
.t-about .ab-tl{list-style:none;margin:64px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;border-top:2px solid var(--line);padding-top:28px}
.t-about .ab-tl .cn{-webkit-text-stroke:2px var(--blue)!important;font-size:84px}
.t-about .ab-tl h3{margin:0 0 6px;font-size:21px;color:var(--ink)}
.t-about .ab-tl p{margin:0;color:var(--txt)}
@media(max-width:899px){.t-about .ab-tl{grid-template-columns:1fr;gap:22px}.t-about .ab-tl li{display:grid;grid-template-columns:112px 1fr;column-gap:14px;align-items:center}.t-about .ab-tl .cn{font-size:52px;margin:0;grid-row:span 2}.t-about .ab-tl h3{align-self:end}.t-about .ab-tl p{align-self:start}}
/* promise */
.t-about .ab-ph{display:grid;grid-template-columns:1fr 210px;gap:32px;align-items:end}
.t-about .ab-prob{display:block;width:210px;margin-bottom:-24px}
.t-about .ab-prob video,.t-about .ab-prob img{width:100%;height:auto;display:block}
.t-about .ab-pr{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.t-about .ab-pr li{background:#fff;color:var(--txt);border-radius:var(--r);padding:22px 18px 22px;box-shadow:0 20px 40px -20px rgba(0,0,0,.5);border-top:6px solid var(--y);position:relative}
.t-about .ab-pr i{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--y);margin-bottom:14px}
.t-about .ab-pn{position:absolute;right:16px;top:12px;font:900 34px/1 var(--display);color:transparent;-webkit-text-stroke:1.5px var(--line)}
.t-about .ab-pr h3{font-size:18px;line-height:1.2;margin:0 0 8px;color:var(--ink)}
.t-about .ab-pr p{margin:0;font-size:15px;color:#4A5072}
@media(max-width:1100px){.t-about .ab-pr{grid-template-columns:1fr 1fr}.t-about .ab-pr li:first-child{grid-column:1/-1}}
@media(max-width:699px){.t-about .ab-pr{grid-template-columns:1fr}.t-about .ab-ph{grid-template-columns:1fr 110px;gap:12px}.t-about .ab-prob{width:110px;margin-bottom:-8px}}
.t-about .ab-team{margin-top:56px;display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center}
.t-about .ab-tm{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.t-about .ab-tm img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r);border:4px solid rgba(255,255,255,.9)}
.t-about .ab-tm img:nth-child(2){transform:translateY(-18px)}
.t-about .ab-h3{color:#fff;font-size:28px;line-height:1.15;margin:0 0 10px}
.t-about .ab-tt p:not(.eb){color:#C9D2EA}
@media(max-width:899px){.t-about .ab-team{grid-template-columns:1fr;gap:28px}}
.t-about .m-final video.bkm,.t-about .m-final img.still.bkm{width:100%;max-width:240px;height:auto;margin:0 auto}
.t-about .m-final video.bkm{display:block}
.t-about .m-final img.still.bkm{display:none}
@media (prefers-reduced-motion:reduce){.t-about .m-final img.still.bkm{display:block}}
.t-about .fc .t-about .m-final{width:200px!important}
@media(max-width:899px){.t-about .fc .t-about .m-final{width:130px!important}}
/* mobile v2 QA fixes */
@media(max-width:599px){
 .t-about .mx{display:none}
 .t-about .ab-hrob{top:64px;bottom:auto;width:104px;right:10px}
 .t-about .ab-tl li{grid-template-columns:128px 1fr!important}
 .t-about .ab-tl .cn{font-size:44px!important}
  .t-about .cbw.chips{display:grid!important;grid-template-columns:auto auto auto;gap:6px;justify-content:start}
 .t-about .cbw.chips .chl{grid-column:1/-1}
 .t-about .cbw.chips .chip{padding-left:11px;padding-right:11px;font-size:12.5px;white-space:nowrap}
}

.t-about .mo{display:none}
@media(max-width:599px){.t-about span.mo{display:inline}.t-about br.mo{display:inline}}
/* no angled edges: homepage hero wedge off on About */
.t-about .hero::after{content:none}
@media(max-width:899px){.t-about .ab-tl li>:not(.cn){grid-column:2}.t-about .ab-tl li{align-items:start}.t-about .ab-tl .cn{align-self:center}}
.t-about #book .cb .tile span{white-space:nowrap}
.t-about .ab-pn{-webkit-text-stroke:1.5px #6B7699}
/* hero robot is inside .wrap.hc (position:relative): feet planted on the photo's ground, never floating on flat navy */
.t-about .ab-hrob{bottom:-40px;top:auto}
@media(min-width:1200px){.t-about .ab-hrob{bottom:-64px}}
@media(max-width:899px){.t-about .ab-hrob{top:auto;bottom:calc(100% + 12px);width:120px;right:12px}}
@media(max-width:599px){.t-about .ab-hrob{top:auto;bottom:calc(100% + 10px);width:96px;right:10px}}

/* final: timeline lives inside the dark Promise section (yellow outline numerals) */
.t-about .ab-tl.ab-tl-d{border-top-color:rgba(255,255,255,.14);margin-top:56px}
.t-about .ab-tl.ab-tl-d .cn{-webkit-text-stroke:2px var(--y)!important;color:transparent}
.t-about .ab-tl.ab-tl-d h3{color:#fff}
.t-about .ab-tl.ab-tl-d p{color:rgba(255,255,255,.78)}
.t-about .ab-tm .ab-pc{margin:0;box-shadow:none;background:none;border-radius:var(--r)}
.t-about .ab-tm .ab-pc img{aspect-ratio:3/4}
.t-about .ab-tm .ab-pc figcaption{left:8px;bottom:8px;padding:6px 9px;font-size:12px}
.t-about .ab-tm .ab-pc figcaption b{font-size:13px}
.t-about .D .ab-tl small.ab-yr{color:#00053E}
@media(max-width:599px){.t-about .ab-tm .ab-pc figcaption{left:6px;bottom:6px;right:6px;padding:5px 7px}.t-about .ab-tm .ab-pc figcaption span{display:none}}
/* r1: pull quote uses the homepage's declared face (Roboto Condensed 700 20px). Nothing on the site self-hosted it, so it fell back to Arial Narrow/system on real devices; self-host a latin 700 subset, About-scoped */
@font-face{font-family:"Roboto Condensed";src:local("Roboto Condensed Bold"),local("RobotoCondensed-Bold"),url(assets/fonts/roboto-condensed-700-latin.woff)format("woff");font-weight:700;font-style:normal;font-display:swap}
/* r1: timeline numeral sits beside its step and top-aligns with the title row at every width; 2020 label follows the title */
.t-about .ab-tl li{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;column-gap:16px;align-items:start!important;align-content:start}
.t-about .ab-tl li>.cn{grid-column:1;grid-row:1/span 3;align-self:start!important;margin:0!important;line-height:.74!important;font-size:64px!important;padding-top:3px}
.t-about .ab-tl li>:not(.cn){grid-column:2}
.t-about .ab-tl h3{margin:0 0 6px;line-height:1.2}
.t-about .ab-tl .ab-yr{justify-self:start;align-self:start;margin:0 0 8px}
@media(max-width:899px){.t-about .ab-tl li>.cn{font-size:48px!important;min-width:84px}}
/* r2: hero Call icon matches home (navy = button text); pages.css paints .inner .hero .ic yellow, invisible on the yellow button */
.t-about .ab-hero .ctas .btn.call .ic{color:inherit}
/* v3 (designer-spec-v3 handoff): logo-colour tokens only; promise colour scoped to the white cards */
.inner .ab-hero ~ section, .inner .ab-hero{--txt:#00053E}
body.inner{color:#00053E}
.inner #services .sx-num{background:var(--y);color:var(--ink)}
.inner #promise .ab-pr li p, .inner #reviews figcaption, .inner #reviews figcaption span{color:rgba(0,5,62,.72)}

.inner p.mh{color:rgba(0,5,62,.72)}
/* v3 tablet (700-1199): hero text sits over the photo like home r6a-r6e (home.css), so the robot uses the desktop placement instead of the stacked-phone one */
@media(min-width:700px) and (max-width:899px){.t-about .ab-hrob{top:auto;bottom:-40px;width:170px;right:16px}}
/* v3: at 700-759 the desktop two-column Book form is too narrow for one-line service tiles (page overflowed by 5-15px); let tile labels wrap there like home */
@media(min-width:700px) and (max-width:759px){.t-about #book .cb .tile span{white-space:normal}}

/* v3b: #book form at tablet/desktop = homepage form, no stretch gaps, no overflow, chips on one row */
@media(min-width:700px){.t-about #book .wrap.fc{align-items:start!important}.t-about #book form.cb{align-self:start!important;align-content:start!important;height:auto!important}}
@media(min-width:700px) and (max-width:1199px){.t-about #book .cb .tile span{white-space:normal}}
@media(min-width:700px) and (max-width:899px){.t-about #book .cbw.chips{display:flex!important;flex-wrap:wrap!important;gap:6px!important;align-items:center}.t-about #book .cbw.chips .chl{flex:0 0 100%}.t-about #book .cbw.chips .chip{flex:0 1 auto;white-space:nowrap;padding-left:9px!important;padding-right:9px!important;font-size:13px}}
@media(min-width:700px) and (max-width:899px){.t-about #book .cb .tile{padding-inline:4px}.t-about #book .cb .tile span{white-space:nowrap!important;font-size:11.5px;letter-spacing:-.01em}}
/* v3c: tablet hero trust row = home's wrapping flex row */
@media(min-width:700px){.t-about .hero ul.trust{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;gap:10px 22px!important;align-items:center}.t-about .hero ul.trust li{white-space:nowrap}}
@media(min-width:700px) and (max-width:895px){.t-about .hero ul.trust{max-width:400px}}
/* v3d */
.t-about #services .shead h2{text-wrap:balance}
.t-about #services .shead .intro{text-wrap:pretty}
.t-about .ab-ph{grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto auto auto;column-gap:24px!important;row-gap:0!important;align-items:end!important}
.t-about .ab-ph>div{display:contents}
.t-about .ab-ph .eb{grid-column:1;grid-row:1}
.t-about .ab-ph h2{grid-column:1;grid-row:2;text-wrap:balance}
.t-about .ab-ph .intro{grid-column:1/-1;grid-row:3;max-width:none;text-wrap:pretty}
.t-about .ab-ph .ab-prob{grid-column:2;grid-row:1/span 2;align-self:end;width:150px!important;margin:-80px 0 4px!important}
@media(max-width:699px){.t-about .ab-ph .ab-prob{width:96px!important;margin:-44px 0 2px!important}}
.t-about .hero h1{text-wrap:balance}
@media(max-width:599px){
 .t-about .ab-tl li>.cn{grid-row:1/span 2!important}
 .t-about .ab-tl li>p{grid-column:1/-1!important;margin-top:8px}
 .t-about #book .fct p:not(.eb2){text-wrap:balance}
}


.t-about main :is(h2,h3){text-wrap:balance}
.t-about main :is(p,blockquote,figcaption){text-wrap:pretty}
.t-about #book .fct p:not(.eb2),.t-about .ab-ph .intro{text-wrap:balance!important}
@media(max-width:599px){.t-about #services .shead .intro{text-wrap:balance!important}}
/* v3e */
.t-about main blockquote,.t-about main blockquote p{text-wrap:balance!important}
.t-about main p,.t-about main .intro{text-wrap:balance!important}
.t-about main p.rt{text-wrap:balance!important}


/* a3g: 700-1023 the story card list grows with its open card so every card ends inside #services (88px bottom padding) */@media(min-width:700px) and (max-width:1023px){.t-about #services .sx-cards{height:auto!important;min-height:100%}}
/* a3h: "What you can count on" robot - grounded beside the eyebrow/title/intro block (right column, bottom-aligned with the intro); on phones it sits above the eyebrow so title and intro run full width */.t-about .ab-ph .intro{grid-column:1!important}.t-about .ab-ph .ab-prob{grid-column:2!important;grid-row:1/span 3!important;align-self:end!important;justify-self:end;width:150px!important;margin:0!important;transform:none!important}@media(min-width:1024px){.t-about .ab-ph .ab-prob{width:170px!important}}@media(max-width:699px){.t-about .ab-ph{grid-template-columns:minmax(0,1fr)!important}.t-about .ab-ph .ab-prob{grid-column:1!important;grid-row:1!important;justify-self:start;width:96px!important;margin:0 0 12px!important}.t-about .ab-ph .eb{grid-row:2!important}.t-about .ab-ph h2{grid-row:3!important}.t-about .ab-ph .intro{grid-row:4!important;grid-column:1!important}}
/* a3i: phones - "What you can count on" robot on the right beside the eyebrow/title/intro, vertically centred on the text block */@media(max-width:699px){.t-about .ab-ph{grid-template-columns:minmax(0,1fr) 92px!important;column-gap:14px!important}.t-about .ab-ph .ab-prob{grid-column:2!important;grid-row:1/span 3!important;align-self:center!important;justify-self:end;width:92px!important;margin:0!important}.t-about .ab-ph .eb{grid-row:1!important}.t-about .ab-ph h2{grid-row:2!important}.t-about .ab-ph .intro{grid-row:3!important;grid-column:1!important}}
/* a3i: timeline - mascot stills replace the 01/02/03 numbers (left column, equal left edge and gap, grounded on the title block) */.t-about .ab-tl li{grid-template-columns:124px minmax(0,1fr)!important;column-gap:18px!important}.t-about .ab-tl li>.cn.tlr{grid-column:1;grid-row:1/span 3!important;align-self:start!important;justify-self:start;width:124px!important;min-width:0!important;height:110px;font-size:0!important;line-height:0!important;padding:0!important;margin:0!important;-webkit-text-stroke:0!important;display:flex;align-items:flex-end}.t-about .ab-tl .tlr img{display:block;height:104px;width:auto;max-width:100%}@media(max-width:699px){.t-about .ab-tl li{grid-template-columns:92px minmax(0,1fr)!important;column-gap:14px!important}.t-about .ab-tl li>.cn.tlr{width:92px!important;height:84px;grid-row:1/span 2!important}.t-about .ab-tl .tlr img{height:80px}}
@media(max-width:699px){.t-about .ab-tl li{grid-template-columns:88px minmax(0,1fr)!important}.t-about .ab-tl li>.cn.tlr{width:88px!important;grid-row:1/span 3!important}.t-about .ab-tl li>p{grid-column:2!important;margin-top:0!important}}@media(min-width:700px){.t-about .ab-tl li{grid-template-columns:116px minmax(0,1fr)!important;column-gap:16px!important}.t-about .ab-tl li>.cn.tlr{width:116px!important}.t-about .ab-tl .tlr img{height:100px}}

/* a3j: phones - promise robot sized/placed like the homepage testimonials mascot: snug beside the text, grounded on the intro, flush right */@media(max-width:699px){.t-about .ab-ph{grid-template-columns:minmax(0,1fr) 124px!important;column-gap:10px!important}.t-about .ab-ph .ab-prob{align-self:end!important;justify-self:end!important;width:124px!important;margin:0!important}}
@media(max-width:699px){.t-about .ab-ph{grid-template-columns:minmax(0,1fr) 136px!important;column-gap:0!important}.t-about .ab-ph .ab-prob{width:136px!important;margin:0 0 22px 0!important}}@media(max-width:379px){.t-about .ab-ph{grid-template-columns:minmax(0,1fr) 116px!important}.t-about .ab-ph .ab-prob{width:116px!important}}
/* === About hero v4: team3 image + robot placement (hero rules only) === */
.t-about .ab-hero .hbg img{object-position:var(--hero-pos,50% 50%)}
@media(min-width:700px){.t-about .ab-hero .hc>*:not(.ab-hrob){max-width:502px}}
/* 700-899: robot stands on the lawn under the text, team at right */
@media(min-width:700px) and (max-width:899px){
 .t-about .ab-hero{padding-bottom:340px}
 .t-about .ab-hrob{top:calc(100% + 18px);bottom:auto;left:24px;right:auto;width:170px}
 .t-about .ab-hero .hbg img{object-position:var(--hero-pos,calc(100vw - 966px) 50%)}
}
/* 900-1199: robot 170 at right, team between text and robot */
@media(min-width:900px) and (max-width:1199px){
 .t-about .ab-hrob{width:170px;right:24px;left:auto}
 .t-about .ab-hero .hbg img{object-position:var(--hero-pos,27% 50%)}
}
/* 1200+: robot 250 at content right, team between */
@media(min-width:1200px){.t-about .ab-hero .hbg img{object-position:var(--hero-pos,45% 50%)}}

/* a4: footer + book identical to the homepage (undo inner-page pages.css overrides) */
html body.t-about .ft .fg>div+div p a{min-height:0;padding:0;margin:0;display:inline}
html body.t-about .ft .fg>div+div p br{display:inline}
html body.t-about .ft p.lic{line-height:inherit}
@media(max-width:699px){html body.t-about .ft{padding-bottom:12px!important}html body.t-about .ft .fg>div+div p a{display:inline-block;padding:12px 0;margin:-12px 0}}
html body.t-about section#book{padding-top:92px!important;padding-bottom:60px!important}@media(max-width:699px){html body.t-about section#book{padding-top:65px!important;padding-bottom:33px!important}}
html body.t-about .ft .fg>div+div p a{color:rgb(185,195,223)}html body.t-about #book .ic,html body.t-about #book svg.ic,html body.t-about #book .eb2,html body.t-about #book i{color:var(--y)}
html body.t-about .ft,html body.t-about #book{--y:#FED14D}html body.t-about .ft a{color:rgb(185,195,223)}html body.t-about #book .ic,html body.t-about #book svg.ic,html body.t-about #book .eb2,html body.t-about #book i{color:#FED14D}@media(max-width:699px){html body.t-about{padding-bottom:72px}}
/* a4: promise head 700+ - spare robot height goes into an empty top row so eyebrow/title/intro keep the 18/12 rhythm */@media(min-width:700px){html body.t-about .ab-ph{grid-template-rows:1fr auto auto auto!important}html body.t-about .ab-ph .eb{grid-row:2!important}html body.t-about .ab-ph h2{grid-row:3!important}html body.t-about .ab-ph .intro{grid-row:4!important}html body.t-about .ab-ph .ab-prob{grid-row:1/span 4!important}}
html body.t-about .ab-ph .intro{margin-bottom:0!important}html body.t-about .ab-pr{margin-top:0!important}html body.t-about .ab-ph{margin-bottom:24px!important}@media(min-width:700px){html body.t-about .ab-ph{margin-bottom:40px!important}}
/* a4: 700-899 hero robot grounded on the lawn, feet just above the stats bar */@media(min-width:700px) and (max-width:899px){html body.t-about .ab-hrob{top:calc(100% + 38px)!important}}
/* a4: phones - stats card: Trades value on one line (cell spans both columns, Hours moves up beside Serving since) */@media(max-width:699px){html body.t-about .ab-gl>div:nth-child(3){grid-column:1/-1;order:4}html body.t-about .ab-gl>div:nth-child(4){order:3}html body.t-about .ab-gl>div:nth-child(3) b{white-space:nowrap}}
@media(max-width:699px){html body.t-about .ab-gl>div:nth-child(3){grid-column:1/-1!important;order:4!important}html body.t-about .ab-gl>div:nth-child(4){order:3!important}html body.t-about .ab-gl>div:nth-child(3) .mo{display:none!important}html body.t-about .ab-gl>div:nth-child(3) .mx{display:inline!important}}

/* r6j: #promise robot = animated WebP (Android VP9-alpha artifacts) */.t-about .ab-prob img.still{display:none}@media (prefers-reduced-motion:reduce){.t-about .ab-prob img.anim{display:none}.t-about .ab-prob img.still{display:block}}
/* r6l: promise-wave2 (704x846) - same box, same height, right/bottom aligned */.t-about .ab-ph .ab-prob img.anim,.t-about .ab-ph .ab-prob img.still{width:85.82%;margin-left:auto}

/* ===== bang-about: promise run-in-place facing left + accr grid ===== */
/* sprite1 2026-10-31: steps(6)→steps(5); 6-cell strip with bg-pos 0→100% needs steps(N-1) or frames misalign (two partial robots). Not gintro1/combo2. */
/* Run strip is 6 cells @ 540x560. Loop in place; mirror to face left. */
.t-about .ab-prob.ab-prob-run{position:relative;overflow:hidden;line-height:0}
.t-about .ab-prob.ab-prob-run img.anim{
  display:block;width:100%;height:auto;max-width:none;
  transform:scaleX(-1);
  object-fit:cover;object-position:0 0;
  /* Hide raw strip; show via background animation on ::after host instead */
  opacity:0!important;position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
}
.t-about .ab-prob.ab-prob-run::before{
  content:"";display:block;width:100%;aspect-ratio:540/560;
  background:url(assets/m/hiw-run2/hiw-home-run-n3c-strip.webp?v=nov3col1) 0 0 / 1000% 100% no-repeat;
  transform:scaleX(-1);
  animation:ab-prob-run 750ms steps(9) infinite; /* runpace1 nov5: 83.33ms/frame = after-hours ahrx .41667s/5 */ /* sprite1: N-1 for 6-frame 0→100% (hiw-run2.js formula) */
}
.t-about .ab-prob.ab-prob-run img.still{
  display:none;width:100%;height:auto;transform:scaleX(-1);
}
@media (prefers-reduced-motion:reduce){
  .t-about .ab-prob.ab-prob-run::before{animation:none;background-position:0 0;display:none}
  .t-about .ab-prob.ab-prob-run img.still{display:block!important}
  .t-about .ab-prob.ab-prob-run img.anim{display:none!important}
}
@keyframes ab-prob-run{
  from{background-position:0 0}
  to{background-position:100% 0}
}
/* Keep prior size/placement; path is relative to about.css at site root */
/* Relative to CSS file location (site root): */
html body.t-about .ab-prob.ab-prob-run::before{
  background-image:url(assets/m/hiw-run2/hiw-home-run-n3c-strip.webp?v=nov3col1);
}

/* Accreditation card grid: 1..4 cards */
.t-about #bbb .ab-accr{
  list-style:none;margin:28px 0 0;padding:0;
  display:grid;gap:20px;
  grid-template-columns:1fr;
}
.t-about #bbb .ab-accr-card,
.t-about #bbb .ab-trust{
  display:flex;flex-wrap:wrap;align-items:center;gap:20px 24px;
  background:#fff;border-radius:var(--r,16px);
  padding:22px 22px;box-shadow:0 20px 40px -20px rgba(0,0,0,.18);
  border-top:6px solid var(--y,#FED14D);
}
.t-about #bbb .ab-accr-card .bbbn{flex:none}
.t-about #bbb .ab-accr-card h3{margin:0 0 8px;font-size:18px;line-height:1.25;color:var(--ink,#00053E)}
.t-about #bbb .ab-accr-card p{margin:0;font-size:15px;color:#4A5072}
.t-about #bbb > .wrap > .eb{margin-bottom:10px}
.t-about #bbb > .wrap > h2{margin:0}
@media(min-width:700px){
  .t-about #bbb .ab-accr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .t-about #bbb .ab-accr:has(> :only-child){grid-template-columns:minmax(0,1fr);max-width:640px}
}
@media(min-width:1100px){
  .t-about #bbb .ab-accr{grid-template-columns:repeat(2,minmax(0,1fr))}
  .t-about #bbb .ab-accr:has(> :nth-child(3)){grid-template-columns:repeat(3,minmax(0,1fr))}
  .t-about #bbb .ab-accr:has(> :nth-child(4)){grid-template-columns:repeat(2,minmax(0,1fr))}
  .t-about #bbb .ab-accr:has(> :only-child){grid-template-columns:minmax(0,560px)}
}
/* Timeline pills: keep .ab-yr pill look on all 4 */
.t-about #history .hiw .steps .ab-yr{
  display:inline-block;margin:6px 0 8px;padding:4px 10px;border-radius:999px;
  background:#FED14D;color:#00053E;font:700 12px/1 Saira,sans-serif;letter-spacing:.04em;text-transform:uppercase;
}
/* ===== /bang-about ===== */

/* nov3x4: play only while visible */
html body.t-about .ab-prob.ab-prob-run:not(.vis)::before{animation-play-state:paused!important}

/* about-faq1 (Bang 2026-11-05): About FAQ "Still have a question?" card = same as shared inner FAQ card (hvac/contact/reviews). Undo home.css robot-grid. */
@font-face{font-family:"STHRC";src:url(assets/fonts/roboto-condensed-700-latin.woff)format("woff");font-weight:700 900;font-style:normal;font-display:swap}
html body.t-about #faq .fql{display:flex!important;flex-direction:column!important}
html body.t-about #faq .fq-photo{min-height:220px}
html body.t-about #faq .fqcall{display:block!important;grid-template-columns:none!important;grid-template-areas:none!important;column-gap:normal!important;padding:20px!important;min-height:0!important;height:auto!important}
html body.t-about #faq .fqcall>div{display:block!important;width:auto!important;min-height:0!important}
html body.t-about #faq .fqcall .fqk{margin:0 0 4px!important;text-align:left!important;font-family:STHRC,"Roboto Condensed","Arial Narrow",system-ui,sans-serif!important;width:auto!important}
html body.t-about #faq .fqcall>div>p:not(.fqk){margin:0 0 14px!important;text-align:left!important;line-height:1.6!important;width:auto!important}
html body.t-about #faq .fqcall .ctas{display:flex!important;flex-direction:column!important;grid-template-columns:none!important;gap:10px!important;margin:0!important;width:auto!important}
html body.t-about #faq .fqcall .ctas .btn{width:100%!important;margin:0!important;line-height:1.6!important}
@media(max-width:699px){html body.t-about #faq .fqcall .ctas{flex-direction:row!important;flex-wrap:wrap}html body.t-about #faq .fqcall .btn{font-size:15px!important;padding:0 18px!important}}
html body.t-about #faq.sec .fqcall>div>p:not(.fqk),html body.t-about #faq.sec .fqcall .ctas .btn{line-height:25.6px!important}
html body.t-about #faq.sec .fqcall .ctas{flex-direction:row!important;flex-wrap:wrap!important}
@media(max-width:699px){html body.t-about #faq.sec .fql{flex-direction:row!important}html body.t-about #faq.sec .fq-photo{min-height:0}}

/* hiw-top1 nov5: remove empty 1fr navy band above How-we-work / promise head (a4).
   Robot stays beside eyebrow/title/intro (align end); no spare top grid row. */
@media(min-width:700px){
  html body.t-about .ab-ph{grid-template-rows:auto auto auto!important}
  html body.t-about .ab-ph .eb{grid-row:1!important}
  html body.t-about .ab-ph h2{grid-row:2!important}
  html body.t-about .ab-ph .intro{grid-row:3!important}
  html body.t-about .ab-ph .ab-prob{grid-row:1/span 3!important;align-self:end!important}
}

/* about-hiw-gap1 nov5: stop tall .ab-prob from inflating auto rows between eyebrow/title/intro.
   Keep text in one grid cell (undo display:contents); robot sits beside, align-end.
   Target eyebrow→title gap = 12px like #reviews .rh (was ~31.5 desktop / ~18 phone). */
html body.t-about .ab-ph>div{display:flex!important;flex-direction:column!important;align-items:flex-start!important;min-width:0}
html body.t-about .ab-ph{grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto!important;align-items:end!important;column-gap:24px!important;row-gap:0!important}
html body.t-about .ab-ph .eb,html body.t-about .ab-ph h2,html body.t-about .ab-ph .intro{grid-column:auto!important;grid-row:auto!important}
html body.t-about .ab-ph .eb{margin:0 0 12px!important}
html body.t-about .ab-ph h2{margin:0 0 12px!important}
html body.t-about .ab-ph .intro{margin:0!important;max-width:none!important}
html body.t-about .ab-ph .ab-prob{grid-column:2!important;grid-row:1!important;align-self:end!important;justify-self:end!important;margin:0!important;transform:none!important}
@media(min-width:1024px){html body.t-about .ab-ph .ab-prob{width:170px!important}}
@media(min-width:700px) and (max-width:1023px){html body.t-about .ab-ph .ab-prob{width:150px!important}}
@media(max-width:699px){html body.t-about .ab-ph{column-gap:0!important}html body.t-about .ab-ph .ab-prob{width:136px!important;margin:0 0 22px 0!important}}
@media(max-width:379px){html body.t-about .ab-ph .ab-prob{width:116px!important}}