:root{
  --tinta:#16191C;
  --grafito:#3D444B;
  --gris:#79818A;
  --gris-cl:#A8AEB4;
  --niebla:#F4F5F6;
  --papel:#FFFFFF;
  --cota:#4C6A7C;
  --hivis:#F2B705;
  --linea:#E2E4E6;
  --linea-2:#CBD0D4;
  --display:'Archivo',system-ui,sans-serif;
  --texto:'Barlow',system-ui,sans-serif;
  --max:1260px;
  --reticula:
    linear-gradient(to right, rgba(22,25,28,.045) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(22,25,28,.045) 1px, transparent 1px);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{font-family:var(--texto);background:var(--papel);color:var(--tinta);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--hivis);outline-offset:3px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 30px}
h1,h2,h3,h4{font-family:var(--display);line-height:1.04;letter-spacing:-.025em}
.tab{font-variant-numeric:tabular-nums}
.cinta{height:11px;background:repeating-linear-gradient(-45deg,var(--hivis) 0 13px,var(--tinta) 13px 26px)}

/* ---------- Encabezado ---------- */
.topbar{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--linea)}
.topbar .wrap{display:flex;align-items:center;gap:32px;height:86px}
.marca{display:flex;align-items:center;text-decoration:none;flex-shrink:0}
.marca img{height:56px;width:auto}
.marca .fallback{font-family:var(--display);font-weight:900;font-size:23px;letter-spacing:.08em;color:var(--grafito)}
.nav{display:flex;gap:28px;margin-left:auto;font-size:15px;font-weight:500}
.nav a{text-decoration:none;color:var(--gris);padding:5px 0;border-bottom:2px solid transparent}
.nav a:hover{color:var(--tinta);border-bottom-color:var(--hivis)}
.btn{display:inline-block;font-family:var(--display);font-weight:700;font-size:15px;text-decoration:none;padding:14px 26px;border:0;cursor:pointer;line-height:1.2}
.btn-hivis{background:var(--hivis);color:var(--tinta);box-shadow:5px 5px 0 var(--tinta)}
.btn-hivis:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--tinta)}
.btn-linea{border:2px solid var(--tinta);padding:12px 24px;background:transparent}
.btn-linea:hover{background:var(--tinta);color:var(--papel)}
.menu-btn{display:none;margin-left:auto;background:none;border:1px solid var(--linea-2);padding:10px 15px;font-family:var(--display);font-weight:600;cursor:pointer}

/* ---------- Portada ---------- */
.portada{position:relative;background:var(--papel);background-image:var(--reticula);background-size:34px 34px;overflow:hidden}
.portada::after{content:"";position:absolute;top:0;right:0;width:46%;height:100%;background:linear-gradient(105deg,transparent 0%,rgba(244,245,246,.9) 42%);pointer-events:none}
.portada .wrap{position:relative;z-index:2;padding:86px 30px 0}
.folio{display:flex;align-items:center;gap:14px;font-family:var(--display);font-size:12.5px;font-weight:700;letter-spacing:.14em;color:var(--gris);margin-bottom:26px}
.folio::before{content:"";width:46px;height:3px;background:var(--hivis)}
.portada h1{font-size:clamp(2.7rem,6.6vw,5.4rem);font-weight:900;max-width:16ch;letter-spacing:-.035em}
.portada h1 em{font-style:normal;display:block;color:var(--grafito)}
.portada .entrada{font-size:clamp(1.05rem,1.9vw,1.28rem);color:var(--grafito);max-width:50ch;margin-top:28px}
.acciones{display:flex;flex-wrap:wrap;gap:18px;margin-top:38px;align-items:center}

