/* HeberPage Frontend Module 03 — Hosting page */
.hp-product-hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(135deg,#06183b,#0b3979 65%,#0872d3)}
.hp-product-bg{position:absolute;inset:0;background:radial-gradient(circle at 82% 24%,rgba(52,218,246,.22),transparent 27%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:auto,48px 48px,48px 48px}
.hp-product-hero-grid{position:relative;min-height:610px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:75px;padding-block:75px}
.hp-product-hero h1{font-size:59px;line-height:1.04;letter-spacing:-3px;margin:0 0 22px}
.hp-product-hero p{font-size:18px;line-height:1.72;color:#c5d8f3;max-width:650px}
.hp-product-actions{display:flex;gap:12px;margin-top:28px}
.hp-product-trust{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px;color:#d4e5f9;font-size:12px}
.hp-product-panel{padding:28px;border-radius:27px;background:linear-gradient(150deg,#081a37,#0c3269);border:1px solid rgba(91,215,255,.38);box-shadow:0 35px 75px rgba(0,0,0,.34)}
.hp-product-panel-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:17px;border-bottom:1px solid rgba(255,255,255,.12);font-size:12px;color:#8edfff;font-weight:850}
.hp-product-panel-top i{width:9px;height:9px;border-radius:50%;background:#28dc8a;box-shadow:0 0 13px #28dc8a}
.hp-speed-meter{display:flex;align-items:center;gap:22px;padding:28px 0}
.hp-speed-ring{width:120px;height:120px;border-radius:50%;display:grid;place-content:center;text-align:center;background:conic-gradient(#34d6ef 0 98%,rgba(255,255,255,.12) 98%);position:relative}
.hp-speed-ring:before{content:"";position:absolute;inset:10px;border-radius:50%;background:#0a2855}
.hp-speed-ring strong,.hp-speed-ring span{position:relative;z-index:1}
.hp-speed-ring strong{font-size:34px}
.hp-speed-ring span{font-size:11px;color:#9cc7ed}
.hp-speed-meter>div:last-child b,.hp-speed-meter>div:last-child small{display:block}
.hp-speed-meter>div:last-child b{font-size:18px}
.hp-speed-meter>div:last-child small{font-size:12px;line-height:1.6;color:#a9c7e7;margin-top:6px}
.hp-hosting-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hp-hosting-metrics div{padding:16px;border-radius:14px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1)}
.hp-hosting-metrics b,.hp-hosting-metrics span{display:block}
.hp-hosting-metrics b{font-size:17px}
.hp-hosting-metrics span{font-size:10px;color:#a9c9e9;margin-top:4px}

.hp-product-nav{position:sticky;top:78px;z-index:30;background:#fff;border-bottom:1px solid var(--hp-line)}
.hp-product-nav .hp-container{display:flex;gap:28px;overflow-x:auto}
.hp-product-nav a{padding:17px 0;color:#5d6e87;font-size:13px;font-weight:800;white-space:nowrap}
.hp-product-nav a:hover{color:var(--hp-blue)}

.hp-hosting-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.hp-hosting-plan{position:relative;padding:32px;border:1px solid var(--hp-line);border-radius:23px;background:#fff;box-shadow:0 12px 36px rgba(13,52,96,.07)}
.hp-hosting-plan.hp-featured{border:2px solid var(--hp-blue);transform:translateY(-12px);box-shadow:0 25px 55px rgba(8,104,232,.16)}
.hp-hosting-plan h3{font-size:25px;margin:20px 0 8px}
.hp-hosting-plan>p{color:var(--hp-muted);line-height:1.6;margin:0}
.hp-hosting-plan ul{list-style:none;padding:24px 0 0;margin:24px 0 0;border-top:1px solid var(--hp-line);display:grid;gap:13px;color:#50617b;font-size:14px}
.hp-hosting-plan li:before{content:"✓";color:var(--hp-green);font-weight:900;margin-right:9px}
.hp-plan-note{display:flex;justify-content:center;gap:35px;flex-wrap:wrap;margin-top:35px;color:#61738c;font-size:12px}

.hp-feature-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:45px}
.hp-feature-cards article{padding:28px;border:1px solid var(--hp-line);border-radius:19px;background:#fff}
.hp-feature-cards article>span{width:48px;height:48px;border-radius:13px;background:#eaf4ff;display:grid;place-items:center;font-size:23px}
.hp-feature-cards h3{font-size:18px;margin:18px 0 9px}
.hp-feature-cards p{color:var(--hp-muted);line-height:1.65;font-size:14px;margin:0}

.hp-comparison-wrap{overflow-x:auto;margin-top:42px;border:1px solid var(--hp-line);border-radius:20px;box-shadow:0 14px 35px rgba(13,52,96,.06)}
.hp-comparison-table{width:100%;border-collapse:collapse;min-width:760px;background:#fff}
.hp-comparison-table th,.hp-comparison-table td{padding:18px 20px;border-bottom:1px solid var(--hp-line);text-align:center;font-size:14px}
.hp-comparison-table th:first-child,.hp-comparison-table td:first-child{text-align:left}
.hp-comparison-table thead th{background:#f6f9fd;color:var(--hp-navy);font-size:13px}
.hp-comparison-table .is-highlighted{background:#eef6ff;color:var(--hp-blue);font-weight:800}
.hp-comparison-table tr:last-child td{border-bottom:0}

.hp-migration-section{color:#fff;background:linear-gradient(135deg,#061a3f,#0b3978)}
.hp-migration-visual{display:grid;grid-template-columns:1fr 130px 1fr;align-items:center;gap:16px;padding:28px;border-radius:25px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14)}
.hp-migration-node{min-height:150px;padding:22px;border-radius:18px;display:grid;place-content:center;text-align:center;border:1px solid rgba(255,255,255,.16)}
.hp-migration-node span,.hp-migration-node b{display:block}
.hp-migration-node span{font-size:11px;color:#a9c8e8}
.hp-migration-node b{font-size:18px;margin-top:8px}
.hp-node-old{background:rgba(255,255,255,.05)}
.hp-node-new{background:linear-gradient(145deg,rgba(36,208,234,.2),rgba(8,105,232,.22))}
.hp-migration-flow{text-align:center}
.hp-migration-flow i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#4bddf5;margin:0 3px;animation:hpFlow 1.5s infinite}
.hp-migration-flow i:nth-child(2){animation-delay:.2s}
.hp-migration-flow i:nth-child(3){animation-delay:.4s}
.hp-migration-flow strong{display:block;font-size:10px;color:#b8d7f4;margin-top:11px}
@keyframes hpFlow{50%{opacity:.25;transform:translateX(5px)}}

@media(max-width:940px){
  .hp-product-hero-grid,.hp-migration-visual{grid-template-columns:1fr}
  .hp-product-hero-grid{padding-block:65px}
  .hp-hosting-plans,.hp-feature-cards{grid-template-columns:1fr}
  .hp-hosting-plan.hp-featured{transform:none}
  .hp-migration-flow{transform:rotate(90deg);padding:8px}
}
@media(max-width:650px){
  .hp-product-hero h1{font-size:43px;letter-spacing:-2px}
  .hp-product-hero p{font-size:16px}
  .hp-product-actions{flex-direction:column}
  .hp-product-trust{display:grid;grid-template-columns:1fr 1fr}
  .hp-product-nav{top:68px}
  .hp-hosting-metrics{grid-template-columns:1fr}
  .hp-speed-meter{align-items:flex-start;flex-direction:column}
  .hp-feature-cards{grid-template-columns:1fr}
}