/* CarFlow mobile-first six-step seller journey – 2026-11-05 */
:root{--cf-blue:#0679e9;--cf-cyan:#04b6ff;--cf-deep:#102548;--cf-soft:#edf8ff;--cf-border:#dce8f4}
body.carflowWizardReady{background:#f4f9fd;color:var(--cf-deep)}
body.carflowWizardReady .shell{max-width:800px}
body.carflowWizardReady .journeyTitle,body.carflowWizardReady .steps{display:none!important}
body.carflowWizardReady #form:not(.wizardActive){display:none!important}
body.carflowWizardActive .launchHero,body.carflowWizardActive .launchHero~.hero{display:none!important}
body.carflowWizardActive .shell{max-width:790px}
body.carflowWizardActive #form{display:block}
body.carflowWizardActive #form>.wizardSlide[hidden]{display:none!important}
body.carflowWizardActive .wizardSlide{border:1px solid #dae6f4;border-radius:27px;background:#fff;box-shadow:0 15px 47px rgba(6,60,100,.07);padding:22px 25px;margin:12px auto;max-width:720px}
body.carflowWizardActive .wizardSlide .cardHead{margin-bottom:22px}
body.carflowWizardActive .wizardSlide .badge{border-radius:50%;background:linear-gradient(145deg,var(--cf-cyan),var(--cf-blue));color:#fff}
body.carflowWizardActive .wizardSlide h2{color:#102347;font-size:clamp(23px,4vw,30px);letter-spacing:-.035em}
body.carflowWizardActive .wizardSlide p.lead{color:#62778c;line-height:1.5;font-size:14px}
body.carflowWizardActive .wizardSlide .grid{gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}
body.carflowWizardActive .wizardSlide .field label{font-size:13px;color:#193352;font-weight:820}
body.carflowWizardActive .wizardSlide input:not([type=radio]):not([type=checkbox]):not([type=file]),
body.carflowWizardActive .wizardSlide select,body.carflowWizardActive .wizardSlide textarea{background:#fff;border:1.5px solid #d6e3ef;border-radius:13px;color:#152c4d;font-size:15px;max-width:100%;min-height:49px}
body.carflowWizardActive .wizardSlide textarea{padding:12px;min-height:85px;resize:vertical}
body.carflowWizardActive .wizardSlide input:focus-visible,body.carflowWizardActive .wizardSlide select:focus-visible,body.carflowWizardActive .wizardSlide textarea:focus-visible{outline:2px solid #48baff;outline-offset:1px}
body.carflowWizardActive .segmented{min-width:0}
body.carflowWizardActive .seg{min-width:0}
body.carflowWizardActive .wizardHelp{font-size:11px;line-height:1.5;color:#73859a}
body.carflowWizardActive #form>.wizardHeader{max-width:720px;margin:0 auto;position:relative;padding:10px 10px 2px}
.wizardBrand{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.wizardBrand span{font-size:21px;font-weight:950;letter-spacing:-.07em;color:var(--cf-deep)}
.wizardBrand small{color:#087fe4;font-weight:820}
.wizardHeader h2{margin:12px 0 5px;text-align:center;color:#183858;font-size:17px;font-weight:790}
.wizardProgress{display:flex;align-items:center;justify-content:space-between;gap:5px;position:relative}
.wizardProgress:before{content:'';height:2px;position:absolute;left:8%;right:8%;top:50%;background:#cae1f1;z-index:0}
.wizardDot{border:2px solid #c8dded;border-radius:50%;width:38px;height:38px;min-height:38px;background:#fff;color:#7892a6;font-size:13px;font-weight:950;z-index:1;padding:0;flex:none}
.wizardDot.active{background:linear-gradient(135deg,#0acbff,#1464eb);color:#fff;border-color:#39b1ed;box-shadow:0 4px 13px #278de633}
.wizardDot.completed{background:#159c72;border-color:#159c72;color:#fff}
.wizardToolbar{position:sticky;bottom:0;z-index:19;max-width:720px;margin:14px auto 8px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:13px;background:rgba(249,252,255,.96);border-radius:16px;border:1px solid #d8e6f2;box-shadow:0 -4px 20px #1c517017;backdrop-filter:blur(12px)}
.wizardToolbar button{min-height:49px;border-radius:13px;border:0;background:linear-gradient(105deg,#07bdff,#0862e8);color:#fff;font-weight:860;padding:10px 16px;box-shadow:0 3px 15px #096de522}
.wizardToolbar button:first-child{background:#e8f0f7;color:#284c6a;box-shadow:none}
.wizardToolbar button:disabled{opacity:.33;cursor:not-allowed}
.wizardToolbar #wizardStepHint{font-size:10px;color:#687e8e;text-align:center;max-width:120px}
.wizardToolbar #wizardNext[hidden]{display:none}
.wizardValidation{margin-top:13px;padding:13px 15px;border:1px solid #ffbdbd;border-radius:11px;background:#fff1ee;color:#a72828;font-size:13px}
.wizardValidation[hidden]{display:none}
#technical .wizardGrid .field:nth-child(1),#technical .wizardGrid .field:nth-child(2){min-width:0}
#defects textarea{line-height:1.55}
.wizardRegistrationDetails{margin-top:20px;background:#f1f9ff;border-radius:15px;border:1px solid #d6eaf8;padding:14px}
.wizardRegistrationDetails summary{cursor:pointer;color:#135a98;font-weight:850;font-size:13px}
.wizardRegistrationDetails summary span{color:#7189a0;font-weight:600}
.wizardRegistrationDetails>p{font-size:12px;line-height:1.55;color:#637993}
.wizardRegistrationDetails #registration{border:none;background:transparent;padding:10px 0;box-shadow:none;margin:0}
.wizardRegistrationDetails #registration .cardHead{display:none}
.wizardRegistrationDetails #registration .regBox{grid-template-columns:1fr;gap:12px}
body.carflowWizardActive #photos #photoCounter{border-radius:20px;background:#e9f7ff;color:#027cc8;border:1px solid #bfe5ff}
body.carflowWizardActive .uploadBox{background:#f6fbff;border:1px dashed #9ecbf0}
body.carflowWizardActive .pickBtn.primary{background:#078aff;color:white;border-color:#078aff}
body.carflowWizardActive #photos .thumbGrid{grid-template-columns:repeat(4,minmax(0,1fr))}
.wizardVideo{margin-top:18px;padding:20px;border-radius:17px;border:2px dashed #c9dcee;background:#fff;display:grid;justify-items:center;gap:8px;text-align:center}
.wizardVideoPick{font-size:17px;font-weight:900;color:#162d4d;cursor:pointer;display:flex;gap:10px;align-items:center}
.wizardVideoPick input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.wizardVideoSub{font-size:11px;color:#6b7f92}
#wizardVideoState{font-size:12px;color:#197f6b}
.wizardAdvice{background:#e8f8ff;border:1px solid #d0ebff;border-radius:14px;padding:15px;display:grid;gap:7px;margin-top:18px;color:#355b72;font-size:12px}
.wizardAdvice b{font-size:14px;color:#087cbc}
.wizardEstimate{display:flex;align-items:flex-start;gap:12px;border:1px solid #cde9f9;background:linear-gradient(145deg,#ecf9ff,#f8fdff);border-radius:17px;padding:16px;margin-bottom:15px;grid-column:1/-1}
.wizardEstimateIcon{border-radius:12px;background:#d8f0ff;padding:11px 10px;color:#0075c8;font-weight:950}
.wizardEstimate>div{display:grid;gap:4px}
.wizardEstimate b{font-size:15px;color:#153152}
.wizardEstimate small{font-size:12px;line-height:1.5;color:#627f91}
.wizardEstimate strong{font-size:17px;line-height:1.35;color:#087fdb}
.wizardSaleModes{display:grid;gap:8px;margin:8px 0}
.wizardSaleTitle{font-size:14px;font-weight:900}
.wizardSaleMode{background:white;color:#253954;border-radius:12px;border:1.5px solid #cfdde9;min-height:49px;padding:13px 16px;text-align:left;font-weight:850;font-size:13px}
.wizardSaleMode.active{background:#effaff;border-color:#089bfa;color:#0566c0}
body.carflowWizardActive #priceOffer .wizardGrid{grid-template-columns:1fr}
body.carflowWizardActive #priceOffer .pricePreferenceField{margin:0}
body.carflowWizardActive #priceOffer .desiredPriceWrap[hidden]{display:none!important}
body.carflowWizardActive #priceOffer .desiredPriceWrap{padding:10px;border-color:#d1eaff;background:#f8fcff;margin-top:0}
body.carflowWizardActive #priceOffer .requestOffersChoice{min-height:70px;background:#f6fcff;border-color:#a9d6f7}
body.carflowWizardActive #priceOffer .requestOffersChoice strong{color:#183b5d}
.wizardPrivacy{background:#effaff;border-radius:13px;padding:13px;line-height:1.55;font-size:12px;color:#376d8f;border:1px solid #cfe9f8}
.wizardPrivacy b{display:block;font-size:14px;color:#0a78ba;margin-bottom:2px}
body.carflowWizardActive #priceOffer .wizardSubheading{font-size:17px;margin:18px 0 10px;color:#172f50}
body.carflowWizardActive #priceOffer #location,body.carflowWizardActive #priceOffer #contact{padding:12px 0;margin:0;border:0;box-shadow:none;background:transparent}
body.carflowWizardActive #priceOffer #location .cardHead,body.carflowWizardActive #priceOffer #contact .cardHead{display:none}
body.carflowWizardActive #priceOffer #location .locationBtns{gap:9px}
body.carflowWizardActive #priceOffer #contact .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
body.carflowWizardActive #priceOffer .submitCard{margin:20px 0 0;padding:18px;background:#f0faff;border:1px solid #cee7fa;color:#20374f;border-radius:17px;box-shadow:none}
body.carflowWizardActive #priceOffer .submitCard .badge{display:none}
body.carflowWizardActive #priceOffer .submitCard h2{font-size:18px}
body.carflowWizardActive #priceOffer .submitCard p.lead{color:#546e86}
body.carflowWizardActive #priceOffer .submitBtn{border-radius:14px;background:linear-gradient(110deg,#01b8fe,#0768e8);color:#fff}
@media(max-width:600px){
 body.carflowWizardActive .shell{padding:8px 9px 65px}
 body.carflowWizardActive .wizardSlide{padding:20px 15px;margin:10px auto;border-radius:23px}
 body.carflowWizardActive .wizardSlide .grid{grid-template-columns:1fr;gap:12px}
 body.carflowWizardActive #priceOffer #contact .grid{grid-template-columns:1fr}
 body.carflowWizardActive .wizardSlide .cardHead h2{font-size:25px}
 .wizardProgress{gap:3px}
 .wizardDot{width:35px;height:35px;min-height:35px}
 .wizardToolbar{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:10px;gap:10px}
 .wizardToolbar #wizardStepHint{display:none}
 .wizardToolbar button{font-size:13px;min-width:0}
 body.carflowWizardActive #photos .thumbGrid{grid-template-columns:repeat(3,minmax(0,1fr))}
 body.carflowWizardActive #priceOffer .locationBtns{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){body.carflowWizardActive *,body.carflowWizardReady *{scroll-behavior:auto!important;transition:none!important}}


/* Home screen from supplied CarFlow seller UX brief */
body.carflowWizardReady .launchHero{background:linear-gradient(135deg,#ffffff 0%,#eefdff 100%);border:1px solid #c8e5fa;color:#102849;box-shadow:0 15px 38px #184b7717}
body.carflowWizardReady .launchHero:before{background:radial-gradient(circle,rgba(0,182,255,.14),transparent 70%)}
body.carflowWizardReady .launchEyebrow{color:#077bc9;letter-spacing:.03em}
body.carflowWizardReady .launchEyebrow:before{background:#0a9eff}
body.carflowWizardReady .launchHero h1{color:#0c2549}
body.carflowWizardReady .launchHero h1 span{color:#078aff}
body.carflowWizardReady .launchIntro{color:#5a7188}
body.carflowWizardReady .launchCta{background:linear-gradient(110deg,#04baf9,#0a6eee);color:white;box-shadow:0 12px 26px #137adb38;border-radius:999px}
body.carflowWizardReady .launchHint{color:#5e7592}
body.carflowWizardReady .launchBenefits{color:#245574;border-top:1px solid #d0e8f8}
body.carflowWizardReady .launchBenefits span:before{background:#d8f4ff;color:#058fe9}
body.carflowWizardReady .sellerHero{border:1px solid #c4dff0!important;background:#e2f4ff;box-shadow:0 10px 30px #3d7da528!important}
body.carflowWizardReady .visualCaption{color:#6b89a1}
@media(max-width:650px){body.carflowWizardReady .launchHero{padding:20px 17px}body.carflowWizardReady .launchHero h1{font-size:clamp(34px,9.2vw,47px);line-height:1.07}body.carflowWizardReady .launchIntro{line-height:1.5;font-size:13px}body.carflowWizardReady .launchCta{width:100%}}