/* SYSDATEC 2027 · Sistema de Gestión de la Calidad (portal institucional) — maquetación propia de esta página.
   Sistema V3 (Manrope + Instrument Serif, azul/cian). Todo bajo .sq; sin dependencias de rc.css.
   Estándar de simetría: contenedor 1200, escala 4–64, columnas iguales (stretch / subgrid), acciones ancladas abajo. */
body{overflow-x:clip}
.sq{--blue:#0060D4;--deep:#002784;--ink:#050d24;--cyan:#01DAFE;--mist:#EAF3FF;--mut:#46567a;--bd:1px solid #d9e4fb;--sh:0 12px 32px #0027841a;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--r:24px;--rs:16px;--sec:clamp(32px,4vw,56px);
  font-family:'Manrope',system-ui,sans-serif;color:var(--ink);background:#fff;font-size:17px;line-height:1.6}
.sq *,.sq *::before,.sq *::after{box-sizing:border-box}
.sq h1,.sq h2,.sq h3,.sq h4{font-family:'Manrope',system-ui,sans-serif;font-weight:800;letter-spacing:-.03em;line-height:1.08;margin:0;color:var(--deep)}
.sq p{margin:0;color:inherit}.sq ul,.sq ol,.sq dl,.sq dd{margin:0;padding:0;list-style:none}
.sq img{display:block;max-width:100%}
.sq a{color:var(--blue)}
.sq :focus-visible{outline:3px solid #ffbf00;outline-offset:3px;border-radius:6px}
.sq .w{width:min(1200px,100% - 40px);margin-inline:auto}
.sq .serif{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em}
.sq .eyebrow{display:inline-block;color:var(--blue);font-weight:800;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase}
.sq h2{font-size:clamp(1.9rem,3.8vw,3rem);margin-top:var(--s3)}
.sq .sub{color:var(--mut);margin-top:var(--s4);max-width:64ch}
.sq .head{max-width:760px;margin-bottom:var(--s7)}.sq .head--c{margin-inline:auto;text-align:center}.sq .head--c .sub{margin-inline:auto}
.sq p a:not(.btn),.sq li a:not(.btn),.sq td a,.sq dd a{text-decoration:underline;text-underline-offset:3px}

/* Aviso provisional */
.sq .prev{background:#fff4d6;color:#4a3500;border-bottom:1px solid #f0d78a;font-size:.9rem;padding:var(--s2) 0}
.sq .prev .w{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s5)}
.sq .prev details{flex:1 1 280px;min-width:0}.sq .prev summary{cursor:pointer;font-weight:700;text-decoration:underline;min-height:24px}
.sq .prev ul{margin-top:var(--s2);padding-left:var(--s5);list-style:disc;display:grid;gap:4px}.sq .prev b{font-weight:800}.sq .prev a{color:inherit}

/* Botones */
.sq .btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:52px;padding:0 var(--s5);border-radius:99px;font:800 1rem/1.2 'Manrope',system-ui,sans-serif;text-decoration:none!important;text-align:center;cursor:pointer;border:2px solid var(--cyan);background:var(--cyan);color:var(--ink);transition:transform .2s,box-shadow .2s,background .2s}
.sq .btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px #01dafe55}
.sq .btn--ghost{background:transparent;color:#fff;border-color:#ffffffaa}.sq .btn--ghost:hover{background:#ffffff22;box-shadow:none}
.sq .btn--blue{background:var(--blue);border-color:var(--blue);color:#fff}.sq .btn--blue:hover{background:var(--deep);border-color:var(--deep);box-shadow:0 12px 26px #0060d44d}
.sq .btn--line{background:#fff;color:var(--deep);border-color:var(--deep)}.sq .btn--line:hover{background:var(--mist);box-shadow:none}
.sq .btn svg{width:20px;height:20px;flex:none}
.sq .acts{display:flex;flex-wrap:wrap;gap:var(--s3)}

/* HERO: texto + panel de certificados */
.sq .hero{position:relative;isolation:isolate;overflow:hidden;color:#fff;background:var(--ink);padding:var(--s7) 0 var(--s8)}
.sq .hero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(70% 60% at 88% 0%,#0060D4aa,transparent 70%),radial-gradient(50% 50% at 0% 100%,#01DAFE33,transparent 70%),linear-gradient(160deg,#050d24,#0a2160)}
.sq .hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(1,218,254,.07) 1px,transparent 1px) 0 0/64px 64px,linear-gradient(90deg,rgba(1,218,254,.07) 1px,transparent 1px) 0 0/64px 64px;mask-image:linear-gradient(180deg,#000 30%,transparent)}
.sq .crumb{font-size:.86rem;color:#cfe0ff;margin-bottom:var(--s5)}.sq .crumb a{color:#cfe0ff;text-decoration:underline;text-underline-offset:3px}.sq .crumb a:hover{color:#fff}.sq .crumb span{margin:0 6px;opacity:.6}
.sq .hgrid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:var(--s7);align-items:center}
.sq .pill{display:inline-block;border:1px solid #ffffff77;padding:6px var(--s4);border-radius:99px;font-size:.78rem;letter-spacing:.13em;text-transform:uppercase}
.sq .hero h1{color:#fff;font-size:clamp(2.4rem,5.2vw,4.4rem);margin:var(--s5) 0 var(--s4)}.sq .hero h1 .serif{color:var(--cyan);font-size:1.04em;display:block}
.sq .lead{font-size:1.12rem;color:#e4ecff;max-width:50ch}
.sq .hero .acts{margin-top:var(--s6)}
.sq .vig{background:#fff;color:var(--ink);border-radius:var(--r);box-shadow:0 30px 70px #0007;padding:var(--s6)}
.sq .vig h2{font-size:1.2rem;margin:0}.sq .vig>p{color:var(--mut);font-size:.92rem;margin-top:var(--s1)}
.sq .vig ul{margin-top:var(--s4)}
.sq .vig li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s4);align-items:center;padding:var(--s3) 0;border-top:1px solid #e3ebfa}
.sq .vig b{font-size:1.05rem;color:var(--deep)}.sq .vig small{display:block;color:var(--mut);font-size:.84rem;line-height:1.3}
.sq .vig .dt{font-weight:800;color:var(--deep);text-align:right;white-space:nowrap}.sq .vig .dt small{font-weight:600}

/* Índice de la página */
.sq .idx{background:#fff;border-bottom:1px solid #e3ebfa}
.sq .idx ul{display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5);padding:var(--s4) 0}
.sq .idx a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--deep);text-decoration:none}.sq .idx a:hover{color:var(--blue);text-decoration:underline;text-underline-offset:4px}

/* Secciones */
.sq .blk{padding-block:var(--sec);scroll-margin-top:96px}.sq .blk--tint{background:var(--mist)}.sq .blk--dark{background:var(--ink);color:#fff;position:relative;isolation:isolate;overflow:hidden}
.sq .blk--dark::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 80% at 90% 0%,#0060D488,transparent 70%),linear-gradient(160deg,#050d24,#0a2160)}
.sq .blk--dark h2{color:#fff}.sq .blk--dark .eyebrow{color:var(--cyan)}.sq .blk--dark .sub{color:#d6e4ff}

/* Identidad: misión y visión */
.sq .mv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5)}
.sq .mv article{display:flex;flex-direction:column;gap:var(--s3);background:#fff;border:var(--bd);border-radius:var(--r);box-shadow:var(--sh);padding:var(--s6)}
.sq .mv h3{font-size:1.6rem}.sq .mv h3 .serif{color:var(--blue)}.sq .mv p{color:var(--mut)}
.sq .vals{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--s7);margin-top:var(--s7)}
.sq .vals>div{padding:var(--s4) 0;border-top:1px solid #c9d7f2;display:grid;grid-template-columns:150px minmax(0,1fr);gap:var(--s4)}
.sq .vals dt{font-weight:800;color:var(--deep)}.sq .vals dd{color:var(--mut);font-size:.96rem}
.sq .vals-h{margin-top:var(--s7)}.sq .vals-h h3{font-size:1.5rem}.sq .vals-h p{color:var(--mut);margin-top:var(--s2);max-width:70ch}

/* Política */
.sq .pol{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--s8);align-items:start}
.sq .pol ol{display:grid}
.sq .pol li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:var(--s4);padding:var(--s5) 0;border-top:1px solid #ffffff33}.sq .pol li:last-child{border-bottom:1px solid #ffffff33}
.sq .pol .n{font:800 3rem/1 'Manrope',sans-serif;color:var(--cyan);letter-spacing:-.04em}
.sq .pol p{color:#eaf1ff}
.sq .central{margin-top:var(--s5);border-left:4px solid var(--cyan);background:#ffffff14;border-radius:0 var(--rs) var(--rs) 0;padding:var(--s4) var(--s5);color:#fff;font-weight:600}

/* Objetivos: pestañas verticales (con JS) o lista (sin JS) */
.sq .obj{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:var(--s5);align-items:stretch}
.sq .obj-tabs{display:grid;gap:var(--s2);align-content:start}
.sq .obj-tabs button{display:grid;grid-template-columns:40px minmax(0,1fr);gap:var(--s3);align-items:center;text-align:left;font:700 1rem/1.3 'Manrope',system-ui,sans-serif;color:var(--deep);background:#fff;border:var(--bd);border-radius:var(--rs);padding:var(--s3) var(--s4);min-height:64px;cursor:pointer}
.sq .obj-tabs button span{width:40px;height:40px;border-radius:50%;background:var(--mist);color:var(--blue);display:grid;place-items:center;font-weight:800}
.sq .obj-tabs button[aria-selected=true]{background:var(--deep);color:#fff;border-color:var(--deep)}.sq .obj-tabs button[aria-selected=true] span{background:var(--cyan);color:var(--ink)}
.sq .obj-panels{display:grid;background:#fff;border:var(--bd);border-radius:var(--r);box-shadow:var(--sh)}
.sq .obj-panels>div{grid-area:1/1;padding:var(--s7);display:flex;flex-direction:column;justify-content:center;gap:var(--s3)}
.sq .obj-panels .n{font:800 3.4rem/1 'Manrope',sans-serif;color:var(--blue);letter-spacing:-.05em}
.sq .obj-panels h3{font-size:1.6rem}.sq .obj-panels p{color:var(--mut)}
.sq .obj.is-tabs .obj-panels>div:not(.on){visibility:hidden;opacity:0}
.sq .obj:not(.is-tabs) .obj-tabs{display:none}.sq .obj:not(.is-tabs){grid-template-columns:minmax(0,1fr)}
.sq .obj:not(.is-tabs) .obj-panels{display:block;background:none;border:0;box-shadow:none}.sq .obj:not(.is-tabs) .obj-panels>div{background:#fff;border:var(--bd);border-radius:var(--r);margin-bottom:var(--s3);padding:var(--s5)}

/* Mapa de procesos */
.sq .map{display:grid;grid-template-columns:minmax(0,.55fr) minmax(0,3fr) minmax(0,.55fr);gap:var(--s4);align-items:stretch}
.sq .map-io{display:flex;align-items:center;justify-content:center;text-align:center;background:var(--deep);color:#fff;border-radius:var(--r);padding:var(--s5) var(--s4);font-weight:800;line-height:1.25;font-size:1rem}
.sq .map-io span{display:block;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);margin-bottom:var(--s2)}
.sq .bands{display:grid;gap:var(--s3)}
.sq .band-p{display:grid;grid-template-columns:150px minmax(0,1fr);gap:var(--s4);align-items:stretch;background:#fff;border:var(--bd);border-radius:var(--rs);padding:var(--s3)}
.sq .band-p>h3{display:flex;align-items:center;font-size:1rem;line-height:1.25;padding:var(--s2) var(--s3);background:var(--mist);border-radius:12px;color:var(--deep)}
.sq .band-p ul{display:grid;grid-template-columns:repeat(var(--n,2),minmax(0,1fr));gap:var(--s3)}
.sq .band-p li{padding:var(--s3) var(--s4);border:1px solid #d9e4fb;border-radius:12px}
.sq .band-p b{display:block;color:var(--deep);line-height:1.25}.sq .band-p span{display:block;color:var(--mut);font-size:.9rem;line-height:1.4;margin-top:var(--s1)}
.sq .band-p--m{--n:3}
.sq .loop{margin-top:var(--s4);display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s5);align-items:center;background:var(--ink);color:#fff;border-radius:var(--rs);padding:var(--s4) var(--s5)}
.sq .loop b{color:var(--cyan)}.sq .loop p{color:#d6e4ff;font-size:.95rem}.sq .loop .btn{min-height:44px}

/* Certificaciones: fichas con filas alineadas (subgrid) */
.sq .certs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s5)}
.sq .cc{margin-bottom:var(--s5)}
.sq .cc{display:grid;grid-template-rows:subgrid;grid-row:span 4;row-gap:var(--s3);background:#fff;border:var(--bd);border-radius:var(--r);box-shadow:var(--sh);padding:var(--s5)}
.sq .cc h3{font-size:1.5rem}.sq .cc h3 small{display:block;font:800 .74rem/1.3 'Manrope',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-top:var(--s2)}
.sq .cc .al{color:var(--ink);font-size:.95rem;font-weight:600}.sq .cc .al small{display:block;color:var(--mut);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.72rem;margin-bottom:var(--s1)}
.sq .cc dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2) var(--s5);align-content:start;font-size:.92rem}.sq .cc dl div{display:grid;gap:0;padding-top:var(--s2);border-top:1px solid #e3ebfa}
.sq .cc dt{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:800;color:var(--mut)}.sq .cc dd{font-weight:700;color:var(--deep)}
.sq .cc .btn{min-height:44px;font-size:.95rem;align-self:end}
.sq .certs-note{margin-top:var(--s5);color:var(--mut);font-size:.92rem;max-width:90ch}

/* Matriz de alcance por programa */
.sq .tw{position:relative;overflow-x:auto;border:var(--bd);border-radius:var(--r);background:#fff;box-shadow:var(--sh)}
.sq table{width:100%;border-collapse:collapse;min-width:520px}
.sq th,.sq td{padding:var(--s4) var(--s5);text-align:center;border-top:1px solid #e3ebfa;vertical-align:middle}
.sq thead th{border-top:0;background:var(--deep);color:#fff;font-size:.85rem;letter-spacing:.04em;line-height:1.3;font-weight:800}
.sq th[scope=row]{text-align:left;font-weight:700;color:var(--deep);min-width:200px}
.sq thead th:first-child{text-align:left}
.sq .ok,.sq .no{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%}
.sq .ok{background:#dff3e8;color:#0d6a3a}.sq .no{background:#eef1f6;color:#8a97ad}
.sq .ok svg,.sq .no svg{width:18px;height:18px}
.sq .ss{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sq .tnote{margin-top:var(--s4);display:grid;gap:var(--s2);color:#33415c;font-size:.95rem;max-width:90ch}.sq .tnote strong{color:var(--deep)}

/* Beneficios y prácticas */
.sq .ben{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--s7)}
.sq .ben>div{padding:var(--s5) 0;border-top:1px solid #c9d7f2}.sq .ben h3{font-size:1.25rem}.sq .ben p{color:var(--mut);margin-top:var(--s2)}
.sq .prac{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s7);align-items:start}
.sq .prac>div:first-child p{color:var(--mut);margin-top:var(--s4)}
.sq .prac ul{display:grid;background:#fff;border:var(--bd);border-radius:var(--r);box-shadow:var(--sh);padding:0 var(--s6)}
.sq .prac li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:var(--s3);padding:var(--s4) 0;border-top:1px solid #e3ebfa;font-weight:600;color:var(--deep);line-height:1.4}.sq .prac li:first-child{border-top:0}
.sq .prac li svg{width:24px;height:24px;color:var(--blue)}

/* Documentos y accesos */
.sq .docs{border-top:1px solid #c9d7f2}
.sq .docs li{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.4fr) 220px;gap:var(--s5);align-items:center;padding:var(--s4) 0;border-bottom:1px solid #c9d7f2}
.sq .docs h3{font-size:1.1rem}.sq .docs p{color:var(--mut);font-size:.95rem}
.sq .docs .btn{min-height:44px;font-size:.95rem;width:100%}
.sq .docs-h{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--s7);margin-bottom:var(--s7);align-items:end}.sq .docs-h .head{margin:0}

/* Cierre */
.sq .band{padding:var(--sec) 0;background:#fff}
.sq .band-in{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s7);align-items:center;background:linear-gradient(150deg,#001a5e,var(--deep) 60%,var(--blue));color:#fff;border-radius:var(--r);padding:var(--s7)}
.sq .band h2{margin:0;color:#fff;font-size:clamp(1.7rem,3.2vw,2.4rem)}.sq .band p{color:#d6e4ff;margin-top:var(--s3);max-width:54ch}
.sq .band .acts{flex-direction:column;min-width:240px}

@media(max-width:1100px){
  .sq .map{grid-template-columns:minmax(0,1fr)}.sq .map-io{padding:var(--s4)}
  .sq .docs li{grid-template-columns:minmax(0,1fr) 220px}.sq .docs li p{grid-column:1;grid-row:2}.sq .docs li .btn{grid-column:2;grid-row:1/3}
}
@media(max-width:1000px){
  .sq .pol,.sq .obj,.sq .prac,.sq .docs-h{grid-template-columns:minmax(0,1fr)}.sq .pol{gap:var(--s6)}
  .sq .obj-panels>div{padding:var(--s6)}
  .sq .band-p{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:900px){
  .sq .certs{grid-template-columns:minmax(0,1fr)}
  .sq .hgrid,.sq .band-in{grid-template-columns:minmax(0,1fr)}
  .sq .band-in{padding:var(--s6)}.sq .band .acts{flex-direction:row;min-width:0}
  .sq .mv,.sq .vals,.sq .ben{grid-template-columns:minmax(0,1fr)}
  .sq .band-p--m ul{grid-template-columns:minmax(0,1fr)}.sq .band-p ul{grid-template-columns:minmax(0,1fr)}
  .sq .loop{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:700px){
  .sq .docs li{grid-template-columns:minmax(0,1fr)}.sq .docs li p,.sq .docs li .btn{grid-column:1;grid-row:auto}
}
@media(max-width:600px){
  .sq{font-size:16px}
  .sq .cc dl{grid-template-columns:minmax(0,1fr)}
  .sq .acts>.btn{flex:1 1 100%}
  .sq .vig,.sq .mv article,.sq .cc{padding:var(--s5)}
  .sq .vals>div{grid-template-columns:minmax(0,1fr);gap:var(--s1)}
  .sq .pol li{grid-template-columns:52px minmax(0,1fr)}.sq .pol .n{font-size:2.2rem}
  .sq .obj-panels>div{padding:var(--s5)}
  .sq .prac ul{padding:0 var(--s4)}
  .sq table{min-width:0}.sq th,.sq td{padding:var(--s3) 6px}.sq th:first-child,.sq td:first-child{padding-left:var(--s3)}.sq th[scope=row]{min-width:0;font-size:.86rem;line-height:1.3}.sq thead th{font-size:.7rem;padding:var(--s3) 4px;}.sq .ok,.sq .no{width:28px;height:28px}
  .sq .vig li{grid-template-columns:minmax(0,1fr)}.sq .vig .dt{text-align:left}
}
@media(prefers-reduced-motion:reduce){.sq .btn{transition:none}.sq .btn:hover{transform:none}}