/* Dibujo técnico */
.plano{margin-top:64px;border-top:2px solid var(--tinta);position:relative}
.plano .rotulo{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:12px 0 18px;font-family:var(--display);font-size:13px;font-weight:700;letter-spacing:.1em;color:var(--gris)}
.plano .rotulo b{color:var(--tinta);font-weight:700}
.plano svg{width:100%;height:auto;display:block;overflow:visible}
.cable{fill:none;stroke:var(--grafito);stroke-width:1.6;stroke-dasharray:1700;stroke-dashoffset:1700;animation:tender 2.3s ease-out .35s forwards}
@keyframes tender{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:reduce){.cable{stroke-dashoffset:0}}
.poste-l{stroke:var(--tinta);stroke-width:6;stroke-linecap:square}
.tierra{stroke:var(--tinta);stroke-width:2}
.hatch line{stroke:var(--gris-cl);stroke-width:1}
.cota-l{stroke:var(--cota);stroke-width:1}
.cota-t{font-family:var(--display);font-size:11.5px;font-weight:600;fill:var(--cota);letter-spacing:.04em}
.punto{cursor:pointer}
.punto circle{fill:var(--hivis);stroke:var(--tinta);stroke-width:2;transition:transform .15s}
.punto text{font-family:var(--display);font-size:12px;font-weight:800;fill:var(--tinta);text-anchor:middle;dominant-baseline:central;pointer-events:none}
.punto:hover circle,.punto:focus-visible circle{fill:var(--tinta)}
.punto:hover text,.punto:focus-visible text{fill:var(--hivis)}
.guia{stroke:var(--tinta);stroke-width:1;stroke-dasharray:4 4}
.etiqueta{font-family:var(--display);font-size:13px;font-weight:700;fill:var(--tinta)}
.leyenda{display:none;list-style:none;margin-top:20px;font-size:15px;border-top:1px solid var(--linea)}
.leyenda li{display:flex;gap:14px;padding:11px 0;border-bottom:1px solid var(--linea)}
.leyenda b{font-family:var(--display);background:var(--hivis);width:24px;height:24px;display:grid;place-items:center;font-size:12px;flex-shrink:0}
.cierre{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--linea-2);margin-top:62px;border:1px solid var(--linea-2);border-bottom:0}
.cierre div{background:var(--papel);padding:30px 28px 36px}
.cierre b{font-family:var(--display);font-size:1.6rem;font-weight:800;display:block;letter-spacing:-.02em}
.cierre span{font-size:15px;color:var(--gris);display:block;margin-top:8px}

/* ---------- Clientes ---------- */
.clientes{background:var(--niebla)}
.clientes .wrap{padding:40px 30px;display:flex;align-items:center;gap:48px;flex-wrap:wrap}
.clientes p{font-size:15.5px;color:var(--grafito);max-width:30ch;border-left:3px solid var(--hivis);padding-left:16px}
.logos{display:flex;align-items:center;gap:50px;flex-wrap:wrap;margin-left:auto}
.logos img{height:34px;width:auto;filter:grayscale(1);opacity:.55}

/* ---------- Secciones ---------- */
section{padding:104px 0}
.enc{display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:start;margin-bottom:56px}
.enc .indice-num{font-family:var(--display);font-size:clamp(3rem,7vw,5.6rem);font-weight:900;line-height:.8;color:transparent;-webkit-text-stroke:1.5px var(--linea-2);letter-spacing:-.04em}
.enc h2{font-size:clamp(1.95rem,3.7vw,2.95rem);font-weight:800;max-width:19ch}
.enc p{margin-top:18px;color:var(--grafito);font-size:1.05rem;max-width:58ch}

/* Proceso */
.ruta{display:grid;grid-template-columns:repeat(5,1fr);position:relative;border-top:2px solid var(--tinta)}
.ruta::before{content:"";position:absolute;top:-2px;left:0;width:20%;height:2px;background:var(--hivis)}
.paso{padding:26px 26px 34px 0;position:relative}
.paso::before{content:"";position:absolute;top:-9px;left:0;width:15px;height:15px;background:var(--papel);border:3px solid var(--tinta);border-radius:50%}
.paso:first-child::before{background:var(--hivis)}
.paso .n{font-family:var(--display);font-size:12.5px;font-weight:800;color:var(--gris-cl);letter-spacing:.1em;display:block;margin:16px 0 10px}
.paso h3{font-size:1.1rem;font-weight:800;margin-bottom:9px}
.paso p{font-size:14.5px;color:var(--gris)}

