/* =========================================================
   LS GROUP — Corporate Holding Website
   Design system: charcoal/navy + gold, inspired by brand mark
   ========================================================= */

:root{
  --navy-900:#2b383f;
  --navy-800:#33424a;
  --navy-700:#3e4f58;
  --navy-600:#55666f;
  --slate-500:#5b6672;
  --slate-400:#8993a0;
  --slate-200:#dbe0e6;
  --slate-100:#eef1f4;
  --bg:#f7f8fa;
  --white:#ffffff;
  --gold-700:#a8811c;
  --gold-600:#c9a227;
  --gold-500:#d9b545;
  --gold-300:#e9cd7a;
  --gold-100:#f2d98b;
  --gold-grad: linear-gradient(135deg, var(--gold-700) 0%, var(--gold-500) 45%, var(--gold-100) 100%);
  --text-dark:#1f2933;
  --text-muted:#5b6672;
  --border:#e4e7eb;
  --radius:14px;
  --radius-sm:8px;
  --shadow-sm: 0 1px 2px rgba(43,56,63,.06), 0 1px 1px rgba(43,56,63,.04);
  --shadow-md: 0 8px 24px rgba(43,56,63,.10);
  --shadow-lg: 0 20px 48px rgba(43,56,63,.16);
  --maxw: 1180px;
  --font: "Inter","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font);
  color:var(--text-dark);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.2;font-weight:700;letter-spacing:-.01em;}
