/* 線上配車報價：版面仿原廠 Konfigurator，配色沿用台灣官網 */
.cfg{--cfg-accent:var(--green);--cfg-soft:#ebe7de;--cfg-bg:#f6f5f1;--cfg-top:96px;--cfg-steps:0px;background:var(--cfg-bg);position:relative}
.cfg-top{position:sticky;top:86px;z-index:30;display:flex;align-items:center;gap:clamp(18px,3vw,48px);min-height:var(--cfg-top);padding:12px clamp(20px,3vw,40px);background:var(--cfg-bg);border-bottom:1px solid var(--line)}
.cfg-brand{display:flex;align-items:center;gap:16px;margin-right:auto}
.cfg-brand b{font:300 clamp(24px,2.6vw,38px)/1 'Outfit',sans-serif;letter-spacing:.28em}
.cfg-badge{display:inline-block;padding:6px 11px;border-radius:999px;background:var(--cfg-soft);font:500 14px/1 'Outfit',sans-serif;white-space:nowrap}
.cfg-figures{display:flex;gap:clamp(16px,2.6vw,40px);margin:0}
.cfg-figures div{min-width:0}
.cfg-figures dt{font-size:13px;color:#5d6866;line-height:1.35}
.cfg-figures dd{margin:4px 0 0;font:600 17px/1.2 'Outfit','Noto Sans TC',sans-serif;white-space:nowrap}
.cfg-figures .is-warn dd,.cfg-sum-facts .is-warn dd{color:#b3261e}
.cfg-top-actions{display:flex;gap:8px}
.cfg-pill{border:0;border-radius:999px;background:var(--cfg-soft);padding:12px 20px;font:500 14px 'Noto Sans TC';color:var(--ink);cursor:pointer;white-space:nowrap}
.cfg-pill:hover{background:#ddd7ca}
.cfg-main{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,410px);gap:clamp(16px,2vw,32px);height:calc(100vh - 86px - var(--cfg-top) - var(--cfg-steps));min-height:400px}
.cfg.is-summary .cfg-main{grid-template-columns:1fr;height:auto;min-height:0}
.cfg-stage{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;user-select:none;padding:10px 20px 96px}
.cfg-view{position:relative;width:100%;max-width:1100px;touch-action:pan-y}
.cfg-view-ext{aspect-ratio:2/1;cursor:grab}
.cfg-view-ext:active{cursor:grabbing}
.cfg-view-int{aspect-ratio:2/1}
.cfg-view img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.cfg-view-ext img{transform:scale(1.38) translateY(-4%)}
.cfg-stage .cfg-view{max-height:100%}
.cfg-stage .cfg-view-ext{width:min(100%,calc((100vh - 86px - var(--cfg-top) - var(--cfg-steps) - 150px)*2))}
.cfg-stage .cfg-view-int{width:min(100%,calc((100vh - 86px - var(--cfg-top) - var(--cfg-steps) - 150px)*2))}
.cfg-rotate{position:absolute;top:14px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:10px;font-size:13px;color:#6b7573}
.cfg-rotate button{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#fff;font-size:20px;line-height:1;cursor:pointer}
.cfg-switch{position:absolute;bottom:50px;left:50%;transform:translateX(-50%);display:flex;padding:6px;border-radius:999px;background:var(--cfg-soft)}
.cfg-switch button{border:0;background:none;border-radius:999px;padding:11px 28px;font:500 15px 'Noto Sans TC';cursor:pointer;color:#56615f}
.cfg-switch button.is-on{background:var(--cfg-accent);color:#fff}
.cfg-stage-foot{position:absolute;left:14px;right:14px;bottom:10px;display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#6b7573}
.cfg-panel{overflow-y:auto;padding:22px clamp(16px,2vw,28px) 40px 4px;scrollbar-width:thin}
.cfg-panel.is-wide{overflow:visible;padding:0}
.cfg-panel-head h2{font:400 24px/1.2 'Outfit','Noto Sans TC',sans-serif;margin:6px 0 10px}
.cfg-block{padding-bottom:18px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.cfg-block:last-of-type{border-bottom:0}
.cfg-lead{color:#5d6866;font-size:13px;margin:0 0 12px}
.cfg-section{margin-bottom:20px;scroll-margin-top:12px}
.cfg-section h3{font:500 15px/1.3 'Noto Sans TC';margin:0 0 8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.cfg-cards{display:grid;gap:6px}
.cfg-cards.is-tiles{grid-template-columns:repeat(3,1fr)}
.cfg-card{position:relative;display:flex;flex-direction:column;background:#fff;border:1.5px solid transparent;border-radius:5px;padding:9px 38px 8px 12px;cursor:pointer;transition:border-color .2s,box-shadow .2s;outline:none}
.cfg-card:hover,.cfg-card:focus-visible{box-shadow:0 5px 16px rgba(23,35,38,.08)}
.cfg-card:focus-visible{border-color:#8fa6a0}
.cfg-card.is-on{border-color:var(--cfg-accent)}
.cfg-card.is-blocked{cursor:not-allowed;opacity:.5}
.cfg-card.is-blocked:hover{box-shadow:none}
.cfg-card h4{font:500 14px/1.4 'Noto Sans TC';margin:0}
.cfg-card small{display:block;margin-top:1px;font-size:11px;color:#8a9391;line-height:1.4;word-break:break-word}
.cfg-card dl{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 12px;margin:4px 0 0;font-size:12px}
.cfg-card dl div{display:flex;gap:6px}
.cfg-card dl div:last-child{margin-left:auto}
.cfg-card dt{color:#7b8583}
.cfg-card dd{margin:0;font-weight:600;color:var(--ink)}
.cfg-save{color:var(--orange)!important}
.cfg-note{margin:4px 0 0;font-size:11px;color:#8a5a2b;line-height:1.4}
.cfg-check{position:absolute;top:10px;right:10px;width:20px;height:20px;border:1.5px solid var(--ink);border-radius:3px;background:#fff;display:grid;place-items:center}
.cfg-check.is-radio{border-radius:50%}
.cfg-card.is-on .cfg-check{background:var(--cfg-accent);border-color:var(--cfg-accent)}
.cfg-card.is-on .cfg-check:after{content:"";width:8px;height:4px;border:2px solid #fff;border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.cfg-card.has-img{padding:0 0 7px}
.cfg-card.has-img .cfg-card-body{padding:6px 8px 0}
.cfg-card.has-img h4{font-size:12px;line-height:1.35}
.cfg-card.has-img small{display:none}
.cfg-card.has-img dl{margin-top:2px;font-size:11px}
.cfg-card.has-img dl dt{display:none}
.cfg-card.has-img .cfg-check{top:6px;right:6px;width:18px;height:18px}
.cfg-card-img{aspect-ratio:4/3;overflow:hidden;border-radius:4px 4px 0 0;background:#eceae4}
.cfg-card-img img{object-fit:cover}
.cfg-cards:not(.is-tiles) .cfg-card.has-img{flex-direction:row;align-items:stretch;padding:0}
.cfg-cards:not(.is-tiles) .cfg-card.has-img .cfg-card-img{flex:0 0 64px;aspect-ratio:auto;border-radius:4px 0 0 4px}
.cfg-cards:not(.is-tiles) .cfg-card.has-img .cfg-card-body{padding:8px 36px 8px 10px;flex:1}
.cfg-cards:not(.is-tiles) .cfg-card.has-img small{display:block}
.cfg-pkg ul{margin:6px 0 0;padding:0;list-style:none;font-size:12px;color:#4a5755;columns:2;column-gap:14px}
.cfg-pkg li{padding:1px 0 1px 11px;position:relative;line-height:1.45;break-inside:avoid}
.cfg-pkg li:before{content:"";position:absolute;left:1px;top:8px;width:4px;height:4px;border-radius:50%;background:var(--cfg-accent)}
.cfg-pkg+.cfg-pkg{margin-top:6px}
.cfg-finish{display:block;width:100%;border:0;border-radius:999px;background:var(--cfg-accent);color:#fff;padding:15px 20px;font:500 16px 'Noto Sans TC';cursor:pointer;margin-top:4px}
.cfg-finish:hover{background:#18332e}
.cfg-pill.is-accent{background:var(--cfg-accent);color:#fff}
.cfg-pill.is-accent:hover{background:#18332e}
.cfg-change{font-size:13px;color:#5d6866;border-bottom:1px solid currentColor;line-height:1.2;white-space:nowrap}
.cfg-disclaimer{font-size:12px;color:#7b8583;line-height:1.7;margin-top:26px}
.cfg-model-list{display:grid;gap:14px}
.cfg-model{background:#fff;border:1.5px solid transparent;border-radius:6px;padding:22px}
.cfg-model.is-on{border-color:var(--cfg-accent)}
.cfg-model-head{display:flex;align-items:center;gap:12px}
.cfg-model h3{font:400 24px/1.25 'Outfit','Noto Sans TC';margin:12px 0}
.cfg-model img{height:auto;object-fit:contain;margin:6px 0 10px}
.cfg-model dl{margin:0 0 16px;font-size:14px}
.cfg-model dl div{display:flex;justify-content:space-between;padding:7px 0;border-top:1px solid #eeeeea}
.cfg-model dt{color:#5d6866}
.cfg-model dd{margin:0}
.cfg-model dd b{font:600 18px 'Outfit'}
.cfg-model .btn{width:100%}
.cfg-model-current{display:block;text-align:center;padding:12px;background:var(--cfg-soft);font-size:14px}
.btn-line{background:#fff;color:var(--ink);border:1px solid var(--ink)}
.cfg-model-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;background:var(--cfg-bg,#f6f5f1)}
.cfg-model-grid .cfg-model{padding:34px;display:flex;flex-direction:column}
.cfg-model-grid .cfg-model img{width:100%;aspect-ratio:2.6/1}
.cfg-model-grid .cfg-model dl{margin-top:auto}
.cfg-toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);z-index:60;width:min(560px,calc(100% - 32px));background:var(--ink);color:#fff;padding:14px 20px;border-radius:6px;font-size:14px;line-height:1.6;opacity:0;pointer-events:none;transition:.25s}
.cfg-toast.show{opacity:1;transform:translate(-50%,0)}
.cfg-toast p{margin:3px 0}
.cfg-toast b{margin-right:10px;color:#cfe3dc}
.cfg-dialog{border:0;padding:0;width:min(760px,calc(100% - 32px));max-height:85vh;border-radius:6px}
.cfg-dialog::backdrop{background:rgba(11,24,22,.6)}
.cfg-dialog-box{position:relative;padding:40px clamp(22px,4vw,48px)}
.cfg-dialog h3{font:400 28px/1.25 'Outfit','Noto Sans TC';margin:10px 0 18px}
.cfg-dialog h4{margin:22px 0 6px;font-size:16px}
.cfg-dialog ul{margin:0;padding:0;list-style:none;columns:2;column-gap:30px;font-size:14px}
.cfg-dialog li{break-inside:avoid;padding:6px 0;border-bottom:1px solid #eeeeea;line-height:1.5}
.cfg-dialog li small{display:block;color:#8a9391;font-size:11px}
/* 總結 */
.cfg-summary{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(24px,4vw,64px);padding:44px clamp(20px,4vw,64px) 60px}
.cfg-sum-main h2{font:300 clamp(32px,3.6vw,52px)/1.15 'Outfit','Noto Sans TC';margin:12px 0 22px}
.cfg-sum-visuals{display:grid;grid-template-columns:2fr 1.5fr;gap:14px;margin-bottom:30px;align-items:center}
.cfg-sum-visuals .cfg-view{background:#fff;border-radius:6px;cursor:default}
.cfg-sum-table{width:100%;border-collapse:collapse;background:#fff;font-size:15px}
.cfg-sum-table th,.cfg-sum-table td{padding:12px 16px;text-align:left;border-bottom:1px solid #eeeeea;vertical-align:top}
.cfg-sum-table thead th{font-size:13px;color:#6b7573;font-weight:500;background:#fbfaf7}
.cfg-sum-table tbody td small{display:block;color:#8a9391;font-size:12px}
.cfg-sum-table td:last-child,.cfg-sum-table th:last-child{text-align:right;white-space:nowrap}
.cfg-stage[hidden]{display:none}
.cfg-sum-table .cfg-sum-group th{text-align:left;background:var(--cfg-bg);font-size:13px;letter-spacing:.08em;color:var(--green);padding-top:16px}
.cfg-sum-table tfoot td{font-weight:600;border-bottom:0}
.cfg-sum-total td{font:600 22px 'Outfit','Noto Sans TC';background:var(--cfg-accent);color:#fff}
.cfg-sum-total small{display:block;font:400 12px 'Noto Sans TC';opacity:.8}
.cfg-sum-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);margin:22px 0 0;border:1px solid var(--line)}
.cfg-sum-facts div{background:#fff;padding:16px}
.cfg-sum-facts dt{font-size:13px;color:#6b7573}
.cfg-sum-facts dd{margin:4px 0 0;font:600 20px 'Outfit'}
.cfg-warn{color:#b3261e;font-size:14px}
.cfg-sum-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.cfg-sum-actions .btn{gap:10px}
.cfg-quote{align-self:start;position:sticky;top:calc(86px + var(--cfg-top) + 20px);background:#fff;padding:32px;border-radius:6px}
.cfg-quote h3{font:400 28px/1.25 'Outfit','Noto Sans TC';margin:10px 0}
.cfg-quote p{color:#5d6866;font-size:14px}
.cfg-quote form{display:grid;gap:14px}
.cfg-quote label{font-size:14px;color:#3d4a48}
.cfg-quote select{display:block;width:100%;border:0;border-bottom:1px solid #8e9996;background:transparent;padding:12px 3px;font:400 16px 'Noto Sans TC';border-radius:0}
.cfg-quote .btn{width:100%;margin-top:6px}
.cfg-choose .cfg-model-grid{padding-top:60px}
@media(max-width:1200px){.cfg-figures dt sup{display:none}.cfg-top-actions .cfg-pill[data-cfg-act=reset]{display:none}.cfg-summary{grid-template-columns:1fr}.cfg-quote{position:static}}
@media(max-width:900px){
 .cfg{--cfg-top:auto}
 .cfg-top{top:72px;flex-wrap:wrap;gap:8px 14px;padding:10px 16px}
 .cfg-brand{width:100%;margin:0;gap:10px;padding-right:124px;flex-wrap:wrap}
 .cfg-brand b{font-size:20px;letter-spacing:.2em}
 .cfg-figures{flex:1;gap:14px}
 .cfg-figures dt{font-size:11px}
 .cfg-figures dd{font-size:15px}
 .cfg-top-actions{position:absolute;right:16px;top:10px}
 .cfg-top-actions .cfg-pill{padding:8px 14px;font-size:13px}
 .cfg-top-actions .cfg-pill[data-cfg-act=share]{display:none}
 .cfg-change{font-size:12px}
 .cfg-main{display:block;height:auto;min-height:0}
 .cfg-stage{padding:8px 8px 64px}
 .cfg-stage .cfg-view-ext,.cfg-stage .cfg-view-int{width:100%}
 .cfg-rotate{top:6px}
 .cfg-rotate span{display:none}
 .cfg-switch{bottom:40px}
 .cfg-switch button{padding:8px 22px;font-size:14px}
 .cfg-stage-foot{bottom:4px}
 .cfg-panel{overflow:visible;padding:16px 16px 30px}
 .cfg-cards.is-tiles{grid-template-columns:repeat(3,1fr)}
 .cfg-pkg ul{columns:1}
      .cfg-model-grid{grid-template-columns:1fr;padding:30px 16px}
 .cfg-model-grid .cfg-model{padding:22px}
 .cfg-summary{padding:28px 16px 40px}
 .cfg-sum-visuals{grid-template-columns:1fr}
 .cfg-sum-table{font-size:14px}
 .cfg-sum-table th,.cfg-sum-table td{padding:10px}
 .cfg-sum-facts{grid-template-columns:1fr 1fr}
 .cfg-quote{padding:24px 18px}
 .cfg-dialog ul{columns:1}
}
@media print{
 .site-header,footer,.cfg-top-actions, .cfg-top{position:static;border:0}
 .cfg-summary{display:block;padding:0}
 .cfg-sum-total td{color:#000;background:#eee!important}
 body,.cfg{background:#fff}
}