.planta{margin-top:74px;display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center}
.marco{position:relative}
.marco::before{content:"";position:absolute;inset:-18px -18px 18px 18px;border:2px solid var(--hivis);z-index:0}
.marco img{position:relative;z-index:1;width:100%;min-height:340px;object-fit:cover;background:var(--niebla)}
.planta h3{font-size:1.6rem;font-weight:800;margin-bottom:18px;max-width:18ch}
.planta p{color:var(--grafito);margin-bottom:14px}
.normas{list-style:none;margin-top:28px;border-top:2px solid var(--tinta)}
.normas li{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--linea);font-size:15px}
.normas li span:first-child{color:var(--gris)}
.normas li span:last-child{font-family:var(--display);font-weight:700;text-align:right}

/* ---------- Catálogo ---------- */
.catalogo{background:var(--niebla)}
.indice{position:sticky;top:86px;z-index:40;background:rgba(244,245,246,.96);backdrop-filter:blur(8px);border-top:1px solid var(--linea-2);border-bottom:1px solid var(--linea-2)}
.indice ul{list-style:none;display:flex;gap:30px;overflow-x:auto;padding:17px 0;font-family:var(--display);font-size:14px;font-weight:700;letter-spacing:.02em}
.indice a{text-decoration:none;color:var(--gris);white-space:nowrap;padding-bottom:4px;border-bottom:2px solid transparent}
.indice a:hover{color:var(--tinta);border-bottom-color:var(--hivis)}
.grupo{margin-top:64px}
.grupo-enc{display:flex;align-items:baseline;gap:18px;padding-bottom:14px;border-bottom:2px solid var(--tinta)}
.grupo-enc h3{font-size:1.45rem;font-weight:800}
.grupo-enc .conteo{font-family:var(--display);font-size:13px;font-weight:700;color:var(--gris);margin-left:auto;letter-spacing:.08em}
.parte{display:grid;grid-template-columns:172px 1fr;gap:34px;padding:30px 0;border-bottom:1px solid var(--linea-2);align-items:start;scroll-margin-top:170px;transition:background .2s}
.parte:hover{background:var(--papel)}
.parte.resaltada{background:#FEF6DC}
.lamina{aspect-ratio:1;background:var(--papel);border:1px solid var(--linea-2);position:relative;overflow:hidden;background-image:var(--reticula);background-size:17px 17px}
.lamina::before,.lamina::after{content:"";position:absolute;width:11px;height:11px;border:1.5px solid var(--gris-cl);z-index:2}
.lamina::before{top:7px;left:7px;border-right:0;border-bottom:0}
.lamina::after{bottom:7px;right:7px;border-left:0;border-top:0}
.lamina img{width:100%;height:100%;object-fit:contain;position:relative;z-index:1;padding:12px;mix-blend-mode:multiply}
.lamina .vacio{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:12px;font-family:var(--display);font-size:10.5px;font-weight:700;color:var(--gris-cl);line-height:1.4}
.lamina.con-foto .vacio{display:none}
.parte .clave{display:inline-block;font-family:var(--display);font-size:12.5px;font-weight:800;letter-spacing:.09em;background:var(--tinta);color:var(--papel);padding:4px 9px}
.parte h4{font-size:1.38rem;font-weight:800;margin:12px 0 9px}
.parte .desc{font-size:15.5px;color:var(--grafito);max-width:62ch}
.atributos{display:flex;flex-wrap:wrap;gap:0 40px;margin-top:20px;padding-top:16px;border-top:1px dashed var(--linea-2)}
.atributos dt{font-family:var(--display);font-size:11px;font-weight:800;color:var(--gris);letter-spacing:.11em;margin-bottom:3px}
.atributos dd{font-size:14.5px}
.nota-catalogo{margin-top:54px;padding:34px 38px;background:var(--tinta);color:var(--papel);display:flex;gap:34px;align-items:center;flex-wrap:wrap;border-left:11px solid var(--hivis)}
.nota-catalogo p{max-width:54ch;font-size:16.5px}
.nota-catalogo .btn{margin-left:auto}

/* ---------- Aplicaciones ---------- */
.malla{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--linea-2);border:1px solid var(--linea-2)}
.malla div{background:var(--papel);padding:30px 24px 36px;position:relative;transition:background .2s}
.malla div:hover{background:var(--niebla)}
.malla b{font-family:var(--display);font-size:12px;font-weight:800;color:var(--tinta);background:var(--hivis);padding:3px 8px;display:inline-block;margin-bottom:16px;letter-spacing:.08em}
.malla span{font-size:16.5px;line-height:1.35;display:block;font-weight:500}

