/* Four-step video estimate builder. */
.order-section { background: #fefffc; color: #111; }
.order-builder { max-width: 70rem; margin: 2rem auto 0; border: 1px solid #171717; border-radius: 1.6rem; overflow: hidden; background: #fefffc; }
.order-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 0; padding: 0; list-style: none; border-bottom: 1px solid #171717; }
.order-steps li { padding: 1rem .6rem; text-align: center; font-size: .9rem; font-weight: 800; color: #510e8c; }
.order-steps li + li { border-left: 1px solid rgba(17,17,17,.15); }
.order-steps li.is-active { background: #d4ff3a; color: #111; }
.order-builder form { padding: clamp(1.2rem,3vw,2.4rem); }
.order-step[hidden],.order-navigation [hidden] { display: none !important; }
.order-step h3 { margin: 0 0 1.2rem; color: #111; font-size: clamp(1.55rem,3vw,2.25rem); line-height: 1.1; }
.order-plan-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .8rem; }
.order-plan-options button { min-height: 8rem; display: flex; flex-direction: column; justify-content: center; gap: .5rem; padding: 1.2rem; border: 1px solid #333; border-radius: 1rem; background: #fefffc; color: #111; font: inherit; text-align: left; cursor: pointer; transition: transform 180ms ease,background 180ms ease,border-color 180ms ease; }
.order-plan-options button b { font-size: 1.22rem; line-height: 1.15; }
.order-plan-options button span { color: #510e8c; font-size: .95rem; font-weight: 700; }
.order-plan-options button.is-selected { border: 2px solid #8116e0; background: #d4ff3a; }
.order-plan-options button:hover { transform: translateY(-3px); }
.order-help { margin: 1.1rem 0; color: #454545; font-size: .95rem; line-height: 1.55; }
.order-setup-grid,.order-contact-grid,.order-video-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.order-builder label { display: flex; flex-direction: column; gap: .45rem; min-width: 0; color: #111; font-size: .94rem; font-weight: 800; }
.order-builder :is(input,select):not([type="checkbox"]):not([type="hidden"]) { width: 100%; min-height: 3.1rem; padding: .75rem .9rem; border: 1px solid #8d8d8d; border-radius: .8rem; background: #fefffc; color: #111; font: inherit; }
.order-builder :is(input,select,button):focus-visible { outline: 3px solid #8116e0; outline-offset: 2px; }
.order-builder select { cursor: pointer; }
.order-counter { display: inline-flex; align-items: center; width: fit-content; border: 1px solid #555; border-radius: 999px; overflow: hidden; }
.order-counter button { width: 3rem; height: 3rem; border: 0; background: #d4ff3a; color: #111; font: inherit; font-size: 1.35rem; font-weight: 900; cursor: pointer; }
.order-counter button:disabled { opacity: .35; cursor: not-allowed; }
.order-counter output { min-width: 3rem; text-align: center; font-size: 1.1rem; font-weight: 900; }
.order-checkbox { flex-direction: row !important; align-items: flex-start; margin-top: 1.2rem; font-weight: 600 !important; line-height: 1.45; }
.order-checkbox input { width: 1.15rem; height: 1.15rem; margin-top: .1rem; accent-color: #8116e0; }
.order-video { margin: 0 0 1rem; padding: 1.3rem; border: 1px solid #171717; border-radius: 1rem; }
.order-video[hidden] { display: none !important; }
.order-copy-feedback { min-height: 1.4rem; margin: .6rem 0 .8rem; color: #510e8c; font-size: .94rem; font-weight: 700; line-height: 1.45; }
.order-video-tabs { display: flex; gap: .55rem; margin: 0 0 1rem; padding: .2rem 0 .5rem; overflow-x: auto; scrollbar-width: thin; }
.order-video-tabs button { flex: 0 0 auto; min-width: 6.8rem; min-height: 2.9rem; padding: .55rem .9rem; border: 1px solid #8116e0; border-radius: 999px; background: #fefffc; color: #510e8c; font: inherit; font-size: .95rem; font-weight: 800; cursor: pointer; }
.order-video-tabs button[aria-selected="true"] { background: #d4ff3a; color: #111; border-color: #111; }
.order-video-tabs button:focus-visible { outline: 3px solid #8116e0; outline-offset: 2px; }
.order-video legend { padding: 0 .5rem; color: #8116e0; font-size: 1.2rem; font-weight: 900; }
.order-creator-note { display: flex; flex-direction: column; gap: .4rem; justify-content: center; padding: .8rem .95rem; border: 1px solid #8d8d8d; border-radius: .8rem; background: #f8f9fa; }
.order-creator-note b { color: #8116e0; font-size: 1rem; }
.order-creator-note span { color: #454545; font-size: .9rem; }
.order-video small { color: #454545; font-size: .8rem; font-weight: 500; line-height: 1.4; }
.order-estimate { padding: 1.4rem; border: 1px solid #171717; border-radius: 1rem; background: #f8f9fa; }
.order-estimate-head { display: flex; justify-content: space-between; gap: 1rem; font-size: 1.25rem; }
.order-video-summary { display: grid; gap: .45rem; margin: 1rem 0; padding: 0; list-style: none; }
.order-video-summary li,.order-estimate dl div { display: flex; justify-content: space-between; gap: 1rem; padding: .6rem 0; border-bottom: 1px solid rgba(17,17,17,.13); }
.order-video-summary li span { text-align: right; color: #444; }
.order-estimate dl { margin: 1rem 0 0; }
.order-estimate dt,.order-estimate dd { margin: 0; }
.order-estimate .order-total { padding-top: 1rem; border-top: 2px solid #111; border-bottom: 0; font-size: 1.35rem; font-weight: 900; }
.order-custom-total { color: #8116e0; font-size: 1.55rem; font-weight: 900; }
.order-contact-grid { margin-top: 1.5rem; }
.order-submit { margin-top: 1.2rem; }
.order-status { min-height: 1.4rem; margin: .8rem 0 0; font-weight: 700; }
.order-status.is-error { color: #a41624; }
.order-status.is-success { color: #275d00; }
.order-navigation { display: flex; justify-content: space-between; gap: .7rem; margin-top: 1.6rem; }
.order-navigation [data-order-next] { margin-left: auto; }
@media (max-width: 760px) { .order-plan-options { grid-template-columns: 1fr; } .order-plan-options button { min-height: 5.5rem; } .order-setup-grid,.order-contact-grid,.order-video-grid { grid-template-columns: 1fr; } .order-steps li { font-size: .75rem; padding: .8rem .2rem; } .order-video-summary li,.order-estimate dl div { gap: .4rem; } }
@media (max-width: 470px) { .order-video-summary li { flex-direction: column; } .order-video-summary li span { text-align: left; } .order-estimate-head { flex-direction: column; } }
@media (prefers-reduced-motion: reduce) { .order-plan-options button { transition: none; } }