/* Flacos Custom Food Trucks — Galería de proyectos (Featured Builds)
   Todo va bajo .builds / .b-* para no chocar con las clases de styles.css (.card, .badge, .btn…). */
.b-banner{background:#000;border-bottom:1px solid var(--line)}
.b-banner img{display:block;width:100%;height:auto;max-width:1920px;margin:0 auto}
.builds{padding:64px 0 90px}
.builds .b-kicker{display:block;color:var(--gold);font-weight:800;letter-spacing:6px;font-size:13px;text-transform:uppercase}
.builds h1{font-family:"Anton","Archivo",sans-serif;font-weight:400;font-size:clamp(38px,5vw,64px);letter-spacing:1px;line-height:1.1;margin:14px 0 10px}
.builds .b-sub{color:var(--muted);font-size:17px;max-width:640px;line-height:1.6}

.b-filters{display:flex;gap:10px;flex-wrap:wrap;margin:32px 0 28px}
.b-filters a{text-decoration:none;background:transparent;border:1px solid #333;color:var(--muted);padding:10px 22px;border-radius:999px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:.2s}
.b-filters a:hover{border-color:var(--gold);color:var(--text)}
.b-filters a.active{background:var(--red);border-color:var(--red);color:#fff}

.b-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media(max-width:900px){.b-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.b-grid{grid-template-columns:1fr}}

.b-card{background:var(--panel2);border-radius:14px;overflow:hidden;cursor:pointer;transition:transform .25s,box-shadow .25s;border:1px solid var(--line)}
.b-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(216,31,46,.18)}
.b-card:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.b-img{position:relative;aspect-ratio:4/3;overflow:hidden;background:#1c1c1f}
.b-img img{width:100%;height:100%;object-fit:cover;display:block}
.b-badge{position:absolute;top:12px;left:12px;background:var(--red);color:#fff;font-size:12px;font-weight:800;letter-spacing:1px;padding:6px 12px;border-radius:6px;text-transform:uppercase}
.b-body{padding:18px 20px 22px}
.b-body h3{font-size:20px;font-weight:800;margin-bottom:6px}
.b-body p{color:var(--muted);font-size:14px}

.b-card.b-template{border:2px dashed #3a3a3e;background:transparent;display:flex;align-items:center;justify-content:center;min-height:300px;cursor:default}
.b-card.b-template:hover{transform:none;box-shadow:none}
.b-template-inner{text-align:center;padding:30px;color:#777}
.b-template-inner .b-plus{font-size:44px;color:var(--gold);margin-bottom:10px}
.b-template-inner h3{color:#aaa;margin-bottom:8px}
.b-template-inner p{font-size:14px;line-height:1.6}

/* Modal (por encima del encabezado y del botón de WhatsApp) */
.b-modal{position:fixed;inset:0;background:rgba(0,0,0,.88);display:none;align-items:center;justify-content:center;padding:24px;z-index:100;backdrop-filter:blur(4px)}
.b-modal.open{display:flex}
.b-modal-box{background:#111114;border:1px solid #2a2a2e;border-radius:16px;max-width:1020px;width:100%;max-height:92vh;overflow-y:auto;position:relative;display:grid;grid-template-columns:1.1fr 1fr}
@media(max-width:800px){.b-modal-box{grid-template-columns:1fr}}
.b-close{position:absolute;top:14px;right:16px;background:#222;border:none;color:#fff;width:38px;height:38px;border-radius:50%;font-size:18px;cursor:pointer;z-index:2}
.b-close:hover{background:var(--red)}
.b-left{padding:26px}
/* contain: se ve la foto completa, sea horizontal o vertical (sin recortar) */
.b-main{border-radius:10px;overflow:hidden;aspect-ratio:4/3;background:#0b0b0c}
.b-main img{width:100%;height:100%;object-fit:contain;display:block}
.b-main img{cursor:zoom-in}
.b-main{position:relative}
.b-main[data-hint]::after{content:attr(data-hint);position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.65);color:#fff;font-size:12px;font-weight:700;letter-spacing:.5px;padding:6px 10px;border-radius:6px;pointer-events:none}
.b-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:10px}
.b-thumbs .th{aspect-ratio:1;border-radius:8px;overflow:hidden;cursor:pointer;border:2px solid transparent;background:#1c1c1f;position:relative}
.b-thumbs .th img{width:100%;height:100%;object-fit:cover;display:block}
.b-thumbs .th.active{border-color:var(--red)}
.b-thumbs .th.pending{border:2px dashed #3a3a3e;display:flex;align-items:center;justify-content:center;cursor:default}
.b-thumbs .th.pending span{font-size:9px;color:#666;letter-spacing:1px;text-align:center;padding:4px}
.b-right{padding:30px 30px 30px 6px}
@media(max-width:800px){.b-right{padding:6px 26px 30px}}
.b-right h2{font-family:"Anton","Archivo",sans-serif;font-weight:400;font-size:32px;letter-spacing:1px;margin:10px 0 4px}
.b-client{color:var(--gold-soft);font-size:14px;font-weight:700;margin-bottom:16px}
.b-story p.b-headline{color:#fff;font-size:18px;font-weight:800;line-height:1.35;margin-bottom:14px}
.b-story p{color:#d5d5d5;font-size:15px;line-height:1.7;margin-bottom:12px}
.b-specs{margin:20px 0;border-top:1px solid #2a2a2e}
.b-specs div{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid #2a2a2e;font-size:14px}
.b-specs div span:first-child{color:#888}
.b-specs div span:last-child{color:#fff;font-weight:700;text-align:right}
.b-cta{display:flex;gap:12px;margin-top:22px;flex-wrap:wrap}

/* Visor de pantalla completa */
.b-lb{position:fixed;inset:0;z-index:200;background:#000;display:none;align-items:center;justify-content:center}
.b-lb.open{display:flex}
.b-lb-img{max-width:94vw;max-height:88vh;object-fit:contain;display:block;border-radius:6px;user-select:none}
.b-lb-btn{position:absolute;background:rgba(40,40,44,.85);box-shadow:0 2px 10px rgba(0,0,0,.5);border:none;color:#fff;cursor:pointer;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s}
.b-lb-btn:hover{background:var(--red)}
.b-lb-btn:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.b-lb-close{top:16px;right:16px;width:44px;height:44px;font-size:20px}
.b-lb-prev,.b-lb-next{top:50%;transform:translateY(-50%);width:54px;height:54px;font-size:38px;line-height:1;padding-bottom:4px}
.b-lb-prev{left:16px}
.b-lb-next{right:16px}
.b-lb.single .b-lb-prev,.b-lb.single .b-lb-next{display:none}
.b-lb-count{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);color:#ddd;font-size:14px;font-weight:700;letter-spacing:1px;background:rgba(0,0,0,.5);padding:6px 12px;border-radius:999px}
@media(max-width:600px){.b-lb-prev,.b-lb-next{width:42px;height:42px;font-size:30px}.b-lb-prev{left:6px}.b-lb-next{right:6px}.b-lb-img{max-width:100vw;max-height:80vh;border-radius:0}}

/* Cierre de la galería (food-trucks) */
.b-outro{text-align:center;margin:72px auto 8px;padding-top:48px;border-top:1px solid var(--line);max-width:900px}
.b-outro p{margin:0;font-family:"Anton","Archivo",sans-serif;font-weight:400;letter-spacing:1px;line-height:1.15}
.b-outro-1{color:var(--text);font-size:clamp(26px,3.6vw,44px)}
.b-outro-2{color:var(--red);font-size:clamp(30px,4.4vw,56px);margin-top:10px !important}