/* Ramiro Rodríguez — reconversión competitiva de empresas industriales
   Dirección de arte: documentación técnica de taller.
   Papel de plano, tinta grafito, antióxido. Sin decoración. */

:root{
  --paper:#E4E2DD;
  --paper-2:#DAD8D2;
  --ink:#17181A;
  --steel:#6B6F72;
  --line:#C4C1BA;
  --oxide:#A63C1B;
  --max:1180px;
}

*{box-sizing:border-box;margin:0;padding:0}

html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *{animation:none!important;transition:none!important}}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:"IBM Plex Serif",Georgia,serif;
  font-size:1.0625rem;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.wrap{max-width:var(--max);margin:0 auto;padding:0 32px}
@media(max-width:720px){.wrap{padding:0 20px}}

/* --- utilidad / mono --- */
.mono{
  font-family:"IBM Plex Mono",monospace;
  font-size:.6875rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--steel);
}

/* --- titulares: condensada, industrial --- */
h1,h2,h3,.display{
  font-family:"IBM Plex Sans Condensed","IBM Plex Sans",sans-serif;
  font-weight:600;
  line-height:1.05;
  letter-spacing:-.005em;
}

h1{font-size:clamp(2.6rem,6.2vw,4.75rem)}
h2{font-size:clamp(1.7rem,3vw,2.35rem);line-height:1.1}
h3{font-size:1.2rem;font-weight:600;line-height:1.25}

p{max-width:62ch}
p + p{margin-top:1.05em}

a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--oxide);padding-bottom:1px}
a:hover{color:var(--oxide)}
a:focus-visible{outline:2px solid var(--oxide);outline-offset:3px}

/* --- barra superior --- */
header.top{
  border-bottom:1px solid var(--line);
  position:sticky;top:0;background:var(--paper);z-index:10;
}
header.top .wrap{display:flex;justify-content:space-between;align-items:center;height:56px;gap:24px}
header.top a{border:0}
header.top nav{display:flex;gap:22px}
header.top nav a[aria-current="page"]{color:var(--oxide)}
.brand{font-family:"IBM Plex Sans Condensed",sans-serif;font-weight:600;font-size:.95rem;letter-spacing:.02em}

/* --- cota: línea de dimensión de plano técnico. Divisor de sección. --- */
.cota{
  display:flex;align-items:center;gap:14px;
  margin:88px 0 34px;
}
.cota::before,.cota::after{
  content:"";height:9px;border-left:1px solid var(--line);border-right:1px solid var(--line);
  flex:0 0 auto;width:0;
}
.cota .rule{flex:1;height:1px;background:var(--line)}
.cota .lbl{flex:0 0 auto}

/* --- hero --- */
.hero{padding:96px 0 8px}
.hero .eyebrow{margin-bottom:26px}
.hero h1{max-width:16ch}
.hero .lede{
  margin-top:32px;max-width:56ch;font-size:1.3rem;line-height:1.45;color:#2C2E31;
}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:40px}
.btn{
  font-family:"IBM Plex Sans Condensed",sans-serif;font-weight:600;font-size:.95rem;
  padding:13px 22px;border:1px solid var(--ink);border-bottom-color:var(--ink);
  background:var(--ink);color:var(--paper);letter-spacing:.01em;
}
.btn:hover{background:var(--oxide);border-color:var(--oxide);color:var(--paper)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--ink);background:transparent;color:var(--ink)}

/* --- bloque de dos columnas: etiqueta izq / contenido der --- */
.block{display:grid;grid-template-columns:180px 1fr;gap:48px;padding:8px 0 12px}
.block > .k{padding-top:8px}
@media(max-width:840px){
  .block{grid-template-columns:1fr;gap:14px}
  .cota{margin:64px 0 26px}
}

/* --- ficha técnica: filas de datos --- */
.ficha{border-top:1px solid var(--line);margin-top:8px}
.ficha .row{
  display:grid;grid-template-columns:200px 1fr;gap:32px;
  padding:16px 0;border-bottom:1px solid var(--line);
}
.ficha .row > div:last-child{max-width:60ch}
@media(max-width:840px){.ficha .row{grid-template-columns:1fr;gap:6px}}

/* --- producto (como-trabajo) --- */
.prod{border-top:1px solid var(--ink);padding-top:20px;margin-top:56px}
.prod h3{margin-bottom:6px}
.prod .price{font-family:"IBM Plex Sans Condensed",sans-serif;font-weight:600;font-size:1.05rem}
ul{margin:.8em 0 0 1.1em}
li{margin-bottom:.35em;max-width:60ch}

/* --- marcador de dato sin verificar --- */
.verificar{
  background:rgba(166,60,27,.12);
  border-bottom:2px solid var(--oxide);
  padding:0 3px;
}
.verificar::after{
  content:" ⚠ VERIFICAR";
  font-family:"IBM Plex Mono",monospace;font-size:.6rem;letter-spacing:.1em;
  color:var(--oxide);vertical-align:super;
}

/* --- pie: anclajes de entidad --- */
footer{border-top:1px solid var(--ink);margin-top:110px;padding:40px 0 64px}
footer .grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}
footer ul{list-style:none;margin:14px 0 0}
footer li{margin-bottom:8px;font-size:.95rem}
@media(max-width:720px){footer .grid{grid-template-columns:1fr}}

.quiet{color:var(--steel)}
.lead-out{margin-top:34px}