/* ============================================================
   NOVAHOSTCLOUD — PUBLIC HOMEPAGE (Phase 1)
   Same brand language as the Nova Cloud Console:
   deep navy / near-black, controlled purple+blue accents.
   Loaded AFTER the existing landing stylesheet so the header,
   footer and auth modal keep their current styling untouched.
   ============================================================ */

.nh-wrap{width:min(1560px,100% - 64px);margin:0 auto}
@media(max-width:600px){.nh-wrap{width:min(1200px,100% - 26px)}}

.nh-sec{padding:64px 0}
.nh-sec-tight{padding:36px 0}
.nh-h2{margin:0 0 10px;font:800 clamp(23px,3vw,34px)/1.14 inherit;letter-spacing:-.8px;color:#eaf0ff}
.nh-lead{margin:0;color:#8590b4;font-size:14.5px;max-width:620px;line-height:1.7}
.nh-kicker{display:inline-block;font-size:10px;letter-spacing:1.6px;font-weight:900;color:#9d7dff;margin-bottom:10px}
.nh-center{text-align:center}
.nh-center .nh-lead{margin-left:auto;margin-right:auto}
.nh-grad{background:linear-gradient(100deg,#9d7dff,#6ba4ff);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------------- hero ---------------- */
.nh-hero{padding:56px 0 24px}
.nh-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.85fr);gap:38px;align-items:start}
.nh-loc{
  display:inline-flex;align-items:center;gap:8px;padding:6px 13px;border-radius:999px;
  border:1px solid #1f6b52;background:#0c2b23;color:#34d399;font-size:11.5px;font-weight:800;margin-bottom:20px
}
.nh-h1{margin:0 0 16px;font:800 clamp(34px,6vw,60px)/1.03 inherit;letter-spacing:-2.2px;color:#fff}
.nh-hero-sub{margin:0 0 26px;color:#b7c2e0;font-size:16px;line-height:1.65;max-width:520px}
.nh-hero-points{display:flex;gap:26px;flex-wrap:wrap;margin-bottom:28px}
.nh-point{display:flex;gap:11px;align-items:flex-start;max-width:210px}
.nh-point-ico{
  width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;font-size:15px;
  background:rgba(124,92,255,.13);border:1px solid rgba(124,92,255,.3)
}
.nh-point b{display:block;font-size:13px;color:#eaf0ff;font-weight:700}
.nh-point span{display:block;font-size:11.5px;color:#8590b4;line-height:1.5;margin-top:2px}
.nh-cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.nh-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 25px;border-radius:12px;
  font-size:14px;font-weight:700;border:1px solid #222c52;background:#101733;color:#eaf0ff;cursor:pointer;
  transition:transform .14s,border-color .14s,background .14s;min-height:48px
}
.nh-btn:hover{transform:translateY(-2px);border-color:#7c5cff}
.nh-btn-primary{background:linear-gradient(135deg,#7c5cff,#4d8bff);border-color:transparent;color:#fff;box-shadow:0 12px 30px rgba(124,92,255,.32)}
.nh-btn-primary:hover{background:linear-gradient(135deg,#8b6dff,#5d97ff)}
.nh-trustline{display:flex;gap:8px 18px;flex-wrap:wrap;color:#65709a;font-size:12px;font-weight:600}
.nh-trustline span{display:inline-flex;align-items:center;gap:7px}
.nh-trustline i{font-style:normal;color:#34d399}

/* hero price card */
.nh-price-card{
  border:1px solid #222c52;border-radius:22px;padding:24px;
  background:linear-gradient(165deg,rgba(21,29,61,.96),rgba(13,19,41,.96));
  box-shadow:0 22px 60px rgba(3,6,18,.55)
}
.nh-price-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px}
.nh-price-head h3{margin:0;font-size:19px;font-weight:800;letter-spacing:-.4px;color:#fff}
.nh-tag{
  padding:4px 11px;border-radius:999px;font-size:9.5px;font-weight:900;letter-spacing:1px;
  border:1px solid rgba(124,92,255,.42);background:rgba(124,92,255,.14);color:#b49dff
}
.nh-tag-monthly{border-color:rgba(77,139,255,.4);background:rgba(77,139,255,.13);color:#8fb6ff}
.nh-tag-proxy{border-color:#1f6b52;background:#0c2b23;color:#34d399}
.nh-price-note{margin:0 0 18px;color:#8590b4;font-size:12.5px}
.nh-price-label{font-size:10.5px;letter-spacing:1.2px;font-weight:900;color:#65709a}
.nh-price-value{display:flex;align-items:flex-end;gap:7px;margin:5px 0 20px}
.nh-price-value b{font-size:40px;font-weight:800;letter-spacing:-2px;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.nh-price-value span{color:#8590b4;font-size:14px;font-weight:600;padding-bottom:4px}
.nh-price-fallback{
  display:inline-flex;align-items:center;gap:8px;margin:5px 0 20px;padding:11px 15px;border-radius:12px;
  border:1px solid #222c52;background:#0d1329;color:#b7c2e0;font-size:14px;font-weight:700
}
.nh-flist{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:9px}
.nh-flist li{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:#b7c2e0;font-weight:600}
.nh-flist i{font-style:normal;color:#9d7dff;flex:none;font-weight:800}
.nh-price-link{display:inline-flex;align-items:center;gap:8px;color:#b49dff;font-size:13.5px;font-weight:800;padding-top:16px;border-top:1px solid #1a2244;width:100%}
.nh-price-link:hover{color:#cbbcff}

/* ---------------- product cards ---------------- */
.nh-products{display:grid;grid-template-columns:repeat(auto-fit,minmax(292px,1fr));gap:18px}
.nh-prod{
  display:flex;flex-direction:column;border:1px solid #1a2244;border-radius:20px;padding:23px;
  background:linear-gradient(165deg,rgba(16,23,51,.92),rgba(10,16,36,.92));transition:transform .16s,border-color .16s
}
.nh-prod:hover{transform:translateY(-3px);border-color:#7c5cff}
.nh-prod-primary{border-color:rgba(124,92,255,.4);background:linear-gradient(165deg,rgba(28,24,66,.94),rgba(12,17,40,.94))}
.nh-prod-ico{
  width:52px;height:52px;border-radius:15px;display:grid;place-items:center;font-size:24px;margin-bottom:16px;
  background:rgba(124,92,255,.13);border:1px solid rgba(124,92,255,.3)
}
.nh-prod-ico.is-blue{background:rgba(77,139,255,.12);border-color:rgba(77,139,255,.32)}
.nh-prod-ico.is-green{background:#0c2b23;border-color:#1f6b52}
.nh-prod-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.nh-prod h3{margin:0 0 5px;font-size:19px;font-weight:800;letter-spacing:-.4px;color:#fff}
.nh-prod-sub{margin:0 0 18px;color:#8590b4;font-size:13px}
.nh-dc-badge{display:inline-flex;align-items:center;align-self:flex-start;gap:6px;margin:-4px 0 16px;padding:5px 9px;border:1px solid rgba(77,139,255,.32);border-radius:999px;background:rgba(77,139,255,.1);color:#b9d2ff;font-size:10px;font-weight:800;letter-spacing:.35px}
.nh-proxy-flags{display:flex;align-items:center;gap:7px;flex-wrap:wrap;min-height:28px;margin:-4px 0 14px;font-size:20px}
.nh-proxy-flags span{line-height:1}
.nh-proxy-flags small{color:#7fd7ff;font-size:9px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.nh-prod .nh-flist{flex:1}
.nh-prod-cta{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;color:#b49dff;margin-top:4px}
.nh-prod-cta.is-blue{color:#8fb6ff}
.nh-prod-cta.is-green{color:#34d399}
.nh-location-dc{align-items:center}.nh-location-dc span{display:inline-flex;align-items:center;gap:7px;flex-wrap:wrap}.nh-location-dc b{display:inline-flex;align-items:center;padding:3px 6px;border:1px solid rgba(77,139,255,.32);border-radius:999px;background:rgba(77,139,255,.1);color:#b9d2ff;font-size:9px;letter-spacing:.35px}

/* ---------------- trust strip ---------------- */
.nh-strip{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(214px,1fr));gap:1px;
  border:1px solid #1a2244;border-radius:18px;overflow:hidden;background:#1a2244
}
.nh-strip > div{display:flex;gap:13px;align-items:flex-start;padding:20px;background:#0b1024}
.nh-strip-ico{
  width:36px;height:36px;flex:none;border-radius:11px;display:grid;place-items:center;font-size:16px;
  background:rgba(124,92,255,.12);border:1px solid rgba(124,92,255,.28)
}
.nh-strip b{display:block;font-size:13px;color:#eaf0ff;font-weight:700;margin-bottom:3px}
.nh-strip span{display:block;font-size:12px;color:#8590b4;line-height:1.55}

/* ---------------- how it works ---------------- */
.nh-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(184px,1fr));gap:16px;margin-top:34px}
.nh-step{border:1px solid #1a2244;border-radius:18px;padding:20px;background:rgba(13,19,41,.85);text-align:center}
.nh-step-num{
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;margin:0 auto 13px;
  background:linear-gradient(135deg,#7c5cff,#4d8bff);color:#fff;font-size:13px;font-weight:900
}
.nh-step b{display:block;font-size:14px;color:#eaf0ff;font-weight:700;margin-bottom:5px}
.nh-step span{display:block;font-size:12px;color:#8590b4;line-height:1.6}

/* ---------------- why choose ---------------- */
.nh-why{display:grid;grid-template-columns:repeat(auto-fit,minmax(252px,1fr));gap:14px;margin-top:32px}
.nh-why div{
  display:flex;gap:11px;align-items:flex-start;padding:17px;border-radius:15px;
  border:1px solid #1a2244;background:rgba(13,19,41,.8);font-size:13.5px;color:#b7c2e0;font-weight:600
}
.nh-why i{font-style:normal;color:#34d399;flex:none;font-weight:800}

/* ---------------- payments ---------------- */
.nh-pay{
  display:flex;justify-content:space-between;align-items:center;gap:26px;flex-wrap:wrap;
  border:1px solid #1a2244;border-radius:20px;padding:26px 30px;background:rgba(13,19,41,.85)
}
.nh-pay h3{margin:0 0 6px;font-size:17px;font-weight:800;color:#fff}
.nh-pay p{margin:0;color:#8590b4;font-size:13px;max-width:430px;line-height:1.65}
.nh-pay-pills{display:flex;gap:9px;flex-wrap:wrap}
.nh-pay-pills span{
  padding:9px 15px;border-radius:10px;border:1px solid #222c52;background:#101733;
  color:#b7c2e0;font-size:11.5px;font-weight:800;letter-spacing:.5px
}

/* ---------------- hero: 3-column (copy | server visual | price card) ---------------- */
.nh-hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,1.05fr) minmax(300px,.82fr);gap:30px;align-items:center}
.nh-hero-visual{position:relative;min-height:520px;display:grid;place-items:center}
.hero-visual-glow{position:absolute;inset:4% 0;background:radial-gradient(ellipse at 50% 44%,rgba(124,92,255,.24),rgba(77,139,255,.09) 55%,transparent 76%);filter:blur(7px);pointer-events:none}
.nh-hero-visual .server-scene{width:100%;height:520px;margin:0}
.nova-bolt{position:absolute;z-index:6;top:0;left:50%;transform:translateX(-50%);color:#b49dff;filter:drop-shadow(0 0 16px rgba(124,92,255,.9));animation:boltFloat 3.4s ease-in-out infinite}
@keyframes boltFloat{50%{transform:translateX(-50%) translateY(-8px)}}

/* premium icon rendering (SVG, consistent sizing, colored accents — no emoji) */
.ic{display:block;flex:none}
.nh-point-ico{color:#b49dff;background:linear-gradient(145deg,rgba(124,92,255,.2),rgba(124,92,255,.08));border-color:rgba(124,92,255,.42);box-shadow:0 0 22px rgba(124,92,255,.14)}
.nh-point-ico.is-blue{color:#7fb4ff;background:linear-gradient(145deg,rgba(77,139,255,.2),rgba(77,139,255,.07));border-color:rgba(77,139,255,.45);box-shadow:0 0 22px rgba(77,139,255,.14)}
.nh-point-ico.is-green{color:#4eda9b;background:linear-gradient(145deg,rgba(52,211,153,.18),rgba(52,211,153,.06));border-color:rgba(52,211,153,.42);box-shadow:0 0 22px rgba(52,211,153,.13)}
.nh-point-ico{width:40px;height:40px;border-radius:12px}
.nh-prod-ico{color:#b49dff;background:linear-gradient(145deg,rgba(124,92,255,.2),rgba(124,92,255,.07));border-color:rgba(124,92,255,.45);box-shadow:0 0 26px rgba(124,92,255,.15)}
.nh-prod-ico.is-blue{color:#7fb4ff;background:linear-gradient(145deg,rgba(77,139,255,.2),rgba(77,139,255,.07));border-color:rgba(77,139,255,.45);box-shadow:0 0 26px rgba(77,139,255,.15)}
.nh-prod-ico.is-green{color:#4eda9b;background:linear-gradient(145deg,rgba(52,211,153,.18),rgba(52,211,153,.06));border-color:rgba(52,211,153,.42);box-shadow:0 0 26px rgba(52,211,153,.14)}
.nh-prod-ico{width:58px;height:58px;border-radius:17px}
.nh-strip-ico{color:#7fd7ff;background:rgba(77,190,255,.1);border-color:rgba(77,190,255,.34);box-shadow:0 0 18px rgba(77,190,255,.1)}

/* how it works: larger circular steps + connecting arrows */
.nh-steps{grid-template-columns:repeat(5,1fr);gap:8px;position:relative}
.nh-step{padding:22px 12px;position:relative}
.nh-step-num{width:60px;height:60px;font-size:17px;border:1px solid rgba(124,92,255,.45);box-shadow:0 0 0 8px rgba(124,92,255,.06),0 12px 28px rgba(124,92,255,.22)}
.nh-step:not(:last-child):after{content:"";position:absolute;top:29px;right:-7px;width:15px;height:15px;border-top:2px solid rgba(124,92,255,.6);border-right:2px solid rgba(124,92,255,.6);transform:rotate(45deg);z-index:2}

/* payments + trust panel polish */
.nh-pay{border-color:rgba(124,92,255,.28);background:linear-gradient(165deg,rgba(20,26,56,.9),rgba(11,16,36,.92))}
.nh-pay h3{display:flex;align-items:center;gap:9px}

/* ---------------- responsive ---------------- */
@media(max-width:960px){
  .nh-hero-grid{grid-template-columns:1fr;gap:24px}
  .nh-hero-visual{min-height:430px;order:2}
  .nh-hero-visual .server-scene{height:430px}
  .rack{top:34px;transform:translateX(-50%) scale(.8) rotateY(-7deg) rotateX(3deg)}
  .nh-price-card{order:3}
  .nh-hero{padding:32px 0 12px}
  .nh-sec{padding:44px 0}
  .nh-hero-sub{max-width:none}
  .nh-steps{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
  .nh-step:not(:last-child):after{display:none}
}
@media(max-width:600px){
  .nh-h1{letter-spacing:-1.4px}
  .nh-hero-points{gap:16px;flex-direction:column}
  .nh-point{max-width:none}
  .nh-cta-row .nh-btn{flex:1;min-width:0}
  .nh-price-value b{font-size:34px}
  .nh-pay{padding:22px}
  .nh-sec{padding:36px 0}
  .nh-hero-visual{min-height:380px}
  .nh-hero-visual .server-scene{height:380px;transform:scale(.82);transform-origin:center top;margin-bottom:-56px}
  .rack{top:26px;transform:translateX(-50%) scale(.72) rotateY(-7deg) rotateX(3deg)}
  .nh-hero-visual{order:2}
}
@media(max-width:600px){
  .nh-h1{letter-spacing:-1.4px}
  .nh-hero-points{gap:16px;flex-direction:column}
  .nh-point{max-width:none}
  .nh-cta-row .nh-btn{flex:1;min-width:0}
  .nh-price-value b{font-size:34px}
  .nh-pay{padding:22px}
  .nh-sec{padding:36px 0}
}

/* ---- 2026-08-31 fixes: overflow containment + icon accent specificity ---- */
/* Ambient orbs animate past the 390px viewport -> clip at the root (sticky-safe: clip, not scroll container) */
html{overflow-x:hidden}
@supports (overflow-x:clip){ html{overflow-x:clip} }
/* Icon glyph colors — higher specificity so the muted content rule (.nh-point span/.nh-strip span)
   can no longer override the themed accents (server=purple, shield=blue, chat=green, strip=cyan). */
.nh-hero-points .nh-point-ico{color:#b49dff}
.nh-hero-points .nh-point-ico.is-blue{color:#7fb4ff}
.nh-hero-points .nh-point-ico.is-green{color:#4eda9b}
.nh-strip .nh-strip-ico{color:#7fd7ff}
.nh-products .nh-prod-ico{color:#b49dff}
.nh-products .nh-prod-ico.is-blue{color:#7fb4ff}
.nh-products .nh-prod-ico.is-green{color:#4eda9b}

/* ============================================================
   2026-08-31 targeted fix: hero scene callouts + premium rack
   ============================================================ */
/* Callouts: NORMAL-FLOW row under the rack — zero overlap by construction.
   Desktop: 3 chips with breathing room · 768px: reflow · 390px: stack. */
.scene-cards{position:static;left:auto;right:auto;bottom:auto;width:100%;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:stretch;z-index:5}
.server-scene .scene-card{position:static;margin:0;flex:1 1 0;min-width:96px;max-width:158px;padding:10px 13px;border-radius:12px;font-size:10px;text-align:left;box-shadow:0 14px 34px rgba(0,0,0,.3)}
.server-scene .scene-card b{font-size:13.5px;margin-top:3px}
.scene-card.one{animation-delay:0s}
.scene-card.two{animation-delay:-1.4s}
.scene-card.three{animation-delay:-2.5s}
/* Premium rack: dark chassis, purple + electric-blue LED lighting, glow */
.rack{border:1px solid rgba(151,193,255,.3);box-shadow:0 0 55px rgba(124,92,255,.27),0 0 130px rgba(77,139,255,.15),0 50px 95px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.09)}
/* Rack in normal flow (flex column child) — no absolute offsets to collide */
.server-scene .rack{position:static;top:auto;left:auto;margin:0;transform:rotateY(-7deg) rotateX(3deg) scale(.92)}
.server-unit{height:52px;margin:10px 0;border:1px solid rgba(142,184,255,.2);background:linear-gradient(180deg,#14203e,#0a1226);box-shadow:inset 0 1px rgba(255,255,255,.04),0 0 18px rgba(77,139,255,.09)}
.server-unit::before{content:"";flex:none;width:3px;align-self:stretch;margin-right:-4px;border-radius:4px;background:linear-gradient(180deg,#8b5cf6,#3b82f6);box-shadow:0 0 12px rgba(124,92,255,.75)}
.server-light{width:6px;height:6px;box-shadow:0 0 12px currentColor}
.server-light.green{box-shadow:0 0 12px var(--green)}
.server-port{border-color:#4a5f86;box-shadow:inset 0 0 8px #050815,0 0 8px rgba(77,139,255,.35)}
.rack-label{color:#9fb2d6;letter-spacing:.16em}
.nova-bolt{filter:drop-shadow(0 0 20px rgba(124,92,255,.95))}
@media(max-width:600px){
  .scene-cards{gap:8px;bottom:0}
  .server-scene .scene-card{min-width:0;max-width:none;flex:1 1 calc(50% - 8px);padding:9px 12px;font-size:9.5px}
  .server-scene .scene-card b{font-size:13px}
}

/* ============================================================
   2026-08-31: Delhi Cloud VPS card = reference layout
   (info left ~52% · glowing rack right ~48% · integrated)
   ============================================================ */
.nh-hero-grid{grid-template-columns:minmax(0,1fr) minmax(380px,600px);gap:56px;align-items:center}

.nh-price-card{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-rows:auto auto;gap:16px 20px;align-items:center;border:1px solid rgba(151,193,255,.28);border-radius:20px;background:linear-gradient(165deg,rgba(24,32,66,.92),rgba(9,13,30,.97));box-shadow:0 30px 70px rgba(0,0,0,.5),0 0 60px rgba(124,92,255,.12);padding:26px 26px 22px}
.card-info{grid-column:1;grid-row:1;min-width:0}
.card-rack{grid-column:2;grid-row:1 / span 2;align-self:center;justify-self:center;min-width:0;width:100%;height:310px}
.card-rack .rack{transform:rotateY(-7deg) rotateX(3deg) scale(.68)}
.card-rack .server-scene{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding-top:2px}
.card-rack .nova-bolt{position:static;color:#eaf4ff;background:rgba(59,130,246,.18);border:1px solid rgba(96,165,250,.6);border-radius:12px;padding:7px;box-shadow:0 0 22px rgba(59,130,246,.55);animation:boltFloat 3.4s ease-in-out infinite}
.card-rack .rack{position:static;margin:0;transform:rotateY(-7deg) rotateX(3deg) scale(.62)}
.card-rack .rack-label{display:none}
.card-rack .scene-orb{position:absolute;top:12%;left:50%;transform:translateX(-50%);width:230px;height:230px;opacity:.5}
.card-rack .scene-floor{position:absolute;bottom:2px;left:50%;transform:translateX(-50%);width:88%;height:54px}
.nh-price-link{grid-column:1;grid-row:2;justify-self:start;align-self:end}
/* purple check chips (reference) */
.nh-flist i{font-style:normal;font-weight:800;color:#b49dff;background:rgba(124,92,255,.16);border:1px solid rgba(124,92,255,.4);border-radius:6px;width:18px;height:18px;flex:none;display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;margin-top:1px;box-shadow:0 0 12px rgba(124,92,255,.18)}

@media(max-width:960px){
  .nh-hero-grid{grid-template-columns:1fr;gap:24px}
  .nh-price-card{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:14px}
  .card-info{grid-column:auto;grid-row:auto}
  .card-rack{grid-column:auto;grid-row:auto;height:260px}
  .card-rack .rack{transform:rotateY(-7deg) rotateX(3deg) scale(.62)}
  .nh-price-link{grid-column:auto;grid-row:auto;justify-self:start;align-self:auto}
}
@media(max-width:600px){
  .nh-price-card{padding:20px 18px 18px;border-radius:16px}
  .card-rack{height:210px}
  .card-rack .rack{transform:rotateY(-7deg) rotateX(3deg) scale(.5)}
  .nh-price-value b{font-size:34px}
}

/* ===== final geometry hardening (2026-08-31) ===== */
/* rackFloat animates transform and overrides the scale (unstable geometry) — freeze it */
.rack{animation:none}
/* Scene = flex COLUMN: rack (in flow) + callout row below — overlap impossible by
   construction at every width (no absolute offsets, no bottom anchoring). */
.nh-hero-visual .server-scene{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:64px;width:100%;height:520px}
@media(max-width:960px){
  .nh-hero-visual .server-scene{height:430px}
  .server-scene .rack{transform:rotateY(-7deg) rotateX(3deg) scale(.78)}
  .scene-cards{gap:8px}
}
@media(max-width:600px){
  .nh-hero-visual .server-scene{height:auto;transform:none;transform-origin:initial;margin:0;padding-top:58px}
  .server-scene .rack{transform:rotateY(-7deg) rotateX(3deg) scale(.7)}
  /* chips: freeze float animation so the wrap gap can't jitter into overlap */
  .server-scene .scene-card{animation:none}
}