/* ========================================
   THREAT INTELLIGENCE — PRODUCT PAGE
   ======================================== */

/* ---- Hero ---- */

/* Hero diagram — absolute background (log stream) */

/* the log's lines come in at the foot of the drawing and go out at its head */

/* Hero category strip — equal spacing between header above and footer below */

/* Hero footer — CTAs pushed to bottom */

/* ========================================
   REPUTATION SCORING
   ======================================== */
.ti-scoring {
  padding: var(--space-5xl) 0;
  position: relative;
  z-index: 1;
}

.ti-scoring-header {
  max-width: 640px;
  margin-bottom: var(--space-3xl);
}

.ti-scoring-header .eyebrow-bordered {
  margin-bottom: var(--space-lg);
}

.ti-scoring-header h2 {
  font-size: var(--text-3xl);
  font-weight: 600;
  letter-spacing: -0.03em;
  margin-bottom: var(--space-md);
}

.ti-scoring-header p {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  line-height: 1.6;
  color: var(--text-secondary);
  max-width: 600px;
}

/* Score bar visualization */
.ti-score-visual {
  margin-bottom: var(--space-3xl);
}

.ti-score-bar-wrap {
  position: relative;
  max-width: 800px;
}

.ti-score-scale {
  display: flex;
  justify-content: space-between;
  margin-bottom: var(--space-xs);
}

.ti-score-label {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  color: var(--text-muted);
  letter-spacing: 0.03em;
}

.ti-score-bar {
  display: flex;
  height: 32px;
  border: 1px solid var(--border);
}

.ti-score-zone {
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 1px solid var(--border);
}

.ti-score-zone:last-child {
  border-right: none;
}

.ti-score-zone span {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  color: var(--text-muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ti-score-clean {
  background: color-mix(in srgb, var(--text-primary) 2%, transparent);
}

.ti-score-low {
  background: color-mix(in srgb, var(--text-primary) 4%, transparent);
}

.ti-score-medium {
  background: color-mix(in srgb, var(--text-primary) 6%, transparent);
}

.ti-score-high {
  background: color-mix(in srgb, var(--text-primary) 10%, transparent);
}

.ti-score-marker {
  position: absolute;
  top: -8px;
  transform: translateX(-50%);
}

.ti-score-marker-line {
  width: 1px;
  height: 56px;
  background: var(--text-primary);
  opacity: 0.6;
}

.ti-score-marker-label {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-top: var(--space-xs);
  text-align: center;
}

/* 9 categories grid */
.ti-categories-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  border: 1px solid var(--border);
}

.ti-category {
  padding: var(--space-xl);
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.ti-category:nth-child(3n) {
  border-right: none;
}

.ti-category:nth-child(n+7) {
  border-bottom: none;
}

.ti-category-num {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  color: var(--text-muted);
  letter-spacing: 0.05em;
  display: block;
  margin-bottom: var(--space-sm);
}

.ti-category h4 {
  font-family: var(--font-sans);
  font-size: 1.2rem;
  letter-spacing: -0.015em;
  line-height: 1.2;
  font-weight: 600;
  color: var(--text-primary);
  letter-spacing: -0.01em;
  margin-bottom: var(--space-sm);
}

.ti-category p {
  font-family: var(--font-sans);
  font-size: 0.92rem;
  line-height: 1.6;
  color: var(--text-secondary);
}

/* ========================================
   SIGNAL SOURCES — 6 deep dives
   ======================================== */
.ti-signals {
  padding: var(--space-5xl) 0;
  position: relative;
  z-index: 1;
}

.ti-signals-header {
  max-width: 640px;
  margin-bottom: var(--space-3xl);
}

.ti-signals-header .eyebrow-bordered {
  margin-bottom: var(--space-lg);
}

.ti-signals-header h2 {
  font-size: var(--text-3xl);
  font-weight: 600;
  letter-spacing: -0.03em;
  margin-bottom: var(--space-md);
}

.ti-signals-header p {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  line-height: 1.65;
  color: var(--text-secondary);
  max-width: 540px;
}

/* Signal tabs — navigation */
.source-tabs {
  display: flex;
  gap: 1px;
  border: 1px solid var(--border);
  margin-bottom: 0;
}

.source-tab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding: var(--space-lg) var(--space-md);
  background: transparent;
  border: none;
  border-right: 1px solid var(--border);
  cursor: pointer;
  transition: background var(--duration-fast) var(--ease-out);
  font-family: var(--font-mono);
}

.source-tab:last-child {
  border-right: none;
}

.source-tab:hover {
  background: color-mix(in srgb, var(--text-primary) 4%, transparent);
}

.source-tab--active {
  background: color-mix(in srgb, var(--text-primary) 6%, transparent);
}

.source-tab-num {
  font-size: 0.6rem;
  color: var(--text-muted);
  letter-spacing: 0.08em;
}

.source-tab-name {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-primary);
  letter-spacing: 0.02em;
}

