/* /guides/actual-vs-volumetric-weight/ — two competing bars. Original layout. */

.vw-hero{padding:48px 0 12px;max-width:840px}
.vw-hero h1{font-size:clamp(26px,3.6vw,38px);margin:.3em 0 .5em}
.vw-lede{font-size:17px;color:#C4C6C8}

.vw-bars{display:flex;flex-direction:column;gap:20px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:26px;margin-bottom:16px}
.vw-bar-row{display:grid;grid-template-columns:130px 1fr;gap:16px;align-items:center}
@media (max-width:600px){.vw-bar-row{grid-template-columns:1fr}}
.vw-bar-label{font-family:var(--font-display);font-weight:700;font-size:13.5px}
.vw-bar-track{background:var(--canvas);border-radius:999px;height:36px;overflow:hidden;position:relative}
.vw-bar-fill{height:100%;display:flex;align-items:center;padding:0 14px;color:#fff;font-family:var(--font-display);font-weight:800;font-size:13px;border-radius:999px;white-space:nowrap}
.vw-fill-actual{background:#2A5DAA}
.vw-fill-volumetric{background:var(--coral)}
.vw-bar-q{grid-column:1 / -1;font-size:12.5px;color:var(--muted)}
.sh-formula{font-family:var(--font-display);font-weight:800;font-size:18px;background:var(--canvas);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 18px;display:inline-block}

.vw-case{padding:20px}
.vw-case h3{font-size:15px;margin-bottom:8px}
.vw-case p{font-size:13.5px;color:var(--muted);margin:0}

.vw-worksheet{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
@media (max-width:600px){.vw-worksheet{grid-template-columns:1fr}}
.vw-worksheet > div{background:var(--card);padding:14px 16px;display:flex;justify-content:space-between;gap:12px;align-items:center}
.vw-worksheet label{font-size:13.5px;color:#C4C6C8;font-weight:600}
.vw-worksheet span{color:var(--muted);font-size:13px}

.vw-principle{background:var(--dark);border-radius:var(--radius-lg);padding:40px}
.vw-principle .eyebrow{color:#FF8A80}
.vw-principle h2{color:#fff;font-size:22px;margin:.3em 0 .5em}
.vw-principle p{color:#C7C7C5;font-size:15px;margin:0 0 20px}