p{margin:0 0 1em;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
section{padding:88px 0;}
section.tight{padding:56px 0;}

.eyebrow{
  display:inline-block;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold-700);
  margin-bottom:14px;
}
.section-head{max-width:720px;margin:0 0 48px;}
.section-head h2{font-size:clamp(1.7rem,2.6vw,2.4rem);color:var(--navy-800);}
.section-head p{color:var(--text-muted);font-size:1.05rem;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 26px;border-radius:999px;font-weight:600;font-size:.95rem;
  border:1px solid transparent;cursor:pointer;transition:.2s ease;
  white-space:nowrap;
}
.btn-primary{background:var(--navy-800);color:#fff;}
.btn-primary:hover{background:var(--navy-900);}
.btn-gold{background:var(--gold-grad);color:var(--navy-900);}
.btn-gold:hover{filter:brightness(1.06);}
.btn-outline{border-color:rgba(255,255,255,.55);color:#fff;background:transparent;}
.btn-outline:hover{background:rgba(255,255,255,.12);}
.btn-outline-dark{border-color:var(--navy-600);color:var(--navy-800);background:transparent;}
.btn-outline-dark:hover{background:var(--navy-800);color:#fff;}
.btn-sm{padding:9px 18px;font-size:.85rem;}
.btn-block{width:100%;}

/* ---------- Header / Nav ----------
   Efecto tipo udeweb.tech: transparente sobre el hero, se vuelve un panel
   "glass" (blur + fondo navy translúcido + sombra) al hacer scroll. */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;width:100%;
  background:transparent;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  border-bottom:1px solid transparent;
  box-shadow:none;
  transition:background-color .4s ease, backdrop-filter .4s ease, box-shadow .4s ease, border-color .4s ease;
}
.site-header.scrolled{
  background:rgba(43,56,63,.85);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 24px rgba(43,56,63,.18);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:78px;gap:24px;transition:height .4s ease;}
.site-header.scrolled .nav{height:64px;}
.brand{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.brand img{height:46px;width:auto;transition:height .4s ease;}
.site-header.scrolled .brand img{height:38px;}
.brand-name{color:#fff;font-weight:700;font-size:1.05rem;letter-spacing:.01em;}
.brand-name span{color:var(--gold-300);}
.nav-links{display:flex;align-items:center;gap:2px;flex:1;justify-content:center;}
.nav-links a{
  color:rgba(255,255,255,.82);font-size:.88rem;font-weight:600;
  padding:10px 14px;border-radius:8px;transition:.15s;
}
.nav-links a:hover,.nav-links a.active{color:#fff;background:rgba(255,255,255,.08);}
.nav-actions{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.nav-toggle{display:none;background:none;border:0;color:#fff;font-size:1.6rem;cursor:pointer;}
.nav-links-actions{display:none;}
.google-shortcuts{display:flex;align-items:center;gap:6px;padding-right:6px;margin-right:2px;border-right:1px solid rgba(255,255,255,.18);}
.google-shortcuts a{
  display:flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:50%;
  background:rgba(255,255,255,.1);color:#fff;font-size:1rem;line-height:1;
  text-decoration:none;transition:.15s;
}
.google-shortcuts a:hover{background:rgba(255,255,255,.22);}

.nav-icon-btn{
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  width:32px;height:32px;border-radius:50%;border:none;
  background:rgba(255,255,255,.1);color:#fff;
  font-size:1.15rem;line-height:1;cursor:pointer;transition:.15s;
  text-decoration:none;
}
.nav-icon-btn:hover{background:rgba(255,255,255,.22);}
.nav-icon-btn.gold{background:var(--gold-grad);color:var(--navy-900);}
.nav-icon-btn.gold:hover{filter:brightness(1.08);}
.notif-badge{
  position:absolute;top:-4px;right:-4px;
  min-width:16px;height:16px;padding:0 3px;border-radius:999px;
  background:#c0392b;color:#fff;font-size:.62rem;font-weight:700;line-height:16px;text-align:center;
}

@media (max-width:980px){
  .nav-links{
    position:absolute;top:100%;left:0;right:0;
    background:rgba(43,56,63,.97);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
    flex-direction:column;align-items:stretch;
    padding:8px 16px 20px;gap:2px;border-bottom:1px solid rgba(255,255,255,.08);
    opacity:0;transform:translateY(-8px) scale(.98);pointer-events:none;
    transition:opacity .2s ease, transform .2s ease;
  }
  .nav-links.open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
  .nav-links a{padding:12px 10px;}
  .nav-toggle{display:block;}
  .brand-name{display:none;}
  .nav-actions{display:none;}
  .nav-links-actions{
    display:flex;flex-direction:column;gap:10px;
    margin-top:12px;padding-top:16px;border-top:1px solid rgba(255,255,255,.1);
  }
}

/* ---------- Hero ---------- */
.hero{
  background-color:var(--navy-900);
  background-image:
    linear-gradient(rgba(43,56,63,.90), rgba(43,56,63,.90)),
    url('../img/texture/libros-duotone.jpg');
  background-size:auto, 460px auto;
  background-repeat:no-repeat, repeat;
  background-position:center top, center top;
  color:#fff;padding:120px 0 100px;position:relative;overflow:hidden;
}
.hero .eyebrow{color:var(--gold-300);}
.hero h1{font-size:clamp(2.1rem,4.4vw,3.6rem);color:#fff;max-width:920px;}
.hero h1 em{font-style:normal;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero .en-tagline{color:var(--slate-400);font-size:.95rem;letter-spacing:.03em;margin-top:-6px;margin-bottom:28px;}
.hero .lede{color:rgba(255,255,255,.78);font-size:1.15rem;max-width:640px;}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px;}

/* ---------- Cards ---------- */
.grid{display:grid;gap:24px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-5{grid-template-columns:repeat(5,1fr);}
@media (max-width:900px){.grid-2,.grid-3,.grid-4,.grid-5{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.grid-2,.grid-3,.grid-4,.grid-5{grid-template-columns:1fr;}}

.card{
  background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  padding:28px;box-shadow:var(--shadow-sm);transition:.2s;
}
.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}

.division-card{
  background:linear-gradient(180deg,#fff, var(--slate-100));
  border:1px solid var(--border);border-radius:var(--radius);padding:30px;
}
.division-card .division-icon{display:block;font-size:1.9rem;color:var(--gold-600);margin-bottom:14px;}
.division-card .num{
  display:inline-flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:10px;background:var(--gold-grad);
  color:var(--navy-900);font-weight:800;font-size:.95rem;margin-bottom:16px;
}
.division-card h3{font-size:1.15rem;color:var(--navy-800);}
.division-card p{color:var(--text-muted);font-size:.95rem;margin:0;}

/* ---------- Who we are / split ---------- */
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;}
@media (max-width:860px){.split{grid-template-columns:1fr;}}

/* ---------- Key figures ---------- */
.kpi-band{background:var(--navy-900);color:#fff;}
.kpi-band .section-head h2{color:#fff;}
.kpi-band .section-head p{color:var(--slate-400);}
.kpi{text-align:center;padding:18px 10px;border-left:1px solid rgba(255,255,255,.1);}
.kpi .kpi-icon{display:block;font-size:1.6rem;color:var(--gold-300);margin-bottom:8px;}
.kpi:first-child{border-left:none;}
@media (max-width:700px){.kpi{border-left:none;border-top:1px solid rgba(255,255,255,.1);}}
.kpi .value{font-size:clamp(2rem,4vw,2.8rem);font-weight:800;
  background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.kpi .label{color:rgba(255,255,255,.72);font-size:.92rem;margin-top:6px;}

/* ---------- Company fiche ---------- */
.company-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;transition:.2s;}
.company-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px);}
.company-logo{height:120px;display:flex;align-items:center;justify-content:center;
  background:var(--slate-100);border-bottom:1px solid var(--border);padding:20px;}
.company-logo img{max-height:70px;max-width:80%;object-fit:contain;}
.company-body{padding:24px;display:flex;flex-direction:column;gap:10px;flex:1;}
.company-body .sector-tag{
  align-self:flex-start;font-size:.7rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--gold-700);background:rgba(201,162,39,.1);
  padding:4px 10px;border-radius:999px;}
.company-body h3{font-size:1.2rem;color:var(--navy-800);margin-bottom:0;}
.company-body .tagline{color:var(--gold-700);font-weight:600;font-size:.92rem;margin-bottom:2px;}
.company-body p.desc{color:var(--text-muted);font-size:.93rem;flex:1;}
.company-body .company-cta{margin-top:8px;font-weight:700;font-size:.88rem;color:var(--navy-800);
  display:inline-flex;align-items:center;gap:6px;}
.company-card.placeholder-logo .company-logo{
  background:var(--navy-800);color:#fff;font-weight:800;font-size:1.4rem;letter-spacing:.02em;
}

/* ---------- Placeholder / TODO note ---------- */
.placeholder-note{
  border:1px dashed var(--gold-600);background:rgba(201,162,39,.06);
  border-radius:var(--radius-sm);padding:12px 16px;font-size:.85rem;color:var(--gold-700);
  margin-top:10px;
}
.placeholder-note strong{color:var(--navy-800);}

/* ---------- Narrativa explicativa (Evaluación de Proyectos de Inversión) ---------- */
.narrativa-inversion{
  border-left:3px solid var(--gold-500);padding:4px 0 4px 14px;margin:12px 0 28px;
  max-width:760px;font-size:.92rem;line-height:1.55;color:var(--navy-800);text-align:justify;
}

/* ---------- Doctrine section (textura de libros de la oficina) ---------- */
.section-doctrine{
  position:relative;
  background-color:var(--navy-900);
  background-image:
    linear-gradient(rgba(43,56,63,.90), rgba(43,56,63,.90)),
    url('../img/texture/libros-duotone.jpg');
  background-size:auto, 460px auto;
  background-repeat:no-repeat, repeat;
  background-position:center top, center top;
}
.section-doctrine .section-head h2{color:#fff;}
.section-doctrine .section-head p{color:var(--slate-400);}
.section-doctrine .tier-label span{color:var(--gold-300);}
.section-doctrine .tier-label .line{background:rgba(255,255,255,.15);}
.section-doctrine strong{color:#fff;}

/* ---------- Values ---------- */
.value-card{border-left:3px solid var(--gold-600);padding-left:18px;}
.value-card .value-num{font-size:.75rem;font-weight:800;letter-spacing:.1em;color:var(--gold-700);}
.value-card h3{font-size:1.1rem;color:var(--navy-800);margin:4px 0 8px;}
.value-card p{color:var(--text-muted);font-size:.94rem;margin:0;}

/* ---------- Leadership ---------- */
.leader-card{text-align:center;}
.avatar{
  width:96px;height:96px;border-radius:50%;margin:0 auto 16px;
  background:linear-gradient(135deg,var(--navy-700),var(--navy-900));
  display:flex;align-items:center;justify-content:center;color:var(--gold-300);
  font-weight:800;font-size:1.4rem;
}
.leader-card h4{margin:0 0 2px;font-size:1rem;color:var(--navy-800);}
.leader-card .role{color:var(--gold-700);font-size:.85rem;font-weight:600;}

/* ---------- Timeline / tier labels ---------- */
.tier-label{
  display:flex;align-items:center;gap:12px;margin:56px 0 28px;
}
.tier-label:first-child{margin-top:0;}
.tier-label .line{flex:1;height:1px;background:var(--border);}
.tier-label span{font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--navy-600);}

/* ---------- News ---------- */
.filter-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:36px;}
.filter-chip{
  padding:8px 16px;border-radius:999px;border:1px solid var(--border);
  font-size:.85rem;font-weight:600;color:var(--text-muted);background:#fff;
}
.filter-chip.active{background:var(--navy-800);color:#fff;border-color:var(--navy-800);}
.filter-chip{cursor:pointer;}
.news-thumb{height:170px;background:var(--slate-100);border-bottom:1px solid var(--border);overflow:hidden;}
.news-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.news-thumb.placeholder{display:flex;align-items:center;justify-content:center;background:var(--navy-800);color:var(--gold-300);font-weight:800;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;text-align:center;padding:16px;}
.news-body .news-date{color:var(--text-muted);font-size:.8rem;}
.news-body h3{font-size:1.1rem;color:var(--navy-800);margin:2px 0 0;}
.news-body p.desc{color:var(--text-muted);font-size:.92rem;flex:1;}
.news-body .news-cta{margin-top:4px;font-weight:700;font-size:.86rem;color:var(--navy-800);display:inline-flex;align-items:center;gap:6px;}
.empty-state{
  border:1px dashed var(--slate-200);border-radius:var(--radius);padding:56px 24px;
  text-align:center;color:var(--text-muted);background:#fff;
}
.doc-card{display:flex;align-items:center;gap:14px;padding:18px 20px;}
.doc-card .doc-icon{
  width:44px;height:44px;border-radius:10px;background:var(--gold-grad);
  display:flex;align-items:center;justify-content:center;color:var(--navy-900);font-weight:800;flex-shrink:0;
}
.doc-card .doc-meta small{color:var(--text-muted);}

/* ---------- Contact form ---------- */
.form-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);
  padding:36px;box-shadow:var(--shadow-sm);}
.field{margin-bottom:20px;}
.field label{display:block;font-size:.85rem;font-weight:700;color:var(--navy-800);margin-bottom:6px;}
.field input,.field select,.field textarea{
  width:100%;padding:12px 14px;border:1px solid var(--slate-200);border-radius:var(--radius-sm);
  font-family:var(--font);font-size:.95rem;background:#fbfbfc;transition:.15s;
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--gold-600);background:#fff;
}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
@media (max-width:640px){.field-row{grid-template-columns:1fr;}}
.field-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px 24px;margin-bottom:8px;}
.field-grid .field{margin-bottom:0;}
.field-grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:860px){.field-grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.field-grid-4{grid-template-columns:1fr;}}
.field-span3{grid-column:span 3;}
@media (max-width:860px){.field-span3{grid-column:span 2;}}
@media (max-width:560px){.field-span3{grid-column:span 1;}}
.contact-side .item{display:flex;gap:14px;margin-bottom:24px;}
.contact-side .icon{
  width:40px;height:40px;border-radius:10px;background:var(--navy-800);color:var(--gold-300);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;font-weight:700;
}
.contact-side h4{margin:0 0 2px;font-size:.95rem;color:var(--navy-800);}
.contact-side p{margin:0;color:var(--text-muted);font-size:.9rem;}

/* ---------- Division flow (línea conectada en zigzag) ---------- */
.division-flow{position:relative;padding:20px 0;}
.division-flow::before{
  content:'';position:absolute;left:50%;top:6px;bottom:6px;width:2px;
  background:linear-gradient(180deg, var(--gold-600), var(--gold-100), var(--gold-600));
  transform:translateX(-50%);
}
.flow-item{
  position:relative;display:grid;grid-template-columns:1fr 64px 1fr;align-items:start;
  margin-bottom:56px;
}
.flow-item:last-child{margin-bottom:0;}
.flow-node{
  grid-column:2;justify-self:center;z-index:2;
  width:52px;height:52px;border-radius:50%;background:var(--gold-grad);
  display:flex;align-items:center;justify-content:center;
  color:var(--navy-900);font-weight:800;font-size:1.2rem;
  box-shadow:0 0 0 6px var(--bg);
}
.flow-card{grid-column:1;text-align:right;padding-right:36px;}
.flow-item.flow-right .flow-card{grid-column:3;text-align:left;padding-right:0;padding-left:36px;}
.flow-card h2{font-size:1.3rem;color:var(--navy-800);}
.flow-card p{color:var(--text-muted);margin-bottom:14px;}
.chip-row{display:flex;flex-wrap:wrap;gap:10px;}
.flow-card.text-align-right .chip-row,
.flow-item:not(.flow-right) .chip-row{justify-content:flex-end;}
.flow-item.flow-right .chip-row{justify-content:flex-start;}
.company-chip{
  display:inline-flex;align-items:center;justify-content:center;
  height:42px;padding:0 16px;border-radius:10px;background:#fff;
  border:1px solid var(--border);box-shadow:var(--shadow-sm);
}
.company-chip img{height:22px;width:auto;max-width:110px;object-fit:contain;}
.company-chip.text-chip{font-weight:700;font-size:.85rem;color:var(--navy-800);white-space:nowrap;}

@media (max-width:768px){
  .division-flow::before{left:22px;}
  .flow-item{display:flex;align-items:flex-start;gap:18px;margin-bottom:40px;}
  .flow-node{order:1;flex-shrink:0;width:44px;height:44px;font-size:1.05rem;box-shadow:0 0 0 6px var(--bg);}
  .flow-card,
  .flow-item.flow-right .flow-card{order:2;flex:1;text-align:left;padding:0;}
  .flow-item .chip-row,
  .flow-item.flow-right .chip-row{justify-content:flex-start;}
}

/* ---------- Pre-footer banner ---------- */
.banner{
  background:var(--gold-grad);color:var(--navy-900);text-align:center;
}
.banner h2{color:var(--navy-900);}
.banner p{color:rgba(43,56,63,.75);}
.banner .btn-primary{background:var(--navy-900);}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy-900);color:rgba(255,255,255,.65);padding:64px 0 28px;font-size:.9rem;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;margin-bottom:40px;}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr;}}
.footer-grid h4{color:#fff;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:16px;}
.footer-grid ul li{margin-bottom:10px;}
.footer-grid ul li a:hover{color:#fff;}
.footer-brand img{height:42px;margin-bottom:14px;}
.footer-brand p{max-width:280px;color:rgba(255,255,255,.55);}
.footer-legal{
  border-top:1px solid rgba(255,255,255,.1);padding-top:24px;
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:.82rem;color:rgba(255,255,255,.45);
}
.footer-legal a{color:rgba(255,255,255,.6);}
.social-row{display:flex;gap:10px;margin-top:16px;}
.social-row a{
  width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;font-size:1rem;
}
.social-row a:hover{background:rgba(255,255,255,.1);}

/* ---------- Auth pages ---------- */
.auth-wrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background-color:var(--navy-900);
  background-image:
    linear-gradient(160deg, rgba(18,24,31,.72), rgba(43,56,63,.55)),
    url('../img/auth/monkeys-bg.jpg');
  background-size:cover, cover;
  background-position:center, center;
  background-repeat:no-repeat, no-repeat;
  padding:110px 20px 60px;
}
.auth-card{
  width:100%;max-width:420px;background:#fff;border-radius:var(--radius);
  padding:40px 36px;box-shadow:var(--shadow-lg);
}
.auth-card .brand{justify-content:center;margin-bottom:22px;}
.auth-card .brand img{height:52px;}
.auth-card h1{font-size:1.4rem;text-align:center;color:var(--navy-800);}
.auth-card p.sub{text-align:center;color:var(--text-muted);font-size:.92rem;margin-bottom:28px;}
.auth-error{
  background:#fdecec;border:1px solid #f3b8b8;color:#a12a2a;padding:12px 14px;
  border-radius:var(--radius-sm);font-size:.88rem;margin-bottom:18px;
}
.auth-success{
  background:#eaf7ee;border:1px solid #b7e3c3;color:#1c6b36;padding:12px 14px;
  border-radius:var(--radius-sm);font-size:.88rem;margin-bottom:18px;
}
.auth-links{text-align:center;margin-top:20px;font-size:.88rem;color:var(--text-muted);}
.auth-links a{color:var(--gold-700);font-weight:700;}
.auth-links .sep{margin:0 8px;color:var(--slate-200);}
.dash-hero{background:var(--navy-900);color:#fff;padding:110px 0 64px;}
.dash-panel{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:48px;text-align:center;}

/* ---------- Utility ---------- */
.mt-0{margin-top:0;}
.text-center{text-align:center;}
.tag-list{display:flex;flex-wrap:wrap;gap:8px;}
.tag{background:var(--slate-100);color:var(--navy-700);font-size:.8rem;font-weight:600;padding:6px 12px;border-radius:999px;}

/* ---------- Asistente IA (widget flotante) ---------- */
#ls-asistente-btn{
  position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;
  background:var(--gold-grad);border:none;box-shadow:0 6px 20px rgba(0,0,0,.25);
  cursor:pointer;z-index:9999;display:flex;align-items:center;justify-content:center;
  font-size:1.6rem;color:var(--navy-900);transition:transform .15s ease;
}
#ls-asistente-btn:hover{transform:scale(1.06);}
#ls-asistente-panel{
  position:fixed;right:22px;bottom:92px;width:360px;max-width:calc(100vw - 32px);
  height:min(520px, calc(100vh - 140px));background:#fff;border-radius:16px;
  box-shadow:0 12px 40px rgba(0,0,0,.28);z-index:9999;display:none;
  flex-direction:column;overflow:hidden;border:1px solid var(--border);
}
#ls-asistente-panel.abierto{display:flex;}
#ls-asistente-head{
  background:var(--navy-900);color:#fff;padding:16px 18px;display:flex;
  justify-content:space-between;align-items:center;flex-shrink:0;
}
#ls-asistente-head strong{font-size:.95rem;}
#ls-asistente-head span{display:block;font-size:.74rem;color:var(--gold-300);margin-top:2px;}
#ls-asistente-cerrar{background:none;border:none;color:#fff;font-size:1.3rem;cursor:pointer;line-height:1;padding:4px;}
#ls-asistente-msgs{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--bg);}
.ls-msg{max-width:85%;padding:10px 13px;border-radius:12px;font-size:.87rem;line-height:1.5;white-space:pre-wrap;word-wrap:break-word;}
.ls-msg-bot{background:#fff;border:1px solid var(--border);color:var(--text-dark);align-self:flex-start;border-bottom-left-radius:3px;}
.ls-msg-user{background:var(--navy-900);color:#fff;align-self:flex-end;border-bottom-right-radius:3px;}
.ls-msg-error{background:#fbeaea;color:#a12a2a;border:1px solid #f3caca;align-self:flex-start;}
#ls-asistente-typing{align-self:flex-start;color:var(--text-muted);font-size:.82rem;padding:2px 4px;display:none;}
#ls-asistente-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--border);flex-shrink:0;background:#fff;}
#ls-asistente-input{flex:1;padding:10px 12px;border:1px solid var(--border);border-radius:10px;font-size:.87rem;font-family:inherit;resize:none;}
#ls-asistente-input:focus{outline:none;border-color:var(--gold-600);}
#ls-asistente-enviar{background:var(--gold-grad);border:none;border-radius:10px;padding:0 16px;font-weight:700;color:var(--navy-900);cursor:pointer;font-size:.87rem;}
#ls-asistente-enviar:disabled{opacity:.5;cursor:default;}
@media (max-width:480px){
  #ls-asistente-panel{right:16px;left:16px;width:auto;bottom:88px;}
  #ls-asistente-btn{right:16px;bottom:16px;}
}

/* ===================== Burbuja de ayuda (i) ===================== */
.info-tip{
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;margin-left:5px;border-radius:50%;
  background:var(--slate-200);color:var(--navy-700);
  font-size:.7rem;font-weight:700;font-style:italic;font-family:Georgia,"Times New Roman",serif;
  cursor:help;vertical-align:middle;line-height:1;-webkit-user-select:none;user-select:none;
}
.info-tip:hover,.info-tip:focus{background:var(--gold-500);color:var(--navy-900);outline:none;}
th .info-tip,label .info-tip{vertical-align:-2px;}
.info-tip{position:relative;}
.info-tip:hover::after,.info-tip:focus::after{
  content:attr(data-tip);
  position:absolute;top:calc(100% + 9px);left:50%;transform:translateX(-50%);
  width:max-content;max-width:240px;
  background:var(--navy-900);color:#fff;
  padding:8px 12px;border-radius:8px;box-shadow:var(--shadow-md);
  font-size:.78rem;font-weight:400;font-style:normal;font-family:var(--font);
  line-height:1.4;text-align:left;white-space:normal;
  z-index:2000;pointer-events:none;
}
.info-tip:hover::before,.info-tip:focus::before{
  content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
  border:6px solid transparent;border-bottom-color:var(--navy-900);
  z-index:2000;pointer-events:none;
}
/* Filas de acciones (Editar/Eliminar/etc.) en flex-row: al abrir un
   <details>, que reclame todo el ancho de la fila en vez de quedarse
   angosto — el resto de acciones baja a otra línea (por eso el contenedor
   también necesita flex-wrap:wrap). Usar .actions-row en cualquier módulo;
   .wbr-actions-row se mantiene como alias histórico del RSN. */
.wbr-actions-row details[open],
.actions-row details[open]{flex:1 1 100%;min-width:0;}

/* Editar en tablas del RSN (Compromisos/Riesgos/Matriz): el formulario vive
   en una fila NUEVA con colspan (no dentro de la celda angosta de acciones),
   para poder usar todo el ancho de la tabla sin ensanchar esa columna en
   TODAS las filas. Se abre/cierra con JS (ver <script> al final de wbr.php). */
.wbr-edit-toggle{
  background:none;border:none;padding:0;margin:0;text-align:left;
  color:var(--navy-700);font-weight:700;font-size:.8rem;cursor:pointer;font-family:inherit;
}
.wbr-edit-toggle:hover{color:var(--gold-700);}
.wbr-edit-row td{padding:20px;background:var(--slate-100);border-top:1px solid var(--border);}
.wbr-edit-form .field-row{margin-bottom:0;}

.tip-bubble-floating{
  display:none;position:fixed;z-index:9999;max-width:260px;
  padding:9px 12px;border-radius:var(--radius-sm);
  background:var(--navy-900);color:#fff;font-size:.8rem;line-height:1.45;
  font-family:var(--font);font-weight:400;font-style:normal;
  box-shadow:var(--shadow-md);pointer-events:none;
}

/* Editor enriquecido de Noticias (Quill) — el contenedor visual reemplaza
   al <textarea name="cuerpo">, que queda oculto por debajo (ver
   noticias-admin.php). Solo se ajusta el color de marco/tipografía para que
   combine con el resto del panel; el resto lo trae Quill (quill.snow.min.css). */
.ls-editor{background:#fff;border-radius:var(--radius-sm);}
.ls-editor .ql-toolbar.ql-snow{border-color:var(--border);border-radius:var(--radius-sm) var(--radius-sm) 0 0;font-family:inherit;}
.ls-editor .ql-container.ql-snow{border-color:var(--border);border-radius:0 0 var(--radius-sm) var(--radius-sm);font-family:inherit;font-size:.95rem;min-height:180px;}
.ls-editor .ql-editor{min-height:180px;}

/* Cuerpo de una noticia publicada (noticia.php) — el HTML ya llegó
   sanitizado (ver noticias_sanitizar_html en includes/noticias.php), así
   que aquí solo se define cómo se ve cada elemento que el editor puede
   producir: párrafos, alineación, cita, enlaces, imagen y video embebido. */
/* Formato revista del detalle de una noticia (noticia.php): el cuerpo va a
   la izquierda, más ancho, y a la derecha una columna angosta con la
   imagen de portada y una ficha con categoría/fecha/autor — en vez de la
   imagen como banner arriba y el texto solo, en una sola columna angosta.
   En pantallas chicas se apila: primero la imagen y la ficha (order:-1),
   después el texto, que es como se leería una revista impresa doblada. */
.noticia-layout{display:grid;grid-template-columns:1.9fr 1fr;gap:52px;align-items:start;}
@media (max-width:900px){
  .noticia-layout{grid-template-columns:1fr;gap:28px;}
  .noticia-sidebar{position:static !important;order:-1;}
}
.noticia-sidebar{position:sticky;top:104px;}
.noticia-info-card{
  background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);
  padding:18px 20px;margin-top:18px;
}
.noticia-info-card .info-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:9px 0;border-top:1px solid var(--border);}
.noticia-info-card .info-row:first-child{border-top:none;padding-top:0;}
.noticia-info-card .info-label{color:var(--text-muted);font-size:.8rem;}
.noticia-info-card .info-value{color:var(--navy-800);font-weight:700;font-size:.85rem;text-align:right;}

.noticia-cuerpo{color:var(--text-muted);font-size:1.05rem;line-height:1.8;}
/* Justificado por defecto, como el cuerpo de una revista impresa — no hace
   falta seleccionar "Justificar" párrafo por párrafo en el editor. La
   última línea de cada párrafo se queda a la izquierda (text-align-last)
   en vez de estirarse para llenar todo el ancho, igual que en un libro. */
.noticia-cuerpo p{margin:0 0 20px;text-align:justify;text-align-last:left;}
.noticia-cuerpo p.ql-align-center{text-align:center;text-align-last:center;}
.noticia-cuerpo p.ql-align-right{text-align:right;text-align-last:right;}
.noticia-cuerpo p.ql-align-justify{text-align:justify;text-align-last:left;}
.noticia-cuerpo strong{color:var(--navy-800);}
.noticia-cuerpo a{color:var(--gold-700);font-weight:600;text-decoration:underline;}
.noticia-cuerpo blockquote{
  border-left:3px solid var(--gold-500);margin:8px 0 28px;padding:6px 0 6px 18px;
  font-size:1.1rem;font-style:italic;color:var(--navy-800);
}
.noticia-cuerpo img{max-width:100%;height:auto;border-radius:var(--radius-sm);margin:8px 0 28px;display:block;}
.noticia-cuerpo iframe.ql-video{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:var(--radius-sm);margin:8px 0 28px;display:block;}