/* Quality and Compliance page. The hero comes from pcb-concept.css (shared with every capability page);
   everything below the hero is unique to this page: standard + facts, certificate cards, the quality-gate study
   (scroll-controlled by assets/connection-study.js), the control ledger, the sector matrix and the supplier-qualification panel. */

.quality-page{--qc-rule:#cfdcd2}
.quality-page main h2{letter-spacing:-.04em}
.qc-heading{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;align-items:end;margin-bottom:46px}
.qc-heading h2{font-size:clamp(38px,4.1vw,64px);line-height:1.07;margin:0}
.qc-heading>p{font-size:16px;line-height:1.75;color:var(--muted);max-width:400px;margin:0}
.qc-heading .eyebrow{margin-bottom:18px}

/* 01 Standard: statement */
.qc-standard{padding-block:96px;background:#fff}
.qc-standard-head{display:grid;grid-template-columns:.55fr 1.5fr 1fr;gap:clamp(30px,4vw,70px);align-items:start}
.qc-standard-head h2{font-size:clamp(34px,3.5vw,54px);line-height:1.1;margin:0;font-weight:450}
.qc-standard-head h2 span{color:var(--green)}
.qc-standard-copy p{font-size:17px;line-height:1.75;color:var(--muted);margin:6px 0 22px}

/* 02 Certificates: document-style cards with a seal */
.qc-certs{background:var(--mist);padding-block:96px}
.qc-cert-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.qc-cert{position:relative;display:flex;flex-direction:column;background:#fff;padding:30px 30px 26px;border:1px solid var(--qc-rule);box-shadow:0 18px 40px #14282008;transition:transform .3s,box-shadow .3s}
.qc-cert::before{content:'';position:absolute;inset:7px;border:1px solid #e3ebe5;pointer-events:none}
.qc-cert:hover{transform:translateY(-4px);box-shadow:0 26px 50px #1428200f}
.qc-cert-top{display:flex;justify-content:space-between;align-items:flex-start;font:500 10.5px/1.5 var(--mono);letter-spacing:.14em;color:var(--green)}
.qc-seal{width:58px;height:58px;color:var(--green);margin:-6px -6px 0 0;transition:transform .6s}
.qc-cert:hover .qc-seal{transform:rotate(18deg)}
.qc-cert h3{margin:26px 0 10px;font-size:clamp(34px,2.9vw,46px);line-height:1;letter-spacing:-.045em;font-weight:500}
.qc-cert h3 span{color:var(--green);font-weight:400}
.qc-cert>p{margin:0;color:var(--muted);font-size:15px;line-height:1.65;max-width:300px}
.qc-cert dl{margin:24px 0 0;border-top:1px solid var(--line)}
.qc-cert dl>div{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px}
.qc-cert dt{color:var(--muted)}
.qc-cert dd{margin:0;text-align:right;font-weight:500}
.qc-cert-link{margin-top:22px;font-size:14px;font-weight:500;color:var(--ink);text-decoration:none;align-self:flex-start}
.qc-cert-link span{color:var(--green);display:inline-block;transition:transform .25s}
.qc-cert-link:hover span{transform:translate(2px,-2px)}
.qc-members{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #b9c9b3}
.qc-members li{padding:20px 24px 4px 0;font-size:14px;line-height:1.6;color:var(--muted)}
.qc-members li+li{padding-left:24px;border-left:1px solid var(--qc-rule)}
.qc-members span{display:block;font:500 10.5px/1.5 var(--mono);letter-spacing:.14em;color:var(--green);margin-bottom:8px}
.qc-members strong{display:block;font-size:22px;letter-spacing:-.03em;font-weight:500;color:var(--ink)}

/* 03 Quality gates: dark band, study drawing and a legend that lights up with it */
.qc-gates{background:var(--forest,#0d2920);color:#fff;padding-block:96px 100px}
.qc-heading--dark h2{color:#fff}
.qc-heading--dark>p{color:#b6cabd}
.qc-heading--dark .eyebrow{color:#7fcf9f}
.qc-gates-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(36px,5vw,80px);align-items:center}
.qc-gates-visual{margin:0;padding:18px;border:1px solid #24493b;background:#0b241b}
.qc-gates-visual>.eyebrow{color:#7fcf9f;margin:0 0 14px}
.qs-svg{display:block;width:100%;height:auto}
.qc-gates-visual figcaption{display:flex;justify-content:space-between;gap:16px;margin-top:14px;color:#8fa99a;font-size:10px}
.qc-gates-visual figcaption .dot{background:#4fc483}
.qs-svg text{font-family:var(--mono);font-weight:500;letter-spacing:.08em}
.qs-svg .qn{font-size:14px;fill:#65bd89}
.qs-svg .qt{font-size:14px;fill:#e2eee7}
.qs-svg .qs{font-size:12px;fill:#7f9b8c}
.qs-svg .qh{font-size:14px;fill:#17251e;letter-spacing:.12em}
.qs-svg .qs-d{font-size:11px;fill:#6c7f74}
.qs-svg .qr{font-size:13px;fill:#5c6961}
.qs-svg .qstamp{font-size:11px;fill:#087a43;letter-spacing:.1em;font-weight:600}
.qc-gate-list{list-style:none;margin:0;padding:0;counter-reset:gate}
.qc-gate-list li{--t:1;position:relative;display:grid;grid-template-columns:44px 1fr;gap:14px;padding:17px 0 17px;border-top:1px solid #24493b;opacity:calc(.42 + .58 * var(--t));transition:opacity .2s}
.qc-gate-list li::before{content:'';position:absolute;left:0;top:-1px;height:1px;width:calc(var(--t) * 100%);background:#4fc483}
.qc-gate-num{font:500 12px/1.9 var(--mono);color:#65bd89}
.qc-gate-list h3{margin:0 0 4px;font-size:20px;letter-spacing:-.02em;font-weight:500;color:#fff}
.qc-gate-list p{margin:0;font-size:15px;line-height:1.6;color:#b6cabd}
/* Scroll classes for this panel (same contract as the .package-visual studies). */
.qc-gates-layout [data-scroll]{--t:1;--e:1}
.qc-gates-layout .s-draw{stroke-dasharray:1}
.qc-gates-layout .s-fade{opacity:var(--t)}
.qc-gates-layout .s-out{opacity:calc(1 - var(--t))}
.qc-gates-layout .s-pop{transform-box:fill-box;transform-origin:center;transform:scale(calc(.2 + .8 * var(--e)));opacity:min(1,calc(var(--t) * 2.5))}

/* 04 Ledger: four disciplines, each with a record of what it covers */
.qc-ledger{padding-block:100px;background:#fff}
.qc-pillars{border-top:1px solid var(--ink)}
.qc-pillar{display:grid;grid-template-columns:.62fr 1.25fr 1fr;gap:clamp(28px,4vw,64px);padding:36px 0;border-bottom:1px solid var(--line);transition:background .3s}
.qc-pillar-label{font:500 12px/1.6 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);display:flex;gap:16px;padding-top:8px}
.qc-pillar-label span{color:var(--green)}
.qc-pillar-copy h3{margin:0 0 12px;font-size:clamp(26px,2.3vw,34px);line-height:1.15;letter-spacing:-.035em;font-weight:500}
.qc-pillar-copy p{margin:0;font-size:16px;line-height:1.75;color:var(--muted);max-width:520px}
.qc-pillar-record{list-style:none;margin:0;padding:6px 0 0}
.qc-pillar-record li{position:relative;padding:11px 0 11px 30px;border-bottom:1px dashed #d4ddd6;font-size:15px;line-height:1.55}
.qc-pillar-record li:last-child{border-bottom:0}
.qc-pillar-record li::before{content:'';position:absolute;left:0;top:14px;width:16px;height:16px;border-radius:50%;background:var(--mist) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4.5 8.2 2.3 2.3 4.7-5' fill='none' stroke='%23087a43' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;box-shadow:inset 0 0 0 1px #b9d3c2}

/* 05 Sector matrix */
.qc-sectors{background:var(--mist);padding-block:96px}
.qc-matrix{width:100%;border-collapse:collapse;font-size:15px}
.qc-matrix thead th{text-align:left;font:500 10.5px/1.5 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:0 20px 14px 0;border-bottom:1px solid var(--ink)}
.qc-matrix tbody th,.qc-matrix td{text-align:left;padding:22px 20px 22px 0;border-bottom:1px solid #c4d2bd;vertical-align:top;line-height:1.55}
.qc-matrix tbody th{font-weight:500;font-size:clamp(19px,1.6vw,23px);letter-spacing:-.025em;width:30%}
.qc-matrix tbody th a{color:inherit;text-decoration:none;display:inline-flex;gap:10px;align-items:baseline}
.qc-matrix tbody th a span{color:var(--green);font-size:15px;transition:transform .25s}
.qc-matrix tbody th a:hover{color:var(--green)}
.qc-matrix tbody th a:hover span{transform:translate(2px,-2px)}
.qc-matrix td{color:var(--muted);padding-top:25px}
.qc-matrix td:nth-child(2){color:var(--ink);font-weight:500}
.qc-matrix tbody tr{transition:background .25s}
.qc-matrix tbody tr:hover{background:#e4ede6}

/* 06 Supplier qualification */
.qc-audit{padding-block:0 96px;background:var(--mist)}
.qc-audit-panel{display:grid;grid-template-columns:1.25fr 1fr;background:var(--green);color:#fff;transform:translateY(0)}
.qc-audit-copy{padding:clamp(40px,5vw,76px)}
.qc-audit-copy .eyebrow{color:#cdeed8;margin-bottom:22px}
.qc-audit-copy h2{color:#fff;font-size:clamp(36px,3.8vw,58px);line-height:1.08;margin:0 0 22px;max-width:620px}
.qc-audit-copy>p{color:#dcefe3;font-size:17px;line-height:1.7;max-width:520px;margin:0 0 32px}
.qc-audit-actions{display:flex;flex-wrap:wrap;gap:22px 30px;align-items:center}
.qc-audit-actions .button{background:#fff;color:var(--green);border-color:#fff}
.qc-audit-actions .button:hover{background:#eaf5ee}
.qc-audit-actions .text-link{color:#fff}
.qc-audit-list{list-style:none;margin:0;padding:clamp(40px,5vw,76px);background:#06663a;display:flex;flex-direction:column;justify-content:center}
.qc-audit-list li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:20px 0;border-bottom:1px solid #3d8f63;font-size:18px;line-height:1.5;letter-spacing:-.01em}
.qc-audit-list li:first-child{border-top:1px solid #3d8f63}
.qc-audit-list span{font:500 12px/2 var(--mono);color:#a8e2bf}

@media(max-width:1000px){
  .qc-heading{grid-template-columns:1fr;gap:20px;margin-bottom:34px}
  .qc-standard-head{grid-template-columns:1fr 1.4fr}
  .qc-standard-head>.eyebrow{grid-column:1/-1;margin:0}
  .qc-cert-grid{grid-template-columns:1fr 1fr}
  .qc-gates-layout{grid-template-columns:1fr}
  .qc-pillar{grid-template-columns:1fr 1.3fr}
  .qc-pillar-label{grid-column:1/-1;padding-top:0}
  .qc-audit-panel{grid-template-columns:1fr}
}
@media(max-width:700px){
  .qc-standard{padding-block:60px}
  .qc-standard-head{grid-template-columns:1fr;gap:20px}
  .qc-standard-head h2{font-size:34px}
  .qc-certs,.qc-sectors{padding-block:58px}
  .qc-heading h2{font-size:38px}
  .qc-cert-grid{grid-template-columns:1fr}
  .qc-members{grid-template-columns:1fr}
  .qc-members li,.qc-members li+li{padding:18px 0;border-left:0;border-bottom:1px solid var(--qc-rule)}
  .qc-gates{padding-block:58px 64px}
  .quality-page .qc-gates-visual{margin-inline:calc(-1 * var(--gutter,20px));padding:14px var(--gutter,20px);border-inline:0;overflow:hidden}
  .quality-page .qs-svg{width:112%;max-width:none;margin:0 -6%}
  .qs-svg .qn,.qs-svg .qt{font-size:17px}
  .qs-svg .qs{font-size:13px}
  .qs-svg .qh{font-size:15px}
  .qc-ledger{padding-block:58px}
  .qc-pillar{grid-template-columns:1fr;gap:16px;padding:28px 0}
  .qc-matrix thead{display:none}
  .qc-matrix,.qc-matrix tbody,.qc-matrix tr,.qc-matrix th,.qc-matrix td{display:block;width:auto}
  .qc-matrix tbody tr{padding:20px 0;border-bottom:1px solid #c4d2bd}
  .qc-matrix tbody th,.qc-matrix td{padding:0;border:0}
  .qc-matrix tbody th{margin-bottom:10px;width:auto}
  .qc-matrix td{display:grid;grid-template-columns:118px 1fr;gap:12px;padding:5px 0;font-size:15px}
  .qc-matrix td::before{content:attr(data-label);font:500 10px/2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
  .qc-audit{padding-inline:0}
  .qc-audit-list li{font-size:16px}
}
@media(prefers-reduced-motion:reduce){.qc-cert,.qc-seal,.qc-gate-list li,.qc-matrix tbody tr{transition:none}}
