/* Bright, selection-driven on-site pricing layout. */
body[data-page="onsite"] #included { background: #f7f8f6; }
body[data-page="onsite"] #included .onsite-pricing-heading { max-width: 720px; margin: 0 0 38px; text-align: left; }
body[data-page="onsite"] #included .onsite-pricing-heading .section-sub { max-width: 620px; }
.onsite-pricing-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(310px, .82fr); gap: 18px; }
.onsite-pricing-detail, .onsite-pricing-option { border: 1px solid rgba(19, 10, 53, .13); background: #fff; box-shadow: 0 12px 30px rgba(19, 10, 53, .05); }
.onsite-pricing-detail { min-height: 420px; padding: clamp(28px, 4vw, 44px); border-radius: 22px; display: flex; flex-direction: column; justify-content: space-between; }
.onsite-pricing-label { margin: 0 0 10px; color: var(--cyan); font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.onsite-pricing-detail-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.onsite-pricing-detail h3 { margin: 0; color: #130a35; font-size: clamp(25px, 3vw, 34px); }
.onsite-pricing-detail-top p { max-width: 390px; margin: 9px 0 0; color: #645e75; font-size: 15px; line-height: 1.55; }
.onsite-pricing-price { color: #130a35; font-family: 'Poppins', 'Inter', sans-serif; font-size: clamp(28px, 3vw, 38px); font-weight: 700; line-height: 1; text-align: right; white-space: nowrap; }
.onsite-pricing-price span { display: block; margin-top: 6px; color: #777084; font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 600; }
.onsite-pricing-features { display: grid; gap: 15px; margin: 30px 0; transition: opacity .16s ease, transform .16s ease; }
.onsite-pricing-features.is-switching { opacity: .25; transform: translateX(8px); }
.onsite-pricing-features li { display: flex; align-items: center; gap: 13px; color: #454055; font-size: 15px; line-height: 1.35; }
.onsite-pricing-check { width: 22px; height: 22px; flex: 0 0 22px; display: grid; place-items: center; border: 1.5px solid rgba(23, 167, 209, .5); border-radius: 50%; color: var(--cyan); font-size: 14px; font-weight: 800; }
.onsite-pricing-detail .btn { align-self: flex-start; }
.onsite-pricing-options { display: grid; gap: 12px; }
.onsite-pricing-option { width: 100%; min-height: 128px; display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 15px; padding: 22px; border-radius: 17px; color: #130a35; text-align: left; transition: border-color .2s ease, background .2s ease, transform .2s var(--ease), box-shadow .2s ease; }
.onsite-pricing-option:hover { border-color: rgba(23, 167, 209, .55); transform: translateY(-2px); }
.onsite-pricing-option.is-active { border-color: var(--cyan); background: rgba(23, 167, 209, .08); box-shadow: 0 14px 30px rgba(23, 167, 209, .10); }
.onsite-pricing-radio { width: 22px; height: 22px; display: grid; place-items: center; border: 2px solid rgba(19, 10, 53, .24); border-radius: 50%; transition: border-color .2s ease; }
.onsite-pricing-option.is-active .onsite-pricing-radio { border-color: var(--cyan); }
.onsite-pricing-radio span { width: 10px; height: 10px; border-radius: 50%; background: var(--cyan); opacity: 0; transform: scale(.4); transition: opacity .2s ease, transform .2s var(--ease); }
.onsite-pricing-option.is-active .onsite-pricing-radio span { opacity: 1; transform: scale(1); }
.onsite-pricing-option-copy { min-width: 0; }
.onsite-pricing-option-copy b { display: block; font-size: 17px; line-height: 1.2; }
.onsite-pricing-option-copy small { display: block; margin-top: 5px; overflow: hidden; color: #756f83; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.onsite-pricing-option > strong { font-family: 'Poppins', 'Inter', sans-serif; font-size: 22px; white-space: nowrap; }
@media (max-width: 900px) { .onsite-pricing-layout { grid-template-columns: 1fr; } .onsite-pricing-detail { min-height: auto; } }
@media (max-width: 600px) { body[data-page="onsite"] #included .onsite-pricing-heading { margin-bottom: 28px; } .onsite-pricing-detail { padding: 25px 22px; border-radius: 17px; } .onsite-pricing-detail-top { display: block; } .onsite-pricing-price { margin-top: 22px; text-align: left; } .onsite-pricing-features { margin: 26px 0; gap: 13px; } .onsite-pricing-option { min-height: 102px; padding: 18px; gap: 12px; border-radius: 14px; } .onsite-pricing-option-copy b { font-size: 15px; } .onsite-pricing-option > strong { font-size: 18px; } }
@media (prefers-reduced-motion: reduce) { .onsite-pricing-option, .onsite-pricing-radio span, .onsite-pricing-features { transition-duration: .01ms !important; } }