/* ============================================================
   BLUE COACH — V5 · Servicios + Talleres
   Reutiliza tokens.css + styles.css + recursos.css (filtro, .art, .prose).
   Añade: cards de servicio con icono, detalle de servicio, grilla de
   talleres, llamado B2B del home. Idioma V5.
   ============================================================ */

/* ---------- Índice de servicios: grilla de cards con icono ---------- */
.scards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.25rem;
  padding-block:clamp(2rem,4vw,3rem)}
.scard{position:relative;display:flex;flex-direction:column;gap:.7rem;background:var(--white);
  border:1px solid var(--border);border-radius:var(--r-lg);padding:1.6rem 1.7rem;
  transition:box-shadow var(--transition),border-color var(--transition),transform var(--transition)}
.scard:hover{box-shadow:var(--shadow-md);border-color:var(--indigo-200);transform:translateY(-2px)}
.scard:focus-within{box-shadow:var(--shadow-md);border-color:var(--indigo-400)}
.scard[hidden]{display:none}
.scard__ico{width:52px;height:52px;border-radius:var(--r-sm);display:grid;place-items:center;
  background:var(--coral-50);color:var(--coral);transition:background var(--transition),color var(--transition)}
.scard__ico svg{width:26px;height:26px}
.scard:hover .scard__ico{background:var(--coral);color:#fff}
.scard__cat{align-self:flex-start;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;
  font-weight:600;padding:.3rem .6rem;border-radius:6px;background:var(--indigo-50);color:var(--indigo-600)}
.scard h2{font-size:1.22rem;font-weight:var(--fw-bold);letter-spacing:-.015em;line-height:1.25;color:var(--ink)}
.scard__sub{font-family:var(--mono);font-size:.72rem;letter-spacing:.04em;color:var(--coral-ink);text-transform:uppercase}
.scard__desc{font-size:.92rem;color:var(--ink-muted);flex:1}
.scard__more{font-size:.85rem;font-weight:var(--fw-semi);color:var(--coral-ink)}
.scard__more::after{content:"";position:absolute;inset:0}
.scard:hover .scard__more{text-decoration:underline}

/* ---------- Detalle de servicio ---------- */
.svc-lead{font-size:var(--fs-lede);color:var(--ink-2);line-height:1.6;padding-left:1.1rem;
  border-left:3px solid var(--coral);margin-bottom:1.5rem}
.svc-list{list-style:none;display:flex;flex-direction:column;gap:.7rem;margin:1.2rem 0 1.6rem}
.svc-list li{position:relative;padding-left:2rem;color:var(--ink-2);line-height:1.6}
.svc-list li::before{content:"";position:absolute;left:0;top:.15rem;width:22px;height:22px;border-radius:50%;
  background:var(--coral-50);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A8432B' stroke-width='2.4'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:center;background-size:13px}
.svc-close{font-size:var(--fs-lede);color:var(--ink);font-weight:var(--fw-med);margin:1.4rem 0 0;
  padding-top:1.4rem;border-top:1px solid var(--border)}

/* ---------- Talleres (B2B): grilla compacta numerada ---------- */
.tallers{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1px;
  background:var(--border);border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;
  margin-block:clamp(2rem,4vw,3rem)}
.taller{background:var(--white);padding:1.6rem 1.7rem;display:flex;flex-direction:column;gap:.55rem;
  transition:background var(--transition)}
.taller:hover{background:var(--arena)}
.taller__n{font-family:var(--mono);font-size:.8rem;font-weight:600;color:var(--coral)}
.taller h3{font-size:1.1rem;font-weight:var(--fw-bold);letter-spacing:-.01em;line-height:1.3;color:var(--ink)}
.taller p{font-size:.9rem;color:var(--ink-muted);line-height:1.55}
.taller a{color:var(--coral-ink);border-bottom:1px solid var(--coral-50)}

/* ---------- Llamado B2B en el home ---------- */
.b2b-cta{margin-top:clamp(1.5rem,3vw,2.25rem);display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;
  justify-content:space-between;background:linear-gradient(150deg,var(--indigo-900),var(--indigo-600));
  color:#fff;border-radius:var(--r-lg);padding:clamp(1.5rem,3vw,2rem) clamp(1.5rem,3.5vw,2.4rem)}
.b2b-cta__t{max-width:46ch}
.b2b-cta__t b{display:block;font-size:1.15rem;font-weight:var(--fw-bold);letter-spacing:-.01em;margin-bottom:.25rem;color:#fff}
.b2b-cta__t span{color:var(--on-dark-2);font-size:.95rem}
.b2b-cta__img{width:clamp(180px,24vw,260px);aspect-ratio:16/11;object-fit:cover;border-radius:var(--r-md);display:block}

/* ---------- Ver todos ---------- */
.see-all{display:inline-flex;align-items:center;gap:.5rem;font-weight:var(--fw-semi);color:var(--coral-ink);
  font-size:.95rem;margin-top:.5rem}
.see-all:hover{text-decoration:underline}

/* Cards de servicio como enlace (home + índice) */
a.svc{color:inherit;text-decoration:none;cursor:pointer}
.svc-grid a.svc:hover{border-color:var(--indigo-200)}

/* Portada de servicios: texto + foto cuadrada de la cara a la derecha */
.svc-hero{display:grid;grid-template-columns:1fr auto;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.svc-hero__img{width:clamp(190px,26vw,300px);aspect-ratio:1/1;height:auto;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--shadow-md);display:block}
@media (max-width:760px){ .svc-hero{grid-template-columns:1fr;justify-items:start} .svc-hero__img{width:clamp(160px,55vw,240px)} }
/* refuerzo: la foto del CTA azul conserva su proporcion */
.b2b-cta__img{height:auto}
