/*
 * Bhola VPS homepage — human-crafted product UI redesign
 * Scoped to .home-page so the shared header and footer remain untouched.
 */
.home-page {
    --home-ink: #101828;
    --home-muted: #5f6f86;
    --home-line: #dfe6ef;
    --home-soft: #f4f7fb;
    --home-blue: #2449c7;
    --home-blue-dark: #17358f;
    --home-cyan: #17a9c1;
    --home-green: #169b62;
    --home-violet: #7257d8;
    --home-orange: #ef8f2f;
    --home-card: #ffffff;
    --home-dark: #111c2e;
    --home-shadow: 0 22px 70px rgba(24, 46, 84, .12);
    color: var(--home-ink);
    background: #fff;
    overflow: hidden;
}

.home-shell {
    width: min(1380px, calc(100% - 48px));
    margin-inline: auto;
}

.home-section {
    padding: 110px 0;
}

.home-reveal {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .65s ease, transform .65s ease;
}

.home-reveal.is-visible {
    opacity: 1;
    transform: none;
}

.home-kicker {
    margin-bottom: 14px;
    color: var(--home-blue);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.home-title {
    max-width: 800px;
    margin: 0;
    color: var(--home-ink);
    font-size: clamp(34px, 4vw, 60px);
    font-weight: 760;
    line-height: 1.04;
    letter-spacing: -.045em;
}

.home-copy {
    margin: 0;
    color: var(--home-muted);
    font-size: 17px;
    line-height: 1.75;
}

.home-section-head {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, .72fr);
    gap: 70px;
    align-items: end;
    margin-bottom: 52px;
}

.home-btn {
    min-height: 51px;
    padding: 0 22px;
    border: 1px solid transparent;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #fff;
    background: var(--home-blue);
    box-shadow: 0 10px 25px rgba(36, 73, 199, .18);
    font-size: 14px;
    font-weight: 750;
    text-decoration: none;
    transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.home-btn:hover {
    transform: translateY(-2px);
    background: var(--home-blue-dark);
    box-shadow: 0 14px 30px rgba(36, 73, 199, .25);
}

.home-btn-secondary {
    color: var(--home-ink);
    background: #fff;
    border-color: #cfd8e6;
    box-shadow: none;
}

.home-btn-secondary:hover {
    color: var(--home-blue);
    background: #f7f9fc;
}

.home-btn-ghost {
    color: #fff;
    background: transparent;
    border-color: rgba(255, 255, 255, .35);
    box-shadow: none;
}

.home-btn-ghost:hover {
    background: rgba(255, 255, 255, .1);
}

.home-text-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 28px;
    color: var(--home-blue);
    font-size: 14px;
    font-weight: 800;
    text-decoration: none;
}

.home-text-link i {
    transition: transform .2s ease;
}

.home-text-link:hover i {
    transform: translateX(4px);
}

/* Hero */
.home-hero {
    position: relative;
    min-height: 760px;
    padding: 105px 0 110px;
    background:
        radial-gradient(circle at 10% 15%, rgba(36, 73, 199, .07), transparent 28%),
        radial-gradient(circle at 86% 30%, rgba(23, 169, 193, .08), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #f8faff 100%);
}

.home-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .38;
    background-image: linear-gradient(rgba(29, 57, 98, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(29, 57, 98, .055) 1px, transparent 1px);
    background-size: 54px 54px;
    mask-image: linear-gradient(to bottom, #000, transparent 82%);
}

.home-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(420px, .92fr) minmax(600px, 1.08fr);
    gap: 72px;
    align-items: center;
}

.home-hero-content {
    padding-top: 6px;
}

.home-hero-badge {
    width: max-content;
    max-width: 100%;
    min-height: 35px;
    padding: 6px 12px 6px 7px;
    border: 1px solid #dce4ef;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #40516a;
    background: rgba(255,255,255,.86);
    box-shadow: 0 6px 18px rgba(24, 46, 84, .06);
    font-size: 12px;
    font-weight: 750;
}

.home-hero-badge-dot {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--home-green);
    font-size: 9px;
}

.home-hero h1 {
    max-width: 720px;
    margin: 24px 0 24px;
    color: var(--home-ink);
    font-size: clamp(48px, 5.3vw, 78px);
    font-weight: 780;
    line-height: .98;
    letter-spacing: -.058em;
}

.home-hero h1 span {
    color: var(--home-blue);
}

.home-hero-copy {
    max-width: 660px;
    margin: 0;
    color: #52637b;
    font-size: clamp(17px, 1.4vw, 20px);
    line-height: 1.68;
}

.home-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 34px;
}

.home-trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 31px;
}

.home-trust-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #52637b;
    font-size: 13px;
    font-weight: 680;
}

.home-trust-item i {
    color: var(--home-green);
}

/* Hero dashboard */
.home-control-stage {
    position: relative;
    min-width: 0;
    padding: 36px 26px 44px 42px;
    perspective: 1200px;
}

.home-control-stage::before,
.home-control-stage::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    filter: blur(4px);
    pointer-events: none;
}

.home-control-stage::before {
    width: 360px;
    height: 360px;
    top: 5%;
    right: -8%;
    background: rgba(36, 73, 199, .12);
}

.home-control-stage::after {
    width: 250px;
    height: 250px;
    left: -2%;
    bottom: 4%;
    background: rgba(23, 169, 193, .12);
}

.home-control-window {
    position: relative;
    z-index: 2;
    overflow: hidden;
    border: 1px solid rgba(202, 213, 228, .95);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 35px 90px rgba(24, 46, 84, .18), 0 5px 20px rgba(24, 46, 84, .08);
    transform: rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));
    transform-origin: center;
    transition: transform .2s ease-out;
}

.home-control-bar {
    min-height: 49px;
    padding: 0 16px;
    border-bottom: 1px solid #e5ebf2;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 15px;
    background: #f8fafc;
}

.home-window-dots {
    display: flex;
    gap: 6px;
}

.home-window-dots span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #c7d0dc;
}

