/* Catálogo público (landing) — 2026-10-11 */
.pc { --pc-ink:#14303f; --pc-muted:#6b7f8e; --pc-line:#dde6ec; --pc-acc:#0b7285; --pc-acc2:#e97845; --pc-bg:#f5f8fa; min-height:100vh; background:var(--pc-bg); color:var(--pc-ink); font-size:14px; }
.pc a { color:var(--pc-acc); }
.pc mark { background:#fff1b8; color:inherit; padding:0 1px; border-radius:2px; font-weight:700; }
.pc .muted { color:var(--pc-muted); }
.pc-btn { display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border:1px solid var(--pc-line); border-radius:9px; background:#fff; color:var(--pc-ink); font:inherit; font-weight:700; cursor:pointer; text-decoration:none; }
.pc-btn:hover { border-color:var(--pc-acc); color:var(--pc-acc); }
.pc-btn.primary { background:var(--pc-acc); border-color:var(--pc-acc); color:#fff; } .pc-btn.primary:hover { background:#095e6e; color:#fff; }
.pc-btn.ghost { background:transparent; } .pc-btn.sm { padding:5px 10px; font-size:12px; }
.pc-pill { display:inline-block; padding:2px 9px; border-radius:999px; font-size:11.5px; font-weight:700; white-space:nowrap; }
.pc-pill.ok { background:#dff5ea; color:#16855b; } .pc-pill.off { background:#f1f3f5; color:#6b7f8e; }

/* cabecera */
.pc-top { position:sticky; top:0; z-index:20; display:grid; grid-template-columns:200px minmax(0,1fr) auto; gap:18px; align-items:center; padding:10px clamp(14px,3vw,40px); background:#fff; border-bottom:1px solid var(--pc-line); box-shadow:0 2px 12px rgba(20,48,63,.06); }
.pc-logo img { height:54px; width:auto; display:block; }
.pc-search { position:relative; display:flex; gap:8px; min-width:0; }
.pc-search input { flex:1; min-width:0; height:44px; padding:0 14px; border:2px solid #cfdbe3; border-radius:10px; font:inherit; font-size:15px; }
.pc-search input:focus { outline:0; border-color:var(--pc-acc); box-shadow:0 0 0 4px rgba(11,114,133,.12); }
.pc-links { display:flex; align-items:center; gap:16px; font-weight:700; } .pc-links a { text-decoration:none; color:var(--pc-ink); } .pc-links a:hover { color:var(--pc-acc); }
.pc-suggest { position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:30; max-height:70vh; overflow:auto; background:#fff; border:1px solid var(--pc-line); border-radius:12px; box-shadow:0 14px 40px rgba(20,48,63,.18); padding:6px; }
.pc-sug-title { padding:8px 10px 4px; font-size:11px; font-weight:800; letter-spacing:.6px; color:var(--pc-muted); text-transform:uppercase; }
.pc-sug { display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:10px; align-items:center; width:100%; padding:7px 10px; border:0; border-radius:8px; background:transparent; text-align:left; font:inherit; cursor:pointer; color:var(--pc-ink); }
.pc-sug:hover, .pc-sug.sel { background:#eaf5f7; }
.pc-sug img, .pc-sug-noimg, .pc-sug-ico { width:44px; height:44px; object-fit:contain; border-radius:6px; background:#f1f4f6; display:grid; place-items:center; font-size:20px; }
.pc-sug-main { min-width:0; display:flex; flex-direction:column; gap:2px; } .pc-sug-main b { font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .pc-sug-main small { color:var(--pc-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pc-sug-price { font-weight:800; white-space:nowrap; } .pc-sug.all { grid-template-columns:1fr; text-align:center; color:var(--pc-acc); font-weight:700; border-top:1px solid var(--pc-line); border-radius:0; margin-top:4px; }

/* hero y selector */
.pc-hero { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:30px; align-items:center; padding:40px clamp(14px,3vw,40px) 30px; background:linear-gradient(100deg, rgba(10,45,58,.94) 0%, rgba(11,114,133,.86) 55%, rgba(26,142,163,.72) 100%), url('../assets/catalog-vehicles-hero.png') center 40% / cover no-repeat; color:#fff; }
.pc-hero-quick { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:16px; } .pc-hero-quick > span { font-size:12px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; opacity:.85; margin-right:4px; }
.pc-hero-quick .pc-chip { background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.35); color:#fff; } .pc-hero-quick .pc-chip:hover { background:#fff; color:var(--pc-acc); }
.pc-picker-title { grid-column:1 / -1; font-weight:800; font-size:15px; color:var(--pc-ink); margin:-2px 0 2px; }
.pc-secgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:8px; margin:0 0 22px; }
.pc-secbtn { display:grid; grid-template-columns:auto 1fr; grid-template-rows:auto auto; column-gap:8px; align-items:center; padding:10px 12px; border:1px solid var(--pc-line); border-left:5px solid var(--sec); border-radius:10px; background:#fff; font:inherit; text-align:left; cursor:pointer; color:var(--pc-ink); }
.pc-secbtn b { font-size:13px; } .pc-secbtn small { grid-column:2; color:var(--pc-muted); font-size:11.5px; } .pc-secbtn .pc-dot { grid-row:1 / span 2; margin:0; width:10px; height:10px; } .pc-secbtn:hover { border-color:var(--sec); box-shadow:0 6px 18px rgba(20,48,63,.08); }
.pc-how { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; margin:28px 0 18px; }
.pc-how-step { display:flex; flex-direction:column; gap:6px; background:#fff; border:1px solid var(--pc-line); border-radius:14px; overflow:hidden; } .pc-how-step img { width:100%; height:150px; object-fit:cover; display:block; } .pc-how-step b { padding:10px 14px 0; font-size:15px; } .pc-how-step span { padding:0 14px 14px; color:var(--pc-muted); font-size:13px; line-height:1.5; }
.pc-store { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:16px; align-items:center; padding:18px 20px; margin:0 0 10px; background:#fff; border:1px solid var(--pc-line); border-left:5px solid var(--pc-acc2); border-radius:14px; font-size:13px; line-height:1.5; } .pc-store b { display:block; font-size:12px; letter-spacing:.5px; text-transform:uppercase; color:var(--pc-muted); margin-bottom:3px; } .pc-store .pc-btn { justify-self:end; }
.pc-eyebrow { font-size:12px; letter-spacing:1.4px; font-weight:800; opacity:.85; margin-bottom:8px; }
.pc-hero h1 { margin:0 0 10px; font-size:clamp(22px,3vw,34px); line-height:1.15; }
.pc-hero p { margin:0; opacity:.9; font-size:14px; }
.pc-picker { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; padding:16px; background:#fff; border-radius:14px; box-shadow:0 12px 30px rgba(0,0,0,.18); color:var(--pc-ink); }
.pc-picker .pc-btn { grid-column:1 / -1; justify-content:center; }
.pc-pickerbar { display:flex; flex-wrap:wrap; align-items:end; gap:10px; padding:12px clamp(14px,3vw,40px); background:#fff; border-bottom:1px solid var(--pc-line); }
.pc-pickerbar .pc-field { min-width:160px; flex:1 1 160px; }
.pc-field { display:flex; flex-direction:column; gap:4px; min-width:0; } .pc-field span { font-size:11px; font-weight:800; letter-spacing:.5px; color:var(--pc-muted); text-transform:uppercase; }
.pc-field select { height:40px; padding:0 10px; border:1px solid #cfdbe3; border-radius:8px; font:inherit; background:#fff; min-width:0; }
.pc-field select:disabled { background:#f3f6f8; color:#9aacb8; }

/* cuerpo: árbol + principal */
.pc-body { display:grid; grid-template-columns:300px minmax(0,1fr); gap:20px; padding:18px clamp(14px,3vw,40px) 30px; align-items:start; }
.pc-tree { position:sticky; top:76px; max-height:calc(100vh - 90px); overflow:auto; background:#fff; border:1px solid var(--pc-line); border-radius:12px; padding:10px; }
.pc-tree-head { display:flex; justify-content:space-between; align-items:center; font-weight:800; font-size:13px; padding:4px 6px 8px; } .pc-tree-head .pc-btn { display:none; }
.pc-node { display:flex; align-items:center; gap:4px; padding:1px 0; border-radius:6px; }
.pc-node.active > .pc-node-label { color:var(--pc-acc); font-weight:800; background:#e8f4f6; }
.pc-node.muted { color:var(--pc-muted); font-size:12px; padding-left:24px; }
.pc-children { margin-left:11px; padding-left:10px; border-left:1px dotted #b9c7d1; }
.pc-twisty { width:18px; height:18px; flex:0 0 18px; border:1px solid #b9c7d1; border-radius:3px; background:#fff; font:700 12px/1 ui-monospace,monospace; color:var(--pc-acc); cursor:pointer; padding:0; }
.pc-twisty.leaf { border-color:transparent; color:#b9c7d1; cursor:default; }
.pc-node-label { flex:1; min-width:0; display:flex; align-items:center; gap:6px; padding:3px 6px; border:0; border-radius:6px; background:transparent; font:inherit; font-size:13px; color:var(--pc-ink); text-align:left; cursor:pointer; }
.pc-node-label:hover { background:#f0f5f7; } .pc-node-label small { color:var(--pc-muted); font-size:11px; margin-left:auto; }
.pc-node.lvl0 .pc-node-label { font-weight:700; } .pc-make-logo { width:22px; height:16px; object-fit:contain; }
.pc-main { min-width:0; }
.pc-section-title { font-size:16px; font-weight:800; margin:6px 0 12px; }
.pc-chips { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; }
.pc-chip { display:inline-flex; align-items:center; gap:6px; padding:6px 11px; border:1px solid var(--pc-line); border-radius:999px; background:#fff; font:inherit; font-size:12.5px; cursor:pointer; color:var(--pc-ink); }
.pc-chip small { color:var(--pc-muted); } .pc-chip span { color:var(--pc-muted); } .pc-chip:hover { border-color:var(--pc-acc); }
.pc-chip.on { background:var(--pc-acc); border-color:var(--pc-acc); color:#fff; } .pc-chip.on small { color:#d7ecf0; } .pc-chip.clear { color:var(--pc-acc2); border-style:dashed; }
.pc-makes { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:10px; }
.pc-make { display:flex; flex-direction:column; align-items:center; gap:6px; padding:14px 10px; border:1px solid var(--pc-line); border-radius:12px; background:#fff; font:inherit; cursor:pointer; color:var(--pc-ink); }
.pc-make img { height:40px; width:auto; max-width:90px; object-fit:contain; } .pc-make small { color:var(--pc-muted); font-size:11.5px; } .pc-make:hover { border-color:var(--pc-acc); box-shadow:0 6px 18px rgba(20,48,63,.08); }
.pc-years { display:grid; grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:8px; }
.pc-year { display:flex; flex-direction:column; align-items:center; padding:10px 6px; border:1px solid var(--pc-line); border-radius:10px; background:#fff; font:inherit; cursor:pointer; color:var(--pc-ink); } .pc-year b { font-size:17px; color:var(--pc-acc); } .pc-year small { color:var(--pc-muted); } .pc-year:hover { border-color:var(--pc-acc); }
.pc-models { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:8px; }
.pc-model { display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:10px 12px; border:1px solid var(--pc-line); border-radius:10px; background:#fff; font:inherit; cursor:pointer; color:var(--pc-ink); text-align:left; } .pc-model small { color:var(--pc-muted); } .pc-model:hover { border-color:var(--pc-acc); }
.pc-engines { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0 0 12px; } .pc-engines > span { font-weight:800; font-size:12px; color:var(--pc-muted); text-transform:uppercase; }
.pc-results-head { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:10px; margin:0 0 12px; } .pc-results-head h2 { margin:0; font-size:18px; }
.pc-toggle { display:inline-flex; align-items:center; gap:6px; font-size:13px; padding:6px 10px; border:1px solid var(--pc-line); border-radius:999px; background:#fff; }
.pc-cats { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; }
.pc-cat-group { display:flex; flex-direction:column; gap:6px; } .pc-cat-group.on { flex-basis:100%; }
.pc-cat-sec { padding:7px 12px; border:1px solid var(--pc-line); border-radius:10px; background:#fff; font:inherit; font-weight:700; cursor:pointer; color:var(--pc-ink); text-align:left; } .pc-cat-sec small { color:var(--pc-muted); font-weight:600; }
.pc-cat-group.on .pc-cat-sec { background:#e8f4f6; border-color:var(--pc-acc); color:var(--pc-acc); }
.pc-cat-list { display:flex; flex-wrap:wrap; gap:6px; }
.pc-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; }
.pc-card { position:relative; display:flex; flex-direction:column; border:1px solid var(--pc-line); border-radius:12px; background:#fff; overflow:hidden; cursor:pointer; transition:box-shadow .15s, transform .15s; }
.pc-card.in-sec { border-color:var(--sec); box-shadow:0 0 0 3px color-mix(in srgb, var(--sec) 28%, transparent); }
.pc-card.in-sec:hover { box-shadow:0 0 0 3px var(--sec), 0 10px 26px rgba(20,48,63,.12); }
.pc-card-sec { position:absolute; top:8px; left:8px; z-index:2; padding:2px 8px; border-radius:999px; background:var(--sec); color:#fff; font-size:10.5px; font-weight:800; letter-spacing:.3px; text-transform:uppercase; }
.pc-dot { display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--sec, #9aacb8); margin-right:5px; flex:0 0 auto; }
.pc-secs { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 10px; }
.pc-sec { display:inline-flex; align-items:center; padding:7px 12px; border:1.5px solid var(--pc-line); border-radius:10px; background:#fff; font:inherit; font-weight:700; cursor:pointer; color:var(--pc-ink); }
.pc-sec small { color:var(--pc-muted); font-weight:600; margin-left:5px; } .pc-sec:hover { border-color:var(--sec); }
.pc-sec.on { border-color:var(--sec); background:color-mix(in srgb, var(--sec) 10%, #fff); color:var(--sec); } .pc-sec.on small { color:var(--sec); }
.pc-sec-row { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:8px 10px; margin:0 0 8px; border-left:5px solid var(--sec); border-radius:8px; background:color-mix(in srgb, var(--sec) 7%, #fff); }
.pc-sec-row-name { font-size:11px; font-weight:800; letter-spacing:.5px; text-transform:uppercase; color:var(--sec); margin-right:6px; }
.pc-sec-row .pc-chip.on { background:var(--sec); border-color:var(--sec); color:#fff; } .pc-sec-row .pc-chip.on small { color:#fff; opacity:.85; } .pc-sec-row .pc-chip:hover { border-color:var(--sec); }
.pc-results-head h2 small { font-size:13px; font-weight:600; }
.pc-card:hover { box-shadow:0 10px 26px rgba(20,48,63,.12); transform:translateY(-2px); }
.pc-card-img { position:relative; height:150px; background:#f3f6f8; display:grid; place-items:center; overflow:hidden; } .pc-card-img img { width:100%; height:100%; box-sizing:border-box; object-fit:contain; padding:8px; display:block; } .pc-noimg { display:none; color:#9aacb8; font-size:12px; } .pc-card-img.none .pc-noimg, .pc-card-img:not(:has(img)) .pc-noimg { display:block; }
.pc-card-body { display:flex; flex-direction:column; gap:5px; padding:10px 12px 12px; }
.pc-card-cat { font-size:11px; font-weight:800; letter-spacing:.4px; color:var(--pc-acc); text-transform:uppercase; }
.pc-card h3 { margin:0; font-size:14px; line-height:1.3; font-weight:600; } .pc-card-codes { font-size:12.5px; color:var(--pc-muted); display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; } .pc-card-codes b { color:var(--pc-ink); }
.pc-brand { display:inline-block; font-weight:800; font-size:12px; color:#0f3d4c; background:#e3f1f4; border:1px solid #bcd9e0; border-radius:6px; padding:1px 7px; letter-spacing:.2px; } .pc-brand mark { background:#ffe58a; }
.pc-code { display:inline-block; font-weight:800; font-style:italic; color:#0f3d4c; background:#fff3c4; border:1px solid #f1d98a; border-radius:5px; padding:0 6px; letter-spacing:.2px; } .pc-code mark { background:#ffd166; }
.pc-card-foot { display:flex; justify-content:space-between; align-items:center; margin-top:auto; padding-top:6px; } .pc-price { font-weight:800; font-size:15px; }
.pc-pager { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:16px 0; } .pc-page { min-width:34px; height:34px; padding:0 10px; border:1px solid var(--pc-line); border-radius:8px; background:#fff; font:inherit; cursor:pointer; } .pc-page.cur { background:var(--pc-acc); border-color:var(--pc-acc); color:#fff; } .pc-page.gap { border:0; background:transparent; cursor:default; } .pc-page:disabled { opacity:.4; cursor:default; } .pc-page-info { margin-left:auto; color:var(--pc-muted); font-size:12.5px; }
.pc-empty { padding:26px; border:1px dashed var(--pc-line); border-radius:12px; background:#fff; color:var(--pc-muted); text-align:center; }
.pc-didyoumean { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:12px; font-weight:700; }

/* ficha */
.pc-detail { background:#fff; border:1px solid var(--pc-line); border-radius:14px; padding:16px; margin-bottom:16px; }
.pc-detail-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.pc-detail-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:22px; }
.pc-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:8px; } .pc-gallery img { width:100%; aspect-ratio:1; object-fit:contain; background:#f3f6f8; border-radius:10px; cursor:zoom-in; } .pc-gallery img:first-child { grid-column:1 / -1; aspect-ratio:4/3; }
.pc-noimg.big { display:grid; place-items:center; height:220px; background:#f3f6f8; border-radius:10px; }
.pc-detail-info h2 { margin:4px 0 6px; font-size:22px; line-height:1.2; } .pc-detail-price { font-size:26px; font-weight:800; margin:10px 0 14px; } .pc-detail-price small { font-size:14px; color:var(--pc-muted); font-weight:600; }
.pc-codes { border-collapse:collapse; width:100%; margin-bottom:14px; } .pc-codes th { text-align:left; width:38%; padding:6px 8px 6px 0; color:var(--pc-muted); font-weight:700; font-size:12.5px; border-bottom:1px solid var(--pc-line); } .pc-codes td { padding:6px 0; border-bottom:1px solid var(--pc-line); font-family:ui-monospace,Consolas,monospace; }
.pc-detail-actions { display:flex; flex-wrap:wrap; gap:8px; }
.pc-detail-apps { margin-top:18px; padding-top:14px; border-top:1px solid var(--pc-line); } .pc-detail-apps h3 { margin:0 0 8px; font-size:15px; } .pc-detail-apps h4 { margin:14px 0 6px; font-size:13px; color:var(--pc-muted); text-transform:uppercase; letter-spacing:.4px; }
.pc-apps-text { line-height:1.6; margin:0; } .pc-fits { columns:2; margin:4px 0 10px; padding-left:18px; } .pc-fits li { break-inside:avoid; padding:2px 0; } .pc-detail-apps details summary { cursor:pointer; font-weight:700; }
.pc-foot { padding:18px clamp(14px,3vw,40px); border-top:1px solid var(--pc-line); background:#fff; color:var(--pc-muted); font-size:12.5px; }

@media (max-width:1000px) { .pc-hero { grid-template-columns:1fr; } .pc-picker { grid-template-columns:repeat(2,minmax(0,1fr)); } .pc-body { grid-template-columns:1fr; } .pc-tree { position:static; max-height:none; } .pc-tree-list { display:none; } .pc-tree.open .pc-tree-list { display:block; } .pc-tree-head .pc-btn { display:inline-flex; } .pc-detail-grid { grid-template-columns:1fr; } }
@media (max-width:700px) { .pc-top { grid-template-columns:1fr; gap:10px; } .pc-logo img { height:42px; } .pc-links { justify-content:space-between; } .pc-picker { grid-template-columns:1fr; } .pc-fits { columns:1; } .pc-grid { grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); } .pc-card-img { height:120px; } }
.pc-head-tools { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.pc-notice { margin:0 0 12px; padding:9px 12px; border-radius:10px; background:#fff4e5; border:1px solid #ffd8a8; color:#7a4b00; font-size:13px; }
.pc-refine { display:flex; align-items:center; gap:10px; margin:0 0 12px; }
.pc-refine input { flex:1; min-width:0; height:40px; padding:0 12px; border:1.5px dashed #b9c7d1; border-radius:10px; font:inherit; background:#fff; }
.pc-refine input:focus { outline:0; border-style:solid; border-color:var(--pc-acc); box-shadow:0 0 0 3px rgba(11,114,133,.12); }
.pc-refine span { white-space:nowrap; font-size:12.5px; }

/* ---- diagrama Ford (Microcat) en la ficha pública ---- */
.pc-mc { margin-top:14px; border:1px solid var(--pc-line); border-radius:12px; background:#fbfdfc; }
.pc-mc-bar { display:flex; align-items:center; gap:14px; padding:10px 14px; }
.pc-mc-thumb { width:72px; height:54px; object-fit:cover; object-position:top; border:1px solid var(--pc-line); border-radius:6px; background:#fff; }
.pc-mc-txt { flex:1; min-width:0; font-size:13px; } .pc-mc-txt .muted { font-size:12px; }
.pc-mc-viewer { border-top:1px solid var(--pc-line); padding:12px 14px 14px; }
.pc-mc-info { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:13px; margin-bottom:8px; } .pc-mc-info .muted { font-size:12px; }
.pc-mc-otros summary { cursor:pointer; color:var(--pc-accent, #0b7285); font-weight:600; font-size:12.5px; }
.pc-mc-otros-list { display:flex; flex-direction:column; gap:4px; margin-top:6px; max-height:220px; overflow:auto; }
.pc-mc-otro { text-align:left; border:1px solid var(--pc-line); background:#fff; border-radius:8px; padding:6px 9px; cursor:pointer; font:inherit; font-size:12.5px; color:inherit; } .pc-mc-otro small { display:block; color:var(--pc-muted); } .pc-mc-otro:hover { border-color:var(--pc-accent, #0b7285); }
.pc-mc-img { overflow:auto; max-height:70vh; border:1px solid var(--pc-line); border-radius:10px; background:#fff; text-align:center; }
.pc-mc-box { position:relative; display:inline-block; line-height:0; max-width:100%; } .pc-mc-box img { max-width:100%; height:auto; display:block; }
.pc-hot { position:absolute; box-sizing:border-box; border:2px solid transparent; border-radius:4px; cursor:pointer; }
.pc-hot-stock { border-color:rgba(46,158,91,.85); background:rgba(46,158,91,.12); }
.pc-hot-base { border-color:rgba(230,160,40,.9); background:rgba(230,160,40,.12); }
.pc-hot-no { border-color:rgba(130,140,150,.7); background:rgba(130,140,150,.08); }
.pc-hot-yo, .pc-hot.on { border-color:#e97845; background:rgba(233,120,69,.25); box-shadow:0 0 0 3px rgba(233,120,69,.35); }
.pc-hot-ref { cursor:default; }
.pc-hot:hover { filter:brightness(.9); }
.pc-mc-leyenda { display:flex; align-items:center; gap:6px 10px; flex-wrap:wrap; font-size:12px; margin-top:8px; color:var(--pc-muted); }
.pc-hot-ej { display:inline-block; width:22px; height:12px; border-radius:4px; border:2px solid transparent; box-sizing:border-box; }
.pc-mc-pop { margin-top:10px; border:1px solid var(--pc-line); border-radius:10px; background:#fff; padding:10px 12px; }
.pc-mc-pop-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; } .pc-mc-cerrar { border:0; background:transparent; cursor:pointer; font-size:14px; color:var(--pc-muted); }
.pc-mc-item { padding:8px 0; border-top:1px solid var(--pc-line); font-size:13px; display:flex; flex-wrap:wrap; gap:4px 8px; align-items:center; } .pc-mc-item:first-of-type { border-top:0; } .pc-mc-item .muted { flex-basis:100%; font-size:12px; }
.pc-mc-stock { margin-top:10px; font-size:13px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.pc-mc-chip { border:1px solid rgba(46,158,91,.6); background:#e8f7ee; color:#176a35; border-radius:999px; padding:3px 10px; cursor:pointer; font:inherit; font-size:12px; font-weight:700; } .pc-mc-chip:hover { background:#d6f0e0; }
@media (max-width:700px) { .pc-mc-bar { flex-wrap:wrap; } }

/* ---- Mi cotización (pedidos web del cliente) ---- */
.pq-headbox { display:inline-flex; align-items:center; gap:10px; }
.pq-link { border:0; background:transparent; font:inherit; font-weight:700; color:var(--pc-ink); cursor:pointer; padding:4px 2px; display:inline-flex; align-items:center; gap:6px; } .pq-link:hover { color:var(--pc-acc); }
.pq-dot { display:inline-grid; place-items:center; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:#2f9e44; color:#fff; font-size:11px; font-weight:800; animation:pqpulse 1.6s ease-in-out infinite; }
@keyframes pqpulse { 50% { box-shadow:0 0 0 5px rgba(47,158,68,.18); } }
.pq-cart .pq-n { display:inline-grid; place-items:center; min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:#fff; color:var(--pc-acc); font-size:11.5px; font-weight:800; }
.pc-vend { font-size:12px; font-weight:600 !important; color:var(--pc-muted) !important; }
.pc-addq { margin-top:8px; width:100%; padding:7px 10px; border:1px solid var(--pc-acc); border-radius:8px; background:#fff; color:var(--pc-acc); font:inherit; font-weight:800; font-size:12.5px; cursor:pointer; }
.pc-addq:hover { background:var(--pc-acc); color:#fff; } .pc-addq.ok { background:#2f9e44; border-color:#2f9e44; color:#fff; }
.pc-qty { display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:12.5px; } .pc-qty input { width:64px; padding:8px; border:1px solid var(--pc-line); border-radius:8px; font:inherit; }
.pc-detail-hint { font-size:12px; margin-top:8px; }
.pq-bg { position:fixed; inset:0; background:rgba(20,48,63,.38); z-index:80; opacity:0; pointer-events:none; transition:opacity .18s; } .pq-bg.open { opacity:1; pointer-events:auto; }
.pq-drawer { position:fixed; top:0; right:0; height:100vh; width:min(520px,100vw); background:#fff; color:#14303f; z-index:81; display:flex; flex-direction:column; transform:translateX(102%); transition:transform .22s ease; box-shadow:-14px 0 40px rgba(20,48,63,.2); font-size:14px; }
.pq-drawer.open { transform:none; }
.pq-head { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; border-bottom:1px solid #dde6ec; font-size:16px; }
.pq-x { border:0; background:transparent; font-size:18px; cursor:pointer; color:#6b7f8e; }
.pq-body { flex:1; overflow:auto; padding:14px 18px 22px; }
.pq-body .muted { color:#6b7f8e; }
.pq-body .pc-btn { display:inline-flex; align-items:center; gap:6px; padding:9px 14px; border:1px solid #dde6ec; border-radius:9px; background:#fff; color:#14303f; font:inherit; font-weight:700; cursor:pointer; text-decoration:none; }
.pq-body .pc-btn.primary { background:#0b7285; border-color:#0b7285; color:#fff; } .pq-body .pc-btn.sm { padding:5px 10px; font-size:12px; } .pq-body .pc-btn.ghost { background:transparent; }
.pq-body .pc-btn[disabled] { opacity:.6; cursor:default; }
.pq-items { display:flex; flex-direction:column; gap:8px; margin-bottom:12px; }
.pq-item { display:grid; grid-template-columns:52px minmax(0,1fr) auto auto; gap:10px; align-items:center; padding:8px; border:1px solid #dde6ec; border-radius:10px; }
.pq-img { width:52px; height:52px; border-radius:8px; background:#f2f6f8; display:grid; place-items:center; overflow:hidden; position:relative; } .pq-img img { width:100%; height:100%; object-fit:contain; position:absolute; inset:0; background:#fff; } .pq-img span { font-size:20px; }
.pq-info { min-width:0; font-size:13px; } .pq-info .muted { font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.pq-nombre { border:0; background:none; padding:0; font:inherit; font-weight:700; color:#14303f; text-align:left; cursor:pointer; display:block; } .pq-nombre[disabled] { cursor:default; } .pq-nombre:not([disabled]):hover { color:#0b7285; text-decoration:underline; }
.pq-precio { font-size:12.5px; margin-top:2px; }
.pq-tag { display:inline-block; padding:1px 8px; border-radius:999px; background:#f1f3f5; color:#6b7f8e; font-size:11px; font-weight:700; } .pq-tag.pedido { background:#e7f0ff; color:#1f4fa8; }
.pq-qty { display:flex; align-items:center; border:1px solid #dde6ec; border-radius:8px; overflow:hidden; } .pq-qty button { border:0; background:#f2f6f8; width:28px; height:30px; font-size:15px; cursor:pointer; color:#14303f; } .pq-qty input { width:38px; border:0; text-align:center; font:inherit; font-weight:700; }
.pq-del { border:0; background:transparent; color:#c92a2a; cursor:pointer; font-size:14px; }
.pq-lbl { display:block; font-size:12px; font-weight:700; color:#4a6070; margin:10px 0 4px; }
.pq-inp { width:100%; box-sizing:border-box; padding:9px 11px; border:1px solid #cfdbe3; border-radius:9px; font:inherit; color:#14303f; background:#fff; } .pq-inp:focus { outline:0; border-color:#0b7285; box-shadow:0 0 0 3px rgba(11,114,133,.12); }
.pq-libre { display:flex; gap:8px; margin:6px 0 4px; } .pq-libre .pq-inp { flex:1; }
.pq-total { display:flex; flex-direction:column; gap:3px; margin:14px 0 6px; padding:10px 12px; border-radius:10px; background:#f5f8fa; font-size:13px; } .pq-total .muted { font-size:12px; }
.pq-acts { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; margin-top:14px; }
.pq-big { width:100%; justify-content:center; padding:12px 14px !important; font-size:15px !important; margin-top:14px; }
.pq-small { font-size:11.5px; text-align:center; }
.pq-back { border:0; background:none; color:#0b7285; font:inherit; font-weight:700; cursor:pointer; padding:0 0 10px; }
.pq-intro { margin:0 0 6px; }
.pq-tipo { display:flex; flex-wrap:wrap; gap:6px 16px; margin:12px 0 2px; font-size:13px; } .pq-tipo label { display:flex; align-items:center; gap:6px; cursor:pointer; }
.pq-chk { display:flex; align-items:center; gap:7px; margin-top:12px; font-size:13px; cursor:pointer; }
.pq-crear { margin-top:10px; padding:10px 12px; border:1px dashed #cfdbe3; border-radius:10px; font-size:13px; } .pq-crear summary { cursor:pointer; font-weight:700; color:#0b7285; } .pq-crear .muted { font-size:12px; margin-top:6px; }
.pq-2 { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.pq-err { margin-top:12px; padding:9px 12px; border-radius:9px; background:#fdeaea; color:#a61e1e; font-size:13px; font-weight:600; }
.pq-linkbtn { border:0; background:none; color:#0b7285; font:inherit; font-weight:700; cursor:pointer; padding:0; text-decoration:underline; }
.pq-cuenta-ok, .pq-cuenta-box { padding:10px 12px; border-radius:10px; background:#eef7f9; font-size:13px; margin-bottom:10px; } .pq-cuenta-box { background:#f5f8fa; }
.pq-vacio, .pq-ok { text-align:center; padding:26px 8px; display:flex; flex-direction:column; align-items:center; gap:8px; } .pq-vacio .pq-libre { width:100%; }
.pq-ico { width:58px; height:58px; border-radius:50%; background:#f2f6f8; display:grid; place-items:center; font-size:28px; } .pq-ico.ok { background:#e3f6e8; color:#2f9e44; font-weight:900; }
.pq-ok p { margin:4px 0; }
.pq-cargando { padding:30px; text-align:center; }
.pq-leyenda { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 10px; }
.pq-lista { display:flex; flex-direction:column; gap:8px; }
.pq-sol { text-align:left; border:1px solid #dde6ec; border-left:5px solid var(--pw); border-radius:10px; background:#fff; padding:10px 12px; cursor:pointer; font:inherit; color:#14303f; display:flex; flex-direction:column; gap:4px; } .pq-sol:hover { box-shadow:0 6px 18px rgba(20,48,63,.1); }
.pq-sol-top { display:flex; align-items:center; gap:8px; flex-wrap:wrap; } .pq-sol .muted { font-size:12px; } .pq-sol-tot { font-size:13px; }
.pq-nuevo { background:#2f9e44; color:#fff; border-radius:999px; padding:1px 8px; font-size:11px; font-weight:800; }
.pq-venc { color:#c92a2a; font-weight:700; }
.pq-det-head { border-left:5px solid var(--pw); background:var(--pwb); border-radius:10px; padding:10px 12px; display:flex; flex-direction:column; gap:6px; } .pq-det-head p { margin:0; font-size:13px; }
.pq-validez { margin:12px 0 4px; padding:9px 12px; border-radius:10px; background:#fff4d6; font-weight:800; font-size:13.5px; } .pq-validez.venc { background:#fdeaea; color:#a61e1e; }
.pq-tab { width:100%; border-collapse:collapse; margin:10px 0; font-size:12.5px; } .pq-tab th, .pq-tab td { padding:6px; border-bottom:1px solid #e6edf1; text-align:left; vertical-align:top; } .pq-tab th { background:#f5f8fa; font-size:11.5px; color:#4a6070; } .pq-tab .r { text-align:right; white-space:nowrap; } .pq-tab .muted { font-size:11px; }
.pq-pedido { margin-top:12px; font-size:13px; } .pq-pedido summary { cursor:pointer; font-weight:700; } .pq-pedido ul { margin:6px 0; padding-left:18px; }
.pq-hist { margin-top:12px; border-left:2px solid #dde6ec; padding-left:12px; display:flex; flex-direction:column; gap:5px; font-size:12.5px; } .pq-hist span { color:#6b7f8e; margin-right:8px; font-size:11.5px; }
.pq-tabs { display:flex; gap:6px; margin-bottom:8px; } .pq-tabs button { flex:1; padding:9px; border:1px solid #dde6ec; border-radius:9px; background:#fff; font:inherit; font-weight:700; cursor:pointer; color:#14303f; } .pq-tabs button.on { background:#0b7285; border-color:#0b7285; color:#fff; }
.pq-toast { position:fixed; left:50%; bottom:22px; transform:translate(-50%,30px); opacity:0; background:#14303f; color:#fff; padding:10px 16px; border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.25); z-index:90; font-size:13.5px; transition:all .2s; pointer-events:none; max-width:92vw; } .pq-toast.on { opacity:1; transform:translate(-50%,0); pointer-events:auto; } .pq-toast a { color:#8fe0ee; font-weight:700; }
@media (max-width:760px) { .pq-headbox .pq-link { display:none; } .pq-item { grid-template-columns:44px minmax(0,1fr) auto; } .pq-del { grid-column:3; grid-row:1; } .pq-qty { grid-column:2; justify-self:start; } }

/* ---- dos formas de pedir la cotización: en la página o por WhatsApp ---- */
.pq-envio { margin-top:14px; display:flex; flex-direction:column; gap:8px; }
.pq-envio-tit { font-weight:800; font-size:13.5px; }
.pq-opcion { text-align:left; display:flex; flex-direction:column; gap:3px; padding:11px 13px; border:2px solid #0b7285; border-radius:12px; background:#f0f9fb; color:#14303f; font:inherit; cursor:pointer; }
.pq-opcion b { font-size:14.5px; color:#0b5e6e; } .pq-opcion span { font-size:12.5px; color:#4a6070; line-height:1.4; }
.pq-opcion:hover { background:#0b7285; } .pq-opcion:hover b, .pq-opcion:hover span { color:#fff; }
.pq-opcion.wa { border-color:#25a244; background:#effaf2; } .pq-opcion.wa b { color:#178a35; } .pq-opcion.wa:hover { background:#25a244; }

.pq-body { overflow-x:hidden; }
.pq-tab { table-layout:fixed; } .pq-tab th:nth-child(1) { width:46px; } .pq-tab th:nth-child(3) { width:68px; } .pq-tab th:nth-child(4), .pq-tab th:nth-child(5) { width:86px; }
.pq-tab td { overflow-wrap:anywhere; } .pq-tab td.r { overflow-wrap:normal; font-size:12px; }
.pq-tab td, .pq-tab th { white-space:normal; }