/* Signal items — one at a time carousel */
.ti-signal-items {
  border: 1px solid var(--border);
  border-top: none;
  position: relative;
}

.ti-signal-item {
  display: none;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);   /* the drawing takes three fifths of the row (2026-10-09: bigger and clearer) */
  gap: var(--space-3xl);
  align-items: start;
  padding: var(--space-4xl);
}

.ti-signal-item--active {
  display: grid;
}

.ti-signal-item:nth-child(even) { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }   /* the drawing keeps its share when it leads the row */

.ti-signal-item:nth-child(even) .ti-signal-text {
  order: 2;
}

.ti-signal-item:nth-child(even) .ti-signal-diagram {
  order: 1;
}

.ti-signal-num {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.65rem;
  color: var(--text-muted);
  letter-spacing: 0.08em;
  margin-bottom: var(--space-md);
}

.ti-signal-text h3 {
  font-size: var(--text-xl);
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-bottom: var(--space-md);
}

.ti-signal-text p {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  line-height: 1.7;
  color: var(--text-secondary);
  margin-bottom: var(--space-md);
}

.ti-signal-meta {
  display: flex;
  gap: var(--space-lg);
  margin-top: var(--space-lg);
  padding-top: var(--space-md);
  border-top: 1px solid var(--border);
}

.ti-signal-meta span {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  color: var(--text-muted);
  letter-spacing: 0.03em;
}

.ti-signal-diagram svg {
  width: 100%;
  height: auto;
  color: var(--text-primary);
}
/* the drawings' hairlines and tones lifted and their labels enlarged (4 to 8 units, 6 to 8px on the page, now 6.5 to 10) on a halo of the page colour (2026-10-09) */
.ti-signal-diagram svg [opacity="0.12"] { opacity: 0.3; }
.ti-signal-diagram svg [opacity="0.15"] { opacity: 0.35; }
.ti-signal-diagram svg [opacity="0.2"] { opacity: 0.5; }
.ti-signal-diagram svg [opacity="0.25"] { opacity: 0.55; }
.ti-signal-diagram svg [opacity="0.3"] { opacity: 0.6; }
.ti-signal-diagram svg [opacity="0.35"] { opacity: 0.65; }
.ti-signal-diagram svg [opacity="0.4"] { opacity: 0.7; }
.ti-signal-diagram svg [opacity="0.45"] { opacity: 0.75; }
.ti-signal-diagram svg [opacity="0.5"] { opacity: 0.8; }
.ti-signal-diagram svg [opacity="0.6"] { opacity: 0.9; }
.ti-signal-diagram svg [opacity="0.7"] { opacity: 0.95; }
.ti-signal-diagram svg [stroke-width="0.5"] { stroke-width: 1; }
.ti-signal-diagram svg [stroke-width="0.6"] { stroke-width: 1.1; }
.ti-signal-diagram svg [stroke-width="0.8"] { stroke-width: 1.4; }
.ti-signal-diagram svg [stroke-width="1"] { stroke-width: 1.6; }
.ti-signal-diagram svg [stroke-width="1.2"] { stroke-width: 1.8; }
.ti-signal-diagram svg text { font-size: 7.5px; opacity: 1; paint-order: stroke; stroke: var(--bg-primary); stroke-width: 2.5px; stroke-linejoin: round; }
.ti-signal-diagram svg g[font-size="4"] text, .ti-signal-diagram svg text[font-size="4"] { font-size: 6.5px; }
.ti-signal-diagram svg g[font-size="4.5"] text, .ti-signal-diagram svg text[font-size="4.5"] { font-size: 7px; }
.ti-signal-diagram svg g[font-size="5"] text, .ti-signal-diagram svg text[font-size="5"] { font-size: 7.5px; }
.ti-signal-diagram svg g[font-size="5.5"] text, .ti-signal-diagram svg text[font-size="5.5"] { font-size: 8px; }
.ti-signal-diagram svg g[font-size="6"] text, .ti-signal-diagram svg text[font-size="6"] { font-size: 8.5px; }
.ti-signal-diagram svg g[font-size="8"] text, .ti-signal-diagram svg text[font-size="8"] { font-size: 10px; }
.ti-signal-diagram svg text[opacity="0.2"], .ti-signal-diagram svg text[opacity="0.25"], .ti-signal-diagram svg text[opacity="0.3"] { opacity: 0.75; }
.ti-signal-diagram svg text[opacity="0.35"], .ti-signal-diagram svg text[opacity="0.4"], .ti-signal-diagram svg text[opacity="0.45"] { opacity: 0.85; }
@media (max-width: 899px) { .ti-signal-item, .ti-signal-item:nth-child(even) { grid-template-columns: minmax(0, 1fr); } }

