.content-page { background: #fff; }
.content-shell { width: min(1120px, calc(100% - 56px)); margin: 0 auto; }
.content-hero { padding: 92px 0 62px; border-bottom: 1px solid var(--line); }
.breadcrumbs { display: flex; gap: 8px; flex-wrap: wrap; color: #9599a0; font-size: 10px; }
.breadcrumbs a:hover { color: var(--ink); }
.breadcrumbs span::before { content: '/'; margin-right: 8px; color: #c1c3c8; }
.content-hero-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(280px,.55fr); gap: 86px; align-items: end; margin-top: 42px; }
.content-hero h1 { max-width: 800px; margin: 0; font-size: clamp(58px,6vw,88px); line-height: .95; letter-spacing: -.064em; font-weight: 640; }
.content-hero .dek { max-width: 760px; margin: 28px 0 0; color: #555960; font-size: 19px; line-height: 1.55; letter-spacing: -.018em; }
.answer-card { border: 1px solid var(--line-strong); border-radius: 8px; padding: 22px; background: #fafafa; }
.answer-card .micro-label { display: block; margin-bottom: 12px; }
.answer-card p { margin: 0; color: #454950; font-size: 13px; line-height: 1.65; }
.answer-card strong { color: var(--ink); }
.answer-card .mini-cta { margin-top: 18px; }
.mini-cta { min-height: 40px; display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; padding: 0 12px; border: 1px solid var(--ink); border-radius: 6px; background: var(--ink); color: #fff; font-size: 11px; font-weight: 650; }
.mini-cta:hover { background: #24262a; }
.article-layout { display: grid; grid-template-columns: 210px minmax(0,720px); gap: 74px; justify-content: center; padding: 64px 0 96px; }
.toc { position: sticky; top: 94px; align-self: start; }
.toc-label { display: block; margin-bottom: 14px; color: #a0a4aa; font: 700 8px/1 ui-monospace, monospace; letter-spacing: .04em; }
.toc a { display: block; padding: 7px 0; color: #787c83; font-size: 10px; line-height: 1.3; }
.toc a:hover { color: var(--ink); }
.article { min-width: 0; }
.article > section { scroll-margin-top: 90px; padding: 0 0 54px; margin: 0 0 54px; border-bottom: 1px solid var(--line); }
.article > section:last-child { border-bottom: 0; margin-bottom: 0; }
.article h2 { margin: 0 0 22px; font-size: 38px; line-height: 1.03; letter-spacing: -.048em; font-weight: 630; }
.article h3 { margin: 30px 0 12px; font-size: 20px; line-height: 1.15; letter-spacing: -.03em; }
.article p { margin: 0 0 18px; color: #4f535a; font-size: 15px; line-height: 1.75; }
.article p.lead { color: #2f3237; font-size: 17px; line-height: 1.65; }
.article ul, .article ol { margin: 18px 0 20px; padding-left: 20px; color: #4f535a; font-size: 14px; line-height: 1.75; }
.article li + li { margin-top: 8px; }
.key-grid { display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid var(--line-strong); border-radius: 8px; overflow: hidden; margin: 26px 0; }
.key-grid > div { min-height: 128px; padding: 18px; border-right: 1px solid var(--line); background: #fff; }
.key-grid > div:last-child { border-right: 0; }
.key-grid span, .key-grid strong, .key-grid small { display: block; }
.key-grid span { color: #989ca3; font: 700 8px/1 ui-monospace, monospace; text-transform: uppercase; }
.key-grid strong { margin-top: 12px; font-size: 18px; letter-spacing: -.025em; }
.key-grid small { margin-top: 7px; color: #7e8289; font-size: 9px; line-height: 1.45; }
.callout { margin: 28px 0; padding: 20px 22px; border-left: 2px solid var(--accent); background: #fff8f6; }
.callout strong { display: block; margin-bottom: 7px; font-size: 13px; }
.callout p { margin: 0; color: #6f5b55; font-size: 12px; }
.article-table { width: 100%; border-collapse: collapse; margin: 24px 0; border: 1px solid var(--line-strong); font-size: 11px; }
.article-table th, .article-table td { padding: 12px 13px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; line-height: 1.45; }
.article-table th { background: #fafafa; color: #777b82; font: 700 8px/1 ui-monospace, monospace; text-transform: uppercase; }
.article-table tr:last-child td { border-bottom: 0; }
.article-table td strong { color: var(--ink); }
.workflow-mini { margin: 26px 0; border: 1px solid var(--line-strong); border-radius: 8px; overflow: hidden; }
.workflow-mini-head { padding: 12px 14px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; color: #8a8e95; font: 700 8px/1 ui-monospace, monospace; }
.workflow-mini-flow { display: flex; align-items: stretch; overflow-x: auto; background: #fff; }
.workflow-mini-flow div { min-width: 142px; padding: 18px 14px; border-right: 1px solid var(--line); }
.workflow-mini-flow div:last-child { border-right: 0; }
.workflow-mini-flow span, .workflow-mini-flow strong, .workflow-mini-flow small { display: block; }
.workflow-mini-flow span { color: #a0a4aa; font: 700 7px/1 ui-monospace, monospace; }
.workflow-mini-flow strong { margin-top: 9px; font-size: 10px; }
.workflow-mini-flow small { margin-top: 6px; color: #8b8f96; font-size: 8px; line-height: 1.35; }
.workflow-mini-flow .ai-step { background: #fff7f4; box-shadow: inset 0 2px 0 var(--accent); }
.sources { padding-top: 4px; }
.sources a { display: block; margin: 10px 0; color: #555960; font-size: 11px; text-decoration: underline; text-underline-offset: 3px; }
.article-meta { display: flex; flex-wrap: wrap; gap: 10px 18px; padding-top: 18px; color: #999da4; font-size: 9px; }
.related-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }
.related-card { min-height: 142px; padding: 18px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.related-card span { color: #a0a4aa; font: 700 8px/1 ui-monospace, monospace; text-transform: uppercase; }
.related-card strong { display: block; margin-top: 18px; font-size: 15px; letter-spacing: -.025em; }
.related-card small { display: block; margin-top: 7px; color: #858991; font-size: 9px; line-height: 1.4; }
.related-card:hover { border-color: #bfc2c7; transform: translateY(-1px); }
.content-cta { padding: 76px 0; border-top: 1px solid var(--line); background: #fafafa; }
.content-cta-grid { display: grid; grid-template-columns: 1fr .7fr; gap: 70px; align-items: center; }
.content-cta h2 { margin: 0; font-size: clamp(48px,5vw,70px); line-height: .96; letter-spacing: -.058em; }
.content-cta p { margin: 0 0 18px; color: #64686f; font-size: 13px; line-height: 1.6; }
.resource-footer { border-top: 1px solid var(--line); }
.resource-footer .footer { width: min(1360px, calc(100% - 56px)); }

.scanner-wrap { padding: 62px 0 100px; }
.scanner-grid { display: grid; grid-template-columns: minmax(0,.8fr) minmax(380px,1.2fr); gap: 54px; align-items: start; }
.scanner-intro { position: sticky; top: 92px; }
.scanner-intro h1 { margin: 20px 0 20px; font-size: clamp(54px,5.3vw,78px); line-height: .94; letter-spacing: -.06em; }
.scanner-intro p { max-width: 520px; margin: 0; color: #62666d; font-size: 15px; line-height: 1.7; }
.scanner-card { border: 1px solid var(--line-strong); border-radius: 9px; background: #fff; overflow: hidden; box-shadow: 0 20px 60px rgba(16,18,22,.05); }
.scanner-card-head { padding: 18px 20px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; color: #8b8f96; font: 700 8px/1 ui-monospace, monospace; }
.scanner-form { padding: 22px 20px 24px; }
.field { margin-bottom: 20px; }
.field label { display: block; margin-bottom: 8px; color: #565a61; font-size: 10px; font-weight: 650; }
.field input, .field select, .field textarea { width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; color: var(--ink); font: inherit; font-size: 12px; outline: none; }
.field textarea { min-height: 88px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.scanner-submit { width: 100%; height: 48px; border: 1px solid var(--ink); border-radius: 6px; background: var(--ink); color: #fff; font-size: 12px; font-weight: 650; }
.scanner-submit:hover { background: #24262a; }
.scanner-result { padding: 22px 20px 24px; }
.scanner-result[hidden] { display: none; }
.result-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.result-score { min-width: 86px; height: 86px; border: 1px solid #ffc7ba; border-radius: 50%; display: grid; place-items: center; background: #fff8f6; }
.result-score span { font-size: 29px; font-weight: 680; letter-spacing: -.055em; }
.result-copy h2 { margin: 8px 0 7px; font-size: 28px; letter-spacing: -.045em; }
.result-copy p { margin: 0; color: #6b6f76; font-size: 11px; line-height: 1.55; }
.result-metrics { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 22px; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }
.result-metrics div { padding: 15px 13px; border-right: 1px solid var(--line); }
.result-metrics div:last-child { border-right: 0; }
.result-metrics span, .result-metrics strong, .result-metrics small { display: block; }
.result-metrics span { color: #999da4; font: 700 7px/1 ui-monospace, monospace; text-transform: uppercase; }
.result-metrics strong { margin-top: 9px; font-size: 18px; }
.result-metrics small { margin-top: 4px; color: #8a8e95; font-size: 7px; }
.result-plan { margin-top: 18px; padding: 16px; border: 1px solid var(--line); border-radius: 7px; background: #fafafa; }
.result-plan strong { font-size: 10px; }
.result-plan ol { margin: 12px 0 0; padding-left: 18px; color: #64686f; font-size: 9px; line-height: 1.65; }
.result-note { margin-top: 14px; color: #999da4; font-size: 8px; line-height: 1.45; }

@media (max-width: 900px) {
  .content-shell { width: min(100% - 30px,1120px); }
  .content-hero { padding-top: 68px; }
  .content-hero-grid, .content-cta-grid, .scanner-grid { grid-template-columns: 1fr; gap: 36px; }
  .content-hero h1 { font-size: clamp(52px,13vw,76px); }
  .content-hero .dek { font-size: 16px; }
  .article-layout { grid-template-columns: 1fr; gap: 30px; padding-top: 42px; }
  .toc { position: static; border: 1px solid var(--line); border-radius: 7px; padding: 14px 16px; }
  .toc a { display: inline-block; margin-right: 16px; }
  .key-grid, .related-grid { grid-template-columns: 1fr; }
  .key-grid > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .key-grid > div:last-child { border-bottom: 0; }
  .content-cta { padding: 62px 0; }
  .scanner-intro { position: static; }
  .field-grid, .result-metrics { grid-template-columns: 1fr; }
  .result-metrics div { border-right: 0; border-bottom: 1px solid var(--line); }
  .result-metrics div:last-child { border-bottom: 0; }
}

/* ==========================================================
   SparksOps editorial/product design system v2
   Applied to SEO/GEO content, library and tool pages.
   ========================================================== */

.design-v2 {
  --content-max: 1220px;
  --content-ink: #0a0b0d;
  --content-muted: #6d7179;
  --content-faint: #9da1a8;
  --content-line: #e5e7ea;
  --content-panel: #f6f7f8;
  --signal: #ff5a36;
  background: #fff;
}

.design-v2 .content-shell { width: min(var(--content-max), calc(100% - 56px)); }
.design-v2 .reading-progress {
  position: fixed; z-index: 49; top: 64px; left: 0; right: 0; height: 1px; pointer-events: none;
}
.design-v2 .reading-progress span { display: block; width: 0; height: 100%; background: var(--signal); transition: width .08s linear; }

.design-v2 .premium-hero {
  position: relative; overflow: hidden; padding: 98px 0 78px; border-bottom: 1px solid var(--content-line);
  background:
    linear-gradient(rgba(15,17,20,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15,17,20,.035) 1px, transparent 1px),
    #fbfbfc;
  background-size: 48px 48px;
}
.design-v2 .premium-hero::before {
  content: ''; position: absolute; width: 480px; height: 480px; right: 9vw; top: -250px; border: 1px solid rgba(255,90,54,.18); border-radius: 50%;
  box-shadow: 0 0 0 64px rgba(255,90,54,.025), 0 0 0 128px rgba(255,90,54,.014);
}
.design-v2 .premium-hero::after {
  content: ''; position: absolute; inset: auto 0 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,90,54,.7), transparent); opacity: .3;
}
.design-v2 .breadcrumbs { position: relative; z-index: 2; font-size: 9px; letter-spacing: .02em; color: #a0a4ab; }
.design-v2 .content-hero-grid { position: relative; z-index: 2; grid-template-columns: minmax(0,1.08fr) minmax(360px,.72fr); gap: 92px; margin-top: 48px; align-items: stretch; }
.design-v2 .content-hero h1 { max-width: 820px; font-size: clamp(62px,6.2vw,94px); line-height: .91; letter-spacing: -.069em; font-weight: 650; }
.design-v2 .content-hero .dek { max-width: 760px; margin-top: 30px; font-size: 18px; line-height: 1.58; color: #4e5259; }
.design-v2 .hero-meta-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.design-v2 .hero-meta-chips span {
  display: inline-flex; align-items: center; min-height: 30px; padding: 0 10px; border: 1px solid #dedfe3; border-radius: 999px; background: rgba(255,255,255,.72);
  color: #72767d; font: 700 8px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .02em; text-transform: uppercase;
}
.design-v2 .hero-meta-chips span:first-child { border-color: #ffc8bb; color: #a74833; background: #fff6f3; }

/* Dark intelligence panel in the hero */
.design-v2 .answer-card {
  position: relative; overflow: hidden; border: 1px solid #24272d; border-radius: 12px; padding: 26px; background: #0c0e11; color: #fff;
  box-shadow: 0 30px 80px rgba(16,18,23,.14), 0 1px 0 rgba(255,255,255,.05) inset;
}
.design-v2 .answer-card::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 28px 28px;
  mask-image: linear-gradient(to bottom, black, transparent 72%);
}
.design-v2 .answer-card > * { position: relative; z-index: 1; }
.design-v2 .answer-card .micro-label { color: #777d86; margin-bottom: 14px; }
.design-v2 .answer-card > p { color: #b0b5bd; font-size: 12px; line-height: 1.72; }
.design-v2 .answer-card > p strong { color: #fff; font-weight: 620; }
.design-v2 .answer-card .mini-cta { margin-top: 20px; border-color: #3a3e46; background: #171a1f; color: #e5e7ea; }
.design-v2 .answer-card .mini-cta:hover { border-color: #555a63; background: #20242a; }

.signal-viz { margin-top: 22px; border: 1px solid #292d34; border-radius: 8px; overflow: hidden; background: #101318; }
.signal-viz-head { min-height: 34px; padding: 0 11px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #292d34; color: #686e77; font: 700 7px/1 ui-monospace, Menlo, monospace; letter-spacing: .04em; }
.signal-viz-head b { color: #989ea7; font-weight: 700; }
.signal-viz-foot { display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid #292d34; }
.signal-viz-foot > div { min-height: 52px; padding: 11px; border-right: 1px solid #292d34; }
.signal-viz-foot > div:last-child { border-right: 0; }
.signal-viz-foot span, .signal-viz-foot strong { display: block; }
.signal-viz-foot span { color: #60666f; font: 700 6px/1 ui-monospace, Menlo, monospace; }
.signal-viz-foot strong { margin-top: 7px; color: #cdd1d6; font-size: 9px; font-weight: 600; }

.network-canvas { position: relative; height: 148px; background: radial-gradient(circle at 68% 44%, rgba(255,90,54,.08), transparent 34%); }
.net-node { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #747a83; box-shadow: 0 0 0 5px rgba(116,122,131,.08); }
.net-node.hot { background: var(--signal); box-shadow: 0 0 0 6px rgba(255,90,54,.10), 0 0 28px rgba(255,90,54,.25); }
.net-node.n1{left:14%;top:30%}.net-node.n2{left:34%;top:64%}.net-node.n3{left:61%;top:38%}.net-node.n4{left:78%;top:66%}.net-node.n5{left:86%;top:24%}
.net-line { position:absolute;height:1px;background:#343840;transform-origin:left center; }
.net-line.l1{left:15%;top:32%;width:25%;transform:rotate(31deg)}.net-line.l2{left:35%;top:65%;width:31%;transform:rotate(-29deg)}.net-line.l3{left:62%;top:40%;width:24%;transform:rotate(26deg)}.net-line.l4{left:62%;top:40%;width:26%;transform:rotate(-10deg)}
.signal-ping { position:absolute;left:calc(61% - 13px);top:calc(38% - 13px);width:34px;height:34px;border:1px solid rgba(255,90,54,.32);border-radius:50%;animation:signalPing 2.4s ease-out infinite; }

.bar-canvas { padding: 18px 14px 16px; }
.bar-canvas > div { display:grid;grid-template-columns:84px 1fr;align-items:center;gap:11px;margin:11px 0;color:#757b84;font-size:7px; }
.bar-canvas i { position:relative;height:5px;border-radius:99px;background:#24282e;overflow:hidden; }
.bar-canvas i::after { content:'';position:absolute;inset:0 auto 0 0;width:var(--w);border-radius:inherit;background:linear-gradient(90deg,#4c525b,#ff5a36);opacity:.92; }

.mini-lane { min-height: 132px; padding: 0 13px; display:flex;align-items:center;justify-content:center;gap:7px;overflow:hidden; }
.mini-lane span { min-width:55px;padding:10px 7px;border:1px solid #30343b;border-radius:5px;color:#9ba0a8;text-align:center;font-size:7px; }
.mini-lane span.hot { border-color:#754033;color:#ffd4ca;background:#1d1412;box-shadow:0 0 0 4px rgba(255,90,54,.045); }
.mini-lane i { width:18px;height:1px;background:#3b4048;position:relative; }
.mini-lane i::after { content:'';position:absolute;right:0;top:-2px;width:4px;height:4px;border-right:1px solid #626872;border-top:1px solid #626872;transform:rotate(45deg); }

.matrix-canvas { position:relative;height:148px;padding:15px; }
.matrix-grid { position:absolute;inset:18px;background:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px);background-size:32px 32px;border-left:1px solid #343840;border-bottom:1px solid #343840; }
.matrix-dot { position:absolute;width:7px;height:7px;border-radius:50%;background:#747a83; }
.matrix-dot.d1{left:31%;top:65%}.matrix-dot.d2{left:51%;top:48%}.matrix-dot.d3{left:73%;top:29%}.matrix-dot.hot{background:var(--signal);box-shadow:0 0 0 6px rgba(255,90,54,.08)}
.matrix-label { position:absolute;right:12%;top:19%;padding:5px 6px;border:1px solid #5f352c;border-radius:4px;background:#1a1210;color:#d89584;font:700 6px/1 ui-monospace,monospace; }

.library-orbit { position:relative;height:154px;display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:18px;align-content:center; }
.library-orbit span { min-height:34px;display:grid;place-items:center;border:1px solid #30343b;border-radius:5px;color:#9aa0a8;font-size:7px;background:#14171b; }
.library-orbit span:nth-child(3){border-color:#734235;color:#f5b2a2;background:#1c1412}.library-orbit em{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--signal);left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 8px rgba(255,90,54,.06)}
.tool-preview { min-height:150px;display:grid;grid-template-columns:1fr 1px 1fr;align-items:center;padding:18px;gap:16px; }
.tool-preview > div { text-align:center; }.tool-preview > i{height:70px;background:#30343b}.tool-preview span,.tool-preview strong,.tool-preview small{display:block}.tool-preview span{color:#626872;font:700 6px/1 ui-monospace,monospace}.tool-preview strong{margin-top:10px;color:#fff;font-size:26px;letter-spacing:-.05em}.tool-preview small{margin-top:3px;color:#6f757e;font-size:7px}

/* Article rhythm */
.design-v2 .article-layout { grid-template-columns: 196px minmax(0,780px); gap: 86px; padding-top: 84px; padding-bottom: 120px; }
.design-v2 .toc { top: 104px; padding-left: 16px; border-left: 1px solid #e0e2e5; }
.design-v2 .toc::before { content:'SPARKSOPS / INDEX'; display:block; margin-bottom:18px; color:#b0b3b9; font:700 7px/1 ui-monospace,monospace; letter-spacing:.04em; }
.design-v2 .toc-label { display:none; }
.design-v2 .toc a { position:relative;padding:8px 0;color:#858990;font-size:10px;transition:color .18s ease, transform .18s ease; }
.design-v2 .toc a::before { content:'';position:absolute;left:-17px;top:50%;width:1px;height:0;background:var(--signal);transition:height .2s ease,top .2s ease; }
.design-v2 .toc a:hover,.design-v2 .toc a.is-active { color:#17191d;transform:translateX(3px); }
.design-v2 .toc a.is-active::before { height:20px;top:calc(50% - 10px); }

.design-v2 .article { counter-reset: section-counter; }
.design-v2 .article > .editorial-section { position:relative; counter-increment: section-counter; padding: 0 0 72px; margin: 0 0 72px; border-bottom: 1px solid #e7e8eb; }
.design-v2 .article > .editorial-section::before { content: attr(data-index); position:absolute; left:-58px; top:5px; color:#c1c4c9; font:700 8px/1 ui-monospace,monospace; }
.design-v2 .article h2 { max-width:680px;margin-bottom:24px;font-size:clamp(38px,3.45vw,50px);line-height:.98;letter-spacing:-.055em;font-weight:630; }
.design-v2 .article h3 { font-size:22px;margin-top:38px; }
.design-v2 .article p { color:#555960;font-size:15px;line-height:1.82; }
.design-v2 .article p.lead { color:#24272c;font-size:19px;line-height:1.64;letter-spacing:-.018em; }
.design-v2 .article ul,.design-v2 .article ol { color:#575b62;font-size:14px;line-height:1.8; }
.design-v2 .article li::marker { color:#a7abb1; }

/* Data modules */
.design-v2 .key-grid { border:0;border-radius:10px;gap:1px;background:#dfe1e4;box-shadow:0 1px 0 rgba(0,0,0,.03); }
.design-v2 .key-grid > div { min-height:148px;padding:21px;background:#f8f8f9;border:0; }
.design-v2 .key-grid strong { font-size:20px; }
.design-v2 .callout { position:relative;margin:34px 0;padding:24px 24px 24px 56px;border:1px solid #ffd1c6;border-radius:9px;background:#fff8f6; }
.design-v2 .callout::before { content:'↳';position:absolute;left:22px;top:23px;color:var(--signal);font:700 18px/1 ui-monospace,monospace; }
.design-v2 .callout strong { font-size:14px;letter-spacing:-.015em; }.design-v2 .callout p{color:#715f5a;font-size:12px;line-height:1.68}

.design-v2 .article-table { margin:30px 0;border:1px solid #dfe1e4;border-radius:10px;border-collapse:separate;border-spacing:0;overflow:hidden;background:#fff;box-shadow:0 12px 40px rgba(20,22,27,.035); }
.design-v2 .article-table th { padding:14px 16px;background:#0d0f12;color:#747a83;border-bottom-color:#202329;font-size:7px;letter-spacing:.05em; }
.design-v2 .article-table th:first-child{color:#aeb3ba}.design-v2 .article-table td{padding:16px;border-bottom:1px solid #eceef0;font-size:11px;line-height:1.55;background:#fff}.design-v2 .article-table tbody tr{transition:background .15s ease,transform .15s ease}.design-v2 .article-table tbody tr:hover td{background:#fafafa}.design-v2 .article-table td:first-child{width:30%;font-size:12px}.design-v2 .article-table td strong{font-weight:640}

.design-v2 .workflow-mini { margin:34px 0;border:1px solid #dfe1e4;border-radius:10px;box-shadow:0 12px 36px rgba(20,22,27,.04); }
.design-v2 .workflow-mini-head { min-height:40px;align-items:center;background:#0e1013;color:#666c75;border-bottom-color:#25282e;padding:0 14px; }
.design-v2 .workflow-mini-flow div { min-width:148px;padding:22px 15px;background:#fff; }
.design-v2 .workflow-mini-flow .ai-step { background:#fff7f4;box-shadow:inset 0 3px 0 var(--signal); }
.design-v2 .workflow-mini-flow strong { font-size:11px; }.design-v2 .workflow-mini-flow small{font-size:8px}

/* Hub pages become bento libraries rather than articles */
.design-v2.page-hub .article-layout { grid-template-columns: 1fr; max-width: none; gap:0; }
.design-v2.page-hub .toc { display:none; }
.design-v2.page-hub .article { max-width:none; }
.design-v2.page-hub .article > .editorial-section::before { display:none; }
.design-v2.page-hub .article > .editorial-section:first-child { padding-bottom:88px; }
.design-v2.page-hub .article > .editorial-section:first-child h2 { font-size:20px;letter-spacing:-.03em;margin-bottom:26px; }
.design-v2.page-hub .related-grid { display:grid;grid-template-columns:repeat(12,1fr);gap:12px; }
.design-v2.page-hub .related-card { position:relative;overflow:hidden;grid-column:span 4;min-height:230px;padding:24px;border:1px solid #e0e2e5;border-radius:10px;background:#f8f8f9;box-shadow:none; }
.design-v2.page-hub .related-card:first-child { grid-column:span 8;min-height:300px;background:#0e1013;color:#fff;border-color:#0e1013; }
.design-v2.page-hub .related-card:nth-child(2) { grid-column:span 4;min-height:300px; }
.design-v2.page-hub .related-card strong { max-width:290px;margin-top:54px;font-size:27px;line-height:1.02;letter-spacing:-.045em; }
.design-v2.page-hub .related-card:first-child strong { max-width:430px;font-size:42px; }
.design-v2.page-hub .related-card small { max-width:260px;margin-top:12px;font-size:10px;line-height:1.55;color:#7f848c; }
.design-v2.page-hub .related-card:first-child small { color:#838991; }
.design-v2.page-hub .related-card span { color:#9ba0a7; }
.design-v2.page-hub .related-card::before { content:attr(data-card-index);position:absolute;right:20px;top:18px;color:#c4c7cc;font:700 8px/1 ui-monospace,monospace; }
.design-v2.page-hub .related-card:first-child::after { content:'';position:absolute;width:250px;height:250px;right:-70px;bottom:-90px;border:1px solid #32363d;border-radius:50%;box-shadow:0 0 0 45px rgba(255,255,255,.018),0 0 0 90px rgba(255,255,255,.01); }
.design-v2.page-hub .related-card:hover { transform:translateY(-4px);border-color:#c9ccd1;box-shadow:0 16px 40px rgba(19,22,28,.07); }
.card-arrow { position:absolute;right:18px;bottom:18px;font-style:normal;color:#a1a5ac;font-size:15px;transition:transform .18s ease,color .18s ease; }.related-card:hover .card-arrow{transform:translate(2px,-2px);color:var(--signal)}
.design-v2.page-hub .article > .editorial-section:nth-child(2) { margin:0;padding:68px;border:1px solid #e2e4e7;border-radius:12px;background:#fbfbfc; }
.design-v2.page-hub .article > .editorial-section:nth-child(2) h2 { max-width:760px;font-size:54px; }

/* Related content cards on detail pages */
.design-v2.page-detail .related-grid { gap:10px; }
.design-v2.page-detail .related-card { position:relative;min-height:174px;padding:20px 18px 44px;border-radius:9px;background:#fafafa;overflow:hidden; }
.design-v2.page-detail .related-card::before { content:'';position:absolute;left:0;right:0;top:0;height:2px;background:#dedfe2;transition:background .18s ease; }
.design-v2.page-detail .related-card:hover::before { background:var(--signal); }
.design-v2.page-detail .related-card strong { margin-top:24px;font-size:17px;line-height:1.08; }
.design-v2.page-detail .related-card small { font-size:9px;line-height:1.5; }

/* CTA becomes a confident product band */
.design-v2 .content-cta { position:relative;overflow:hidden;padding:92px 0;background:#0d0f12;color:#fff;border-top:0; }
.design-v2 .content-cta::before { content:'';position:absolute;width:480px;height:480px;right:-140px;top:-250px;border:1px solid #262a31;border-radius:50%;box-shadow:0 0 0 70px rgba(255,255,255,.012),0 0 0 140px rgba(255,255,255,.007); }
.design-v2 .content-cta-grid { position:relative;z-index:1;grid-template-columns:1.2fr .6fr;gap:100px; }
.design-v2 .content-cta h2 { max-width:760px;font-size:clamp(54px,5.7vw,82px);letter-spacing:-.064em; }
.design-v2 .content-cta p { color:#8b919a;font-size:13px; }
.design-v2 .content-cta .section-kicker { color:#676d76; }
.design-v2 .content-cta .mini-cta { border-color:#353942;background:#181b20;color:#e2e5e9; }
.design-v2 .content-cta .mini-cta:hover { background:#22262c;border-color:#4c515a; }
.design-v2 .resource-footer { background:#0d0f12;color:#7d838c;border-top:1px solid #23262c; }
.design-v2 .resource-footer .footer { border-top:0; }

/* Premium tool pages */
.design-v2.page-tool .scanner-wrap { position:relative;padding:84px 0 112px;background:#f6f7f8;overflow:hidden; }
.design-v2.page-tool .scanner-wrap::before { content:'';position:absolute;inset:0;background:linear-gradient(rgba(15,17,20,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(15,17,20,.025) 1px,transparent 1px);background-size:52px 52px; }
.design-v2.page-tool .scanner-grid { position:relative;z-index:1;grid-template-columns:minmax(0,.78fr) minmax(450px,1.22fr);gap:30px; }
.design-v2 .premium-tool-intro { top:96px;padding:38px 34px;border:1px solid #22252b;border-radius:12px;background:#0d0f12;color:#fff;box-shadow:0 26px 70px rgba(18,20,25,.12); }
.design-v2 .premium-tool-intro .breadcrumbs { color:#5f646d; }.design-v2 .premium-tool-intro .breadcrumbs a:hover{color:#fff}.design-v2 .premium-tool-intro h1{color:#fff;font-size:clamp(50px,4.9vw,72px)}.design-v2 .premium-tool-intro > p{color:#9ca1a9;font-size:13px}.design-v2 .premium-tool-intro .callout{border-color:#343941;background:#15181d;padding-left:52px}.design-v2 .premium-tool-intro .callout strong{color:#dddfe3}.design-v2 .premium-tool-intro .callout p{color:#818790}
.tool-signal-strip { display:flex;align-items:center;gap:10px;margin-top:28px;padding-top:22px;border-top:1px solid #272b31;color:#686e77;font:700 7px/1 ui-monospace,monospace; }.tool-signal-strip i{height:1px;flex:1;background:#30343b}.tool-signal-strip span:nth-of-type(2){color:#d88c79}
.design-v2 .premium-tool-card { border-radius:12px;border-color:#d9dbdf;box-shadow:0 30px 80px rgba(18,20,25,.10); }
.design-v2 .scanner-card-head { min-height:48px;padding:0 18px;background:#fff;color:#8a8f96;border-bottom-color:#e5e7ea; }
.design-v2 .scanner-form { padding:28px 26px 30px; }.design-v2 .field{margin-bottom:22px}.design-v2 .field label{font-size:9px;color:#60646b;letter-spacing:.01em}.design-v2 .field input,.design-v2 .field select,.design-v2 .field textarea{min-height:48px;border-radius:7px;border-color:#dfe1e4;background:#fafafa;font-size:12px;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.design-v2 .field input:focus,.design-v2 .field select:focus,.design-v2 .field textarea:focus{background:#fff;border-color:#8d929a;box-shadow:0 0 0 3px rgba(12,14,17,.045)}
.design-v2 .scanner-submit { height:50px;border-radius:7px;background:#0c0e11;transition:transform .15s ease,box-shadow .15s ease,background .15s ease }.design-v2 .scanner-submit:hover{background:#1a1d22;transform:translateY(-1px);box-shadow:0 8px 20px rgba(10,12,15,.12)}
.design-v2 .scanner-result { padding:28px 26px 30px; }.design-v2 .result-score{border-color:#ffb9a8;background:#fff5f2}.design-v2 .result-metrics{border-radius:9px;background:#fafafa}.design-v2 .result-metrics div{padding:18px 15px}.design-v2 .result-plan{padding:18px;border-radius:9px;background:#f7f7f8}

@keyframes signalPing { 0% { transform:scale(.55); opacity:.8 } 75%,100% { transform:scale(1.55); opacity:0 } }

@media (max-width: 980px) {
  .design-v2 .content-hero-grid { grid-template-columns:1fr;gap:44px; }
  .design-v2 .answer-card { max-width:720px; }
  .design-v2 .article-layout { grid-template-columns:1fr;gap:32px; }
  .design-v2 .toc { position:relative;top:auto;display:flex;gap:8px;overflow-x:auto;padding:0 0 18px;border-left:0;border-bottom:1px solid #e3e5e8; }
  .design-v2 .toc::before{display:none}.design-v2 .toc a{flex:none;padding:7px 10px;border:1px solid #e0e2e5;border-radius:999px;background:#fff}.design-v2 .toc a::before{display:none}.design-v2 .article > .editorial-section::before{display:none}
  .design-v2.page-hub .related-card,.design-v2.page-hub .related-card:first-child,.design-v2.page-hub .related-card:nth-child(2){grid-column:span 6;min-height:240px}.design-v2.page-hub .related-card:first-child strong{font-size:34px}
  .design-v2.page-tool .scanner-grid{grid-template-columns:1fr}.design-v2 .premium-tool-intro{position:relative;top:auto}
}

@media (max-width: 680px) {
  .design-v2 .content-shell { width:min(100% - 30px,var(--content-max)); }
  .design-v2 .reading-progress { top:58px; }
  .design-v2 .premium-hero { padding:66px 0 52px;background-size:34px 34px; }
  .design-v2 .premium-hero::before{width:290px;height:290px;right:-100px;top:-170px;box-shadow:0 0 0 44px rgba(255,90,54,.02)}
  .design-v2 .content-hero-grid{margin-top:34px;gap:32px}.design-v2 .content-hero h1{font-size:clamp(50px,14vw,68px)}.design-v2 .content-hero .dek{font-size:16px}.design-v2 .hero-meta-chips{margin-top:20px}
  .design-v2 .answer-card{padding:20px;border-radius:10px}.signal-viz-foot{grid-template-columns:1fr 1fr}.signal-viz-foot>div:nth-child(3){grid-column:1/-1;border-top:1px solid #292d34}.network-canvas,.matrix-canvas{height:132px}
  .design-v2 .article-layout{padding-top:56px;padding-bottom:82px}.design-v2 .article > .editorial-section{padding-bottom:52px;margin-bottom:52px}.design-v2 .article h2{font-size:38px}.design-v2 .article p.lead{font-size:17px}.design-v2 .key-grid{grid-template-columns:1fr}.design-v2 .key-grid>div{border-bottom:1px solid #e1e3e6}.design-v2 .key-grid>div:last-child{border-bottom:0}
  .design-v2 .article-table{display:block;overflow-x:auto;white-space:normal}.design-v2 .article-table th,.design-v2 .article-table td{min-width:150px}
  .design-v2.page-hub .related-grid{grid-template-columns:1fr}.design-v2.page-hub .related-card,.design-v2.page-hub .related-card:first-child,.design-v2.page-hub .related-card:nth-child(2){grid-column:auto;min-height:220px}.design-v2.page-hub .related-card:first-child{min-height:270px}.design-v2.page-hub .related-card:first-child strong{font-size:32px}.design-v2.page-hub .article > .editorial-section:nth-child(2){padding:30px}.design-v2.page-hub .article > .editorial-section:nth-child(2) h2{font-size:40px}
  .design-v2 .content-cta{padding:72px 0}.design-v2 .content-cta-grid{grid-template-columns:1fr;gap:34px}.design-v2 .content-cta h2{font-size:54px}
  .design-v2.page-tool .scanner-wrap{padding:54px 0 82px}.design-v2 .premium-tool-intro{padding:28px 24px}.design-v2 .premium-tool-intro h1{font-size:50px}.design-v2 .scanner-form,.design-v2 .scanner-result{padding:22px 18px 24px}.tool-signal-strip{flex-wrap:wrap}.tool-signal-strip i{min-width:18px}
}

@media (prefers-reduced-motion: reduce) {
  .signal-ping { animation:none; }
}
