/* ============================================================
   caqa-qms - LIGHT-FIRST FIX SKIN  (generated by make_light.py, loaded LAST)
   caqa-data precedent (lightfirst.css + redesign S3) parameterized by the
   site accent #0E7490 (ink-safe text accent #0E7490). Re-skins the dark content
   shells to the canonical light-first brand: white/ivory pages, dark ink
   headings, accent details. Chassis (cqbar/cq3, mega-menu, search, ticker,
   footers, foot-dome, policies, awards pages) untouched. Content verbatim -
   this file only changes appearance. PRM-safe.
   ============================================================ */

:root{
  --lfx-ink:#0E273B;          /* dark ink headings (>=7:1 on white) */
  --lfx-body:#39434E;         /* body */
  --lfx-muted:#5A6570;        /* muted-but-dark */
  --lfx-paper:#FFFFFF;
  --lfx-ivory:#F6F8FB;        /* alternating section tint */
  --lfx-line:#E4E7EC;         /* 1px borders */
  --lfx-ac:#0E7490;              /* brand accent (details/CTA fill) */
  --lfx-ac2:#519BAF;            /* gradient end */
  --lfx-ac-ink:#0E7490;         /* accent-as-text on white (>=4.5:1) */
  --lfx-shadow:0 12px 30px rgba(14,39,59,.08);
  --lfx-shadow-lg:0 24px 60px rgba(16,24,40,.14);
  --lfx-radius:22px;
}

