/* ════════════════════════════════════════════════════════════════
   SEÑALÉTICAS DE SEGURIDAD · ficha de producto (2026-11-02)
   css/senaletica-ficha.css · lo usa /gigantografias/impresion-vinil-adhesivo/senaletica-seguridad/
   Se apoya en css/volantes-ficha.css (mismo diseño de ficha: .vf-*) y solo agrega
   lo propio de señaléticas (.sf-*): material con foto, medidas, lista de señales,
   catálogo en ventana y contenido informativo.
   ════════════════════════════════════════════════════════════════ */
.sf{ --sf-lima:#bdff06; --sf-ok:#12a150; }
.sf [hidden]{ display:none !important; }

/* ── Paso 1 · Material (tarjeta con foto) ── */
.sf-mats{ display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.sf-mat{ position:relative; display:block; margin:0; cursor:pointer; }
.sf-mat input{ position:absolute; opacity:0; pointer-events:none; }
.sf-mat-in{ display:flex; align-items:center; gap:10px; min-height:58px; padding:7px 10px; border:1.5px solid var(--vf-ln); border-radius:12px; background:#fff; }
.sf-mat-in b{ display:block; font-size:.86rem; line-height:1.2; }
.sf-mat-in small{ display:block; font-size:.68rem; line-height:1.25; color:var(--vf-mu); }
.sf-mat-ico{ flex:0 0 auto; display:grid; place-items:center; width:22px; height:22px; border-radius:50%; border:1.5px solid #c3c8ce; background:#fff; }
.sf-mat input:checked + .sf-mat-in{ border:2px solid #111; background:#fbfff0; box-shadow:inset 0 -3px 0 var(--sf-lima); }
.sf-mat input:checked + .sf-mat-in .sf-mat-ico{ border-color:var(--sf-ok); background:var(--sf-ok); }
.sf-mat input:checked + .sf-mat-in .sf-mat-ico::after{ content:""; width:6px; height:10px; margin-top:-2px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.sf-mat input:focus-visible + .sf-mat-in{ outline:2px solid var(--sf-ok); outline-offset:2px; }
.sf-mat:hover .sf-mat-in{ border-color:#9aa1a9; }

/* ── Paso 2 · Medidas ── */
.sf-meds{ display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:6px; }
.sf-med{ position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; min-height:56px; padding:5px 2px; border:1.5px solid var(--vf-ln); border-radius:11px; background:#fff; color:var(--vf-tx); font:inherit; cursor:pointer; text-align:center; line-height:1.15; }
.sf-med b{ font-size:.84rem; font-weight:800; white-space:nowrap; }
.sf-med small{ font-size:.62rem; color:var(--vf-mu); }
.sf-med:hover{ border-color:#9aa1a9; }
.sf-med.on{ border:2px solid #111; background:#fbfff0; box-shadow:inset 0 -3px 0 var(--sf-lima); }
.sf-med.on::before{ content:""; position:absolute; top:-7px; left:50%; width:16px; height:16px; margin-left:-8px; border-radius:50%; background:var(--sf-ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center/11px no-repeat; }
.sf-med--otra svg{ width:18px; height:18px; color:#111; }
.sf-med--otra small{ font-size:.62rem; white-space:nowrap; }
.sf-med:focus-visible{ outline:2px solid var(--sf-ok); outline-offset:2px; }
.sf-otra{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin-top:8px; padding:9px 10px; border-radius:11px; background:#f6f7f8; font-size:.8rem; color:var(--vf-mu); }
.sf-otra input{ width:70px; height:38px; padding:0 8px; border:1.5px solid var(--vf-ln); border-radius:9px; background:#fff; font:700 .92rem "DM Sans",system-ui,sans-serif; color:var(--vf-tx); text-align:center; }
.sf-otra input:focus{ outline:0; border-color:#111; }
.sf-otra-msg{ flex:1 1 100%; margin:0; font-size:.74rem; }
.sf-otra-msg.mal{ color:#b42318; font-weight:600; }
.sf-min{ margin:6px 0 0; font-size:.74rem; color:var(--vf-mu); }
.sf-min b{ color:var(--vf-tx); }

/* ── Paso 3 · Tus señales ── */
.sf-lista{ margin:0; padding:0 10px; list-style:none; border:1px solid var(--vf-ln); border-radius:12px; background:#fff; }
.sf-lista:empty{ display:none; }
.sf-li{ display:grid; grid-template-columns:40px minmax(0,1fr) auto 32px; align-items:center; gap:10px; margin:0; padding:8px 0; border-bottom:1px solid #eef0f2; }
.sf-li:last-child{ border-bottom:0; }
.sf-li::before{ display:none !important; }
.sf-li-img{ display:grid; place-items:center; width:40px; height:40px; border-radius:7px; background:#fff; border:1px solid #eef0f2; overflow:hidden; }
.sf-li-img img{ display:block; width:36px; height:36px; object-fit:contain; }
.sf-li-img svg{ width:22px; height:22px; color:#5f6670; }
.sf-li-txt{ min-width:0; }
.sf-li-txt b{ display:block; font-size:.84rem; font-weight:700; line-height:1.25; color:var(--vf-tx); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sf-li-med{ display:inline-block; max-width:100%; margin-top:2px; padding:0 18px 0 6px; height:22px; border:1px solid var(--vf-ln); border-radius:6px; background:#fafbfc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f6670' stroke-width='2.6'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 4px center/11px no-repeat; color:var(--vf-mu); font:600 .7rem "DM Sans",system-ui,sans-serif; -webkit-appearance:none; appearance:none; cursor:pointer; }
.sf-li-med:focus{ outline:0; border-color:#111; }
.sf-li-arch{ display:block; font-size:.68rem; color:var(--vf-mu); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sf-cnt{ display:flex; align-items:center; height:36px; border:1.5px solid var(--vf-ln); border-radius:9px; background:#fff; overflow:hidden; }
.sf-cnt button{ width:30px; height:100%; padding:0; border:0; background:#f4f5f6; color:#111; font-size:1.05rem; font-weight:700; cursor:pointer; line-height:1; }
.sf-cnt button:hover{ background:var(--sf-lima); }
.sf-cnt input{ width:44px; height:100%; padding:0; border:0; text-align:center; font:700 .92rem "DM Sans",system-ui,sans-serif; color:var(--vf-tx); background:#fff; -moz-appearance:textfield; }
.sf-cnt input::-webkit-outer-spin-button, .sf-cnt input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.sf-cnt span{ padding:0 8px 0 2px; font-size:.72rem; color:var(--vf-mu); }
.sf-li-x{ display:grid; place-items:center; width:32px; height:32px; padding:0; border:0; border-radius:8px; background:none; color:#7a8088; cursor:pointer; }
.sf-li-x:hover{ background:#fdecea; color:#b42318; }
.sf-li-x svg{ width:18px; height:18px; }

.sf-vacio{ padding:12px; border:1.5px dashed #cfd4da; border-radius:12px; background:#fafbfc; }
.sf-vacio p{ margin:0 0 8px; font-size:.8rem; color:var(--vf-mu); }
.sf-pop{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; }
.sf-pop button{ display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 3px; border:1px solid var(--vf-ln); border-radius:10px; background:#fff; cursor:pointer; font:inherit; }
.sf-pop button:hover{ border-color:#111; }
.sf-pop img{ width:40px; height:40px; object-fit:contain; }
.sf-pop span{ font-size:.6rem; line-height:1.15; color:var(--vf-tx); text-align:center; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }

.sf-add{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:46px; margin:8px 0 0; padding:0 14px; border:2px solid #111; border-radius:11px; background:#fff; color:#111; font:800 .92rem "DM Sans",system-ui,sans-serif; cursor:pointer; }
.sf-add:hover{ background:#fbfff0; box-shadow:inset 0 -3px 0 var(--sf-lima); }
.sf-add svg{ width:18px; height:18px; color:var(--sf-ok); }
.sf-sum{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin:8px 0 0; padding:9px 12px; border-radius:10px; background:#f4f5f6; font-size:.84rem; color:var(--vf-tx); }
.sf-sum b{ font-weight:800; }
.sf-sum button{ border:0; background:none; padding:0; color:#1a5fd0; font:600 .76rem "DM Sans",system-ui,sans-serif; text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
.sf-aviso{ margin:8px 0 0; padding:9px 11px; border-radius:10px; font-size:.78rem; line-height:1.4; }
.sf-aviso--min{ background:#fff8e6; border:1px solid #f3e2b3; color:#6b5a2e; }
.sf-aviso--tip{ background:#f1fbe0; border:1px solid #d9f0a8; color:#33511a; }
.sf-aviso--mal{ background:#fdecea; border:1px solid #f6c9c4; color:#8a1c12; }
.sf-aviso button{ margin-left:4px; padding:3px 9px; border:1.5px solid currentColor; border-radius:7px; background:#fff; color:inherit; font:700 .74rem "DM Sans",system-ui,sans-serif; cursor:pointer; }

.sf-extra{ margin:10px 0 0; border:1px solid var(--vf-ln); border-radius:11px; background:#fff; }
.sf-extra summary{ padding:10px 12px; font-size:.8rem; font-weight:700; cursor:pointer; list-style:none; color:var(--vf-tx); }
.sf-extra summary::-webkit-details-marker{ display:none; }
.sf-extra summary span{ font-weight:500; color:var(--vf-mu); }
.sf-extra-in{ display:grid; gap:8px; padding:0 12px 12px; }
.sf-extra textarea{ width:100%; min-height:62px; padding:8px 10px; border:1.5px solid var(--vf-ln); border-radius:9px; font:inherit; font-size:.84rem; resize:vertical; }
.sf-extra label{ display:flex; align-items:flex-start; gap:8px; font-size:.8rem; color:var(--vf-tx); }
.sf-extra small{ font-size:.72rem; color:var(--vf-mu); }

/* Precio «por configurar» */
.sf .vf-res-precio b.sf-pend{ font-size:clamp(1.25rem,2vw,1.5rem); }

/* ── Galería: «Ver catálogo completo» como última miniatura ── */
.sf-th-cat{ display:flex !important; flex-direction:column; align-items:center; justify-content:center; gap:3px; padding:4px; border:1.5px solid var(--vf-ln) !important; background:#fff; color:#111; font:700 .58rem/1.15 "DM Sans",system-ui,sans-serif; text-align:center; }
.sf-th-cat svg{ width:20px; height:20px; }
.sf-gal-cat{ position:absolute; right:12px; bottom:12px; z-index:2; display:inline-flex; align-items:center; gap:7px; min-height:38px; padding:0 14px; border:0; border-radius:999px; background:rgba(17,17,17,.88); color:#fff; font:700 .8rem "DM Sans",system-ui,sans-serif; cursor:pointer; }
.sf-gal-cat:hover{ background:#111; }
.sf-gal-cat svg{ width:16px; height:16px; color:var(--sf-lima); }

/* ── Ventana: catálogo de señales ── */
html.sfc-abierto, html.sfc-abierto body{ overflow:hidden !important; }
.sfc{ position:fixed; inset:0; z-index:99990; display:flex; align-items:center; justify-content:center; padding:20px; font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; color:#15171a; }
.sfc[hidden], .sfc [hidden]{ display:none !important; }
.sfc *{ box-sizing:border-box; }
.sfc-fondo{ position:absolute; inset:0; background:rgba(15,17,20,.55); }
.sfc-caja{ position:relative; display:flex; flex-direction:column; width:min(920px,100%); height:min(86vh,760px); border-radius:18px; background:#fff; box-shadow:0 30px 80px rgba(0,0,0,.35); overflow:hidden; }
.sfc-cab{ padding:16px 18px 10px; border-bottom:1px solid #e3e6ea; }
.sfc-fila{ display:flex; align-items:center; gap:10px; }
.sfc-h{ flex:1; margin:0; font:800 1.15rem/1.2 "DM Sans",system-ui,sans-serif; color:#15171a; text-transform:none; letter-spacing:-.01em; }
.sfc-x{ display:grid; place-items:center; width:38px; height:38px; padding:0; border:0; border-radius:50%; background:#f1f2f4; color:#111; cursor:pointer; }
.sfc-x:hover{ background:#e3e6ea; }
.sfc-sub{ margin:2px 0 10px; font-size:.8rem; color:#5f6670; }
.sfc-buscar{ position:relative; display:block; }
.sfc-buscar svg{ position:absolute; left:12px; top:50%; width:18px; height:18px; margin-top:-9px; color:#7a8088; }
.sfc-buscar input{ width:100%; height:44px; padding:0 12px 0 38px; border:1.5px solid #e3e6ea; border-radius:11px; font:inherit; font-size:.92rem; background:#fafbfc; }
.sfc-buscar input:focus{ outline:0; border-color:#111; background:#fff; }
.sfc-cats{ display:flex; gap:6px; margin-top:10px; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; }
.sfc-cats::-webkit-scrollbar{ display:none; }
.sfc-cats button{ flex:0 0 auto; min-height:34px; padding:0 13px; border:1.5px solid #e3e6ea; border-radius:999px; background:#fff; color:#15171a; font:600 .8rem "DM Sans",system-ui,sans-serif; cursor:pointer; white-space:nowrap; }
.sfc-cats button:hover{ border-color:#111; }
.sfc-cats button.on{ border-color:#111; background:#111; color:#fff; }
.sfc-cats .sfc-cat-propia{ border-style:dashed; }
.sfc-cuerpo{ flex:1; overflow-y:auto; padding:14px 18px 18px; -webkit-overflow-scrolling:touch; }
.sfc-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); gap:10px; }
.sfc-it{ position:relative; display:flex; flex-direction:column; align-items:center; gap:6px; padding:10px 8px 9px; border:1.5px solid #e3e6ea; border-radius:12px; background:#fff; color:#15171a; font:inherit; cursor:pointer; text-align:center; }
.sfc-it:hover{ border-color:#9aa1a9; }
.sfc-it img{ width:76px; height:76px; object-fit:contain; }
.sfc-it b{ font-size:.74rem; font-weight:600; line-height:1.25; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.sfc-it small{ font-size:.64rem; color:#7a8088; }
.sfc-it .sfc-ok{ position:absolute; top:6px; right:6px; display:grid; place-items:center; width:22px; height:22px; border-radius:50%; border:1.5px solid #c3c8ce; background:#fff; }
.sfc-it.on{ border:2px solid #111; background:#fbfff0; box-shadow:inset 0 -3px 0 #bdff06; }
.sfc-it.on .sfc-ok{ border-color:#12a150; background:#12a150; }
.sfc-it.on .sfc-ok::after{ content:""; width:5px; height:9px; margin-top:-2px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.sfc-it:focus-visible{ outline:2px solid #12a150; outline-offset:2px; }
.sfc-vacio{ padding:30px 10px; text-align:center; font-size:.9rem; color:#5f6670; }
.sfc-propia{ max-width:560px; margin:0 auto; display:grid; gap:12px; }
.sfc-propia h3{ margin:0; font:800 1.02rem/1.3 "DM Sans",system-ui,sans-serif; color:#15171a; text-transform:none; }
.sfc-propia p{ margin:0; font-size:.84rem; line-height:1.5; color:#5f6670; }
.sfc-propia label{ display:grid; gap:5px; font-size:.8rem; font-weight:700; color:#15171a; }
.sfc-propia input[type="text"]{ height:44px; padding:0 12px; border:1.5px solid #e3e6ea; border-radius:10px; font:inherit; font-size:.92rem; }
.sfc-propia input[type="text"]:focus{ outline:0; border-color:#111; }
.sfc-up{ display:flex !important; align-items:center; gap:10px; padding:14px; border:1.5px dashed #b9bfc6; border-radius:12px; background:#fafbfc; cursor:pointer; font-weight:600 !important; }
.sfc-up:hover{ border-color:#111; }
.sfc-up svg{ flex:0 0 auto; width:24px; height:24px; }
.sfc-up small{ display:block; font-weight:400; color:#5f6670; font-size:.74rem; }
.sfc-nota{ padding:10px 12px; border-radius:10px; background:#fff8e6; border:1px solid #f3e2b3; color:#6b5a2e !important; font-size:.78rem !important; }
.sfc-pie{ display:flex; align-items:center; gap:12px; padding:12px 18px; padding-bottom:calc(12px + env(safe-area-inset-bottom,0px)); border-top:1px solid #e3e6ea; background:#fff; }
.sfc-pie-t{ flex:1; font-size:.84rem; color:#5f6670; }
.sfc-pie-t b{ color:#15171a; }
.sfc-ok-btn{ min-height:48px; padding:0 22px; border:0; border-radius:11px; background:#22c55e; color:#fff; font:800 .95rem "DM Sans",system-ui,sans-serif; cursor:pointer; }
.sfc-ok-btn:hover{ background:#16a34a; }
.sfc-ok-btn:disabled{ background:#c9ced4; cursor:default; }
@media (max-width:640px){
  .sfc{ padding:0; align-items:stretch; }
  .sfc-caja{ width:100%; height:100%; max-height:none; border-radius:0; }
  .sfc-cab{ padding:12px 14px 8px; }
  .sfc-cuerpo{ padding:12px 14px 16px; }
  .sfc-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .sfc-it{ padding:8px 4px 7px; }
  .sfc-it img{ width:58px; height:58px; }
  .sfc-it b{ font-size:.68rem; }
  .sfc-pie{ padding:10px 14px; padding-bottom:calc(10px + env(safe-area-inset-bottom,0px)); }
  .sfc-ok-btn{ flex:0 0 auto; }
}

/* ── Contenido informativo (debajo del producto) ── */
.sf-cont{ margin:40px 0 0; text-align:left; }
.sf-cont h2, .sf-cont h3, .sf-cont p{ text-align:left; }
.sf .sf-h2{ margin:0 0 8px; font:800 clamp(1.25rem,2.2vw,1.6rem)/1.2 "DM Sans",system-ui,sans-serif; color:var(--vf-tx); text-transform:none; letter-spacing:-.01em; }
.sf .sf-h3{ margin:0 0 4px; font:800 .98rem/1.3 "DM Sans",system-ui,sans-serif; color:var(--vf-tx); text-transform:none; }
.sf-blq{ padding:30px 0; border-top:1px solid var(--vf-ln); }
.sf-blq > p, .sf-lead{ max-width:820px; margin:0 0 12px; font-size:.95rem; line-height:1.65; color:#3b3f45; }
.sf-blq a{ color:#111; font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.sf-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:14px 0 0; padding:0; list-style:none; }
.sf-cards > li{ list-style:none; margin:0; padding:14px 16px; border:1px solid var(--vf-ln); border-radius:14px; background:#fff; }
.sf-cards > li::before{ display:none !important; }
.sf-cards p{ margin:0; font-size:.86rem; line-height:1.5; color:#4a4f56; }
.sf-tipos{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:14px 0 0; }
.sf-tipo{ position:relative; padding:14px 14px 12px; border:1px solid var(--vf-ln); border-radius:14px; background:#fff; overflow:hidden; }
.sf-tipo::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--c,#111); }
.sf-tipo p{ margin:4px 0 0; font-size:.8rem; line-height:1.45; color:#4a4f56; }
.sf-tipo button{ margin-top:8px; padding:0; border:0; background:none; color:#1a5fd0; font:600 .78rem "DM Sans",system-ui,sans-serif; text-decoration:underline; text-underline-offset:2px; cursor:pointer; }
.sf-tab-scroll{ overflow-x:auto; margin:14px 0 0; }
.sf-tab{ width:100%; max-width:820px; border-collapse:collapse; font-size:.88rem; }
.sf-tab th, .sf-tab td{ padding:9px 12px; border-bottom:1px solid var(--vf-ln); text-align:left; white-space:nowrap; }
.sf-tab th{ font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; color:var(--vf-mu); background:#fafbfc; }
.sf-tab td:last-child, .sf-tab th:last-child{ text-align:right; }
.sf-usos{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin:14px 0 0; }
.sf-uso{ display:flex; flex-direction:column; border:1px solid var(--vf-ln); border-radius:14px; background:#fff; overflow:hidden; }
.sf-uso a.swipebox{ display:block; aspect-ratio:4/3; overflow:hidden; background:#f4f5f6; }
.sf-uso img{ display:block; width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.sf-uso a.swipebox:hover img{ transform:scale(1.04); }
.sf-uso div{ padding:12px 14px 14px; }
.sf-uso p{ margin:4px 0 0; font-size:.84rem; line-height:1.5; color:#4a4f56; }
.sf-faq{ max-width:860px; margin:10px 0 0; }
.sf-faq details{ border-bottom:1px solid var(--vf-ln); }
.sf-faq summary{ padding:13px 26px 13px 0; cursor:pointer; list-style:none; position:relative; }
.sf-faq summary::-webkit-details-marker{ display:none; }
.sf-faq summary::after{ content:"+"; position:absolute; right:4px; top:50%; margin-top:-12px; font-size:1.3rem; font-weight:700; line-height:24px; }
.sf-faq details[open] summary::after{ content:"−"; }
.sf .sf-faq-h{ display:inline; margin:0; font:700 .95rem/1.4 "DM Sans",system-ui,sans-serif; color:var(--vf-tx); text-transform:none; }
.sf-faq p{ margin:0 0 14px; font-size:.9rem; line-height:1.6; color:#3b3f45; }
.sf-nota-norma{ max-width:820px; margin:12px 0 0; padding:10px 12px; border-radius:10px; background:#f6f7f8; font-size:.8rem !important; color:#5f6670 !important; }
@media (max-width:980px){ .sf-tipos{ grid-template-columns:repeat(2,minmax(0,1fr)); } .sf-cards, .sf-usos{ grid-template-columns:1fr 1fr; } }
@media (max-width:640px){
  .sf-meds{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .sf-med{ min-height:50px; }
  .sf-li{ grid-template-columns:38px minmax(0,1fr) auto; gap:8px; }
  .sf-li-x{ grid-column:3; grid-row:1; justify-self:end; width:28px; height:28px; }
  .sf-li .sf-cnt{ grid-column:2 / 4; grid-row:2; justify-self:start; }
  .sf-li-txt{ grid-column:2; }
  .sf-li-img{ grid-row:1 / 3; align-self:start; }
  .sf-pop{ grid-template-columns:repeat(5,minmax(0,1fr)); gap:4px; }
  .sf-pop img{ width:32px; height:32px; }
  .sf-cards, .sf-usos, .sf-tipos{ grid-template-columns:1fr; }
  .sf-blq{ padding:24px 0; }
}

/* Barra inferior del celular (misma de volantes, con su propio id) */
#sf-bar{ display:none; }
@media (max-width:980px){ #sf-bar{ display:block; } body{ padding-bottom:84px; } }
html.sf-res-vista #sf-bar{ transform:translateY(110%); visibility:hidden; }
/* Con el catálogo abierto no se superponen el asistente, la barra ni los botones flotantes */
html.sfc-abierto .rs-chat-nudge, html.sfc-abierto .rs-chat-lanzador, html.sfc-abierto #sf-bar, html.sfc-abierto .rs-rail-wa, html.sfc-abierto .btn-whatsapp{ display:none !important; }
/* 2026-11-02 · Ancho completo como Volantes (main.css limita #contenedor a una columna angosta) */
html body{ overflow-x:hidden; }
#contenedor, #contenedor2{ width:100% !important; max-width:100% !important; min-width:0 !important; margin:0 auto !important; padding:0 !important; overflow:visible !important; float:none !important; }
#basic-accordian{ width:100vw !important; max-width:100vw !important; position:relative !important; left:50% !important; margin:0 -50vw 0 -50vw !important; padding:0 !important; float:none !important; }
@media (min-width:641px){ #breadCrumbs{ display:flex !important; flex-wrap:wrap; align-items:center; width:100% !important; margin:0 !important; background:transparent !important; border:0 !important; } #breadCrumbs div{ display:flex; align-items:center; } }
.sf.vf{ padding-top:22px; }
/* Igual que trípticos: ficha de 1240 px y foto grande */
.sf .vf-wrap{ max-width:1240px; }
@media (min-width:981px){
  .sf .vf-grid{ grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); gap:0 36px; }
  .sf .vf-gal{ grid-template-columns:58px minmax(0,1fr); }
  .sf .vf-gal-main{ aspect-ratio:4/3; }
}
#breadCrumbs{ padding:14px max(20px, calc((100vw - 1240px) / 2 + 20px)) 0 !important; }
.sf .sf-th-cat span{ position:static; padding:0; background:none; color:#111; font-size:.6rem; font-weight:700; }
/* 2026-11-02 (b) · Compra por material, medida y cantidad (como trípticos); modelos opcionales */
.sf .sf-q{ max-width:260px; }
.sf .sf-q .vf-cont-n input{ width:84px !important; font-size:1rem; font-weight:800; }
.sf-resumen{ margin:12px 0 0; padding:10px 14px; border-radius:12px; background:#f6f7f8; font-size:.86rem; }
.sf-resumen > div{ display:flex; justify-content:space-between; gap:10px; padding:3px 0; color:var(--vf-mu); }
.sf-resumen b{ color:var(--vf-tx); font-weight:700; }
.sf-resumen .sf-resumen-t{ margin-top:4px; padding-top:7px; border-top:1px solid #e3e6ea; font-size:1rem; color:var(--vf-tx); }
.sf-resumen .sf-resumen-t b{ font-weight:800; }
.sf-resumen .sf-resumen-u{ font-size:.78rem; }
.sf .vf-res-pie{ line-height:1.5; }
.sf-catbar{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; margin:12px 0 0; }
.sf-catbar .sf-add--cat{ width:auto; margin:0; padding:0 20px; }
.sf-catbar p{ flex:1 1 260px; margin:0; font-size:.84rem; color:var(--vf-mu); }
.sf-elegidos{ max-width:640px; margin:14px 0 0; }
.sf-elegidos-cab{ display:flex; justify-content:space-between; align-items:center; margin:0 0 6px; font-size:.9rem; }
.sf-elegidos-cab button{ border:0; background:none; padding:0; color:#1a5fd0; font:600 .78rem "DM Sans",system-ui,sans-serif; text-decoration:underline; cursor:pointer; }
.sf .sf-li--mod{ grid-template-columns:40px minmax(0,1fr) 32px; }
@media (max-width:640px){ .sf .sf-li--mod .sf-li-x{ grid-column:3; } .sf .sf-li--mod .sf-li-img{ grid-row:auto; } .sf-catbar .sf-add--cat{ width:100%; } }