/* Portada: la Landing del lienzo "Ferretería Burgos — Web" (Landing y LandingMovil). */
html:has(body.bb-pagina-portada),body.bb-pagina-portada{background:#f3f3f1}
.bb-portada{background:#fff;color:#171717;font-family:"Geist",Arial,sans-serif;-webkit-font-smoothing:antialiased}
.bb-portada [hidden]{display:none!important}
.bb-portada a{color:#171717}.bb-portada a:hover{color:#567d12}
.bb-portada svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lp-w{--m:max(80px,calc((100vw - 1280px) / 2));display:flex;flex-direction:column;gap:56px;padding:140px var(--m) 80px;box-sizing:border-box;overflow-x:clip}
.lp-w h1,.lp-w h2,.lp-w h3,.lp-w p{margin:0}
.lp-ojo{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#717171}
.lp-h2{font-size:24px;line-height:1.2;letter-spacing:-.02em;font-weight:700}
.lp-cab{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:24px}
.bb-portada .lp-mas{font-size:14px;font-weight:500;color:#171717;text-decoration:none;display:inline-flex;align-items:center;gap:4px}
.bb-portada .lp-mas:hover{color:#567d12}
.bb-portada .lp-btn{white-space:nowrap;display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 24px;border-radius:8px;background:#171717;color:#fff;font-size:15px;font-weight:600;text-decoration:none;box-sizing:border-box}
.bb-portada .lp-btn:hover{background:#cfe77a;color:#171717}
.bb-portada .lp-btn-2{background:#fff;color:#171717;box-shadow:inset 0 0 0 1px #d4d4d0}
.bb-portada .lp-btn-2:hover{background:#fff;color:#171717;box-shadow:inset 0 0 0 1px #171717}
.lp-iva{font-style:normal;font-size:11px;font-weight:500;letter-spacing:0;margin-left:5px;opacity:.65;white-space:nowrap}

/* Banner a sangre: pasa bajo la barra; textos abajo y puntos al centro */
.lp-hero{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;margin:-140px calc(-1 * var(--m)) 0;padding:140px var(--m) 0;height:860px;box-sizing:border-box;background:#f3f3f1;isolation:isolate}
.lp-lam{grid-column:1 / -1;grid-row:1;display:grid;grid-template-columns:subgrid;align-items:center;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s .6s}
.lp-lam.on{opacity:1;visibility:visible;transition:opacity .6s ease}
.lp-hero-txt{grid-column:1 / span 5;display:flex;flex-direction:column;align-items:flex-start;gap:20px;align-self:end;padding-bottom:44px}
.lp-h1{font-size:52px;line-height:1.04;letter-spacing:-.035em;font-weight:700;color:#171717}
.lp-lead{font-size:17px;line-height:1.55;color:#555;max-width:420px}
.lp-hero-acc{display:flex;gap:12px;margin-top:8px}
.bb-portada .lp-hero-img{grid-column:7 / span 6;height:520px;align-self:end;border-radius:12px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;text-decoration:none}
.lp-hero-img img{width:72%;height:72%;object-fit:contain;mix-blend-mode:multiply;transform:translateY(8px);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.lp-lam.on .lp-hero-img img{transform:none}
.lp-hero-precio{position:absolute;left:24px;bottom:24px;display:flex;flex-direction:column;gap:2px;font-size:13px;color:#555}
.lp-hero-precio strong{font-size:20px;color:#171717;font-weight:700}
.lp-hero-dots{position:absolute;left:50%;bottom:0;transform:translateX(-50%);display:flex;gap:8px;padding-bottom:16px}
.lp-hero-dots button{width:16px;height:3px;padding:0;border:0;border-radius:2px;background:#d4d4d0;cursor:pointer;transition:width .3s,background .3s}
.lp-hero-dots button.on{width:32px;background:#171717}

/* Confianza */
.lp-confia{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;padding:24px 0;border-top:1px solid #ececea;border-bottom:1px solid #ececea;margin-top:-24px}
.lp-confia div{display:flex;gap:12px;align-items:center;font-size:14px;line-height:1.4}
.lp-confia img{flex:none;width:64px;height:30px;object-fit:contain;filter:grayscale(1) brightness(.35) contrast(1.2);opacity:.85;transition:filter .25s ease,opacity .25s ease}
.lp-confia div:hover img{filter:none;opacity:1}
.lp-confia .lp-lg-wp{width:84px;height:34px}
.lp-confia .lp-lg-mp{width:84px;height:40px}
.lp-confia .lp-lg-sii{width:40px;height:34px}
.lp-confia span{display:block;color:#717171;font-size:13px}

/* Familias: fila que da la vuelta y se arrastra */
.lp-fam-sec{margin-top:-24px}
.lp-fam-marco{display:flex;gap:16px;overflow-x:auto;scrollbar-width:none;cursor:grab;user-select:none;-webkit-user-select:none;overscroll-behavior-x:contain}
.lp-fam-marco::-webkit-scrollbar{display:none}
.lp-fam-marco.lp-arrastrando{cursor:grabbing}
.lp-fam-marco.lp-arrastrando .lp-fam{pointer-events:none}
.bb-portada .lp-fam{flex:0 0 calc((100% - 112px) / 8);display:flex;flex-direction:column;gap:10px;text-decoration:none}
.lp-fam-img{aspect-ratio:1 / 1;border-radius:12px;background:#f3f3f1;display:flex;align-items:center;justify-content:center;overflow:hidden}
.lp-fam-img img{width:72%;height:72%;object-fit:contain;mix-blend-mode:multiply;transition:transform .4s ease;-webkit-user-drag:none}
.lp-fam:hover .lp-fam-img img{transform:scale(1.06)}
.lp-fam strong{font-size:13px;font-weight:600;text-align:center}

/* Botón de precio: el + tiene su columna y otra igual al otro lado */
.bb-portada .lp-precio{position:relative;width:100%;display:grid;grid-template-columns:30px minmax(0,1fr) 30px;grid-template-rows:auto auto;align-content:center;column-gap:8px;row-gap:2px;min-height:62px;margin-top:8px;padding:8px 12px;box-sizing:border-box;border:1px solid #e2e2df;border-radius:8px;background:#fff;color:#171717;font:inherit;text-align:center;cursor:pointer;transition:background .2s ease,color .2s ease,border-color .2s ease}
.lp-precio b{grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;column-gap:5px;min-width:0;font-size:20px;font-weight:700;line-height:1.1}
.lp-precio b .lp-iva{margin-left:0}
.lp-precio i{grid-column:2;grid-row:2;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-style:normal;font-size:12px;color:#717171;transition:color .2s ease}
.lp-mas-ic{grid-column:3;grid-row:1 / span 2;align-self:center;justify-self:end;width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.18);opacity:0;transform:scale(.8);transition:opacity .2s ease,transform .2s ease}
.bb-portada .lp-mas-ic svg{width:16px;height:16px;stroke:#fff;stroke-width:2.4}
.lp-item:hover .lp-precio:not(:disabled),.lp-cv:hover .lp-precio:not(:disabled),.lp-precio:focus-visible{background:#8a8a86;border-color:#8a8a86;color:#fff}
.lp-item:hover .lp-precio:not(:disabled) i,.lp-cv:hover .lp-precio:not(:disabled) i,.lp-precio:focus-visible i{color:rgba(255,255,255,.85)}
.lp-item:hover .lp-precio:not(:disabled) .lp-mas-ic,.lp-cv:hover .lp-precio:not(:disabled) .lp-mas-ic,.lp-precio:focus-visible .lp-mas-ic{opacity:1;transform:none}
.bb-portada .lp-precio:not(:disabled):hover{background:#6f6f6b;border-color:#6f6f6b}
.bb-portada .lp-precio:disabled{cursor:default;color:#8a8a86}

/* Combos en vertical 9:16 */
.lp-cv-sec{position:relative;margin-top:-24px}
.bb-portada .lp-cv-fl{position:absolute;z-index:3;top:42%;width:44px;height:44px;display:flex;align-items:center;justify-content:center;padding:0;border:1px solid #e2e2df;border-radius:50%;background:#fff;color:#171717;cursor:pointer;box-shadow:0 4px 14px rgba(23,23,23,.08);transition:border-color .2s}
.bb-portada .lp-cv-fl:hover{border-color:#171717}
.lp-cv-fl-a{left:-22px}.lp-cv-fl-b{right:-22px}
.lp-cv-marco{overflow:hidden}
.lp-cv-fila{display:flex;margin-right:-24px;transition:transform .55s cubic-bezier(.4,0,.2,1)}
.lp-cv{position:relative;flex:0 0 calc(25% - 24px);margin-right:24px;aspect-ratio:9 / 16;box-sizing:border-box;display:flex;flex-direction:column;border:1px solid #d2d2ce;border-radius:12px;background:#fff;overflow:hidden;transition:border-color .2s}
.lp-cv:hover{border-color:#171717}
.bb-portada .lp-cv-img{text-decoration:none;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;padding:20px}
.lp-cv-img img{max-width:100%;max-height:100%;object-fit:contain;transition:transform .4s ease}
.lp-cv:hover .lp-cv-img img{transform:scale(1.03)}
.lp-cv-vacio{align-self:stretch;flex:1;display:flex;align-items:center;justify-content:center;border:1px dashed #e2e2df;border-radius:8px;font-size:12px;color:#a3a3a0}
.lp-cv-txt{flex:none;display:flex;flex-direction:column;gap:2px;padding:18px 20px 20px;text-align:center;align-items:center}
.lp-cv-txt small{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:#717171}
.bb-portada .lp-cv-nombre{font-size:15px;line-height:1.25;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#171717;text-decoration:none}
.bb-portada .lp-cv-nombre:hover{color:#171717;text-decoration:underline}
.lp-cv-incluye{font-size:12px;line-height:1.35;color:#717171;min-height:32px}
.bb-portada .lp-cv-precio{min-height:68px}
.lp-cv-precio b{font-size:22px}

/* Liquidación en recuadro gris */
.lp-liq{margin-top:-24px;background:#8a8a86;border-radius:16px;padding:0 28px 32px;color:#fff;box-shadow:0 14px 34px rgba(0,0,0,.22),0 3px 8px rgba(0,0,0,.12)}
.bb-portada .lp-liq-t{position:relative;height:84px;margin:0;display:flex;align-items:center;justify-content:center;padding-top:2px;box-sizing:border-box;font-family:"Barlow Condensed",sans-serif;font-size:38px;line-height:1;font-weight:700;letter-spacing:.02em;text-align:center;color:#fff}
.lp-liq-t span{position:absolute;top:14px;right:0;font-family:"Geist",Arial,sans-serif;font-size:14px;font-weight:400;letter-spacing:.01em;color:rgba(255,255,255,.92)}
.lp-liq-marco{overflow:hidden;border-radius:12px}
.lp-liq-fila{display:flex;margin-right:-20px;transition:transform .95s cubic-bezier(.45,0,.2,1)}
.lp-liq-fila .lp-prod{flex:0 0 calc(25% - 20px);margin-right:20px}

/* Tarjeta de producto con botón de precio (liquidación y filas) */
.lp-prod{display:flex;flex-direction:column;gap:4px;min-width:0;font-size:14px}
.lp-item{position:relative;box-sizing:border-box;padding:12px 12px 14px;background:#fff;border-radius:12px;color:#171717}
.bb-portada .lp-prod-img{position:relative;aspect-ratio:1 / 1;margin-bottom:10px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;text-decoration:none}
.lp-prod-img img{width:78%;height:78%;object-fit:contain;transition:transform .4s ease}
.lp-prod:hover .lp-prod-img img{transform:scale(1.04)}
.lp-item small{padding:0 4px;font-size:12px;color:#717171}
.bb-portada .lp-nombre{padding:0 4px;font-size:15px;font-weight:500;line-height:1.35;color:#171717;text-decoration:none;min-height:40px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.bb-portada .lp-nombre:hover{color:#171717;text-decoration:underline}
.lp-tag{position:absolute;z-index:2;top:12px;left:12px;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600;background:#171717;color:#fff}
.lp-tag-n{background:#cfe77a;color:#171717}
.lp-sello{position:absolute;z-index:2;display:flex;align-items:center;gap:6px;padding:0 10px 0 8px;border:1px solid #d2d2ce;border-radius:999px;background:#fff;font-size:11px;font-weight:600;color:#171717;white-space:nowrap}
.lp-sello-cuotas{bottom:10px;right:10px;height:24px}
.lp-sello-cuotas img{width:auto!important;height:14px!important;transform:none!important}
.lp-sello-gen{top:12px;left:12px;max-width:calc(100% - 24px);padding:6px 12px 6px 8px;border-radius:10px;white-space:normal;line-height:1.25;text-align:left}
.lp-sello-gen img{height:20px;width:auto;flex:0 0 auto}
.lp-fila .lp-item{border:1px solid #d2d2ce;gap:2px}
.lp-fila .lp-sello-gen~.lp-prod-img{margin-top:40px}
.lp-fila .lp-prod-img{margin-bottom:6px}
.lp-fila .lp-prod-img img{mix-blend-mode:multiply}
.lp-fila .lp-item small{text-align:center;text-transform:uppercase;font-size:14px;font-weight:700;letter-spacing:.06em;color:#171717}
.bb-portada .lp-fila .lp-nombre{text-align:center;font-size:13px;font-weight:400;line-height:1.3;color:#717171;min-height:34px}
.bb-portada .lp-fila .lp-nombre:hover{color:#171717}
.lp-fila .lp-precio{margin-top:6px}

/* Grillas */
.lp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 24px}
.bb-portada .lp-dest{display:flex;flex-direction:column;gap:4px;text-decoration:none;font-size:14px;min-width:0}
.lp-dest-img{position:relative;aspect-ratio:1 / 1;margin-bottom:12px;border-radius:12px;border:1px solid #ececea;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden}
.lp-dest-img img{width:78%;height:78%;object-fit:contain;transition:transform .4s ease}
.lp-dest:hover .lp-dest-img img{transform:scale(1.04)}
.bb-portada .lp-dest:hover{color:#171717}.lp-dest:hover h3{text-decoration:underline}
.lp-dest small{font-size:12px;color:#717171}
.lp-dest h3{font-size:15px;font-weight:500;line-height:1.35;color:#171717;letter-spacing:0;text-transform:none}
.lp-dest strong{margin-top:6px;font-size:18px;font-weight:700}
.lp-dest>em{font-style:normal;font-size:12px;color:#717171}

/* Asesoría: recuadro gris compacto */
.lp-ases{display:flex;flex-direction:column;gap:12px;width:532px;max-width:100%;box-sizing:border-box;padding:24px 28px;border-radius:16px;background:#717171;color:#fff}
.lp-ases>div{display:flex;flex-direction:column;gap:6px}
.lp-ases .lp-ojo{color:#e6e6e3}
.lp-ases h2{font-size:28px;letter-spacing:-.025em;font-weight:700;color:#fff}
.lp-ases p{font-size:14px;line-height:1.5;color:#f3f3f1}
.lp-ases-acc{flex-direction:row!important;gap:12px!important}
.bb-portada .lp-ases .lp-btn,.bb-portada .lp-ases .lp-btn-2{background:#fff;color:#717171;font-size:16px;box-shadow:none}
.bb-portada .lp-ases .lp-btn:hover{background:#cfe77a;color:#171717}

/* Más vendidos */
.lp-filas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 24px;border-top:1px solid #ececea}
.bb-portada .lp-item-v{display:grid;grid-template-columns:20px 64px 1fr;gap:14px;align-items:center;padding:14px 0;border-bottom:1px solid #ececea;text-decoration:none;font-size:13px}
.lp-item-v>em{font-style:normal;font-size:12px;color:#a3a3a0}
.lp-item-v img{width:64px;height:64px;object-fit:contain;padding:6px;box-sizing:border-box;border:1px solid #ececea;border-radius:8px;background:#fff}
.lp-item-v div{display:flex;flex-direction:column;gap:2px;min-width:0}
.lp-item-v span{font-weight:500;line-height:1.3;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.lp-item-v strong{font-size:14px}
.bb-portada .lp-item-v:hover{color:#171717}.lp-item-v:hover span{text-decoration:underline}

@media (min-width:901px) and (max-width:1199px){
.lp-hero-txt{grid-column:1 / span 6}
.lp-h1{font-size:42px}
.lp-hero-img{grid-column:7 / span 6}
.lp-confia{grid-template-columns:repeat(3,minmax(0,1fr))}
.lp-fam{flex-basis:calc((100% - 80px) / 6)}
.lp-cv{flex-basis:calc(33.333% - 24px)}
.lp-liq-fila .lp-prod{flex-basis:calc(33.333% - 20px)}
.lp-grid,.lp-filas{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
.lp-w{--m:16px;gap:40px;padding-top:112px;padding-bottom:48px}
.lp-hero{display:block;height:auto;min-height:732px;margin-top:-112px;padding-top:112px}
.lp-lam{display:flex;flex-direction:column-reverse;gap:24px;position:absolute;inset:112px var(--m) 24px}
.lp-lam.on{position:relative;inset:auto;padding-bottom:40px}
.lp-hero-txt{gap:14px;padding-bottom:0}
.lp-h1{font-size:34px}
.lp-lead{font-size:15px}
.lp-hero-acc{flex-direction:column;align-self:stretch}.bb-portada .lp-hero-acc .lp-btn{justify-content:center}
.bb-portada .lp-hero-img{height:300px}
.lp-confia{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px;margin-top:-16px}
.lp-cv-sec{margin-top:-16px}
.lp-fam-marco{gap:8px;margin-right:-16px}.bb-portada .lp-fam{flex-basis:calc((100% - 24px) / 3.6)}.lp-fam-sec{margin-top:-8px}
.bb-portada .lp-cv-fl{display:none}
.lp-cv-marco{margin-right:-16px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory}.lp-cv-marco::-webkit-scrollbar{display:none}
.lp-cv-fila{margin-right:0;transform:none!important;padding-right:16px}.lp-cv{margin-right:12px;flex-basis:76%;scroll-snap-align:start}
.lp-liq{margin-top:-16px;padding:0 16px 24px;border-radius:12px}
.lp-liq-t{font-size:24px;height:auto;min-height:64px;padding:30px 0 12px}
.lp-liq-t span{top:10px;right:auto;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12px}
.lp-liq-marco{overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory}.lp-liq-marco::-webkit-scrollbar{display:none}
.lp-liq-fila{transform:none!important;margin-right:0}.lp-liq-fila .lp-prod{flex-basis:46%;margin-right:8px;scroll-snap-align:start}
.lp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 8px}
.lp-filas{grid-template-columns:minmax(0,1fr)}
.lp-ases{width:auto;padding:24px 20px}
.lp-ases-acc{flex-direction:column!important}.bb-portada .lp-ases .lp-btn{justify-content:center}
.lp-precio b{font-size:17px}
}
@media (hover:none){.lp-mas-ic{opacity:1;transform:none;background:#8a8a86}}

/* 0.19: las tarjetas de la portada son las de la búsqueda (bs-prod) */
.lp-liq-fila .bs-prod{flex:0 0 calc(25% - 20px);margin-right:20px;border-color:#fff}
.lp-grid{gap:40px 20px}
.bb-portada .bs-prod a{text-decoration:none}
.bb-portada .bs-prod h3{font-size:14px;font-weight:500;line-height:1.35;letter-spacing:0;text-transform:none}
.bb-portada .bs-prod .lp-sello-gen{top:auto;bottom:10px;left:10px}
@media (min-width:901px) and (max-width:1199px){.lp-liq-fila .bs-prod{flex-basis:calc(33.333% - 20px)}.bb-portada .bs-iva{display:block;margin:2px 0 0}}
@media (max-width:900px){.lp-liq-fila .bs-prod{flex-basis:46%;margin-right:8px;scroll-snap-align:start}.lp-grid{gap:12px 8px}.bb-portada .bs-precio b{font-size:16px}.bb-portada .bs-iva{display:block;margin:2px 0 0}}