/* TechRunbook Modern UI v3 */
:root{
  --tr-ink:#10233f;
  --tr-muted:#5f7088;
  --tr-blue:#1769e0;
  --tr-blue-dark:#0d4fb5;
  --tr-cyan:#19a7e8;
  --tr-surface:#f6f9fc;
  --tr-card:#ffffff;
  --tr-line:#dce5ef;
  --tr-navy:#071a33;
  --tr-radius-sm:8px;
  --tr-radius-md:12px;
  --tr-radius-lg:18px;
  --tr-radius-xl:26px;
  --tr-shadow:0 12px 32px rgba(16,35,63,.08);
}
html{scroll-behavior:smooth}
body{color:var(--tr-ink);background:#fff}
.utility-bar{display:none!important}
.site-header{background:rgba(255,255,255,.96);border-bottom:1px solid var(--tr-line);box-shadow:0 4px 20px rgba(16,35,63,.06)}
.nav{min-height:78px}
.brand-logo{width:218px}
.nav-links{gap:22px;color:#425570;font-size:14px}
.nav-links a{padding:28px 0}
.nav-links a[aria-current=page]:after{bottom:16px;height:2px;border-radius:2px}
.nav-cta{padding:11px 15px!important;border-radius:var(--tr-radius-md);background:var(--tr-blue);color:#fff!important}
.community-cta{display:inline-flex!important;align-items:center;justify-content:center;min-height:42px;padding:10px 14px!important;border:1px solid #bcd4f4;border-radius:var(--tr-radius-md);background:#edf5ff;color:#1256ae!important;font-weight:700;white-space:nowrap}
.community-cta:hover{background:#e1efff!important;color:#0b4c9e!important}
.header-search{border-radius:var(--tr-radius-md)}
.button,.nav-cta{border-radius:var(--tr-radius-md)}
.button-secondary{border-color:#bcd4f4;color:#174f92;background:#fff}
.home-hero-v2{padding:86px 0 72px;background:linear-gradient(135deg,#f5f9fd 0%,#edf6ff 58%,#e8f3ff 100%)}
.hero-v2-grid{gap:54px}
.hero-v2 h1{color:#0b213d;font-size:clamp(44px,5vw,68px);letter-spacing:-3px}
.hero-v2 h1 span{color:var(--tr-blue)}
.hero-v2 p{color:#536982;max-width:650px}
.hero-v2-actions{margin-top:30px}
.hero-art{border-radius:var(--tr-radius-xl);box-shadow:0 24px 60px rgba(10,55,105,.18)}
.platform-strip{padding:28px 0 42px}
.platform-grid{gap:14px}
.platform-card{border-color:var(--tr-line);border-radius:var(--tr-radius-lg);box-shadow:0 8px 24px rgba(16,35,63,.055);padding:22px 14px}
.platform-card h3{color:#102b4c;font-size:16px}
.platform-card p{color:#61748d;font-size:13px;min-height:36px}
.platform-card a{font-size:13px}
.toolkit-band-v2{border-color:#c7def7;background:linear-gradient(100deg,#eef7ff,#e4f1ff);border-radius:var(--tr-radius-lg);padding:24px 28px;margin:12px 0 60px}
.toolkit-band-v2 p{font-size:14px;color:#60738b}
.section{padding:82px 0}
.section-soft{background:#f7f9fc}
.section-heading{max-width:720px}
.section-heading h2{color:#10233f}
.eyebrow{font-size:12px;letter-spacing:.1em}
.card-grid{gap:18px}
.card{border-color:var(--tr-line);border-radius:var(--tr-radius-lg);box-shadow:0 8px 25px rgba(16,35,63,.05);padding:26px}
.card h3{color:#122c4b}
.card p{color:#60738b;font-size:15px;line-height:1.65}
.card>a{display:inline-flex;align-items:center;margin-top:16px;font-size:14px;font-weight:700;color:var(--tr-blue)}
.icon{border-radius:var(--tr-radius-md);background:#edf5ff;color:var(--tr-blue)}
.band{background:linear-gradient(110deg,#081d38,#0d3563);padding:58px 0}
.band h2{font-size:32px}
.site-footer{background:#061528}
.page-hero-v2{padding:74px 0 56px;background:linear-gradient(135deg,#f4f8fc,#eaf4ff);border-bottom:1px solid var(--tr-line)}
.page-hero-v2 h1{color:#10233f}
@media(max-width:980px){.nav-links{gap:14px}.brand-logo{width:200px}}
@media(max-width:760px){
 .nav{min-height:70px}
 .brand-logo{width:182px}
 .nav-links[style*="display: flex"]{position:absolute;left:16px;right:16px;top:70px;display:flex!important;flex-direction:column;align-items:stretch;gap:4px;padding:14px;background:#fff;border:1px solid var(--tr-line);border-radius:var(--tr-radius-lg);box-shadow:var(--tr-shadow)}
 .nav-links[style*="display: flex"] a{padding:12px 10px}
 .nav-links[style*="display: flex"] .header-search{align-self:flex-start}
 .nav-links[style*="display: flex"] .community-cta,.nav-links[style*="display: flex"] .nav-cta{width:100%}
 .home-hero-v2{padding:58px 0 44px}
 .hero-v2 h1{font-size:44px}
 .hero-art{min-height:310px}
 .platform-card p{min-height:0}
 .toolkit-band-v2{padding:22px}
 .section{padding:64px 0}
 .band{padding:46px 0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.platform-card:hover,.nav-cta:hover,.button:hover{transform:none}}
.platform-card h2{margin:8px 0 4px;font-size:16px;line-height:1.25;color:#102b4c}
/* Article presentation refresh */
.tr7{--ink:#10233f;--muted:#5f7088;--line:#dce5ef;--blue:#1769e0;--violet:#1769e0;--bg:#f6f9fc}
.tr7 .crumbs{padding:20px 0;font-size:14px}
.tr7 .hero{background:linear-gradient(135deg,#f5f9fd,#eaf4ff);border-color:var(--tr-line)}
.tr7 .category{color:var(--tr-blue);font-size:12px;letter-spacing:.1em}
.tr7 h1{color:#0b213d}
.tr7 .lead{color:#536982;font-size:18px;line-height:1.7}
.tr7 .badge{border-color:var(--tr-line);border-radius:var(--tr-radius-pill);color:#36516f}
.tr7 .summary-card,.tr7 .section,.tr7 .side-card{border-color:var(--tr-line);border-radius:var(--tr-radius-lg);box-shadow:0 8px 24px rgba(16,35,63,.055)}
.tr7 .summary-card p,.tr7 p,.tr7 li{color:#536982}
.tr7 .summary-label{color:#10233f}
.tr7 .summary-icon,.tr7 .num{background:#edf5ff;color:var(--tr-blue);border-radius:var(--tr-radius-md)}
.tr7 h2{color:#10233f;font-size:26px;font-weight:750}
.tr7 h3{color:#23415f;font-size:19px;font-weight:650;line-height:1.35}
.tr7 .toc a{font-size:14px;color:#526b86}
.tr7 .toc a:hover,.tr7 .toc a:focus-visible{color:var(--tr-blue)}
.tr7 pre{border-radius:var(--tr-radius-md);font-size:13px}
.tr7 .related-guides-section:not(.topic-cluster-section){background:#fff;color:var(--tr-ink);border:1px solid var(--tr-line);box-shadow:0 8px 24px rgba(16,35,63,.055)}
.tr7 .related-guides-section:not(.topic-cluster-section) h2{color:var(--tr-ink)}
.tr7 .related-guides-section:not(.topic-cluster-section) p{color:var(--tr-muted)}
.tr7 .related-guides-section:not(.topic-cluster-section) .related-guides a{color:var(--tr-blue)}
.tr7 .decision-flow{display:block;width:100%;max-width:1200px;height:auto;margin:24px auto;border:1px solid var(--tr-line);border-radius:var(--tr-radius-lg);background:#fff}
.tr7 a:focus-visible,.site-header a:focus-visible,.site-header button:focus-visible{outline:3px solid #7cb8ff;outline-offset:3px}
@media(max-width:900px){.tr7 .sidebar{order:-1}.tr7 .sidebar .side-card{position:static}.tr7 .crumbs{padding:16px 0}}
:root{--tr-radius-pill:999px}


/* Community question CTA */
.community-question-container {
  width: min(1200px, calc(100% - 40px));
  margin: 0 auto;
}

.community-question-cta {
  margin: 24px 0 32px;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  border: 1px solid #d9e2f0;
  border-radius: 16px;
  background: #f8fbff;
}

.community-question-copy {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.community-question-copy strong {
  color: #172033;
  font-size: 1rem;
  line-height: 1.4;
}

.community-question-copy span {
  color: #4b5563;
  font-size: .875rem;
  line-height: 1.5;
}

.community-question-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 44px;
  padding: 10px 18px;
  border-radius: 10px;
  background: #2563eb;
  color: #fff !important;
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .2s ease, transform .2s ease;
}

.community-question-button:hover {
  background: #1d4ed8;
  color: #fff !important;
}

.community-question-button:focus-visible {
  outline: 3px solid rgba(37, 99, 235, .35);
  outline-offset: 3px;
}

@media (max-width: 700px) {
  .community-question-container {
    width: min(100% - 28px, 1200px);
  }

  .community-question-cta {
    align-items: stretch;
    flex-direction: column;
    margin: 18px 0 24px;
    padding: 16px;
  }

  .community-question-button {
    width: 100%;
  }
}

/* Clean UX v5: restrained long-article navigation */
.back-to-top {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 24px 0;
  min-height: 40px;
  padding: 8px 12px;
  border: 1px solid var(--border, #d9e2f0);
  border-radius: 10px;
  color: var(--link, #2563eb);
  background: #fff;
  font-size: .875rem;
  font-weight: 600;
  text-decoration: none;
}
.back-to-top:focus-visible {
  outline: 3px solid rgba(37,99,235,.3);
  outline-offset: 3px;
}

/* TechRunbook v6 - focused runbook UX */
.runbook-quick-fix {
  margin: 28px 0;
  padding: 20px 22px;
  border: 1px solid #d9e2f0;
  border-left: 4px solid #2563eb;
  border-radius: 12px;
  background: #f8fbff;
}
.runbook-quick-fix h2,
.runbook-quick-fix h3 {
  margin-top: 0;
}
.runbook-quick-fix ul {
  margin: 12px 0 0;
  padding-left: 20px;
}
.runbook-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 16px 0 24px;
}
.runbook-meta-item {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid #d9e2f0;
  border-radius: 999px;
  background: #fff;
  color: #4b5563;
  font-size: .8125rem;
  line-height: 1.2;
}
.code-block-wrap {
  position: relative;
}
.code-copy-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 7px 10px;
  margin: 8px 0;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: #172033;
  font: inherit;
  font-size: .8125rem;
  font-weight: 700;
  cursor: pointer;
}
.code-copy-button:focus-visible,
.runbook-helpful button:focus-visible {
  outline: 3px solid rgba(37,99,235,.3);
  outline-offset: 3px;
}
.runbook-review {
  margin: 20px 0 0;
  color: #6b7280;
  font-size: .8125rem;
}
.runbook-helpful {
  margin: 36px 0 0;
  padding: 18px 20px;
  border-top: 1px solid #e5e7eb;
}
.runbook-helpful strong {
  color: #172033;
}
.runbook-helpful-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.runbook-helpful button {
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid #d9e2f0;
  border-radius: 10px;
  background: #fff;
  color: #172033;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}
.runbook-helpful button:hover {
  background: #f8fafc;
}
@media (max-width: 768px) {
  .runbook-meta-item { min-height: 36px; }
  .code-copy-button { min-height: 40px; }
}

.references-section { margin-top: 32px; }
.references-section .related-guides { margin-top: 12px; }

/* Copy command button: self-contained SVG icon, no external icon dependency */
.code-copy-button {
  gap: 7px;
}
.code-copy-icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  align-items: center;
  justify-content: center;
}
.code-copy-icon svg {
  display: block;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.code-copy-button.is-success {
  border-color: #b8d9c4;
}
.code-copy-button.is-error {
  border-color: #e5bcbc;
}

/* Copy icon v2: compact filled overlapping-copy glyph */
.code-copy-icon svg {
  width: 15px;
  height: 15px;
  stroke: none;
  fill: currentColor;
}
.code-copy-icon svg rect {
  stroke: none;
}
