:root{--font-anthropic-sans:Inter,system-ui,sans-serif;--font-anthropic-serif:Inter,system-ui,sans-serif;--color-fg:#ededed;--color-fg-muted:#a3a3a3;--color-fg-secondary:#d4d4d4;--color-bg:#0e0e0f;--color-panel:#1a1a1b;--color-border-line:#2e2e30;--color-ok:#2FFF00;--color-bad:#ff6b5b;--cds-gap-xs:4px;--cds-gap-sm:8px;--cds-gap-md:16px;--cds-gap-lg:24px;--cds-gap-xl:32px;--cds-pad-xs:6px;--cds-pad-sm:12px;--cds-pad-lg:20px;--cds-radius:12px;--cds-font-size-title:30px;--cds-font-size-heading:20px;--cds-font-size-body:16px;--cds-font-size-caption:13px;--cds-font-weight-medium:600;--cds-chart-axis:#555;--cds-chart-grid:#2a2a2a;--cds-chart-muted:#666;--cds-chart-reference:#f5a623;--cds-surface-popover:#222;--cds-border:#3a3a3c;--cds-shadow-popover:0 8px 24px rgba(0,0,0,.4);--cds-text-secondary:#a3a3a3;--cds-border-strong:#777;--cds-dur-slow:300ms;--color-accent:#0091FF}
html{-webkit-text-size-adjust:100%}
body{background:var(--color-bg);color:var(--color-fg);margin:0;padding:24px 16px 48px;font-family:var(--font-anthropic-sans)}
body>.wrap{max-width:1200px;margin:0 auto}
*{box-sizing:border-box}

.sg { font-family: var(--font-anthropic-sans); color: var(--color-fg); display: flex; flex-direction: column; gap: var(--cds-gap-xl); max-width: 1200px; margin: 0 auto; }
.sg h1 { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: var(--cds-font-size-title); margin: 0; }
.sg h2 { font-size: var(--cds-font-size-heading); font-weight: var(--cds-font-weight-medium); margin: 0 0 var(--cds-gap-sm); }
.sg h3 { font-size: var(--cds-font-size-body); font-weight: var(--cds-font-weight-medium); margin: 0; }
.sg p { margin: 0; line-height: 1.5; }
.sg .muted { color: var(--color-fg-muted); font-size: var(--cds-font-size-caption); }
.sg-ratios { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: var(--cds-gap-md); margin-top: var(--cds-gap-lg); padding-top: var(--cds-gap-md); border-top: 1px solid var(--color-border-line); }
.sg-ratio .n { font-family: var(--font-anthropic-serif); font-size: var(--cds-font-size-heading); font-variant-numeric: tabular-nums; }
.sg-ratio .t { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-take { font-size: var(--cds-font-size-body); color: var(--color-fg-muted); max-width: 60rem; margin-top: var(--cds-gap-xs); }
.sg-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); gap: var(--cds-gap-md); }
.sg-tile, .sg-card { background: var(--color-panel); border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); padding: var(--cds-pad-lg); }
.sg-tile .lbl { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-tile .big { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: var(--cds-font-size-title); font-variant-numeric: tabular-nums; margin: var(--cds-gap-xs) 0; min-height: 1.2em; }
.sg-tile .sub { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: var(--cds-gap-md); }
.sg-card .note { font-size: calc(var(--cds-font-size-caption) + 1px); color: var(--color-fg-muted); margin: var(--cds-gap-xs) 0 var(--cds-gap-md); }
.sg-chart { position: relative; min-height: 240px; }
.sg-tip { position: absolute; pointer-events: none; background: var(--cds-surface-popover); border: 1px solid var(--cds-border); border-radius: var(--cds-radius); box-shadow: var(--cds-shadow-popover); padding: var(--cds-pad-xs) var(--cds-pad-sm); font-size: var(--cds-font-size-caption); opacity: 0; white-space: nowrap; z-index: 2; }
.sg-tip .d { color: var(--cds-text-secondary); }
.sg-tip .sw { display: inline-block; width: 8px; height: 8px; border-radius: 2px; margin-right: 6px; }
.sg-legend { display: flex; flex-wrap: wrap; gap: var(--cds-gap-md); font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); margin-top: var(--cds-gap-sm); }
.sg-legend span::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 6px; vertical-align: -1px; background: var(--sw); }
.sg-tablebox { max-height: 26rem; overflow: auto; }
.sg table { width: 100%; border-collapse: collapse; font-size: var(--cds-font-size-caption); font-variant-numeric: tabular-nums; }
.sg th { text-align: left; font-weight: var(--cds-font-weight-medium); color: var(--color-fg-muted); padding: var(--cds-pad-xs) var(--cds-pad-sm); border-bottom: 1px solid var(--color-border-line); position: sticky; top: 0; background: var(--color-panel); }
.sg th button { all: unset; cursor: pointer; }
.sg td { padding: var(--cds-pad-xs) var(--cds-pad-sm); border-bottom: 1px solid var(--color-border-line); vertical-align: top; }
.sg td.num, .sg th.num { text-align: right; }
.sg-search { width: 100%; box-sizing: border-box; padding: var(--cds-pad-xs) var(--cds-pad-sm); border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); background: var(--color-bg); color: var(--color-fg); font: inherit; font-size: var(--cds-font-size-caption); margin-bottom: var(--cds-gap-sm); }
.sg b.v { font-weight: var(--cds-font-weight-medium); font-variant-numeric: tabular-nums; }
.sg .ok { color: var(--color-ok); }
[data-dash-source-state=empty] { color: transparent; }
[data-dash-source-state=refreshing] { opacity: .5; transition: opacity var(--cds-dur-slow); }
.sg-fail { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 120px; color: var(--color-fg-muted); font-size: var(--cds-font-size-caption); }
.sg-fail::before { content: ""; width: .375rem; height: .375rem; border-radius: 50%; background: var(--color-bad); }
.sg-plan { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr)); gap: var(--cds-gap-md); margin-top: var(--cds-gap-sm); }
.sg-plan p { font-size: var(--cds-font-size-body); line-height: 1.5; color: var(--color-fg-secondary, var(--color-fg)); opacity: .88; margin-top: var(--cds-gap-xs); }
.sg-flow { display: flex; align-items: stretch; gap: var(--cds-gap-sm); margin-top: var(--cds-gap-md); }
.sg-step { border-left: 3px solid var(--sw, var(--color-border-line)); padding: var(--cds-pad-xs) var(--cds-pad-sm); }
.sg-step .n { font-family: var(--font-anthropic-serif); font-size: var(--cds-font-size-title); font-variant-numeric: tabular-nums; min-height: 1.2em; }
.sg-step .t { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-arrow { flex: 0 0 9.5rem; align-self: center; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); text-align: center; }
.sg-arrow::after { content: "→"; display: block; font-size: var(--cds-font-size-heading); line-height: 1.2; }
.sg-arrow span { color: var(--color-fg); font-weight: var(--cds-font-weight-medium); }
.sg-lead { font-size: var(--cds-font-size-body); max-width: 60rem; margin: var(--cds-gap-xs) 0 0; }
.sg-offer .price { font-family: var(--font-anthropic-serif); font-size: var(--cds-font-size-title); font-variant-numeric: tabular-nums; margin-top: var(--cds-gap-xs); }
.sg-offer ul { margin: var(--cds-gap-md) 0 0; padding-left: 1.1em; font-size: var(--cds-font-size-body); line-height: 1.6; }
.sg-pick { border-color: var(--color-accent, var(--cds-border-strong)); box-shadow: 0 0 0 1px var(--color-accent, var(--cds-border-strong)) inset; }
.sg-row { display: flex; justify-content: space-between; align-items: center; gap: var(--cds-gap-sm); }
.sg-row h2 { margin: 0; }
.sg-btn { font: inherit; font-size: var(--cds-font-size-caption); color: var(--color-fg); background: var(--color-bg); border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); padding: var(--cds-pad-xs) var(--cds-pad-sm); cursor: pointer; }
.sg-flow .sg-step { flex: 1 1 0; min-width: 0; }
.sg-plan + .note { margin-top: var(--cds-gap-lg); margin-bottom: 0; font-size: var(--cds-font-size-body); color: var(--color-fg); font-weight: 500; padding-left: .8em; border-left: 3px solid var(--color-accent); }
.sg-offer ul li + li { margin-top: var(--cds-gap-xs); }
@media (max-width: 640px) {
  .sg { gap: var(--cds-gap-lg); }
  .sg h1 { font-size: 1.6rem; line-height: 1.2; }
  .sg-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cds-gap-sm); }
  .sg-tile { padding: var(--cds-pad-sm) var(--cds-pad-sm); }
  .sg-tile .big { font-size: 1.5rem; }
  .sg-card { padding: var(--cds-pad-sm) calc(var(--cds-pad-sm) + 4px); }
  .sg-flow { flex-direction: column; gap: var(--cds-gap-xs); }
  .sg-flow .sg-step { flex: none; }
  .sg-arrow { flex: none; align-self: flex-start; text-align: left; padding-left: calc(var(--cds-pad-sm) + 3px); display: flex; align-items: center; gap: 6px; }
  .sg-arrow::before { content: "↓"; font-size: var(--cds-font-size-body); color: var(--color-fg-muted); }
  .sg-arrow::after { content: none; }
  .sg-ratios { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cds-gap-sm); }
  .sg-ratio .n { font-size: 1.25rem; }
  .sg-offer .price { font-size: 1.5rem; }
  .sg-row .sg-btn { flex: none; }
}
.sg-vs { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: var(--cds-gap-md); align-items: stretch; }
.sg-offer { display: flex; flex-direction: column; }
.sg-offer .tag { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-offer .tag-pick { align-self: flex-start; color: var(--color-bg); background: var(--color-accent, #4f86e0); border-radius: 999px; padding: 2px 10px; font-weight: var(--cds-font-weight-medium); }
.sg-offer h3 { margin-top: var(--cds-gap-sm); }
.sg-offer .price small { font-family: var(--font-anthropic-sans); font-size: var(--cds-font-size-body); color: var(--color-fg-muted); }
.sg-offer .save { font-size: var(--cds-font-size-caption); color: var(--color-ok, #5cb85c); font-weight: var(--cds-font-weight-medium); margin-top: 2px; }
.sg-list { list-style: none; padding: 0; margin: var(--cds-gap-md) 0 0; display: flex; flex-direction: column; gap: var(--cds-gap-sm); font-size: var(--cds-font-size-body); line-height: 1.4; flex: 1; }
.sg-list li { position: relative; padding-left: 1.5em; }
.sg-list li::before { content: "–"; position: absolute; left: 0; color: var(--color-fg-muted); }
.sg-checks li::before { content: "✓"; color: var(--color-accent, #4f86e0); font-weight: 700; }
.sg-offer .foot { margin-top: var(--cds-gap-md); padding-top: var(--cds-gap-sm); border-top: 1px solid var(--color-border-line); font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-offer .foot b { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: var(--cds-font-size-heading); color: var(--color-fg); margin-right: 4px; }
.sg-theirs { background: transparent; }
.sg-theirs .price { color: var(--color-fg-muted); }
.sg-theirs .sg-list { color: var(--color-fg-muted); }
.sg-pick { border-width: 2px; border-color: var(--color-accent, #4f86e0); box-shadow: none; }
.sg-pick .price { font-size: calc(var(--cds-font-size-title) * 1.15); }
@media (max-width: 640px) {
  .sg-vs { grid-template-columns: 1fr; }
  .sg-pick { order: -1; }
  .sg-list { font-size: 15px; }
}
.sg-why { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); margin: var(--cds-gap-md) 0 0; }
.sg-proj { display: flex; flex-direction: column; gap: var(--cds-gap-sm); margin-top: var(--cds-gap-md); }
.sg-proj .row { display: grid; grid-template-columns: 13rem minmax(0, 1fr) 15rem; gap: var(--cds-gap-md); align-items: center; padding: var(--cds-pad-sm) var(--cds-pad-lg); border: 1px solid var(--color-border-line); border-radius: var(--cds-radius); }
.sg-proj .row-pick { border: 2px solid var(--color-accent, #4f86e0); }
.sg-proj .when { font-weight: var(--cds-font-weight-medium); }
.sg-proj .when span { font-weight: 400; font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-proj .nums { display: grid; grid-template-columns: minmax(0, 9.5rem) auto minmax(0, 1fr); align-items: center; gap: var(--cds-gap-md); }
.sg-proj .nums > div:not(.op) { display: flex; flex-direction: column; }
.sg-proj .nums b { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: var(--cds-font-size-title); font-variant-numeric: tabular-nums; line-height: 1.1; }
.sg-proj .nums span { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-proj .op { font-size: var(--cds-font-size-heading); color: var(--color-fg-muted); }
.sg-proj .rate { font-size: var(--cds-font-size-body); }
.sg-proj .rate b { font-weight: var(--cds-font-weight-medium); }
@media (max-width: 860px) {
  .sg-proj .row { grid-template-columns: 1fr; gap: var(--cds-gap-sm); padding: var(--cds-pad-sm); }
  .sg-proj .nums b { font-size: 1.6rem; }
}
.sg-proj .row { grid-template-columns: 13rem minmax(0, 1fr); }
.sg-proj .nums3 { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1.2fr); }
.sg-proj .rates { border-style: dashed; }
.sg-proj .rates .rate { font-size: var(--cds-font-size-body); }
@media (max-width: 860px) { .sg-proj .row { grid-template-columns: 1fr; } .sg-proj .nums3 { gap: var(--cds-gap-xs); } .sg-proj .nums3 .op { font-size: var(--cds-font-size-body); } .sg-proj .nums3 b { font-size: 1.35rem; } }
.sg-math { margin-top: var(--cds-gap-md); padding-top: var(--cds-gap-md); border-top: 1px solid var(--color-border-line); }
.sg-math ol { margin: var(--cds-gap-sm) 0; padding-left: 1.3em; display: flex; flex-direction: column; gap: 4px; font-size: var(--cds-font-size-body); line-height: 1.45; }
.sg-math b { color: var(--color-fg); font-weight: 600; font-variant-numeric: tabular-nums; }
.sg-math p { font-size: var(--cds-font-size-body); margin: 0; }
.sg .hl, .sg b.v, .sg-proj .rate b, .sg-math b.pop, .sg-arrow span { color: var(--color-accent, #4f86e0); font-weight: var(--cds-font-weight-medium); }
.sg-plan p .hl { font-weight: var(--cds-font-weight-medium); }
.sg-proj .when b.hl { font-weight: var(--cds-font-weight-medium); }
.sg-checks b { font-weight: var(--cds-font-weight-medium); color: var(--color-fg); }
.sg h1 { font-size: clamp(1.7rem, 4.2vw, 2.6rem); line-height: 1.12; letter-spacing: -0.01em; }
.sg-hero { position: relative; border: 2px solid var(--color-accent, #4f86e0); border-radius: calc(var(--cds-radius) * 1.5); padding: var(--cds-pad-lg) calc(var(--cds-pad-lg) + 4px); background: var(--color-panel); display: flex; flex-direction: column; gap: var(--cds-gap-md); }
.hero-num { display: flex; align-items: baseline; gap: var(--cds-gap-sm); flex-wrap: wrap; }
.hero-num b { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: clamp(3.4rem, 9vw, 5.5rem); line-height: 1; color: var(--color-accent, #4f86e0); font-variant-numeric: tabular-nums; }
.hero-num span { font-size: clamp(1.1rem, 2.6vw, 1.5rem); font-weight: var(--cds-font-weight-medium); }
.hero-line { color: var(--color-fg-muted); font-size: var(--cds-font-size-body); max-width: 40rem; margin: var(--cds-gap-xs) 0 0; }
.hero-line b { color: var(--color-fg); font-weight: var(--cds-font-weight-medium); }
.hero-meter { min-height: 88px; }
.hero-foot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cds-gap-md); padding-top: var(--cds-gap-md); border-top: 1px solid var(--color-border-line); }
.hero-foot > div { display: flex; flex-direction: column; gap: 2px; }
.hero-foot b { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: var(--cds-font-size-title); font-variant-numeric: tabular-nums; }
.hero-foot span { font-size: var(--cds-font-size-caption); color: var(--color-fg-muted); }
.sg-tile .big.hl { color: var(--color-accent, #4f86e0); }
.sg-big2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--cds-gap-md); margin: var(--cds-gap-sm) 0 var(--cds-gap-md); }
.sg-big2 > div { display: flex; flex-direction: column; gap: 2px; }
.sg-big2 b { font-family: var(--font-anthropic-serif); font-weight: 400 !important; font-size: clamp(2.4rem, 6vw, 3.2rem); line-height: 1; }
.sg-big2 span { font-size: var(--cds-font-size-body); color: var(--color-fg-muted); }
.sg-proj .row-pick .nums b { color: var(--color-accent, #4f86e0); }
.sg-plan > div { border-top: 3px solid var(--color-accent, #4f86e0); padding-top: var(--cds-gap-sm); }
@media (max-width: 640px) {
  .sg-hero { padding: var(--cds-pad-sm) calc(var(--cds-pad-sm) + 4px); }
  .hero-foot { grid-template-columns: 1fr 1fr; }
  .hero-foot > div:last-child { display: none; }
  .hero-foot b { font-size: 1.4rem; }
}
.sg-divider { padding-top: var(--cds-gap-lg); border-top: 1px solid var(--color-border-line); }
.sg-divider h2 { margin: 0; }
.sg-divider p { color: var(--color-fg-muted); font-size: var(--cds-font-size-caption); margin-top: 2px; }
/* Existantly brand: Inter, brand blue #0091FF */
.sg { --font-anthropic-sans: 'Inter', system-ui, sans-serif; --font-anthropic-serif: 'Inter', system-ui, sans-serif; --color-accent: #0091FF; --ex-blue: #0091FF; --ex-green: #2FFF00; font-family: 'Inter', system-ui, sans-serif; font-feature-settings: "tnum" 1, "cv11" 1; }
.sg h1 { font-weight: 800; letter-spacing: -0.025em; line-height: 1.08; margin: 0 0 var(--cds-gap-md); }
.sg h2 { font-weight: 700; letter-spacing: -0.015em; }
.sg h3 { font-weight: 600; }
.sg-lead { line-height: 1.55; }
#top .sg-lead { font-size: clamp(1rem, 2.2vw, 1.15rem); color: var(--color-fg-muted); max-width: 46rem; margin: 0; }
.hero-num b, .sg-tile .big, .sg-proj .nums b, .sg-offer .price, .hero-foot b, .sg-big2 b, .sg-step .n, .sg-ratio .n, .sg-offer .foot b { font-weight: 700 !important; letter-spacing: -0.03em; }
.hero-num b { letter-spacing: -0.045em; }
.sg-offer .save { color: var(--ex-green); }
.sg-why3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--cds-gap-md); margin-top: var(--cds-gap-lg); }
.sg-why3 > div { border-top: 3px solid var(--ex-blue); padding-top: var(--cds-gap-sm); }
.sg-why3 p { font-size: var(--cds-font-size-body); color: var(--color-fg-muted); margin-top: var(--cds-gap-xs); line-height: 1.5; }
@media (max-width: 640px) { .sg-why3 { grid-template-columns: 1fr; gap: var(--cds-gap-sm); } }
.sg-plus { margin-top: var(--cds-gap-sm); display: block; padding: .45em .7em; border-radius: 8px; border-left: 3px solid #7CC4FF; background: rgba(124,196,255,.12); color: #7CC4FF; font-size: var(--cds-font-size-body); font-weight: 500; line-height: 1.35; }
.sg-plus b { display: block; font-size: 1.5em; font-weight: 700; color: #7CC4FF; line-height: 1.2; }
.sg-ladder { margin-top: var(--cds-gap-sm); counter-reset: st; }
.sg-ladder .step { counter-increment: st; position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 2px 16px; padding: 12px 0 12px 42px; border-bottom: 1px solid var(--color-border-line); }
.sg-ladder .step:last-child { border-bottom: 0; }
.sg-ladder .step::before { content: counter(st); position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%; background: rgba(0,145,255,.16); color: var(--ex-blue); font-weight: 700; font-size: 14px; display: grid; place-items: center; }
.sg-ladder .how { color: var(--color-fg-muted); font-size: var(--cds-font-size-body); line-height: 1.4; }
.sg-ladder .val { color: var(--color-fg); font-size: var(--cds-font-size-body); text-align: right; white-space: nowrap; }
.sg-ladder .val b { font-size: 1.4em; font-weight: 700; color: var(--color-fg); margin-right: .2em; }
.sg-ladder .step.last .val b { color: var(--ex-blue); }
.sg-planbox { margin-top: var(--cds-gap-md); border: 1.5px solid var(--ex-blue); border-radius: var(--cds-radius); padding: 16px 18px; background: rgba(0,145,255,.06); }
.sg-planbox .t { font-weight: 600; font-size: var(--cds-font-size-body); margin-bottom: 12px; }
.sg-planbox .cells { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.sg-planbox .cells b { display: block; font-size: 32px; line-height: 1.1; font-weight: 700; color: var(--ex-blue); }
.sg-planbox .cells > div > span { display: block; color: var(--color-fg-muted); font-size: var(--cds-font-size-caption); margin-top: 4px; }
.sg-planbox p { margin: 14px 0 0; color: var(--color-fg-muted); font-size: var(--cds-font-size-caption); line-height: 1.5; }
@media (max-width: 640px) { .sg-ladder .step { grid-template-columns: 1fr; } .sg-ladder .val { text-align: left; } .sg-planbox .cells b { font-size: 24px; } .sg-planbox { padding: 14px; } }
.sg-next { border: 2px solid var(--ex-blue); border-radius: calc(var(--cds-radius) * 1.5); padding: var(--cds-pad-lg) calc(var(--cds-pad-lg) + 4px); background: var(--color-panel); }
.sg-next h2 { margin: 0 0 var(--cds-gap-md); }
.sg-steps { list-style: none; counter-reset: s; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--cds-gap-md); }
.sg-steps li { counter-increment: s; position: relative; padding-top: 2.6rem; font-size: var(--cds-font-size-body); color: var(--color-fg-muted); line-height: 1.5; }
.sg-steps li::before { content: counter(s); position: absolute; top: 0; left: 0; width: 2rem; height: 2rem; border-radius: 50%; background: var(--ex-blue); color: #fff; font-weight: 700; display: grid; place-items: center; }
.sg-steps b { color: var(--color-fg); font-weight: 600; }
@media (max-width: 860px) { .sg-steps { grid-template-columns: 1fr; gap: var(--cds-gap-sm); } .sg-steps li { padding: 0 0 0 2.8rem; min-height: 2rem; } .sg-next { padding: var(--cds-pad-sm) calc(var(--cds-pad-sm) + 4px); } }