/* ===== Plansup Capability Statement — one-page, print-first ===== */
:root{
  --navy:#0f2238; --navy-2:#132b47; --ink:#1c2430; --muted:#5b6675; --rule:#d9dee6;
  --accent:#00a9d4; --accent-2:#00b894; --gold:#d4a017; --bg:#e9edf2;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:"Segoe UI",Inter,Roboto,Arial,sans-serif;font-size:9.4pt;line-height:1.4}
a{color:inherit;text-decoration:none}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,p{margin:0}

/* ---------- Toolbar (screen only) ---------- */
.toolbar{position:sticky;top:0;z-index:10;display:flex;justify-content:flex-end;gap:8px;padding:10px 16px;background:rgba(15,34,56,.92);backdrop-filter:blur(6px)}
.tb-btn{font:600 13px/1 "Segoe UI",Arial,sans-serif;color:#fff;background:linear-gradient(90deg,var(--accent),var(--accent-2));border:0;border-radius:6px;padding:9px 14px;cursor:pointer}
.tb-btn--ghost{background:transparent;border:1px solid rgba(255,255,255,.3)}

/* ---------- Page ---------- */
.page{width:210mm;height:297mm;margin:12mm auto;background:#fff;display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.18);overflow:hidden}

/* ---------- Header ---------- */
.hdr{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:#e8eef5;padding:9mm 12mm 0;position:relative}
.hdr::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 85% 20%,rgba(0,169,212,.25),transparent 45%);pointer-events:none}
.hdr__brand{display:flex;justify-content:space-between;align-items:center;position:relative}
.hdr__logo{height:11mm;width:auto}
.hdr__kicker{font-size:8pt;letter-spacing:2.4px;text-transform:uppercase;color:var(--gold);font-weight:700}
.hdr__title{margin-top:5.5mm;position:relative}
.hdr__title h1{font-size:21pt;line-height:1.12;font-weight:800;letter-spacing:-.3px;color:#fff}
.hdr__tag{margin-top:2mm;font-size:9.6pt;color:#b9d5e3;max-width:150mm;line-height:1.4}
.hdr__band{margin:5mm -12mm 0;padding:3.2mm 12mm;background:rgba(255,255,255,.08);border-top:1px solid rgba(255,255,255,.14);display:flex;gap:8px;align-items:center;font-size:9.8pt;color:#fff;position:relative}
.hdr__band strong{font-weight:700;letter-spacing:.1px}
.hdr__band-ico{font-size:12pt;line-height:1}

/* ---------- Body ---------- */
.body{flex:1;display:grid;grid-template-columns:1fr 60mm;gap:0;min-height:0}
.col{padding:6mm 10mm 4mm 12mm}
.col--side{background:#f4f7fa;border-left:1px solid var(--rule);padding:6mm 9mm 4mm 8mm}
h2{font-size:9.2pt;letter-spacing:1.8px;text-transform:uppercase;color:var(--navy);display:flex;align-items:center;gap:8px;margin:0 0 3mm}
h2::after{content:"";flex:1;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent-2),transparent)}
h2 + *{margin-bottom:5mm}
.col--side h2{font-size:8.2pt}

/* Pillars */
.pillars{display:grid;grid-template-columns:1fr 1fr;gap:3.2mm 5mm}
.pillar{border:1px solid var(--rule);border-radius:5px;padding:3mm 3.4mm 2.6mm;background:#fff;position:relative;overflow:hidden}
.pillar::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--accent),var(--accent-2))}
.pillar h3{font-size:9.8pt;font-weight:800;color:var(--navy);display:flex;align-items:center;gap:6px;margin-bottom:1.6mm}
.pillar__n{font-size:7.4pt;font-weight:800;color:var(--gold);letter-spacing:1px}
.pillar li{position:relative;padding-left:9px;font-size:8.5pt;line-height:1.38;color:#2a3442;margin-bottom:.9mm}
.pillar li::before{content:"";position:absolute;left:0;top:.5em;width:4px;height:4px;border-radius:50%;background:var(--accent)}

/* Proof */
.proof li{position:relative;padding-left:12px;font-size:8.7pt;line-height:1.4;color:#2a3442;margin-bottom:1.6mm}
.proof li::before{content:"";position:absolute;left:0;top:.42em;width:6px;height:6px;border-radius:2px;background:var(--gold)}
.proof strong{color:var(--navy)}

/* Credentials chips */
.creds{display:flex;flex-wrap:wrap;gap:1.6mm}
.creds li{font-size:7.9pt;font-weight:600;color:var(--navy);background:#eef3f8;border:1px solid var(--rule);border-radius:4px;padding:1.2mm 2.4mm;line-height:1.2}

/* Side column */
.facts{display:grid;grid-template-columns:1fr 1fr;gap:2.4mm}
.facts li{background:#fff;border:1px solid var(--rule);border-radius:5px;padding:2.4mm 2.6mm;display:flex;flex-direction:column}
.facts b{font-size:15pt;font-weight:800;color:var(--navy);line-height:1}
.facts span{font-size:7.4pt;color:var(--muted);margin-top:1mm;line-height:1.2}
.list li{position:relative;padding-left:9px;font-size:8.2pt;line-height:1.38;color:#2a3442;margin-bottom:1.3mm}
.list li::before{content:"";position:absolute;left:0;top:.5em;width:4px;height:4px;border-radius:50%;background:var(--accent-2)}
.list strong{color:var(--navy)}
.list--tight li{font-size:7.8pt;margin-bottom:1mm}
.foot-note{font-size:8.2pt;color:#2a3442;line-height:1.4}

/* ---------- Footer ---------- */
.ftr{background:var(--navy);color:#d5dee9;padding:3.4mm 12mm;display:flex;flex-wrap:wrap;gap:2mm 8mm;font-size:8pt;align-items:center}
.ftr__item{display:flex;gap:5px;align-items:baseline;white-space:nowrap}
.ftr__k{font-size:6.8pt;letter-spacing:1.4px;text-transform:uppercase;color:var(--gold);font-weight:700}
.ftr a{color:#fff;font-weight:600}

/* ---------- Print ---------- */
@page{size:A4;margin:0}
@media print{
  html,body{background:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .no-print{display:none!important}
  .page{margin:0;box-shadow:none;width:210mm;height:297mm;page-break-after:avoid}
}
@media screen and (max-width:900px){
  .page{width:100%;height:auto;margin:0}
  .body{grid-template-columns:1fr}
  .col--side{border-left:0;border-top:1px solid var(--rule)}
  .pillars{grid-template-columns:1fr}
  .hdr__band{font-size:9pt}
}
