:root{
 --blue:#195999;
 --blue-dark:#154A80;
 --blue-light:#EAF2F8;
 --bg:#F2F2F2;
 --white:#FFFFFF;
 --text:#17324D;
 --muted:#64748B;
 --red:#E21B23;
 --line:#D8E1E8;
 --sidebar:300px;
 --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
 margin:0;background:var(--bg);color:var(--text);
 font-family:Inter,Roboto,Arial,sans-serif;line-height:1.66
}
h1,h2,h3,h4{font-family:Montserrat,Inter,Roboto,Arial,sans-serif}
a{color:inherit}
img{max-width:100%;height:auto;display:block}

/* Menú inspirado en la estructura del manual /ayuda/ */
.sidebar{
 position:fixed;left:0;top:0;bottom:0;width:var(--sidebar);
 background:var(--blue);color:#fff;overflow-y:auto;z-index:50;
 border-right:1px solid rgba(0,0,0,.08)
}
.brand-wrap{
 background:#fff;padding:20px 18px 16px;border-bottom:5px solid var(--red)
}
.brand-wrap img{width:100%;height:auto}
.side-heading{
 padding:20px 22px 10px;font-size:.76rem;font-weight:900;
 letter-spacing:.12em;text-transform:uppercase;color:#D8E9F7
}
.side-nav{padding:0 12px 20px}
.side-section{margin-bottom:8px}
.side-section-title{
 display:block;padding:10px 12px;color:#fff;font-weight:900;
 text-decoration:none;border-radius:7px
}
.side-section-title:hover{background:rgba(255,255,255,.10)}
.side-sub{display:grid;gap:2px;margin:2px 0 8px}
.side-sub a{
 color:#EAF4FC;text-decoration:none;padding:8px 12px 8px 24px;
 border-radius:7px;font-size:.91rem;border-left:3px solid transparent
}
.side-sub a:hover{background:rgba(255,255,255,.09)}
.side-sub a.active{
 background:#fff;color:var(--blue);font-weight:900;border-left-color:var(--red)
}
.side-contact{
 margin:10px 16px 22px;padding:16px;border-top:1px solid rgba(255,255,255,.25);
 font-size:.88rem
}
.side-contact strong{display:block;margin-bottom:7px}
.side-contact a{display:block;text-decoration:none;color:#fff;margin:5px 0}

/* Página */
.page{margin-left:var(--sidebar);min-height:100vh}
.mobile-head{display:none}
.top-strip{
 height:12px;background:var(--blue);border-bottom:3px solid var(--red)
}
.content-shell{width:min(var(--max),calc(100% - 54px));margin:auto}
.breadcrumb{
 padding:22px 0 10px;font-size:.88rem;color:var(--muted)
}
.breadcrumb a{text-decoration:none;color:var(--blue)}
.page-header{
 background:#fff;border:1px solid var(--line);
 border-radius:3px;padding:30px 34px;margin-bottom:22px
}
.page-header .section-code{
 color:var(--red);font-weight:900;text-transform:uppercase;
 letter-spacing:.08em;font-size:.8rem
}
.page-header h1{
 margin:7px 0 9px;font-size:clamp(2rem,4vw,3.25rem);
 color:var(--blue)
}
.page-header p{margin:0;max-width:880px;color:var(--muted);font-size:1.08rem}

.article{
 background:#fff;border:1px solid var(--line);
 padding:34px 38px;margin-bottom:24px
}
.article h2{
 margin:32px 0 12px;color:var(--blue);font-size:1.5rem;
 border-bottom:1px solid var(--line);padding-bottom:8px
}
.article h2:first-child{margin-top:0}
.article h3{color:var(--text);font-size:1.12rem;margin-top:24px}
.article p{margin:0 0 16px}
.article ul{padding-left:22px}
.tip{
 margin:22px 0;background:var(--blue-light);border-left:5px solid var(--red);
 padding:17px 20px
}
.tip strong{color:var(--blue)}
.data-table{
 width:100%;border-collapse:collapse;margin:18px 0;background:#fff
}
.data-table th,.data-table td{
 border:1px solid var(--line);padding:11px 13px;text-align:left
}
.data-table th{background:var(--blue);color:#fff}
.actions{
 display:flex;gap:10px;flex-wrap:wrap;margin-top:25px
}
.btn{
 display:inline-block;text-decoration:none;padding:11px 17px;
 font-weight:900;border-radius:5px
}
.btn-primary{background:var(--blue);color:#fff}
.btn-red{background:var(--red);color:#fff}
.related{
 display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px
}
.related a{
 text-decoration:none;background:var(--blue-light);border:1px solid #CFDFEC;
 padding:15px;border-radius:6px
}
.related strong{display:block;color:var(--blue)}
.related small{color:var(--muted)}
.footer{
 background:#fff;border-top:1px solid var(--line);
 padding:20px 0 28px;margin-top:34px
}
.footer-inner{
 width:min(var(--max),calc(100% - 54px));margin:auto;
 display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
 font-size:.9rem;color:var(--muted)
}
.footer a{color:var(--blue);text-decoration:none}

/* El footer NO lleva un segundo logo */
.mobile-toggle{
 border:0;background:var(--blue);color:#fff;padding:9px 12px;
 border-radius:6px;font-weight:900
}
.mobile-logo{height:46px;width:auto}

@media(max-width:940px){
 .sidebar{transform:translateX(-100%);transition:.2s}
 .sidebar.open{transform:translateX(0);box-shadow:12px 0 30px rgba(0,0,0,.2)}
 .page{margin-left:0}
 .mobile-head{
  display:flex;position:sticky;top:0;z-index:45;background:#fff;
  align-items:center;justify-content:space-between;padding:10px 15px;
  border-bottom:1px solid var(--line)
 }
 .related{grid-template-columns:1fr}
}
@media(max-width:620px){
 .content-shell,.footer-inner{width:calc(100% - 24px)}
 .page-header,.article{padding:23px 20px}
}
@media print{
 .sidebar,.mobile-head,.top-strip{display:none!important}
 .page{margin-left:0}
 .content-shell,.footer-inner{width:100%}
 .article,.page-header{border:0}
}


/* HEADER Y FOOTER FIJOS — ESTÁNDAR INTERLAB */
:root{--fixed-header-h:72px;--fixed-footer-h:62px}
.fixed-header{
 position:fixed;top:0;left:var(--sidebar);right:0;height:var(--fixed-header-h);
 z-index:46;background:#fff;border-bottom:1px solid var(--line);
 display:flex;align-items:center;box-shadow:0 4px 14px rgba(23,50,77,.05)
}
.fixed-header-inner{
 width:min(var(--max),calc(100% - 54px));margin:auto;
 display:flex;align-items:center;justify-content:space-between;gap:24px
}
.fixed-header-title{
 font-family:Montserrat,Inter,Arial,sans-serif;font-weight:900;color:var(--blue);white-space:nowrap
}
.fixed-top-nav{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.fixed-top-nav a{
 text-decoration:none;color:var(--blue);font-weight:850;padding:9px 12px;border-radius:6px
}
.fixed-top-nav a:hover{background:var(--blue-light)}
.fixed-top-nav .wa{background:var(--blue);color:#fff}
.fixed-top-nav .wa:hover{background:var(--blue-dark)}

.page{padding-top:var(--fixed-header-h);padding-bottom:var(--fixed-footer-h)}
.fixed-footer{
 position:fixed;left:var(--sidebar);right:0;bottom:0;min-height:var(--fixed-footer-h);
 z-index:44;background:#fff;border-top:1px solid var(--line);
 box-shadow:0 -4px 14px rgba(23,50,77,.05)
}
.fixed-footer-inner{
 width:min(var(--max),calc(100% - 54px));min-height:var(--fixed-footer-h);margin:auto;
 display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:.86rem
}
.footer-group{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.footer-group strong{color:var(--blue)}
.fixed-footer a{color:var(--blue);text-decoration:none;font-weight:750}
.fixed-footer a:hover{text-decoration:underline}
.footer{display:none}

@media(max-width:940px){
 .fixed-header{position:sticky;top:61px;left:0;height:auto;min-height:60px}
 .fixed-header-inner{
   width:calc(100% - 24px);padding:9px 0;align-items:flex-start;flex-direction:column;gap:4px
 }
 .fixed-header-title{display:none}
 .fixed-top-nav{width:100%;justify-content:flex-start;gap:4px}
 .fixed-top-nav a{padding:7px 8px;font-size:.83rem}
 .page{padding-top:0;padding-bottom:0}
 .fixed-footer{position:static;min-height:auto}
 .fixed-footer-inner{
   width:calc(100% - 24px);padding:18px 0;flex-direction:column;align-items:flex-start
 }
}
@media print{
 .fixed-header,.fixed-footer{display:none!important}
 .page{padding-top:0;padding-bottom:0}
}


/* =========================================================
   ESTÁNDAR INTERLAB — ESQUINAS REDONDEADAS
   Regla visual solicitada: 15% en botones y contenedores.
   Se usa 15% donde la geometría lo permite y un radio
   equivalente estable en contenedores grandes.
   ========================================================= */
:root{
 --radius-interlab:15%;
 --radius-container:18px;
}

/* Botones, enlaces tipo botón y controles */
.btn,
.mobile-toggle,
.fixed-top-nav a,
.side-section-title,
.side-sub a,
.brand-wrap,
.tip,
.related a{
 border-radius:var(--radius-interlab) !important;
}

/* Contenedores grandes: radio visual uniforme sin deformar */
.page-header,
.article,
.data-table,
.fixed-header-inner,
.fixed-footer-inner{
 border-radius:var(--radius-container);
}

/* Menú y bloques laterales */
.sidebar{
 border-top-right-radius:var(--radius-container);
 border-bottom-right-radius:var(--radius-container);
}
.brand-wrap{
 margin:12px;
 overflow:hidden;
}
.side-contact{
 border-radius:var(--radius-container);
 background:rgba(255,255,255,.07);
 padding:16px;
}

/* Tablas: conservar redondeo completo */
.data-table{
 overflow:hidden;
 border-collapse:separate;
 border-spacing:0;
}
.data-table th:first-child{border-top-left-radius:var(--radius-container)}
.data-table th:last-child{border-top-right-radius:var(--radius-container)}
.data-table tr:last-child td:first-child{border-bottom-left-radius:var(--radius-container)}
.data-table tr:last-child td:last-child{border-bottom-right-radius:var(--radius-container)}

/* Encabezado y pie: el bloque interior también se percibe redondeado */
.fixed-header-inner,
.fixed-footer-inner{
 padding-left:14px;
 padding-right:14px;
}

/* Inputs futuros heredan el mismo lenguaje visual */
input,select,textarea,button{
 border-radius:var(--radius-interlab);
}

/* Imágenes y elementos multimedia dentro del contenido */
.article img,
.article video,
.article iframe,
.page-header img{
 border-radius:var(--radius-container);
}

/* Evitar esquinas rectas en tarjetas futuras */
.card,
.notice,
.callout,
.resource-card,
.hero-card{
 border-radius:var(--radius-container) !important;
 overflow:hidden;
}

@media(max-width:940px){
 .sidebar{
  border-top-right-radius:var(--radius-container);
  border-bottom-right-radius:var(--radius-container);
 }
 .fixed-header-inner,.fixed-footer-inner{border-radius:var(--radius-container)}
}


/* =========================================================
   PROPUESTA 5 — UNIFICACIÓN DE BOTONES / CONTENEDORES
   Referencia visual: tarjetas de Contenido relacionado
   ========================================================= */
.soft-action{
 background:var(--blue-light) !important;
 color:var(--blue) !important;
 border:1px solid #CFDFEC !important;
 border-radius:18px !important;
 padding:11px 17px !important;
 box-shadow:none !important;
 transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.soft-action:hover{
 background:#fff !important;
 border-color:var(--blue) !important;
 transform:translateY(-1px);
 text-decoration:none !important;
}
.tip.soft-panel{
 background:var(--blue-light);
 border:1px solid #CFDFEC;
 border-left:5px solid var(--red);
 border-radius:18px !important;
 padding:17px 20px;
 overflow:hidden;
}
.related a{
 border-radius:18px !important;
 transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.related a:hover{
 background:#fff;
 border-color:var(--blue);
 transform:translateY(-1px);
}

/* Página específica Videos — Diseño Maestro preservado */
.video-search{margin:22px 0 26px}
.video-search label{display:block;font-weight:900;color:var(--blue);margin-bottom:7px}
.video-search input{
 width:100%;padding:14px 16px;border:1px solid var(--line);
 background:#fff;color:var(--text);font:inherit;border-radius:18px
}
.video-search input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 4px rgba(25,89,153,.08)}
.video-library{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.video-anchor{scroll-margin-top:95px}
.video-card{
 height:100%;background:#fff;border:1px solid var(--line);border-radius:18px;
 padding:20px;display:grid;grid-template-columns:62px 1fr;gap:17px
}
.video-icon{
 width:58px;height:58px;border-radius:18px;background:var(--blue);
 color:#fff;display:grid;place-items:center;font-size:1.35rem
}
.video-type{color:var(--red);font-size:.76rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900}
.video-card h2{margin:5px 0 8px;font-size:1.2rem;border:0;padding:0}
.video-card p{color:var(--muted)}
.video-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:12px}
.video-actions a{text-decoration:none}
.video-primary{display:inline-block}
.video-guide{color:var(--blue);font-weight:800;font-size:.9rem}
.video-feature{
 margin:28px 0;background:var(--blue-light);border:1px solid #CFDFEC;
 border-radius:18px;padding:22px;display:flex;align-items:center;justify-content:space-between;gap:24px
}
.video-feature h2{border:0;margin:5px 0 7px;padding:0}
.video-empty{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px;text-align:center}
@media(max-width:800px){.video-library{grid-template-columns:1fr}.video-feature{align-items:flex-start;flex-direction:column}}