.how-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:start}.how-copy h2{font-size:clamp(36px,3.7vw,56px);line-height:1.08;margin:20px 0}.how-copy>.how-intro{max-width:540px;margin-bottom:28px}.how-choice{display:block;width:100%;text-align:left;padding:20px 22px;margin:10px 0;border:1px solid #d6cdbc;border-radius:14px;background:transparent;color:#252822;cursor:pointer;font:inherit}.how-choice[aria-selected=true]{background:#fffaf0;border-color:#ba3026;box-shadow:inset 4px 0 #ba3026}.how-choice:hover{background:#fffaf0}.how-choice:focus-visible{outline:3px solid #c58b27;outline-offset:3px}.how-choice .step-number{display:block;font-size:13px;font-weight:800;color:#ba3026}.how-choice .step-title{display:block;font-size:23px;line-height:1.2;font-weight:800;margin:6px 0}.how-choice .step-copy{display:block;font-size:15px;line-height:1.6}.how-stage{position:sticky;top:125px;padding:28px;background:linear-gradient(145deg,#e5dccb,#fffaf0);border:1px solid #d6cdbc;border-radius:22px;min-height:590px}.how-panel[hidden]{display:none}.how-panel h3{font-size:23px;margin:0 0 20px;color:#102b46}.how-images{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:center}.how-images.hand-four{grid-template-columns:repeat(2,minmax(0,1fr));max-width:370px;margin:auto;gap:16px 26px}.how-images img{display:block;width:100%;height:auto;border-radius:10px;filter:drop-shadow(0 7px 6px #102b462c)}.how-images.hand-four img{max-height:260px;object-fit:contain}.how-panel-note{font-size:14px;line-height:1.5;margin-top:20px}.deal-buyer{display:flex;gap:18px;align-items:center;justify-content:center;margin-bottom:20px}.deal-buyer img{width:98px;border-radius:7px}.deal-budget{font-weight:800;font-size:28px;color:#147343}.deal-budget small{display:block;font-size:12px;color:#102b46}.deal-offers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;text-align:center}.deal-offers figure{margin:0;min-width:0}.deal-offers img{width:100%;display:block;border-radius:7px;filter:drop-shadow(0 5px 5px #102b4620)}.deal-offers figcaption{font-size:13px;color:#102b46;margin-top:10px}.deal-offers strong{display:block;font-size:20px;margin-top:4px}.deal-offers .calculation{display:block;font-size:13px;margin-top:6px}.deal-winner{background:#e4eddf;border:1px solid #96b590;border-radius:10px;padding:12px;margin-top:18px;text-align:center;color:#245233;font-weight:700}.deal-note{font-size:12px;line-height:1.55;margin:12px 0 0}.how-copy .rule-note{margin-top:22px}
@media(max-width:850px){.how-layout{grid-template-columns:1fr;gap:24px}.how-stage{position:static;min-height:0}.how-images{max-width:580px;margin:auto}.how-images.hand-four{max-width:420px}.deal-offers{max-width:570px;margin:auto}.deal-buyer img{width:100px}.how-copy h2{font-size:40px}}
@media(max-width:420px){.how-stage{padding:16px}.how-choice{padding:16px}.how-images{gap:9px}.deal-offers{gap:9px}.deal-offers strong{font-size:18px}.how-copy h2{font-size:36px}}

#how .how-panel img{height:auto;object-fit:contain}

.fleet-example-card{width:140px;margin:0 auto 24px}.fleet-example-card img{display:block;width:100%}.scoring-images{grid-template-columns:repeat(2,minmax(0,1fr));max-width:340px;margin:24px auto 0}#how .score-list{margin-top:20px}

.buyer-with-die{position:relative;width:130px;flex:none}.deal-buyer .buyer-with-die>img:first-child{width:100%;display:block}#how .buyer-with-die .price-die{position:absolute;width:44%;height:auto;left:-10%;top:66%;border-radius:0;z-index:1}

.how-images.fleet-two-cars{grid-template-columns:repeat(2,minmax(0,1fr));max-width:380px;margin-inline:auto}

/* Original card symbols, displayed as CSS sprites without altering the artwork. */
.buyer-legends{display:grid;gap:20px;margin-top:24px;border-top:1px solid #d6cdbc;padding-top:20px}
.buyer-legend h4{margin:0 0 12px;color:#19675f;text-transform:uppercase;font-size:14px;letter-spacing:.06em}
.buyer-legend ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 16px;list-style:none;padding:0;margin:0}
.buyer-legend li{display:flex;align-items:center;gap:9px;color:#102b46;font-size:14px;line-height:1.3;min-width:0}
.buyer-legend-icon{display:block;flex:0 0 36px;width:36px;height:36px;border-radius:6px;background-size:164px auto;background-position:-4px -4px;background-repeat:no-repeat}
.buyer-legend-icon.is-fuel{background-position:-124px -4px}
@media(max-width:520px){.buyer-legend ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.buyer-legend li{font-size:13px}}

/* Center the shared PL/ENG offer-components caption. */
[data-how="explain"]{text-align:center}
