/*
  FuelChief look, layer 5 (FC-LOOK, R-77 "look the same first"): the old site's own rules (capture raw/bundle.css, data)
  mapped onto master's markup, section by section, then tuned against the capture shots (qa/build/FC-LOOK.md). Loaded
  last by Code/SiteStyles/FuelChiefLook.cs, so these win over fc-tokens/base/chrome/sections. Each block names the old
  rule it copies.
*/

/* ---- Text colours and weights (old body #222123, strong 800) ---- */
:root { --c-ink: #222123; }
strong, b { font-weight: 800; }

/* ---- Page banners (FC-SYNC1): master's Banner style (MB-148: Basic, Landing, Industry) gives the old banners' heights,
   placement, column widths, spacing and text sizes and the Photo shape their CMS crops (1900 x 600, 1900 x 980), so the
   site keeps only its own colours: the words #e1dfdf, the layer over the photo in the old values (Basic a flat
   rgba(17,28,36,.5); Landing and Industry fading into the navy #2d3141 from halfway / 13 % down), and the Industry
   banner's small shield mark under the button (old .industries-banner, 26 x 30 px, 50 px under the button, 30 px below
   768 px; site artwork). ---- */
.hero--page-banner {
  --hero-basic-overlay: rgba(17, 28, 36, 0.5);
  --hero-landing-overlay: linear-gradient(180deg, rgba(45, 49, 65, 0) 50%, #2d3141 100%);
  --hero-industry-overlay: linear-gradient(180deg, rgba(45, 49, 65, 0) 13%, #2d3141 100%);
}
.hero--page-banner :is(.hero__title, .hero__title.eyebrow--pill, .hero__heading, .hero__intro) { color: #e1dfdf; }
.hero--page-banner.hero--style-industry .hero__text::after {
  content: ""; display: block; align-self: center; width: 26px; height: 30px; margin-top: 50px;
  background: url("/images/site/small-shield.svg") center / contain no-repeat;
}
@media (max-width: 767.98px) { .hero--page-banner.hero--style-industry .hero__text::after { margin-top: 30px; } }
/* Landing (old .main-banner): the label in the editor's own case (the old capitals rule didn't reach its .panel-title;
   the Industry one did), and the photo covering a 705 px box centred on the 630 px band (measured in FC-LOOK), not the
   band itself. */
.hero--page-banner.hero--style-landing :is(.hero__title, .hero__title.eyebrow--pill) { text-transform: none; }
.hero--page-banner.hero--style-landing.hero--on-media .hero__media picture {
  inset: auto 0; top: 50%; left: 0; width: 100%; min-width: 0; height: 705px; aspect-ratio: auto; transform: translateY(-50%);
}

/* ---- Heading band with the shield (old .call-to-action.section-heading-v2.bg-header-shield.text-center): 500 px high
   content box centred, the shield behind the words is the Hero's Band artwork (MB-144, master's 150 / 60 px), heading
   35/32/30/26 px weight 800 #fafafa, a 720 px column, 50 px gap, text 16/20 px #fafafa; the editor's blank line is the
   old paragraph break. ---- */
.hero--band.band--dark.hero--centred { position: relative; min-height: 0; }
.hero--band.band--dark.hero--centred .hero__inner { position: relative; z-index: 1; padding: var(--section-space) 0; justify-content: center; align-items: center; max-width: none; }
.hero--band.band--dark.hero--centred .hero__text { width: min(720px, 100% - 30px); max-width: none; min-height: 500px; display: flex; flex-direction: column; justify-content: center; }
.hero--band.band--dark.hero--centred .hero__copy { display: flex; flex-direction: column; gap: 50px; }
.hero--band.band--dark.hero--centred .hero__heading { margin: 0; max-width: none; font-size: 35px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #fafafa; }
.hero--band.band--dark.hero--centred .hero__aside:not(:empty) { margin: 0; }
.hero--band.band--dark.hero--centred .hero__intro { margin: 0; max-width: none; font-size: 16px; font-weight: 500; line-height: 1.25; letter-spacing: 0; color: #fafafa; white-space: pre-line; }
@media (max-width: 1199.98px) { .hero--band.band--dark.hero--centred .hero__heading { font-size: 32px; } }
@media (max-width: 991.98px) {
  .hero--band.band--dark.hero--centred .hero__heading { font-size: 30px; }
}
@media (max-width: 575.98px) {
  .hero--band.band--dark.hero--centred .hero__inner { padding: 30px 0 50px; }
  .hero--band.band--dark.hero--centred .hero__heading { font-size: 26px; }
}

/* ---- Image and text on navy after a heading band (old .panel-text-image.pt-0): no space above; words #eeeeee, the
   heading white. ---- */
.hero--band + .image-text { padding-top: 0; }
.image-text.band--deep .image-text__text,
.image-text.band--dark .image-text__text,
.image-text.band--deep .image-text__bullets,
.image-text.band--dark .image-text__bullets { color: #eeeeee; }
.image-text.band--deep .image-text__heading,
.image-text.band--dark .image-text__heading { color: #ffffff; }

/* ---- Red-tick row (old .panel-content-featurebox.red-ticks on navy): no cards; the 46 px tick left of its words (20 px),
   title 18/17/16 px weight 800 and text 14 px (16 px on phones) in #fafafa, 10 px apart; four a row from 1200 px, two
   from 576 px, one below; 20 px between. The old band space above and below (150 px) unless the old row is pt-0 / pb-0
   (MB-153 No space above / below; FC-FIX4: the earlier "no space under the row" held only for the pb-0 rows). ---- */
.feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__item {
  display: flex; flex-direction: row; align-items: flex-start; gap: 20px; padding: 0; background: none; text-align: left;
}
.feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__icon { flex: 0 0 46px; width: 46px; height: 46px; margin: 0; }
.feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__icon img { width: 46px; height: 46px; }
.feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__body { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; }
.feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__title { margin: 0; font-size: 18px; font-weight: 800; line-height: 1.15; letter-spacing: -3%; color: #fafafa; }
.feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__text { margin: 0; font-size: 14px; font-weight: 500; line-height: 1.25; letter-spacing: -2%; color: #fafafa; }
@media (max-width: 1199.98px) { .feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 991.98px) { .feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__title { font-size: 17px; } }
@media (max-width: 575.98px) {
  .feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__list { grid-template-columns: minmax(0, 1fr); }
  .feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__title { font-size: 16px; }
  .feature-grid--icons.band--deep:not(.feature-grid--intro-beside) .feature-grid__text { font-size: 16px; }
}



/* ---- FAQ (old .text-faq; old sections default to #fafafa, `section{background-color:#fafafa}`): its space as the old
   section's, 150 / 100 / 60 below 992 / 30 below 576 px, the old no-padding-top / no-padding-bottom as the section's own
   No space above / below (FC-FIX5: was no space above on every FAQ; Health's old FAQ has it below), heading 26/24/22 px weight 800 #222123, 50 px to the questions; boxes #f6f7f8 with a 1 px navy line,
   3 px corners, 20 px inside, 12 px apart, #fafafa on hover and open, no growing on hover (the old scale(1) !important);
   question 18/17/16 px weight 800 #222123 with 40 px kept for the arrow; answer 16/20 px across the box. ---- */
.faq.band--plain { background: #fafafa; }
.faq {
  --faq-gap: 12px; --faq-item-bg: #f6f7f8; --faq-item-border: #2d3141; --faq-item-border-width-open: 1px; --faq-item-radius: 3px;
  --faq-item-padding: 20px; --faq-question-size: 18px; --faq-question-weight: 800; --faq-question-weight-open: 800;
  --faq-question-gap-open: 10px; --faq-arrow-box: 40px; --faq-answer-measure: none; --faq-hover-scale: 1;
}
@media (max-width: 991.98px) { .faq { --section-space: 60px; } }
@media (max-width: 575.98px) { .faq { --section-space: 30px; } }
.faq .faq__heading { font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #222123; }
.faq .faq__list { margin-top: 50px; }
.faq .faq__item:hover, .faq .faq__item.is-open { background: #fafafa; }
.faq .faq__question { color: #222123; letter-spacing: -3%; line-height: 1.15; gap: 0; }
.faq .faq__question-heading { line-height: 1.15; }
/* old .box-arrow: out of the flow, a 40 px box at the item's top, 10 px in from the right; a thin 22x11 px chevron
   (the text keeps the old 40 px right space) */
.faq .faq__question { padding-right: 40px; }
.faq .faq__arrow { position: absolute; top: 0; right: 9px; width: 22px; height: 40px; margin: 0; }
.faq .faq__arrow svg { flex: none; width: 42px; height: 42px; overflow: visible; }
.faq .faq__arrow path { stroke-width: 0.6; stroke-linecap: butt; stroke-linejoin: round; }
.faq .faq__answer-text { font-size: 16px; font-weight: 500; line-height: 1.25; color: #222123; }
@media (max-width: 991.98px) { .faq { --faq-question-size: 17px; } .faq .faq__heading { font-size: 24px; } }
@media (max-width: 575.98px) { .faq { --faq-question-size: 16px; } .faq .faq__heading { font-size: 22px; } }

/* ---- Row of numbers (old .panel-content-featurebox.shield-separator): the small red shield (26 x 30 px) between the
   numbers with 26 px each side, numbers 25 % less 78 px wide, from the left at 1400 px and up; figure 65/60/46 px weight
   800, 20 px to the caption (16/20 px), 20 px to the text (14/17.5 px #7c868d, 16/20 px on phones); 30 px apart stacked. */
.stats--row {
  --stats-row-mark: url("/images/site/small-shield.svg") center / 26px 30px no-repeat;
  --stats-row-mark-w: 26px; --stats-row-mark-h: 30px; --stats-row-mark-space: 26px; --stats-row-gap: 30px;
  --stats-row-figure-fs: 65px; --stats-row-figure-fs-mid: 65px; --stats-row-figure-fs-phone: 46px;
  --stats-row-figure-fw: 800; --stats-row-figure-lh: 1.15; --stats-row-figure-ls: -2%;
  --stats-row-label-space: 20px; --stats-row-text-space: 20px; --stats-row-label-fs: 16px;
  --stats-row-text-fs: 14px; --stats-row-text-fs-phone: 16px; --stats-row-text-colour: #7c868d;
}
.stats--row .stats__row-figure, .stats--row .stats__row-label { color: #eeeeee; }
.stats--row .stats__row-label { line-height: 1.25; }
.stats--row .stats__row-text { line-height: 1.25; letter-spacing: -2%; }
@media (max-width: 991.98px) { .stats--row { --stats-row-figure-fs: 60px; --stats-row-figure-fs-mid: 60px; } }
/* FC-FIX6: the old words keep their -2 % on phones too (old .shield-separator p at 390: -2 %). */
@media (min-width: 1400px) { .stats--row .stats__row-list { justify-content: flex-start; } }

/* ---- Image and text (old .panel-text-image-gallery-slider): from 1200 px the words centred against the photo; with the
   photo on the right the words keep 2rem (40 px) from it (old .alt .col-content padding-right: 2rem); the label is a
   full-width line. ---- */
.image-text .image-text__eyebrow { display: block; }
@media (min-width: 1200px) {
  .image-text .image-text__inner { align-items: center; }
  .image-text--image-right .image-text__body { padding-right: 40px; }
  /* FC-FIX5: the old photo column is not centred: the photo sits at its top (.col-images, slick at the top) */
  .image-text .image-text__media { align-self: flex-start; }
}
/* FC-FIX5: the old label (h2.panel-title) has no border (master's eyebrow keeps a 1 px transparent one: 2 px taller);
   the old list sits 20 px under the text (.panel-content ul margin-top) */
.image-text .image-text__eyebrow { border-width: 0; }
.image-text .image-text__body > .image-text__text + .image-text__bullets { margin-top: 20px; }
/* old lists are inline-block (section ul{display:inline-block}) on the 20 / 30 px body line: 3 px under them */
.image-text .image-text__bullets { margin-bottom: 3px; }
/* on white (old .bg-white): the button #eee with the grey line and navy words, red on hover (#c4161c pressed), its
   arrow the thin chevron */
.image-text.band--plain .image-text__button { --btn-2-bg: #eeeeee; }
.image-text.band--plain .image-text__button:is(:hover, :focus-visible) { border-color: var(--fc-red); }
.image-text.band--plain .image-text__button:hover:active { --btn-hover-bg: #c4161c; border-color: #c4161c; }
.image-text.band--plain .image-text__button .action-arrow path:first-child { display: none; }

/* ---- Article pages (old .article-builder): the main column from the page gutter (100 px at 1440, 30 px on phones) to
   100 px before the related column, which runs 360 px to the page edge with 30 px kept on its right (old
   .article-builder-related padding-right: 30px) and starts 150 px down; every body block 75 px above and below (50 px
   below 1200 px, 30 px below 992 px, 15 px below 576 px) with a 1 px #aeb3b7 line between blocks; headings 35 px weight
   800 navy (26 px below 576 px), 10 px to the text, text 16/20 px navy, 20 px between paragraphs; contents links 20 px
   apart with the small red shield 30 px in. Related card #eee, 25 px inside, title 26/24/22 px, items 25 px apart with
   their title 26 px weight 800 navy and text 16/22 px weight 400 black 15 px under it. ---- */
.article-layout { padding: 0 0 0 var(--page-gutter); column-gap: 100px; row-gap: 0; }
.article-layout__main > .umb-block-list > * { padding-block: 75px; border-bottom: 1px solid #aeb3b7; }
.article-layout__main > .umb-block-list > :last-child { border-bottom: 0; }
.article-layout__main > .umb-block-list > .text-section:not(:has(:not(p:empty))) { display: none; }
.article-layout__main .text-section__heading,
.article-layout__main .article-contents__heading { margin: 0 0 10px; font-size: 35px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #2d3141; }
.article-layout__main .body-text { color: #2d3141; }
.article-layout__main .body-text p { margin: 0 0 20px; font-size: 16px; line-height: 1.25; }
.article-layout__main .body-text p:last-child { margin-bottom: 0; }
.article-layout__main .article-contents { margin: 0; }
.article-layout__main .article-contents__item { margin: 0; padding-left: 30px; position: relative; line-height: 20px; }
.article-layout__main .article-contents__item::before { content: ""; position: absolute; left: 0; top: 3px; width: 16px; height: 14px; background: url("/images/site/small-shield.svg") center / contain no-repeat; }
.article-related { margin: 150px 30px 150px 0; padding: 25px; background: #eeeeee; border: 0; border-radius: 0; }
.article-related__heading { margin: 0; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #2d3141; }
.article-related__item { display: flex; flex-direction: column; gap: 15px; padding: 25px 0; color: #000; }
.article-related__title { font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #2d3141; }
.article-related__text { margin: 0; font-size: 16px; font-weight: 400; line-height: 22px; color: #000; }
@media (min-width: 992px) { .article-layout--with-related { grid-template-columns: minmax(0, 1fr) 360px; } }
@media (max-width: 1199.98px) { .article-layout__main > .umb-block-list > * { padding-block: 50px; } }
@media (max-width: 991.98px) {
  .article-layout { padding: 0 var(--page-gutter); }
  .article-layout__main > .umb-block-list > * { padding-block: 30px; }
  .article-related { margin: 0 0 50px; padding-inline: 30px; }
  .article-related__heading { font-size: 24px; }
}
@media (max-width: 575.98px) {
  .article-layout { padding: 0 30px; }
  .article-layout__main > .umb-block-list > * { padding-block: 15px; }
  .article-layout__main .text-section__heading, .article-layout__main .article-contents__heading { font-size: 26px; }
  .article-related__heading { font-size: 22px; }
}

/* ---- Article pages without the side columns (insights; the same old .article-builder blocks across the page): each
   text block 75/50/30/15 px above and below inside the page gutters, the 1 px #aeb3b7 line between blocks, the same
   headings and text as above. ---- */
.site-main > .umb-block-list > .text-section:not(.band) { position: relative; margin: 0; padding: 75px var(--page-gutter); color: #2d3141; }
.site-main > .umb-block-list > .text-section:not(.band) + .text-section::before { content: ""; position: absolute; top: 0; left: var(--page-gutter); right: var(--page-gutter); border-top: 1px solid #aeb3b7; }
.site-main > .umb-block-list > .text-section:not(.band) .text-section__heading,
.site-main > .umb-block-list > .text-section:not(.band) h2 { margin: 0 0 10px; font-size: 35px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #2d3141; }
.site-main > .umb-block-list > .text-section:not(.band) p { margin: 0 0 20px; font-size: 16px; line-height: 1.25; max-width: none; }
.site-main > .umb-block-list > .text-section:not(.band) p:last-child { margin-bottom: 0; }
.site-main > .umb-block-list > .text-section:not(.band) > *,
.site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band) { max-width: none; }
@media (max-width: 1199.98px) { .site-main > .umb-block-list > .text-section:not(.band) { padding-block: 50px; } }
@media (max-width: 991.98px) { .site-main > .umb-block-list > .text-section:not(.band) { padding-block: 30px; } }
@media (max-width: 575.98px) {
  .site-main > .umb-block-list > .text-section:not(.band) { padding-block: 15px; }
  .site-main > .umb-block-list > .text-section:not(.band) .text-section__heading, .site-main > .umb-block-list > .text-section:not(.band) h2 { font-size: 26px; }
}
/* Insights (several text blocks; old .article-builder blocks): 30 px in from the screen's edges below 576 px, as the
   article layout; the one-block legal pages keep the 15 px gutter, as theirs. */
@media (max-width: 575.98px) {
  .site-main > .umb-block-list:has(> .text-section:not(.band) + .text-section:not(.band)) > .text-section:not(.band) { padding-inline: 30px; }
  .site-main > .umb-block-list:has(> .text-section:not(.band) + .text-section:not(.band)) > .text-section:not(.band) + .text-section::before { left: 30px; right: 30px; }
}

/* ---- People cards (old .profiles .Profile, the same card in the people list and the team slider): #eee card with a
   1 px #e1dfdf line, 6 px corners, 12 px inside; the photo 3 px corners, landscape (old 268 x 200 at 1440 px); words 30 px
   below it, 18 px in, 10 px apart: name 18/17/16 px weight 800 navy, role 14 px (16 px on phones) after the red chevron,
   contacts and LinkedIn 14 px red #da2031 with the old 20 px icons, no underline; pointed at: #fafafa with a soft shadow
   (0.3 s, as the old card). Four a row 18 px apart from 1200 px. ---- */
.team__person { padding: 12px; background: #eeeeee; border: 1px solid #e1dfdf; border-radius: 6px; transition: all 0.3s linear; }
.team__person:hover { background: #fafafa; border-color: #fafafa; box-shadow: 0 0 25px 0 rgba(34, 33, 35, 0.15); }
.team__photo, .team__img { border-radius: 3px; overflow: hidden; }
.team__img { width: 100%; height: auto; object-fit: cover; }
.team__panel.band--muted { display: flex; flex-direction: column; gap: 10px; padding: 30px 18px 18px; background: none; }
.team__name { margin: 0; font-size: 18px; font-weight: 800; line-height: 1.15; letter-spacing: -3%; color: #2d3141; }
.team__role { display: flex; align-items: center; margin: 0; font-size: 14px; font-weight: 500; line-height: 1.25; color: #2d3141; }
.team__role::before { content: ""; flex: 0 0 25px; height: 20px; background: url("/images/site/chevron.svg") left / contain no-repeat; }
.team__contact { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; }
.team__contact-link { display: flex; align-items: center; gap: 5px; font-size: 14px; font-weight: 500; line-height: 1.25; color: #da2031; text-decoration: none; }
.team__contact-link:hover { color: #c4161c; }
.team__contact-link .team__icon { width: 20px; height: 20px; flex: 0 0 20px; background: left / contain no-repeat; color: transparent; }
.team__contact-link--email .team__icon { background-image: url("/images/site/email.svg"); }
.team__contact-link--phone .team__icon, .team__contact-link--mobile .team__icon { background-image: url("/images/site/phone.svg"); }
.team__contact-link--linkedin .team__icon { background-image: url("/images/site/linkedin.svg"); }
@media (min-width: 1200px) { .team__list--cols-4 { gap: 18px; } }
@media (max-width: 991.98px) { .team__name { font-size: 17px; } }
@media (max-width: 575.98px) { .team__name { font-size: 16px; } .team__role, .team__contact-link { font-size: 16px; } }

/* ---- Tanks video hero (old .vimeo-background.ratio-16x9): exactly 16:9 of the width inside the page gutters; the words
   in a 645 px column, 50 px apart (25 px below 1200 px), from 3.125rem down on phones, 6.25rem from 768 px, 9.375rem
   from 992 px and halfway from 1400 px (master's MB-122 "16:9 of the width" values, which the import did not set on this
   hero); label 22/19/18 px weight 800, heading 50/45/32 px on a 1.0 line, text 20/19/18 px, gone below 768 px. ---- */
.hero--full-screen:not(.hero--slides) {
  --fc-shape-h: calc((100vw - 2 * var(--page-gutter)) * 9 / 16);
  min-height: 0; height: var(--fc-shape-h);
}
.hero--full-screen:not(.hero--slides) .hero__inner { max-width: none; align-items: flex-start; padding: 3.125rem 0 0; justify-content: center; }
.hero--full-screen:not(.hero--slides) .hero__text { width: min(645px, 100% - 30px); max-width: none; display: flex; flex-direction: column; gap: 50px; }
.hero--full-screen:not(.hero--slides) .hero__rule,
.hero--full-screen:not(.hero--slides) .hero__aside:not(:has(*)) { display: none; }
.hero--full-screen:not(.hero--slides) .hero__copy { display: flex; flex-direction: column; gap: 50px; }
.hero--full-screen:not(.hero--slides) .hero__title,
.hero--full-screen:not(.hero--slides) .hero__title.eyebrow--pill { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; display: block; font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -3%; text-transform: none; color: #fafafa; }
.hero--full-screen:not(.hero--slides) .hero__heading { margin: 0; max-width: none; font-size: 50px; font-weight: 800; line-height: 1; letter-spacing: -4%; color: #fafafa; }
.hero--full-screen:not(.hero--slides) .hero__intro { margin: 0; max-width: none; font-size: 20px; font-weight: 500; line-height: 1.25; letter-spacing: -1%; color: #fafafa; }
@media (min-width: 768px) { .hero--full-screen:not(.hero--slides) .hero__inner { padding-top: 6.25rem; } }
@media (min-width: 992px) { .hero--full-screen:not(.hero--slides) .hero__inner { padding-top: 9.375rem; } }
@media (min-width: 1400px) { .hero--full-screen:not(.hero--slides) .hero__inner { padding-top: calc(var(--fc-shape-h) / 2); } }
@media (max-width: 1199.98px) {
  .hero--full-screen:not(.hero--slides) .hero__text, .hero--full-screen:not(.hero--slides) .hero__copy { gap: 25px; }
  .hero--full-screen:not(.hero--slides) .hero__intro { font-size: 19px; }
}
@media (max-width: 991.98px) {
  .hero--full-screen:not(.hero--slides) .hero__title { font-size: 19px; }
  .hero--full-screen:not(.hero--slides) .hero__heading { font-size: 45px; }
  .hero--full-screen:not(.hero--slides) .hero__intro { font-size: 18px; }
}
@media (max-width: 767.98px) { .hero--full-screen:not(.hero--slides) .hero__intro { display: none; } }
@media (max-width: 575.98px) {
  .hero--full-screen:not(.hero--slides) .hero__title { font-size: 18px; }
  .hero--full-screen:not(.hero--slides) .hero__heading { font-size: 32px; }
}
.team .team__photo { background: none; }
.team .team__photo picture { height: 100%; }
.team .team__img { height: 100%; }
.team .team__panel .team__contact-link { color: #da2031; text-decoration: none; min-height: 0; }
.team .team__panel .team__contact-link:hover { color: #c4161c; }
.team.band--plain { background: #fafafa; }
@media (min-width: 576px) and (max-width: 1199.98px) { .team .team__list--cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; } }

/* ---- Text band on navy (old .panel.panel-text-image.bg-blue with words only): a centred 960 px column; label 16 px
   capitals weight 800 #eee, 26 px to the heading 20/25 px weight 500 #e1dfdf, 45 px to the text 16/20 px #eee (20 px
   between paragraphs); the table in the old Bootstrap table look: the system font 14/21 px, 16 px x 20 px cells, header
   row red #da2031 with white weight 600, body rows white and #f2f2f2 in turn with #212529 words; sub-headings 26 px weight
   800 #fafafa; list links red with the small red shield 30 px in. ---- */
.text-section--band.band--deep { padding: var(--section-space) var(--page-gutter); }
.text-section--band.band--deep > * { width: min(960px, 100%); max-width: none; margin-inline: auto; }
.text-section--band.band--deep .text-section__eyebrow { margin-top: 0; margin-bottom: 26px; font-size: 16px; font-weight: 800; line-height: 1.15; text-transform: uppercase; color: #eeeeee; }
.text-section--band.band--deep .text-section__heading { margin: 0 auto 45px; font-size: 20px; font-weight: 500; line-height: 1.25; letter-spacing: -1%; color: #e1dfdf; }
.text-section--band.band--deep .body-text { color: #eeeeee; }
.text-section--band.band--deep .body-text > * { max-width: none; }
.text-section--band.band--deep .body-text p { margin: 0 0 20px; font-size: 16px; line-height: 1.25; }
.text-section--band.band--deep .body-text h3 { margin: 50px 0 20px; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #fafafa; }
.text-section--band.band--deep .body-text ul { margin: 0 0 20px; padding: 0; list-style: none; }
.text-section--band.band--deep .body-text li { position: relative; padding-left: 30px; line-height: 20px; }
.text-section--band.band--deep .body-text li::before { content: ""; position: absolute; left: 0; top: 3px; width: 16px; height: 14px; background: url("/images/site/small-shield.svg") center / contain no-repeat; }
.text-section--band.band--deep .body-text li a { color: #da2031; text-decoration: none; }
/* Without a label (old .panel-text-image.alt with no photo, e.g. Safety and Compliance): the heading is the old
   .panel-subtitle, 35/32/30/26 px weight 800 on 1.15, white, left, 25 px to the text; the links red without underline. */
.text-section--band.band--deep:not(:has(.text-section__eyebrow)) .text-section__heading {
  margin: 0 0 25px; font-size: 35px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #fafafa;
}
.text-section--band.band--deep:not(:has(.text-section__eyebrow)) .body-text a { color: #da2031; text-decoration: none; }
@media (max-width: 1199.98px) { .text-section--band.band--deep:not(:has(.text-section__eyebrow)) .text-section__heading { font-size: 32px; } }
@media (max-width: 991.98px) { .text-section--band.band--deep:not(:has(.text-section__eyebrow)) .text-section__heading { font-size: 30px; } }
@media (max-width: 575.98px) { .text-section--band.band--deep:not(:has(.text-section__eyebrow)) .text-section__heading { font-size: 26px; } }
.text-section--band .text-table { margin: 30px 0; }
.text-section--band .text-table table { width: 100%; border-collapse: collapse; background: #ffffff; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; font-size: 14px; line-height: 21px; }
.text-section--band .text-table th,
.text-section--band .text-table td { padding: 16px 20px; border: 0; text-align: left; vertical-align: top; } /* FC-FIX6: the old cells' 16 x 20 px (R3) */
.text-section--band .text-table th { background: #da2031; color: #ffffff; font-weight: 600; }
.text-section--band .text-table td { color: #212529; font-weight: 400; }
.text-section--band .text-table tbody tr:nth-child(even) td { background: #f2f2f2; }

/* ---- Person page (old .element-profile, Bootstrap on a 20 px root; no saved HTML, measured on the capture): #fafafa
   ground; from 768 px a 1190 px box centred (125 px each side at 1440 px), the words left, the 570 px square photo right,
   both 150 px under the header; name 2rem = 40 px weight 800 black, 12 px to the role 20 px weight 300 #212529, 20 px to
   the links 20/30 px red without underline. ---- */
.site-main:has(> .person-page) { background: #fafafa; }
.person-page { --person-page-radius: 0; --person-page-border: 0; --person-page-name-fs: 40px; --person-page-role-fs: 20px; --person-page-photo-max: 570px; }
.person-page__name { font-weight: 800; line-height: 1.2; letter-spacing: 0; color: #000000; }
.person-page__role { margin-top: 12px; font-weight: 300; line-height: 1.5; color: #212529; }
.person-page__contact { margin-top: 20px; gap: 0; }
.person-page__contact-link { font-size: 20px; font-weight: 400; line-height: 30px; min-height: 0; color: #da2031; text-decoration: none; }
@media (min-width: 768px) {
  .person-page { width: min(1190px, 100% - 2 * var(--page-gutter) - 50px); margin-inline: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 50px; }
  .person-page__photo { justify-self: stretch; max-width: none; }
}
@media (max-width: 767.98px) {
  .person-page { width: calc(100% - 60px); margin-inline: auto; padding: 30px 0; gap: 30px; }
  .person-page__name { font-size: 26px; }
  .person-page__role { margin-top: 8px; font-size: 16px; }
  .person-page__contact { margin-top: 20px; }
  .person-page__contact-link { min-height: 0; line-height: 24px; }
}

/* A page without a banner (the Australian article country pages, the legal pages, one case study): the old page showed
   no page title of its own (the legal pages' title line is their Text section's heading), so the template's page name h1
   stays for screen readers only (as MB-149's hidden heading, which needs a Hero first). */
.site-main > h1:first-child {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

/* Legal pages (one text block; old .text-image.privacy-policy): the title line is the old .text-image-title, 50 / 45 below
   992 / 32 below 576 px, weight 800, 100 % lines, 50 px to the text (30 below 768), 150 px under the top of the page area
   from 1200 px; the sub-headings the old .text-image-content h4 (26 / 24 below 992 / 22 below 576, 115 % lines, 10 px under);
   the text #222123 (FC-FIX5: capture computed styles; FC-FIX2's 48 / 46 px and the browser's own h3 corrected). */
.site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band) > .text-section__heading {
  margin-bottom: 50px; font-size: 50px; line-height: 1;
}
.site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):has(> .text-section__heading) .body-text h2 { font-size: 26px; }
.site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):has(> .text-section__heading) .body-text :is(h3, h4) {
  margin: 0 0 10px; font-size: 26px; line-height: 1.15; font-weight: 800; letter-spacing: -4%; color: #2d3141;
}
.site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):has(> .text-section__heading) .body-text :is(p, li) { color: #222123; }
@media (min-width: 1200px) {
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):first-child:has(> .text-section__heading) { padding-top: 150px; }
}
/* the old section's space above equals its space below at every width: 100 / 60 below 992 / 30 below 576 px */
@media (max-width: 1199.98px) {
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):first-child:has(> .text-section__heading) { padding-top: 100px; }
}
@media (max-width: 991.98px) {
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):first-child:has(> .text-section__heading) { padding-top: 60px; }
}
@media (max-width: 575.98px) {
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):first-child:has(> .text-section__heading) { padding-top: 30px; }
}
@media (max-width: 991.98px) {
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band) > .text-section__heading { font-size: 45px; }
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):has(> .text-section__heading) .body-text :is(h3, h4) { font-size: 24px; }
}
@media (max-width: 767.98px) {
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band) > .text-section__heading { margin-bottom: 30px; }
}
@media (max-width: 575.98px) {
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band) > .text-section__heading { font-size: 32px; }
  .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):has(> .text-section__heading) .body-text :is(h3, h4) { font-size: 22px; }
}

/* FC-FIX1 (QC M4): article and banner type as the old CSS. Page banner title (old .section-header-h2): -4 %. Article
   headings (.article-builder .block h2): 35 / 32 below 1200 / 30 below 992 / 26 below 576 px, 115 % lines; h3 in the
   text 26 / 24 below 992 / 22 below 576; "Related ..." and its card titles (.related-articles-title) and the case
   studies slider's title (.block__article-slider .block__title) the same 26 / 24 / 22. */
.hero.hero--page-banner .hero__text .hero__heading { letter-spacing: -4%; }
.article-layout .article-layout__main h2[class] { font-size: 35px; line-height: 1.15; letter-spacing: -4%; }
.article-layout .article-layout__main h3 { font-size: 26px; line-height: 1.15; letter-spacing: -4%; }
.article-related .article-related__heading, .article-related .article-related__title,
.article-cards.article-cards--slider .article-cards__heading { font-size: 26px; line-height: 1.15; }
@media (max-width: 1199.98px) { .article-layout .article-layout__main h2[class] { font-size: 32px; } }
@media (max-width: 991.98px) {
  .article-layout .article-layout__main h2[class] { font-size: 30px; }
  .article-layout .article-layout__main h3, .article-related .article-related__heading, .article-related .article-related__title,
  .article-cards.article-cards--slider .article-cards__heading { font-size: 24px; }
}
@media (max-width: 575.98px) {
  .article-layout .article-layout__main h2[class] { font-size: 26px; }
  .article-layout .article-layout__main h3, .article-related .article-related__heading, .article-related .article-related__title,
  .article-cards.article-cards--slider .article-cards__heading { font-size: 22px; }
}

/* FC-FIX1 (QC M5): the team slider's head as the old .profiles.offset-slider: the intro navy and 605 px wide (the
   heading's column), "View the team" the old light button (#eee, a #7c868d border, navy words, 167 px). */
.team .team__intro { max-width: 605px; color: var(--fc-navy); }
.team .team__all .btn { min-width: 167px; border-color: #7c868d; background: #eeeeee; color: var(--fc-navy); }

/* FC-FIX1 (QC M12): the person page photo. The old box is square at every width (measured on the capture's own shots:
   382 at 1024, 330 at 390). */
/* FC-FIX4 (FC-QC3 person pages, 16): the old photo fills the 570 px column at 1440 (capture: x 745-1314, 570 px tall for a
   square photo), so no 550 px box with a grey edge; the role line is the old 24 px (300, 1.25), 11 px under the name. */
.person-page__img { width: 100%; height: 100%; }
@media (min-width: 768px) {
  .person-page { --person-page-role-fs: 24px; }
  .person-page__role { margin-top: 11px; line-height: 1.25; }
  .person-page__contact { margin-top: 21px; }
}
/* phones (capture at 390): the name 26 px under the photo, the role 39 px under the name's top, the contact lines 30 px apart */
@media (max-width: 767.98px) {
  .person-page { row-gap: 20px; }
  .person-page__role { margin-top: 8px; }
  .person-page__contact { margin-top: 18px; }
  .person-page__contact-link { line-height: 30px; }
}
/* Article lists as the old .article-builder .block ul: no list indent, each item 30 px in, 20 px under the list. */
.article-layout__main ul:not([class]) { margin: 0 0 20px; padding-left: 30px; }

/* FC-FIX1 (QC B17): "The Fuelchief System" (Groups layout, MB-142): the old head is centred over the rows. */
.feature-grid:has(.feature-grid__group) .feature-grid__head { margin-inline: auto; text-align: center; }
.feature-grid:has(.feature-grid__group) .feature-grid__head > * { margin-inline: auto; }

/* FC-FIX1 (QC): the Tanks hero's small title (old .video-panel-title, 22 / 19 below 992 / 18 below 576 px, 800, -3 %)
   over the lead line as its heading (old .video-panel-leadtext, 50 / 45 / 32 px, -4 %). */
.hero--full-screen:not(.hero--slides) .hero__eyebrow.eyebrow--pill {
  margin: 0; padding: 0; border: 0; border-radius: 0; background: none;
  color: #fafafa; font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -3%; text-transform: none;
}
@media (max-width: 991.98px) { .hero--full-screen:not(.hero--slides) .hero__eyebrow.eyebrow--pill { font-size: 19px; } }
@media (max-width: 575.98px) { .hero--full-screen:not(.hero--slides) .hero__eyebrow.eyebrow--pill { font-size: 18px; } }

/* FC-FIX2 (QC spacing/style rows, article pages): the old col-lg-9 / col-lg-3 split from 992 px (the related column a
   quarter of the page, the main column's text inside the page gutter on both sides); the related card a Bootstrap
   .card (1 px rgba(0,0,0,.125) border, 5 px corners), 25 px inside (15 px left and right below 992 px, 30 px from the
   page edges); between the heading and each item the old <hr> (1 px, #212529 at 25 %) with 35 px above and below
   (20 px margins + the card's 15 px gap). */
@media (min-width: 992px) {
  .article-layout--with-related { grid-template-columns: minmax(0, 1fr) calc((100% + var(--page-gutter)) / 4); column-gap: var(--page-gutter); }
}
.article-related { border: 1px solid rgba(0, 0, 0, 0.125); border-radius: 5px; }
.article-related__heading { margin-bottom: 35px; }
.article-related .article-related__entry { border-top: 1px solid rgba(33, 37, 41, 0.25); }
.article-related .article-related__item { padding: 35px 0; }
@media (max-width: 991.98px) {
  .article-layout--with-related .article-related { margin-inline: calc(30px - var(--page-gutter)); padding: 25px 15px; }
}
@media (max-width: 575.98px) { .article-layout--with-related .article-related { margin-inline: 0; } }
/* the old site's plain paragraphs: 15 px below 992 px, 14 px up to 480 px (bundle.css "p" media rules) */
@media (max-width: 991px) { .article-related .article-related__text { font-size: 15px; } }
@media (max-width: 480px) { .article-related .article-related__text { font-size: 14px; } }
/* The old article's first block (.article-builder-highlight: the client's logo) shows its pictures at most 250 px wide. */
/* FC-FIX4 (FC-QC3 Citibank row): linked logos too (the old `p img`, Citibank's logo sits in its link: 250 px, not 300). */
.article-layout__main > .umb-block-list > .text-section:first-child p img { max-width: 250px; height: auto; vertical-align: middle; }
/* FC-FIX4 (FC-QC3 grey background row): the old article area (.article-builder: the main and related columns, across
   the window) is #fafafa on every article page. */
.article-layout { background: #fafafa; }
/* The old "Download Case Study" (.btn.btn-tertiary in the text block): a red 13 px capitals button, 15 px / 25 px inside,
   3 px corners, 10 px to the small light-grey arrow, 15 px under the text above; #c4161c on hover, #7c868d while pressed. */
.article-layout__main .body-text p > a.fc-download {
  display: inline-flex; align-items: center; gap: 10px; padding: 15px 25px;
  border-radius: 3px; background: #da2031; color: #eeeeee;
  font-size: 13px; font-weight: 700; line-height: 1; text-transform: uppercase; text-align: center; text-decoration: none;
  transition: all linear 0.3s;
}
.article-layout__main .body-text p > a.fc-download::after {
  content: ""; width: 12px; height: 13px; background: url("/images/site/light-grey-arrow-right.svg") center / contain no-repeat;
}
.article-layout__main .body-text p > a.fc-download:is(:hover, :focus-visible) { background-color: #c4161c; }
.article-layout__main .body-text p > a.fc-download:is(:hover, :focus-visible):active { background-color: #7c868d; }
.article-layout__main .body-text p:has(> a.fc-download) { margin-top: -5px; }
/* Article pages without the related column: the old main column keeps the page gutter on the right too. */
@media (min-width: 576px) { .article-layout:not(.article-layout--with-related) { padding-right: var(--page-gutter); } }
/* The old article video block (.blocklist__video): the heading and text across the column, left; the text 11 px under
   the heading, plain paragraphs (16/22 px, 400, #212529, 20 px apart), then the old empty line (22 px) over the video. */
.article-layout__main .video .video__inner { row-gap: 22px; }
.article-layout__main .video .video__body { width: 100%; max-width: none; margin: 0; text-align: start; }
.article-layout__main .video .video__text { margin-top: 11px; }
.article-layout__main .video .video__text p { margin: 0 0 20px; font-size: 16px; font-weight: 400; line-height: 22px; color: #212529; }
@media (max-width: 991px) { .article-layout__main .video .video__text p { font-size: 15px; } }
@media (max-width: 480px) { .article-layout__main .video .video__text p { font-size: 14px; } }
/* MB-153 (M-FIX2-1): the old line under the video's heading (h3.block-subtitle) is master's Line under the heading: 26 / 24 /
   22 px (from 992 / 576 px), 800 on 1.15, navy #2d3141, -4 %, 10 px under the heading and 10 px above what follows. */
.video.video--under .video__subheading { margin: 10px 0 0; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #2d3141; }
.video.video--under .video__subheading + .video__text { margin-top: 10px; }
@media (max-width: 991.98px) { .video.video--under .video__subheading { font-size: 24px; } }
@media (max-width: 575.98px) { .video.video--under .video__subheading { font-size: 22px; } }
/* Old article lists (section ul / section ol): no numbers or dots, each item 30 px in after the small red shield
   (16 x 18 px, 3 px down; at the top in numbered lists), the list as wide as its longest item, 20 px under it. */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(ul, ol) {
  display: inline-block; margin: 0 0 20px; padding: 0; list-style: none;
}
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(ul, ol) > li { position: relative; padding-left: 30px; line-height: 20px; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(ul, ol) > li::before {
  content: ""; position: absolute; left: 0; top: 3px; width: 16px; height: 18px; background: url("/images/site/small-shield.svg") left top / contain no-repeat;
}
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) ol > li::before { top: 0; }
@media (max-width: 575.98px) { :is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(ul, ol) > li { padding-bottom: 5px; } }

/* FC-FIX2 (QC style rows, team): the old .Profile-subtitle is #222123 with -2 % letter spacing. */
.team .team__role { color: #222123; letter-spacing: -2%; }
/* Below 1200 px the old intro stacks centred (heading, text, View the team), 30 px apart, the text across the column. */
@media (max-width: 1199.98px) {
  .team .team__head { text-align: center; }
  .team .team__intro { max-width: none; margin-top: 30px; }
  .team .team__intro p { margin-top: 0; }
  .team .team__all { margin-top: 30px; }
}

/* FC-FIX2 (QC style/spacing rows, image and text): the old .panel-text-image .col-content is a column with 25 px between
   its parts (label, heading, text, button; 30 px below 768 px); the label 115 % lines. (Replaces FC-LOOK's per-section
   gaps, which made up for the label's taller lines.) */
.image-text .image-text__eyebrow { margin-bottom: 0; line-height: 1.15; }
.image-text .image-text__body > * + * { margin-top: 25px; }
@media (max-width: 767.98px) { .image-text .image-text__body > * + * { margin-top: 30px; } }
/* FC-FIX6: the team photo shapes (old CMS crops 309 x 288 in the slider, 268 x 200 in the People grid) come from
   appsettings Site:Team:SliderPhotoShape / GridPhotoShape (FC-MFIX6), not from crops here. */

/* FC-SYNC2: the Case Studies listings with the filter above the heading (MB-152, M-FIX-15), spaced as the old article
   list (measured on the old page): from 768 px the filter's top 94 px over the page numbers' top (their middle on the
   old 25 px boxes), 100 px under the numbers to "More case studies" / "Case Studies", the cards 50 px under it; below
   768 px 51 px under the filter, 30 px under the numbers and 30 px under the heading. */
.article-cards__listing > .article-filter:has(+ .article-pager--top) { margin-bottom: 40px; }
.article-cards__listing > .article-filter + .article-pager--top { margin-bottom: 90px; }
.article-cards__listing > .article-filter + .article-pager--top + .article-cards__head { margin-top: 0; margin-bottom: 50px; }
@media (max-width: 767.98px) {
  .article-cards__listing > .article-filter:has(+ .article-pager--top) { margin-bottom: 50px; }
  .article-cards__listing > .article-filter + .article-pager--top { margin-bottom: 30px; }
  .article-cards__listing > .article-filter + .article-pager--top + .article-cards__head { margin-bottom: 30px; }
}

/* FC-FIX3 (FC-QC2 article gaps, 34 pages): the article text blocks' headings as the old h3 (no space above, 10 px below). */
.article-layout .text-section.body-text :is(h2, h3) { margin: 0 0 10px; }
/* a one-item list after a paragraph starts 7 px lower, as on the old pages: the old lists are inline blocks in a 30 px
   line (the old wrapper's 20 px / 30 px text), so a one-line list sits 27 px under the paragraph, not 20 */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) p + :is(ul, ol):has(> li:only-child) { margin-top: 7px; }
/* the old line box also leaves 3 px under a block's last list (old: section ul:last-child { margin-bottom: 0 }) */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(ul, ol):last-child { margin-bottom: 3px; }
/* the article's video as the old block: 10 px from the heading to the video and twice the top padding below it (old
   75/150, 50/100, 30/60, 15/30); master's privacy note under the video (30 px) is kept and counted in that space */
.article-layout .video.video--under .video__inner { row-gap: 10px; }
/* FC-FIX6: this site hides master's note under the player (lead, E4), so the space under the video is the old block's own
   padding again: 15 / 30 / 50 / 75 px (old capture: 76 px under the player at 1440, 15 px at 390). */
.article-layout .video.video--under { padding-bottom: 15px; }
@media (min-width: 576px) { .article-layout .video.video--under { padding-bottom: 30px; } }
@media (min-width: 992px) { .article-layout .video.video--under { padding-bottom: 50px; } }
@media (min-width: 1200px) { .article-layout .video.video--under { padding-bottom: 75px; } }
/* FC-FIX3 (FC-QC2 style rows, 12 article pages): the article blocks' titles step down as the old .block-title: 35 px,
   32 px below 1200, 30 px below 992, 26 px below 576 (line height 115 %). */
@media (max-width: 1199.98px) { :is(.article-layout__main, .site-main > .umb-block-list > .text-section:not(.band)) .text-section__heading { font-size: 32px; line-height: 1.15; } }
@media (max-width: 991.98px) { :is(.article-layout__main, .site-main > .umb-block-list > .text-section:not(.band)) .text-section__heading { font-size: 30px; } }
@media (max-width: 575.98px) { :is(.article-layout__main, .site-main > .umb-block-list > .text-section:not(.band)) .text-section__heading { font-size: 26px; } }

/* FC-FIX3 (R-79, FC-QC2 blockers): Australia's Insights country page holds the old AU cards as Feature grid photo cards
   (Photo cards with Photo shape 3:2 mark them; one grid of 18 since FC-SYNC3, MB-153 M-FIX3-5; master's Article cards can't show
   the old cards without a photo or title, FC-SYNC3 note). Styled as the
   old listing (.list-blogposts .blogpost): the band #fafafa, 250 / 200 / 110 / 60 px above the cards (the old 150 / 100 / 60 / 30 px band padding and the list's
   100 / 100 / 50 / 30 px margin), 150 / 100 / 60 / 30 px below, three
   cards a row from 1200 px, two from 768, one below, 30 px apart; each card #eee with a 1 px #e1dfdf border and 12 px in,
   the picture the card's width, then 30 / 18 / 18 px around the words: the title 18 px (17 below 992, 16 below 576)
   weight 800, 30 px to the text (16 / 20 px 500), READ MORE in red capitals at the card's foot (at least 30 px under
   the text). Two old cards show no title: theirs stays for screen readers only. */
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 { padding: 250px 0 150px; background: #fafafa; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__inner { padding-inline: 100px; max-width: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__item {
  position: relative; display: flex; flex-direction: column; height: auto; min-height: 0; aspect-ratio: auto;
  padding: 12px; border: 1px solid #e1dfdf; background: #eeeeee; overflow: visible;
}
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__media { position: static; flex: 0 0 auto; width: 100%; height: auto; z-index: auto; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__media:not(:has(img)) { display: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__media::after { content: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__media-image { position: static; display: block; width: 100%; height: auto; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__body {
  position: static; flex: 1 1 auto; display: flex; flex-direction: column; justify-content: flex-start; gap: 0;
  padding: 30px 18px 18px; background: none; color: #222123;
}
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__body::before { content: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__title { margin: 0; color: #222123; font-size: 18px; font-weight: 800; line-height: 1.15; letter-spacing: -3%; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__link { color: inherit; text-decoration: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__text { margin: 30px 0 0; color: #222123; font-size: 16px; font-weight: 500; line-height: 20px; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__more {
  display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; width: auto; margin-top: auto; padding: 45px 25px 15px 0;
  border: 0; color: #da2031; font-size: 13px; font-weight: 700; line-height: 13px; text-transform: uppercase;
}
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__more-text { font-size: 13px; font-weight: 700; line-height: 13px; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__item:is(:has(a[href$="/choosing-the-right-paint-for-your-tank-what-to-remember/"]), :has(a[href$="/what-is-a-fuel-polishing-system-and-why-is-it-important/"])) .feature-grid__title { font-size: 0; line-height: 0; }
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__item:is(:has(a[href$="/choosing-the-right-paint-for-your-tank-what-to-remember/"]), :has(a[href$="/what-is-a-fuel-polishing-system-and-why-is-it-important/"])) .feature-grid__text { margin-top: 0; }
@media (max-width: 1199.98px) {
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 { padding-top: 200px; padding-bottom: 100px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__inner { padding-inline: 80px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 { padding-top: 110px; padding-bottom: 60px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__inner { padding-inline: 30px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__title { font-size: 17px; }
}
@media (max-width: 767.98px) { .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__list { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) {
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 { padding-top: 60px; padding-bottom: 30px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__inner { padding-inline: 15px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__title { font-size: 16px; }
  /* FC-SYNC3 (measured on the old page below 576 px: .blogpost-content-container 20 0 0): the words in line with the
     picture, 20 px under it, the text 16 px and READ MORE 15 px under the title or text, nothing under it */
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__body { padding: 20px 0 0; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__text { margin-top: 16px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__more { padding-top: 30px; }
}

/* FC-FIX3 (FC-QC2 look, the listing grids: NZ Insights and both Case Studies): master's Article cards in the old
   listing card (.list-blogposts .blogpost): 30 px apart, #eee with a 1 px #e1dfdf border and 12 px in, the picture the
   card's width, 30 / 18 / 18 px around the words, the title 18 px (17 below 992, 16 below 576) weight 800 #222123,
   30 px to the text (16 / 20 px 500), READ MORE in red capitals at the card's foot (at least 30 px under the text). */
.article-cards--grid.article-cards--photo-top .article-cards__list { gap: 30px; }
.article-cards--grid.article-cards--photo-top .article-card {
  display: flex; flex-direction: column; height: 100%; padding: 12px; border: 1px solid #e1dfdf; border-radius: 0;
  background: #eeeeee; box-shadow: none;
}
.article-cards--grid.article-cards--photo-top .article-card .page-card__media { flex: 0 0 auto; margin: 0; border-radius: 0; }
.article-cards--grid.article-cards--photo-top .article-card .page-card__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0; padding: 30px 18px 18px; background: none; }
.article-cards--grid.article-cards--photo-top .article-card .page-card__title { margin: 0; color: #222123; font-size: 18px; font-weight: 800; line-height: 1.15; letter-spacing: -3%; }
.article-cards--grid.article-cards--photo-top .article-card .page-card__link { color: inherit; text-decoration: none; }
.article-cards--grid.article-cards--photo-top .article-card .page-card__text { margin: 30px 0 0; color: #222123; font-size: 16px; font-weight: 500; line-height: 20px; }
.article-cards--grid.article-cards--photo-top .article-card .page-card__more {
  display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; width: auto; margin-top: auto; padding: 45px 25px 15px 0;
  color: #da2031; font-size: 13px; font-weight: 700; line-height: 13px; text-transform: uppercase;
}
@media (max-width: 991.98px) { .article-cards--grid.article-cards--photo-top .article-card .page-card__title { font-size: 17px; } }
@media (max-width: 575.98px) { .article-cards--grid.article-cards--photo-top .article-card .page-card__title { font-size: 16px; } }
/* the Insights grid (no filter): the old list 250 / 200 / 110 / 60 px under the banner (band padding 150 / 100 / 60 / 30
   and the list's margin 100 / 100 / 50 / 30 px), 150 / 100 / 60 / 30 px under the cards */
.article-cards--grid.article-cards--photo-top:not(:has(.article-filter)) { padding: 250px 0 150px; background: #fafafa; }
@media (max-width: 1199.98px) { .article-cards--grid.article-cards--photo-top:not(:has(.article-filter)) { padding: 200px 0 100px; } }
@media (max-width: 991.98px) { .article-cards--grid.article-cards--photo-top:not(:has(.article-filter)) { padding: 110px 0 60px; } }
@media (max-width: 575.98px) { .article-cards--grid.article-cards--photo-top:not(:has(.article-filter)) { padding: 60px 0 30px; } }

/* FC-FIX3 (FC-QC2 article gaps, case studies): a block's closing picture is the old separate picture block, 50 px under the text, no line gap under it.
   FC-FIX4 (FC-QC3 ladder and Air New Zealand rows): only the old picture block's pictures (the import writes them 1440 x 750);
   the opening block's own pictures (the portrait ladder photo, the Air New Zealand logo) keep their shape and paragraph spacing. */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) > p:has(> img[width="1440"][height="750"]:only-child):last-child:not(:first-child) { margin-top: 50px; line-height: 0; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) > p:has(> img[width="1440"][height="750"]:only-child):last-child:not(:first-child) > img { display: block; }

/* FC-FIX3: the article's last block has twice the top padding below it, as the old last article block (75/150, 50/100, 30/60, 15/30) */
:is(.article-layout__main > .umb-block-list > .text-section:last-child, .site-main > .umb-block-list > .text-section:not(.band):has(+ .form-block)) { padding-bottom: 150px; }
@media (max-width: 1199.98px) { :is(.article-layout__main > .umb-block-list > .text-section:last-child, .site-main > .umb-block-list > .text-section:not(.band):has(+ .form-block)) { padding-bottom: 100px; } }
@media (max-width: 991.98px) { :is(.article-layout__main > .umb-block-list > .text-section:last-child, .site-main > .umb-block-list > .text-section:not(.band):has(+ .form-block)) { padding-bottom: 60px; } }
@media (max-width: 575.98px) { :is(.article-layout__main > .umb-block-list > .text-section:last-child, .site-main > .umb-block-list > .text-section:not(.band):has(+ .form-block)) { padding-bottom: 30px; } }
/* the old picture blocks are the CMS's 1440 x 750 crop (all 130 on the 44 article pages): the same shape, cut around the centre (the old focal point can't travel in rich text) */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) > p:has(> img[width="1440"][height="750"]:only-child):last-child:not(:first-child) > img { width: 100%; height: auto; aspect-ratio: 1440 / 750; object-fit: cover; }

/* FC-FIX3 (FC-QC2 look, "Integrated approach" on Home, Design, Install/Site Integration): the old cards' .box sits 30 px
   inside the card from 1200 px and 20 px below (230 / 245 / 257 px cards at 1440 / 1024 / 390) */
.feature-grid--icons-bordered .feature-grid__item { padding: 30px; }
@media (max-width: 1199.98px) { .feature-grid--icons-bordered .feature-grid__item { padding: 20px; } }
/* "The Fuelchief System" on the industry landings (old .content-columns.bg-blue h2 with its span): the label a 115 % line
   with no border (master's eyebrow: 1 px transparent border, 130 % line), the heading 25 px under it, the intro 25 px under
   the heading and the groups 50 px under the intro at every width (FC-FIX5; replaces FC-FIX3's 56 px at 1440, which made up
   for the 6 px shorter label) */
.feature-grid--groups .feature-grid__eyebrow { display: block; border-width: 0; line-height: 1.15; margin-bottom: 25px; }
.feature-grid--groups .feature-grid__intro { margin-top: 25px; }
@media (max-width: 767.98px) { .feature-grid--groups .feature-grid__intro { margin-top: 30px; } }
.feature-grid--groups .feature-grid__head { margin-bottom: 50px; }
/* master's group titles and banner styles write their letter-spacing in em; the old CSS in % (same look, FC-FIX5) */
.feature-grid__group-title { letter-spacing: -4%; }
.hero.hero--page-banner:is(.hero--style-landing, .hero--style-industry) .hero__heading { letter-spacing: -2%; }
.hero.hero--page-banner:is(.hero--style-landing, .hero--style-industry) :is(.hero__title, .hero__title.eyebrow--pill) { letter-spacing: -3%; }
.hero.hero--page-banner:is(.hero--style-landing, .hero--style-industry) .hero__intro { letter-spacing: -1%; }
/* the old red lead (.panel-lead) is its own line under the heading, never run on after it (FC-FIX5) */
.hero.hero--page-banner:is(.hero--style-landing, .hero--style-industry) .hero__highlight { display: block; }

/* FC-FIX3 (FC-QC2 look: the picture columns on Health, Manufacture and Tanks, old .content-columns.default-content): not
   the industry tiles: cards 20 px apart (three a row from 992 px, one below), #eee with a 1 px #e1dfdf border, the picture
   16 px in at the old CMS crop (450 x 300, 3:2), 30 px around the words, the title 26 / 26 / 24 / 22 px weight 800 navy, the text 14 px (16 on
   phones); the intro centred (960 px wide at 1440), the cards 100 / 50 / 50 / 30 px under it; band padding 150 / 100 / 75 / 50. */
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 { padding: 150px 0; background: #fafafa; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__head { max-width: 960px; margin: 0 auto 100px; text-align: center; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__item {
  display: flex; flex-direction: column; height: auto; min-height: 0; aspect-ratio: auto; padding: 0;
  border: 1px solid #e1dfdf; background: #eeeeee; overflow: visible;
}
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__media { position: static; flex: 0 0 auto; z-index: auto; padding: 16px 16px 0; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__media::after { content: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__media-image { position: static; display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__body { position: static; flex: 1 1 auto; display: block; padding: 30px; background: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__body::before { content: none; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__title { margin: 0; color: #2d3141; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__text { margin: 30px 0 0; color: #2d3141; font-size: 14px; font-weight: 500; line-height: 1.25; letter-spacing: -2%; }
@media (max-width: 1199.98px) {
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 { padding: 100px 0; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__head { max-width: none; margin-bottom: 50px; }
}
@media (max-width: 991.98px) {
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 { padding: 75px 0; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__list { grid-template-columns: minmax(0, 1fr); }
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__title { font-size: 24px; }
}
@media (max-width: 575.98px) {
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 { padding: 50px 0; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__head { margin-bottom: 30px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__title { font-size: 22px; }
  .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__text { font-size: 16px; }
}
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__intro { margin-top: 50px; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__intro p { margin: 0 0 20px; }
@media (max-width: 575.98px) { .feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__intro { margin-top: 30px; } }

/* FC-FIX3: the old listing cards' pictures are the CMS's 700 x 450 crop (every card on both listings, both countries) */
.article-cards--grid.article-cards--photo-top .article-card .page-card__media { aspect-ratio: auto; height: auto; }
.article-cards--grid.article-cards--photo-top .article-card .page-card__image,
.feature-grid--photo-cards.feature-grid--photo-landscape-460-300 .feature-grid__media-image { display: block; width: 100%; height: auto; aspect-ratio: 700 / 450; object-fit: cover; }

/* FC-FIX3 (FC-QC2 look, the case-study sliders on 21 pages, old .block__article-slider at 1440): the heading with
   "VIEW ALL ->" at its right (13 px weight 800 navy capitals), the cards 20 px under the heading as the old listing
   cards (grey, framed, the picture 12 px in), the dots under the cards (59 px), centred, 16 px red rings 25 px apart,
   the current one filled; 35 px under the dots. */
.article-cards--slider.article-cards--photo-top { padding-bottom: 35px; }
.article-cards--slider.article-cards--photo-top .article-cards__head { display: flex; align-items: center; justify-content: space-between; max-width: none; margin-bottom: 0; }
.article-cards--slider.article-cards--photo-top .article-cards__all { margin: 0 7px 0 0; }
.article-cards--slider.article-cards--photo-top .article-cards__all .btn {
  display: inline-flex; align-items: center; gap: 12px; min-height: 0; padding: 0; border: 0; background: none; box-shadow: none;
  color: #2d3141; font-size: 13px; font-weight: 800; line-height: 1; text-transform: uppercase;
}
.article-cards--slider.article-cards--photo-top .article-cards__all .btn::after {
  content: ""; width: 18px; height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 14' fill='none' stroke='%232d3141' stroke-width='2'%3E%3Cpath d='M0 7h16M10 1l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.article-cards--slider.article-cards--photo-top .carousel { display: flex; flex-direction: column; margin: 20px 0 0; }
.article-cards--slider.article-cards--photo-top .carousel__controls { order: 2; justify-content: center; margin: 59px 0 0; }
.article-cards--slider.article-cards--photo-top .carousel__dots { gap: 25px; justify-content: center; width: 100%; }
.article-cards--slider.article-cards--photo-top .carousel__dot { width: 16px; height: 16px; min-width: 0; min-height: 0; padding: 0; }
.article-cards--slider.article-cards--photo-top .carousel__dot::before { width: 16px; height: 16px; border: 2px solid #da2031; border-radius: 50%; background: transparent; }
.article-cards--slider.article-cards--photo-top .carousel__dot[aria-current="true"]::before { background: #da2031; }
.article-cards--slider.article-cards--photo-top .article-card {
  display: flex; flex-direction: column; height: 100%; margin-inline: 4.5px; padding: 0; border: 1px solid #e1dfdf; border-radius: 0; background: #eeeeee; box-shadow: none;
}
.article-cards--slider.article-cards--photo-top .article-card .page-card__media { flex: 0 0 auto; margin: 0; padding: 12px 12px 0; border-radius: 0; }
.article-cards--slider.article-cards--photo-top .article-card .page-card__body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0; padding: 30px 30px 18px; background: none; }
.article-cards--slider.article-cards--photo-top .article-card .page-card__title { margin: 0; color: #222123; font-size: 18px; font-weight: 800; line-height: 1.15; letter-spacing: -3%; }
.article-cards--slider.article-cards--photo-top .article-card .page-card__link { color: inherit; text-decoration: none; }
.article-cards--slider.article-cards--photo-top .article-card .page-card__text { margin: 30px 0 0; color: #222123; font-size: 16px; font-weight: 500; line-height: 20px; }
.article-cards--slider.article-cards--photo-top .article-card .page-card__more {
  display: inline-flex; align-items: center; gap: 10px; align-self: flex-start; width: auto; margin-top: auto; padding: 45px 25px 15px 0;
  color: #da2031; font-size: 13px; font-weight: 700; line-height: 13px; text-transform: uppercase;
}
@media (max-width: 991.98px) { .article-cards--slider.article-cards--photo-top .article-card .page-card__title { font-size: 17px; } }
@media (max-width: 575.98px) { .article-cards--slider.article-cards--photo-top .article-card .page-card__title { font-size: 16px; } }

/* FC-FIX3 (FC-QC2 style rows): the case-study slider cards' words navy #2d3141 (the old .card; the listing cards stay
   #222123); "The Fuelchief System" items' text navy #2d3141; the industry landing banners' words #eee (old .panel-title /
   p on .industries-banner; the Design-type banners keep #e1dfdf); the navy bands' eyebrow 13 px below 1200 px (old
   .panel-title 16 / 13 px) and their text block h3 22 px below 576 px (old 26 / 22 px). (An article video's subtitle:
   master's Line under the heading since FC-SYNC3, styled with the article video above.) */
.article-cards--slider.article-cards--photo-top .article-card :is(.page-card__title, .page-card__text) { color: #2d3141; }
.feature-grid--groups .feature-grid__group-items .feature-grid__text { color: #2d3141; }
/* (FC-FIX5: as strong as the page banner's #e1dfdf rule above, so the industry banners' #eee shows) */
.hero--page-banner.hero--style-industry :is(.hero__title, .hero__title.eyebrow--pill, .hero__heading, .hero__intro, .hero__text p) { color: #eeeeee; }
/* the navy group cells' name and words #fafafa, the item titles navy (old .content-columns.bg-blue spans) */
.feature-grid--groups .feature-grid__group-cell :is(.feature-grid__group-title, .feature-grid__text) { color: #fafafa; }
.feature-grid--groups .feature-grid__group-items .feature-grid__title { color: #2d3141; }
@media (max-width: 1199.98px) { .band.band--deep.text-section--band .text-section__eyebrow, .band.band--deep.image-text .image-text__eyebrow { font-size: 13px; line-height: 1.15; } }
@media (max-width: 575.98px) { .text-section--band.band--deep .body-text h3 { font-size: 22px; line-height: 1.15; } }

/* FC-FIX3 (FC-QC2 look, Contact Us's address columns, old .content-columns.address-featurebox; the plain grid without a heading, as Tanks' plain grid has one): three columns 100 / 50 /
   25 px apart (one below 768 px, 25 px apart), each title in capitals 22 / 22 / 19 / 18 px with a 1 px red line 16 px
   under it and 20 px to the text, the paragraphs 16 / 20 px 20 px apart; band padding 150 / 100 / 75 / 50 px. */
.feature-grid.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 100px; }
.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__body { display: block; }
.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__title {
  margin: 0 0 20px; padding-bottom: 16px; border-bottom: 1px solid #da2031; color: #2d3141;
  font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -3%; text-transform: uppercase;
}
.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__text { margin: 0; color: #2d3141; font-size: 16px; font-weight: 500; line-height: 20px; }
.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__text p { margin: 0 0 20px; }
.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__text p:last-child { margin-bottom: 0; }
@media (max-width: 1199.98px) { .feature-grid--plain:not(:has(.feature-grid__head)) { padding-block: 100px; } .feature-grid.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__list { gap: 50px; } }
@media (max-width: 991.98px) { .feature-grid--plain:not(:has(.feature-grid__head)) { padding-block: 75px; } .feature-grid.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__list { gap: 25px; } .feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__title { font-size: 19px; } }
@media (max-width: 767.98px) { .feature-grid.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__list { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 575.98px) { .feature-grid--plain:not(:has(.feature-grid__head)) { padding-block: 50px; } .feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__title { font-size: 18px; } }
.feature-grid.feature-grid--plain:not(:has(.feature-grid__head)) .feature-grid__list > .feature-grid__item { grid-column: auto; }

/* FC-FIX4 (FC-QC3 article look): the old article slider (.block__image---slider, 1440 x 750) sits 50 px under the text, as
   the single closing picture does (master's Text photos: 48 px). */
.article-layout__main .text-section__photos { margin-top: 50px; }

/* FC-FIX4 (FC-QC3 look, page colour): the old sections are #fafafa unless they have their own colour (bundle.css
   `section{background-color:#fafafa}`; capture: legal pages, articles laid out without the side column and their videos,
   Safety and Compliance's video, Contact Us's address columns). The old white sections (image-and-text panels, the logo
   row, the "default-content" columns on Health, Manufacture and Tanks) stay white. */
.site-main > .umb-block-list > :is(.text-section:not(.band), .video.band--plain),
.site-main :is(.site-privacy-statement, .site-privacy-visits, .site-privacy-cookies),
.feature-grid.feature-grid--plain:not(:has(.feature-grid__head)) { background: #fafafa; }
/* the picture columns on Health, Manufacture and Tanks (old .content-columns.default-content): a white band (capture), the cards #eee */
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 { background: #ffffff; }

/* FC-FIX4 (FC-QC3 look at 1024 and 390): the old picture block and slider are 25 px under the text below 1200 px
   (.article-builder__text-image--content gap 50 / 25 px). */
@media (max-width: 1199.98px) {
  :is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) > p:has(> img[width="1440"][height="750"]:only-child):last-child:not(:first-child),
  .article-layout__main .text-section__photos { margin-top: 25px; }
}
/* the old related column at 992-1199 px: 100 px under the banner (150 from 1200 px) */
@media (min-width: 992px) and (max-width: 1199.98px) { .article-related { margin-top: 100px; } }
/* the old phone lists (below 576 px every section list item has 5 px under it: 25 px from item to item) */
@media (max-width: 575.98px) {
  .article-layout__main .article-contents__item,
  :is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(ul, ol) > li { padding-bottom: 5px; }
}
/* person pages at 768-1199 px: the old name is 32 px (40 from 1200 px) */
@media (min-width: 768px) and (max-width: 1199.98px) { .person-page { --person-page-name-fs: 32px; } }

/* FC-FIX4: a call-out after an old slider (its own Text section joined by No space below / above) sits as the old one:
   50 px under the photos, 25 px below 1200 px (the old .article-builder__text-image--content gap). */
/* FC-FIX5: every call-out is now its own section joined this way (after the text, the closing picture or the photos), on
   article pages and on the article pages without the side column. */
:is(.article-layout__main, .site-main) > .umb-block-list > .text-section.section-space--no-bottom + .text-section.section-space--no-top { margin-top: 50px; }
@media (max-width: 1199.98px) { :is(.article-layout__main, .site-main) > .umb-block-list > .text-section.section-space--no-bottom + .text-section.section-space--no-top { margin-top: 25px; } }
/* FC-FIX4: the contents list's shields as the old (.blocklist__table-of-contents ol: `section ol li:before`, 16 x 18 from the
   item's top; it was 16 x 14 from 3 px, which made the box 3 px short on every case study). */
.article-layout__main .article-contents__item::before { top: 0; height: 18px; }
/* and the old list ends 3 px lower from 576 px (the separator 78 -> 81 px under the last item at 1440; 24 case studies
   were 3 px short from there on) */
@media (min-width: 576px) { .article-layout__main .article-contents__list { margin-bottom: 3px; } }
/* FC-FIX4: the article photo grid (old .blocklist__image-gallery-grid, now master's square grid): 4 a row 50 px apart,
   3 below 1200 px, 2 and 30 px apart below 992, 1 below 576 */
.article-layout__main .gallery__list--grid:not(.gallery__list--four-three) { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 50px; }
@media (max-width: 1199.98px) { .article-layout__main .gallery__list--grid:not(.gallery__list--four-three) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991.98px) { .article-layout__main .gallery__list--grid:not(.gallery__list--four-three) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; } }
@media (max-width: 575.98px) { .article-layout__main .gallery__list--grid:not(.gallery__list--four-three) { grid-template-columns: minmax(0, 1fr); } }
/* FC-FIX4: links in text as the old (`a,a:hover,a:focus,a:active{text-decoration:none !important}`): red, not underlined
   (the old contents list keeps its underline). Recommended after the import: underline them again (colour alone). */
.body-text a, .body-text a:is(:hover, :focus, :active) { text-decoration: none; }

/* FC-FIX4 (person pages): the old photo shows at its own size up to the column; a 550 px file (6 pages) stays 550 px from
   1200 px, with no grey box behind it (the old page: 550 x 550; the rule above fills 570 for the larger files). */
@media (min-width: 1200px) {
  .person-page__photo:has(.person-page__img[width="550"]) { aspect-ratio: auto; background: none; }
  .person-page__photo:has(.person-page__img[width="550"]) picture { height: auto; }
  .person-page__img[width="550"] { width: 550px; height: auto; }
}

/* FC-FIX5: the navy band's lead line (old .panel-sublead, the SuperVault pages) 19 px below 1200 and 18 px below 992
   (125 % lines), as the old */
@media (max-width: 1199.98px) { .text-section--band.band--deep .text-section__heading { font-size: 19px; } }
@media (max-width: 991.98px) { .text-section--band.band--deep .text-section__heading { font-size: 18px; } }
/* FC-FIX5: sub-headings in a plain Text section (articles laid out without the side column) as the old article h3
   (.article-builder .block h3): 26 / 24 below 992 / 22 below 576 px, weight 800, 115 % lines, -4 %, navy, 10 px under */
:is(.umb-block-list > .text-section:not(.band) .body-text, .umb-block-list > .text-section.body-text:not(.band)) h3 { margin: 0 0 10px; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #2d3141; }
@media (max-width: 991.98px) { :is(.umb-block-list > .text-section:not(.band) .body-text, .umb-block-list > .text-section.body-text:not(.band)) h3 { font-size: 24px; } }
@media (max-width: 575.98px) { :is(.umb-block-list > .text-section:not(.band) .body-text, .umb-block-list > .text-section.body-text:not(.band)) h3 { font-size: 22px; } }

/* FC-FIX5: the Tanks page's text columns (old .content-columns.default-content without pictures, the same old cards as
   FC-FIX3's picture columns): intro centred, three #eee cards with a 1 px #e1dfdf border 20 px apart, 30 px around the
   words, the intro 50 px under the heading (30 below 768), the cards 100 / 50 below 1200 / 30 below 768 px under it, title 26 / 24 below 992 / 22 below 576 px weight 800 navy, text 14 px navy (16 on phones) with 20 px between
   paragraphs */
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__head { max-width: 960px; margin: 0 auto 100px; text-align: center; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__intro { margin-top: 50px; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__item { display: flex; flex-direction: column; padding: 0; border: 1px solid #e1dfdf; background: #eeeeee; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__body { display: block; padding: 30px; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__title { margin: 0; color: #2d3141; font-size: 26px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__text { margin: 30px 0 0; color: #2d3141; font-size: 14px; font-weight: 500; line-height: 1.25; letter-spacing: -2%; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__text p { margin: 0; font: inherit; color: inherit; letter-spacing: inherit; }
.feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__text p + p { margin-top: 20px; }
@media (max-width: 1199.98px) { .feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__head { max-width: none; margin-bottom: 50px; } }
@media (max-width: 991.98px) { .feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__list { grid-template-columns: minmax(0, 1fr); } .feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__title { font-size: 24px; } }
@media (max-width: 767.98px) { .feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__head { margin-bottom: 30px; } .feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__intro { margin-top: 30px; } }
@media (max-width: 575.98px) { .feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__title { font-size: 22px; } .feature-grid.feature-grid--plain:has(.feature-grid__head) .feature-grid__text { font-size: 16px; } }
/* FC-FIX5: the picture cards' paragraphs take the card text's 14 px navy (16 on phones), 20 px apart, as the old (master's
   paragraph rule had them at 16 px #222123) */
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__text p { margin: 0; font: inherit; color: inherit; letter-spacing: inherit; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3 .feature-grid__text p + p { margin-top: 20px; }
/* FC-FIX5: Home's methodology panel (old .panel-sticky-content): the intro #eee; step names 18 / 17 below 992 / 16 below
   576 px and stage titles 26 / 24 / 22 px (115 % lines), as the old */
.steps--sticky-intro .steps__intro { color: #eeeeee; }
@media (max-width: 991.98px) {
  .steps--sticky-intro .steps__title { font-size: 17px; line-height: 1.15; }
  .steps--sticky-intro .steps__group-title, .steps--sticky-intro .steps__group-text { font-size: 24px; line-height: 1.15; }
}
@media (max-width: 575.98px) {
  .steps--sticky-intro .steps__title { font-size: 16px; }
  .steps--sticky-intro .steps__group-title, .steps--sticky-intro .steps__group-text { font-size: 22px; }
}
/* FC-FIX5: the People page grid (old .list-profiles, measured on the capture): the photos keep the old 268 x 200 shape (the
   309 x 288 slider crop above was reaching them), cards 20 px apart at every width, the name 19 px under the photo, the role
   under it as the old, the contact lines 16 px on 20 px lines with 10 px from icon to words and no break inside an
   e-mail address (the old lets it run past the card) */
.team:not(.team--slider) .team__list--cols-4 { gap: 20px; }
.team--grid .team__panel { padding-top: 19px; }
.team--grid .team__role { margin-top: -10px; }
.team--grid .team__contact-link, .team--grid .team__contact-link * { overflow-wrap: normal; word-break: normal; }
.team--grid .team__contact-link { font-size: 16px; line-height: 20px; gap: 10px; }
/* FC-FIX5: below 1200 px the old list (inline-block in the centred column) is one block as wide as its longest line,
   centred, each line centred in it (the old li keeps the column's text-align: center) */
@media (min-width: 576px) and (max-width: 1199.98px) {
  .image-text .image-text__bullets { width: fit-content; margin-inline: auto; align-items: stretch; text-align: center; }
}
/* FC-FIX5: the listings' filter as the old (.filter-categorypicker1): label and choices 13 px capitals on 13 px lines; on
   phones the label 5 px above the drop-down button, the button 15 px inside (45 px tall with its line) */
.article-cards .article-cards__listing :is(.article-filter__label, .article-filter__option, .article-filter__toggle) { font-size: 13px; line-height: 1; text-transform: uppercase; }
.article-cards .article-cards__listing .article-filter__label { margin-bottom: 5px; }
.article-cards .article-cards__listing .article-filter__toggle { min-height: 0; padding-block: 15px; }
.article-cards .article-cards__listing .article-filter__toggle .article-filter__chevron { margin-block: -1.5px; }
/* FC-FIX5: an article's video laid out without the side column (old .blocklist__video): heading and line under it at the
   left across the column, the player 10 px under them; band space 75 / 50 below 1200 / 30 below 992 / 15 below 576 px and
   30 px at the sides below 992 (master's privacy note under the player stays) */
.site-main > .umb-block-list > .text-section:not(.band) + .video.video--under { padding-block: 75px; }
.site-main > .umb-block-list > .text-section:not(.band) + .video.video--under .video__inner { row-gap: 10px; }
.site-main > .umb-block-list > .text-section:not(.band) + .video.video--under .video__body { max-width: none; margin-inline: 0; text-align: start; }
@media (max-width: 1199.98px) { .site-main > .umb-block-list > .text-section:not(.band) + .video.video--under { padding-block: 50px; } }
@media (max-width: 991.98px) { .site-main > .umb-block-list > .text-section:not(.band) + .video.video--under { padding: 30px; } }
@media (max-width: 575.98px) { .site-main > .umb-block-list > .text-section:not(.band) + .video.video--under { padding-block: 15px; } }
@media (min-width: 576px) and (max-width: 991.98px) { .site-main > .umb-block-list > .text-section:not(.band) + .video.video--under .video__heading { font-size: 30px; } }
/* FC-FIX5: a page banner with its photo only (old .banner-basic without words, the Australian Fuel Polishing insight): the
   page name label stays the page's h1 for screen readers only, as the old band shows no words (master item M-FIX5-2) */
.hero.hero--page-banner:not(:has(.hero__heading)) .hero__title {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

/* FC-FIX5 (FC-QC4 gap rows, the article tables): the old article text is 20 px on a 30 px line where no paragraph sets it
   (html 125 %), so a cell's bare words are 20 / 30 px weight 400 and a cell's paragraph 16 / 20 px weight 500, words at the
   top, 1 px inside the cells (the table's border="1") with the paragraph's 20 px under it. The tables pasted with a header
   row (Key steps, Choosing the right paint) have 10 px above and below in each cell and no paragraph margin. */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) table { font-size: 20px; line-height: 30px; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(td, th) { padding: 1px; vertical-align: top; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) td { font-weight: 400; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(td, th) > p { margin: 0 0 20px; font-size: 16px; line-height: 20px; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) td > p { font-weight: 500; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) table:has(thead) :is(td, th) { padding: 10px 1px; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) table:has(thead) :is(td, th) > p { margin: 0; }
/* FC-FIX5 (FC-QC4 gap rows on the industry landings at 1024): the old stage titles never break inside a word ("Manufacture"
   runs past its 156 px column on one line, overflow-wrap normal), so the stage's text starts one line higher. */
.feature-grid__group-title { overflow-wrap: normal; }
/* FC-FIX5 (FC-QC4 left-edge and gap rows, Design and the landings' row of numbers): the old row is a flex row with 50 px
   gaps between numbers and shields (no margins on the shields), wrapping and centred from 768 px (numbers 50 % less 26 px
   wide, 50 px between rows) and on one line from 1400 px (numbers 25 % less 78 px, from the left, the last running past
   the container as the old). */
@media (min-width: 768px) {
  .stats--row .stats__row-list { gap: 50px; }
  .stats--row .stats__row-mark { margin-inline: 0; }
  .stats--row .stats__row-item { width: calc(50% - 26px); }
}
@media (min-width: 1400px) { .stats--row .stats__row-item { flex: none; width: calc(25% - 78px); } }
/* FC-FIX5 (FC-QC4 gap rows, the landing videos on Install and Safety and Compliance, old .video-panel .box-text): the text
   50 px under the heading, 30 px below 576 px (the old box's gap). Article videos keep their own rules above. */
.site-main > .umb-block-list > .video:not(.text-section:not(.band) + .video) .video__heading + .video__text { margin-top: 50px; }
@media (max-width: 575.98px) { .site-main > .umb-block-list > .video:not(.text-section:not(.band) + .video) .video__heading + .video__text { margin-top: 30px; } }
/* FC-FIX5 (FC-QC4 gap rows, Environmental/Social Responsibility and the navy text panels; old `section.panel.panel-text-image
   .panel-content h3` and `.panel p`): sub-headings 50 px above (30 px below 1200 px) and 10 px under, paragraphs 10 px
   apart below 768 px. */
.text-section--band.band--deep .body-text h3 { margin-bottom: 10px; }
@media (max-width: 1199.98px) { .text-section--band.band--deep .body-text h3 { margin-top: 30px; } }
@media (max-width: 767.98px) { .text-section--band.band--deep .body-text p { margin-bottom: 10px; } }

/* FC-FIX5: a Text section without a heading is one element (.text-section.body-text), so the article text rules above also
   name it directly (the call-outs are such sections now). */
/* FC-FIX5 (FC-QC4 style rows, Environmental/Social Responsibility and AU Safety and Compliance): a navy text band whose
   label sits over the old .panel-subtitle (no size table under it; the tank pages' 20 px line is the old lead paragraph
   over their size tables) shows the subtitle as the old: 35/32/30/26 px weight 800 on 1.15, white, -4 %, 25 px to the text. */
.text-section--band.band--deep:has(.text-section__eyebrow):not(:has(.text-table)) .text-section__heading {
  margin: 0 auto 25px; font-size: 35px; font-weight: 800; line-height: 1.15; letter-spacing: -4%; color: #ffffff;
}
@media (max-width: 1199.98px) { .text-section--band.band--deep:has(.text-section__eyebrow):not(:has(.text-table)) .text-section__heading { font-size: 32px; } }
@media (max-width: 991.98px) { .text-section--band.band--deep:has(.text-section__eyebrow):not(:has(.text-table)) .text-section__heading { font-size: 30px; } }
@media (max-width: 575.98px) { .text-section--band.band--deep:has(.text-section__eyebrow):not(:has(.text-table)) .text-section__heading { font-size: 26px; } }
/* FC-FIX5 (FC-QC4 left-edge rows, -140 px at 1440 on the 9 navy text bands): the label sits in the centred 960 px column
   too, as the old .panel-title (master's eyebrow is an inline block, so it sat at the band's left edge). */
.text-section--band.band--deep .text-section__eyebrow.eyebrow { display: block; margin-inline: auto; margin-bottom: 25px; border-width: 0; line-height: 1.15; }
@media (max-width: 575.98px) { .text-section--band.band--deep .text-section__eyebrow.eyebrow { margin-bottom: 30px; } }

/* FC-FIX6: the newsletter address box's letter-spacing as FC-FIX5 set it (-2 %, the old CSS), moved here from master's
   footer.css (a Take file) so the site keeps master's file byte for byte. */
.site-footer__newsletter--one-box .site-form--one-box .site-form__control input[type="email"] { letter-spacing: -2%; }

/* FC-FIX6 (FC-QC5 R4): the old slick team row at rest: 24 px between the cards (photo 248 x 231 at 1440), with master's
   "Peek in at both edges" and "Below the cards" chosen by the import. */
.team--slider { --team-gap: 24px; }
/* The old row's red dots (slick's, as the case-study slider's): 16 px rings 25 px apart, the current one filled, 36 px
   under the cards; the cards 50 px under the intro (old screenshot, 1440). */
.team--slider .carousel { margin-top: 50px; --carousel-controls-below-gap: 36px; }
.team--slider .carousel__dots { gap: 25px; }
.team--slider .carousel__dot { width: 16px; height: 16px; min-width: 0; min-height: 0; padding: 0; }
.team--slider .carousel__dot::before { width: 16px; height: 16px; border: 2px solid #da2031; border-radius: 50%; background: transparent; }
.team--slider .carousel__dot[aria-current="true"]::before { background: #da2031; }
/* 1440: the old intro and View the team sit on one line 50 px under the heading (old .profiles head). */
@media (min-width: 1200px) {
  .team--slider .team__head { row-gap: 0; }
  .team--slider .team__intro p { margin-top: 50px; }
  .team--slider .team__all { margin-top: 90px; align-self: start; } /* the heading (40 px) + 50 */
}
/* FC-FIX6 (R3): the tank panels' Small label heading on the old h2.panel-title's 1.15 line (16 / 13 px). */
.image-text .image-text__heading--small { line-height: 1.15; }
/* FC-FIX6 (FC-QC5 E4; lead, 26 Oct 2026): this site shows its YouTube videos as the old site, without master's line "Video
   from YouTube, which may set cookies." (site layer only; master's default keeps the line). */
.video .video__note { display: none; }
/* FC-FIX6 (FC-QC5 R6): a case-study slider with one card (Health) as the old slick row with one slide: the card keeps a
   slide's width (380 px at 1440: a third of the row less the old 50 px gaps; half from 768 px; the column less 15 px each
   side on phones), its photo the old wider crop (354 x 161). Nothing moves with one card (master). */
.article-cards--slider.article-cards--count-1.article-cards--photo-top .carousel__slide { flex: 0 0 calc((100% - 100px) / 3 + 10px); }
.article-cards--slider.article-cards--count-1.article-cards--photo-top .page-card__media { height: auto; aspect-ratio: auto; }
.article-cards--slider.article-cards--count-1.article-cards--photo-top .page-card__image { width: 100%; height: auto; aspect-ratio: 354 / 161; object-fit: cover; }
@media (max-width: 1199.98px) { .article-cards--slider.article-cards--count-1.article-cards--photo-top .carousel__slide { flex-basis: calc((100% - 50px) / 2 + 10px); } }
@media (max-width: 767.98px) { .article-cards--slider.article-cards--count-1.article-cards--photo-top .carousel__slide { flex-basis: calc(100% - 20px); margin-left: 10px; } }

/* FC-FIX6 (FC-QC5 R5): the Case Studies listing's featured card as the old .block__card: the section's heading 150 / 100 /
   60 px under the banner, the card 50 px (30 px on phones) under it, across the column: #eee with a 1 px #e1dfdf line and
   12 px inside, the photo in the left half less 25 px (the old 700 x 300 crop, filling the card's height), the words 50 px to its right
   and 20 px from the right edge: title 18 px (16 px on phones) weight 800, 51 px from the top; text 30 px under the title;
   Read more at the foot. Phones: the photo on top, the words under it. */
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 { padding-top: 150px; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-cards__list { grid-template-columns: minmax(0, 1fr); margin-top: 50px; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card {
  display: grid; grid-template-columns: calc(50% - 25px) minmax(0, 1fr); gap: 0 50px; padding: 12px;
  background: #eeeeee; border: 1px solid #e1dfdf; border-radius: 0; margin: 0; width: auto;
}
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__media { width: auto; height: auto; min-height: 0; margin: 0; padding: 0; aspect-ratio: auto; overflow: hidden; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .page-card__media picture { display: block; height: 100%; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__media :where(picture, img) { display: block; width: 100%; height: 100%; min-height: 0; aspect-ratio: 7 / 3; object-fit: cover; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__body { display: flex; flex-direction: column; gap: 0; padding: 51px 20px 20px 0; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card :is(.page-card__title, .page-card__title a, .page-card__link) { margin: 0; font-size: 18px; font-weight: 800; line-height: 1.15; letter-spacing: -3%; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .page-card__media::before,
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .page-card__media::after { content: none; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__text { margin: 30px 0 0; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__more { margin-top: auto; }
@media (max-width: 1199.98px) { .article-cards--grid.article-cards--photo-beside.article-cards--count-1 { padding-top: 100px; } }
@media (max-width: 767.98px) {
  .article-cards--grid.article-cards--photo-beside.article-cards--count-1 { padding-top: 60px; }
  .article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-cards__list { margin-top: 30px; }
  .article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card { grid-template-columns: minmax(0, 1fr); }
  .article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__body { padding: 35px 0 0; }
  .article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card :is(.page-card__title, .page-card__title a, .page-card__link) { font-size: 16px; }
  .article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__text { margin-top: 15px; }
  .article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__more { margin-top: 15px; }
}

/* FC-FIX6 (FC-QC5 R5): the listing's filter as the old .filter-categorypicker1 from 576 px: the label in a 200 px column,
   the choices beside it as 13 px capitals 15 / 25 px inside, no frame; the current one a navy box with white words and
   3 px corners; a 1 px #eee line 25 px under the row and 25 px under that the page numbers as the old pager: 31 px boxes
   (37 px wide), 13 px weight 700, white with a #7c868d line, the current one red with white words, 4 px apart. */
@media (min-width: 576px) {
  .article-cards .article-cards__listing .article-filter { display: flex; align-items: center; padding-bottom: 25px; border-bottom: 1px solid #eeeeee; }
  .article-cards .article-cards__listing .article-filter__label { flex: 0 0 200px; margin: 0; }
  .article-cards .article-cards__listing .article-filter__options { display: flex; flex-wrap: wrap; gap: 0; margin: 0; padding: 0; }
  .article-cards .article-cards__listing .article-filter__option {
    display: block; min-height: 0; padding: 15px 25px; border: 0; border-radius: 3px; background: transparent; color: #000000;
    font-weight: 700; text-decoration: none;
  }
  .article-cards .article-cards__listing .article-filter__option[aria-current="true"] { background: #2d3141; color: #ffffff; }
  .article-cards__listing > .article-filter:has(+ .article-pager--top) { margin-bottom: 25px; }
}
.article-cards .article-cards__listing .article-pager__list { gap: 4px; }
.article-cards .article-cards__listing .article-pager__link {
  display: flex; align-items: center; justify-content: center; min-width: 37px; min-height: 0; height: 31px; padding: 0 12px;
  border: 1px solid #7c868d; border-radius: 0; background: #ffffff; color: #222123; font-size: 13px; font-weight: 700; line-height: 1;
}
.article-cards .article-cards__listing .article-pager__link[aria-current] { border-color: #da2031; background: #da2031; color: #ffffff; }
/* the grid: two columns from 576 to 1199 px (old col-md-6), and on phones the words in line with the picture */
@media (min-width: 576px) and (max-width: 1199.98px) {
  .article-cards--grid.article-cards--photo-top .article-cards__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .article-cards--grid.article-cards--photo-top .article-card .page-card__body { padding: 20px 0 0; }
  .article-cards--grid.article-cards--photo-top .article-card .page-card__text { margin-top: 15px; }
  .article-cards--grid.article-cards--photo-top .article-card .page-card__more { margin-top: 15px; padding-top: 15px; }
}
/* the old READ MORE arrow (arrow-right-red.svg, 20 x 18 px) */
.article-cards--grid .article-card .page-card__arrow { width: 20px; height: 18px; margin-block: -2.5px; }
/* the featured card's section ends at the card; the list's filter 40 px under it (old) */
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 { padding-bottom: 0; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 + .article-cards--grid { padding-top: 40px; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card .page-card__more { padding-block: 15px; }
/* a listing that opens with the filter (Australia's Case Studies): the filter row 150 / 100 / 30 px under the banner */
.article-cards--grid.article-cards--photo-top:has(.article-filter) { padding-top: 150px; }
@media (max-width: 1199.98px) { .article-cards--grid.article-cards--photo-top:has(.article-filter) { padding-top: 100px; } }
@media (max-width: 575.98px) { .article-cards--grid.article-cards--photo-top:has(.article-filter) { padding-top: 30px; } }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 + .article-cards--grid.article-cards--photo-top { padding-top: 40px; }
/* the heading 100 px under the page numbers (old) */
@media (min-width: 576px) { .article-cards__listing > .article-filter + .article-pager--top { margin-bottom: 100px; } }
/* FC-FIX6 (FC-QC5 R9): the old article h5 ("Further reading", "Relevant New Zealand standards"): 25 / 20 / 18 px on 1.2,
   weight 800, black, no letter-spacing, 1 em above and 10 px below. */
.body-text h5 { margin: 1em 0 10px; font-size: 25px; font-weight: 800; line-height: 1.2; letter-spacing: normal; color: #000000; }
@media (max-width: 1199.98px) { .body-text h5 { font-size: 20px; } }
@media (max-width: 575.98px) { .body-text h5 { font-size: 18px; } }
/* the article tables: bare words in a cell #212529 (old Bootstrap body colour), a header cell's paragraph weight 500 */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text) :is(td, th) { color: #212529; }
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text) th > p { font-weight: 500; }
/* FC-FIX6 (FC-QC5 R9): a list in the old highlight block (the OP valve pages) is the old page default: 20 / 30 px weight
   400 #212529, the bold lead weight 800 in the same colour. */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text, .site-main > .umb-block-list > .text-section.body-text:not(.band)) :is(ul, ol).fc-highlight-list > li { font-size: 20px; line-height: 30px; font-weight: 400; color: #212529; }
.body-text :is(ul, ol).fc-highlight-list li strong { color: #212529; }
/* FC-FIX6 (FC-QC5 R10): links in the navy text bands are red, as the old (.bg-blue a); the old outside button line
   ("STANDARDS.ORG.AU >") as the old .btn-secondary: #2d3141 at 25 % with a 1 px #7c868d line, 3 px corners, #eee 13 px
   capitals weight 700, 15 px inside, the small light-grey arrow 10 px after the words; 25 px under the text. */
.text-section--band.band--deep .body-text a { color: #da2031; text-decoration: none; }
.text-section--band.band--deep .body-text p.fc-button-line { margin: 25px 0 0; }
.text-section--band.band--deep .body-text p.fc-button-line a {
  display: inline-flex; align-items: center; gap: 10px; padding: 15px; border: 1px solid #7c868d; border-radius: 3px;
  background: rgba(45, 49, 65, 0.25); color: #eeeeee; font-size: 13px; font-weight: 700; line-height: 13px; text-transform: uppercase;
}
.text-section--band.band--deep .body-text p.fc-button-line a::after { content: ""; width: 12px; height: 13px; background: url("/images/site/light-grey-arrow-right.svg") center / contain no-repeat; }
/* FC-FIX6 (FC-QC5 R11): the legal pages' sub-headings (h2 as well as h3/h4) 24 px below 992 and 22 px below 576, as the
   old .text-image-content h4. */
@media (max-width: 991.98px) { .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):has(> .text-section__heading) .body-text :is(h2, h3, h4) { font-size: 24px; } }
@media (max-width: 575.98px) { .site-main > .umb-block-list:not(:has(> .text-section:not(.band) + .text-section:not(.band))) > .text-section:not(.band):has(> .text-section__heading) .body-text :is(h2, h3, h4) { font-size: 22px; } }
/* FC-FIX6 (FC-QC5 R8): Home's case-study card link as the old .box-text .btn: #eee capitals 13 px weight 700 on a 13 px
   line, 150 px wide with a 1 px #eee line under it, 15 px above and below the words, the 20 x 18 px arrow at its end. */
.stats__big-card .stats__big-card-link {
  width: 150px; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid #eeeeee; color: #eeeeee;
  font-size: 13px; font-weight: 700; line-height: 13px; text-transform: uppercase; text-decoration: none;
}
.stats__big-card .stats__big-card-link svg { width: 20px; height: 18px; margin-block: -2.5px; }
/* FC-FIX6 (FC-QC5 R8): Home's "View Our Most Recent Project" as the old .single-item: the heading 35 / 32 / 30 / 26 px; from
   1200 px the photo column half the card less 50 px and the words 130 px to its right. */
.article-cards--slider.article-cards--count-1.article-cards--photo-beside .article-cards__heading { font-size: 35px; line-height: 1.15; }
@media (max-width: 1199.98px) { .article-cards--slider.article-cards--count-1.article-cards--photo-beside .article-cards__heading { font-size: 32px; } }
@media (max-width: 991.98px) { .article-cards--slider.article-cards--count-1.article-cards--photo-beside .article-cards__heading { font-size: 30px; } }
@media (max-width: 575.98px) { .article-cards--slider.article-cards--count-1.article-cards--photo-beside .article-cards__heading { font-size: 26px; } }
@media (min-width: 1200px) {
  .article-cards--slider.article-cards--count-1 .article-card--photo-beside { grid-template-columns: calc(50% - 50px) minmax(0, 1fr); gap: 130px; }
}
/* FC-FIX6 (FC-QC5 R8): Home's methodology head as the old .panel-sticky-content: the label on a 1.15 line, the intro 24 /
   25 / 30 px under the heading. */
.steps.steps--sticky-intro .steps__eyebrow { line-height: 1.15; }
.steps.steps--sticky-intro .steps__intro { margin-top: 24px; }
@media (max-width: 1199.98px) { .steps.steps--sticky-intro .steps__intro { margin-top: 25px; } }
@media (max-width: 767.98px) { .steps.steps--sticky-intro .steps__intro { margin-top: 30px; } }
/* FC-FIX6 (FC-QC5 R13): the navy image-and-text list on phones (NZ Safety) as the old: one block as wide as its longest line,
   centred, the lines left-aligned and 25 px apart. */
@media (max-width: 575.98px) {
  .image-text.band--deep .image-text__bullets { width: fit-content; margin-inline: auto; gap: 0; }
  .image-text.band--deep .image-text__bullets li { margin: 0; padding-bottom: 5px; }
}
/* FC-FIX6 (FC-QC5 R13): a page banner's intro of two old paragraphs (AU Data Centres) keeps them apart (a blank line), not
   run together. */
.hero.hero--page-banner .hero__intro { white-space: pre-line; }
/* the old label over it (h2.block__title) 18 px (16 px on phones) on 1.15, the card's text navy */
.article-cards--slider.article-cards--count-1.article-cards--photo-beside .article-cards__eyebrow { line-height: 1.15; }
@media (max-width: 575.98px) { .article-cards--slider.article-cards--count-1.article-cards--photo-beside .article-cards__eyebrow { font-size: 16px; } }
.article-cards--slider.article-cards--count-1.article-cards--photo-beside .page-card__text { color: #2d3141; }
/* FC-FIX6 (lead, 26 Oct 2026: Privacy Policy keeps only master's standard statement): the page's name is its visible title
   (the legal pages' title line, 50 / 45 / 32 px, 150 / 100 / 60 / 30 px above and below it, then the old contact strip),
   and master's statement, visits and
   cookie parts sit in FuelChief's 1240 px column (the site's tokens have no container width, so the parts' own column
   rule found none and sat at the window's edge). */
:is(.site-privacy-statement, .site-privacy-visits, .site-privacy-cookies) { --page-column: 1240px; }
.site-main:has(> .site-privacy-statement) > h1:first-child {
  position: static; width: auto; height: auto; margin: 0; padding: 150px var(--page-gutter); overflow: visible; clip: auto; white-space: normal;
  max-width: calc(1240px + 2 * var(--page-gutter)); margin-inline: auto; box-sizing: border-box;
  font-size: 50px; font-weight: 800; line-height: 1; letter-spacing: -4%; color: #2d3141; background: #fafafa;
}
.site-main:has(> .site-privacy-statement) { background: #fafafa; padding-bottom: 150px; }
.site-main:has(> .site-privacy-statement) > .site-privacy-statement { margin-top: 50px; }
@media (max-width: 1199.98px) { .site-main:has(> .site-privacy-statement) > h1:first-child { padding-block: 100px; } .site-main:has(> .site-privacy-statement) { padding-bottom: 100px; } }
@media (max-width: 991.98px) { .site-main:has(> .site-privacy-statement) > h1:first-child { padding-block: 60px; font-size: 45px; } .site-main:has(> .site-privacy-statement) { padding-bottom: 60px; } }
@media (max-width: 575.98px) { .site-main:has(> .site-privacy-statement) > h1:first-child { padding-block: 30px; font-size: 32px; } .site-main:has(> .site-privacy-statement) > .site-privacy-statement { margin-top: 30px; } .site-main:has(> .site-privacy-statement) { padding-bottom: 30px; } }

/* FC-FIX6 (FC-QC5 R9): University of Canterbury's photo grid (old .blocklist__text-grid-gallery, the only 4:3 grid in the
   articles) as the old two rows: the first four photos four a row, the next ones three a row, 15 px apart, each the old
   350 x 250 crop; below 1200 px two a row with the last of the second group across the row; one a row up to 350 px. */
.article-layout__main .gallery__list--grid.gallery__list--four-three { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 15px; }
.article-layout__main .gallery__list--grid.gallery__list--four-three > .gallery__item { grid-column: span 3; }
.article-layout__main .gallery__list--grid.gallery__list--four-three > .gallery__item:nth-child(n+5) { grid-column: span 4; }
.article-layout__main .gallery__list--grid.gallery__list--four-three .gallery__tile img { width: 100%; height: auto; aspect-ratio: 350 / 250; object-fit: cover; }
@media (max-width: 1199.98px) {
  .article-layout__main .gallery__list--grid.gallery__list--four-three > .gallery__item,
  .article-layout__main .gallery__list--grid.gallery__list--four-three > .gallery__item:nth-child(n+5) { grid-column: span 6; }
  .article-layout__main .gallery__list--grid.gallery__list--four-three > .gallery__item:nth-child(n+5):last-child { grid-column: 1 / -1; }
}
@media (max-width: 350px) { .article-layout__main .gallery__list--grid.gallery__list--four-three > .gallery__item { grid-column: 1 / -1; } }
/* FC-FIX6 (FC-QC5 Home rows): the stats band's lead line as the old .panel-sublead: 20 px from 1200, 19 px from 992, 18 px
   below (125 % lines). */
@media (max-width: 1199.98px) { .stats .stats__big-heading { font-size: 19px; line-height: 1.25; } }
@media (max-width: 991.98px) { .stats .stats__big-heading { font-size: 18px; } }
/* FC-FIX6 (FC-QC5 E6/R-size rows): the client logo row's slots keep the old logos at their own 125 x 80 px on phones too
   (old slick: three 130 px slides at 390 px); the slot leaves 2 px each side. */
.logo-strip--in-view .logo-strip__track .logo-strip__item,
.logo-strip--in-view.logo-strip--full .logo-strip__track .logo-strip__item { padding-inline: 2px; }
/* FC-FIX6: the old team row's heading sits 10 px higher in its band at 1440 (old ink 144 px under the band's top). */
@media (min-width: 1200px) { .team.team--slider { padding-top: 140px; } }
/* (a cell's paragraph keeps the old article paragraph's navy; only bare words in a cell are #212529) */
:is(.article-layout__main .body-text, .site-main > .umb-block-list > .text-section:not(.band) .body-text) :is(td, th) > p { color: #2d3141; }
/* FC-FIX6 (FC-QC5 R7, AU People): the old People grid is four a row whatever the count (six in Australia), two a row from
   576 to 1199 px, 20 px apart; master draws a list of six three a row (team__list--cols-3). */
@media (min-width: 1200px) { .team--grid .team__list--cols-3 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.team:not(.team--slider) .team__list--cols-3 { gap: 20px; }
@media (min-width: 576px) and (max-width: 1199.98px) { .team .team__list--cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; } }
/* FC-FIX6 (FC-QC5 video-panel rows: NZ Install, NZ and AU Safety): the landing pages' video as the old .video-panel: the player
   in the 960 px column, 100 / 50 / 30 px under the text (old firefox capture). */
.site-main > .umb-block-list > .video.video--under:not(.text-section:not(.band) + .video) .video__inner { row-gap: 0; }
.site-main > .umb-block-list > .video.video--under:not(.text-section:not(.band) + .video) .video__media { width: 100%; max-width: 960px; margin: 100px auto 0; }
@media (max-width: 1199.98px) { .site-main > .umb-block-list > .video.video--under:not(.text-section:not(.band) + .video) .video__media { margin-top: 50px; } }
@media (max-width: 575.98px) { .site-main > .umb-block-list > .video.video--under:not(.text-section:not(.band) + .video) .video__media { margin-top: 30px; } }
/* FC-FIX6 (FC-QC5 R8): Home's recent-project label 17 px below 992 px (old .block__title 18 / 17 / 16); in Australia, where
   the team row follows it, the old section ends 75 px closer (747 px band at 1440, New Zealand's 822). */
@media (max-width: 991.98px) and (min-width: 576px) { .article-cards--slider.article-cards--count-1.article-cards--photo-beside .article-cards__eyebrow { font-size: 17px; } }
@media (min-width: 1200px) { .article-cards--slider.article-cards--count-1.article-cards--photo-beside:has(+ .team--slider) { padding-bottom: 75px; } }
/* FC-FIX6: the old team dots are 15 px apart below 1200 px (25 px from 1200; capture rows at 1024 and 390), so ten dots
   stay one row on phones. */
@media (max-width: 1199.98px) { .team--slider .carousel__dots { gap: 15px; } }
/* FC-FIX6: an article video that ends the article keeps the old block's doubled space under it (150 / 100 / 60 / 30 px;
   Sandspit, Spark Telecom, Diesel generator storage); one followed by more text keeps the single space (OP valve). */
.article-layout .video.video--under:last-child { padding-bottom: 30px; }
@media (min-width: 576px) { .article-layout .video.video--under:last-child { padding-bottom: 60px; } }
@media (min-width: 992px) { .article-layout .video.video--under:last-child { padding-bottom: 100px; } }
@media (min-width: 1200px) { .article-layout .video.video--under:last-child { padding-bottom: 150px; } }
/* (FC-FIX6 group 4: the Tanks intro rules in fc-sections.css now apply only where the intro has a list, so Health's and
   Manufacture's photo-card intros stay as they were.) */

/* FC-FIX6 group 5 (FC-QC5 style rows): the listing filter's choices black and centred (old li.btn), the featured card's
   title #222123 (old .blogpost-title), the AU Safety band button's words centred (old .btn), the Tanks intro centred as
   the old .content-columns-content. */
.article-cards .article-cards__listing .article-filter__options li { color: #000000; text-align: center; }
.article-cards--grid.article-cards--photo-beside.article-cards--count-1 .article-card :is(.page-card__title, .page-card__title a, .page-card__link) { color: #222123; }
.text-section--band.band--deep .body-text p.fc-button-line a { text-align: center; }
.feature-grid--photo-cards.feature-grid--photo-landscape-4-3:has(.feature-grid__intro ul) .feature-grid__intro { text-align: center; }