/* ============================================================
   CQAD — Compliance & Quality Assurance Directorate
   Sub-brand layer on the CU "Calm Authority" design system.
   Loads AFTER cu.css. Adds tokens and components only; never
   redefines a --cu-* token. Brand spec: CQAD web/design/CQAD-BRAND.md
   ============================================================ */
:root{
  /* signature accent — "Assurance Teal" (≈9.5:1 on white). Never a CTA. */
  --cqad-teal:      #0F4C5C;
  --cqad-teal-2:    #16616F;
  --cqad-teal-wash: #E8F1F2;
  --cqad-gold-line: #C99A2E;   /* darkened gold for hairlines + charts on white */

  /* status — always icon + word, never colour alone (audit scale 1–4 / N/A) */
  --st-meets:   #1A7038; --st-meets-bg:   #E8F5E9;
  --st-partial: #8A5A00; --st-partial-bg: #FFF4E0;
  --st-fail:    #B42318; --st-fail-bg:    #FDECEA;
  --st-exceeds: #0F4C5C; --st-exceeds-bg: #E8F1F2;
  --st-na:      #595959; --st-na-bg:      #F2F2F2;

  /* data-viz palette (series order) */
  --viz-1:#0F4C5C; --viz-2:#3a0f0d; --viz-3:#C99A2E; --viz-4:#5B6B73; --viz-5:#D9C7A7;

  --cq-radius-sm: 6px;
  --cq-side: 248px;
}

/* ---------- utilities ---------- */
.visually-hidden{position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0}
.cq-muted{color:var(--cu-grey)}
.cq-small{font-size:var(--fs-small)}
.cq-stack > * + *{margin-top:var(--space-2)}
.cq-measure{max-width:44rem}
[hidden]{display:none!important}

/* ---------- lockup (CU logo · hairline · directorate name) ---------- */
.cq-lockup{display:flex; align-items:center; gap:.9rem; text-decoration:none; margin-right:auto; min-width:0}
.cq-lockup .brand__logo{flex-shrink:0}
.cq-lockup__rule{width:1px; align-self:stretch; min-height:40px; background:var(--cu-line); flex-shrink:0}
.cq-lockup__name{font:600 .92rem/1.2 var(--font-display); font-variant:small-caps; letter-spacing:.04em;
  color:var(--cu-navy); max-width:15rem}
.cq-lockup__name b{display:block; font:700 .7rem/1 var(--font-text); font-variant:normal; letter-spacing:.18em;
  color:var(--cqad-teal); margin-bottom:.3rem}
@media (max-width:760px){ .cq-lockup__name{font-size:.78rem; max-width:9.5rem} }
@media (max-width:420px){ .cq-lockup__rule,.cq-lockup__name span{display:none} }

.header .cq-actions{display:flex; gap:.6rem; align-items:center; flex-shrink:0}
.header .cq-actions .btn{padding:.68rem 1.05rem; font-size:.86rem}
.header .cq-actions .btn--ghost{border-color:var(--cqad-teal); color:var(--cqad-teal)}
/* cu.css hides header Apply on mobile; CQAD keeps its survey CTA visible */
@media (max-width:960px){
  .header .cq-actions .btn--primary{display:inline-flex}
}
@media (max-width:620px){ .header .cq-actions .btn--ghost{display:none} }

