/* header */
.cabecera {
  position:sticky;
  top:0;
  z-index:60;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  min-height:72px;
  padding-inline:var(--paso-lado);
  background:rgba(42,38,49,0.90);
  color:var(--vellon-0);
  border-bottom:1px solid rgba(217,217,225,0.16);
  transition:background-color 0.2s ease, min-height 0.2s ease;
}
.cabecera.woke { min-height:62px; background:rgba(42,38,49,0.99); }
.cabecera-marca {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  gap:0.45rem;
  font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif;
  font-size:1.3rem;
  font-weight:800;
  letter-spacing:0.01em;
  text-decoration:none;
  color:var(--vellon-0);
}
.cabecera-marca span { font-size:0.7rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--oliva-clara); }
.boton-menu {
  display:inline-flex;
  align-items:center;
  gap:0.5rem;
  min-height:46px;
  padding:0.5rem 1.05rem;
  border:1px solid var(--oliva-clara);
  border-radius:999px;
  background:transparent;
  font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif;
  font-size:0.84rem;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--oliva-clara);
  cursor:pointer;
}
.boton-menu-barras { display:inline-flex; flex-direction:column; gap:3px; }
.boton-menu-barras i { width:18px; height:2px; background:var(--oliva-clara); }
/* panel de menú (hermano tras la cabecera) */
.panel-menu {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.6rem 1.4rem;
  padding:0.9rem var(--paso-lado);
  background:var(--fieltro);
}
.panel-menu-cerrar { display:none; }
.panel-menu a {
  display:inline-flex;
  align-items:center;
  min-height:44px;
  font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif;
  font-size:1rem;
  font-weight:700;
  letter-spacing:0.02em;
  text-transform:uppercase;
  text-decoration:none;
  color:var(--vellon-0);
}
.panel-menu a:hover { color:var(--oliva-clara); }
/* con JS: capa superpuesta a pantalla completa */
.hv-js .panel-menu {
  position:fixed;
  inset:0;
  z-index:130;
  flex-direction:column;
  justify-content:center;
  gap:0.4rem;
  padding:clamp(2rem,8vw,4rem);
  visibility:hidden;
  transition:visibility 0.2s;
}
.hv-js .panel-menu a { min-height:0; font-size:clamp(1.6rem,6vw,2.4rem); font-weight:800; }
.hv-js .panel-menu-cerrar {
  position:absolute;
  top:1.3rem;
  right:var(--paso-lado);
  display:inline-flex;
  align-items:center;
  min-height:46px;
  padding:0.5rem 1.1rem;
  border:1px solid var(--hebra-gris);
  border-radius:999px;
  background:transparent;
  font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif;
  font-size:0.84rem;
  font-weight:700;
  color:var(--vellon-0);
  cursor:pointer;
}
body.nav-shown { overflow:hidden; }
body.nav-shown .panel-menu { visibility:visible; }
.panel-menu .panel-menu-cta { margin-top:0.2rem; }
.hv-js .panel-menu .panel-menu-cta { margin-top:1rem; }
/* consent */
.hv-consent {
  position:fixed;
  right:1rem;
  bottom:1rem;
  z-index:120;
  width:min(400px, calc(100% - 2rem));
  padding:1.1rem 1.3rem;
  background:var(--carbon-lana);
  color:var(--vellon-0);
  border:1px solid var(--oliva-clara);
}
.hv-consent p { margin:0 0 0.9rem; font-size:0.9rem; line-height:1.55; }
.hv-consent a { color:var(--oliva-clara); }
.hv-consent-botones { display:flex; flex-wrap:wrap; gap:0.7rem; }
.hv-consent .boton { min-height:44px; padding:0.55rem 1.3rem; font-size:0.88rem; }
.hv-js .hv-consent[hidden] { display:none; }
/* comparativa de hilos */
.tabla-hilos-caja { overflow-x:auto; border:1px solid var(--punto-borde); }
.tabla-hilos { width:100%; border-collapse:collapse; font-size:0.94rem; }
.tabla-hilos caption { padding:0.9rem 1rem; font-size:0.84rem; text-align:left; color:var(--hebra-gris); background:var(--vellon-1); }
.tabla-hilos th, .tabla-hilos td { padding:0.8rem 1rem; text-align:left; border-bottom:1px solid var(--punto-borde); }
.tabla-hilos thead th { font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif; font-size:0.78rem; letter-spacing:0.04em; text-transform:uppercase; background:var(--fieltro); color:var(--vellon-0); }
.tabla-hilos tbody th { font-weight:700; background:var(--vellon-1); }
.tabla-hilos td b { color:var(--rubia); }
@media (max-width:560px) {
  .tabla-hilos-caja { overflow-x:visible; }
  .tabla-hilos thead { display:none; }
  .tabla-hilos, .tabla-hilos tbody, .tabla-hilos tr, .tabla-hilos th, .tabla-hilos td { display:block; width:auto; }
  .tabla-hilos tbody tr { margin:0.9rem 1rem; border:1px solid var(--punto-borde); }
  .tabla-hilos tbody th { font-size:1.05rem; padding:0.7rem 0.9rem; border-bottom:2px solid var(--carbon-lana); }
  .tabla-hilos td { display:flex; justify-content:space-between; gap:1rem; padding:0.6rem 0.9rem; }
  .tabla-hilos td::before { content:attr(data-label); font-weight:700; color:var(--carbon-lana); }
  .tabla-hilos caption { margin:0 1rem; }
}
/* playbill prendas (details nativo) */
.cartel-prendas { border-top:2px solid var(--carbon-lana); }
.cartel-fila { border-bottom:1px solid var(--punto-borde); }
.cartel-fila > summary {
  display:grid;
  grid-template-columns:1.6fr 1.4fr 0.7fr auto;
  align-items:center;
  gap:1rem;
  padding:1.1rem 0.4rem;
  list-style:none;
  cursor:pointer;
}
.cartel-fila > summary::-webkit-details-marker { display:none; }
.cartel-fila > summary:hover { background:var(--vellon-1); }
.cartel-fila > summary:focus-visible { outline:2px solid var(--oliva-tenida); outline-offset:-2px; }
.cartel-nombre { font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif; font-size:1.08rem; font-weight:700; }
.cartel-hilo { color:var(--hebra-gris); font-size:0.9rem; }
.cartel-galga { font-size:0.86rem; color:var(--hebra-gris); }
.cartel-precio { font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif; font-size:1.1rem; font-weight:800; color:var(--oliva-tenida); text-align:right; }
.cartel-mas { justify-self:end; width:30px; height:30px; display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--punto-borde); border-radius:999px; font-size:1.1rem; color:var(--hebra-gris); }
.cartel-fila[open] .cartel-mas { background:var(--carbon-lana); color:var(--vellon-0); border-color:var(--carbon-lana); }
.cartel-detalle { display:grid; grid-template-columns:200px 1fr; gap:1.4rem; padding:0.4rem 0.4rem 1.6rem; }
.cartel-detalle img { width:100%; height:auto; border:1px solid var(--punto-borde); }
.cartel-detalle .muestra-color { height:100%; min-height:170px; }
.cartel-estado { display:inline-block; margin-bottom:0.5rem; padding:0.25rem 0.7rem; border:1px solid var(--rubia); border-radius:999px; font-size:0.72rem; letter-spacing:0.03em; text-transform:uppercase; color:var(--rubia); }
.cartel-detalle dl { margin:0 0 1rem; display:grid; grid-template-columns:auto 1fr; gap:0.3rem 0.9rem; font-size:0.9rem; }
.cartel-detalle dt { font-weight:700; }
.cartel-detalle dd { margin:0; color:var(--hebra-gris); }
.cartel-detalle .boton { margin-top:0.4rem; }
@media (max-width:720px) {
  .cartel-fila > summary { grid-template-columns:1fr auto; grid-auto-rows:min-content; row-gap:0.25rem; }
  .cartel-hilo, .cartel-galga { grid-column:1 / 2; }
  .cartel-precio { grid-row:1; grid-column:2; }
  .cartel-mas { grid-row:2; grid-column:2; align-self:center; }
  .cartel-detalle { grid-template-columns:1fr; }
}
/* galería scroll-snap */
.cinta-pasos {
  display:flex;
  gap:1rem;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding-bottom:1rem;
  -webkit-overflow-scrolling:touch;
}
.paso-tarjeta {
  flex:0 0 clamp(220px, 70vw, 300px);
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
  min-width:0;
  border:1px solid rgba(217,217,225,0.26);
  background:rgba(251,251,253,0.04);
}
.paso-tarjeta img { width:100%; height:170px; object-fit:cover; }
.paso-numero {
  display:flex;
  align-items:center;
  justify-content:center;
  height:170px;
  font-family:'Parkinsans','Parkinsans Fallback',Arial,sans-serif;
  font-size:4.6rem;
  font-weight:800;
  color:var(--oliva-clara);
  background:rgba(185,194,122,0.08);
}
.paso-cuerpo { padding:1rem 1.1rem 1.3rem; }
.paso-cuerpo h3 { color:var(--vellon-0); font-size:1.02rem; }
.paso-cuerpo p { margin:0; font-size:0.88rem; color:#c9c8d2; }
.cinta-mando { display:none; gap:0.6rem; margin-top:1rem; }
.hv-js .cinta-mando { display:flex; }
.cinta-mando button {
  width:46px;
  height:46px;
  border:1px solid var(--oliva-clara);
  border-radius:999px;
  background:transparent;
  color:var(--oliva-clara);
  font-size:1.1rem;
  cursor:pointer;
}
/* quién teje */
.taller-rejilla { display:grid; grid-template-columns:0.9fr 1.1fr; gap:2rem; align-items:center; }
.taller-foto { border:1px solid var(--punto-borde); box-shadow:var(--madeja-sombra); }
.taller-foto img { width:100%; height:auto; }
@media (max-width:820px) { .taller-rejilla { grid-template-columns:1fr; } }
/* tira cta */
.tira-cta { text-align:center; }
.tira-cta h2 { margin-bottom:1.2rem; }
.tira-cta .hero-acciones { justify-content:center; }
/* tarjetas de color (prendas sin foto) */
.muestra-color {
  width:100%;
  height:190px;
  border:1px solid var(--punto-borde);
  background-image:repeating-linear-gradient(45deg, rgba(255,255,255,0.14) 0 3px, transparent 3px 7px), repeating-linear-gradient(-45deg, rgba(0,0,0,0.12) 0 3px, transparent 3px 7px);
}
/* formulario */
.forma-caja { max-width:640px; }
.datos-taller { max-width:640px; }
.pasos-consulta { margin:2.4rem 0; }
.forma-caja h2 { font-size:1.3rem; margin-top:0; }
.forma-caja { padding:1.8rem; border:1px solid var(--punto-borde); box-shadow:var(--madeja-sombra); background:var(--vellon-0); }
.campo { margin-bottom:1.2rem; }
.campo label { display:block; margin-bottom:0.4rem; font-weight:700; font-size:0.92rem; }
.campo input[type=text], .campo textarea {
  width:100%;
  padding:0.7rem 0.9rem;
  border:1px solid var(--hebra-gris);
  border-radius:0;
  font:inherit;
  color:var(--carbon-lana);
  background:var(--vellon-0);
}
.campo textarea { min-height:120px; resize:vertical; }
.campo input:focus, .campo textarea:focus { outline:2px solid var(--oliva-tenida); outline-offset:1px; }
.campo-acuerdo { display:flex; gap:0.6rem; align-items:flex-start; font-size:0.86rem; color:var(--hebra-gris); }
.campo-acuerdo input { margin-top:0.25rem; }
.forma-error { margin-top:0.3rem; font-size:0.82rem; color:var(--rubia); }
.forma-aviso { margin-top:1rem; padding:0.9rem 1rem; font-size:0.9rem; border:1px solid var(--oliva-tenida); background:rgba(92,106,44,0.07); }
.forma-aviso[hidden] { display:none; }
.hv-js .forma-aviso[hidden] { display:none; }
.datos-taller { padding:1.6rem; border:1px solid var(--punto-borde); background:var(--vellon-1); }
.datos-taller h3 { margin-top:0; }
.datos-taller dl { margin:0; display:grid; grid-template-columns:auto 1fr; gap:0.4rem 1rem; font-size:0.92rem; }
.datos-taller dt { font-weight:700; }
.datos-taller dd { margin:0; color:var(--hebra-gris); }
/* páginas legales */
.legal-cabeza { padding-top:clamp(5.4rem, 10vw, 7rem); padding-bottom:2.4rem; background:var(--fieltro); color:var(--vellon-0); }
.legal-cabeza h1 { color:var(--vellon-0); font-size:clamp(2rem,1.4rem+2.6vw,3rem); }
.legal-cabeza p { max-width:42rem; color:#c9c8d2; }
.legal-indice { margin:2rem 0; padding:1.2rem 1.4rem; border:1px solid var(--punto-borde); background:var(--vellon-1); }
.legal-indice ol { margin:0; padding-left:1.2rem; columns:2; column-gap:2rem; font-size:0.92rem; }
.legal-bloque { max-width:52rem; margin:0 auto; }
.legal-bloque article { padding:1.5rem 0; border-top:1px solid var(--punto-borde); }
.legal-bloque h2 { font-size:1.2rem; }
.tarjeta-rejilla { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; }
.tarjeta-borde { padding:1.2rem 1.3rem; border:1px solid var(--punto-borde); border-left:4px solid var(--oliva-tenida); background:var(--vellon-0); }
.tarjeta-borde h3 { margin-top:0; }
.tabla-datos { width:100%; border-collapse:collapse; font-size:0.92rem; border:1px solid var(--punto-borde); }
.tabla-datos th, .tabla-datos td { padding:0.7rem 0.9rem; text-align:left; border-bottom:1px solid var(--punto-borde); vertical-align:top; }
.tabla-datos th { width:34%; background:var(--vellon-1); font-weight:700; }
.tabla-reqs { overflow-wrap:anywhere; }
@media (max-width:620px) { .legal-indice ol { columns:1; } }
@media (max-width:560px) {
  .forma-caja { padding:1.3rem; }
  .campo { margin-bottom:0.85rem; }
  .campo textarea { min-height:84px; }
  .seccion-intro { margin-bottom:1.3rem; }
}
/* aviso de servicio */
.servicio-aviso { padding:1.2rem 1.4rem; border:1px solid var(--rubia); background:rgba(162,74,53,0.06); }
/* control que solo funciona con JS */
.boton[hidden] { display:none; }