/* ========================================
   API RESPONSE — VSCode editor style
   ======================================== */
.ti-api {
  padding: var(--space-5xl) 0;
  position: relative;
  z-index: 1;
}

.ti-api-header {
  max-width: 640px;
  margin-bottom: var(--space-3xl);
}

.ti-api-header .eyebrow-bordered {
  margin-bottom: var(--space-lg);
}

.ti-api-header h2 {
  font-size: var(--text-3xl);
  font-weight: 600;
  letter-spacing: -0.03em;
  margin-bottom: var(--space-md);
}

.ti-api-header p {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  line-height: 1.65;
  color: var(--text-secondary);
}

/* Editor component */
.editor-wrap {
  max-width: 860px;
  margin: 0 auto var(--space-2xl);
}

.editor {
  border: 1px solid var(--border);
  overflow: hidden;
}

.editor-tabs {
  display: flex;
  height: 34px;
  background: color-mix(in srgb, var(--bg-secondary) 60%, transparent);
  border-bottom: 1px solid var(--border);
  align-items: stretch;
}

.editor-tab {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  color: var(--text-muted);
  padding: 0 1rem;
  display: flex;
  align-items: center;
  border-right: 1px solid var(--border);
  cursor: default;
}

.editor-tab--active {
  background: var(--bg-primary);
  color: var(--text-primary);
  margin-bottom: -1px;
  border-bottom: 1px solid var(--bg-primary);
}

.editor-breadcrumb {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  color: var(--text-muted);
  padding: 0.35rem 1rem;
  border-bottom: 1px solid var(--border);
  opacity: 0.6;
}

.editor-body {
  display: flex;
}

.editor-gutter {
  flex-shrink: 0;
  padding: 0.75rem 0;
  border-right: 1px solid var(--border);
  user-select: none;
  min-width: 36px;
}

.editor-gutter-line {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  line-height: 1.75;
  text-align: right;
  padding-right: 0.75rem;
  color: var(--text-muted);
  opacity: 0.4;
}

.editor-code {
  flex: 1;
  padding: 0.75rem 1rem;
  overflow-x: auto;
}

.editor-code pre {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  line-height: 1.75;
  color: var(--text-primary);
  margin: 0;
  white-space: pre;
}

.editor-code .ek { color: var(--text-muted); }
.editor-code .es { color: var(--text-secondary); }
.editor-code .en { color: var(--text-primary); font-weight: 600; }
.editor-code .eb { color: var(--text-primary); font-weight: 600; }
.editor-code .ep { color: var(--text-muted); opacity: 0.5; }

.editor-status {
  display: flex;
  gap: var(--space-lg);
  border-top: 1px solid var(--border);
  padding: 0.3rem 1rem;
  font-family: var(--font-mono);
  font-size: 0.55rem;
  color: var(--text-muted);
  opacity: 0.5;
}

/* Field annotations */
.editor-fields {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  border: 1px solid var(--border);
  max-width: 860px;
  margin: 0 auto;
}

.editor-field {
  padding: var(--space-lg);
  border-right: 1px solid var(--border);
}

.editor-field:nth-child(3n) {
  border-right: none;
}

