/* Readable, linked content before the interactive home takes over. */
.pub-ssr .ssr-map {
  display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: 16px;
  min-width: 0; margin: 0; padding: clamp(16px, 2.2vw, 30px); color: #f3f7ff;
  border: 1px solid #324c71; border-radius: 18px;
  background: radial-gradient(ellipse at 50% 45%, #213d63, transparent 70%), #0e1c31;
}
.ssr-map figcaption { font-weight: 650; font-size: 15px; }
.ssr-map .hero-process { padding-top: 0; }
.ssr-map .hero-process i { font: 600 12px/1 var(--mono); }
.ssr-architecture summary,.ssr-preview-link { align-content: center; min-height: 44px; color: #b8d9ff; }
.ssr-architecture summary { cursor: pointer; }
.ssr-preview-link { display: inline-block; }
.ssr-map-caption { color: #d1e2ef; font-size: 13px; line-height: 1.65; margin: 0; }
.ssr-mobile-menu { display: none; position: relative; }
.ssr-mobile-menu summary { cursor: pointer; padding: 10px 5px; font-weight: 600; }
.ssr-mobile-menu nav { position: absolute; z-index: 3; top: 100%; right: 0; white-space: nowrap; padding: 8px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); }
.ssr-mobile-menu nav a { display: flex; align-items: center; min-height: 44px; padding-inline: 14px; }
.ssr-map-canvas {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(82px, .78fr) minmax(0, 1fr);
  grid-template-rows: 1fr 1fr; align-items: center; gap: clamp(8px, 1.4vw, 20px);
  position: relative; min-height: clamp(190px, 17vw, 275px);
}
.ssr-map-canvas::before {
  position: absolute; inset: 15% 18%; content: "";
  background: linear-gradient(25deg, transparent 49.7%, #637d9e 50%, transparent 50.4%),
              linear-gradient(-25deg, transparent 49.7%, #637d9e 50%, transparent 50.4%);
}
.ssr-map-canvas > a { position: relative; min-width: 0; text-align: center; }
.ssr-map-canvas .ssr-node {
  display: grid; align-content: center; gap: 3px; min-height: 50px; padding: 8px 4px;
  border: 1px solid #415b7c; border-radius: 9px; background: #142a45;
}
.ssr-node-geo { grid-area: 1 / 1; }
.ssr-node-aao { grid-area: 1 / 3; }
.ssr-node-crm { grid-area: 2 / 1; }
.ssr-node-risk { grid-area: 2 / 3; }
.ssr-node strong, .ssr-core strong { font-size: clamp(12px, 1.05vw, 15px); }
.ssr-map-canvas small { color: #bbcadb; font-size: 11px; }
.ssr-core { grid-area: 1 / 2 / 3 / 3; display: grid; justify-items: center; gap: 4px; padding: 12px 2px; background: #132943; border-radius: 12px; }
.ssr-cycle { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px;
  padding: 11px 12px; border-top: 1px solid #3a536f; color: #b2ddd9; font-size: 13px; }
.ssr-cycle span { color: #d6e3f1; }
.ssr-sections { padding-block: 12px 48px; }
.ssr-sections > section { padding: clamp(26px, 5vw, 64px) 0; border-bottom: 1px solid var(--line); scroll-margin-top: 18px; }
.ssr-sections h2 { font-size: clamp(24px, 3vw, 39px); line-height: 1.24; letter-spacing: -.04em; margin: 0 0 16px; }
.ssr-sections h3 { font-size: clamp(17px, 1.5vw, 21px); margin: 0 0 7px; line-height: 1.4; }
.ssr-sections p { max-width: 76ch; margin: 10px 0; color: var(--muted); line-height: 1.75; }
.ssr-sections small { color: var(--accent); line-height: 1.65; }
.ssr-sections a { color: var(--accent); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.ssr-card-list, .ssr-steps { display: grid; gap: 12px; }
.ssr-card-list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 205px), 1fr)); }
.ssr-card, .ssr-note { padding: clamp(17px, 2vw, 25px); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.ssr-note { margin-block: 15px; background: var(--surface-2); }
.ssr-card p { margin-bottom: 0; font-size: 14px; }
.ssr-steps { grid-template-columns: repeat(auto-fit, minmax(min(100%, 154px), 1fr)); padding: 0; list-style: none; margin: 18px 0; }
.ssr-steps li { padding: 12px 12px 10px; border-top: 2px solid var(--accent); color: var(--text); }
.ssr-steps span { display: block; margin-top: 7px; color: var(--muted); font-size: 14px; line-height: 1.65; }
.ssr-sections summary { cursor: pointer; font-weight: 600; padding-block: 11px; }
.ssr-compact li { font-weight: 600; }
.ssr-sections .ssr-cycle-kicker { color: var(--accent); font-size: 14px; font-weight: 650; }
.ssr-loop-cards {
  display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 22px;
  padding: 0; margin: 22px 0 8px; list-style: none;
}
.ssr-loop-cards li { position: relative; min-width: 0; }
.ssr-loop-cards li:not(:last-child)::after {
  content: ""; position: absolute; width: 7px; height: 7px; top: calc(50% - 4px); right: -14px;
  border: solid var(--accent); border-width: 1.5px 1.5px 0 0; transform: rotate(45deg);
}
.ssr-loop-cards h3 { margin-top: 6px; }
.ssr-loop-return { display: flex; flex-wrap: wrap; align-items: center; gap: 0 12px; }
.ssr-loop-return a, .ssr-loop-details summary { min-height: 44px; align-content: center; }
.ssr-loop-details { border-bottom: 1px solid var(--line); }
.ssr-loop-details > p { margin-top: 0; }
@media(max-width:900px) {
  .public-header:has(.ssr-mobile-menu) .public-nav { display: none; }
  .ssr-mobile-menu { display: block; }
}
@media(max-width:800px) {
  .ssr-loop-cards { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .ssr-loop-cards li:not(:last-child)::after { top: auto; bottom: -11px; left: 22px; right: auto; transform: rotate(135deg); }
}
@media(max-width:650px) {
  .ssr-map-canvas { grid-template-columns: minmax(0, 1fr) 80px minmax(0, 1fr); min-height: 148px; }
  .ssr-sections a { display: inline-block; padding-block: 6px; }
  .ssr-steps { grid-template-columns: minmax(0, 1fr); gap: 5px; }
  .ssr-steps li { padding: 4px 10px; border-top: 0; border-left: 2px solid var(--accent); }
}