/* Article-specific figures and table. Page layout is supplied by site/styles.css. */
.hosting-comparison { min-width: 0; }
.hosting-comparison > h3 { margin: 38px 0 18px; }
.hosting-comparison h3[id] { scroll-margin-top: 110px; }
.hosting-comparison .inline-link { overflow-wrap: anywhere; }
.hosting-comparison .figure-label { margin-bottom: 22px; color: var(--signal-soft); font: 10px/1.8 "SFMono-Regular", Consolas, monospace; letter-spacing: .08em; }
.hosting-comparison .choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.hosting-comparison .choice { padding: 20px 12px; border: 1px solid rgba(255,128,112,.34); background: var(--surface); box-shadow: 4px 4px 0 rgba(217,26,1,.12); text-align: center; }
.hosting-comparison .number { display: grid; width: 28px; height: 28px; place-items: center; margin: 0 auto 18px; border-radius: 50%; background: rgba(217,26,1,.18); color: var(--signal-soft); font: 12px/1 monospace; }
.hosting-comparison .choice h3 { margin: 0 0 12px; font-size: 14px; line-height: 1.7; }
.hosting-comparison .choice p { margin: 0; font-size: 11px; line-height: 1.9; }
.hosting-comparison .choice .choice-note { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.hosting-comparison .choice strong { display: block; font-size: 12px; line-height: 1.8; }
.hosting-comparison .arrow { margin: 12px 0; color: var(--signal-soft); }
.hosting-comparison .cost-row { display: flex; align-items: stretch; gap: 12px; }
.hosting-comparison .cost-build, .hosting-comparison .cost-run { flex: 1; padding: 20px; border: 1px solid rgba(255,128,112,.34); background: var(--surface); }
.hosting-comparison .cost-run { flex: 1.6; }
.hosting-comparison .cost-row small { display: block; margin-bottom: 12px; color: var(--signal-soft); font-size: 11px; }
.hosting-comparison .cost-row strong { display: block; font-size: 15px; line-height: 1.7; }
.hosting-comparison .cost-row span { display: block; margin-top: 10px; font-size: 12px; line-height: 1.8; }
.hosting-comparison .cost-divider { display: flex; align-items: center; color: var(--signal-soft); }
.hosting-comparison .luggage { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.hosting-comparison .luggage > div { padding: 20px; border: 1px solid rgba(255,128,112,.34); border-top: 2px solid var(--signal); background: var(--surface); }
.hosting-comparison .luggage strong { display: block; font-size: 15px; }
.hosting-comparison .luggage span { display: block; margin-top: 10px; font-size: 12px; line-height: 1.8; }
.hosting-comparison .table-scroll { overflow-x: auto; max-width: 100%; margin: 35px 0; border: 1px solid rgba(255,128,112,.25); }
.hosting-comparison table { width: 100%; min-width: 700px; border-collapse: collapse; background: #121113; font-size: 13px; line-height: 1.85; }
.hosting-comparison th, .hosting-comparison td { padding: 17px 15px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.hosting-comparison th { background: var(--surface); color: var(--signal-soft); font-size: 12px; font-weight: 600; }
.hosting-comparison th:first-child { width: 19%; }
.hosting-comparison th:nth-child(2) { width: 32%; }
.hosting-comparison .comparison-table table { min-width: 720px; }
.hosting-comparison .comparison-table th:first-child { width: 15%; }
.hosting-comparison .comparison-table th:nth-child(2) { width: 25%; }
.hosting-comparison .comparison-table th:nth-child(3), .hosting-comparison .comparison-table th:nth-child(4) { width: 30%; }
.hosting-comparison .table-scroll:focus-visible { outline: 1px solid var(--signal-soft); outline-offset: 4px; }
.hosting-comparison tbody tr:last-child td { border-bottom: 0; }
.hosting-comparison .source-note { margin: 35px 0 28px; padding: 16px 18px; border-left: 2px solid var(--signal); background: rgba(217,26,1,.07); font-size: 12px; line-height: 1.9; }
.hosting-comparison .references { padding-left: 24px; font-size: 12px; line-height: 1.9; }
.hosting-comparison .references li { margin-bottom: 12px; scroll-margin-top: 110px; }
@media (max-width: 520px) {
  .hosting-comparison .choice-grid, .hosting-comparison .luggage { grid-template-columns: 1fr; }
  .hosting-comparison .choice { padding: 18px; text-align: left; }
  .hosting-comparison .number { margin-left: 0; margin-bottom: 12px; }
  .hosting-comparison .cost-row { flex-direction: column; gap: 8px; }
  .hosting-comparison .cost-divider { justify-content: center; }
  .hosting-comparison .cost-build, .hosting-comparison .cost-run, .hosting-comparison .luggage > div { padding: 16px; }
}

.hosting-language-links { display:flex; flex-wrap:wrap; gap:16px; margin-top:20px; font-size:12px; }
.hosting-language-links a { color:var(--signal-soft); text-decoration:underline; text-underline-offset:4px; }
@media (max-width:600px) { .hosting-article-page .site-header .header-nav { display:none; } }