.editor-field-line {
  display: block;
  font-family: var(--font-mono);
  font-size: 0.55rem;
  color: var(--text-muted);
  letter-spacing: 0.04em;
  margin-bottom: var(--space-xs);
}

.editor-field h5 {
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-primary);
  margin-bottom: var(--space-xs);
}

.editor-field p {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  line-height: 1.6;
  color: var(--text-secondary);
}

/* ========================================
   USE CASES
   ======================================== */
.ti-usecases {
  padding: var(--space-5xl) 0;
  position: relative;
  z-index: 1;
}

.ti-usecases .eyebrow-bordered {
  margin-bottom: var(--space-lg);
}

.ti-usecases h2 {
  font-size: var(--text-3xl);
  font-weight: 600;
  letter-spacing: -0.03em;
  margin-bottom: var(--space-3xl);
  max-width: 640px;
}

.ti-usecase-rows {
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--border);
}

.ti-usecase-row {
  display: grid;
  grid-template-columns: 48px 180px 1fr;
  gap: var(--space-xl);
  align-items: baseline;
  padding: var(--space-lg) 0;
  border-bottom: 1px solid var(--border);
}

.ti-usecase-num {
  font-family: var(--font-mono);
  font-size: 0.65rem;
  color: var(--text-muted);
  letter-spacing: 0.05em;
}

.ti-usecase-row h4 {
  font-family: var(--font-mono);
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--text-primary);
  letter-spacing: -0.01em;
}

.ti-usecase-row p {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  line-height: 1.6;
  color: var(--text-secondary);
}

/* ---- Blocklist Querying ---- */
.ti-blocklists {
  padding: var(--space-5xl) 0;
}

.ti-blocklists-header {
  text-align: center;
  margin-bottom: var(--space-4xl);
}

