/* =====================================================================
   Eliductos — estilos de las páginas interiores (catálogo, aplicaciones, descargas, ducto helicoidal).
   27-10-2026: el menú, el pie, las letras y los colores salen de marco.css (la identidad de la landing);
   aquí quedan solo las piezas propias de estas páginas.
   Consolidada desde el HTML original (preview Vercel 22-ago). Los valores
   de diseño (paleta, tipografías, tamaños) se mantienen idénticos.
   Las diferencias entre páginas se resuelven con la clase del <body>:
   .page-home, .page-catalogo, .page-institucional, .page-recursos
   ===================================================================== */

:root{
  --navy-dark:#132447; --navy:#132447; --blue:#28649A; --blue-2:#357DB7; --red:#d7251c;
  --ink:#313131; --steel:#5B6674; --steel-light:#5B6674;
  --paper:#ffffff; --paper-alt:#F2F5F8; --line:#C9D2DC; --onDark:#B9C6D6; --green:#2e7d4f;
}
main.interior{padding-top:calc(64px + env(safe-area-inset-top, 0px)); font-size:16px;}
main.interior a{text-decoration:none;}
h1,h2,h3{font-weight:800;}
a:hover{color:var(--blue);}
.eyebrow{font:600 .95rem var(--text); color:var(--blue-ink);}

/* Contenedores: .container-wide = 1200px (header/footer en todas las páginas) */
.container,.container-wide{max-width:1200px; margin:0 auto; padding:0 40px;}
.page-recursos .container{max-width:1000px;}

/* Botones (sirven como <a> o <button>) */
.btn-primary{display:inline-flex; align-items:center; gap:8px; background:var(--blue); color:#fff; font-weight:700; padding:14px 26px; border-radius:4px; border:none; cursor:pointer; font-size:15px; font-family:var(--text); white-space:nowrap; line-height:normal;}
.btn-primary:hover{background:var(--navy); color:#fff;}
.btn-secondary{display:inline-flex; align-items:center; gap:8px; background:transparent; color:var(--navy); font-weight:700; padding:12.5px 24px; border-radius:4px; border:1.5px solid var(--navy); cursor:pointer; font-size:15px; font-family:var(--text); white-space:nowrap; line-height:normal;}
.btn-secondary:hover{background:var(--navy); color:#fff;}
.page-recursos .btn-secondary{padding:10px 20px; font-size:14px;}
.btn-small{display:inline-block; background:var(--blue); color:#fff; font-weight:700; padding:9px 18px; border:none; border-radius:4px; font-size:13.5px; font-family:var(--text); cursor:pointer; line-height:normal;}
.btn-small:hover{background:var(--navy); color:#fff;}

/* Tarjetas */
.card{position:relative; border:1px solid var(--line); background:#fff; border-radius:6px; padding:26px; box-shadow:0 1px 3px rgba(19,36,71,.06);}
.page-home .card{padding:28px;}
.sample-tag{position:absolute; top:14px; right:14px; background:var(--red); color:#fff; font-family:var(--text); font-size:10.5px; font-weight:700; letter-spacing:.08em; padding:4px 9px; text-transform:uppercase; border-radius:3px;}

/* ---------- Grillas (desktop idéntico al original) ---------- */
.grid-split{display:grid; grid-template-columns:1.1fr 1fr; gap:56px; align-items:start;}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:20px;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.grid-halves{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
.norm-strip{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.norm-strip > div{background:#fff; padding:20px 22px;}
.norm-cols{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.band{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}

/* Casos (tarjeta con franja de color o foto) */
.caso-media{background:linear-gradient(135deg, var(--navy) 0%, var(--blue) 100%); opacity:.85; background-size:cover; background-position:center;}
.caso-media.has-img{opacity:1;}

/* Tabla de especificaciones (catálogo) */
table.specs{width:100%; border-collapse:collapse; font-size:14px;}
table.specs td{padding:14px 18px; border-bottom:1px solid var(--line);}
table.specs td:first-child{color:var(--steel-light); width:42%; font-family:var(--text); font-size:12px; font-weight:700; letter-spacing:.03em; text-transform:uppercase;}
table.specs tr:last-child td{border-bottom:none;}

/* ---------- Recursos / descargas ---------- */
.field{width:100%; padding:11px 13px; border:1px solid var(--line); background:var(--paper-alt); font-family:inherit; font-size:14px; border-radius:4px; margin-bottom:10px;}
.field:focus{outline:2px solid var(--blue); border-color:var(--blue);}
.resource-row{display:flex; align-items:center; gap:20px;}
.resource-form{display:none; border-top:1px solid var(--line); margin-top:20px; padding-top:20px; max-width:360px;}
.resource-form.open{display:block;}
.form-success{display:none; align-items:center; gap:10px; border-top:1px solid var(--line); margin-top:20px; padding-top:16px; flex-wrap:wrap;}
.form-success a{color:var(--blue); text-decoration:underline;}
.form-error{display:none; font-size:12.5px; color:var(--red); margin:0 0 10px;}
.tag{font-family:var(--text); font-size:11px; font-weight:700; background:var(--paper-alt); color:var(--navy); padding:6px 10px; border:1px solid var(--line); min-width:38px; text-align:center; border-radius:4px;}

/* ---------- Móvil ---------- */
@media (max-width:900px){
  .container,.container-wide{padding-left:20px; padding-right:20px;}


  .grid-split,.grid-halves{grid-template-columns:1fr; gap:36px;}
  .grid-3{grid-template-columns:1fr;}
  .page-catalogo .grid-2,.page-institucional .grid-2{grid-template-columns:1fr;}
  .norm-strip{grid-template-columns:repeat(2,1fr);}
  .norm-cols{grid-template-columns:1fr; gap:22px;}
  .resource-row{flex-wrap:wrap; gap:12px;}
  .resource-form{max-width:none;}
  .hero-title{font-size:36px !important;}
}
@media (max-width:600px){
  .page-home .grid-2{grid-template-columns:1fr;}
  .hero-title{font-size:32px !important;}
  table.specs td{padding:12px 14px;}
  table.specs td:first-child{width:40%;}
}
