/* Pricing: make the work behind each price visible. */
.pricing-guarantee-note { display: block !important; text-align: center; font-style: normal !important; color: #15803d !important; font-weight: 500; line-height: 1.5; }
.pricing-guarantee-note i { margin-right: 4px; font-size: 11px; }
.price-discount-tag { white-space: nowrap; }

/* Per-card work pipeline, pushed to the bottom so the three cards line up. */
.pricing-work { margin: auto 0 14px; padding: 14px 14px 12px; background: #f6f9ff; border: 1px solid #e1eaf8; border-radius: 14px; }
.pricing-work + .pricing-timeline-footer { margin-top: 0; }
.pricing-work-head { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.pricing-work-head span { color: #64748b; font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.pricing-work-head b { color: #2463eb; font-size: 12px; font-weight: 600; }
.pricing-work-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.pricing-work-steps li { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; background: #fff; border: 1px solid #e6edf8; border-radius: 999px; white-space: nowrap; color: #1e293b; font-size: 12px; line-height: 1.3; }
.pricing-work-steps li span { flex: none; color: #2463eb; font-size: 10px; font-weight: 700; font-variant-numeric: tabular-nums; }
.popular-card .pricing-work { background: #eef4ff; border-color: #cfdcfb; }

/* "Where your budget goes" band */
.pricing-value-band {
    display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.6fr); gap: 36px; align-items: center;
    margin: 36px 10px 8px; padding: 36px; border-radius: 24px; color: #fff;
    background: radial-gradient(ellipse at 95% 0%, #528bff70, transparent 55%), linear-gradient(135deg, #2563eb, #1b4fc9);
    border: 1px solid #5485ec; box-shadow: 0 18px 44px -22px #1643a75c;
}
.pricing-value-eyebrow { display: inline-block; margin-bottom: 12px; color: #2463eb; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.pricing-value-band .pricing-value-eyebrow { color: #cfe0ff; }
.pricing-value-intro h2 { margin: 0 0 12px; color: #fff; font-size: clamp(22px, 2.2vw, 28px); font-weight: 600; line-height: 1.2; letter-spacing: -.025em; text-transform: none; text-align: left; }
.pricing-value-intro h2 span { color: #cfe0ff; font-weight: 400; }
.pricing-value-intro p { margin: 0; color: #dbe7ff; font-size: 14px; line-height: 1.6; }
.pricing-value-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; counter-reset: step; }
.pricing-value-steps li {
    position: relative; display: flex; flex-direction: column; gap: 6px; padding: 16px 14px;
    background: #ffffff14; border: 1px solid #ffffff2e; border-radius: 16px; counter-increment: step;
}
.pricing-value-steps li::after { content: counter(step, decimal-leading-zero); position: absolute; top: 14px; right: 14px; color: #ffffff70; font-size: 11px; font-weight: 600; }
.pricing-value-steps i { display: grid; place-items: center; width: 32px; height: 32px; margin-bottom: 4px; border-radius: 10px; background: #fff; color: #2463eb; font-size: 14px; }
.pricing-value-steps b { color: #fff; font-size: 14px; font-weight: 600; line-height: 1.3; }
.pricing-value-steps span { color: #dbe7ff; font-size: 12px; line-height: 1.5; }

/* Managed hosting header + monthly care band */
#managed-hosting .unified-header-wrapper { max-width: 760px; margin: 0 auto 40px !important; }
#managed-hosting .header-sub-blue {
    display: inline-flex !important; align-items: center; gap: 8px; margin: 0 0 16px !important; padding: 6px 14px !important;
    border: 1px solid #c7d8fb; border-radius: 999px; background: #eff5ff;
    color: #2463eb !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .08em !important; line-height: 1.3 !important; text-transform: uppercase !important;
}
#managed-hosting .header-sub-blue::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #2463eb; }
#managed-hosting .header-main-title {
    margin: 0 0 12px !important; color: #0f172a !important; font-size: clamp(30px, 3.4vw, 44px) !important; font-weight: 500 !important;
    line-height: 1.12 !important; letter-spacing: -.035em !important; text-transform: none !important;
}
#managed-hosting .hosting-specs-list li { gap: 14px; font-size: 13.5px; padding: 11px 0; }
#managed-hosting .spec-label { flex: none; white-space: nowrap; }
#managed-hosting .spec-value { min-width: 0; font-weight: 600; line-height: 1.35; }
.hosting-care-band {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 32px; align-items: center;
    margin-top: 28px; padding: 28px 32px; background: #fff; border: 1px solid #e3e9f2; border-radius: 22px;
    box-shadow: 0 1px 2px #0f172a0a, 0 18px 36px -24px #0f172a33;
}
.hosting-care-intro h3 { margin: 0 0 8px; color: #0f172a; font-size: 20px; font-weight: 600; letter-spacing: -.02em; }
.hosting-care-intro p { margin: 0; color: #64748b; font-size: 14px; line-height: 1.6; }
.hosting-care-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.hosting-care-list li { display: flex; align-items: center; gap: 10px; padding: 12px; background: #f6f9ff; border: 1px solid #e1eaf8; border-radius: 12px; color: #1e293b; font-size: 13px; font-weight: 500; line-height: 1.3; }
.hosting-care-list i { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: 8px; background: #2463eb; color: #fff; font-size: 12px; }

@media (max-width: 1100px) {
    .pricing-value-band { grid-template-columns: 1fr; }
    .pricing-value-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .hosting-care-band { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .pricing-value-band { padding: 24px 18px; }
    .pricing-value-steps, .hosting-care-list { grid-template-columns: 1fr 1fr; }
    .hosting-care-band { padding: 22px 18px; }
}
@media (max-width: 380px) {
    .pricing-value-steps, .hosting-care-list { grid-template-columns: 1fr; }
}

/* Detailed specification tables (plans + cloud hosting). */
.hosting-table-title {
    display: flex; flex-direction: column; align-items: center; gap: 10px;
    margin: 48px 0 20px !important; color: #0f172a !important;
    font-size: clamp(24px, 2.4vw, 30px) !important; font-weight: 500 !important; letter-spacing: -.03em; line-height: 1.2;
}
.hosting-table-title::before {
    content: 'Compare side by side'; padding: 5px 12px; border: 1px solid #c7d8fb; border-radius: 999px; background: #eff5ff;
    color: #2463eb; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
}
.hosting-table-wrapper { margin: 0 10px 32px !important; border: 1px solid #e3e9f2 !important; border-radius: 22px !important; box-shadow: 0 1px 2px #0f172a0a, 0 24px 48px -28px #0f172a33 !important; }
.hosting-table { border-collapse: separate !important; border-spacing: 0; }
.hosting-table th, .hosting-table td { padding: 15px 20px !important; border-bottom: 1px solid #eef2f7 !important; vertical-align: middle; }
.hosting-table tbody tr:last-child td { border-bottom: 0 !important; }
.hosting-table th { background: #f8fafc !important; vertical-align: bottom; }
.hosting-table th.col-feature { width: 25% !important; color: #64748b !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .06em; text-transform: uppercase; }
.hosting-table th.col-tier { width: 25% !important; text-align: left !important; }
.hosting-table .tier-header-name { color: #475569 !important; font-size: 13px !important; font-weight: 500 !important; }
.hosting-table .tier-header-price { margin-top: 4px; color: #0f172a !important; font-size: 24px !important; font-weight: 600 !important; letter-spacing: -.03em; }
.hosting-table .tier-header-price span { color: #64748b !important; font-size: 12px !important; font-weight: 500; letter-spacing: 0; }

/* Most popular column: solid header, tinted body, blue edge. */
.hosting-table th:nth-child(3) { position: relative; background: #2463eb !important; padding-top: 38px !important; }
.hosting-table th:nth-child(3)::before {
    content: 'Most popular'; position: absolute; top: 14px; left: 20px; padding: 2px 8px; border-radius: 999px;
    background: #ffffff26; border: 1px solid #ffffff40; color: #fff; font-size: 10px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
}
.hosting-table th:nth-child(3) :is(.tier-header-name, .tier-header-price, .tier-header-price span) { color: #fff !important; }
.hosting-table th:nth-child(3) .tier-header-name { color: #dbe7ff !important; }
.hosting-table td:nth-child(3) { background: #f3f7ff !important; box-shadow: inset 2px 0 0 #2463eb, inset -2px 0 0 #2463eb; }
.hosting-table tbody tr:last-child td:nth-child(3) { box-shadow: inset 2px 0 0 #2463eb, inset -2px 0 0 #2463eb, inset 0 -2px 0 #2463eb; }

/* Neutral body text; one blue check style instead of mixed green/blue. */
.hosting-table td:first-child { color: #0f172a; font-size: 13.5px !important; }
.hosting-table td:first-child strong { font-weight: 600 !important; }
.hosting-table td.cell-tier { text-align: left !important; color: #334155 !important; font-size: 13.5px !important; font-weight: 400 !important; }
.hosting-table td.cell-tier strong { color: #0f172a !important; font-weight: 600 !important; }
.hosting-table td.cell-tier i { margin-right: 6px; color: #2463eb; font-size: 12px; }
.hosting-table td:nth-child(3).cell-tier { color: #0f172a !important; font-weight: 500 !important; }
.hosting-table tr:hover td { background: #f8fafc !important; }
.hosting-table tr:hover td:nth-child(3) { background: #e9f0ff !important; }

/* Managed hosting plan cards */
#managed-hosting .hosting-cards-grid { gap: 20px !important; margin: 0 10px !important; align-items: stretch; }
#managed-hosting .hosting-card { padding: 28px !important; border: 1px solid #e3e9f2 !important; border-radius: 22px !important; box-shadow: 0 1px 2px #0f172a0a, 0 18px 36px -24px #0f172a33 !important; }
#managed-hosting .hosting-card:hover { border-color: #b9cdf6 !important; box-shadow: 0 22px 40px -22px #1d4ed84d !important; }
#managed-hosting .hosting-card.featured { border: 2px solid #2463eb !important; box-shadow: 0 24px 48px -24px #1d4ed866 !important; }
#managed-hosting .hosting-card-badge { z-index: 2; background: #fff !important; color: #2463eb !important; border: 1px solid #c7d8fb; box-shadow: 0 4px 12px -4px #1d4ed84d !important; font-weight: 600 !important; font-size: 11px !important; }

#managed-hosting .hosting-card-header { margin: 0 0 6px !important; padding: 0 0 22px !important; border-bottom: 1px solid #eef2f7 !important; }
#managed-hosting .hosting-plan-title { color: #0f172a; font-size: 20px !important; font-weight: 600 !important; letter-spacing: -.02em; }
#managed-hosting .hosting-plan-subtitle { min-height: 0 !important; color: #64748b; font-size: 13.5px !important; font-weight: 400 !important; line-height: 1.5; }
#managed-hosting .hosting-plan-price-box { margin: 18px 0 0 !important; }
#managed-hosting .hosting-price-val { font-size: 40px !important; font-weight: 600 !important; letter-spacing: -.04em !important; }
#managed-hosting .hosting-price-period { font-size: 14px !important; }

/* Featured card: blue header block so the recommended plan is obvious at a glance. */
#managed-hosting .hosting-card.featured .hosting-card-header {
    margin: -28px -28px 6px !important; padding: 34px 28px 24px !important; border-bottom: 0 !important; border-radius: 20px 20px 0 0;
    background: radial-gradient(ellipse at 95% 0%, #528bff70, transparent 55%), linear-gradient(135deg, #2563eb, #1b4fc9);
}
#managed-hosting .hosting-card.featured :is(.hosting-plan-title, .hosting-price-val) { color: #fff !important; }
#managed-hosting .hosting-card.featured :is(.hosting-plan-subtitle, .hosting-price-period) { color: #dbe7ff !important; }

/* Spec rows: neutral values, tinted icon tiles. */
#managed-hosting .hosting-specs-list { flex: 1; margin: 0 0 22px !important; }
#managed-hosting .hosting-specs-list li { border-bottom: 1px solid #eef2f7 !important; }
#managed-hosting .spec-label { gap: 10px !important; color: #475569 !important; font-weight: 400 !important; }
#managed-hosting .spec-label i { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: #eff5ff; color: #2463eb !important; font-size: 11px !important; }
#managed-hosting .spec-value { color: #0f172a !important; font-weight: 500 !important; }
#managed-hosting .hosting-card.featured .spec-value { font-weight: 600 !important; }

#managed-hosting .hosting-btn { margin-top: auto; padding: 13px 20px !important; border-radius: 12px !important; font-weight: 600 !important; }
#managed-hosting .hosting-btn.outline { background: #eff5ff !important; color: #1d4ed8 !important; border: 1px solid #c7d8fb !important; }
#managed-hosting .hosting-btn.outline:hover { background: #2463eb !important; color: #fff !important; border-color: #2463eb !important; }
@media (max-width: 991px) { #managed-hosting .hosting-cards-grid { grid-template-columns: 1fr !important; max-width: 520px; margin: 0 auto !important; } }