/* ---------- teal section band (CQAD primary navigation) ---------- */
.cq-subnav{background:var(--cqad-teal); color:#fff; position:sticky; top:88px; z-index:45}
.cq-subnav .wrap{display:flex; gap:.15rem; overflow-x:auto; scrollbar-width:none;
  -webkit-overflow-scrolling:touch; scroll-snap-type:x proximity}
.cq-subnav .wrap::-webkit-scrollbar{display:none}
.cq-subnav a{flex:0 0 auto; scroll-snap-align:start; color:#fff; text-decoration:none;
  font:600 .84rem/1 var(--font-text); padding:.95rem .8rem; border-bottom:3px solid transparent; opacity:.9}
.cq-subnav a:hover{opacity:1; background:var(--cqad-teal-2)}
.cq-subnav a[aria-current="page"]{opacity:1; border-bottom-color:var(--cu-gold)}
.cq-subnav a.cq-subnav__ws{margin-left:auto}
.cq-subnav a:focus-visible{outline:2px solid var(--cu-gold); outline-offset:-3px}
@media (max-width:960px){ .cq-subnav{top:0; position:relative} }

/* ---------- kicker with gold ledger line ---------- */
.cq-kicker{font:600 var(--fs-kicker)/1 var(--font-text); letter-spacing:.14em; text-transform:uppercase;
  color:var(--cqad-teal); margin:0 0 1rem; display:inline-flex; flex-direction:column; gap:.55rem}
.cq-kicker::after{content:""; width:46px; height:5px;
  border-top:1px solid var(--cqad-gold-line); border-bottom:1px solid var(--cqad-gold-line)}
.on-dark .cq-kicker, .cq-kicker.on-dark{color:var(--cu-gold)}
.on-dark .cq-kicker::after, .cq-kicker.on-dark::after{border-color:var(--cu-gold)}

/* ---------- seal motif (four pillar quadrants) ---------- */
.cq-seal{position:absolute; pointer-events:none; width:min(560px,80vw); aspect-ratio:1; opacity:.08;
  color:var(--cu-gold)}
.cq-seal svg{width:100%; height:100%; display:block}

/* ---------- hero (type-led, maroon field) ---------- */
.cq-hero{position:relative; overflow:hidden; background:var(--cu-navy); color:#fff;
  padding:clamp(3.5rem,8vw,6.5rem) 0 clamp(3rem,7vw,5.5rem)}
.cq-hero::before{content:""; position:absolute; inset:0; pointer-events:none; opacity:.05;
  background-image:linear-gradient(rgba(255,255,255,.9) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.9) 1px,transparent 1px);
  background-size:28px 28px}