.home-window-dots span:first-child { background: #f06c63; }
.home-window-dots span:nth-child(2) { background: #f2bf4e; }
.home-window-dots span:nth-child(3) { background: #52bf73; }

.home-control-address {
    width: min(280px, 100%);
    min-height: 28px;
    margin: 0 auto;
    border: 1px solid #e1e7ef;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: #718096;
    background: #fff;
    font-size: 10px;
    font-weight: 650;
}

.home-control-address i { color: var(--home-green); }

.home-control-live {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #527063;
    font-size: 10px;
    font-weight: 800;
}

.home-control-live i,
.home-lab-topline > span i,
.rack-scene-top strong i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--home-green);
    box-shadow: 0 0 0 5px rgba(22, 155, 98, .12);
}

.home-control-body {
    min-height: 480px;
    display: grid;
    grid-template-columns: 58px 1fr;
    background: #f5f7fb;
}

.home-control-nav {
    padding: 16px 10px;
    border-right: 1px solid #e5eaf2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    background: #fff;
}

.home-control-brand-mark {
    width: 34px;
    height: 34px;
    margin-bottom: 12px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: var(--home-blue);
    font-size: 10px;
    font-weight: 900;
    letter-spacing: -.02em;
}

.home-control-nav > span {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8b99ab;
    font-size: 13px;
}

.home-control-nav > span.is-active {
    color: var(--home-blue);
    background: #edf2ff;
}

.home-control-main {
    min-width: 0;
    padding: 22px;
}

.home-control-heading {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: center;
    margin-bottom: 17px;
}

.home-control-heading small {
    display: block;
    margin-bottom: 4px;
    color: #8a98aa;
    font-size: 9px;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .11em;
}

.home-control-heading h2 {
    margin: 0;
    color: #1a2638;
    font-size: 18px;
    font-weight: 760;
    letter-spacing: -.025em;
}

.home-control-heading button {
    width: 30px;
    height: 30px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #7c899a;
    background: #fff;
}

.home-metric-grid {
    display: grid;
    grid-template-columns: 1.35fr .8fr .8fr;
    gap: 11px;
}

.home-metric-card,
.home-traffic-card,
.home-events-card {
    min-width: 0;
    border: 1px solid #e3e9f1;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 6px 16px rgba(24, 46, 84, .04);
}

.home-metric-card {
    min-height: 112px;
    padding: 13px;
}

.home-metric-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    color: #718096;
    font-size: 8px;
    font-weight: 700;
}

.home-metric-label span { display: inline-flex; align-items: center; gap: 5px; }
.home-metric-label i { color: var(--home-blue); }
.home-metric-card > strong {
    display: block;
    margin-top: 12px;
    color: #192638;
    font-size: 25px;
    line-height: 1;
    letter-spacing: -.04em;
}
.home-metric-card > strong span { margin-left: 2px; color: #8190a4; font-size: 11px; }

.home-uptime-bars {
    height: 28px;
    display: flex;
    align-items: end;
    gap: 2px;
    margin-top: 12px;
}

.home-uptime-bars i {
    flex: 1;
    height: calc(45% + (var(--i) % 6) * 8%);
    border-radius: 2px 2px 0 0;
    background: #27ad73;
    opacity: calc(.42 + (var(--i) % 5) * .1);
}

.home-sparkline {
    height: 25px;
    display: flex;
    align-items: end;
    gap: 3px;
    margin-top: 13px;
}
.home-sparkline i { flex: 1; border-radius: 2px; background: #dbe5ff; }
.home-sparkline i:nth-child(1) { height: 28%; }
.home-sparkline i:nth-child(2) { height: 42%; }
.home-sparkline i:nth-child(3) { height: 36%; }
.home-sparkline i:nth-child(4) { height: 63%; }
.home-sparkline i:nth-child(5) { height: 52%; }
.home-sparkline i:nth-child(6) { height: 78%; }
.home-sparkline i:nth-child(7) { height: 66%; }
.home-sparkline i:nth-child(8) { height: 92%; background: var(--home-blue); }

.home-progress {
    height: 7px;
    margin-top: 18px;
    overflow: hidden;
    border-radius: 999px;
    background: #edf1f6;
}
.home-progress span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--home-blue), var(--home-cyan)); }

.home-control-lower {
    display: grid;
    grid-template-columns: 1.15fr .85fr;
    gap: 11px;
    margin-top: 11px;
}

