/** Legacy Modern — modern hosting plan presentation, isolated to this order form. */
.dh-hosting-plans {
  --dh-plan-accent: #7c3aed;
  width: calc(100% - 60px); max-width: 1760px; margin: 0 auto; padding: 34px 0 72px;
  color: #171b34; font-family: Inter, Poppins, "Open Sans", system-ui, sans-serif;
}
.dh-hosting-plans .dh-plans-header { margin: 0 auto 25px; text-align: center; }
.dh-hosting-plans .dh-plans-header h1 { margin: 0; color: #12183b; font-size: clamp(34px, 3.2vw, 44px); font-weight: 800; line-height: 1.15; letter-spacing: -1.4px; }
.dh-hosting-plans .dh-plans-header .dh-title-accent { color: #6725ba; }
.dh-hosting-plans .dh-plans-header p { max-width: 760px; margin: 15px auto 18px; color: #62677c; font-size: 14px; line-height: 1.7; }
.dh-hosting-plans .choosecat { margin: 0; }
.dh-hosting-plans .choosecat > button { min-height: 46px; padding: 10px 19px; border: 1px solid #e5e2eb; border-radius: 11px; color: #555b70; background: #fff; box-shadow: 0 7px 20px rgba(35,22,70,.06); font-size: 12px; font-weight: 600; }
.dh-hosting-plans .choosecat > button:hover, .dh-hosting-plans .choosecat.open > button { border-color: #b882e4; color: #6222a9; background: #fff; }
.dh-hosting-plans .choosecat .dropdown-menu { min-width: 240px; padding: 8px; border: 1px solid #e9e3ef; border-radius: 12px; box-shadow: 0 16px 36px rgba(35,20,60,.14); }
.dh-hosting-plans .choosecat .dropdown-menu a { padding: 9px 11px !important; border-radius: 8px; color: #4c4654; font-size: 12px; }
.dh-hosting-plans .choosecat .dropdown-menu a:hover { color: #6420ac; background: #f7f0fd; }
.dh-hosting-plans .dh-currency-chooser { margin: 0 0 22px; text-align: center; }
.dh-hosting-plans .dh-currency-chooser .btn { border-color: #e6e1eb; font-size: 11px; }
.dh-hosting-plans .dh-currency-chooser-bottom { margin: 26px 0 0; }
.dh-hosting-plans .dh-plan-grid { display: grid; grid-template-columns: 1fr; align-items: stretch; gap: 22px; }

.dh-hosting-plans .dh-plan-card {
  min-width: 0; height: 100%; margin: 0; padding: 0; display: flex; flex-direction: column;
  position: relative; overflow: visible; border: 1px solid #e8e6ee; border-radius: 14px; background: #fff;
  box-shadow: 0 8px 30px rgba(33,20,80,.06); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.dh-hosting-plans .dh-plan-card:hover { border-color: var(--dh-plan-accent); background: #fff; box-shadow: 0 14px 38px rgba(64,22,140,.12); transform: translateY(-4px); cursor: pointer; }
.dh-hosting-plans .dh-plan-card-0 { --dh-plan-accent: #7228c8; }
.dh-hosting-plans .dh-plan-card-1 { --dh-plan-accent: #0ba85c; }
.dh-hosting-plans .dh-plan-card-2 { --dh-plan-accent: #1685d8; }
.dh-hosting-plans .dh-plan-card-3 { --dh-plan-accent: #ff7200; }
.dh-hosting-plans .dh-plan-card-4 { --dh-plan-accent: #e91e63; }

.dh-hosting-plans .dh-plan-card-header { min-height: 66px; padding: 12px 20px; display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; border-radius: 13px 13px 0 0; color: #fff; background: var(--dh-plan-accent); }
.dh-hosting-plans .dh-plan-identity { min-width: 0; display: flex; align-items: center; gap: 13px; }
.dh-hosting-plans .dh-plan-icon { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; color: #fff; font-size: 25px; }
.dh-hosting-plans .dh-plan-card .name { margin: 0; color: #fff; font-size: 19px; font-weight: 800; line-height: 1.2; letter-spacing: -.3px; text-transform: uppercase; }
.dh-hosting-plans .dh-plan-card .qty { display: block; margin-top: 4px; color: rgba(255,255,255,.85); font-size: 10px; font-weight: 600; }
.dh-hosting-plans .dh-plan-card-body { padding: 20px; display: flex; flex: 1; flex-direction: column; }
.dh-hosting-plans .dh-plan-card .dh-plan-pricing { min-width: 0; margin: 0 0 18px; float: none; color: var(--dh-plan-accent); text-align: center; font-family: inherit; font-size: 12px; line-height: 1.25; }
.dh-hosting-plans .dh-plan-card .dh-plan-pricing > .pricing { display: inline; float: none; color: var(--dh-plan-accent); font-family: inherit; font-size: 31px; font-weight: 800; line-height: 1.15; }
.dh-hosting-plans .dh-plan-cycle { display: inline; margin-left: 3px; color: #252c44; font-size: 12px; font-weight: 700; }
.dh-hosting-plans .dh-plan-pricing small { display: block; margin-bottom: 3px; color: #62697d; font-size: 12px; font-weight: 500; }

.dh-hosting-plans .dh-plan-highlights { margin-bottom: 20px; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
.dh-hosting-plans .dh-plan-highlight { min-width: 0; min-height: 86px; margin: 0; padding: 15px 12px; display: flex; align-items: center; justify-content: center; flex-direction: column; float: none; border: 0; border-radius: 9px; color: var(--dh-plan-accent); background: #f8f5fb; text-align: center; font-size: 15px; line-height: 1.4; }
.dh-hosting-plans .dh-plan-highlight:last-child:nth-child(odd) { grid-column: 1 / -1; }
.dh-hosting-plans .dh-plan-card-1 .dh-plan-highlight { background: #effaf4; }
.dh-hosting-plans .dh-plan-card-2 .dh-plan-highlight { background: #eef7fd; }
.dh-hosting-plans .dh-plan-card-3 .dh-plan-highlight { background: #fff5ec; }
.dh-hosting-plans .dh-plan-card-4 .dh-plan-highlight { background: #fff0f5; }
.dh-hosting-plans .dh-plan-highlight .feature { margin-bottom: 7px; color: #4f566d; font-size: 14px; font-weight: 700; line-height: 1.35; text-align: center; }
.dh-hosting-plans .dh-plan-highlight strong { color: var(--dh-plan-accent); font-size: 16px; font-weight: 800; line-height: 1.35; text-align: center; }

.dh-hosting-plans .dh-plan-description { margin: 0; overflow: visible; color: #222c42; font-size: 13px; font-weight: 500; line-height: 1.5; }
.dh-hosting-plans .dh-plan-feature-list { display: flex; overflow: visible; flex-direction: column; gap: 9px; }
.dh-hosting-plans .dh-plan-feature-row { display: flex; align-items: flex-start; gap: 10px; }
.dh-hosting-plans .dh-plan-feature-row > i { width: 16px; margin-top: 3px; flex: 0 0 16px; color: var(--dh-plan-accent); text-align: center; font-size: 12px; }
.dh-hosting-plans .dh-plan-feature-row strong { font-weight: 700; }
.dh-hosting-plans .dh-plan-payment { margin-top: 18px; padding-top: 16px; border-top: 1px solid #eeebf1; color: #5e667a; font-size: 12px; font-weight: 600; line-height: 1.5; }
.dh-hosting-plans .dh-plan-action { margin-top: auto; padding-top: 20px; }
.dh-hosting-plans .dh-plan-button { width: 100%; min-height: 48px; padding: 11px 16px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 8px; color: #fff; background: var(--dh-plan-accent); box-shadow: 0 9px 20px rgba(60,20,100,.15); font-size: 14px !important; font-weight: 800; text-decoration: none; transition: transform .2s ease, filter .2s ease, box-shadow .2s ease; }
.dh-hosting-plans .dh-plan-button:hover, .dh-hosting-plans .dh-plan-button:focus { color: #fff; filter: brightness(.94); box-shadow: 0 12px 23px rgba(60,20,100,.22); text-decoration: none; transform: translateY(-1px); }

@media (min-width: 700px) { .dh-hosting-plans .dh-plan-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }

@media (max-width: 767px) {
  .dh-hosting-plans { width: calc(100% - 28px); padding: 24px 0 50px; }
  .dh-hosting-plans .dh-plans-header h1 { font-size: 31px; letter-spacing: -.8px; }
  .dh-hosting-plans .dh-plans-header p { font-size: 12px; }
  .dh-hosting-plans .dh-plan-grid { gap: 17px; }
  .dh-hosting-plans .dh-plan-card { border-radius: 14px; }
  .dh-hosting-plans .dh-plan-card-header { gap: 10px; }
  .dh-hosting-plans .dh-plan-card .name { font-size: 19px; }
  .dh-hosting-plans .dh-plan-icon { width: 34px; height: 34px; flex-basis: 34px; }
  .dh-hosting-plans .dh-plan-card .dh-plan-pricing > .pricing { font-size: 28px; }
  .dh-hosting-plans .dh-plan-highlights { gap: 8px; }
  .dh-hosting-plans .dh-plan-highlight { padding: 11px 9px; }
}