/* Championsys CRM — páginas de documento (legales, soporte)
   Usa los tokens del sistema de la landing definidos en landing.css. */

.doc-wrap{max-width:820px;margin:0 auto;padding:0 30px}
.doc-head{padding:44px 0 0}

.doc-back{
  display:inline-flex;align-items:center;gap:8px;
  font-size:13px;font-weight:700;color:var(--muted);
  padding:9px 14px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.62);transition:.22s
}
.doc-back:hover{color:var(--ink);border-color:var(--navy);background:#fff}
.doc-back span{font-size:15px;line-height:1}

.doc-head h1{
  font-size:clamp(32px,4.4vw,48px);line-height:1.03;
  letter-spacing:-.03em;font-weight:800;margin:20px 0 0
}
.doc-date{font-size:12.5px;color:var(--muted);font-weight:600;margin:12px 0 0}

.doc-body{padding:34px 0 20px}
.doc-body>p:first-child{
  font-size:clamp(16px,1.4vw,18.5px);line-height:1.62;
  color:var(--ink2);font-weight:500
}
.doc-body h2{
  font-size:19px;letter-spacing:-.4px;font-weight:800;
  margin:38px 0 0;padding-top:22px;border-top:1px solid var(--line)
}
.doc-body h2:first-of-type{margin-top:32px}
.doc-body p{margin:12px 0 0;font-size:15px;line-height:1.68;color:var(--ink2);font-weight:500}
.doc-body ul{list-style:none;margin:14px 0 0;padding:0}
.doc-body li{
  position:relative;padding:0 0 11px 22px;
  font-size:15px;line-height:1.62;color:var(--ink2);font-weight:500
}
.doc-body li::before{
  content:"";position:absolute;left:0;top:8px;
  width:8px;height:8px;border-radius:3px;background:var(--coral)
}
.doc-body strong{color:var(--ink);font-weight:800}
.doc-body a{color:var(--violet);font-weight:700}
.doc-body a:hover{color:var(--coral)}

/* --- soporte: canales --- */
.doc-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:28px 0 0}
.doc-card{background:var(--card);border-radius:20px;padding:24px;box-shadow:var(--sh-sm)}
.doc-card .ic{
  width:36px;height:36px;border-radius:12px;display:grid;place-items:center;
  color:#fff;font-size:16px;margin-bottom:14px
}
.doc-card h3{font-size:15.5px;letter-spacing:-.3px;font-weight:800}
.doc-card p{margin:7px 0 0;font-size:13.5px;line-height:1.55;color:var(--ink2);font-weight:500}
.doc-card a{display:inline-block;margin-top:12px;font-size:12.5px;font-weight:700;color:var(--violet);overflow-wrap:anywhere;line-height:1.4}

/* --- soporte: matriz ITIL --- */
.doc-tbl{
  margin-top:26px;background:var(--card);border-radius:var(--r);
  box-shadow:var(--sh-sm);overflow-x:auto;overflow-y:hidden
}
.doc-tbl table{width:100%;border-collapse:collapse;min-width:520px}
.doc-tbl th{
  text-align:left;font-size:11px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);font-weight:800;padding:17px 22px;border-bottom:1.5px solid var(--line)
}
.doc-tbl td{
  padding:15px 22px;font-size:14px;color:var(--ink2);
  border-bottom:1px solid var(--line);font-weight:600
}
.doc-tbl tr:last-child td{border-bottom:0}
.doc-tbl tr:hover td{background:#fafbfe}
.doc-tbl .pri{display:flex;align-items:center;gap:9px;white-space:nowrap;color:var(--ink);font-weight:800}
.doc-tbl .dot{width:9px;height:9px;border-radius:50%;flex:none}

/* --- cierre --- */
.doc-cta{
  margin:46px 0 0;background:var(--dark);color:#fff;
  border-radius:30px;padding:46px 40px;text-align:center;overflow:hidden
}
.doc-cta h2{font-size:clamp(23px,3vw,31px);letter-spacing:-.6px;font-weight:800;margin:0;border:0;padding:0;color:#fff}
.doc-cta p{margin:14px auto 0;max-width:46ch;font-size:15px;line-height:1.6;color:#a9b0d4;font-weight:500}
.doc-cta .btn{margin-top:24px}

@media (max-width:860px){
  .doc-cards{grid-template-columns:1fr}
}
@media (max-width:760px){
  .doc-wrap{padding:0 20px}
  .doc-cta{padding:38px 24px;border-radius:26px}
}