/* ==========================================================================
   STANOVA DIGITAL SOLUTIONS — BUSINESS TECHNOLOGY GUIDE
   Card system · A4 portrait editorial series
   Visual language matches stanovadigital.co.zw design system
   ========================================================================== */

:root {
  /* Brand — Navy */
  --navy-900:#050F24; --navy-800:#081734; --navy-700:#0B1F46; --navy-600:#0E2757;
  --navy-500:#12316B; --navy-400:#2C54A8; --navy-200:#C2D6EE; --navy-100:#E1EBF7; --navy-50:#F2F6FC;
  /* Brand — Orange */
  --orange-600:#EA580C; --orange-500:#F97316; --orange-400:#FB923C; --orange-300:#FDBA74;
  --orange-200:#FED7AA; --orange-100:#FFEDD5; --orange-50:#FFF7ED;
  /* Neutrals */
  --ink:#0A1730; --muted:#5B6B84;
  --grey-50:#F7F8FA; --grey-100:#EEF1F6; --grey-200:#DEE3EC; --grey-300:#C7CFDC;
  --grey-400:#98A2B3; --grey-500:#6B7280;
  --white:#FFFFFF;
  /* Texture */
  --grad-o:linear-gradient(135deg, #F97316 0%, #EA580C 100%);
  --grad-n:linear-gradient(155deg, #0E2757 0%, #050F24 100%);
  --r-s:10px; --r-m:16px; --r-l:22px; --r-full:999px;
  --sh-card:0 1px 1px rgba(10,23,48,.04), 0 16px 34px rgba(10,23,48,.08);
  --sh-tile:0 1px 2px rgba(10,23,48,.05), 0 8px 20px rgba(10,23,48,.06);
  /* Spacing */
  --s1:8px; --s2:12px; --s3:16px; --s4:24px; --s5:32px; --s6:40px;
  /* Type */
  --font-d:'Sora','Inter',system-ui,sans-serif;
  --font-b:'Inter',system-ui,sans-serif;
  --font-m:'JetBrains Mono',ui-monospace,'Cascadia Mono',Consolas,'Courier New',monospace;
}

* { box-sizing:border-box; }
html, body { margin:0; padding:0; max-width:100%; overflow-x:hidden; overflow-x:clip; }
body {
  font-family:var(--font-b);
  color:var(--ink);
  line-height:1.5;
  background:var(--grey-50);
  font-size:11pt;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img { max-width:100%; height:auto; display:block; }
p { margin:0; }
a { color:var(--orange-600); }

/* ===================== Screen preview only ===================== */
.tb {
  position:fixed; top:0; left:0; right:0; z-index:60; height:54px;
  background:rgba(255,255,255,.94); backdrop-filter:blur(12px);
  border-bottom:1px solid var(--grey-200);
  display:flex; align-items:center; gap:12px; padding:0 18px;
  box-shadow:0 1px 0 rgba(10,23,48,.04);
}
.tb-b { font-family:var(--font-d); font-weight:800; font-size:12px; letter-spacing:.02em; color:var(--navy-900); white-space:nowrap; }
.tb-b em { font-style:normal; color:var(--orange-500); }
.tb-b small { display:block; font-family:var(--font-m); font-size:7px; letter-spacing:.22em; color:var(--muted); font-weight:600; margin-top:2px; }
.tb-tools { margin-left:auto; display:flex; align-items:center; gap:8px; }
.tb-btn {
  font-family:var(--font-b); font-size:12px; font-weight:600; color:var(--navy-800);
  background:var(--white); border:1px solid var(--grey-200); border-radius:var(--r-full);
  padding:7px 14px; cursor:pointer;
}
.tb-btn:hover { border-color:var(--orange-500); color:var(--orange-600); }
.tb-btn.active { background:var(--navy-900); color:#fff; border-color:var(--navy-900); }
.tb-btn.prim { background:var(--grad-o); color:#fff; border-color:transparent; }
.tb-btn.prim:hover { color:#fff; box-shadow:0 8px 18px rgba(249,115,22,.35); }
.tb-nav {
  width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--grey-200); border-radius:50%; color:var(--navy-800);
  font-size:16px; font-weight:700; text-decoration:none; background:var(--white);
}
.tb-nav:hover { border-color:var(--orange-500); color:var(--orange-600); }
.tb-sep { width:1px; height:20px; background:var(--grey-200); }
.tb select {
  font-family:var(--font-b); font-size:12px; color:var(--navy-800);
  border:1px solid var(--grey-200); border-radius:var(--r-full); padding:7px 12px;
  background:var(--white); max-width:280px;
}

main {
  display:flex; flex-direction:column; align-items:center; gap:26px;
  padding:72px 16px 44px;
}

/* Bare preview (for screenshots / clean export) */
body.bare .tb { display:none !important; }
body.bare main { padding:0; gap:0; }

/* ===================== Sheet (A4 portrait) ===================== */
.sheet {
  width:210mm; height:297mm; flex:0 0 auto;
  background:var(--white); color:var(--ink);
  position:relative; overflow:hidden;
  border-radius:3px;
  box-shadow:0 2px 6px rgba(10,23,48,.07), 0 30px 70px rgba(10,23,48,.16);
  display:flex; flex-direction:column;
}
.sheet.navy { background:var(--grad-n); color:#E7ECF6; }
.sheet-inner {
  padding:15mm 17mm 13mm;
  flex:1; min-height:0;
  display:flex; flex-direction:column;
  width:100%;
}

/* ===================== Header ===================== */
.hd {
  display:flex; align-items:center; gap:14px;
  padding-bottom:11px; border-bottom:1px solid var(--grey-100);
  flex:0 0 auto;
}
.hd-logo {
  width:46px; height:46px; border-radius:11px; background:var(--white);
  border:1px solid var(--grey-200); box-shadow:var(--sh-tile);
  overflow:hidden; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
}
.hd-logo img { width:100%; height:100%; object-fit:contain; border-radius:8px; }
.hd-brand { display:flex; align-items:center; gap:11px; min-width:0; }
.hd-name {
  font-family:var(--font-d); font-weight:800; font-size:10pt; letter-spacing:.02em;
  color:var(--navy-900); line-height:1.1; text-transform:uppercase; white-space:nowrap;
}
.hd-name em { font-style:normal; color:var(--orange-500); }
.hd-tag {
  font-family:var(--font-m); font-size:6.6pt; letter-spacing:.22em; color:var(--muted);
  text-transform:uppercase; font-weight:600; margin-top:3px; white-space:nowrap;
}
.hd-end { margin-left:auto; text-align:right; display:flex; flex-direction:column; gap:4px; flex:0 0 auto; }
.hd-eyebrow {
  font-family:var(--font-m); font-size:7pt; font-weight:700; letter-spacing:.2em;
  color:var(--orange-600); text-transform:uppercase;
}
.hd-page { font-family:var(--font-m); font-size:7.5pt; font-weight:600; letter-spacing:.18em; color:var(--muted); }
/* Header on dark sheets */
.sheet.navy .hd { border-color:rgba(255,255,255,.12); }
.sheet.navy .hd-name { color:#fff; }
.sheet.navy .hd-name em { color:var(--orange-400); }
.sheet.navy .hd-tag { color:rgba(255,255,255,.55); }
.sheet.navy .hd-eyebrow { color:var(--orange-300); }
.sheet.navy .hd-page { color:rgba(255,255,255,.5); }

/* Series progress marker */
.prog { display:flex; gap:4px; margin-top:10px; flex:0 0 auto; }
.prog i { height:4px; flex:1; border-radius:2px; background:var(--grey-200); }
.prog i.on { background:var(--grad-o); }
.sheet.navy .prog i { background:rgba(255,255,255,.16); }
.sheet.navy .prog i.on { background:var(--orange-400); }

/* ===================== Solution header ===================== */
.sol-head { display:flex; align-items:flex-start; gap:18px; margin:24px 0 20px; flex:0 0 auto; }
.sol-badge {
  width:66px; height:66px; border-radius:18px; background:var(--grad-o); color:#fff;
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;
  box-shadow:0 10px 24px rgba(249,115,22,.30);
}
.sol-badge svg { width:30px; height:30px; }
.sol-c { min-width:0; }
.sol-kick {
  font-family:var(--font-m); font-size:8pt; font-weight:700; letter-spacing:.22em;
  color:var(--orange-600); text-transform:uppercase; margin-bottom:9px;
}
.sol-q {
  font-family:var(--font-d); font-weight:800; font-size:26pt; line-height:1.06;
  letter-spacing:-.02em; color:var(--navy-900); margin:0;
}
.sol-q.ql { font-size:21.5pt; }
.sol-aka {
  margin-top:14px; display:inline-flex; align-items:center; gap:9px;
  background:var(--navy-900); color:#fff; border-radius:var(--r-full);
  padding:7px 16px; font-weight:700; font-size:9.5pt; letter-spacing:.05em; text-transform:uppercase;
}
.sol-aka i { width:8px; height:8px; border-radius:50%; background:var(--orange-500); flex:0 0 auto; }
.sol-aka span.c { color:var(--orange-400); }

/* ===================== Body grid ===================== */
.sol-body {
  display:grid; grid-template-columns:1.18fr .82fr; gap:20px; align-items:start;
  flex:1; min-height:0;
}
.sol-col { display:flex; flex-direction:column; gap:14px; min-width:0; }
.sol-p { font-size:11pt; line-height:1.55; color:#1E2B45; }
.sol-p + .sol-p { margin-top:-4px; }
.sol-p b { font-weight:700; color:var(--navy-900); }

/* Call-out definition box */
.call {
  background:var(--navy-50); border:1px solid var(--navy-100); border-left:3px solid var(--orange-500);
  border-radius:0 var(--r-m) var(--r-m) 0; padding:12px 16px;
  display:flex; gap:12px; align-items:flex-start;
}
.call svg { width:18px; height:18px; color:var(--orange-500); flex:0 0 auto; margin-top:2px; }
.call-l {
  font-family:var(--font-m); font-size:7.5pt; font-weight:700; letter-spacing:.18em;
  color:var(--orange-600); text-transform:uppercase; margin-bottom:5px;
}
.call p { font-size:10.5pt; line-height:1.5; color:var(--navy-800); }
.call p b { color:var(--orange-600); font-weight:700; }

/* Panel (what it helps with / flow) */
.panel {
  background:var(--white); border:1px solid var(--grey-100); border-radius:var(--r-m);
  box-shadow:var(--sh-tile); padding:15px 16px 13px;
}
.panel-h {
  display:flex; align-items:center; gap:8px;
  font-family:var(--font-m); font-size:7.5pt; font-weight:700; letter-spacing:.18em;
  color:var(--muted); text-transform:uppercase; margin-bottom:10px;
}
.panel-h::before { content:''; width:14px; height:2px; background:var(--grad-o); border-radius:2px; }
ul.pl { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
ul.pl li { display:flex; gap:9px; align-items:flex-start; font-size:10pt; line-height:1.4; color:var(--ink); }
.chk {
  width:18px; height:18px; border-radius:50%; background:var(--orange-100); color:var(--orange-600);
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; margin-top:1px;
}
.chk svg { width:11px; height:11px; }

/* Best for chips */
.sol-for { margin-top:16px; }
.sol-for-l {
  display:block; font-family:var(--font-m); font-size:7.5pt; font-weight:700; letter-spacing:.18em;
  color:var(--muted); text-transform:uppercase; margin-bottom:8px;
}
.chips { display:flex; flex-wrap:wrap; gap:6px; }
.chip {
  background:var(--navy-50); border:1px solid var(--navy-100); color:var(--navy-600);
  border-radius:var(--r-full); padding:5px 12px; font-size:8.5pt; font-weight:600; line-height:1.25;
}

/* Recurring core-message band (spans both columns) */
.back {
  grid-column:1 / -1; margin-top:20px;
  background:var(--grad-n); border-radius:16px; padding:17px 24px;
  display:flex; align-items:center; gap:22px; position:relative; overflow:hidden;
  box-shadow:var(--sh-tile);
}
.back::after {
  content:''; position:absolute; top:-70px; right:-60px; width:170px; height:170px;
  background:radial-gradient(circle, rgba(249,115,22,.36), transparent 70%);
}
.back-ic {
  width:46px; height:46px; border-radius:14px; background:var(--grad-o); color:#fff;
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; position:relative;
  box-shadow:0 8px 20px rgba(249,115,22,.32);
}
.back-ic svg { width:24px; height:24px; }
.back-t { position:relative; flex:1; min-width:0; }
.back-b {
  font-family:var(--font-d); font-weight:800; font-size:10.5pt; color:#fff;
  line-height:1.4; letter-spacing:.01em;
}
.back-b em { font-style:normal; color:var(--orange-400); }
.back-s { font-size:9pt; color:rgba(255,255,255,.78); line-height:1.5; margin-top:5px; }
.back-go {
  margin-left:auto; display:flex; align-items:center; gap:12px; flex:0 0 auto; position:relative;
  font-family:var(--font-m); font-size:7pt; font-weight:700; letter-spacing:.2em;
  color:var(--orange-300); text-transform:uppercase;
}
.back-go svg { width:18px; height:18px; color:#fff; }

/* ERP flow */
.flow { margin-top:16px; }
.flow-row { display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.flow-step {
  background:var(--navy-900); color:#fff; border-radius:8px; padding:6px 11px;
  font-size:9pt; font-weight:600; line-height:1.2;
}
.flow-step.acc { background:var(--grad-o); }
.flow-ar { color:var(--orange-500); font-size:12pt; font-weight:700; line-height:1; }
.flow-note { font-size:9pt; color:var(--muted); margin-top:9px; line-height:1.45; }

/* ===================== Footer / contact strip ===================== */
.fd { margin-top:auto; padding-top:13px; border-top:1px solid var(--grey-100); flex:0 0 auto; }
.fd-top { display:flex; align-items:stretch; gap:13px; }
.fd-bar { width:4px; border-radius:2px; background:var(--grad-o); flex:0 0 auto; margin:2px 0; }
.fd-p { font-size:10.5pt; line-height:1.45; color:var(--navy-800); font-weight:500; }
.fd-p b { font-weight:700; color:var(--navy-900); }
.fd-p em { font-style:normal; color:var(--orange-600); font-weight:700; }
.fd-c {
  display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; margin-top:11px;
}
.fd-src {
  font-family:var(--font-m); font-size:7pt; letter-spacing:.18em; color:var(--muted);
  text-transform:uppercase; margin-right:auto;
}
.fd-ci { display:inline-flex; align-items:center; gap:7px; font-size:9pt; color:var(--navy-800); font-weight:500; }
.fd-ci svg { width:13px; height:13px; color:var(--orange-600); flex:0 0 auto; }
.fd-ci b { font-weight:700; color:var(--navy-900); }

/* ===================== Cover — dark sheet ===================== */
.cover { flex:1; display:flex; flex-direction:column; padding-top:30px; min-height:0; justify-content:space-between; }
.cover-kick {
  font-family:var(--font-m); font-size:8pt; font-weight:700; letter-spacing:.24em;
  color:var(--orange-300); text-transform:uppercase;
}
.cover-kick::before { content:''; display:inline-block; width:24px; height:2px; background:var(--grad-o); border-radius:2px; margin-right:12px; vertical-align:middle; }
.cover-h1 {
  font-family:var(--font-d); font-weight:800; font-size:34pt; line-height:1.04;
  letter-spacing:-.02em; color:#fff; margin:16px 0 0; max-width:176mm;
}
.cover-h1 em { font-style:normal; color:var(--orange-400); }
.cover-sub { font-size:12pt; line-height:1.55; color:rgba(255,255,255,.82); margin-top:14px; max-width:150mm; }
.cover-glow {
  margin-top:26px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-l); padding:20px 24px 18px; backdrop-filter:blur(6px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  position:relative;
}
.cover-glow::before {
  content:''; position:absolute; top:-46px; right:-40px; width:170px; height:170px;
  background:radial-gradient(circle, rgba(249,115,22,.28), transparent 70%);
  pointer-events:none;
}
.cover-glow > p { font-size:10.5pt; line-height:1.6; color:rgba(255,255,255,.9); }
.cover-q { margin-top:15px; display:flex; flex-direction:column; gap:9px; position:relative; }
.cover-q-x {
  font-family:var(--font-d); font-weight:700; font-size:11.5pt; color:rgba(255,255,255,.5);
  text-decoration:line-through; text-decoration-color:rgba(255,255,255,.4);
}
.cover-q-ok {
  display:flex; align-items:center; gap:12px;
  font-family:var(--font-d); font-weight:800; font-size:12.5pt; color:#fff;
}
.cover-q-ok .cav { width:24px; height:24px; border-radius:8px; background:var(--grad-o); display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.cover-q-ok .cav svg { width:14px; height:14px; color:#fff; }
.cover-inside {
  display:flex; flex-wrap:wrap; gap:8px; margin-top:26px; align-items:center;
}
.cover-inside-l {
  display:block; width:100%;
  font-family:var(--font-m); font-size:7.5pt; font-weight:700; letter-spacing:.22em;
  color:rgba(255,255,255,.6); text-transform:uppercase; margin-bottom:2px;
}
.cochip {
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16);
  border-radius:var(--r-full); padding:6px 13px; font-size:9pt; color:#fff; font-weight:600;
  display:inline-flex; gap:8px; align-items:center;
}
.cochip b { font-family:var(--font-m); font-size:7.5pt; color:var(--orange-400); font-weight:700; }
.cover-foot {
  padding-top:16px; border-top:1px solid rgba(255,255,255,.12);
  display:flex; align-items:center; gap:14px;
}
.cover-foot-p { font-family:var(--font-d); font-weight:700; font-size:10.5pt; letter-spacing:.05em; color:#fff; line-height:1.4; }
.cover-foot-p em { font-style:normal; color:var(--orange-300); }
.cover-turn {
  margin-left:auto; display:flex; align-items:center; gap:9px;
  font-family:var(--font-m); font-size:7.5pt; letter-spacing:.2em; color:rgba(255,255,255,.6); text-transform:uppercase;
}
.cover-turn svg { width:16px; height:16px; color:var(--orange-400); }

/* ===================== Decision guide ===================== */
.dg-sec { margin-top:24px; flex:1; min-height:0; display:flex; flex-direction:column; }
.dg-intro { font-size:11pt; line-height:1.55; color:#1E2B45; max-width:168mm; }
.dg {
  display:grid; grid-template-columns:1fr 1fr; gap:11px; margin-top:18px;
}
.dg-row {
  display:flex; align-items:center; gap:12px;
  background:var(--white); border:1px solid var(--grey-100); border-radius:12px;
  padding:11px 14px; box-shadow:var(--sh-tile);
}
.dg-ic {
  width:32px; height:32px; border-radius:9px; background:var(--navy-50); color:var(--navy-600);
  border:1px solid var(--navy-100); display:flex; align-items:center; justify-content:center; flex:0 0 auto;
}
.dg-ic svg { width:17px; height:17px; }
.dg-q { font-size:9.5pt; font-weight:600; color:var(--navy-900); line-height:1.3; flex:1; min-width:0; }
.dg-go { display:flex; align-items:center; gap:6px; flex:0 0 auto; }
.dg-go svg { width:14px; height:14px; color:var(--orange-500); }
.dg-go b { font-family:var(--font-d); font-size:8pt; font-weight:800; color:var(--orange-600); letter-spacing:.03em; white-space:nowrap; }

/* Final statement band */
.finalb {
  margin-top:22px; background:var(--grad-n); border-radius:var(--r-l); padding:26px 30px;
  color:#E7ECF6; position:relative; overflow:hidden; box-shadow:var(--sh-card);
}
.finalb::before {
  content:''; position:absolute; top:-70px; right:-50px; width:260px; height:260px;
  background:radial-gradient(circle, rgba(249,115,22,.30), transparent 68%);
}
.finalb h3 {
  font-family:var(--font-d); font-weight:800; font-size:20pt; color:#fff; line-height:1.1; margin:0; position:relative;
}
.finalb h3 em { font-style:normal; color:var(--orange-400); }
.finalb p { font-size:10.5pt; line-height:1.55; color:rgba(255,255,255,.84); margin-top:11px; max-width:146mm; position:relative; }
.finalb p b { color:#fff; }

/* Contact card */
.cta {
  display:flex; gap:20px; align-items:center; margin-top:22px;
  background:var(--white); border:1px solid var(--grey-100); border-radius:var(--r-l);
  padding:20px 26px; box-shadow:var(--sh-card);
}
.cta-l { flex:1; min-width:0; }
.cta-s {
  font-family:var(--font-m); font-size:7.5pt; font-weight:700; letter-spacing:.2em;
  color:var(--orange-600); text-transform:uppercase; margin-bottom:6px;
}
.cta-t { font-family:var(--font-d); font-weight:800; font-size:14.5pt; line-height:1.15; color:var(--navy-900); }
.cta-src { font-family:var(--font-m); font-size:7.5pt; letter-spacing:.12em; color:var(--muted); text-transform:uppercase; margin-top:9px; }
.cta-r { display:grid; grid-template-columns:auto auto; gap:9px 20px; flex:0 0 auto; align-items:center; }
.cta-item { display:flex; align-items:center; gap:8px; font-size:10pt; color:var(--navy-800); font-weight:500; }
.cta-item svg { width:26px; height:26px; color:#fff; background:var(--grad-o); border-radius:8px; padding:6px; flex:0 0 auto; box-shadow:0 5px 12px rgba(249,115,22,.28); }
.cta-item b { display:block; font-weight:700; color:var(--navy-900); white-space:nowrap; }
.cta-item small { display:block; font-family:var(--font-m); font-size:6.5pt; letter-spacing:.14em; color:var(--muted); text-transform:uppercase; margin-top:2px; }

/* ===================== Social 1080×1350 ===================== */
body.social { background:var(--navy-900); }
body.social main { padding:54px 0 0; gap:0; }
body.social .sheet { zoom:1.2027; margin:0; border-radius:0; box-shadow:none; }

/* ===================== SEO / accessibility links (not rendered) ===================== */
.hidden-nav {
  position:absolute; width:1px; height:1px; margin:-1px; padding:0;
  border:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%);
  white-space:nowrap;
}

/* ===================== Responsive =====================
   Desktop (>=769px) keeps the A4 document appearance.
   Mobile (<=768px) reflows into a natural article website.
   The social 1080x1350 preview mode is intentionally excluded
   from all mobile layout overrides: it has its own canvas.
   Print stays a fixed 210mm x 297mm A4 (see Print section). */

@media screen and (min-width: 769px) {
  /* Desktop: A4 document look, flow-safe sizing */
  body:not(.social) .sheet {
    width:210mm; min-height:297mm; height:auto;
    box-sizing:border-box;
  }
}

@media screen and (max-width: 768px) {
  /* --- whole-page guard: vertical scroll only, clip keeps sticky intact --- */
  html, body { max-width:100%; overflow-x:hidden; overflow-x:clip; }

  /* --- toolbar: in-flow sticky header, touch-friendly, wrap --- */
  .tb {
    position:sticky; top:0; height:auto; min-height:54px;
    flex-wrap:wrap; gap:8px 12px; padding:8px 12px;
  }
  .tb-b { font-size:12.5px; }
  .tb-b small { font-size:8px; }
  .tb-tools { margin-left:0; width:100%; flex-wrap:wrap; }
  .tb-sep { display:none; }
  .tb-nav { width:44px; height:44px; font-size:18px; }
  .tb select { flex:1; min-width:0; max-width:none; height:44px; font-size:13px; padding:0 12px; }
  .tb-btn { min-height:44px; padding:9px 14px; font-size:13px; }

  /* --- main: cards flow vertically --- */
  body:not(.social) main { padding:6px 0 0; gap:12px; }

  /* --- sheet: fluid, never 210mm wide --- */
  body:not(.social) .sheet {
    width:100%; max-width:100%; min-height:0; height:auto;
    margin:0; padding:0; box-sizing:border-box;
    border-radius:0; box-shadow:none; overflow:visible;
  }
  body:not(.social) .sheet-inner { padding:14px 18px 18px; }

  /* --- header: wrap instead of overflowing --- */
  .hd { flex-wrap:wrap; row-gap:8px; column-gap:12px; padding-bottom:10px; }
  .hd-brand { flex:1 1 auto; min-width:0; }
  .hd-name { white-space:normal; font-size:12.5px; line-height:1.2; }
  .hd-tag { white-space:normal; font-size:8.5px; letter-spacing:.16em; }
  .hd-end { width:100%; margin-left:0; flex-direction:row; align-items:center; justify-content:space-between; }
  .hd-eyebrow { white-space:normal; font-size:9.5px; }
  .hd-page { font-size:9px; }

  /* --- solution header --- */
  .sol-head { gap:13px; margin:18px 0 16px; }
  .sol-badge { width:52px; height:52px; border-radius:14px; }
  .sol-badge svg { width:24px; height:24px; }
  .sol-q { font-size:clamp(20px, 6.4vw, 26px); line-height:1.12; }
  .sol-q.ql { font-size:clamp(18px, 5.6vw, 22px); }
   .sol-aka { padding:8px 16px; font-size:12.5px; flex-wrap:wrap; white-space:normal; }
   .sol-kick { font-size:10.5px; }

  /* --- two-column body becomes single column --- */
  .sol-body { grid-template-columns:1fr; gap:14px; }
  .sol-p { font-size:16px; line-height:1.6; }
  .call { padding:12px 14px; }
  .call p { font-size:15.5px; line-height:1.55; }
  ul.pl li { font-size:15px; line-height:1.5; }
  .chip { font-size:13px; padding:6px 13px; }
  .flow-step { font-size:13.5px; padding:6px 12px; }
  .flow-note { font-size:13.5px; line-height:1.5; }

  /* --- core-message band wraps --- */
  .back { flex-wrap:wrap; gap:14px; margin-top:16px; padding:16px 18px; }
  .back-t { flex:1 1 100%; }
  .back-b { font-size:16px; }
  .back-s { font-size:13.5px; }
  .back-go { margin-left:0; width:100%; }

  /* --- footer / contact strip --- */
  .fd-p { font-size:15px; line-height:1.5; }
  .fd-ci { font-size:13.5px; }
  .fd-c { gap:8px 14px; }

  /* --- cover --- */
  .cover { padding-top:22px; }
  .cover-kick { font-size:11px; }
  .cover-h1 { font-size:clamp(27px, 8.4vw, 36px); max-width:100%; }
  .cover-sub { font-size:16px; max-width:100%; }
  .cover-glow { padding:16px; }
  .cover-glow > p { font-size:15.5px; line-height:1.6; }
  .cover-q-x { font-size:15px; }
  .cover-q-ok { font-size:16px; }
  .cochip { font-size:12.5px; padding:6px 12px; }
  .cover-inside { margin-top:20px; }
  .cover-foot { flex-wrap:wrap; gap:12px; }
  .cover-foot-p { font-size:15px; }
  .cover-turn { margin-left:0; font-size:10px; }

  /* --- decision guide / final band / contact --- */
  .dg { grid-template-columns:1fr; gap:10px; }
  .dg-intro { font-size:16px; line-height:1.6; max-width:100%; }
  .dg-q { font-size:15px; }
  .finalb { padding:20px; margin-top:18px; }
  .finalb h3 { font-size:clamp(21px, 6.6vw, 26px); }
  .finalb p { font-size:15.5px; max-width:100%; }
  .cta { flex-direction:column; align-items:stretch; gap:14px; padding:18px; }
  .cta-r { grid-template-columns:1fr; gap:10px; }
  .cta-t { font-size:20px; line-height:1.2; }
  .cta-item b { white-space:normal; overflow-wrap:anywhere; font-size:14.5px; }
  .cta-item small { font-size:9px; }
  .cta-src { font-size:9.5px; letter-spacing:.14em; }
}

/* ===================== Print ===================== */
@page { size:A4 portrait; margin:0; }
@media print {
  html, body { width:210mm; height:297mm; margin:0; padding:0; overflow:visible; }
  body { background:#fff; }
  body.social { background:#fff; }
  body.social .sheet { zoom:1; }
  .no-print, .tb { display:none !important; }
  main { padding:0; gap:0; }
  .sheet {
    width:210mm; min-height:297mm; height:297mm;
    margin:0; box-shadow:none; border-radius:0;
    page-break-after:always; break-after:page;
  }
  .sheet:last-child { page-break-after:auto; break-after:auto; }
  .sheet.navy { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
  .sol-badge, .chk, .flow-step.acc, .dg-ic, .cta-item svg, .cover-q-ok .cav { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}