/* ===================================================================
   TREMEX Integral de Transporte, S.A. de C.V.
   Hoja de estilos institucional — Documentos internos
   =================================================================== */
:root{
  --navy:#1B2A4A; --navy-dark:#16294d; --navy-2:#22407a;
  --blue:#2E7CF6; --blue-lt:#5b9dff; --paper-blue:#f4f8ff;
  --ink:#2c3a52; --ink-soft:#3a4a63; --muted:#7a869a; --line:#d9e6ff;
}
@page{ size:letter; margin:0; }
*{ margin:0; padding:0; box-sizing:border-box; }
body{ font-family:'Helvetica Neue',Arial,sans-serif; color:var(--navy); background:#eef2f8; }

.page{
  width:8.5in; min-height:11in; margin:0 auto; background:#fff;
  position:relative; padding-bottom:1.25in;
  box-shadow:0 2px 14px rgba(20,35,70,.14);
}
.page + .page{ margin-top:22px; }

/* ===== MEMBRETE ===== */
.letterhead{
  background:linear-gradient(120deg,#16294d 0%,#1B2A4A 45%,#22407a 100%);
  padding:24px 1in 22px 1in; position:relative; overflow:hidden;
}
.letterhead::after{
  content:''; position:absolute; right:-60px; top:-40px; width:260px; height:260px;
  border-radius:50%; background:radial-gradient(circle,rgba(46,124,246,.35) 0%,rgba(46,124,246,0) 70%);
}
.letterhead::before{
  content:''; position:absolute; left:0; bottom:0; height:5px; width:100%;
  background:linear-gradient(90deg,#2E7CF6 0%,#5b9dff 50%,#2E7CF6 100%);
}
.lh-inner{ display:flex; align-items:center; justify-content:space-between; position:relative; z-index:2; }
.lh-inner img{ height:70px; }
.lh-meta{ text-align:right; color:#cdd9ef; font-size:10.5px; line-height:1.7; }
.lh-meta .badge{
  display:inline-block; background:var(--blue); color:#fff; font-weight:700;
  font-size:10px; letter-spacing:1.5px; padding:5px 12px; border-radius:4px; margin-bottom:8px;
}
.lh-meta strong{ color:#fff; }

/* ===== CUERPO ===== */
.content{ padding:26px 1in 0 1in; }
.titlebox{ margin-bottom:20px; border-bottom:2px solid var(--line); padding-bottom:14px; }
.titlebox .kicker{ font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--blue); font-weight:700; }
.titlebox h1{ font-size:22px; color:var(--navy); margin-top:6px; line-height:1.22; }
.titlebox .sub{ font-size:12px; color:var(--ink-soft); margin-top:8px; }

.doc h2{
  font-size:14.5px; color:var(--navy); margin:22px 0 10px; padding-left:11px;
  border-left:4px solid var(--blue); line-height:1.3;
}
.doc h3{ font-size:12.5px; color:var(--navy-2); margin:15px 0 7px; font-weight:700; }
.doc p{ font-size:11.5px; line-height:1.6; color:var(--ink); margin-bottom:9px; text-align:justify; }
.doc ul,.doc ol{ margin:0 0 11px 20px; }
.doc li{ font-size:11.5px; line-height:1.55; color:var(--ink); margin-bottom:5px; text-align:justify; }
.doc .art{ font-size:11.5px; line-height:1.6; color:var(--ink); margin-bottom:9px; text-align:justify; }
.doc .art b, .doc .artno{ color:var(--navy); font-weight:700; }

/* Cajas de énfasis */
.callout{ background:var(--paper-blue); border-left:4px solid var(--blue);
  padding:12px 16px; border-radius:0 8px 8px 0; margin:6px 0 16px; }
.callout p{ margin:0; font-size:11.5px; }
.callout .tag{ display:block; font-size:10px; letter-spacing:1.2px; text-transform:uppercase;
  color:var(--blue); font-weight:700; margin-bottom:5px; }

.note-warn{ background:#fff6f2; border-left:4px solid #e0672e; }
.note-warn .tag{ color:#c9531f; }

/* Tablas */
table.doc-tbl{ width:100%; border-collapse:collapse; margin:6px 0 16px; font-size:11px; }
table.doc-tbl th{ background:var(--navy); color:#fff; text-align:left; padding:8px 10px; font-size:10.5px;
  letter-spacing:.4px; }
table.doc-tbl td{ border:1px solid var(--line); padding:8px 10px; color:var(--ink); vertical-align:top; line-height:1.5; }
table.doc-tbl tr:nth-child(even) td{ background:#f8fbff; }
table.doc-tbl td.k{ background:#eef4ff; font-weight:700; color:var(--navy); width:32%; }

/* Ficha (perfil de puesto) */
.ident{ display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--line);
  border-radius:8px; overflow:hidden; margin:4px 0 16px; }
.ident div{ padding:9px 12px; font-size:11px; border-bottom:1px solid var(--line); }
.ident div:nth-child(odd){ background:#eef4ff; font-weight:700; color:var(--navy); }
.ident div .val{ font-weight:400; color:var(--ink); }

/* Firmas */
.signrow{ display:flex; gap:40px; margin-top:34px; flex-wrap:wrap; }
.signrow .sign{ flex:1; min-width:200px; }
.signrow .line{ border-top:1.5px solid var(--navy); padding-top:7px; margin-top:40px; }
.signrow .who{ font-weight:700; font-size:12px; color:var(--navy); }
.signrow .whorole{ font-size:10.5px; color:var(--muted); margin-top:2px; }

/* ===== PIE ===== */
.footer{
  position:absolute; bottom:0; left:0; right:0; background:var(--navy); color:#aebfdc;
  padding:13px 1in; display:flex; align-items:center; justify-content:space-between; font-size:9px;
}
.footer .fbar{ position:absolute; top:0; left:0; right:0; height:4px;
  background:linear-gradient(90deg,#2E7CF6 0%,#5b9dff 50%,#2E7CF6 100%); }
.footer strong{ color:#fff; letter-spacing:.4px; }

/* ===== PORTADA ===== */
.page.cover{ padding-bottom:0; }
.cover{ min-height:11in; display:flex; flex-direction:column; }
.cover .cover-hero{ flex:1; background:linear-gradient(150deg,#16294d 0%,#1B2A4A 55%,#22407a 100%);
  color:#fff; padding:1in; display:flex; flex-direction:column; justify-content:center; position:relative; overflow:hidden; }
.cover .cover-hero::after{ content:''; position:absolute; right:-120px; bottom:-120px; width:420px; height:420px;
  border-radius:50%; background:radial-gradient(circle,rgba(46,124,246,.30) 0%,rgba(46,124,246,0) 70%); }
.cover img{ height:88px; margin-bottom:40px; position:relative; z-index:2; }
.cover .c-kicker{ font-size:12px; letter-spacing:3px; text-transform:uppercase; color:var(--blue-lt);
  font-weight:700; position:relative; z-index:2; }
.cover h1{ font-size:38px; line-height:1.15; margin:14px 0 18px; position:relative; z-index:2; }
.cover .c-sub{ font-size:14px; color:#cdd9ef; max-width:5.2in; line-height:1.6; position:relative; z-index:2; }
.cover .cover-foot{ background:var(--navy-dark); color:#aebfdc; padding:20px 1in; font-size:11px;
  display:flex; justify-content:space-between; align-items:center; }
.cover .cover-foot strong{ color:#fff; }

/* ===== EVALUACIONES ===== */
.eval-meta{ display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--line);
  border-radius:8px; overflow:hidden; margin:4px 0 18px; }
.eval-meta div{ padding:9px 12px; font-size:11px; border-bottom:1px solid var(--line); }
.eval-meta div:nth-child(odd){ background:#eef4ff; font-weight:700; color:var(--navy); }
.eval-meta .fill{ display:inline-block; border-bottom:1px solid #9db8e6; min-width:60%; }

.q{ margin:0 0 13px; padding:11px 14px; border:1px solid var(--line); border-left:4px solid var(--blue);
  border-radius:0 8px 8px 0; background:#fcfdff; page-break-inside:avoid; }
.q .qh{ font-size:11.5px; color:var(--navy); font-weight:700; line-height:1.5; margin-bottom:7px; }
.q .qh .qn{ display:inline-block; background:var(--navy); color:#fff; font-size:10px; font-weight:700;
  border-radius:4px; padding:1px 7px; margin-right:7px; }
.opts{ list-style:none; margin:0; padding:0; }
.opts li{ font-size:11px; color:var(--ink); margin:0 0 5px; padding-left:26px; position:relative; line-height:1.45; }
.opts li::before{ content:''; position:absolute; left:2px; top:1px; width:13px; height:13px;
  border:1.5px solid #9db8e6; border-radius:3px; background:#fff; }
.opts li .ol{ display:inline-block; font-weight:700; color:var(--navy-2); margin-right:5px; }
.q .ans-line{ margin-top:6px; }
.q .ans-line .ln{ display:block; border-bottom:1px solid #cbd9f2; height:19px; }
.vf{ display:flex; gap:22px; margin-top:4px; }
.vf span{ font-size:11px; color:var(--ink); }
.vf span b{ display:inline-block; width:13px; height:13px; border:1.5px solid #9db8e6; border-radius:3px;
  background:#fff; vertical-align:-2px; margin-right:5px; }
.scorebox{ display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:8px 0 16px; }
.scorebox .sc{ border:1px solid var(--line); border-top:3px solid var(--blue); border-radius:8px;
  padding:10px 12px; text-align:center; }
.scorebox .sc .lab{ font-size:9.5px; text-transform:uppercase; letter-spacing:.6px; color:var(--muted); font-weight:700; }
.scorebox .sc .num{ font-size:18px; color:var(--navy); font-weight:700; margin-top:4px; }

@media print{
  body{ background:#fff; }
  .page{ box-shadow:none; margin:0; page-break-after:always; }
  .page:last-child{ page-break-after:auto; }
  h2,h3{ page-break-after:avoid; }
  table,.callout,.ident,.signrow,.q,.scorebox{ page-break-inside:avoid; }
}