/* HostSoch — linux-dedicated-server.php and windows-dedicated-server.php (loaded after site.css).
   Sections, stat strip, intro/spec card, tiles, add-ons, steps, tables and FAQ come from site.css. */

.page-linux-ded   { --hero-mobile-ratio: 800 / 520; }
.page-windows-ded { --hero-mobile-ratio: 800 / 547; }

/* Banner */
.hero--dos::before {
  background:
    radial-gradient(circle at 15% 40%, rgba(250, 175, 50, .10) 0%, transparent 40%),
    linear-gradient(90deg, rgba(10, 13, 17, .94) 0%, rgba(10, 13, 17, .84) 30%, rgba(10, 13, 17, .45) 46%, rgba(10, 13, 17, .08) 58%, rgba(10, 13, 17, 0) 64%);
}
.page-linux-ded .hero__media img { object-position: 78% center; }
.page-windows-ded .hero__media img { object-position: 80% center; }
.hero--dos .hero__copy { max-width: 540px; }
.hero--dos h1 { font-size: clamp(2.1rem, 4.2vw, 3.4rem); line-height: 1.1; letter-spacing: -.02em; }
.hero--dos .hero__lead { font-size: clamp(17px, 1.5vw, 19px); }
.hero--dos .hero__cta { margin-top: 30px; }
@media (max-width: 1100px) {
  .hero--dos::before { background: linear-gradient(90deg, rgba(10, 13, 17, .96) 0%, rgba(10, 13, 17, .9) 45%, rgba(10, 13, 17, .55) 62%, rgba(10, 13, 17, 0) 78%); }
  .hero--dos .hero__copy { max-width: 470px; }
}
@media (max-width: 760px) { .hero--dos .hero__media img { object-position: center !important; } }
.page-linux-ded .stats__label, .page-windows-ded .stats__label { font-size: 14px; }

/* "approx." under On request prices */
.price__approx { display: block; margin-top: 2px; font-size: 12px; font-weight: 700; color: #7f8a96; }

/* Checklist (what "fully managed" covers) */
.checks { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px 28px; }
.checks li { position: relative; padding: 16px 18px 16px 54px; background: var(--d-card); border: 1px solid var(--d-line); border-radius: var(--radius); color: var(--d-muted); font-weight: 600; font-size: 15px; }
.checks li strong { display: block; color: var(--d-text); font-size: 16px; margin-bottom: 2px; }
.checks li::before { content: ""; position: absolute; left: 18px; top: 18px; width: 22px; height: 22px; border-radius: 50%; background: rgba(150, 200, 49, .16) center / 12px 12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='m2 6.5 2.5 2.5L10 3' fill='none' stroke='%23b9e26a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); box-shadow: 0 0 14px rgba(150, 200, 49, .35); }
@media (max-width: 760px) { .checks { grid-template-columns: 1fr; } }

/* Vertical timeline (hardware replacement / migration) */
.timeline { list-style: none; margin: 0 auto; padding: 0; max-width: 820px; position: relative; }
.timeline::before { content: ""; position: absolute; left: 21px; top: 8px; bottom: 8px; width: 2px; background: linear-gradient(180deg, var(--orange), var(--green)); opacity: .5; }
.timeline li { position: relative; padding: 0 0 26px 70px; }
.timeline li:last-child { padding-bottom: 0; }
.timeline__num { position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; font-weight: 900; color: #12161a; background: var(--orange); box-shadow: 0 0 0 5px #171c22, 0 0 22px rgba(250, 175, 50, .45); }
.timeline li:nth-child(even) .timeline__num { background: var(--green); box-shadow: 0 0 0 5px #171c22, 0 0 22px rgba(150, 200, 49, .45); }
.timeline h3 { font-size: 18px; margin: 9px 0 4px; }
.timeline p { margin: 0; color: var(--d-muted); font-weight: 600; font-size: 15px; }

/* Two things side by side (tables / cards) */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: start; }
.split h3 { font-size: 19px; margin-bottom: 14px; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }

/* Small callout under tables */
.note { margin: 20px 0 0; color: var(--d-muted); font-weight: 600; font-size: 15px; }
.note strong { color: var(--d-text); }