/* 1.31 product composition. quote-builder.css owns controls/visual primitives;
   this file owns the hero, floating workspace and responsive product layout. */
.quote-v4{--q4-ink:#112438;--q4-muted:#53657a;--q4-line:#dce4ee;--q4-green:#075ed6;--q4-pale:#f0f6fd;--motion-scene:260ms;background:#eaf0f7}
.q4-resume{--q4-green:var(--vmk-green-strong,#159947)}
.quote-v4.q42-ready{grid-template-rows:auto minmax(0,1fr) auto}
/* The standalone workspace opens only after initialization and consent gating.
   Do not briefly render its unfinished inline shell before that transition.
   Scripting-disabled visitors retain the normal-flow contact fallback. */
@media(scripting:enabled){
 .quote-v4[data-context=page]:has(.q4-layout):not(.q42-ready){display:none}
}
.quote-v4 :is(h1,h2,h3,h4){font-family:var(--vmk-body),sans-serif;font-weight:750}
.q4-top{background:#091d2b;color:#fff;border-color:#ffffff17;min-height:58px;padding:9px max(24px,calc((100vw - 1280px)/2));gap:18px}
.q4-brand span{color:#279eff}.q4-top .q4-text-button{color:#b6d9ff}.q4-top .q4-close{color:#fff;border-color:#ffffff30}
.q4-top .q4-progress{color:#c4d9ee}.q4-top .q4-progress-fill{background:linear-gradient(to right,#2995ff var(--q4-progress,0%),#ffffff26 var(--q4-progress,0%))}
.quote-v4 .q4-layout{display:block;padding:0 0 24px;scrollbar-gutter:auto}
.q4-hero{position:relative;isolation:isolate;background:#102c43;min-height:230px;overflow:hidden;color:#fff;padding:30px max(36px,calc((100vw - 1190px)/2)) 70px}
.q4-hero>img{position:absolute;inset:0 0 0 auto;width:64%;height:100%;object-fit:cover;object-position:var(--q4-hero-x,65%) var(--q4-hero-y,55%);z-index:-2}
.q4-hero:before{content:"";position:absolute;inset:0;background:rgb(0 0 0 / var(--q4-hero-shade,0));z-index:-1;pointer-events:none}
.q4-summary-image{display:block;width:100%;max-height:240px;height:auto;object-fit:contain}
.q4-hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#091e2ff5 5%,#102b40ee 36%,#102b4066 66%,#102b4012)}
.q4-hero-copy{max-width:720px}.q4-hero-eyebrow{font-size:10px;letter-spacing:.16em;color:#bbd2e8;font-weight:700;margin:0 0 12px}
.q4-hero h1{display:flex;align-items:center;gap:14px;font-size:clamp(30px,3.2vw,44px);line-height:1.08;letter-spacing:-.04em;margin:0 0 10px;color:#fff}
.q4-hero h1 svg{width:38px;height:38px;color:#d7ecff}.q4-hero-copy>p:not(.q4-hero-eyebrow){font-size:15px;margin:0;max-width:50ch;line-height:1.5}
.q4-hero ul{display:flex;flex-wrap:wrap;gap:9px 22px;list-style:none;padding:0;margin:18px 0 0;font-size:12px}
.q4-hero li{display:flex;align-items:center;gap:6px}.q4-hero li svg{width:16px;height:16px;color:#74d498}
.q4-workspace{position:relative;max-width:1280px;margin:-44px auto 0;background:#fff;border:1px solid #e2eaf3;border-radius:18px;box-shadow:0 8px 30px #1838580c}
.q4-steps{padding:20px 30px 14px;gap:0;border:0;background:transparent;flex-wrap:nowrap}
.q4-step{position:relative;flex:1;flex-direction:column;padding:0 4px;gap:6px;border:0;min-height:54px;color:#52657b;font-size:12px!important;background:transparent}
.q4-step:after{content:"";height:2px;position:absolute;top:15px;left:calc(50% + 22px);right:calc(-50% + 22px);background:#dfe7f0}.q4-step:last-child:after{display:none}
.q4-step-number{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#edf1f6;color:#31495f;font-size:13px;font-weight:700;z-index:1}
.q4-step-number svg{width:17px;height:17px}.q4-step[data-complete=true] .q4-step-number,.q4-step[aria-current] .q4-step-number{color:white;background:var(--q4-green)}
.q4-step[aria-current]{border:0;color:var(--q4-ink)}.q4-step:disabled{opacity:1;cursor:default}
.q4-step[data-complete=true]:after{background:#87b9f2}
.q4-columns{display:grid;grid-template-columns:minmax(0,7fr) minmax(260px,3fr);gap:28px;padding:22px 30px 30px;align-items:start}
.quote-v4 .q4-work{display:block;width:100%}.q4-heading{font-size:clamp(24px,2vw,30px);letter-spacing:-.035em;margin-bottom:10px}
.q4-intro{font-size:13px;line-height:1.5;margin-bottom:23px;max-width:70ch}
.q4-fields{gap:18px 20px}.q4-label{font-size:13px;color:#172d44}
.q4-field :is(input:not([type=radio]):not([type=checkbox]):not([type=range]),select,textarea){border-color:#c6d3e2;border-radius:7px;min-height:44px;padding:10px 12px;background:#fff}
.q4-field textarea{min-height:76px}.q4-field:has(.q4-choice-group){grid-column:1/-1}
.q4-choices,.q4-chips{gap:8px;display:flex;flex-wrap:wrap}
.q4-choice{flex:1 1 130px;position:relative;border:1px solid #ced9e5;border-radius:8px;background:#fff;padding:12px 13px;min-height:52px;color:#19334c;transition:background 160ms,border-color 160ms,box-shadow 160ms}
.q4-chips .q4-choice{flex:0 1 auto;min-width:48px}.q4-choice:has(input:checked){color:#094681;border-color:var(--q4-green);background:#edf5ff;box-shadow:inset 0 0 0 1px var(--q4-green)}
.q4-choice:hover{border-color:#7aa8d6;background:#f6faff}.q4-choice svg{width:25px;height:25px;color:#64809b}
.q4-choice input{flex:none}.q4-choice span{line-height:1.35;font-weight:600}
.q4-choice-note{display:block;font-size:10px;line-height:1.4;font-weight:400;color:#536b85;margin-top:5px}.q4-field[data-field-path="extras.disposal_enquiry"] .q4-chips{margin-bottom:12px}.q4-preset>.q4-icon{width:17px;height:17px;margin-right:5px}
.q4-counter button{background:#f4f8fd;border-color:#c6d3e2}.q4-counter button:first-child{border-radius:7px 0 0 7px}.q4-counter button:last-child{border-radius:0 7px 7px 0}
.q4-counter:focus-within{outline:2px solid var(--q4-green);outline-offset:2px}
.q4-item-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.q4-item-card{padding:14px 10px 10px;border:1px solid #d2deeb;border-radius:9px;background:#fff;display:flex;align-items:center;flex-direction:column;gap:9px}.q4-item-card[data-selected=true]{background:#edf5ff;border-color:var(--q4-green)}
.q4-item-card>svg{width:36px;height:36px;color:#436789}.q4-item-card>strong{font-size:12px;text-align:center}.q4-item-card .q4-counter{width:100%;grid-template-columns:32px minmax(0,1fr) 32px}.q4-item-card .q4-counter button{min-height:36px}.q4-item-card output{display:grid;place-items:center;font-size:14px;background:#fff;border-block:1px solid #c6d3e2}
.q4-presets{border:0;padding:0;margin:0 0 5px}.q4-preset{min-height:44px;padding:9px 14px;border:1px solid #c6d3e2;border-radius:7px;background:#f3f8ff;color:#124b82;font-size:12px!important}.q4-preset:hover{background:#e1efff;border-color:var(--q4-green)}
.q4-address{padding:0;border:0}.q4-address legend{margin:0 0 14px;font-size:13px}.q4-route-fields{align-items:start}
.q4-summary{position:sticky;top:18px;padding:20px;background:linear-gradient(145deg,#f3f8ff,#eaf3fd);border:1px solid #e6eef7;border-radius:12px;color:#172e47}
.q4-summary summary{font-weight:700;font-size:15px;list-style:none}.q4-summary summary::-webkit-details-marker{display:none}
.q4-summary summary span{font-size:18px;margin:0}.q4-summary summary small{display:none}.q4-summary-body{padding-top:8px}
.q4-route{font-size:13px;margin:12px 0 16px}.q4-route-line{color:var(--q4-green)}.q4-route-line i{background:#a7bfdc}
.q4-summary dl>div{border-color:#dce6f0;font-size:12px;padding:9px 0}.q4-price{border-color:#d5e3f2;margin-top:18px;padding-top:16px}
.q4-price small{font-size:9px;line-height:1.5;display:block;color:#526980}.q4-price strong{font-size:25px;margin:9px 0}.q4-price p{font-size:11px;color:#526980}
.q4-completion{font-size:10px}.q4-summary-more{font-size:11px!important}
.q4-world{margin-top:14px;min-height:0!important}.q4-world .v42{padding:0;background:transparent;color:#355573;min-height:0!important;box-shadow:none;border:0}
.q4-world .v42-meta{display:none}.q4-world .v42-canvas{min-height:0;display:block}.q4-world .v42-caption{font-size:9px;line-height:1.45;margin:12px 0 0;color:#526980}
.q4-world .v42-rooms{display:none}.q4-world .v42-moving-load{border:0;padding:8px 0;margin:0}.q4-world .v42-moving-load>strong{font-size:12px}
.q4-world .v42-freight-stats{flex-direction:row;align-items:center;gap:10px;margin-bottom:12px}.q4-world .v42-freight-stats strong{font-size:22px}.q4-world .v42-freight-stats span{font-size:10px}
.q4-world .v42-deck{min-height:70px;padding:10px}.q4-world .v42-empty{margin:10px 0;font-size:11px}.q4-world .v42-ruler{display:none}
.q4-world .v42-object{width:32px;height:32px}.q4-world .v42-object svg{width:23px;height:23px}
.q4-world .v42-direct{min-height:80px;gap:6px}.q4-world .v42-anchor strong{font-size:11px}.q4-world .v42-shipment-token{width:34px;height:34px}.q4-world .v42-urgency{font-size:10px}
.q4-world .v42-network{height:125px}.q4-world .v42-network-count{font-size:12px}.q4-world .v42-recurrence{margin-top:10px}
.q4-world .v42-need{font-size:15px}.q4-world .v42-resource-rack{margin:10px 0}.q4-world .v42-resource{padding:6px}.q4-world .v42-resource i{display:none}.q4-world .v42-operating-area{display:none}
.q4-world .v42-cleared-space,.q4-world .v42-removal-arrow{display:none}.q4-world .v42-removal-tray{min-height:65px;background:#e2ecf7;border-color:#98b0ca}.q4-world .v42-removal-count{display:block;font-size:12px;margin-top:8px}.q4-world .v42-access-strip{margin-top:10px;border-color:#cbd9e8}
.q4-navigation{padding:12px max(24px,calc((100vw - 1220px)/2)) max(12px,env(safe-area-inset-bottom));grid-template-columns:140px minmax(0,1fr) 200px;border-color:#dce5ef;box-shadow:0 -4px 22px #0e345808}
.q4-next,.q4-back,.q4-contact,.q4-resume{border-radius:8px;min-height:46px;transition:background 160ms,transform 160ms}.q4-next:hover{background:#064faf}.q4-next:active{transform:translateY(1px)}
.q4-services{gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}.q4-service{border:1px solid #d5e0ec;border-radius:10px;padding:20px 16px;gap:12px;align-items:start;background:#fbfdff}.q4-service:has(input:checked){background:#edf5ff;border-color:var(--q4-green)}
.q4-service strong{font-size:18px}.q4-service small{font-size:12px}.q4-service>.q4-icon{width:28px;height:28px}.q4-service input{margin-top:5px}
.q4-detail{padding:0}.q4-detail-open .q4-detail{grid-column:1/-1}.q4-detail-open .q4-detail .q4-fields{max-width:960px}
.q4-advanced{border-color:#dce5ef;padding:12px 0}.q4-advanced>summary{color:var(--q4-green)}
.q4-discount-toggle{border-top:1px solid var(--q4-line);margin-top:20px;padding-top:16px}.q4-discount-toggle>summary{color:var(--q4-green);font-size:13px;font-weight:650;min-height:40px;cursor:pointer}.q4-discount{margin:10px 0 0;max-width:400px;padding:0;border:0}
.q4-review-board{gap:18px 24px}.q4-review-section{border-color:#d9e5f2}.q4-review-head h3{font-size:15px}.q4-review-actions{border-top:1px solid var(--q4-line);padding-top:15px;display:flex;flex-wrap:wrap;gap:10px;align-items:center}.q4-review-actions .q4-next,.q4-review-actions .q4-contact{width:auto;margin:0}.q4-review-actions .q4-status,.q4-review-actions dl{flex-basis:100%}
.q4-tax{margin-top:10px;font-size:12px}.q4-tax summary{cursor:pointer}.q4-tax dl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;margin:10px 0}.q4-tax dd{margin:0;text-align:right}.q4-tax small{font-size:11px;line-height:1.4}
.q4-transport-card{border:1px solid #d6e3f0;border-left:3px solid var(--q4-green);padding:18px 20px;border-radius:8px;margin:0 0 20px;background:linear-gradient(120deg,#f3f8ff,#fff)}
.q4-transport-card>small{font-size:9px;letter-spacing:.13em;color:#566e87;font-weight:700}.q4-transport-card h3{font-size:19px;margin:7px 0 14px}.q4-ticket-route{display:flex;gap:28px;align-items:center}.q4-ticket-route>div{display:flex;flex-direction:column;gap:4px}.q4-ticket-route>div+div{border-left:1px solid #b9cfe5;padding-left:28px}.q4-ticket-route small{font-size:11px;color:#56708a}.q4-ticket-route strong{font-size:17px}.q4-ticket-facts{display:flex;gap:6px 12px;flex-wrap:wrap;margin:13px 0 0;font-size:11px;color:#476581}
.quote-v4[data-scene=service] .q4-summary{display:none}.quote-v4[data-scene=service] .q4-columns{grid-template-columns:1fr}.quote-v4[data-scene=service] .q4-steps:empty{display:none}
.quote-v4[data-scene=review] .q4-summary-body{display:block}.quote-v4[data-scene=review] .q4-world{display:block}
.quote-v4 :is(button,a,input,select,textarea,summary):focus-visible{outline-color:var(--q4-green)}
@media(min-width:1360px){.q4-workspace{margin-inline:auto}.q4-columns{padding:26px 36px 34px;gap:34px}}
@media(max-width:1359px){.q4-workspace{margin-inline:24px}.q4-columns{gap:24px;padding:22px 24px}.q4-hero{padding-inline:42px}}
@media(max-width:1023px){
 .q4-columns{display:flex;flex-direction:column;gap:22px}.q4-summary{position:static;order:-1;width:100%;padding:13px 16px;border-radius:8px}.q4-summary summary{position:relative;padding-right:26px}.q4-summary summary:after{content:'⌄';position:absolute;right:0;top:0;font-size:22px;color:var(--q4-green)}
 .q4-summary summary span{display:block;margin:0;font-size:14px}.q4-summary summary small{display:block;font-size:11px;font-weight:400;margin-top:4px;line-height:1.5}.q4-summary:has(details:not([open])) .q4-price{display:none}
 .q4-summary .q4-summary-body{max-width:640px}.q4-summary .q4-world{max-width:280px}.q4-summary .q4-price{max-width:640px}
 .q4-hero{min-height:200px;padding:25px 40px 65px}.q4-hero h1{font-size:34px}.q4-hero ul{margin-top:14px}.q4-hero>img{width:68%}
 .q4-step{font-size:11px!important}.q4-steps{padding:19px 22px 8px}.q4-fields{gap:16px}.q4-work{width:100%}
}
@media(max-width:600px){
 .q4-top{padding:8px 14px;min-height:52px;gap:9px}.q4-brand{font-size:23px}.q4-identity strong{font-size:11px}.q4-identity>.q4-icon{display:none}.q4-top .q4-progress{width:30px;font-size:10px}.q4-close{height:36px}
 .q4-hero{padding:18px 20px 43px;min-height:166px}.q4-hero h1{font-size:27px;gap:9px;max-width:330px}.q4-hero h1 svg{width:27px;height:27px}.q4-hero-eyebrow{font-size:8px;margin-bottom:9px}.q4-hero-copy>p:not(.q4-hero-eyebrow){font-size:12px;max-width:27ch}
 .q4-hero>img{width:85%;object-position:var(--q4-hero-mobile-x,65%) var(--q4-hero-mobile-y,50%)}.q4-hero:after{background:linear-gradient(90deg,#0b2234f5,#0b2234d9 35%,#0b223452)}.q4-hero ul{gap:5px 12px;margin-top:12px;font-size:9px}.q4-hero li:last-child{display:none}.q4-hero li svg{width:13px;height:13px}
 .q4-workspace{margin:-23px 10px 0;border-radius:12px}.q4-columns{padding:15px;gap:20px}.q4-steps{padding:16px 9px 6px}.q4-step{font-size:9px!important;gap:5px;padding:0 2px;min-height:47px}.q4-step-number{width:27px;height:27px;font-size:11px}.q4-step:after{top:13px;left:calc(50% + 18px);right:calc(-50% + 18px)}
 .q4-heading{font-size:24px;line-height:1.15}.q4-intro{font-size:12px;margin-bottom:18px}.q4-fields{grid-template-columns:1fr;gap:16px}.q4-label{font-size:13px}.q4-field :is(input,select,textarea){font-size:16px!important}.q4-field input[type=radio],.q4-field input[type=checkbox]{min-height:0}
 .q4-choice{padding:11px 10px;min-height:48px;flex-basis:120px}.q4-choice span{font-size:12px}.q4-choice svg{width:21px;height:21px}.q4-chips .q4-choice{flex-basis:auto}.q4-route-fields{gap:22px}
 .q4-navigation{grid-template-columns:100px minmax(0,1fr) 142px;padding:9px 14px max(9px,env(safe-area-inset-bottom));gap:8px}.q4-navigation .q4-session{font-size:9px}.q4-next,.q4-back{font-size:12px!important;min-height:44px}.q4-review-actions .q4-next,.q4-review-actions .q4-contact{width:100%}
 .q4-services{grid-template-columns:1fr;gap:10px}.q4-service{padding:16px 12px}.q4-service strong{font-size:17px}.q4-service small{font-size:12px}.q4-row-grid{gap:12px;grid-template-columns:1fr 1fr}
 .q4-item-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.q4-item-card .q4-counter button{min-height:44px}
}
@media(prefers-reduced-motion:reduce){.quote-v4 *{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* Pricing 2.0 extends the existing summary; no independent totals or fixed row heights. */
.quote-v4 .q4-price-components{display:grid;gap:8px;margin:14px 0;font-size:12px;line-height:1.45}
.quote-v4 .q4-price-components>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.8fr);gap:12px;border-bottom:1px solid #19314718;padding-bottom:8px}
.quote-v4 .q4-price-components dt,.quote-v4 .q4-price-components dd{margin:0;overflow-wrap:anywhere}
.quote-v4 .q4-price-components dd{text-align:right;font-variant-numeric:tabular-nums}
.quote-v4 .q4-preview-notice{padding:10px 12px;border-left:3px solid var(--vmk-green,#61b875);background:#edf6ee;font-size:12px;overflow-wrap:anywhere}
