/* Ficha pública de taller y proveedor. Tres modelos (a, b, c), uno para escritorio (data-d) y otro para celular (data-m). */
.fx{--gap:24px;display:grid;margin-top:16px}
.fx img{max-width:100%}
.fx-media{margin:0;position:relative;min-width:0}
.fx-cover{width:100%;height:100%;object-fit:cover;display:block}
.fx-ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:220px;background:linear-gradient(135deg,#1e4e8c,#14283f);color:#fff;font:800 clamp(48px,9vw,96px) var(--display);letter-spacing:-.03em}
.fx-thumbs{display:none}
.fx-more{position:absolute;right:14px;bottom:14px;z-index:3;background:rgba(255,255,255,.95);border:1px solid var(--ink);border-radius:10px;padding:8px 14px;font:600 14px var(--sans);color:var(--ink);text-decoration:none}
.fx-head{min-width:0}
.fx-head h1{font-size:40px;line-height:1.08;font-weight:800;letter-spacing:-.03em}
.fx-sub{margin:8px 0 0;color:var(--steel);font-size:17px}
.fx-top{display:flex;gap:14px;align-items:center}
.fx-logo{width:72px;height:72px;border-radius:16px;object-fit:cover;background:#fff;border:1px solid var(--rule);flex:none}
.fx-meta{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;align-items:center;font-size:14px}
.fx-ok{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--chasis)}
.fx-open{display:inline-flex;align-items:center;gap:6px;font-weight:600;color:var(--ok)}
.fx-open:before{content:"";width:8px;height:8px;border-radius:50%;background:#1fa05a;box-shadow:0 0 0 4px rgba(31,160,90,.2)}
.fx-open.closed{color:var(--steel)}.fx-open.closed:before{background:#9aa3ae;box-shadow:none}
.fx-addr{display:inline-flex;align-items:center;gap:6px;color:var(--steel)}
.fx-act{display:flex;flex-wrap:wrap;gap:12px;align-items:center;min-width:0}
.fx-act .btn{min-height:50px;font-size:16px;padding:0 24px}
.btn-call{background:var(--chasis);color:#fff}.btn-call:hover{background:#163c6c;color:#fff}
.fx-lbl{font:500 11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--steel);flex-basis:100%;margin:4px 0 -6px}
.navrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.navbtn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid #cfd5de;border-radius:10px;background:#fff;color:inherit;text-decoration:none;font-weight:600;font-size:15px}
.navbtn:hover,.navbtn:focus{background:#f1f3f6;border-color:#9aa6b6}
.navbtn.rec{border-color:#1d4e89;box-shadow:0 0 0 1px #1d4e89 inset}
.soc{display:flex;flex-wrap:wrap;gap:8px}
.soc a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:10px;background:#fff;border:1px solid var(--rule)}
.soc a:hover{border-color:var(--chasis)}
.fx-body{min-width:0;display:grid;gap:24px;margin-top:24px}
.fx-body .two{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.fx-body .panel h2{font-size:18px;margin-bottom:12px}
.fx-body .wide{grid-column:1/-1}
.fx-hrs{width:100%;border-collapse:collapse}.fx-hrs td{padding:8px 0;border-bottom:1px solid var(--sand);font-size:15px}.fx-hrs td:last-child{text-align:right;font-family:var(--mono);font-size:14px}.fx-hrs tr.today td{font-weight:700;color:var(--chasis)}
.fx-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.fx-chips li{font-size:13px;border:1px solid var(--rule);border-radius:999px;padding:6px 12px;background:#fff}
.fx-dl{margin:0}.fx-dl dt{font:500 11px var(--mono);letter-spacing:.06em;color:var(--steel);text-transform:uppercase;margin-top:12px}.fx-dl dd{margin:2px 0 0}
.fx-gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:16px}
.fx-gal img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:12px;border:1px solid var(--rule)}
.fx-bar{display:none}

/* ============ ESCRITORIO ============ */
@media (min-width:721px){
  /* A · banner */
  .fx[data-d=a]{grid-template-columns:minmax(0,1fr);grid-template-areas:"hero" "act" "body"}
  .fx[data-d=a] .fx-media{grid-area:hero;min-height:440px;border-radius:20px;overflow:hidden;background:#222}
  .fx[data-d=a] .fx-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,14,22,0) 25%,rgba(10,14,22,.86) 100%)}
  .fx[data-d=a] .fx-cover,.fx[data-d=a] .fx-ph{position:absolute;inset:0}
  .fx[data-d=a] .fx-head{grid-area:hero;z-index:3;align-self:end;padding:32px;color:#fff}
  .fx[data-d=a] .fx-head h1{color:#fff;font-size:46px}
  .fx[data-d=a] .fx-sub,.fx[data-d=a] .fx-addr,.fx[data-d=a] .fx-open,.fx[data-d=a] .fx-ok{color:#fff}
  .fx[data-d=a] .fx-logo{width:92px;height:92px;border:4px solid #fff}
  .fx[data-d=a] .fx-more{top:20px;bottom:auto}
  .fx[data-d=a] .fx-act{grid-area:act;padding:20px 0 0;gap:12px 20px}
  .fx[data-d=a] .fx-body{grid-area:body}

  /* B · mosaico */
  .fx[data-d=b]{grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"head head" "media media" "body act";column-gap:32px}
  .fx[data-d=b] .fx-head{grid-area:head;padding:8px 0 16px}
  .fx[data-d=b] .fx-top .fx-logo{display:none}
  .fx[data-d=b] .fx-media{grid-area:media;display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:200px 200px;gap:8px;border-radius:18px;overflow:hidden}
  .fx[data-d=b] .fx-cover{grid-row:1/3;grid-column:1}
  .fx[data-d=b] .fx-thumbs{display:contents}
  .fx[data-d=b] .fx-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
  .fx[data-d=b] .fx-body{grid-area:body;margin-top:28px}
  .fx[data-d=b] .fx-body .two{grid-template-columns:1fr}
  .fx[data-d=b] .fx-act{grid-area:act;margin-top:28px;position:sticky;top:16px;align-self:start;flex-direction:column;align-items:stretch;background:#fff;border:1px solid var(--rule);border-radius:16px;padding:20px;box-shadow:0 8px 28px rgba(20,24,31,.08)}
  .fx[data-d=b] .fx-act .btn{width:100%}
  .fx[data-d=b] .navrow{flex-direction:column;align-items:stretch}

  /* Cuerpo en una sola línea: horario · servicios y marcas · ubicación (A y C; B lleva la tarjeta de contacto al lado) */
  .fx[data-d=a] .fx-body,.fx[data-d=c] .fx-body{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));align-items:stretch}
  .fx[data-d=a] .fx-body .two,.fx[data-d=c] .fx-body .two{display:contents}

  /* C · cabecera dividida */
  .fx[data-d=c]{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-rows:auto 1fr;grid-template-areas:"media head" "media act" "body body";column-gap:32px}
  .fx[data-d=c] .fx-media{grid-area:media;display:flex;flex-direction:column}
  .fx[data-d=c] .fx-cover,.fx[data-d=c] .fx-ph{flex:1 1 auto;aspect-ratio:4/3;height:auto;min-height:0;border-radius:18px}
  .fx[data-d=c] .fx-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
  .fx[data-d=c] .fx-thumbs img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}
  .fx[data-d=c] .fx-head{grid-area:head;background:#fff;border:1px solid var(--rule);border-bottom:0;border-radius:18px 18px 0 0;padding:28px 28px 8px}
  .fx[data-d=c] .fx-act{grid-area:act;align-self:stretch;align-content:flex-start;background:#fff;border:1px solid var(--rule);border-top:0;border-radius:0 0 18px 18px;padding:12px 28px 28px}
  .fx[data-d=c] .fx-act .btn{flex:1 1 180px}
  .fx[data-d=c] .fx-body{grid-area:body}
}

/* ============ CELULAR ============ */
@media (max-width:720px){
  .fx-head h1{font-size:28px}
  .fx-sub{font-size:16px}
  .fx-body .two{grid-template-columns:1fr}
  .fx-bar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:50;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--rule);box-shadow:0 -6px 20px rgba(0,0,0,.08)}
  .fx-bar a{flex:1;min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;font-weight:700;text-decoration:none;font-size:15px}
  .fx-bar .w{background:var(--taller);color:var(--ink)}.fx-bar .c{background:var(--chasis);color:#fff}.fx-bar .m{background:#fff;border:1px solid var(--chasis);color:var(--chasis)}
  body:has(.fx-bar){padding-bottom:76px}
  .fx-act .btn[data-ev=wa],.fx-act .btn[data-ev=call]{display:none}   /* WhatsApp y Llamar viven en la barra fija */

  /* A */
  .fx[data-m=a]{grid-template-columns:minmax(0,1fr);grid-template-areas:"hero" "act" "body"}
  .fx[data-m=a] .fx-media{grid-area:hero;min-height:340px;border-radius:14px;overflow:hidden;background:#222}
  .fx[data-m=a] .fx-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,14,22,0) 20%,rgba(10,14,22,.88) 100%)}
  .fx[data-m=a] .fx-cover,.fx[data-m=a] .fx-ph{position:absolute;inset:0}
  .fx[data-m=a] .fx-head{grid-area:hero;z-index:3;align-self:end;padding:18px;color:#fff}
  .fx[data-m=a] .fx-head h1{color:#fff}
  .fx[data-m=a] .fx-top{flex-direction:column;align-items:flex-start;gap:10px}
  .fx[data-m=a] .fx-logo{width:60px;height:60px;border:3px solid #fff}
  .fx[data-m=a] .fx-sub,.fx[data-m=a] .fx-addr,.fx[data-m=a] .fx-open,.fx[data-m=a] .fx-ok{color:#fff}
  .fx[data-m=a] .fx-more{top:12px;bottom:auto}
  .fx[data-m=a] .fx-act{grid-area:act;padding:16px 0 0}
  .fx[data-m=a] .fx-body{grid-area:body}

  /* B */
  .fx[data-m=b]{grid-template-columns:minmax(0,1fr);grid-template-areas:"head" "media" "act" "body"}
  .fx[data-m=b] .fx-head{grid-area:head;padding:4px 0 14px}
  .fx[data-m=b] .fx-top .fx-logo{display:none}
  .fx[data-m=b] .fx-media{grid-area:media;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:230px 110px;gap:8px;border-radius:14px;overflow:hidden}
  .fx[data-m=b] .fx-cover{grid-column:1/3;grid-row:1}
  .fx[data-m=b] .fx-thumbs{display:contents}
  .fx[data-m=b] .fx-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
  .fx[data-m=b] .fx-thumbs img:nth-child(n+3){display:none}
  .fx[data-m=b] .fx-act{grid-area:act;margin-top:16px;background:#fff;border:1px solid var(--rule);border-radius:16px;padding:16px}
  .fx[data-m=b] .fx-body{grid-area:body}

  /* C */
  .fx[data-m=c]{grid-template-columns:minmax(0,1fr);grid-template-areas:"media" "head" "act" "body";row-gap:0}
  .fx[data-m=c] .fx-media{grid-area:media}
  .fx[data-m=c] .fx-cover,.fx[data-m=c] .fx-ph{aspect-ratio:16/11;height:auto;border-radius:14px}
  .fx[data-m=c] .fx-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
  .fx[data-m=c] .fx-thumbs img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}
  .fx[data-m=c] .fx-thumbs img:nth-child(n+4){display:none}
  .fx[data-m=c] .fx-head{grid-area:head;margin-top:14px;background:#fff;border:1px solid var(--rule);border-bottom:0;border-radius:16px 16px 0 0;padding:18px 18px 4px}
  .fx[data-m=c] .fx-act{grid-area:act;background:#fff;border:1px solid var(--rule);border-top:0;border-radius:0 0 16px 16px;padding:8px 18px 18px}
  .fx[data-m=c] .fx-body{grid-area:body}
}

/* Proveedores: filtros del listado */
.sfilter{display:grid;gap:14px}
.sfilter .three{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sfilter .acts{display:flex;flex-wrap:wrap;gap:10px}
.sfilter .tg{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:1px solid #d6d2c8;border-radius:999px;background:#fff;cursor:pointer;font-size:.95rem}
.sfilter .tg input{accent-color:#1E4E8C}
@media(max-width:720px){.sfilter .three{grid-template-columns:1fr}}
.fx-chips a{color:inherit;text-decoration:none}
.sfilter .lbl{display:block;margin:0 0 6px;font:500 12px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--steel)}
.sfilter .inp{width:100%;min-height:46px;padding:10px 14px;border:1px solid var(--rule);border-radius:10px;background:var(--surface);color:var(--ink);font:500 16px var(--sans)}