#quote-app.jqr { margin:0; padding:0; }
#quote-app.jqr .jqr-banner { height:150px; background:#19ad95 url('/wp-content/plugins/jasper-quote-estimator/assets/configurator-price-v1/assets/reference/banner-switch.jpg') no-repeat center top; color:#fff; }
#quote-app.jqr .jqr-banner > div { max-width:1200px; margin:auto; }
#quote-app.jqr .jqr-banner h1 { font-size:43px; font-weight:700; line-height:58px; margin:0; padding:25px 0 0; letter-spacing:0; }
#quote-app.jqr .jqr-banner p { font-size:24px; line-height:44px; margin:0; }
#quote-app.jqr .jqr-banner strong { color:#fff150; font-weight:700; }
#quote-app.jqr .jqr-process { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); width:calc(100% - 28px); max-width:1200px; margin:16px auto 0; padding:0; height:32px; list-style:none; }
#quote-app.jqr .jqr-process li { display:flex; align-items:center; justify-content:center; gap:5px; font-size:13px; color:#888; background:#e7f0f4; clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%,12px 50%); padding:0 10px; }
#quote-app.jqr .jqr-process li:first-child { clip-path:polygon(0 0,calc(100% - 12px) 0,100% 50%,calc(100% - 12px) 100%,0 100%); }
#quote-app.jqr .jqr-process li.active { background:#afe6fb; }
#quote-app.jqr .jqr-process img { max-width:18px; max-height:18px; object-fit:contain; }
#quote-app.jqr #product-mount { width:calc(100% - 28px); max-width:1200px; margin:20px auto 0; }
#quote-app.jqr .jqr-workspace { display:grid; grid-template-columns:minmax(0,840px) 328px; gap:22px; width:calc(100% - 38px); max-width:1190px; margin:20px auto 0; align-items:start; }
#quote-app.jqr #form-mount,#quote-app.jqr #summary-mount { min-width:0; }
#quote-app.jqr #summary-mount { position:sticky; top:0; }
#quote-app.jqr .jqr-footnote { max-width:1190px; margin:0 auto 16px; padding:0 12px; color:#888; font-size:11px; }
#quote-app.jqr .jqr-mobile-action { display:none; }
@media(max-width:1230px) {
  #quote-app.jqr .jqr-banner > div { margin-left:14px; margin-right:14px; }
  #quote-app.jqr .jqr-banner h1 { font-size:38px; }
  #quote-app.jqr .jqr-banner p { font-size:20px; }
}
@media(max-width:1000px) {
  #quote-app.jqr .jqr-workspace { grid-template-columns:minmax(0,1fr) 300px; gap:14px; }
  #quote-app.jqr .jqr-process li { font-size:11px; padding:0 8px; }
  #quote-app.jqr .jqr-process img { display:none; }
  #quote-app.jqr .jqr-banner h1 { font-size:33px; }
  #quote-app.jqr .jqr-banner p { font-size:18px; }
}
@media(max-width:900px) {
  #quote-app.jqr .jqr-workspace { grid-template-columns:minmax(0,1fr); width:calc(100% - 28px); }
  #quote-app.jqr #summary-mount { position:static; }
  #quote-app.jqr .jqr-mobile-action { position:fixed; bottom:0; left:0; right:0; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); border-top:1px solid var(--line); background:#fff; box-shadow:0 -2px 8px #0001; }
  #quote-app.jqr .jqr-mobile-action > span { font-size:9px; color:#666; }
  #quote-app.jqr .jqr-mobile-action strong { display:block; font-size:16px; color:#383838; }
  #quote-app.jqr .jqr-mobile-action .jqr-primary { font-size:13px; padding:10px 14px; }
}
@media(max-width:600px) {
  #quote-app.jqr .jqr-banner { height:150px; background-position:61% top; position:relative; }
  #quote-app.jqr .jqr-banner::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#009d87eb,#00a189c9); }
  #quote-app.jqr .jqr-banner > div { position:relative; }
  #quote-app.jqr .jqr-banner h1 { font-size:27px; line-height:34px; padding-top:22px; }
  #quote-app.jqr .jqr-banner p { font-size:15px; line-height:22px; margin-top:8px; max-width:330px; }
  #quote-app.jqr .jqr-process { grid-template-columns:repeat(4,minmax(0,1fr)); height:auto; min-height:56px; gap:2px 0; margin-top:12px; }
  #quote-app.jqr .jqr-process li { min-height:27px; font-size:9px; padding:0 7px; text-align:center; line-height:13px; }
  #quote-app.jqr #product-mount { margin-top:12px; }
  #quote-app.jqr .jqr-workspace { margin-top:14px; }
}