:root{--blue:#123f64;--blue2:#1d5c87;--ink:#17212b;--muted:#65717c;--line:#dfe5e9;--bg:#f4f6f7;--white:#fff;--accent:#c89b3c}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif}header{height:72px;padding:0 max(24px,calc((100% - 1240px)/2));display:flex;align-items:center;justify-content:space-between;background:var(--blue);color:#fff;gap:24px}.brand{color:#fff;text-decoration:none;font-size:23px;font-weight:800;letter-spacing:.12em}.brand span{font-size:14px;font-weight:500;letter-spacing:.03em;opacity:.75;margin-left:8px}.quick{display:flex;max-width:390px;flex:1}.quick input{width:100%;border:0;padding:11px 13px;border-radius:5px 0 0 5px}.quick button,.primary{border:0;background:var(--accent);color:#17212b;font-weight:700;padding:0 18px;border-radius:0 5px 5px 0;cursor:pointer}main{max-width:1240px;margin:auto;padding:22px 24px 60px}nav{display:flex;gap:10px;color:var(--muted);margin-bottom:18px}nav>*+*:before{content:"/";margin-right:10px;color:#aab2b8}nav a{color:var(--blue2)}h1{font-size:30px;margin:0 0 6px}.muted{color:var(--muted);margin:0 0 22px}.panel{background:#fff;border:1px solid var(--line);border-radius:10px;padding:28px;box-shadow:0 3px 14px #2030400a}.vehicle{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.vehicle label span{display:block;font-weight:650;margin:0 0 7px}.vehicle select,.vehicle input{width:100%;height:43px;border:1px solid #bac5cc;border-radius:5px;background:#fff;padding:0 11px}.vehicle .primary{height:43px;border-radius:5px;align-self:end}.title-row{display:flex;justify-content:space-between;align-items:start;gap:20px}.button{border:1px solid #aab8c1;background:#fff;color:var(--blue);padding:9px 15px;border-radius:5px;text-decoration:none;cursor:pointer}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.card{min-height:105px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--blue2);border-radius:7px;padding:15px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:6px}.card:hover{box-shadow:0 4px 16px #20304018;transform:translateY(-1px)}.card small,.card em{font-size:12px;color:var(--muted);font-style:normal}.card strong{font-size:16px}.table-wrap{overflow:auto;background:#fff;border:1px solid var(--line);border-radius:8px}table{width:100%;border-collapse:collapse}th,td{padding:11px 13px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap}th{background:#e9eef1;color:#394753;font-size:13px}td:nth-child(3){white-space:normal;min-width:250px}.tag{display:inline-block;margin-left:7px;padding:2px 5px;background:#fff0cf;color:#795812;border-radius:3px}.error{background:#fff0f0;color:#a21d1d;padding:13px;border-radius:5px;margin-bottom:18px}footer{padding:22px;text-align:center;color:var(--muted);font-size:13px}@media(max-width:850px){.vehicle,.cards{grid-template-columns:1fr 1fr}}@media(max-width:560px){header{height:auto;padding:14px 16px;display:block}.quick{margin-top:12px}.vehicle,.cards{grid-template-columns:1fr}.panel{padding:19px}.title-row{display:block}.title-row .button{display:inline-block;margin-bottom:16px}main{padding:18px 14px}.brand span{display:none}}
:root{--diagram-added:1}
.parts-layout{display:grid;grid-template-columns:minmax(360px,42%) 1fr;gap:18px;align-items:start}.diagram{position:sticky;top:12px;background:#fff;border:1px solid var(--line);border-radius:8px;min-height:420px;padding:12px;text-align:center}.diagram img{display:block;width:100%;height:68vh;min-height:390px;pointer-events:none}.diagram p{font-size:12px;color:var(--muted);margin:8px 0 0}.diagram-empty{min-height:400px;display:grid;place-items:center;color:var(--muted)}@media(max-width:950px){.parts-layout{grid-template-columns:1fr}.diagram{position:static}.diagram img{height:60vh}}

/* VIDA VIN search */
.vin-panel{
    margin-bottom:18px;
    padding:22px 28px;
    background:linear-gradient(135deg,#123f64,#1d5c87);
    color:#fff;
    border-radius:10px;
    box-shadow:0 4px 18px #20304020
}
.vin-panel h1,.vin-panel h2{margin:0 0 6px}
.vin-panel .muted{color:#d8e5ee;margin-bottom:16px}
.vin-form{display:flex;max-width:760px}
.vin-form input{
    flex:1;
    min-width:0;
    height:48px;
    padding:0 15px;
    border:0;
    border-radius:6px 0 0 6px;
    font:600 17px/1 monospace;
    text-transform:uppercase;
    letter-spacing:.06em
}
.vin-form button{
    height:48px;
    padding:0 22px;
    border:0;
    border-radius:0 6px 6px 0;
    background:var(--accent);
    color:var(--ink);
    font-weight:750;
    cursor:pointer
}
.vehicle-summary{
    display:grid;
    grid-template-columns:repeat(5,minmax(120px,1fr));
    gap:12px;
    margin:0 0 20px;
    padding:16px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:8px
}
.vehicle-summary div{min-width:0}
.vehicle-summary small{
    display:block;
    margin-bottom:3px;
    color:var(--muted)
}
.vehicle-summary strong{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis
}
.vin-error{
    margin-top:14px;
    padding:12px 14px;
    border-radius:5px;
    background:#fff0f0;
    color:#a21d1d
}
.manual-selection{
    margin-top:18px;
    border-top:1px solid var(--line);
    padding-top:18px
}
.diagram img{
    display:block;
    width:100%;
    height:auto;
    max-height:72vh;
    object-fit:contain;
    background:#fff
}
@media(max-width:850px){
    .vehicle-summary{
        grid-template-columns:repeat(2,1fr)
    }
}
@media(max-width:560px){
    .vin-panel{padding:19px}
    .vin-form{display:block}
    .vin-form input{
        width:100%;
        border-radius:5px
    }
    .vin-form button{
        width:100%;
        margin-top:8px;
        border-radius:5px
    }
    .vehicle-summary{grid-template-columns:1fr}
}

.shop-cell{min-width:155px}
.shop-product{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:5px;
}
.shop-product small{color:var(--muted)}
.shop-price{
    color:#173f63;
    font-weight:750;
    white-space:nowrap;
}
.shop-button{
    display:inline-block;
    padding:6px 13px;
    border-radius:5px;
    background:var(--accent);
    color:#17212b;
    font-weight:700;
    text-decoration:none;
}
.shop-button:hover{filter:brightness(.96)}
.shop-request{
    color:var(--blue2);
    white-space:nowrap;
}

.shop-empty{color:#a3adb5}


/* Store return */
.store-return{
    flex:0 0 auto;
    color:#fff;
    border:1px solid rgba(255,255,255,.55);
    border-radius:5px;
    padding:10px 15px;
    font-weight:700;
    text-decoration:none;
    white-space:nowrap
}
.store-return:hover{
    color:#123f64;
    background:#fff
}
@media(max-width:560px){
    .store-return{
        display:inline-block;
        margin-top:12px
    }
}


/* Popular catalogue sections */
.popular-sections{
    margin-top:34px
}
.popular-sections h2{
    margin:0 0 5px;
    font-size:25px
}
.popular-grid .card{
    min-height:120px
}
.popular-grid .card em{
    margin-top:auto
}

/* All sections directory */
.all-sections-cta{
    margin-top:24px;
    padding:22px 26px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:22px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:10px
}
.all-sections-cta h2{margin:0 0 5px}
.all-sections-cta p{
    margin:0;
    color:var(--muted)
}
.section-directory-search{
    display:flex;
    max-width:760px;
    margin:0 0 22px
}
.section-directory-search input{
    flex:1;
    min-width:0;
    height:44px;
    padding:0 13px;
    border:1px solid #bac5cc;
    border-radius:5px 0 0 5px
}
.section-directory-search button{
    border:0;
    padding:0 20px;
    background:var(--accent);
    color:var(--ink);
    font-weight:700;
    cursor:pointer
}
.section-directory-search a{
    display:flex;
    align-items:center;
    padding:0 14px;
    color:var(--blue2)
}
.section-directory-cards .card{
    min-height:118px
}
.directory-empty{
    padding:30px;
    text-align:center;
    color:var(--muted);
    background:#fff;
    border:1px solid var(--line);
    border-radius:8px
}
.pagination{
    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:7px;
    margin-top:28px
}
.pagination a,
.pagination strong{
    min-width:39px;
    height:39px;
    padding:0 11px;
    display:inline-flex;
    justify-content:center;
    align-items:center;
    border:1px solid #b9c5cc;
    border-radius:5px;
    text-decoration:none
}
.pagination strong{
    background:var(--blue);
    border-color:var(--blue);
    color:#fff
}
.pagination-arrow{min-width:auto!important}
.pagination span{color:var(--muted)}

@media(max-width:560px){
    .all-sections-cta{
        display:block;
        padding:19px
    }
    .all-sections-cta .button{
        display:inline-block;
        margin-top:15px
    }
    .section-directory-search{
        display:grid;
        grid-template-columns:1fr
    }
    .section-directory-search input{
        border-radius:5px
    }
    .section-directory-search button{
        height:43px;
        margin-top:7px;
        border-radius:5px
    }
    .section-directory-search a{
        justify-content:center;
        padding:10px
    }
}