.cq-hero .cq-seal{right:-120px; top:50%; transform:translateY(-50%)}
.cq-hero .wrap{position:relative; display:grid; grid-template-columns:1.25fr .9fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center}
.cq-hero h1{color:#fff; font-size:var(--fs-hero); margin:0 0 1.1rem; max-width:16ch}
.cq-hero__lede{font-size:clamp(1.02rem,1.4vw,1.15rem); color:#F1E3DE; max-width:38rem; margin:0 0 1.6rem}
.cq-hero__motto{font:500 italic .98rem/1.4 var(--font-display); color:var(--cu-gold); margin:0 0 1.8rem; letter-spacing:.01em}
.cq-hero__cta{display:flex; flex-wrap:wrap; gap:.8rem}
.cq-hero .btn--ghost{color:#fff; border-color:rgba(255,255,255,.7)}
.cq-hero__media{position:relative; width:100%; margin:0; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3;
  background:var(--cu-navy-2); box-shadow:0 18px 50px rgba(0,0,0,.35)}
.cq-hero__media img{width:100%; height:100%; object-fit:cover}
.cq-hero__media figcaption{position:absolute; left:0; right:0; bottom:0; padding:.7rem .9rem;
  font-size:.76rem; color:#fff; background:linear-gradient(transparent,rgba(20,6,5,.8))}
@media (max-width:880px){ .cq-hero .wrap{grid-template-columns:1fr} .cq-hero__media{aspect-ratio:16/9} }

/* compact page hero for inner pages */
.cq-pagehead{position:relative; overflow:hidden; background:var(--cu-navy); color:#fff; padding:clamp(2.4rem,5vw,3.6rem) 0}
.cq-pagehead .cq-seal{right:-160px; top:-120px; width:420px}
.cq-pagehead h1{color:#fff; font-size:clamp(2rem,4vw,3rem); margin:0 0 .7rem; max-width:22ch}
.cq-pagehead p{color:#F1E3DE; max-width:44rem; margin:0}
.cq-pagehead .crumbs, .cq-pagehead .crumbs a{color:#E0CBC2}
.cq-pagehead .crumbs{padding:0 0 1.2rem}
.cq-pagehead .crumbs a:hover{color:var(--cu-gold)}
.cq-pagehead--photo .wrap{display:grid; grid-template-columns:1.4fr .8fr; gap:2rem; align-items:center}
.cq-pagehead--photo figure{margin:0; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3; background:var(--cu-navy-2)}
.cq-pagehead--photo img{width:100%; height:100%; object-fit:cover}
@media (max-width:820px){ .cq-pagehead--photo .wrap{grid-template-columns:1fr} .cq-pagehead--photo figure{display:none} }

/* ---------- pillars (Roman numerals I–IV) ---------- */
.cq-pillars{display:grid; grid-template-columns:repeat(4,1fr); gap:1.1rem; margin-top:var(--space-3)}
@media (max-width:1000px){ .cq-pillars{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .cq-pillars{grid-template-columns:1fr} }
.cq-pillar{display:flex; flex-direction:column; background:var(--cu-surface); border:1px solid var(--cu-line);
  border-radius:var(--radius); overflow:hidden; text-decoration:none; color:inherit; box-shadow:var(--shadow-1);
  transition:transform .18s var(--ease)}
.cq-pillar:hover{transform:translateY(-3px)}
.cq-pillar__media{aspect-ratio:16/9; background:var(--cqad-teal-wash); overflow:hidden}
.cq-pillar__media img{width:100%; height:100%; object-fit:cover}
.cq-pillar__body{padding:1.2rem 1.25rem 1.4rem; display:flex; flex-direction:column; gap:.45rem; flex:1}
.cq-numeral{font:600 1.6rem/1 var(--font-display); color:var(--cqad-teal); letter-spacing:.04em}
.cq-pillar h3{margin:0; font-size:1.08rem}
.cq-pillar p{margin:0; color:var(--cu-grey); font-size:var(--fs-small); line-height:1.6}
.cq-pillar__more{margin-top:auto; padding-top:.6rem; font:700 .85rem var(--font-text); color:var(--cu-red)}

/* ---------- generic cards + grids ---------- */
.cq-grid{display:grid; gap:1.1rem}
.cq-grid--2{grid-template-columns:repeat(2,1fr)}
.cq-grid--3{grid-template-columns:repeat(3,1fr)}
.cq-grid--4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){ .cq-grid--3,.cq-grid--4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .cq-grid--2,.cq-grid--3,.cq-grid--4{grid-template-columns:1fr} }
.cq-card{background:var(--cu-surface); border:1px solid var(--cu-line); border-radius:var(--radius);
  padding:1.3rem 1.35rem 1.4rem; box-shadow:var(--shadow-1); position:relative}
.cq-card h3{margin:0 0 .45rem; font-size:1.05rem}
.cq-card p{margin:0 0 .6rem; font-size:.95rem}
.cq-card p:last-child{margin-bottom:0}
.cq-card--rule{border-top:3px solid var(--cqad-teal)}
.cq-card--link{display:block; text-decoration:none; color:inherit; transition:transform .18s var(--ease)}
.cq-card--link:hover{transform:translateY(-2px)}
.cq-card__meta{font:600 .72rem/1.3 var(--font-text); letter-spacing:.08em; text-transform:uppercase; color:var(--cqad-teal); margin:0 0 .5rem}
.cq-split{display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:start}
@media (max-width:880px){ .cq-split{grid-template-columns:1fr} }
.cq-figure{margin:0; border-radius:var(--radius); overflow:hidden; background:var(--cqad-teal-wash); aspect-ratio:4/3}
.cq-figure img{width:100%; height:100%; object-fit:cover}

.cq-list{margin:.4rem 0 0; padding-left:1.15rem; line-height:1.7}
.cq-list li + li{margin-top:.25rem}
.cq-checks{list-style:none; margin:.5rem 0 0; padding:0; display:grid; gap:.5rem}
.cq-checks li{position:relative; padding-left:1.7rem; line-height:1.55}
.cq-checks li::before{content:"✓"; position:absolute; left:0; top:0; width:1.2rem; height:1.2rem; border-radius:50%;
  background:var(--cqad-teal-wash); color:var(--cqad-teal); font:700 .72rem/1.2rem var(--font-text); text-align:center}

/* ---------- quality cycle (Q1–Q4) ---------- */
.cq-cycle{display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:var(--space-3);
  border:1px solid var(--cu-line); border-radius:var(--radius); overflow:hidden; background:var(--cu-surface)}
.cq-cycle__q{padding:1.2rem 1.15rem 1.3rem; border-right:1px solid var(--cu-line); position:relative}
.cq-cycle__q:last-child{border-right:0}
.cq-cycle__q h3{font:600 1.15rem var(--font-display); margin:0 0 .15rem}
.cq-cycle__when{font:600 .74rem/1 var(--font-text); letter-spacing:.08em; text-transform:uppercase; color:var(--cu-grey)}
.cq-cycle__q ul{margin:.8rem 0 0; padding-left:1rem; font-size:var(--fs-small); line-height:1.6}
.cq-cycle__q.is-now{background:var(--cqad-teal-wash)}
.cq-cycle__q.is-now::before{content:"We are here"; position:absolute; top:.9rem; right:.9rem;
  font:700 .66rem/1 var(--font-text); letter-spacing:.06em; text-transform:uppercase;
  background:var(--cqad-teal); color:#fff; padding:.35rem .5rem; border-radius:999px}
@media (max-width:900px){ .cq-cycle{grid-template-columns:repeat(2,1fr)} .cq-cycle__q:nth-child(2){border-right:0}
  .cq-cycle__q:nth-child(-n+2){border-bottom:1px solid var(--cu-line)} }
@media (max-width:540px){ .cq-cycle{grid-template-columns:1fr} .cq-cycle__q{border-right:0; border-bottom:1px solid var(--cu-line)} }

/* ---------- status chips ---------- */
.cq-chip{display:inline-flex; align-items:center; gap:.35rem; font:700 .74rem/1 var(--font-text);
  padding:.36rem .6rem .36rem .5rem; border-radius:999px; white-space:nowrap; border:1px solid transparent}
.cq-chip::before{font-size:.8rem; line-height:1}
.cq-chip--meets{color:var(--st-meets); background:var(--st-meets-bg); border-color:#B7DFB9}
.cq-chip--meets::before{content:"✓"}
.cq-chip--partial{color:var(--st-partial); background:var(--st-partial-bg); border-color:#F2D9A6}
.cq-chip--partial::before{content:"◐"}
.cq-chip--fail{color:var(--st-fail); background:var(--st-fail-bg); border-color:#F4C2BD}
.cq-chip--fail::before{content:"✕"}
.cq-chip--exceeds{color:var(--st-exceeds); background:var(--st-exceeds-bg); border-color:#BFD8DC}
.cq-chip--exceeds::before{content:"★"}
.cq-chip--na{color:var(--st-na); background:var(--st-na-bg); border-color:#DDD}
.cq-chip--na::before{content:"–"}
.cq-chip--info{color:var(--cqad-teal); background:#fff; border-color:#BFD8DC}
.cq-chip--info::before{content:"•"}

/* ---------- empty state ---------- */
.cq-empty{position:relative; overflow:hidden; text-align:center; padding:2.2rem 1.4rem; border:1px dashed #C9D8DB;
  border-radius:var(--radius); background:linear-gradient(180deg,#fff,var(--cqad-teal-wash))}
.cq-empty .cq-seal{position:static; width:72px; margin:0 auto .7rem; opacity:.55; color:var(--cqad-teal)}
.cq-empty h3{margin:0 0 .35rem; font-size:1.02rem}
.cq-empty p{margin:0 auto; max-width:30rem; color:var(--cu-grey); font-size:var(--fs-small)}

/* ---------- notices ---------- */
.cq-notice{border-radius:var(--radius); padding:1rem 1.15rem; border:1px solid var(--cu-line);
  background:var(--cu-surface); font-size:.93rem; line-height:1.6}
.cq-notice--info{border-left:4px solid var(--cqad-teal); background:var(--cqad-teal-wash); border-color:#BFD8DC}
.cq-notice--ok{border-left:4px solid var(--st-meets); background:var(--st-meets-bg); border-color:#B7DFB9}
.cq-notice--warn{border-left:4px solid var(--st-partial); background:var(--st-partial-bg); border-color:#F2D9A6}
.cq-notice--err{border-left:4px solid var(--st-fail); background:var(--st-fail-bg); border-color:#F4C2BD}
.cq-notice strong{color:var(--cu-navy)}

/* ---------- tables ---------- */
.cq-table-wrap{overflow-x:auto; border:1px solid var(--cu-line); border-radius:var(--radius); background:var(--cu-surface)}
.cq-table{width:100%; border-collapse:collapse; font-size:var(--fs-small)}
.cq-table caption{caption-side:top; text-align:left; padding:.9rem 1rem .4rem; font:600 .95rem var(--font-text); color:var(--cu-navy)}
.cq-table th{background:var(--cqad-teal); color:#fff; text-align:left; font:600 .8rem var(--font-text);
  letter-spacing:.02em; padding:.7rem .9rem; white-space:nowrap}
.cq-table td{padding:.7rem .9rem; border-top:1px solid var(--cu-line); vertical-align:top}
.cq-table tbody tr:nth-child(even) td{background:#FAFBFB}
.cq-table tbody tr:hover td{background:var(--cqad-teal-wash)}
.cq-table td.num, .cq-table th.num{text-align:right; font-variant-numeric:tabular-nums}

/* ---------- steps (grants process etc.) ---------- */
.cq-steps{list-style:none; counter-reset:cqstep; margin:var(--space-3) 0 0; padding:0; display:grid; gap:.8rem}
.cq-steps li{counter-increment:cqstep; display:grid; grid-template-columns:2.6rem 1fr; gap:1rem; align-items:start;
  background:var(--cu-surface); border:1px solid var(--cu-line); border-radius:var(--radius); padding:1rem 1.1rem}
.cq-steps li::before{content:counter(cqstep); width:2.4rem; height:2.4rem; border-radius:50%;
  background:var(--cqad-teal); color:#fff; display:grid; place-items:center; font:600 1.05rem var(--font-display)}
.cq-steps h3{margin:0 0 .2rem; font-size:1rem}
.cq-steps p{margin:0; font-size:var(--fs-small); color:var(--cu-grey)}

/* ---------- stat band (policy rules, never fabricated metrics) ---------- */
.cq-rules{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--cu-line);
  border:1px solid var(--cu-line); border-radius:var(--radius); overflow:hidden}
.cq-rules > div{background:var(--cu-surface); padding:1.2rem 1.1rem}
.cq-rules b{display:block; font:600 1.7rem/1.1 var(--font-display); color:var(--cqad-teal)}
.cq-rules span{display:block; margin-top:.35rem; font-size:.82rem; color:var(--cu-grey); line-height:1.45}
@media (max-width:800px){ .cq-rules{grid-template-columns:repeat(2,1fr)} }

/* ---------- forms ---------- */
.cq-form{display:grid; gap:1rem}
.cq-field{display:flex; flex-direction:column; gap:.35rem}
.cq-field > label, .cq-label{font:600 .84rem var(--font-text); color:var(--cu-navy)}
.cq-field .hint{font-size:.8rem; color:var(--cu-grey)}
.cq-field .err{font-size:.8rem; color:var(--st-fail); font-weight:600}
.cq-input, .cq-form input[type=text], .cq-form input[type=email], .cq-form input[type=number],
.cq-form input[type=date], .cq-form input[type=search], .cq-form input[type=password], .cq-form input[type=url],
.cq-form select, .cq-form textarea{
  width:100%; padding:.68rem .8rem; border:1px solid #CFD5D8; border-radius:var(--cq-radius-sm);
  font:500 .95rem var(--font-text); color:var(--cu-ink); background:#fff}
.cq-form textarea{min-height:7rem; resize:vertical; line-height:1.55}
.cq-input:focus, .cq-form input:focus, .cq-form select:focus, .cq-form textarea:focus{
  outline:2px solid var(--cqad-teal); outline-offset:1px; border-color:var(--cqad-teal)}
.cq-form [aria-invalid="true"]{border-color:var(--st-fail)}
.cq-row{display:grid; grid-template-columns:repeat(2,1fr); gap:1rem}
.cq-row--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:640px){ .cq-row,.cq-row--3{grid-template-columns:1fr} }
.cq-check{display:flex; gap:.6rem; align-items:flex-start; font-size:.92rem; line-height:1.5}
.cq-check input{margin-top:.25rem; width:1.05rem; height:1.05rem; accent-color:var(--cqad-teal)}
.btn--teal{background:var(--cqad-teal); color:#fff}
.btn--teal:hover{background:var(--cqad-teal-2)}
.btn--sm{padding:.55rem .9rem; font-size:.82rem}
.btn[disabled], .btn[aria-disabled="true"]{opacity:.55; pointer-events:none}

/* ---------- survey taking ---------- */
.sv-shell{max-width:48rem; margin:0 auto}
.sv-progress{height:6px; background:#E3E8EA; border-radius:999px; overflow:hidden; margin:0 0 .5rem}
.sv-progress > span{display:block; height:100%; background:var(--cqad-teal); width:0; transition:width .3s var(--ease)}
.sv-section{background:var(--cu-surface); border:1px solid var(--cu-line); border-radius:var(--radius);
  padding:clamp(1.2rem,3vw,1.8rem); margin-top:1.1rem}
.sv-section > h2{font-size:1.25rem; margin:0 0 .3rem}
.sv-q{border:0; margin:0; padding:1.1rem 0; border-top:1px solid var(--cu-line)}
.sv-q:first-of-type{border-top:0}
.sv-q legend, .sv-q > label{font:600 .98rem/1.45 var(--font-text); color:var(--cu-ink); padding:0; margin-bottom:.7rem; display:block}
.sv-q .req-star{color:var(--st-fail)}
.sv-scale{display:grid; grid-template-columns:repeat(var(--n,5),1fr); gap:.4rem}
.sv-scale label{position:relative; display:flex; flex-direction:column; align-items:center; gap:.3rem; cursor:pointer;
  padding:.65rem .3rem; border:1px solid #CFD5D8; border-radius:var(--cq-radius-sm); text-align:center;
  font:500 .74rem/1.25 var(--font-text); color:var(--cu-grey); background:#fff}
.sv-scale label b{font:600 1.05rem var(--font-display); color:var(--cu-navy)}
.sv-scale input{position:absolute; opacity:0; inset:0; cursor:pointer}
.sv-scale label:has(input:checked){border-color:var(--cqad-teal); background:var(--cqad-teal-wash); box-shadow:inset 0 0 0 1px var(--cqad-teal)}
.sv-scale label:has(input:checked) b{color:var(--cqad-teal)}
.sv-scale label:has(input:focus-visible){outline:2px solid var(--cqad-teal); outline-offset:2px}
@media (max-width:560px){ .sv-scale{grid-template-columns:1fr} .sv-scale label{flex-direction:row; justify-content:flex-start; gap:.7rem; text-align:left} }
.sv-scale--11{grid-template-columns:repeat(11,1fr)}
@media (max-width:700px){ .sv-scale--11{grid-template-columns:repeat(6,1fr)} }
.sv-opts{display:grid; gap:.45rem}
.sv-opts label{display:flex; gap:.6rem; align-items:flex-start; padding:.6rem .75rem; border:1px solid #CFD5D8;
  border-radius:var(--cq-radius-sm); cursor:pointer; background:#fff; font-size:.93rem}
.sv-opts label:has(input:checked){border-color:var(--cqad-teal); background:var(--cqad-teal-wash)}
.sv-opts input{accent-color:var(--cqad-teal); margin-top:.2rem}
.sv-nav{display:flex; justify-content:space-between; gap:1rem; margin-top:1.2rem; flex-wrap:wrap}
.sv-privacy{font-size:.82rem; color:var(--cu-grey); line-height:1.6}
.sv-mode{display:inline-flex; gap:.4rem; align-items:center; font:700 .72rem/1 var(--font-text); letter-spacing:.06em;
  text-transform:uppercase; color:var(--cqad-teal); background:var(--cqad-teal-wash); padding:.4rem .6rem; border-radius:999px}

/* ---------- calculator ---------- */
.cq-calc{display:grid; grid-template-columns:1fr 1fr; gap:1.4rem}
@media (max-width:820px){ .cq-calc{grid-template-columns:1fr} }
.cq-calc__out{background:var(--cu-navy); color:#fff; border-radius:var(--radius); padding:1.4rem 1.5rem}
.cq-calc__out h3{color:#fff; margin:0 0 .8rem}
.cq-calc__out dl{display:grid; grid-template-columns:1fr auto; gap:.45rem 1rem; margin:0; font-size:.92rem}
.cq-calc__out dt{color:#E0CBC2}
.cq-calc__out dd{margin:0; font-variant-numeric:tabular-nums; font-weight:600; text-align:right}
.cq-calc__out .total{border-top:1px solid rgba(255,255,255,.25); padding-top:.45rem; color:var(--cu-gold)}
.cq-calc__warn{margin-top:.9rem; font-size:.82rem; color:#FCD9D4}

/* ---------- feature photo band ---------- */
.cq-photoband{display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem}
.cq-photoband figure{margin:0; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3; background:var(--cqad-teal-wash); position:relative}
.cq-photoband img{width:100%; height:100%; object-fit:cover}
.cq-photoband figcaption{position:absolute; left:0; right:0; bottom:0; padding:.55rem .75rem; color:#fff; font-size:.76rem;
  background:linear-gradient(transparent,rgba(20,6,5,.78))}
@media (max-width:700px){ .cq-photoband{grid-template-columns:1fr 1fr} .cq-photoband figure:nth-child(3){display:none} }

/* ---------- people (team from CMS) ---------- */
.cq-people{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1.1rem}
.cq-person{background:var(--cu-surface); border:1px solid var(--cu-line); border-radius:var(--radius); overflow:hidden}
.cq-person__ph{aspect-ratio:4/5; background:linear-gradient(150deg,var(--cqad-teal),var(--cu-navy))}
.cq-person__ph img{width:100%; height:100%; object-fit:cover; object-position:top center}
.cq-person__body{padding:.9rem 1rem 1.1rem}
.cq-person__body b{display:block; font:600 .98rem var(--font-text); color:var(--cu-navy)}
.cq-person__body small{color:var(--cu-grey); font-size:.82rem}

/* ---------- footer additions ---------- */
.cq-footer-motto{font:500 italic .95rem/1.4 var(--font-display); color:var(--cu-gold); margin:.9rem 0 0}
.footer__grid.cq-footer__grid{grid-template-columns:1.5fr 1fr 1fr 1fr}
@media (max-width:820px){ .footer__grid.cq-footer__grid{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .footer__grid.cq-footer__grid{grid-template-columns:1fr} }

/* ---------- toasts ---------- */
.cq-toasts{position:fixed; right:1rem; bottom:1rem; z-index:300; display:grid; gap:.5rem; max-width:min(380px,92vw)}
.cq-toast{background:var(--cu-ink); color:#fff; padding:.8rem 1rem; border-radius:8px; box-shadow:var(--shadow-1);
  font-size:.9rem; border-left:4px solid var(--cqad-teal)}
.cq-toast--err{border-left-color:#F97066}
.cq-toast--ok{border-left-color:#6CE9A6}

/* ============================================================
   WORKSPACE — authenticated QA Workspace shell
   ============================================================ */
.ws-body{background:#F5F7F8}
.ws-top{background:var(--cu-surface); border-bottom:1px solid var(--cu-line); position:sticky; top:0; z-index:60}
.ws-top .wrap{max-width:none; display:flex; align-items:center; gap:1rem; min-height:68px}
.ws-top .brand__logo{height:40px; width:140px}
.ws-user{display:flex; align-items:center; gap:.7rem; font-size:.85rem; color:var(--cu-grey)}
.ws-user b{color:var(--cu-navy)}
.ws{display:grid; grid-template-columns:var(--cq-side) 1fr; min-height:calc(100vh - 68px)}
.ws-side{background:var(--cqad-teal); color:#fff; padding:1.1rem .75rem 2rem; position:sticky; top:68px;
  height:calc(100vh - 68px); overflow-y:auto}
.ws-side h2{font:700 .68rem/1 var(--font-text); letter-spacing:.16em; text-transform:uppercase; color:#BFD8DC;
  margin:1.1rem .6rem .5rem}
.ws-side h2:first-child{margin-top:.2rem}
.ws-side a{display:flex; align-items:center; gap:.6rem; color:#fff; text-decoration:none; padding:.55rem .65rem;
  border-radius:8px; font:500 .87rem/1.25 var(--font-text); opacity:.92}
.ws-side a:hover{background:var(--cqad-teal-2); opacity:1}
.ws-side a[aria-current="page"]{background:#fff; color:var(--cqad-teal); font-weight:700; opacity:1}
.ws-side a:focus-visible{outline:2px solid var(--cu-gold); outline-offset:1px}
.ws-main{padding:clamp(1.2rem,3vw,2.2rem); min-width:0}
.ws-head{display:flex; justify-content:space-between; align-items:flex-end; gap:1rem; flex-wrap:wrap; margin-bottom:1.3rem}
.ws-head h1{font-size:clamp(1.5rem,2.6vw,2rem); margin:0}
.ws-head p{margin:.35rem 0 0; color:var(--cu-grey); font-size:.92rem; max-width:48rem}
.ws-toolbar{display:flex; gap:.6rem; flex-wrap:wrap; align-items:center}
.ws-panel{background:var(--cu-surface); border:1px solid var(--cu-line); border-radius:var(--radius); padding:1.2rem 1.3rem; margin-bottom:1.1rem}
.ws-panel h2{font-size:1.2rem; margin:0 0 .8rem}
.ws-filters{display:flex; gap:.6rem; flex-wrap:wrap; margin-bottom:.9rem}
.ws-filters select, .ws-filters input{padding:.5rem .65rem; border:1px solid #CFD5D8; border-radius:var(--cq-radius-sm); font:500 .86rem var(--font-text); background:#fff}
.ws-kpis{display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:.9rem; margin-bottom:1.1rem}
.ws-kpi{background:var(--cu-surface); border:1px solid var(--cu-line); border-radius:var(--radius); padding:1rem 1.1rem; border-top:3px solid var(--cqad-teal)}
.ws-kpi span{display:block; font:600 .74rem/1.3 var(--font-text); letter-spacing:.05em; text-transform:uppercase; color:var(--cu-grey)}
.ws-kpi b{display:block; font:600 1.8rem/1.15 var(--font-display); color:var(--cu-navy); margin-top:.3rem; font-variant-numeric:tabular-nums}
.ws-kpi small{display:block; margin-top:.25rem; color:var(--cu-grey); font-size:.78rem}
.ws-kpi--warn{border-top-color:var(--st-partial)}
.ws-kpi--bad{border-top-color:var(--st-fail)}
.ws-denied{max-width:34rem; margin:4rem auto; text-align:center}
.ws-menu-btn{display:none}
@media (max-width:900px){
  .ws{grid-template-columns:1fr}
  .ws-side{position:fixed; inset:68px auto 0 0; width:min(300px,86vw); height:auto; z-index:70;
    transform:translateX(-100%); transition:transform .25s var(--ease); box-shadow:24px 0 60px rgba(0,0,0,.3)}
  .ws-side.open{transform:none}
  .ws-menu-btn{display:inline-flex}
}

/* dialog */
.cq-dialog{border:0; border-radius:var(--radius); padding:0; width:min(720px,94vw); max-height:90vh; box-shadow:0 24px 70px rgba(0,0,0,.35)}
.cq-dialog::backdrop{background:rgba(20,6,5,.55)}
.cq-dialog__head{display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 1.3rem;
  background:var(--cqad-teal); color:#fff}
.cq-dialog__head h2{color:#fff; margin:0; font-size:1.1rem}
.cq-dialog__head button{background:transparent; border:0; color:#fff; font-size:1.5rem; cursor:pointer; line-height:1}
.cq-dialog__body{padding:1.2rem 1.3rem 1.4rem; overflow-y:auto; max-height:calc(90vh - 60px)}

/* charts: bar rows usable without a chart library */
.cq-bars{display:grid; gap:.55rem}
.cq-bar{display:grid; grid-template-columns:minmax(8rem,14rem) 1fr 3.5rem; gap:.7rem; align-items:center; font-size:.85rem}
.cq-bar__track{height:12px; background:#E3E8EA; border-radius:999px; overflow:hidden}
.cq-bar__fill{height:100%; background:var(--viz-1); border-radius:999px}
.cq-bar__val{text-align:right; font-variant-numeric:tabular-nums; font-weight:600}

/* print */
@media print{
  .topbar,.header,.cq-subnav,.footer,.ws-side,.ws-top,.ws-toolbar,.cq-toasts,.btn{display:none!important}
  .ws{display:block} .ws-main{padding:0} body{background:#fff}
  .cq-table th{background:#fff!important; color:#000; border-bottom:2px solid #000}
}
