/* INDUVEST — identidad (grafito + naranja de seguridad) */
:root{
  --brand:#23272E; --brand-d:#15181D; --accent:#F4511E; --accent-d:#C63F13;
  --bg-soft:#F4F5F7; --line:#E1E4E9; --ink:#1B1F25; --muted:#5C646F;
  --head:'Barlow Condensed','Space Grotesk',system-ui,sans-serif;
  --body:'Poppins',system-ui,sans-serif;
}
/* Titulares condensados y en mayúsculas: lenguaje visual de taller industrial */
h1,h2{letter-spacing:.01em;text-transform:uppercase}
h1{font-size:clamp(2.4rem,6vw,4.2rem);line-height:1.02}
.hero{background:linear-gradient(150deg,#23272E 0%,#15181D 100%);color:#fff}
.hero .lead{color:#B9C0CA}
.hero .hl{color:#FF7A45}
.hero .hero-badges{color:#9AA3AF}.hero .hero-badges b{color:#fff}
.hero .btn-out{border-color:#3C434D;color:#fff}
.hero .btn-out:hover{border-color:var(--accent);color:#FF7A45}
.hero-art{background:#15181D}
.about-art{background:#23272E}

/* Franja diagonal de seguridad bajo el hero: guiño a la cinta reflectiva */
.cinta{height:10px;background:repeating-linear-gradient(45deg,
  var(--accent) 0 18px,#23272E 18px 36px)}

/* Pasos del proceso */
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:paso}
.paso{position:relative;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:30px 22px 24px}
.paso::before{counter-increment:paso;content:counter(paso,decimal-leading-zero);
  font-family:var(--head);font-size:2.4rem;font-weight:700;color:var(--accent);
  line-height:1;display:block;margin-bottom:10px}
.paso h3{margin-bottom:6px;text-transform:none}
.paso p{color:var(--muted);font-size:.94rem}

/* Ficha técnica de cada prenda: es lo que el comprador B2B compara entre
   proveedores (tela, gramaje, colores y tallas). Sin esto es solo una foto. */
.ficha{display:grid;gap:5px;margin:10px 0 14px;padding-top:10px;border-top:1px solid var(--line)}
.ficha li{display:flex;gap:8px;font-size:.84rem;color:var(--muted);line-height:1.45}
.ficha li b{flex:0 0 62px;color:var(--ink);font-weight:600}
.product .body .add{margin-top:auto}
.product .pic .tag{background:var(--brand);text-transform:uppercase;letter-spacing:.04em}

/* Solicitud de cotización: el drawer sale de _base.css; aquí solo lo que
   cambia respecto de un carrito de compra (cantidad por prenda, sin total) */
.ci-cant{width:64px;flex-shrink:0;border:1px solid var(--line);border-radius:8px;
  padding:7px 8px;font-family:var(--body);font-size:.9rem;text-align:center;color:var(--ink)}
.ci-cant:focus{outline:none;border-color:var(--accent)}
.cot-nota{color:var(--muted);font-size:.82rem;margin-bottom:12px;line-height:1.45}
.cart-btn{font-size:1.15rem}

/* Aviso de pedido mínimo: dato que el comprador B2B busca primero */
.minimo{background:#FFF3EC;border:1px solid #FFD9C4;border-left:4px solid var(--accent);
  border-radius:12px;padding:16px 20px;margin-top:26px}
.minimo b{color:var(--accent-d)}

.tcard .av{background:var(--brand);color:#fff}
.chips span{text-transform:none}

@media(max-width:900px){
  .pasos{grid-template-columns:1fr 1fr}
  .split .about-art{order:-1}
}
@media(max-width:560px){ .pasos{grid-template-columns:1fr} }