/* Cloudasys VPS Calc — side-by-side */
:root{
  --ink:#04042c;
  --accent:#9243f9;
}

.vpscalc-hero{
  background:#04042c; color:#fff; padding:36px 0 22px;
}
.vpscalc-hero .h1{
  color:#ff7854;
}
.vpscalc-hero .lead{ color:#e6e6e6; }

.quote-panel{
  background:#fff; border:1px solid #eee; border-radius:12px;
  padding:18px; box-shadow:0 10px 24px rgba(0,0,0,.06);
}
.quote-head{ display:flex; gap:12px; align-items:center; margin-bottom:10px; }
.quote-head img{
  width: 135px;
  height: auto;   /* let the aspect ratio be preserved */
  max-height: 50px;
}


.contact-card{
  background:#fafafa; border:1px solid #eee; border-radius:10px; padding:14px;
}

.grid-2{ display:grid; gap:12px; grid-template-columns: repeat(2, 1fr); }
.grid-2 .span-2{ grid-column: span 2; }

.actions .btn{ margin-right:8px; }

.presets{
  display:grid; grid-template-columns: repeat(3,1fr); gap:12px; margin-bottom:16px;
}
.preset-card{
  background:#fff; border:1px solid #eee; border-radius:12px;
  padding:14px; box-shadow:0 8px 18px rgba(0,0,0,.05); position:relative;
}
.preset-card .badge{
  position:absolute; top:-10px; right:12px;
  background:var(--accent); color:#fff; border-radius:999px; padding:4px 10px; font-size:.78rem;
}
.preset-card.popular{ border:2px solid var(--accent); }

.calc-card{
  background:#fff; border:1px solid #eee; border-radius:12px;
  padding:16px; box-shadow:0 8px 18px rgba(0,0,0,.05);
}
.form-row{ margin-bottom:14px; }
.control-pair{ display:flex; gap:10px; align-items:center; }
.control-pair input[type="range"]{ flex:1; }
.control-pair input[type="number"]{ width:120px; }
.radio-row{ display:flex; gap:16px; flex-wrap:wrap; }

.quote-table{
  width:100%; border-collapse:collapse; margin-top:8px;
}
.quote-table th, .quote-table td{
  padding:8px; border-bottom:1px solid #eee; text-align:right;
}
.quote-table th:nth-child(2), .quote-table td:nth-child(2){ text-align:left; }
.quote-table th:first-child, .quote-table td:first-child{ text-align:center; }

.quote-summary{
  margin-top:10px;
  border-top:2px solid #eaeaea; padding-top:10px;
}
.quote-summary .row{
  display:flex; justify-content:space-between; margin:4px 0;
}
.quote-summary .grand{ font-weight:700; color:#2e7d32; }

.quote-summary .row{
  display: flex;
  justify-content: flex-end;   /* push content right */
  gap: 16px;
  margin: 4px 0;
}

.quote-summary .row div:first-child {
  min-width: 120px;   /* label column */
  text-align: right;
  font-weight: 600;
}
.quote-summary .row div:last-child {
  text-align: right;
}




.text-muted{ color:#666; }

/* Responsive */
@media (max-width: 991px){
  .presets{ grid-template-columns: 1fr; }
  .grid-2{ grid-template-columns: 1fr; }
}