/* estilos/ec-serigrafia.css (23/10/2026, k1190): LA TARIFA DE SERIGRAFIA, CON SUS FOTOS Y SIN HUECOS. El usuario:
   "disenala mucho mejor, no dejes tantos espacios en blanco y utiliza mas imagenes que hay en 14 - TECNICAS IMPRESION.
   Optimizalas para la web y cambia la actual que se llama img/estampacion/estampacion-serigrafia.jpg".
   Solo en tarifa-serigrafia.asp (su tb-page lleva la clase sg26), despues de ec-tec-pro.css y con sus colores. (k1246) Tambien en
   tampografia.asp y (k1249) grabado-laser.asp: su tb-page lleva sg26 y tf26, y estilos/ec-tec-fotos.css va
   detras con lo suyo (comun a las paginas de las tecnicas con las fotos del usuario).
   Las fotos, en WebP: img/estampacion/serigrafia/ (taller, productos e ideas) e img/estampacion/tecnicas/ (las otras
   tecnicas, includes/_tec_pro.asp con gTpFotos). Bloques a 44 px (antes 72-88), cabeceras en una linea y fotos en
   cada bloque: el taller, los productos, las ideas, la llamada final y las otras tecnicas. */

html body .contenidoprincipal .tec26.sg26{--sg-sep:44px}
html body .contenidoprincipal .tec26.sg26 .tp-pasos,html body .contenidoprincipal .tec26.sg26 .tp-otras,html body .contenidoprincipal .tec26.sg26 .sg-sec{margin:var(--sg-sep) 0}
html body .contenidoprincipal .tec26.sg26 h2{font-size:30px !important;margin:0 0 10px !important}
html body .contenidoprincipal .tec26.sg26 .tp-eye{margin:0 0 8px}
html body .contenidoprincipal .tec26.sg26 .sg-cab{margin:0 0 18px}
html body .contenidoprincipal .tec26.sg26 .sg-cab p{color:#475569;font-size:16px;line-height:1.6;margin:0;max-width:600px}
html body .contenidoprincipal .tec26.sg26 .sg-cab-f{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:8px 40px}
html body .contenidoprincipal .tec26.sg26 .sg-cab-f h2{margin:0 !important}
html body .contenidoprincipal .tec26.sg26 .sg-nota{color:var(--tp-mut);font-size:13.5px;line-height:1.55;margin:12px 2px 0}
html body .contenidoprincipal .tec26.sg26 .sg-nota b{color:var(--tp-ink)}

/* ------------------------------------------------------------------ la portada, mas recogida */
html body .contenidoprincipal .tec26.sg26 .tec-hero{gap:44px;padding:40px 44px !important}
html body .contenidoprincipal .tec26.sg26 h1{font-size:44px !important;margin:12px 0 14px !important}
html body .contenidoprincipal .tec26.sg26 .tec-cta{margin:22px 0 0}
html body .contenidoprincipal .tec26.sg26 .tp-hechos{margin-top:14px !important}

/* ------------------------------------------------------------------ el taller: el texto y sus fotos */
html body .contenidoprincipal .tec26.sg26 .sg-taller{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:center}
html body .contenidoprincipal .tec26.sg26 .sg-taller-txt p{color:#475569;font-size:16px;line-height:1.7;margin:0 0 12px}
html body .contenidoprincipal .tec26.sg26 .sg-checks{list-style:none;margin:16px 0 0 !important;padding:0 !important;display:grid;gap:10px}
html body .contenidoprincipal .tec26.sg26 .sg-checks li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.55;color:var(--tp-txt);margin:0 !important;padding:0 !important}
html body .contenidoprincipal .tec26.sg26 .sg-checks li:before{content:"";flex:0 0 22px;width:22px;height:22px;margin-top:1px;border-radius:50%;background:#dcfce7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2315803d' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8.5'/%3E%3C/svg%3E") center/13px no-repeat}
html body .contenidoprincipal .tec26.sg26 .sg-checks b{color:var(--tp-ink)}
html body .contenidoprincipal .tec26.sg26 .sg-mosaico{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0}
html body .contenidoprincipal .tec26.sg26 .sg-mosaico figure{position:relative;margin:0;border-radius:14px;overflow:hidden;background:var(--tp-soft);aspect-ratio:4/3}
html body .contenidoprincipal .tec26.sg26 .sg-mosaico .sg-m1{grid-column:1 / -1;aspect-ratio:2/1}
html body .contenidoprincipal .tec26.sg26 .sg-mosaico img{width:100% !important;height:100% !important;max-width:none !important;object-fit:cover;display:block}
html body .contenidoprincipal .tec26.sg26 .sg-mosaico figcaption{position:absolute;left:10px;bottom:10px;background:rgba(255,255,255,.94);color:var(--tp-ink);font-size:12.5px;font-weight:700;line-height:1.2;padding:6px 10px;border-radius:8px}

/* ------------------------------------------------------------------ como funciona: en su panel */
html body .contenidoprincipal .tec26.sg26 .tp-pasos{background:var(--tp-soft);border:1px solid var(--tp-lin);border-radius:24px;padding:30px 32px 28px}
html body .contenidoprincipal .tec26.sg26 .tp-pasos>h2{margin:0 auto 10px !important}
html body .contenidoprincipal .tec26.sg26 .tp-pasos-l{margin:24px 0 0 !important;gap:22px}
html body .contenidoprincipal .tec26.sg26 .tp-pi{margin:0 0 12px}
html body .contenidoprincipal .tec26.sg26 .tp-pasos-l p{font-size:14.5px}

/* ------------------------------------------------------------------ la tarifa: la tabla y el grafico, juntos */
html body .contenidoprincipal .tec26.sg26 .sg-tarifa-g{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px;align-items:stretch}
html body .contenidoprincipal .tec26.sg26 .sg-tabla{background:#fff;border:1px solid var(--tp-lin);border-radius:20px;padding:16px 0 18px;overflow-x:auto;min-width:0}
html body .contenidoprincipal .tb-page.imp26.sg26 .sg-tabla table.tb-precios{margin:0 14px !important}
html body .contenidoprincipal .tec26.sg26 .sg-tarifa .tp-graf{display:flex;flex-direction:column;align-items:stretch;gap:14px;margin:0 !important;background:var(--tp-soft);border:1px solid var(--tp-lin);border-radius:20px;padding:22px 22px 18px;min-width:0}
html body .contenidoprincipal .tec26.sg26 .sg-tarifa .tp-graf h2{font-size:22px !important;margin:0 0 6px !important}
html body .contenidoprincipal .tec26.sg26 .sg-tarifa .tp-graf-txt p{font-size:14.5px;line-height:1.55;margin:0 0 6px}
html body .contenidoprincipal .tec26.sg26 .sg-tarifa .tp-graf .tp-lnk{display:none}
html body .contenidoprincipal .tec26.sg26 .sg-tarifa .tp-gbarras{flex:1 1 auto;height:auto;min-height:220px;padding:38px 14px 0 !important}

/* ------------------------------------------------------------------ los recargos, en dos columnas */
/* (k1212) los recargos en dos grupos: los que ya van en el presupuesto y los que se anyaden al revisar */
html body .contenidoprincipal .tec26.sg26 .sg-rec-h{font-size:12.5px !important;line-height:1.4 !important;font-weight:800 !important;text-transform:uppercase;letter-spacing:.07em !important;color:var(--tp-mut) !important;margin:18px 0 10px !important;padding:0 !important}
html body .contenidoprincipal .tec26.sg26 .sg-rec-h:first-of-type{margin-top:4px !important}
html body .contenidoprincipal .tec26.sg26 .sg-rec-l{list-style:none;margin:0 !important;padding:0 !important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px}
html body .contenidoprincipal .tec26.sg26 .sg-rec-l li{display:flex;align-items:center;justify-content:space-between;gap:16px;background:#fff;border:1px solid var(--tp-lin);border-radius:14px;padding:13px 18px;min-width:0;margin:0 !important}
html body .contenidoprincipal .tec26.sg26 .sg-rec-l li>span{display:flex;flex-direction:column;min-width:0}
html body .contenidoprincipal .tec26.sg26 .sg-rec-l b{color:var(--tp-ink);font-size:15px;font-weight:700;line-height:1.35}
html body .contenidoprincipal .tec26.sg26 .sg-rec-l small{color:var(--tp-mut);font-size:13px;line-height:1.35}
html body .contenidoprincipal .tec26.sg26 .sg-rec-l em{font-style:normal;color:var(--tp-br);font-weight:700;font-size:14.5px;line-height:1.35;text-align:right;white-space:nowrap}

/* ------------------------------------------------------------------ que serigrafiamos: sus fotos */
html body .contenidoprincipal .tec26.sg26 .sg-prod-l{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
html body .contenidoprincipal .tec26.sg26 a.sg-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--tp-lin);border-radius:16px;overflow:hidden;color:var(--tp-ink) !important;text-decoration:none !important;transition:border-color .15s,box-shadow .15s}
html body .contenidoprincipal .tec26.sg26 a.sg-card:hover{border-color:#bcd3ea;box-shadow:0 16px 30px -24px rgba(10,37,64,.5)}
html body .contenidoprincipal .tec26.sg26 .sg-card img{width:100% !important;height:auto !important;max-width:none !important;aspect-ratio:16/10;object-fit:cover;display:block;background:var(--tp-soft)}
html body .contenidoprincipal .tec26.sg26 .sg-card>span{display:flex;flex-direction:column;padding:11px 14px 13px}
html body .contenidoprincipal .tec26.sg26 .sg-card b{font-size:15px;font-weight:700;line-height:1.3}
html body .contenidoprincipal .tec26.sg26 .sg-card small{font-size:13px;color:var(--tp-mut);line-height:1.4;margin-top:2px;font-weight:400 !important}
html body .contenidoprincipal .tec26.sg26 .sg-envio{display:flex;align-items:center;gap:14px;background:var(--tp-soft);border:1px solid var(--tp-lin);border-radius:14px;padding:13px 18px;margin:14px 0 0;color:var(--tp-txt);font-size:15px;line-height:1.5}
html body .contenidoprincipal .tec26.sg26 .sg-envio svg{flex:0 0 26px;width:26px;height:26px;color:var(--tp-br)}
html body .contenidoprincipal .tec26.sg26 .sg-envio b{color:var(--tp-ink)}

/* ------------------------------------------------------------------ las ideas: la primera en grande, sin huecos */
html body .contenidoprincipal .tec26.sg26 .sg-ideas-l{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
html body .contenidoprincipal .tec26.sg26 a.sg-idea{position:relative;display:block;border-radius:14px;overflow:hidden;aspect-ratio:16/10;background:var(--tp-soft)}
html body .contenidoprincipal .tec26.sg26 a.sg-idea:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
html body .contenidoprincipal .tec26.sg26 .sg-idea img{position:absolute;left:0;top:0;width:100% !important;height:100% !important;max-width:none !important;object-fit:cover;transition:transform .35s}
html body .contenidoprincipal .tec26.sg26 a.sg-idea:hover img{transform:scale(1.04)}
html body .contenidoprincipal .tec26.sg26 .sg-idea span{position:absolute;left:8px;bottom:8px;background:rgba(10,37,64,.84);color:#fff;font-size:12.5px;font-weight:700;padding:5px 9px;border-radius:7px;line-height:1.2}
html body .contenidoprincipal .tec26.sg26 .sg-mas{margin:14px 0 0}
html body .contenidoprincipal .tec26.sg26 .sg-mas>summary{display:inline-flex;align-items:center;gap:10px;cursor:pointer;list-style:none;font-weight:700;font-size:15px;color:var(--tp-br);padding:11px 18px;border:1px solid #cdd8e5;border-radius:12px;background:#fff}
html body .contenidoprincipal .tec26.sg26 .sg-mas>summary::-webkit-details-marker{display:none}
html body .contenidoprincipal .tec26.sg26 .sg-mas>summary:after{content:"+";display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--tp-tint);font-size:16px;line-height:1}
html body .contenidoprincipal .tec26.sg26 .sg-mas[open]>summary:after{content:"\2212"}
html body .contenidoprincipal .tec26.sg26 .sg-mas>summary:hover{border-color:var(--tp-br)}
html body .contenidoprincipal .tb-page.imp26.sg26 .sg-mas .tb-gallery{display:grid;grid-template-columns:repeat(9,minmax(0,1fr)) !important;gap:8px;margin:14px 0 0}
html body .contenidoprincipal .tb-page.imp26.sg26 .sg-mas .tb-gallery figure{border-radius:12px}
html body .contenidoprincipal .tb-page.imp26.sg26 .sg-mas .tb-gallery figure a{aspect-ratio:1/1}
html body .contenidoprincipal .tb-page.imp26.sg26 .sg-mas .tb-gallery figcaption{display:none}

/* ------------------------------------------------------------------ la ficha y las preguntas, en dos columnas */
html body .contenidoprincipal .tec26.sg26 .sg-dos{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:24px;align-items:start}
html body .contenidoprincipal .tec26.sg26 .sg-dos .tp-ficha{display:block;margin:0 !important;background:var(--tp-soft);border:1px solid var(--tp-lin);border-radius:22px;padding:26px 26px 20px}
html body .contenidoprincipal .tec26.sg26 .sg-dos h2{font-size:26px !important}
html body .contenidoprincipal .tec26.sg26 .sg-dos .tp-ficha-txt p{font-size:15px;margin:0 0 6px}
html body .contenidoprincipal .tec26.sg26 .sg-dos .tp-ficha-l{margin:14px 0 0 !important;padding:2px 18px !important}
html body .contenidoprincipal .tec26.sg26 .sg-dos .tp-ficha-l li{grid-template-columns:118px auto minmax(0,1fr);gap:14px;padding:12px 0}
html body .contenidoprincipal .tec26.sg26 .sg-dos .ec-faq.tec-faq2{display:block;margin:0 !important}
html body .contenidoprincipal .tec26.sg26 .sg-dos .ec-faq-sub{margin:0 0 14px}

/* ------------------------------------------------------------------ la llamada final, sobre el taller */
html body .contenidoprincipal .tec26.sg26 .tec-final{background:#0a2540 url("../img/estampacion/serigrafia/taller-nave-produccion.webp") center 55%/cover no-repeat !important;padding:44px 48px !important;margin:var(--sg-sep) 0}
html body .contenidoprincipal .tec26.sg26 .tec-final:before{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background:rgba(10,37,64,.85);z-index:0}
html body .contenidoprincipal .tec26.sg26 .tec-final>*{position:relative;z-index:1}

/* ------------------------------------------------------------------ las otras tecnicas, con su foto */
html body .contenidoprincipal .tec26.sg26 a.tp-otra.tp-otra-f{padding:10px 14px 10px 10px;gap:14px}
html body .contenidoprincipal .tec26.sg26 .tp-otra .tp-of{flex:0 0 84px;width:84px !important;height:63px !important;max-width:none !important;border-radius:10px;object-fit:cover;display:block;background:var(--tp-soft)}
html body .contenidoprincipal .tec26.sg26 .tp-otra-f .tp-ot b:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--tp-fc);margin:0 7px 0 0;vertical-align:1px}

/* ------------------------------------------------------------------ pantallas medianas y el movil */
@media (max-width:1180px){
  html body .contenidoprincipal .tec26.sg26 .sg-tarifa-g{grid-template-columns:1fr}
  html body .contenidoprincipal .tec26.sg26 .sg-ideas-l{grid-template-columns:repeat(4,minmax(0,1fr))}
  html body .contenidoprincipal .tec26.sg26 .sg-dos{grid-template-columns:1fr}
  html body .contenidoprincipal .tb-page.imp26.sg26 .sg-mas .tb-gallery{grid-template-columns:repeat(6,minmax(0,1fr)) !important}
}
@media (max-width:900px){
  html body .contenidoprincipal .tec26.sg26 .sg-taller{grid-template-columns:1fr;gap:22px}
  html body .contenidoprincipal .tec26.sg26 .sg-prod-l{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  html body .contenidoprincipal .tec26.sg26 .sg-rec-l{grid-template-columns:1fr}
}
@media (max-width:640px){
  html body .contenidoprincipal .tec26.sg26{--sg-sep:30px}
  html body .contenidoprincipal .tec26.sg26 h2{font-size:24px !important}
  html body .contenidoprincipal .tec26.sg26 h1{font-size:30px !important}
  html body .contenidoprincipal .tec26.sg26 .tec-hero{gap:20px;padding:22px 18px !important}
  html body .contenidoprincipal .tec26.sg26 .sg-mosaico{gap:6px}
  html body .contenidoprincipal .tec26.sg26 .sg-mosaico figcaption{left:6px;bottom:6px;font-size:11px;padding:4px 7px}
  html body .contenidoprincipal .tec26.sg26 .tp-pasos{padding:22px 18px}
  html body .contenidoprincipal .tec26.sg26 .sg-rec-l li{flex-direction:column;align-items:flex-start;gap:4px;padding:12px 14px}
  html body .contenidoprincipal .tec26.sg26 .sg-rec-l em{text-align:left;white-space:normal}
  html body .contenidoprincipal .tec26.sg26 .sg-card>span{padding:9px 11px 11px}
  html body .contenidoprincipal .tec26.sg26 .sg-card b{font-size:14px}
  html body .contenidoprincipal .tec26.sg26 .sg-card small{font-size:12px}
  html body .contenidoprincipal .tec26.sg26 .sg-envio{align-items:flex-start;font-size:14px;padding:12px 14px}
  html body .contenidoprincipal .tec26.sg26 .sg-ideas-l{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  html body .contenidoprincipal .tec26.sg26 a.sg-idea:first-child{grid-row:auto;aspect-ratio:16/10}
  html body .contenidoprincipal .tec26.sg26 .sg-idea span{font-size:11.5px;left:6px;bottom:6px}
  html body .contenidoprincipal .tb-page.imp26.sg26 .sg-mas .tb-gallery{grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:6px}
  html body .contenidoprincipal .tec26.sg26 .sg-dos .tp-ficha{padding:20px 16px 14px}
  html body .contenidoprincipal .tec26.sg26 .sg-dos .tp-ficha-l li{grid-template-columns:1fr auto;gap:4px 12px}
  html body .contenidoprincipal .tec26.sg26 .sg-dos .tp-ficha-l .tp-fx{grid-column:1 / -1}
  html body .contenidoprincipal .tec26.sg26 .tec-final{padding:28px 20px !important}
  html body .contenidoprincipal .tec26.sg26 .tp-otra .tp-of{flex-basis:72px;width:72px !important;height:54px !important}
}