/* ---------- 1. HERO ( .mast ) -> WHITE HERO ---------- */
.mast{
  background:
    radial-gradient(760px 380px at 90% 6%,rgba(14,116,144,.06),transparent 60%),
    linear-gradient(180deg,#FFFFFF 0%,#F6F8FB 100%)!important;
  color:var(--lfx-body)!important;
}
.mast::before,
.mast::after{display:none!important}   /* kill dark grid + dark scrims */
.mast .container{position:relative;z-index:2}
.mast h1,
.mast h2,
.mast h3{color:var(--lfx-ink)!important}
.mast .lead{color:var(--lfx-muted)!important}
.mast .eyebrow{color:var(--lfx-ac-ink)!important}
.mast .eyebrow::before{background:var(--lfx-ac)!important}
/* gradient headline word -> accent gradient on the light hero */
.mast h1 .gx{
  background:linear-gradient(110deg,#0E7490,#519BAF)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  color:transparent!important;
}
/* audience pills: light chips, dark text, accent hover */
.mast .aud span{
  color:#3A4652!important;border-color:var(--lfx-line)!important;background:#fff!important;
}
.mast .aud span:hover{
  color:var(--lfx-ac-ink)!important;border-color:var(--lfx-ac)!important;
}
/* the outline button was white-on-dark (often inline) -> dark ink on white */
.mast .btn-line,
.mast .hero-cta .btn-line{
  color:var(--lfx-ink)!important;border-color:var(--lfx-ink)!important;background:transparent!important;
}
.mast .btn-line:hover,
.mast .hero-cta .btn-line:hover{background:var(--lfx-ink)!important;color:#fff!important}
/* filled CTA -> brand accent fill */
.mast .btn-gold,
.awh .btn-gold{background:linear-gradient(100deg,#0E7490,#519BAF)!important;color:#fff!important}
.mast .btn-gold:hover{box-shadow:0 14px 30px rgba(14,116,144,.35)!important}
/* generic inline white text inside the hero -> ink */
.mast [style*="color:#fff"],.mast [style*="color:#FFF"],
.mast [style*="color: #fff"]{color:var(--lfx-ink)!important}

/* hero visual (.ledger dashboard etc) stays a CONTAINED framed media card
   (dark imagery allowed inside a rounded frame per the light-first rule) */
.mast .ledger,
.mast .hviz{
  border-radius:var(--lfx-radius)!important;
  border:1px solid rgba(14,39,59,.16)!important;
  box-shadow:var(--lfx-shadow-lg)!important;
  overflow:hidden;
}

/* ---------- 2. SUB-PAGE HERO ( .page-hero ) -> WHITE ---------- */
.page-hero{
  background:
    radial-gradient(640px 300px at 90% -10%,rgba(14,116,144,.06),transparent 60%),
    linear-gradient(180deg,#FFFFFF 0%,#F6F8FB 100%)!important;
  color:var(--lfx-body)!important;
}
.page-hero::before,
.page-hero::after{display:none!important}
.page-hero h1,
.page-hero h2{color:var(--lfx-ink)!important}
.page-hero .lead{color:var(--lfx-muted)!important}
.page-hero .eyebrow{color:var(--lfx-ac-ink)!important}
.page-hero .eyebrow::before{background:var(--lfx-ac)!important}
.page-hero .crumbs{color:var(--lfx-muted)!important}
.page-hero .crumbs a{color:var(--lfx-ac-ink)!important}
.page-hero h1 .gx{
  background:linear-gradient(110deg,#0E7490,#519BAF)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  color:transparent!important;
}
.page-hero [style*="color:#fff"],.page-hero [style*="color:#FFF"]{color:var(--lfx-ink)!important}

/* ---------- 3. DARK BAND ( .section.deep / .navy / .world ) -> LIGHT ---------- */
.section.deep,.section.navy,section.world{
  background:var(--lfx-ivory)!important;color:var(--lfx-body)!important;
}
.section.deep h1,.section.deep h2,.section.deep h3,
.section.navy h1,.section.navy h2,.section.navy h3,
section.world h1,section.world h2,section.world h3{color:var(--lfx-ink)!important}
.section.deep .lead,.section.navy .lead,section.world .lead{color:var(--lfx-muted)!important}
/* inline color:#fff / light-grey on children need !important to win */
.section.deep [style*="color:#fff"],.section.navy [style*="color:#fff"],section.world [style*="color:#fff"],
.section.deep [style*="color:#FFF"],.section.navy [style*="color:#FFF"],
.section.deep h2[style*="color:#fff"],
.section.deep span[style*="color:var(--gold)"],.section.navy span[style*="color:var(--gold)"]{color:var(--lfx-ink)!important}
.section.deep p[style*="color:#C4CFDD"],.section.deep [style*="C4CFDD"],
.section.navy [style*="C4CFDD"],section.world [style*="C4CFDD"],
.section.deep [style*="A7B2C2"],.section.navy [style*="A7B2C2"]{color:var(--lfx-body)!important}
.section.deep .eyebrow,.section.navy .eyebrow,section.world .eyebrow,
.section.deep .eyebrow[style*="gold"]{color:var(--lfx-ac-ink)!important}
.section.deep .eyebrow::before,.section.navy .eyebrow::before{background:var(--lfx-ac)!important}
.section.deep h2 span[style*="gold"],.section.navy h2 span[style*="gold"]{color:var(--lfx-ac-ink)!important}
.section.deep .btn-gold,.section.navy .btn-gold,section.world .btn-gold{
  background:linear-gradient(100deg,#0E7490,#519BAF)!important;color:#fff!important}
.section.deep .btn-line,.section.navy .btn-line{
  color:var(--lfx-ink)!important;border-color:var(--lfx-ink)!important;background:transparent!important}
/* the info-card on the dark band -> white card, light dashed rows */
.section.deep .info-card,.section.navy .info-card{
  background:#fff!important;border-color:var(--lfx-line)!important;
  box-shadow:var(--lfx-shadow)!important;
}
.section.deep .info-card .row,.section.navy .info-card .row{border-color:var(--lfx-line)!important}
.section.deep .info-card .row span[style*="A7B2C2"],
.section.deep .info-card .row span,.section.navy .info-card .row span{color:var(--lfx-muted)!important}
.section.deep .info-card .row b,.section.navy .info-card .row b{color:var(--lfx-ink)!important}

/* ---------- 4. SIGNATURE BAND ( .sigband ) -> LIGHT IVORY ---------- */
.sigband{
  background:
    radial-gradient(820px 420px at 12% 0%,rgba(14,116,144,.06),transparent 62%),
    radial-gradient(700px 420px at 92% 100%,rgba(14,116,144,.05),transparent 60%),
    var(--lfx-ivory)!important;
  color:var(--lfx-body)!important;
  border-top:1px solid var(--lfx-line);border-bottom:1px solid var(--lfx-line);
}
.sigband .sb-shapes i{opacity:.14!important;background:rgba(14,116,144,.4)!important}
.sigband .sb-kicker{
  color:var(--lfx-ac-ink)!important;
  border-color:rgba(14,116,144,.35)!important;
  background:rgba(14,116,144,.06)!important;
}
.sigband h2{color:var(--lfx-ink)!important}
.sigband h2 em{color:var(--lfx-ac-ink)!important}
.sigband p{color:var(--lfx-muted)!important}
.sigband .sb-chips div{
  background:#fff!important;border-color:var(--lfx-line)!important;
  box-shadow:var(--lfx-shadow)!important;
}
.sigband .sb-chips b{color:var(--lfx-ac-ink)!important}
.sigband .sb-chips span{color:var(--lfx-muted)!important}
.sigband [style*="color:#fff"],.sigband [style*="color:#FFF"]{color:var(--lfx-ink)!important}

/* ---------- 5. AWARDS TEASER ( .awh ) -> LIGHT ---------- */
/* .awh is fully inline-styled dark; !important beats the inline bg.
   Gold accents kept (awards identity) but text-safe deep gold. */
.awh{
  background:linear-gradient(180deg,#FFFFFF 0%,#F6F8FB 100%)!important;
  color:var(--lfx-body)!important;
  border-top:1px solid var(--lfx-line)!important;
}
.awh>div[aria-hidden]{
  background-image:
    linear-gradient(rgba(14,116,144,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(14,116,144,.05) 1px,transparent 1px)!important;
}
.awh p[style*="E5C55B"]{color:#9A7A16!important}          /* eyebrow -> deep gold */
.awh h2{color:var(--lfx-ink)!important}
.awh h2 em{
  background:linear-gradient(100deg,#B8860B,#9A7A16)!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  color:transparent!important;
}
.awh p[style*="C0C9E2"]{color:var(--lfx-muted)!important}
.awh [style*="color:#fff"],.awh [style*="color:#FFF"]{color:var(--lfx-ink)!important}
.awh span[style*="border"][style*="99px"]{
  border-color:rgba(184,134,11,.45)!important;color:var(--lfx-ink)!important;
  background:#fff!important;
}
.awh a[href="awards.html"]{
  background:linear-gradient(100deg,#B8860B,#D4AF37)!important;
  color:#1A1A00!important;
}

/* ---------- 6. GENERIC: accent-as-text safety on any light surface ---------- */
.section:not(.deep) .eyebrow,
.section.mist .eyebrow{color:var(--lfx-ac-ink)!important}

/* ---------- 7. Mobile + PRM ---------- */
@media (max-width:760px){
  .mast .ledger{margin-top:24px}
  .awh h2,.awh p{padding-inline:6px}
}
@media (prefers-reduced-motion:reduce){
  .sigband .sb-shapes i{animation:none!important}
}

/* ============================================================
   8. FIRST-VIEWPORT HERO ( .cqslider ) -> LIGHT-FIRST
   Engine .cqslider is a full-bleed dark carousel (dark bg + dark scrims
   over each .cqbg). Per the white-hero rule the first viewport MUST read
   white: the SECTION becomes white->ivory, the slide COPY moves to a
   dark-ink LEFT column with accent details, and the dark visual (.cqbg
   image/video) is demoted into a CONTAINED framed rounded MEDIA CARD on
   the right. Multi-slide rotation, dots and arrows keep working
   (crossfade stacking via grid-area:1/1 preserved). Copy is verbatim.
   ============================================================ */
.cqslider{
  background:linear-gradient(180deg,#FFFFFF 0%,#F6F8FB 100%)!important;
  border-bottom:1px solid var(--lfx-line);
}
.cqslide{
  display:grid!important;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.9fr);
  gap:clamp(28px,4vw,60px);
  align-items:center!important;
  color:var(--lfx-body)!important;
  min-height:auto!important;
  max-width:1280px;
  margin-inline:auto;
  padding:clamp(48px,6vw,84px) 26px;
  width:100%;
  box-sizing:border-box;
}
/* the engine's full-slide dark scrim is not needed on the light band */
.cqslide::after{display:none!important}
/* copy column: left, no longer full-width padded block */
.cqslide-in{
  grid-column:1!important;
  order:1;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  width:auto!important;
  position:relative;z-index:2;
}
/* the dark backdrop -> a CONTAINED framed media card, right column */
.cqslide .cqbg{
  position:relative!important;
  inset:auto!important;
  grid-column:2!important;
  order:2;
  align-self:center;
  width:100%;
  max-width:100%;
  aspect-ratio:16 / 11;
  border-radius:var(--lfx-radius)!important;
  border:1px solid var(--lfx-line)!important;
  box-shadow:var(--lfx-shadow-lg)!important;
  overflow:hidden!important;
  transform:none!important;
  z-index:1;
}
.cqslide.cq-active .cqbg{transform:none!important}
/* dark scrims over the media -> subtle inner vignette (text no longer overlays) */
.cqslide .cqbg::after{
  background:linear-gradient(180deg,rgba(6,24,38,.06),rgba(6,24,38,.22))!important;
}
.cqslide .cqbg video.cqfx,.cqslide .cqbg video{border-radius:inherit}
/* copy -> dark ink, accent details on the light background */
.cqslide h2{
  color:var(--lfx-ink)!important;
  text-shadow:none!important;
  max-width:14ch;
}
.cqslide p{
  color:var(--lfx-muted)!important;
  text-shadow:none!important;
}
.cqslide .cq-eyebrow{
  color:var(--lfx-ac-ink)!important;
  border-color:rgba(14,116,144,.4)!important;
  background:rgba(14,116,144,.06)!important;
  backdrop-filter:none!important;
}
.cqslide .cq-kicker{
  color:var(--lfx-muted)!important;
  text-shadow:none!important;
}
.cqslide .cq-btn{
  background:linear-gradient(100deg,#0E7490,#519BAF)!important;
  color:#fff!important;
  box-shadow:0 14px 30px rgba(14,116,144,.3)!important;
}
.cqslide .cq-btn:hover{
  box-shadow:0 20px 42px rgba(14,116,144,.42)!important;
}
/* dots + arrows recoloured for the light band */
.cqslider .cq-dots button{background:rgba(14,39,59,.18)!important}
.cqslider .cq-dots button.cq-on{background:var(--lfx-ac)!important}
.cqslider .cq-arr{
  border-color:rgba(14,39,59,.22)!important;
  background:rgba(255,255,255,.7)!important;
  color:var(--lfx-ink)!important;
  backdrop-filter:blur(6px);
}
.cqslider .cq-arr:hover{background:var(--lfx-ac)!important;color:#fff!important;border-color:transparent!important}
/* mobile: media card stacks BELOW the copy, no overflow */
@media (max-width:760px){
  .cqslide{
    grid-template-columns:1fr!important;
    gap:24px;
    padding:44px 20px;
  }
  .cqslide-in{grid-column:1!important;order:1}
  .cqslide .cqbg{
    grid-column:1!important;
    order:2;
    aspect-ratio:16 / 10;
  }
  .cqslide h2{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  .cqslide .cqbg{transform:none!important}
}

/* ============================================================
   9. FAMILY WALL ( .cqsvc - page-scoped LIGHT, engine ships #071228 )
   caqa-data-redesign.css S3 precedent: white cards, accent-ink labels.
   ============================================================ */
.cqsvc,
.cqsvc::after{
  background:linear-gradient(180deg,#FFFFFF 0%,#F6F8FB 100%)!important;
}
.cqsvc{border-top:1px solid var(--lfx-line)}
.cqsvc::before{
  background-image:
    linear-gradient(rgba(14,116,144,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(14,116,144,.05) 1px,transparent 1px)!important;
}
.cqsvc-head .t{color:var(--lfx-ac-ink)!important}
.cqsvc-head h2{color:var(--lfx-ink)!important}
.cqsvc-head p{color:var(--lfx-muted)!important}
.cqsvc-card{
  background:#fff!important;border:1px solid var(--lfx-line)!important;
  box-shadow:var(--lfx-shadow)!important;
}
.cqsvc-card::before{background:linear-gradient(100deg,#0E7490,#519BAF)!important}
.cqsvc-card:hover{
  background:#fff!important;border-color:rgba(14,116,144,.4)!important;
  box-shadow:var(--lfx-shadow-lg)!important;
}
.cqsvc-card .b{color:var(--lfx-ac-ink)!important}
.cqsvc-card .s{color:var(--lfx-ink)!important}
.cqsvc-card .g{color:var(--lfx-muted)!important}
.cqsvc-card:hover .g{color:var(--lfx-ac-ink)!important}

/* ---------- X-A. mast full-bleed backdrop video (cqfx) + scrim ---------- */
/* index .mast ships a full-bleed dark fx video + .cqfx-scrim UNDER the copy;
   it paints over the lightened hero (verify offenders y150-900). Remove the
   backdrop; the hero's framed .ledger visual card remains the media surface. */
.mast>video.cqfx,
.mast>.cqfx-scrim{display:none!important}

/* ---------- X-B. cine-charband -> light band, charpanel stays framed card ---------- */
.cine-charband{
  background:linear-gradient(180deg,#FFFFFF 0%,#F6F8FB 100%)!important;
  padding:clamp(28px,4vw,44px) 0!important;
}
.cine-charband::before{display:none!important}
.cine-charpanel{
  border-radius:var(--lfx-radius)!important;
  border:1px solid var(--lfx-line)!important;
  box-shadow:var(--lfx-shadow-lg)!important;
}