
.b32-distance-calculator,
.b32-distance-answer,
.b32-distance-formula,
.b32-distance-hub-link,
.b32-distance-category-cta{
    box-sizing:border-box;
}
.b32-distance-calculator{
    margin:28px 0;
    padding:24px;
    background:#fff;
    border:1px solid var(--b32-border,#e6eaf0);
    border-radius:20px;
    box-shadow:0 12px 36px rgba(20,33,61,.05);
}
.b32-distance-calc-head h2{margin:4px 0 8px!important}
.b32-distance-calc-head p{margin:0 0 18px;color:var(--b32-muted,#667085)}
.b32-distance-kicker{
    display:inline-block;
    font-size:.78rem;
    font-weight:850;
    letter-spacing:.07em;
    text-transform:uppercase;
    color:var(--b32-brand,#e45a2a);
}
.b32-distance-calc-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.b32-distance-calc-grid label>span{
    display:block;
    font-size:.82rem;
    font-weight:750;
    color:var(--b32-muted,#667085);
    margin-bottom:6px;
}
.b32-distance-input-wrap{
    display:flex;
    align-items:center;
    border:1px solid var(--b32-border,#e6eaf0);
    background:#f8fafc;
    border-radius:14px;
    overflow:hidden;
}
.b32-distance-input-wrap input{
    min-width:0;
    width:100%;
    border:0!important;
    outline:0!important;
    background:transparent!important;
    padding:12px 13px!important;
    font:inherit;
    box-shadow:none!important;
}
.b32-distance-input-wrap b{
    padding:0 12px;
    color:var(--b32-muted,#667085);
    font-size:.82rem;
    white-space:nowrap;
}
.b32-distance-result{
    margin-top:14px;
    padding:18px 20px;
    border-radius:16px;
    background:var(--b32-navy,#14213d);
    color:#fff;
}
.b32-distance-result small{display:block;color:#c8d1df;margin-bottom:2px}
.b32-distance-result strong{display:block;font-size:clamp(1.6rem,4vw,2.3rem);line-height:1.1}
.b32-distance-result span{display:block;margin-top:5px;color:#d8dfeb;font-size:.84rem}
.b32-distance-quick{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}
.b32-distance-quick button{
    appearance:none;
    border:1px solid var(--b32-border,#e6eaf0);
    background:#fff;
    border-radius:999px;
    padding:7px 12px;
    font-weight:750;
    cursor:pointer;
}
.b32-distance-quick button:hover{border-color:var(--b32-brand,#e45a2a);color:var(--b32-brand,#e45a2a)}
.b32-distance-note{margin:13px 0 0!important;font-size:.83rem!important;color:var(--b32-muted,#667085)!important}

.b32-distance-answer{
    margin:0 0 26px;
    padding:20px 22px;
    border-left:4px solid var(--b32-brand,#e45a2a);
    background:var(--b32-soft,#fff3ee);
    border-radius:0 16px 16px 0;
}
.b32-distance-answer>span{
    display:block;
    color:var(--b32-brand,#e45a2a);
    text-transform:uppercase;
    font-size:.76rem;
    letter-spacing:.06em;
    font-weight:850;
}
.b32-distance-answer>strong{display:block;font-size:1.25rem;margin:3px 0 5px}
.b32-distance-answer p{margin:0!important}
.b32-distance-table-wrap{overflow-x:auto;margin:18px 0 26px}
.b32-distance-table{width:100%;border-collapse:collapse}
.b32-distance-table th,.b32-distance-table td{
    border:1px solid var(--b32-border,#e6eaf0);
    padding:10px 12px;
    text-align:left;
}
.b32-distance-table th{background:#f8fafc}
.b32-distance-formula{
    background:#f8fafc;
    border:1px solid var(--b32-border,#e6eaf0);
    border-radius:16px;
    padding:18px;
    margin:18px 0 24px;
}
.b32-distance-formula code{
    display:block;
    white-space:normal;
    font-size:1rem;
    font-weight:800;
    color:var(--b32-navy,#14213d);
}
.b32-distance-formula p{margin:8px 0 0!important}
.b32-distance-hub-link{
    display:flex;
    justify-content:space-between;
    gap:14px;
    align-items:center;
    margin:26px 0;
    padding:18px 20px;
    background:var(--b32-navy,#14213d);
    color:#fff;
    border-radius:16px;
}
.b32-distance-hub-link a{color:#fff!important;font-weight:800}
.b32-distance-related{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin:14px 0 24px;
}
.b32-distance-related a{
    display:block;
    padding:12px 14px;
    background:#fff;
    border:1px solid var(--b32-border,#e6eaf0);
    border-radius:12px;
    text-decoration:none!important;
    font-weight:750;
}
.b32-distance-category-cta{
    grid-column:1/-1;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin:0 0 22px;
    padding:20px 22px;
    background:var(--b32-soft,#fff3ee);
    border:1px solid #f2d5ca;
    border-radius:18px;
}
.b32-distance-category-cta span{
    display:block;
    color:var(--b32-brand,#e45a2a);
    text-transform:uppercase;
    font-size:.72rem;
    font-weight:850;
    letter-spacing:.06em;
}
.b32-distance-category-cta strong{display:block;font-size:1.12rem;color:var(--b32-text,#18212f)}
.b32-distance-category-cta p{margin:3px 0 0;color:var(--b32-muted,#667085);font-size:.9rem}
.b32-distance-category-cta>a{
    flex:0 0 auto;
    padding:10px 15px;
    border-radius:12px;
    background:var(--b32-brand,#e45a2a);
    color:#fff!important;
    font-weight:800;
}
@media(max-width:760px){
    .b32-distance-calc-grid{grid-template-columns:1fr}
    .b32-distance-related{grid-template-columns:1fr 1fr}
    .b32-distance-hub-link,.b32-distance-category-cta{align-items:flex-start;flex-direction:column}
}
@media(max-width:480px){
    .b32-distance-calculator{padding:18px}
    .b32-distance-related{grid-template-columns:1fr}
}