.ti-blocklists-header h2 {
  margin-top: var(--space-lg);
  font-size: clamp(1.8rem, 3.5vw, 3rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.ti-blocklists-header p {
  margin-top: var(--space-md);
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  font-size: var(--text-lg);
  line-height: 1.6;
  color: var(--text-secondary);
}

.ti-blocklist-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  border: 1px solid var(--border);
  margin-bottom: var(--space-3xl);
}

.ti-blocklist-category {
  padding: var(--space-xl);
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.ti-blocklist-category:nth-child(2n) {
  border-right: none;
}

.ti-blocklist-category:nth-last-child(-n+2) {
  border-bottom: none;
}

.ti-blocklist-category-header {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  margin-bottom: var(--space-sm);
}

.ti-blocklist-category-num {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  color: var(--text-muted);
  letter-spacing: 0.05em;
}

.ti-blocklist-category h4 {
  font-family: var(--font-mono);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.ti-blocklist-category p {
  font-size: 0.75rem;
  line-height: 1.6;
  color: var(--text-secondary);
  margin-bottom: var(--space-lg);
  font-family: var(--font-mono);
}

.ti-blocklist-feeds {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.ti-blocklist-feed {
  font-family: var(--font-mono);
  font-size: 0.6rem;
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--border);
  color: var(--text-secondary);
  letter-spacing: 0.02em;
}

/* Blocklist example */
.ti-blocklist-example {
  border: 1px solid var(--border);
}

.ti-blocklist-example-header {
  padding: var(--space-sm) var(--space-lg);
  border-bottom: 1px solid var(--border);
  background: color-mix(in srgb, var(--text-primary) 4%, transparent);
  font-family: var(--font-mono);
  font-size: 0.65rem;
  color: var(--text-muted);
  letter-spacing: 0.04em;
}

.ti-blocklist-example-body {
  padding: var(--space-lg);
  overflow-x: auto;
}

.ti-blocklist-example-body pre {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  line-height: 1.75;
  color: var(--text-primary);
  white-space: pre;
}

/* ========================================
   RESPONSIVE
   ======================================== */
@media (max-width: 1023px) {
  .ti-signal-item {
    grid-template-columns: 1fr;
  }
  .ti-signal-item:nth-child(even) .ti-signal-text,
  .ti-signal-item:nth-child(even) .ti-signal-diagram {
    order: unset;
  }
  .ti-categories-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .ti-category:nth-child(3n) {
    border-right: 1px solid var(--border);
  }
  .ti-category:nth-child(2n) {
    border-right: none;
  }
  .ti-category:nth-child(n+7) {
    border-bottom: 1px solid var(--border);
  }
  .ti-category:nth-child(n+9) {
    border-bottom: none;
  }
  .editor-fields {
    grid-template-columns: repeat(2, 1fr);
  }
  .ti-usecase-row {
    grid-template-columns: 48px 1fr;
  }
  .ti-usecase-row p {
    grid-column: 2;
  }
}

@media (max-width: 767px) {
  .ti-blocklist-grid {
    grid-template-columns: 1fr;
  }
  .ti-blocklist-category {
    border-right: none !important;
    border-bottom: 1px solid var(--border) !important;
  }
  .ti-blocklist-category:last-child {
    border-bottom: none !important;
  }
  .ti-categories-grid {
    grid-template-columns: 1fr;
  }
  .ti-category {
    border-right: none !important;
    border-bottom: 1px solid var(--border) !important;
  }
  .ti-category:last-child {
    border-bottom: none !important;
  }
  .editor-fields {
    grid-template-columns: 1fr;
  }
  .editor-field {
    border-right: none !important;
    border-bottom: 1px solid var(--border);
  }
  .editor-field:last-child {
    border-bottom: none;
  }
  .ti-usecase-row {
    grid-template-columns: 1fr;
    gap: var(--space-sm);
  }
  .ti-usecase-num {
    display: none;
  }
  
  .ti-signal-meta {
    flex-wrap: wrap;
  }
}

/* ---- The hero card's strip: not a map but a panel (decided 2026-10-08 over the map and ten other takes) — nine
   blocklist feeds as chips with their logos, the two that list the address in red, the counts and the score above,
   the datacenter flag with its network under. On white, in the page's ink; the hits' colour is a red. The markup
   comes from scripts/product-hero.py. ---- */
.geo-card { --strip-ink: var(--text-primary); --strip-paper: var(--bg-secondary); --strip-dim: var(--text-muted); --strip-flag: #e5484d; }
:root:is([data-theme="dark"]) .geo-card { --strip-paper: rgba(255, 255, 255, .12); --strip-flag: #ff6b6b; }
:root[data-card="8"] .geo-card-wrap { --map-h: 190px; }   /* the strip's height: the head line, three rows of chips, the network line */
:root[data-card="8"] .geo-card-wrap .geo-card-map--panel { background: #fff; }
:root:is([data-theme="dark"])[data-card="8"] .geo-card-wrap .geo-card-map--panel { background: var(--bg-secondary); }
.geo-strip { position: absolute; inset: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; row-gap: 10px; padding: 12px 24px; font-family: var(--font-mono); color: var(--strip-ink); }
.gs-ledger-head { display: flex; justify-content: space-between; font-size: .6rem; color: var(--strip-dim); letter-spacing: .02em; }
.gs-ledger-head b { color: var(--strip-ink); font-weight: 600; }
.gs-feeds { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; gap: 6px 8px; min-height: 0; margin: 0 -12px; }   /* three across, the rows stretched to fill the strip and the chips out to 12px from its edge, the logos in a column */
.gs-feeds span { display: flex; align-items: center; justify-content: flex-start; gap: .45rem; min-width: 0; padding: 0 .6rem; border-radius: 5px; background: var(--strip-paper); font-size: .64rem; letter-spacing: .01em; color: var(--strip-ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-feeds span.is-on { background: var(--strip-flag); color: #fff; font-weight: 600; }
.gs-feed-logo { width: 18px; height: 18px; border-radius: 4px; flex: none; }   /* the feed's mark, from logo.dev; gone if it has none */
.gs-netline { display: flex; align-items: center; gap: .5rem; font-size: .56rem; letter-spacing: .02em; color: var(--strip-dim); white-space: nowrap; }
.gs-netline i { width: 7px; height: 7px; border-radius: 50%; background: var(--strip-flag); flex: none; }
.gs-netline b { color: var(--strip-ink); font-weight: 600; }
.gs-netnote { margin-left: auto; }
.gs-tags { display: inline-flex; gap: .4rem; margin-left: .7rem; margin-right: auto; }   /* the tags by the address, as a group */
.gs-type { display: inline-block; padding: .2rem .5rem; border-radius: 6px; background: var(--strip-paper); font-family: var(--font-mono); font-size: .58rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--strip-ink); vertical-align: middle; }   /* the kind of space, by the address */
/* the card's groups: keys longer than the geolocation card's (scores.threat_score); scores is the group open on arrival */
#geo-card .geo-all-row { grid-template-columns: 7.4rem minmax(0, 1fr); }
/* ---- PROTOTYPE (?head=tag|swap|none): where the datacenter chip sits — by the address, in place of GET · 200 OK, or nowhere ---- */
/* five cells in the strip under the headline, wider than the geolocation page's: tighter cells so all five fit the column without scrolling (the shared rule grows the padding with the viewport) */
:root:not([data-json="0"]) .geo-hero-top .geo-hero-input { padding-left: 1.1rem; padding-right: 1.1rem; }

/* ========================================
   DATACENTER COVERAGE (2026-10-08): the networks is_datacenter covers — four figures, the ten largest as a table
   ======================================== */
.ti-datacenters { padding: var(--space-5xl) 0; }
.ti-datacenters-header { text-align: center; margin-bottom: var(--space-3xl); }
.ti-datacenters-header h2 { margin-top: var(--space-lg); font-size: clamp(1.8rem, 3.5vw, 3rem); font-weight: 700; letter-spacing: -0.02em; }
.ti-datacenters-header p { margin: var(--space-md) auto 0; max-width: 640px; font-size: var(--text-lg); line-height: 1.6; color: var(--text-secondary); }
.ti-dc-stats { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); margin-bottom: var(--space-2xl); }
.ti-dc-stat { padding: var(--space-lg) var(--space-xl); border-right: 1px solid var(--border); }
.ti-dc-stat:last-child { border-right: 0; }
.ti-dc-stat b { display: block; font-family: var(--font-mono); font-size: 1.6rem; font-weight: 600; letter-spacing: -0.02em; line-height: 1.1; }
.ti-dc-stat span { display: block; margin-top: 0.35rem; font-family: var(--font-mono); font-size: 0.66rem; line-height: 1.5; color: var(--text-muted); }
.ti-dc-table-wrap { border-top: 1px solid var(--border); }
.ti-dc-table { width: 100%; border-collapse: collapse; font-family: var(--font-mono); }
.ti-dc-table th { padding: 0.7rem 0.75rem; text-align: left; font-size: 0.6rem; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); border-bottom: 1px solid var(--border); }
.ti-dc-table td { padding: 0.8rem 0.75rem; border-bottom: 1px solid var(--border); font-size: 0.8rem; vertical-align: middle; }
.ti-dc-table th:first-child, .ti-dc-table td:first-child { padding-left: 0; width: 2.4rem; }
.ti-dc-table th:last-child, .ti-dc-table td:last-child { padding-right: 0; }
.ti-dc-n { font-size: 0.62rem; color: var(--text-muted); letter-spacing: 0.05em; }
.ti-dc-name { font-weight: 600; }
.ti-dc-who { display: inline-flex; align-items: center; gap: 0.6rem; white-space: nowrap; }   /* the mark and the name on one line, whatever the column's width */
.ti-dc-logo { width: 18px; height: 18px; border-radius: 4px; flex: none; }
.ti-dc-type { font-size: 0.7rem; color: var(--text-secondary); white-space: nowrap; }
.ti-dc-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ti-dc-table th.ti-dc-num { text-align: right; }
.ti-dc-share { width: 26%; }
.ti-dc-bar { display: inline-block; height: 6px; max-width: calc(100% - 3.4rem); background: var(--text-primary); vertical-align: middle; }
.ti-dc-pct { display: inline-block; margin-left: 0.6rem; font-size: 0.68rem; color: var(--text-muted); vertical-align: middle; }
.ti-dc-more { display: flex; gap: var(--space-2xl); margin: 0; padding: 0.9rem 0 0; font-family: var(--font-mono); font-size: 0.72rem; color: var(--text-muted); }   /* what lies beyond the ten: Udger's other datacenters, rezmoss's other ranges */
.ti-dc-more b { color: var(--text-primary); font-weight: 600; }
.ti-dc-more a { margin-left: auto; color: var(--accent); text-decoration: none; }
.ti-dc-more a:hover { text-decoration: underline; }
@media (max-width: 1023px) {
  .ti-dc-stats { grid-template-columns: repeat(2, 1fr); }
  .ti-dc-stat:nth-child(2) { border-right: 0; }
  .ti-dc-stat:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
}
@media (max-width: 767px) {
  .ti-dc-table-wrap { overflow-x: auto; }
  .ti-dc-table { min-width: 640px; }
}

/* the blocklists page's sources since 2026-10-12: ten maintainers from the feed inventory as hairline rows, a logo, the feed names and what they list
   (the tabbed signal types above stay on the threat page) */
.bl-feed-table { border-top: 1px solid var(--border); }
.bl-feed-row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr) minmax(0, 7fr); gap: var(--space-lg); align-items: center; padding: 1rem var(--space-lg); border-bottom: 1px solid var(--border); color: inherit; text-decoration: none; }
a.bl-feed-row:hover .bl-feed-who b { color: var(--accent); }
.bl-feed-head { padding: 0.6rem var(--space-lg); font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); }
.bl-feed-who { display: grid; grid-template-columns: 28px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 0.9rem; align-items: center; }
.bl-feed-logo { grid-row: 1 / 3; width: 28px; height: 28px; border-radius: 6px; object-fit: contain; }
.bl-feed-who b { font-weight: 600; letter-spacing: -0.01em; transition: color var(--duration-fast); }
.bl-feed-who small { font-family: var(--font-mono); font-size: 0.68rem; color: var(--text-muted); }
.bl-feed-list, .bl-feed-kind { font-size: 0.9rem; line-height: 1.5; color: var(--text-secondary); }
.bl-feed-list b { display: inline-block; min-width: 1.5rem; font-family: var(--font-mono); font-weight: 500; color: var(--text-primary); }
@media (max-width: 767px) { .bl-feed-row { grid-template-columns: minmax(0, 1fr); gap: 0.35rem; } .bl-feed-head { display: none; } .bl-feed-list, .bl-feed-kind { padding-left: calc(28px + 0.9rem); } }
.bl-feed-more { margin: 0; padding: 0.9rem var(--space-lg) 0; font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.06em; color: var(--text-muted); }   /* the rest of the inventory, counted under the ten */

/* the blocklists page's categories since 2026-10-12: the same grid in the site's own type — a mono number above an Inter title, Inter text, chips as the industries cards set them (the threat page keeps the mono version) */
.bl-cats .ti-blocklist-category { padding: var(--space-2xl); }
.bl-cats .ti-blocklist-category-header { display: block; margin-bottom: var(--space-md); }
.bl-cats .ti-blocklist-category-num { display: block; margin-bottom: 0.6rem; font-size: 0.72rem; letter-spacing: 0.08em; color: var(--text-muted); }
.bl-cats .ti-blocklist-category h4 { font-family: var(--font-sans); font-size: 1.35rem; font-weight: 600; letter-spacing: -0.015em; line-height: 1.2; color: var(--text-primary); }
.bl-cats .ti-blocklist-category p { font-family: var(--font-sans); max-width: 48ch; font-size: 0.95rem; line-height: 1.6; color: var(--text-secondary); margin-bottom: var(--space-lg); }
.bl-cats .ti-blocklist-feeds { gap: 0.4rem; }
.bl-cats .ti-blocklist-feed { font-size: 0.75rem; padding: 0.25rem 0.55rem; letter-spacing: 0; }

/* the blocklists page's sources intro in the same type as the querying intro below it (asked 2026-10-15) */
.bl-feeds .ti-signals-header p {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  line-height: 1.6;
  max-width: 600px;
}

.bl-feeds .ti-signals-header { text-align: center; }
.bl-feeds .ti-signals-header p { margin-left: auto; margin-right: auto; }
.bl-feeds .ti-signals-header { margin-left: auto; margin-right: auto; }

/* ---- Phones (2026-10-15): the feeds in two columns, the head and the network line wrapping, the panel taller for the rows ---- */
@media (max-width: 767px) {
  .gs-feeds { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: minmax(26px, 1fr); }
  .gs-ledger-head { flex-wrap: wrap; row-gap: 2px; }
  .gs-netline { white-space: normal; flex-wrap: wrap; row-gap: 2px; }
  .gs-netnote { margin-left: 0; flex-basis: 100%; }
  :root[data-card="8"] .geo-card-wrap { --map-h: 272px; }
  .source-tabs { overflow-x: auto; scrollbar-width: none; }
}