.home-traffic-card,
.home-events-card { min-height: 198px; padding: 15px; }
.home-card-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.home-card-title small { display: block; margin-bottom: 3px; color: #92a0b0; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.home-card-title strong { color: #26354a; font-size: 11px; }
.home-card-title > span { padding: 4px 6px; border-radius: 5px; color: #168b5a; background: #e9f8f1; font-size: 8px; font-weight: 800; }
.home-card-title > i { color: var(--home-blue); }

.home-traffic-chart {
    height: 106px;
    display: flex;
    align-items: end;
    gap: 5px;
    padding-top: 16px;
    border-bottom: 1px solid #e7edf4;
    background-image: linear-gradient(to bottom, transparent calc(33% - 1px), #eef2f7 33%, transparent calc(33% + 1px), transparent calc(66% - 1px), #eef2f7 66%, transparent calc(66% + 1px));
}
.home-traffic-chart span { flex: 1; height: var(--h); min-width: 3px; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, #4c6ee4, #2449c7); opacity: .84; }
.home-chart-labels { display: flex; justify-content: space-between; padding-top: 7px; color: #9aa6b6; font-size: 7px; }

.home-events-card ul { display: grid; gap: 11px; margin: 15px 0 0; padding: 0; list-style: none; }
.home-events-card li { display: flex; align-items: center; gap: 9px; }
.home-event-icon { width: 27px; height: 27px; flex: 0 0 27px; border-radius: 7px; display: flex; align-items: center; justify-content: center; font-size: 9px; }
.home-event-icon.is-green { color: #158d59; background: #e7f8ef; }
.home-event-icon.is-blue { color: #2449c7; background: #edf2ff; }
.home-event-icon.is-violet { color: #7257d8; background: #f0edff; }
.home-events-card li strong, .home-events-card li small { display: block; }
.home-events-card li strong { color: #344259; font-size: 9px; }
.home-events-card li small { margin-top: 2px; color: #98a4b4; font-size: 7px; }

.home-float-card {
    position: absolute;
    z-index: 3;
    min-width: 190px;
    padding: 11px 13px;
    border: 1px solid rgba(211, 221, 234, .95);
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 40px rgba(24, 46, 84, .14);
}
.home-float-card > i, .home-live-ring { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 9px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--home-blue); }
.home-float-card small, .home-float-card strong { display: block; }
.home-float-card small { color: #8b98a9; font-size: 8px; }
.home-float-card strong { margin-top: 3px; color: #27364a; font-size: 10px; }
.home-float-speed { left: 0; bottom: 66px; animation: homeFloat 4.8s ease-in-out infinite; }
.home-float-speed > i { background: linear-gradient(135deg, #ef8f2f, #f6b34f); }
.home-float-backup { top: 8px; right: 0; animation: homeFloat 5.6s ease-in-out infinite reverse; }
.home-live-ring { position: relative; background: linear-gradient(135deg, #17a9c1, #2449c7); }
.home-live-ring::after { content: ""; position: absolute; inset: -4px; border: 1px solid rgba(23,169,193,.36); border-radius: 12px; animation: homePulseRing 2s ease-out infinite; }

@keyframes homeFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-8px); } }
@keyframes homePulseRing { 0% { transform: scale(.88); opacity: .8; } 100% { transform: scale(1.18); opacity: 0; } }

/* Domain */
.home-domain-wrap {
    position: relative;
    z-index: 4;
    margin-top: -58px;
}

.home-domain-card {
    padding: 28px 30px;
    border: 1px solid #dce4ee;
    border-radius: 16px;
    display: grid;
    grid-template-columns: .75fr 1.25fr;
    gap: 36px;
    align-items: center;
    background: #fff;
    box-shadow: 0 22px 60px rgba(24, 46, 84, .12);
}

.home-domain-intro > span {
    color: var(--home-blue);
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.home-domain-intro h2 { margin: 6px 0 4px; color: var(--home-ink); font-size: 27px; letter-spacing: -.035em; }
.home-domain-intro p { margin: 0; color: var(--home-muted); font-size: 13px; line-height: 1.55; }
.home-domain-search-area { min-width: 0; }
.home-domain-form { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.home-domain-input-icon { position: absolute; left: 17px; top: 50%; transform: translateY(-50%); color: #8493a6; }
.home-domain-form input { min-width: 0; height: 54px; padding: 0 18px 0 45px; border: 1px solid #d7e0eb; border-radius: 10px; color: var(--home-ink); background: #f9fbfd; font: inherit; font-size: 14px; outline: none; transition: border .2s, box-shadow .2s; }
.home-domain-form input:focus { border-color: var(--home-blue); box-shadow: 0 0 0 4px rgba(36,73,199,.1); }
.home-domain-form button { min-width: 150px; height: 54px; border: 0; border-radius: 10px; color: #fff; background: var(--home-blue); font-weight: 800; cursor: pointer; }
.home-domain-form button i { margin-left: 6px; }
.home-tld-list { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 11px; color: #7f8da0; font-size: 11px; font-weight: 750; }

/* Technology rail */
.home-tech-rail {
    margin-top: 72px;
    border-top: 1px solid #e5ebf2;
    border-bottom: 1px solid #e5ebf2;
    display: grid;
    grid-template-columns: 310px minmax(0, 1fr);
    background: #fbfcfe;
}

.home-tech-rail-label {
    min-height: 106px;
    padding: 0 38px;
    border-right: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.home-tech-rail-label span { color: var(--home-blue); font-size: 9px; font-weight: 900; letter-spacing: .18em; }
.home-tech-rail-label strong { max-width: 220px; margin-top: 5px; color: #28374c; font-size: 14px; line-height: 1.35; }
.home-tech-marquee { min-width: 0; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.home-tech-track { width: max-content; min-height: 106px; display: flex; align-items: center; gap: 14px; padding: 0 14px; animation: techRail 30s linear infinite; }
.home-tech-marquee:hover .home-tech-track { animation-play-state: paused; }
.home-tech-item { min-width: 160px; height: 58px; padding: 0 18px; border: 1px solid #e2e8f0; border-radius: 10px; display: flex; align-items: center; gap: 10px; background: #fff; box-shadow: 0 4px 10px rgba(24,46,84,.03); color: #324156; }
.home-tech-item > i { width: 26px; text-align: center; font-size: 24px; }
.home-tech-item strong { font-size: 13px; white-space: nowrap; }
.tech-cpanel { width: 28px; height: 28px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: #ff6c2c; font-size: 10px; font-weight: 900; }
.tech-litespeed { color: #f28d2d; }
.tech-aws { color: #232f3e; }
.tech-imunify { color: #2b69d1; }
.tech-backup { color: #13a36b; }
.tech-cloudflare { color: #f39a22; }
.tech-docker { color: #1d9bd1; }
.tech-php { color: #6976a7; }
@keyframes techRail { to { transform: translateX(-50%); } }

/* Speed section */
.home-speed-section { background: #fff; }
.home-speed-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: 90px; align-items: center; }
.home-speed-copy .home-copy { max-width: 590px; margin-top: 22px; }
.home-speed-number { display: flex; align-items: center; gap: 16px; margin: 30px 0 24px; }
.home-speed-number strong { color: var(--home-blue); font-size: clamp(66px, 7vw, 110px); line-height: .82; letter-spacing: -.08em; }
.home-speed-number span { color: #25344a; font-size: 17px; font-weight: 900; line-height: 1.05; letter-spacing: .08em; }
.home-speed-points { display: grid; gap: 14px; }
.home-speed-points > div { display: flex; align-items: flex-start; gap: 12px; }
.home-speed-points > div > i { width: 23px; height: 23px; flex: 0 0 23px; margin-top: 1px; border-radius: 7px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--home-green); font-size: 10px; }
.home-speed-points strong, .home-speed-points small { display: block; }
.home-speed-points strong { color: #2b394d; font-size: 14px; }
.home-speed-points small { margin-top: 3px; color: var(--home-muted); font-size: 12px; line-height: 1.5; }

.home-speed-lab {
    position: relative;
    overflow: hidden;
    padding: 24px;
    border: 1px solid #dce5ef;
    border-radius: 18px;
    background: #f7f9fc;
    box-shadow: var(--home-shadow);
}
.home-speed-lab::after { content: ""; position: absolute; width: 280px; height: 280px; right: -120px; top: -120px; border-radius: 50%; background: rgba(36,73,199,.07); pointer-events: none; }
.home-lab-topline { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 15px; padding-bottom: 18px; border-bottom: 1px solid #e0e7ef; color: #68778c; font-size: 11px; font-weight: 760; }
.home-lab-topline > span { display: flex; align-items: center; gap: 9px; color: #2d3d53; }
.home-lab-topline > strong { color: var(--home-blue); }

.home-speed-track { position: relative; height: 130px; margin: 20px 0 16px; display: flex; align-items: center; }
.home-track-start, .home-track-end { position: absolute; top: 16px; color: #8290a3; font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.home-track-start { left: 0; }
.home-track-end { right: 0; }
.home-track-line { position: absolute; left: 34px; right: 34px; top: 67px; height: 3px; background: #cfd8e5; }
.home-track-line::before, .home-track-line::after { content: ""; position: absolute; top: 50%; width: 13px; height: 13px; border-radius: 50%; background: #fff; border: 4px solid var(--home-blue); transform: translateY(-50%); }
.home-track-line::before { left: -4px; }
.home-track-line::after { right: -4px; background: var(--home-blue); }
.home-track-line i { position: absolute; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: #9eb0c6; }
.home-track-line i:nth-child(1) { left: 20%; }.home-track-line i:nth-child(2) { left: 40%; }.home-track-line i:nth-child(3) { left: 60%; }.home-track-line i:nth-child(4) { left: 80%; }.home-track-line i:nth-child(5) { left: 98%; }
.home-speed-runner { position: absolute; z-index: 2; top: 43px; left: 42px; width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #fff; background: linear-gradient(135deg, var(--home-blue), var(--home-cyan)); box-shadow: 0 10px 25px rgba(36,73,199,.3); animation: speedRunner 4.6s cubic-bezier(.65,0,.35,1) infinite; }
.home-speed-runner::after { content: ""; position: absolute; right: 42px; width: 70px; height: 3px; border-radius: 999px; background: linear-gradient(90deg, transparent, rgba(36,73,199,.42)); }
@keyframes speedRunner { 0%, 8% { left: 42px; } 48%, 58% { left: calc(100% - 90px); } 92%,100% { left: 42px; } }

.home-lab-result-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.home-lab-result-grid article { padding: 14px; border: 1px solid #e0e7ef; border-radius: 10px; background: #fff; }
.home-lab-result-grid small, .home-lab-result-grid strong, .home-lab-result-grid span { display: block; }
.home-lab-result-grid small { color: #8290a3; font-size: 9px; }
.home-lab-result-grid strong { margin-top: 6px; color: #24344a; font-size: 20px; letter-spacing: -.03em; }
.home-lab-result-grid span { margin-top: 4px; color: #8290a3; font-size: 8px; }
.home-lab-result-grid span.is-good { color: var(--home-green); font-weight: 800; }
.home-waterfall { margin-top: 12px; padding: 14px; border: 1px solid #e0e7ef; border-radius: 10px; background: #fff; }
.home-waterfall-head, .home-waterfall > div { display: grid; grid-template-columns: 82px 1fr 46px; gap: 10px; align-items: center; }
.home-waterfall-head { margin-bottom: 10px; color: #94a0b0; font-size: 8px; text-transform: uppercase; letter-spacing: .08em; }
.home-waterfall-head span:last-child { grid-column: 2 / 4; }
.home-waterfall > div:not(.home-waterfall-head) { min-height: 25px; }
.home-waterfall strong { color: #57667a; font-size: 9px; }
.home-waterfall > div > span { height: 6px; overflow: hidden; border-radius: 999px; background: #edf1f6; }
.home-waterfall > div > span i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--home-blue), var(--home-cyan)); }
.home-waterfall small { color: #7b899c; font-size: 8px; text-align: right; }

/* Services */
.home-services { background: var(--home-soft); }
.home-service-switcher { display: grid; grid-template-columns: 350px minmax(0, 1fr); gap: 16px; }
.home-service-tabs { display: grid; align-content: start; gap: 8px; }
.home-service-tab { width: 100%; min-height: 84px; padding: 13px 14px; border: 1px solid transparent; border-radius: 11px; display: grid; grid-template-columns: 44px 1fr auto; gap: 12px; align-items: center; color: #425168; background: transparent; text-align: left; cursor: pointer; transition: background .2s, border .2s, box-shadow .2s; }
.home-service-tab > span { width: 44px; height: 44px; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: var(--home-blue); background: #e9efff; font-size: 17px; }
.home-service-tab strong, .home-service-tab small { display: block; }
.home-service-tab strong { color: #27364a; font-size: 14px; }
.home-service-tab small { margin-top: 4px; color: #8390a2; font-size: 10px; }
.home-service-tab > i { color: #9ca8b7; font-size: 11px; }
.home-service-tab.is-active { border-color: #dbe3ef; background: #fff; box-shadow: 0 12px 30px rgba(24,46,84,.08); }
.home-service-tab.is-active > span { color: #fff; background: var(--home-blue); }
.home-service-tab.is-active > i { color: var(--home-blue); }

.home-service-panels { min-width: 0; }
.home-service-panel { min-height: 480px; padding: 42px; border: 1px solid #dae3ee; border-radius: 16px; display: none; grid-template-columns: .9fr 1.1fr; gap: 45px; align-items: center; background: #fff; box-shadow: 0 18px 55px rgba(24,46,84,.08); }
.home-service-panel.is-active { display: grid; animation: panelIn .35s ease; }
@keyframes panelIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.home-panel-label { width: max-content; padding: 5px 8px; border-radius: 5px; color: var(--home-blue); background: #edf2ff; font-size: 9px; font-weight: 850; text-transform: uppercase; letter-spacing: .1em; }
.home-panel-copy h3 { margin: 16px 0 13px; color: #172438; font-size: 35px; line-height: 1.08; letter-spacing: -.045em; }
.home-panel-copy > p { margin: 0; color: var(--home-muted); font-size: 14px; line-height: 1.7; }
.home-panel-copy ul { display: grid; gap: 10px; margin: 22px 0 27px; padding: 0; list-style: none; }
.home-panel-copy li { display: flex; align-items: center; gap: 10px; color: #46556b; font-size: 13px; }
.home-panel-copy li i { width: 20px; height: 20px; border-radius: 6px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--home-green); font-size: 8px; }

.home-product-preview { min-width: 0; overflow: hidden; border: 1px solid #dce4ef; border-radius: 14px; background: #f6f8fb; box-shadow: 0 16px 38px rgba(24,46,84,.1); }
.preview-toolbar { min-height: 46px; padding: 0 14px; border-bottom: 1px solid #e2e8f0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; background: #fff; }
.preview-toolbar > span { display: flex; gap: 5px; }
.preview-toolbar > span i { width: 7px; height: 7px; border-radius: 50%; background: #cbd4df; }
.preview-toolbar > span i:first-child { background: #ef726b; }.preview-toolbar > span i:nth-child(2) { background: #f2c05c; }.preview-toolbar > span i:nth-child(3) { background: #51bd70; }
.preview-toolbar strong { color: #4a596d; font-size: 10px; }
.preview-toolbar small { justify-self: end; color: var(--home-green); font-size: 8px; font-weight: 800; }
.preview-site-card { margin: 17px; padding: 14px; border: 1px solid #e0e7ef; border-radius: 10px; display: grid; grid-template-columns: 40px 1fr auto; gap: 11px; align-items: center; background: #fff; }
.preview-site-icon { width: 40px; height: 40px; border-radius: 9px; display: flex; align-items: center; justify-content: center; color: #fff; background: #21759b; font-size: 20px; }
.preview-site-card strong, .preview-site-card small { display: block; }
.preview-site-card strong { color: #324156; font-size: 10px; }.preview-site-card small { margin-top: 3px; color: #8b98a9; font-size: 8px; }
.preview-site-card b { padding: 5px 7px; border-radius: 5px; color: var(--home-green); background: #e8f8f0; font-size: 8px; }
.preview-quick-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; padding: 0 17px 17px; }
.preview-quick-grid > div { min-height: 82px; padding: 12px; border: 1px solid #e1e7ef; border-radius: 9px; background: #fff; }
.preview-quick-grid i { color: var(--home-blue); }
.preview-quick-grid strong, .preview-quick-grid small { display: block; }
.preview-quick-grid strong { margin-top: 9px; color: #3c4a5f; font-size: 9px; }.preview-quick-grid small { margin-top: 3px; color: #91a0b1; font-size: 8px; }

.route-summary { min-height: 100px; margin: 17px; padding: 18px; border: 1px solid #e0e7ef; border-radius: 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; }
.route-summary > span { display: grid; justify-items: center; gap: 7px; color: #4b5b70; font-size: 9px; font-weight: 750; }
.route-summary > span i { width: 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--home-blue); font-size: 14px; }
.route-summary > span:last-child i { background: var(--home-cyan); }
.route-summary b { flex: 1; height: 3px; position: relative; background: #d7e0ea; }
.route-summary b i { position: absolute; top: -3px; width: 9px; height: 9px; border-radius: 50%; background: var(--home-blue); animation: routePacket 2.1s linear infinite; }
.route-summary b i:nth-child(2) { animation-delay: -.7s; }.route-summary b i:nth-child(3) { animation-delay: -1.4s; }
@keyframes routePacket { from { left: 0; } to { left: calc(100% - 9px); } }
.latency-card { margin: 0 17px; padding: 15px; border-radius: 10px; color: #fff; background: #172641; }
.latency-card small { display: block; color: #a9b6ca; font-size: 8px; }.latency-card > strong { display: block; margin-top: 5px; font-size: 29px; }.latency-card > strong span { font-size: 10px; color: #9cacbe; }
.latency-wave { height: 30px; display: flex; align-items: end; gap: 4px; margin-top: 10px; }
.latency-wave i { flex: 1; border-radius: 2px 2px 0 0; background: #35bdd1; animation: latencyWave 1.4s ease-in-out infinite alternate; }
.latency-wave i:nth-child(1) { height: 20%; }.latency-wave i:nth-child(2) { height: 42%; animation-delay:.1s}.latency-wave i:nth-child(3) { height: 28%; animation-delay:.2s}.latency-wave i:nth-child(4) { height: 70%; animation-delay:.3s}.latency-wave i:nth-child(5) { height: 48%; animation-delay:.4s}.latency-wave i:nth-child(6) { height: 84%; animation-delay:.5s}.latency-wave i:nth-child(7) { height: 60%; animation-delay:.6s}.latency-wave i:nth-child(8) { height: 92%; animation-delay:.7s}.latency-wave i:nth-child(9) { height: 66%; animation-delay:.8s}
@keyframes latencyWave { to { transform: scaleY(.55); opacity:.6; } }
.preview-stat-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; padding: 10px 17px 17px; }
.preview-stat-row > div { padding: 11px; border: 1px solid #e0e7ef; border-radius: 8px; background: #fff; }
.preview-stat-row small, .preview-stat-row strong { display: block; }.preview-stat-row small { color: #8d9aab; font-size: 8px; }.preview-stat-row strong { margin-top: 5px; color: #334259; font-size: 11px; }
.terminal-lines { min-height: 245px; padding: 21px; color: #b9c5d6; background: #142033; font: 11px/1.85 ui-monospace, SFMono-Regular, Menlo, monospace; }
.terminal-lines p { margin: 0 0 6px; }.terminal-lines b { color: #41c98d; }.terminal-lines span { color: #5ed7aa; }
.terminal-cursor { width: 7px; height: 14px; display: inline-block; background: #6ae0b1; animation: cursorBlink .9s step-end infinite; }
@keyframes cursorBlink { 50% { opacity: 0; } }
.client-account-list { display: grid; gap: 8px; padding: 16px 16px 8px; }
.client-account-list > div { padding: 11px; border: 1px solid #e0e7ef; border-radius: 9px; display: grid; grid-template-columns: 35px 1fr auto; gap: 10px; align-items: center; background: #fff; }
.client-account-list > div > span { width: 35px; height: 35px; border-radius: 9px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--home-blue); font-size: 8px; font-weight: 900; }
.client-account-list p { margin: 0; }.client-account-list strong, .client-account-list small { display: block; }.client-account-list strong { color: #35445a; font-size: 9px; }.client-account-list small { margin-top: 3px; color: #92a0b0; font-size: 8px; }.client-account-list b { color: var(--home-green); font-size: 8px; }
.reseller-preview > button { width: calc(100% - 32px); height: 38px; margin: 4px 16px 16px; border: 1px dashed #afbdd0; border-radius: 9px; color: var(--home-blue); background: #f9fbfe; font-size: 9px; font-weight: 800; }

/* Operations */
.home-operations { background: #fff; }
.home-operation-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.home-operation-card { min-height: 500px; padding: 28px; border: 1px solid #dfe6ef; border-radius: 15px; display: flex; flex-direction: column; background: #fff; box-shadow: 0 14px 40px rgba(24,46,84,.06); }
.home-operation-icon { position: relative; width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; color: #fff; background: var(--home-blue); font-size: 20px; }
.home-operation-icon.is-live span { position: absolute; width: 10px; height: 10px; right: -2px; top: -2px; border: 2px solid #fff; border-radius: 50%; background: var(--home-green); box-shadow: 0 0 0 5px rgba(22,155,98,.13); animation: liveDot 1.8s ease-in-out infinite; }
@keyframes liveDot { 50% { box-shadow: 0 0 0 9px rgba(22,155,98,0); } }
.home-operation-backup .home-operation-icon { background: var(--home-violet); }
.home-operation-support .home-operation-icon { background: var(--home-cyan); }
.home-operation-copy { margin-top: 22px; }
.home-operation-copy > small { color: var(--home-blue); font-size: 9px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.home-operation-copy h3 { margin: 9px 0 12px; color: #1b293d; font-size: 25px; line-height: 1.18; letter-spacing: -.035em; }
.home-operation-copy p { margin: 0; color: var(--home-muted); font-size: 13px; line-height: 1.7; }
.security-feed { display: grid; gap: 7px; margin-top: auto; padding-top: 28px; }
.security-feed > div { min-height: 45px; padding: 0 12px; border: 1px solid #e2e8f0; border-radius: 9px; display: flex; align-items: center; justify-content: space-between; gap: 10px; background: #f8fafc; color: #536277; font-size: 9px; }
.security-feed span { display: flex; align-items: center; gap: 7px; }.security-feed span i { color: var(--home-green); }.security-feed > div:last-child span i { color: #dd6e52; }.security-feed small { color: #9aa6b5; }
.backup-calendar { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-top: auto; padding-top: 28px; }
.backup-calendar > span { color: #9aa6b5; font-size: 8px; text-align: center; }.backup-calendar > i { aspect-ratio: 1; border: 1px solid #e1e7ef; border-radius: 7px; display: flex; align-items: center; justify-content: center; color: #8492a5; background: #f9fbfd; font-style: normal; font-size: 8px; }.backup-calendar > i.is-saved { color: #fff; background: var(--home-violet); border-color: var(--home-violet); }
.support-chat-preview { margin-top: auto; padding-top: 28px; }
.support-agent { display: flex; align-items: center; gap: 10px; }
.support-agent > span { width: 37px; height: 37px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; background: #273b5a; font-size: 9px; font-weight: 900; }
.support-agent p { margin: 0; }.support-agent strong, .support-agent small { display: block; }.support-agent strong { color: #35445a; font-size: 10px; }.support-agent small { margin-top: 2px; color: var(--home-green); font-size: 8px; }
.support-message { margin: 13px 0 8px 46px; padding: 12px 14px; border-radius: 4px 11px 11px 11px; color: #425168; background: #eef3f8; font-size: 10px; line-height: 1.55; }
.support-typing { width: 52px; height: 28px; margin-left: 46px; border-radius: 4px 9px 9px 9px; display: flex; align-items: center; justify-content: center; gap: 4px; background: #eef3f8; }
.support-typing i { width: 4px; height: 4px; border-radius: 50%; background: #8493a6; animation: typingDot 1s ease-in-out infinite; }.support-typing i:nth-child(2){animation-delay:.15s}.support-typing i:nth-child(3){animation-delay:.3s}
@keyframes typingDot { 50% { transform: translateY(-3px); opacity:.5; } }

/* Infrastructure story */
.home-infra-story { color: #fff; background: #111c2e; }
.home-infra-grid { display: grid; grid-template-columns: 1.08fr .92fr; gap: 86px; align-items: center; }
.home-infra-story .home-title { color: #fff; }.home-infra-story .home-copy { color: #aebbd0; }.home-infra-story .home-kicker { color: #61d4e3; }
.home-rack-scene { overflow: hidden; border: 1px solid rgba(196,211,230,.16); border-radius: 16px; background: #0b1423; box-shadow: 0 25px 70px rgba(0,0,0,.25); }
.rack-scene-top { min-height: 52px; padding: 0 18px; border-bottom: 1px solid rgba(203,216,234,.12); display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #8594aa; font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.rack-scene-top strong { display: flex; align-items: center; gap: 9px; color: #6fd7a2; }
.rack-corridor { position: relative; height: 430px; display: grid; grid-template-columns: 1fr 100px 1fr; gap: 18px; padding: 24px 26px 0; overflow: hidden; background: radial-gradient(circle at 50% 25%, rgba(55,99,164,.22), transparent 35%), linear-gradient(180deg, #111e33, #080f1a); perspective: 650px; }
.rack-column { display: grid; gap: 9px; transform-style: preserve-3d; }.rack-column.left { transform: rotateY(12deg); transform-origin: right center; }.rack-column.right { transform: rotateY(-12deg); transform-origin: left center; }
.rack-column > span { position: relative; min-height: 66px; padding: 11px 12px; border: 1px solid #2a3c55; border-radius: 5px; display: flex; align-items: center; gap: 7px; background: linear-gradient(180deg, #1a2a42, #101d30); box-shadow: inset 0 1px rgba(255,255,255,.04); }
.rack-column > span::before, .rack-column > span::after { content:""; height: 6px; border-radius: 2px; background: #40506a; }.rack-column > span::before { width: 36%; }.rack-column > span::after { width: 18%; }
.rack-column > span i { width: 5px; height: 5px; border-radius: 50%; background: #33cc8a; box-shadow: 0 0 8px rgba(51,204,138,.8); animation: serverBlink 2.2s step-end infinite; }.rack-column > span i:nth-child(2){animation-delay:.4s;background:#3fb6d2}.rack-column > span i:nth-child(3){animation-delay:.8s;background:#f2b44a}.rack-column > span b { position:absolute; left:12px; right:12px; bottom:8px; height:2px; background:#273a53; }
@keyframes serverBlink { 50% { opacity:.25; } }
.rack-floor { position: relative; overflow: hidden; background: linear-gradient(90deg, rgba(83,111,146,.08), rgba(116,147,183,.18), rgba(83,111,146,.08)); clip-path: polygon(30% 0, 70% 0, 100% 100%, 0 100%); }
.rack-floor::before { content:""; position:absolute; inset:0; background: repeating-linear-gradient(0deg, transparent 0 35px, rgba(137,166,199,.14) 36px 37px); }.rack-floor i { position:absolute; top:0; bottom:0; width:1px; background:rgba(145,176,210,.18); }.rack-floor i:nth-child(1){left:20%;transform:rotate(4deg)}.rack-floor i:nth-child(2){left:40%;transform:rotate(2deg)}.rack-floor i:nth-child(3){left:60%;transform:rotate(-2deg)}.rack-floor i:nth-child(4){left:80%;transform:rotate(-4deg)}
.rack-scene-stats { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(203,216,234,.12); }
.rack-scene-stats > div { min-height: 70px; padding: 14px 18px; border-right: 1px solid rgba(203,216,234,.12); }.rack-scene-stats > div:last-child { border-right: 0; }
.rack-scene-stats small, .rack-scene-stats strong { display:block; }.rack-scene-stats small { color:#74859b;font-size:8px;text-transform:uppercase;letter-spacing:.1em }.rack-scene-stats strong { margin-top:5px;color:#dce6f3;font-size:11px; }
.home-infra-copy .home-copy { max-width: 590px; margin-top: 22px; }
.home-infra-list { display: grid; gap: 0; margin-top: 31px; border-top: 1px solid rgba(205,218,235,.14); }
.home-infra-list > div { padding: 20px 0; border-bottom: 1px solid rgba(205,218,235,.14); display: grid; grid-template-columns: 44px 1fr; gap: 17px; }
.home-infra-list > div > span { color: #61d4e3; font-size: 10px; font-weight: 900; }
.home-infra-list strong { color: #f0f5fb; font-size: 14px; }.home-infra-list p { margin: 5px 0 0; color: #91a1b8; font-size: 12px; line-height:1.55; }
.home-infra-story .home-text-link { color: #61d4e3; }

/* Comparison */
.home-comparison { background: #f5f7fa; }
.home-comparison-table { overflow: hidden; border: 1px solid #dce4ee; border-radius: 14px; background: #fff; box-shadow: 0 15px 45px rgba(24,46,84,.07); }
.comparison-row { min-height: 68px; padding: 0 28px; border-bottom: 1px solid #e4eaf1; display: grid; grid-template-columns: 1.05fr .95fr .95fr; gap: 20px; align-items: center; color: #6c7a8e; font-size: 13px; }
.comparison-row:last-child { border-bottom: 0; }.comparison-head { min-height: 58px; color: #fff; background: #172640; font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }.comparison-row > span:first-child { display:flex;align-items:center;gap:11px;color:#34445a;font-weight:700 }.comparison-row > span:first-child i { width:31px;height:31px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--home-blue);background:#edf2ff }.comparison-row > strong:nth-child(2){color:#1d8c5c}.comparison-row > strong:nth-child(2)::before{content:"✓";margin-right:8px;color:var(--home-green)}

/* Final */
.home-final { padding: 90px 0; background: #fff; }
.home-final-card { min-height: 280px; padding: 48px 54px; border-radius: 18px; display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; color: #fff; background: linear-gradient(115deg, #1a347e 0%, #2449c7 55%, #168fa8 120%); box-shadow: 0 24px 65px rgba(36,73,199,.22); }
.home-final-card > div > span { color: #b9eaf0; font-size: 10px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }.home-final-card h2 { max-width: 760px; margin: 11px 0 10px; color:#fff;font-size:clamp(32px,4vw,54px);line-height:1.05;letter-spacing:-.045em }.home-final-card p{margin:0;color:#d9e4f5;font-size:15px}.home-final-actions{display:flex;flex-direction:column;gap:10px}.home-final-actions .home-btn:first-child{color:var(--home-blue);background:#fff;box-shadow:none}.home-final-actions .home-btn:first-child:hover{background:#edf3ff}

/* Dark mode, scoped */
body.dark-mode .home-page {
    --home-ink: #edf3fb;
    --home-muted: #a9b6c8;
    --home-line: #2c3a4f;
    --home-soft: #111a28;
    --home-card: #172234;
    background: #0d1522;
}
body.dark-mode .home-hero { background: radial-gradient(circle at 10% 15%, rgba(65,103,227,.16), transparent 28%), radial-gradient(circle at 86% 30%, rgba(27,176,198,.11), transparent 28%), linear-gradient(180deg,#0d1522,#101a2a); }
body.dark-mode .home-hero::before { opacity:.18; }
body.dark-mode .home-hero-badge, body.dark-mode .home-domain-card, body.dark-mode .home-tech-item, body.dark-mode .home-service-panel, body.dark-mode .home-operation-card, body.dark-mode .home-comparison-table { background:#172234;border-color:#2b3a50; }
body.dark-mode .home-control-window { border-color:#33435a;background:#172234; }.dark-mode .home-control-bar,.dark-mode .home-control-nav,.dark-mode .home-control-address,.dark-mode .home-metric-card,.dark-mode .home-traffic-card,.dark-mode .home-events-card,.dark-mode .preview-toolbar,.dark-mode .preview-site-card,.dark-mode .preview-quick-grid>div,.dark-mode .route-summary,.dark-mode .preview-stat-row>div,.dark-mode .client-account-list>div,.dark-mode .home-lab-result-grid article,.dark-mode .home-waterfall{background:#172234;border-color:#2b3a50}.dark-mode .home-control-body,.dark-mode .home-speed-lab,.dark-mode .home-product-preview{background:#111a28;border-color:#2b3a50}.dark-mode .home-control-heading h2,.dark-mode .home-metric-card>strong,.dark-mode .home-card-title strong,.dark-mode .home-events-card li strong,.dark-mode .home-domain-intro h2,.dark-mode .home-tech-item,.dark-mode .home-panel-copy h3,.dark-mode .preview-site-card strong,.dark-mode .preview-quick-grid strong,.dark-mode .preview-stat-row strong,.dark-mode .client-account-list strong,.dark-mode .home-operation-copy h3,.dark-mode .comparison-row>span:first-child{color:#e8eff9}.dark-mode .home-tech-rail{background:#101927;border-color:#29384d}.dark-mode .home-tech-rail-label{border-color:#29384d}.dark-mode .home-domain-form input{color:#e8eff9;background:#111a28;border-color:#33435a}.dark-mode .home-btn-secondary{color:#e8eff9;background:#172234;border-color:#394a61}.dark-mode .home-services,.dark-mode .home-comparison{background:#101927}.dark-mode .home-service-tab.is-active{background:#172234;border-color:#2b3a50}.dark-mode .home-service-tab strong{color:#dce5f2}.dark-mode .comparison-row{border-color:#2b3a50;color:#a9b6c8}.dark-mode .comparison-head{background:#101827}.dark-mode .home-operation-card{box-shadow:none}.dark-mode .security-feed>div,.dark-mode .backup-calendar>i,.dark-mode .support-message,.dark-mode .support-typing{background:#111a28;border-color:#2b3a50}.dark-mode .home-final{background:#0d1522}

/* Responsive */
@media (max-width: 1180px) {
    .home-hero-grid { grid-template-columns: .9fr 1.1fr; gap: 30px; }
    .home-control-stage { padding-left: 20px; padding-right: 10px; }
    .home-service-switcher { grid-template-columns: 310px 1fr; }
    .home-service-panel { padding: 32px; gap: 28px; }
    .home-speed-grid, .home-infra-grid { gap: 55px; }
}

@media (max-width: 1020px) {
    .home-shell { width: min(100% - 32px, 1380px); }
    .home-section { padding: 88px 0; }
    .home-hero { min-height: auto; padding: 82px 0 100px; }
    .home-hero-grid { grid-template-columns: 1fr; gap: 40px; }
    .home-hero-content { max-width: 760px; }
    .home-control-stage { max-width: 760px; width: 100%; margin-inline: auto; padding: 24px 28px 44px; }
    .home-domain-card { grid-template-columns: 1fr; gap: 18px; }
    .home-tech-rail { grid-template-columns: 240px 1fr; }
    .home-speed-grid, .home-infra-grid { grid-template-columns: 1fr; }
    .home-speed-copy, .home-infra-copy { max-width: 780px; }
    .home-service-switcher { grid-template-columns: 1fr; }
    .home-service-tabs { grid-template-columns: repeat(4, 1fr); }
    .home-service-tab { min-height: 105px; grid-template-columns: 40px 1fr; }.home-service-tab > i { display:none; }.home-service-tab small { display:none; }
    .home-operation-grid { grid-template-columns: 1fr 1fr; }.home-operation-card:last-child { grid-column: 1 / -1; min-height: 430px; }
}

@media (max-width: 760px) {
    .home-shell { width: min(100% - 28px, 1380px); }
    .home-section { padding: 72px 0; }
    .home-section-head { grid-template-columns: 1fr; gap: 18px; margin-bottom: 34px; }
    .home-title { font-size: clamp(33px, 9vw, 48px); }
    .home-copy { font-size: 15px; }
    .home-hero { padding: 64px 0 88px; }
    .home-hero h1 { font-size: clamp(45px, 13vw, 65px); }
    .home-hero-actions { display:grid;grid-template-columns:1fr; }.home-hero-actions .home-btn{width:100%}.home-trust-row{gap:13px 18px}
    .home-control-stage { padding: 10px 0 48px; }
    .home-control-body { grid-template-columns: 42px 1fr; min-height: 430px; }
    .home-control-nav { padding: 12px 5px; }.home-control-brand-mark,.home-control-nav>span{width:30px;height:30px}.home-control-main{padding:13px}.home-control-heading h2{font-size:14px}.home-control-heading small{font-size:7px}.home-metric-grid{grid-template-columns:1.2fr .8fr}.home-metric-card:last-child{display:none}.home-control-lower{grid-template-columns:1fr}.home-events-card{display:none}.home-traffic-card{min-height:170px}.home-control-window{border-radius:13px}.home-control-address{font-size:8px}.home-float-card{min-width:165px;padding:9px 10px}.home-float-backup{right:4px;top:-16px}.home-float-speed{left:4px;bottom:16px}
    .home-domain-wrap { margin-top:-38px; }.home-domain-card{padding:22px 18px;border-radius:13px}.home-domain-form{grid-template-columns:1fr}.home-domain-form button{width:100%}.home-domain-input-icon{top:27px}.home-domain-intro h2{font-size:24px}
    .home-tech-rail { grid-template-columns: 1fr; }.home-tech-rail-label{min-height:78px;padding:0 22px;border-right:0;border-bottom:1px solid #e2e8f0}.home-tech-track{min-height:88px}.home-tech-item{min-width:145px;height:52px}
    .home-speed-number strong { font-size:82px; }.home-speed-lab{padding:16px}.home-lab-result-grid{grid-template-columns:1fr 1fr}.home-lab-result-grid article:last-child{grid-column:1/-1}.home-waterfall-head,.home-waterfall>div{grid-template-columns:65px 1fr 40px}.home-speed-track{height:110px}.home-speed-runner{top:37px}.home-track-line{top:60px}@keyframes speedRunner{0%,8%{left:34px}48%,58%{left:calc(100% - 80px)}92%,100%{left:34px}}
    .home-service-tabs { grid-template-columns: 1fr 1fr; }.home-service-tab{min-height:76px}.home-service-panel{min-height:0;padding:25px;grid-template-columns:1fr}.home-panel-copy h3{font-size:31px}.home-product-preview{margin-top:4px}
    .home-operation-grid{grid-template-columns:1fr}.home-operation-card,.home-operation-card:last-child{grid-column:auto;min-height:450px}.home-infra-grid{gap:42px}.rack-corridor{height:350px;grid-template-columns:1fr 58px 1fr;padding:18px 14px 0;gap:8px}.rack-column>span{min-height:54px;padding:8px}.rack-scene-stats>div{padding:12px 10px}.rack-scene-stats strong{font-size:9px}
    .comparison-row{min-height:74px;padding:12px 16px;grid-template-columns:1fr .85fr;font-size:11px}.comparison-row>*:nth-child(3){display:none}.comparison-head>*:nth-child(3){display:none}
    .home-final{padding:65px 0}.home-final-card{min-height:0;padding:35px 25px;grid-template-columns:1fr}.home-final-actions{flex-direction:row;flex-wrap:wrap}
}

@media (max-width: 480px) {
    .home-hero-badge { font-size:10px; }.home-hero-copy{font-size:16px}.home-trust-item{font-size:11px}.home-control-bar{grid-template-columns:auto 1fr}.home-control-live{display:none}.home-control-main{padding:10px}.home-metric-card{min-height:100px;padding:10px}.home-metric-card>strong{font-size:21px}.home-traffic-card{padding:11px}.home-float-backup{display:none}.home-float-speed{bottom:12px}.home-domain-intro p{font-size:12px}.home-tld-list{gap:9px}.home-service-tabs{grid-template-columns:1fr}.home-service-tab{min-height:68px;grid-template-columns:38px 1fr}.home-service-tab small{display:block}.home-service-panel{padding:20px}.preview-quick-grid{grid-template-columns:1fr}.home-lab-result-grid{grid-template-columns:1fr}.home-lab-result-grid article:last-child{grid-column:auto}.home-waterfall{padding:10px}.home-waterfall-head,.home-waterfall>div{grid-template-columns:55px 1fr 34px;gap:6px}.home-speed-number{align-items:flex-end}.home-speed-number strong{font-size:72px}.home-speed-number span{font-size:14px}.home-operation-card{padding:22px}.home-operation-copy h3{font-size:23px}.rack-corridor{height:300px}.rack-column>span{min-height:45px}.rack-column>span::before{width:22%}.rack-column>span::after{display:none}.home-final-actions{display:grid;grid-template-columns:1fr}.home-final-actions .home-btn{width:100%}
}

@media (prefers-reduced-motion: reduce) {
    .home-reveal { opacity:1; transform:none; transition:none; }
    .home-tech-track, .home-float-card, .home-live-ring::after, .home-speed-runner, .route-summary b i, .latency-wave i, .terminal-cursor, .home-operation-icon.is-live span, .support-typing i, .rack-column>span i { animation:none !important; }
    .home-speed-runner { left:calc(50% - 24px); }
}