/* ---------- Comercialización ---------- */
.comercial{background:var(--niebla)}
.filas{border-top:2px solid var(--tinta)}
.fila{display:grid;grid-template-columns:44px 280px 1fr;gap:26px;padding:26px 0;border-bottom:1px solid var(--linea-2);align-items:baseline}
.fila .mk{font-family:var(--display);font-size:12px;font-weight:800;color:var(--gris-cl);letter-spacing:.08em}
.fila h3{font-size:1.18rem;font-weight:800}
.fila p{color:var(--grafito);font-size:15.5px}

/* ---------- Contacto ---------- */
.contacto-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.datos dl{margin-top:32px;border-top:2px solid var(--tinta)}
.datos dt{font-family:var(--display);font-size:11.5px;font-weight:800;color:var(--gris);letter-spacing:.11em;margin-top:22px}
.datos dd{font-size:18px;margin-top:4px;padding-bottom:18px;border-bottom:1px solid var(--linea)}
.datos a{text-decoration:none;box-shadow:inset 0 -8px 0 var(--hivis)}
form{background:var(--papel);border:2px solid var(--tinta);padding:38px;box-shadow:12px 12px 0 var(--niebla)}
.campo{margin-bottom:20px}
label{display:block;font-family:var(--display);font-size:12px;font-weight:800;letter-spacing:.09em;margin-bottom:8px;color:var(--grafito)}
input,textarea,select{width:100%;font-family:var(--texto);font-size:16px;padding:13px 15px;border:1px solid var(--linea-2);background:var(--niebla);color:var(--tinta)}
input:focus,textarea:focus,select:focus{border-color:var(--tinta);background:var(--papel)}
textarea{min-height:112px;resize:vertical}
.aviso{font-size:13.5px;color:var(--gris);margin-top:16px}

footer{background:var(--tinta);color:var(--gris-cl);padding:60px 0 34px;font-size:15px}
.pie-grid{display:flex;justify-content:space-between;gap:44px;flex-wrap:wrap;padding-bottom:32px;border-bottom:1px solid rgba(255,255,255,.14)}
footer strong{font-family:var(--display);color:var(--papel);font-size:19px;letter-spacing:.06em;display:block;margin-bottom:12px}
footer a{text-decoration:none}
footer a:hover{color:var(--hivis)}
.pie-legal{padding-top:24px;font-size:13.5px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

@media (max-width:1000px){
  .ruta{grid-template-columns:repeat(2,1fr)}
  .malla{grid-template-columns:repeat(2,1fr)}
  .planta,.contacto-grid{grid-template-columns:1fr;gap:40px}
  .fila{grid-template-columns:36px 1fr;gap:16px}
  .fila p{grid-column:2}
  .cierre{grid-template-columns:1fr}
}
@media (max-width:820px){
  .nav{display:none}
  .nav.abierto{display:flex;position:absolute;top:74px;left:0;right:0;background:var(--papel);flex-direction:column;padding:18px 30px;gap:2px;border-bottom:1px solid var(--linea)}
  .nav.abierto a{padding:12px 0}
  .topbar .btn{display:none}
  .topbar .wrap{height:74px}
  .marca img{height:46px}
  .menu-btn{display:block}
  .plano .etiqueta,.plano .guia,.plano .cota-l,.plano .cota-t{display:none}
  .leyenda{display:block}
  .indice{top:74px}
  .enc{grid-template-columns:1fr;gap:14px}
  .parte{grid-template-columns:108px 1fr;gap:22px}
  .parte h4{font-size:1.16rem}
  section{padding:70px 0}
  .portada .wrap{padding:58px 30px 0}
  .portada::after{display:none}
  .logos{margin-left:0;gap:32px}
  .nota-catalogo{padding:28px}
  .nota-catalogo .btn{margin-left:0}
  form{padding:28px;box-shadow:none}
}
