/* =========================================================
   DIRECCION DE DIVERSIDAD . CHACO - Rediseno 2026
   Bootstrap 5 + Kanit
   ========================================================= */

:root{
  --azul:          #5059bc;
  --azul-deep:     #3a42a0;
  --azul-soft:     #8089d4;
  --fucsia:        #ec268f;
  --fucsia-deep:   #c0196f;
  --tgd-teal:      #009689;
  --tgd-navy:      #003b5c;
  --noche:         #00203a;
  --noche-soft:    #1a3a55;
  --bg:            #FAFAFC;
  --bg-soft:       #F0F2F8;
  --ink:           #00203a;
  --ink-soft:      #2d4e68;
  --muted:         #5a7a95;
  --line:          rgba(0,32,58,.08);
  --radius-xl: 28px;
  --radius-lg: 20px;
  --radius-md: 14px;
  --shadow-soft: 0 14px 40px -18px rgba(80,89,188,.25);
  --shadow-card: 0 24px 60px -30px rgba(0,32,58,.35);
  --font: 'Kanit', system-ui, sans-serif;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--font);
  font-weight:400;
  color:var(--ink);
  background:var(--bg);
  overflow-x:hidden;
  position:relative;
  letter-spacing:-0.005em;
}
::selection{ background:var(--azul); color:#fff; }

.bg-mesh{
  position:fixed; inset:0; z-index:-1;
  pointer-events:none; overflow:hidden;
  background:
    radial-gradient(1200px 600px at 100% -10%, rgba(80,89,188,.07), transparent 60%),
    radial-gradient(900px 500px at -10% 30%,  rgba(236,38,143,.04), transparent 60%),
    var(--bg);
}
.orb{
  position:absolute; border-radius:50%;
  filter:blur(80px); opacity:.5;
  animation:orbDrift 20s ease-in-out infinite alternate;
}
.orb-1{ width:520px;height:520px;background:var(--azul);top:-120px;left:-80px; }
.orb-2{ width:420px;height:420px;background:var(--fucsia);top:30%;right:-120px;animation-delay:-5s;opacity:.18; }
.orb-3{ width:380px;height:380px;background:var(--azul-soft);top:60%;left:-100px;animation-delay:-10s;opacity:.25; }
.orb-4{ width:340px;height:340px;background:var(--noche-soft);bottom:-100px;right:20%;animation-delay:-15s;opacity:.2; }
@keyframes orbDrift{
  0%  { transform:translate(0,0) scale(1); }
  100%{ transform:translate(60px,-40px) scale(1.15); }
}

.nav-glass{
  background:rgba(255,255,255,.65);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:1px solid rgba(0,32,58,.06);
  transition:padding .3s ease,background .3s ease;
  padding:.5rem 0;
}
.nav-glass.scrolled{ padding:.25rem 0;background:rgba(255,255,255,.85); }
.navbar-brand{ text-decoration:none; }
.navbar-logo{ height:52px;width:auto;display:block; }
.nav-pill{
  position:relative;
  color:var(--ink) !important;
  font-weight:500;
  padding:.55rem 1.1rem !important;
  border-radius:999px;
  transition:color .2s,background .2s;
}
.nav-pill::after{
  content:"";position:absolute;
  left:50%;bottom:.35rem;width:0;height:2px;
  background:linear-gradient(90deg,var(--azul),var(--fucsia));
  border-radius:2px;
  transform:translateX(-50%);
  transition:width .3s ease;
}
.nav-pill:hover{ color:var(--azul) !important;background:rgba(80,89,188,.06); }
.nav-pill:hover::after{ width:24px; }
.nav-cta{
  display:inline-flex;align-items:center;gap:.5rem;
  background:linear-gradient(135deg,var(--azul),var(--azul-deep));
  color:#fff !important;
  padding:.65rem 1.3rem;
  border-radius:999px;
  font-weight:600;
  text-decoration:none;
  box-shadow:0 10px 28px -10px rgba(80,89,188,.6);
  transition:transform .25s ease,box-shadow .25s ease;
}
.nav-cta:hover{ transform:translateY(-2px);box-shadow:0 16px 36px -10px rgba(80,89,188,.7); }
.nav-cta i{ transition:transform .25s ease; }
.nav-cta:hover i{ transform:translateX(3px); }
.nav-cta-logo{ height:22px;width:22px;border-radius:50%;background:#fff;padding:3px;object-fit:contain; }

.hero{
  position:relative;
  min-height:100vh;
  padding:7.5rem 0 3rem;
  overflow:hidden;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.hero-bg-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center top;
  z-index:-2;opacity:.55;pointer-events:none;
}
.hero-stripes{
  position:absolute;inset:0;z-index:-1;
  display:flex;flex-direction:column;
  filter:blur(2px);transform:skewY(-6deg) translateY(-4%);
}
.stripe{ flex:1;opacity:.55; }
.stripe.s1{ background:var(--azul-soft); }
.stripe.s2{ background:var(--fucsia); }
.stripe.s3{ background:#ffffff; }
.stripe.s4{ background:var(--fucsia); }
.stripe.s5{ background:var(--azul-soft); }
.hero::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:rgba(0,0,0,.24);
}
.hero-inner{ position:relative;z-index:1; }
.hero-text-col{ display:flex;flex-direction:column; }

.hero .hero-pill{ background:rgba(255,255,255,.16);backdrop-filter:blur(14px);border-color:rgba(255,255,255,.22);color:rgba(255,255,255,.92); }
.hero .hero-title{ color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.6); }
.hero .hero-sub{ color:rgba(255,255,255,.95);text-shadow:0 1px 8px rgba(0,0,0,.55); }
.hero .hero-sub strong{ color:#fff; }
.hero .tlgbiq{ background:rgba(255,255,255,.18);color:#fff; }
.hero .hero-stats{ border-top-color:rgba(255,255,255,.2); }
.hero .stat-num{ filter:drop-shadow(0 2px 8px rgba(0,0,0,.55)); }
.hero .stat-label{ color:rgba(255,255,255,.7);text-shadow:0 1px 6px rgba(0,0,0,.6); }
.hero .stat-divider{ background:linear-gradient(180deg,transparent,rgba(255,255,255,.3),transparent); }
.hero .btn-ghost-2026{ background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4);color:#fff; }
.hero .btn-ghost-2026:hover{ background:rgba(255,255,255,.25);border-color:#fff;color:#fff; }

.hero-pill{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:.4rem 1rem;
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(14px);
  border:1px solid rgba(0,32,58,.08);
  border-radius:999px;
  font-size:.82rem;font-weight:500;color:var(--ink-soft);
  margin-bottom:1rem;white-space:nowrap;align-self:flex-start;
}
.pulse-dot{
  width:8px;height:8px;border-radius:50%;
  background:#10b981;
  box-shadow:0 0 0 0 rgba(16,185,129,.6);
  animation:pulse 2s infinite;
}
@keyframes pulse{
  0%  { box-shadow:0 0 0 0 rgba(16,185,129,.6); }
  70% { box-shadow:0 0 0 10px rgba(16,185,129,0); }
  100%{ box-shadow:0 0 0 0 rgba(16,185,129,0); }
}

.hero-title{
  font-weight:600;
  font-size:clamp(1.9rem,4vw,3.4rem);
  line-height:1.02;letter-spacing:-0.03em;
  margin-bottom:1rem;color:var(--ink);
}
.title-grad{
  display:inline-block;
  background:linear-gradient(120deg,var(--azul) 0%,var(--fucsia) 60%,var(--azul-deep) 100%);
  background-size:200% 200%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:gradShift 8s ease infinite;
}
@keyframes gradShift{
  0%,100%{ background-position:0% 50%; }
  50%    { background-position:100% 50%; }
}
.title-name{ display:block;font-style:italic;font-weight:500;color:var(--azul); }
.x-letter{
  display:inline-block;
  background:linear-gradient(135deg,var(--fucsia),var(--azul));
  -webkit-background-clip:text;background-clip:text;color:transparent;font-weight:600;
}

.hero-sub{
  font-size:1.05rem;color:var(--ink-soft);
  max-width:720px;margin-bottom:1.25rem;line-height:1.5;
}
.hero-sub strong{ color:var(--ink);font-weight:500; }
.tlgbiq{
  display:inline-block;padding:.05em .5em;border-radius:.5em;
  background:linear-gradient(120deg,rgba(80,89,188,.15),rgba(236,38,143,.1));
  color:var(--azul);font-weight:500;
}

.hero-actions{ display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:1.75rem; }

.btn-primary-2026{
  position:relative;
  display:inline-flex;align-items:center;gap:.75rem;
  padding:1rem 1.5rem 1rem 1.75rem;
  background:linear-gradient(135deg,var(--fucsia) 0%,var(--fucsia-deep) 100%);
  color:#fff !important;border:none;border-radius:999px;
  font-weight:600;letter-spacing:.04em;text-transform:uppercase;font-size:.9rem;
  text-decoration:none;overflow:hidden;
  box-shadow:0 14px 36px -12px rgba(236,38,143,.5);
  transition:transform .3s ease,box-shadow .3s ease;cursor:pointer;
}
.btn-primary-2026.light{
  background:linear-gradient(135deg,#fff,#fff);
  color:var(--azul) !important;
  box-shadow:0 14px 36px -10px rgba(0,0,0,.3);
}
.btn-primary-2026:hover{ transform:translateY(-3px) scale(1.02);box-shadow:0 22px 48px -14px rgba(236,38,143,.6); }
.btn-icon{
  width:34px;height:34px;border-radius:50%;overflow:hidden;
  background:rgba(255,255,255,.25);display:grid;place-items:center;
}
/* Tamaño en px fijo (no %): dentro de un grid con place-items:center, un
   height:100% en un <img> no cuadrado se resuelve como "auto" y desborda
   el círculo (bug de resolución de porcentajes en grid con auto-sizing). */
.btn-icon img{ width:34px;height:34px;object-fit:contain; }
.btn-primary-2026.light .btn-icon{ background:rgba(80,89,188,.15); }

/* Botón "Ingresar con TGD" — colores en tono con el logo oficial de Tu Gobierno Digital */
.btn-primary-2026.tgd{
  background:linear-gradient(135deg,var(--tgd-teal) 0%,var(--tgd-navy) 100%);
  box-shadow:0 14px 36px -12px rgba(0,150,137,.5);
}
.btn-primary-2026.tgd:hover{ box-shadow:0 22px 48px -14px rgba(0,150,137,.6); }
.btn-primary-2026.tgd .btn-icon{
  background:#fff;padding:5px;box-sizing:border-box;
  display:grid;place-items:center;
}
.btn-primary-2026.tgd .btn-icon img{ width:24px;height:24px;object-fit:contain;display:block; }
.btn-shine{
  position:absolute;top:0;left:-100%;width:60%;height:100%;
  background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);
  transform:skewX(-20deg);transition:left .8s ease;
}
.btn-primary-2026:hover .btn-shine{ left:130%; }

.btn-ghost-2026{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:1rem 1.5rem;
  background:rgba(255,255,255,.6);backdrop-filter:blur(10px);
  border:1.5px solid rgba(0,32,58,.1);border-radius:999px;
  font-weight:500;color:var(--ink);text-decoration:none;
  transition:all .25s ease;cursor:pointer;
}
.btn-ghost-2026:hover{ border-color:var(--azul);color:var(--azul);transform:translateY(-2px); }
.btn-ghost-2026.dark{ background:transparent;border-color:rgba(255,255,255,.3);color:#fff; }
.btn-ghost-2026.dark:hover{ border-color:#fff;color:#fff;background:rgba(255,255,255,.1); }

.hero-stats{
  display:flex;align-items:center;gap:1.5rem;
  padding:1rem 0;border-top:1px solid rgba(0,32,58,.08);max-width:720px;
}
.stat{ display:flex;flex-direction:column; }
.stat-num{
  font-size:1.8rem;font-weight:600;
  line-height:1;letter-spacing:-.03em;
  background:linear-gradient(135deg,var(--azul),var(--fucsia));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.stat-label{ font-size:.75rem;color:var(--muted);margin-top:.3rem;text-transform:uppercase;letter-spacing:.1em; }
.stat-divider{ width:1px;height:36px;background:linear-gradient(180deg,transparent,rgba(0,32,58,.2),transparent); }

.hero-visual{ position:relative;padding:1.5rem;animation:floatY 6s ease-in-out infinite; }
@keyframes floatY{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-12px); } }
.visual-frame{
  position:relative;border-radius:var(--radius-xl);aspect-ratio:4/5;
  background:linear-gradient(135deg,rgba(80,89,188,.2),rgba(236,38,143,.15));
  overflow:hidden;box-shadow:var(--shadow-card);
  border:1px solid rgba(255,255,255,.4);backdrop-filter:blur(10px);
}
.visual-placeholder{
  position:relative;width:100%;height:100%;display:grid;place-items:center;
  background:repeating-linear-gradient(180deg,var(--azul-soft) 0 14%,var(--fucsia) 14% 28%,#fff 28% 42%,var(--fucsia) 42% 56%,var(--azul-soft) 56% 70%,transparent 70% 100%);
}
.heart-illu{
  position:absolute;inset:8%;width:84%;height:84%;
  filter:drop-shadow(0 20px 30px rgba(0,0,0,.15));
  animation:pulseHeart 3s ease-in-out infinite;
}
@keyframes pulseHeart{ 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.04); } }
.placeholder-label{
  position:absolute;bottom:1rem;left:1rem;
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.5rem .8rem;background:rgba(0,0,0,.55);
  color:#fff;font-size:.75rem;border-radius:.6rem;backdrop-filter:blur(8px);z-index:2;
}
.placeholder-label i{ font-size:.95rem; }
.visual-badge{
  position:absolute;display:inline-flex;align-items:center;gap:.5rem;
  padding:.6rem 1rem;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);
  border-radius:999px;font-weight:500;font-size:.8rem;
  box-shadow:0 14px 28px -8px rgba(0,0,0,.2);border:1px solid rgba(255,255,255,.6);
}
.visual-badge i{
  width:22px;height:22px;border-radius:50%;
  background:linear-gradient(135deg,var(--azul),var(--fucsia));
  color:#fff;display:grid;place-items:center;font-size:.7rem;
}
.badge-1{ top:8%;left:-6%;animation:float1 5s ease-in-out infinite; }
.badge-2{ top:45%;right:-8%;animation:float2 6s ease-in-out infinite; }
.badge-3{ bottom:8%;left:5%;animation:float3 5.5s ease-in-out infinite; }
@keyframes float1{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)} }
@keyframes float2{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }
@keyframes float3{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-6px)} }

.hero-scroll-hint{
  position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);
  display:flex;align-items:center;color:rgba(255,255,255,.55);
}
.hero-scroll-hint i{
  font-size:2rem;
  animation:hintBounce 2.2s ease-in-out infinite;
}
@keyframes hintBounce{
  0%,100%{ transform:translateY(0); }
  50%{ transform:translateY(7px); }
}

.section{ padding:7rem 0;position:relative; }
.section-head{ max-width:760px;margin-bottom:3.5rem; }
.section-head.section-head-row{
  display:flex;justify-content:space-between;align-items:flex-end;
  gap:2rem;flex-wrap:wrap;max-width:none;
}
.section-eyebrow{
  display:inline-flex;align-items:center;gap:.75rem;
  font-size:.85rem;font-weight:500;
  text-transform:uppercase;letter-spacing:.2em;
  color:var(--azul);margin-bottom:1rem;
}
.section-eyebrow.light{ color:rgba(255,255,255,.8); }
.eyebrow-line{ width:32px;height:1px;background:linear-gradient(90deg,var(--azul),var(--fucsia)); }
.section-eyebrow.light .eyebrow-line{ background:linear-gradient(90deg,#fff,transparent); }
.section-title{
  font-size:clamp(2.2rem,4.5vw,3.6rem);
  font-weight:600;letter-spacing:-.03em;margin-bottom:1rem;line-height:1;
}
.section-title.light{ color:#fff; }
.title-grad-light{
  background:linear-gradient(120deg,var(--fucsia),var(--azul-soft));
  -webkit-background-clip:text;background-clip:text;color:transparent;font-style:italic;
}
.section-lead{ font-size:1.05rem;color:var(--ink-soft);line-height:1.65; }
.section-lead.light{ color:rgba(255,255,255,.85); }
.section-lead strong{ color:var(--azul);font-weight:500; }
.section-lead.light strong{ color:#fff; }

.section-nosotrxs{ position:relative; }
.bento-grid{ display:grid;grid-template-columns:repeat(6,1fr);gap:1.25rem; }
.bento{
  position:relative;padding:2rem;
  background:rgba(255,255,255,.75);backdrop-filter:blur(16px);
  border-radius:var(--radius-lg);border:1px solid rgba(0,32,58,.06);
  box-shadow:var(--shadow-soft);overflow:hidden;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease;
}
.bento::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(400px 200px at var(--mx,50%) var(--my,50%),rgba(80,89,188,.08),transparent 60%);
  opacity:0;transition:opacity .35s ease;
}
.bento:hover{ transform:translateY(-6px);box-shadow:0 30px 60px -25px rgba(80,89,188,.3); }
.bento:hover::before{ opacity:1; }
.bento h3{ font-size:1.15rem;font-weight:500;margin:.25rem 0 .75rem;letter-spacing:-.01em; }
.bento p{ font-size:.95rem;color:var(--ink-soft);line-height:1.55;margin:0; }
.bento-icon{
  width:48px;height:48px;border-radius:14px;
  background:linear-gradient(135deg,rgba(80,89,188,.12),rgba(236,38,143,.08));
  color:var(--azul);display:grid;place-items:center;font-size:1.4rem;margin-bottom:1rem;
}
.bento-num{
  position:absolute;top:1.5rem;right:1.5rem;
  font-size:2.5rem;font-weight:600;color:transparent;
  -webkit-text-stroke:1.5px rgba(80,89,188,.2);letter-spacing:-.05em;line-height:1;
}
.bento-a{ grid-column:span 2; }
.bento-b{ grid-column:span 2; }
.bento-c{ grid-column:span 2;grid-row:span 2;background:linear-gradient(135deg,var(--noche) 0%,var(--azul) 100%);color:#fff;border:none; }
.bento-c h3{ color:#fff;font-size:1.5rem;font-weight:500; }
.bento-c p{ color:rgba(255,255,255,.9);font-size:1rem; }
.bento-d{ grid-column:span 2; }
.bento-e{ grid-column:span 2; }
.bento-f{ grid-column:span 2; }
.bento-quote-mark{ font-size:6rem;line-height:.7;font-family:var(--font);color:rgba(255,255,255,.25);margin-bottom:.5rem; }
.feature-tags{ display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1.5rem; }
.feature-tags span{ padding:.3rem .8rem;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.25);border-radius:999px;font-size:.8rem;font-weight:400; }
@media (max-width:991px){
  .bento-grid{ grid-template-columns:repeat(2,1fr); }
  .bento-a,.bento-b,.bento-d,.bento-e,.bento-f{ grid-column:span 1; }
  .bento-c{ grid-column:span 2;grid-row:auto; }
}
@media (max-width:575px){ .bento-grid{ grid-template-columns:1fr; } .bento-c{ grid-column:1; } }

.section-noticias{ background:#fff; }
.news-filters{ display:flex;gap:.5rem;flex-wrap:wrap; }
.chip{ padding:.5rem 1rem;background:rgba(255,255,255,.7);border:1px solid rgba(0,32,58,.08);border-radius:999px;font-weight:500;font-size:.85rem;color:var(--ink-soft);cursor:pointer;transition:all .2s; }
.chip:hover{ border-color:var(--azul);color:var(--azul); }
.chip.active{ background:linear-gradient(135deg,var(--azul),var(--azul-deep));border-color:transparent;color:#fff;box-shadow:0 10px 22px -10px rgba(80,89,188,.5); }
.news-img{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center; }
.news-card{ background:#fff;border-radius:var(--radius-lg);overflow:hidden;border:1px solid rgba(0,32,58,.06);height:100%;display:flex;flex-direction:column;transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s;box-shadow:var(--shadow-soft); }
.news-card:hover{ transform:translateY(-8px);box-shadow:0 36px 60px -28px rgba(0,32,58,.3); }
.news-media{ position:relative;aspect-ratio:16/10;overflow:hidden; }
.media-ph{ position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.95);text-align:center;padding:1rem;font-size:.85rem;font-weight:400;gap:.5rem; }
.media-ph i{ font-size:2.2rem;opacity:.8; }
.media-ph::after{ content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.4) 100%);z-index:0; }
.media-ph > *{ position:relative;z-index:1; }
.media-ph-1{ background:linear-gradient(135deg,#4F8FE0,#1f4e9c); }
.media-ph-2{ background:linear-gradient(135deg,var(--fucsia),var(--azul)); }
.media-ph-3{ background:linear-gradient(135deg,var(--fucsia-deep),var(--azul-deep)); }
.media-ph-4{ background:linear-gradient(135deg,var(--azul),var(--fucsia-deep)); }
.media-ph-5{ background:linear-gradient(135deg,#1b9fae,#0a3b5f); }
.media-ph-6{ background:linear-gradient(135deg,var(--azul-soft),var(--fucsia)); }
.news-tag{ position:absolute;top:1rem;left:1rem;z-index:2;padding:.3rem .75rem;background:rgba(255,255,255,.95);color:var(--azul);font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;border-radius:999px; }
.news-tag.tag-cyan{ color:var(--fucsia-deep); }
.news-tag.tag-pink{ color:var(--fucsia); }
.news-date{ position:absolute;top:1rem;right:1rem;z-index:2;padding:.3rem .75rem;background:rgba(0,0,0,.5);backdrop-filter:blur(8px);color:#fff;font-size:.7rem;font-weight:400;letter-spacing:.1em;border-radius:999px; }
.news-body{ padding:1.5rem 1.5rem 1.75rem;display:flex;flex-direction:column;gap:.75rem;flex:1; }
.news-title{ font-size:1.2rem;font-weight:500;color:var(--noche);letter-spacing:-.01em;line-height:1.25;margin:0; }
.news-excerpt{ font-size:.92rem;color:var(--ink-soft);line-height:1.55;margin:0;flex:1; }
.read-more{ display:inline-flex;align-items:center;gap:.5rem;font-weight:500;font-size:.9rem;color:var(--azul);text-decoration:none;margin-top:.5rem;align-self:flex-start;padding:.5rem 0;position:relative; }
.read-more::after{ content:"";position:absolute;left:0;bottom:.25rem;width:100%;height:1.5px;background:linear-gradient(90deg,var(--azul),var(--fucsia));transform-origin:left;transform:scaleX(.3);transition:transform .3s ease; }
.read-more:hover{ color:var(--fucsia-deep); }
.read-more:hover::after{ transform:scaleX(1); }
.read-more i{ transition:transform .25s ease; }
.read-more:hover i{ transform:translateX(4px); }
.news-col{ transition:opacity .3s ease,transform .3s ease; }
.news-col.is-hidden{ display:none; }

.section-registro .hero-pill{ background:rgba(255,255,255,.16);backdrop-filter:blur(14px);border-color:rgba(255,255,255,.22);color:rgba(255,255,255,.92);white-space:normal;margin-bottom:1.25rem; }
.section-registro .hero-pill .pulse-dot{ flex-shrink:0; }
@media(max-width:767px){ .hero-pill{ white-space:normal; } }
.section-registro{ position:relative;background:linear-gradient(135deg,var(--noche) 0%,var(--azul) 60%,var(--azul-deep) 100%);color:#fff;overflow:hidden; }
.section-registro::before{ content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 80% 0%,rgba(236,38,143,.2),transparent 70%),radial-gradient(500px 300px at 0% 100%,rgba(80,89,188,.25),transparent 70%);z-index:0; }
.section-registro .container{ position:relative;z-index:1; }
.registro-intro{ color:#fff; }
.registro-list{ list-style:none;padding:0;margin:1.5rem 0 0;display:flex;flex-direction:column;gap:.75rem; }
.registro-list li{ display:flex;align-items:center;gap:.75rem;color:rgba(255,255,255,.92);font-size:1rem; }
.registro-list i{ color:var(--fucsia);font-size:1.2rem; }
.registro-quote{ margin-top:2rem;padding:1.5rem 1.75rem;background:rgba(255,255,255,.1);border-left:4px solid var(--fucsia);border-radius:0 var(--radius-md) var(--radius-md) 0;backdrop-filter:blur(10px); }
.registro-quote i{ font-size:1.8rem;color:var(--fucsia); }
.registro-quote p{ font-style:italic;font-size:1.15rem;margin:.5rem 0;color:#fff;line-height:1.4;font-weight:400; }
.registro-quote span{ font-size:.85rem;color:rgba(255,255,255,.75);letter-spacing:.05em; }

.form-card{ background:rgba(255,255,255,.97);color:var(--ink);border-radius:var(--radius-xl);padding:2rem;box-shadow:0 40px 80px -30px rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.5); }

/* === GATE TGD === */
.form-card-gate{ display:flex;align-items:stretch; }
.gate-lock,.gate-authenticated{ width:100%;display:flex;flex-direction:column;gap:0; }
.gate-steps{ display:flex;flex-direction:column;gap:0;padding:.25rem 0 1rem; }
.gate-step{ display:flex;align-items:flex-start;gap:1rem; }
.gate-step-num{ flex-shrink:0;width:2rem;height:2rem;border-radius:50%;background:linear-gradient(135deg,var(--azul),var(--azul-deep));color:#fff;font-size:.85rem;font-weight:700;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px rgba(80,89,188,.35); }
.gate-step-body{ display:flex;flex-direction:column;padding-bottom:.25rem; }
.gate-step-body strong{ font-size:.95rem;font-weight:600;color:var(--ink);margin-bottom:.15rem; }
.gate-step-body span{ font-size:.85rem;color:var(--ink-soft);line-height:1.45; }
.gate-step-connector{ width:2rem;flex-shrink:0;display:flex;justify-content:center;height:1.5rem; }
.gate-step-connector::before{ content:'';display:block;width:2px;height:100%;background:linear-gradient(to bottom,var(--azul),rgba(80,89,188,.2)); }
.gate-divider{ height:1px;background:rgba(80,89,188,.1);margin:1.25rem 0; }
.gate-cta{ display:flex;flex-direction:column;align-items:center;text-align:center;gap:.5rem; }
.gate-icon{ width:3.5rem;height:3.5rem;border-radius:50%;background:linear-gradient(135deg,rgba(80,89,188,.12),rgba(236,38,143,.08));display:flex;align-items:center;justify-content:center;margin-bottom:.25rem; }
.gate-icon i{ font-size:1.5rem;color:var(--azul); }
.gate-icon-ok{ background:linear-gradient(135deg,rgba(22,163,74,.12),rgba(22,163,74,.06)); }
.gate-icon-ok i{ color:#16a34a; }
.gate-notice{ font-size:.95rem;color:var(--ink-soft);line-height:1.55;max-width:36ch; }
.gate-hint{ font-size:.8rem;color:var(--ink-soft);margin-top:.5rem;display:flex;align-items:center;gap:.3rem;flex-wrap:wrap;justify-content:center; }
.gate-hint a{ color:var(--azul);text-decoration:underline;text-underline-offset:.2em; }
.gate-title{ font-size:1.35rem;font-weight:700;color:var(--ink);margin:.5rem 0 .25rem;text-align:center; }
.gate-lead{ font-size:.95rem;color:var(--ink-soft);line-height:1.55;text-align:center;max-width:38ch; }
.gate-authenticated{ align-items:center;justify-content:center;text-align:center;padding:1.5rem 0; }

.form-tabs{ border:none;display:flex;gap:.5rem;flex-wrap:wrap;background:var(--bg-soft);padding:.4rem;border-radius:999px;margin-bottom:2rem; }
.form-tabs .nav-link{ border:none;border-radius:999px !important;color:var(--ink-soft);font-weight:500;font-size:.9rem;padding:.6rem 1rem;display:inline-flex;align-items:center;gap:.5rem;background:transparent;transition:all .25s; }
.form-tabs .nav-link:hover{ color:var(--azul); }
.form-tabs .nav-link.active{ background:linear-gradient(135deg,var(--azul),var(--azul-deep));color:#fff;box-shadow:0 8px 20px -10px rgba(80,89,188,.6); }
.tab-num{ font-size:.7rem;background:rgba(255,255,255,.15);padding:.1rem .4rem;border-radius:.4rem;font-weight:600;letter-spacing:.05em; }
.form-tabs .nav-link:not(.active) .tab-num{ background:rgba(80,89,188,.1);color:var(--azul); }

/* Indicador de error de validación en una pestaña (ver mockup.js) */
.form-tabs .nav-link.has-error::after{
  content:"";width:7px;height:7px;border-radius:50%;flex-shrink:0;
  background:#dc3545;box-shadow:0 0 0 0 rgba(220,53,69,.6);
  animation:pulse 2s infinite;
}
.form-label{ font-size:.8rem;font-weight:500;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.4rem; }
.form-control-2026{ background:var(--bg-soft);border:1.5px solid transparent;border-radius:var(--radius-md);padding:.85rem 1.1rem;font-family:var(--font);font-size:.95rem;color:var(--ink);transition:all .25s; }
.form-control-2026:focus{ background:#fff;border-color:var(--azul);box-shadow:0 0 0 4px rgba(80,89,188,.12); }
select.form-control-2026{ appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235059bc' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1.1rem center;padding-right:2.5rem; }
.file-drop{ display:flex;align-items:center;gap:.75rem;padding:.85rem 1.1rem;background:var(--bg-soft);border:1.5px dashed rgba(80,89,188,.3);border-radius:var(--radius-md);cursor:pointer;color:var(--ink-soft);font-size:.9rem;transition:all .25s; }
.file-drop:hover{ border-color:var(--azul);background:rgba(80,89,188,.05);color:var(--azul); }
.file-drop i{ font-size:1.3rem;color:var(--azul); }
.terms-box{ background:linear-gradient(135deg,rgba(80,89,188,.06),rgba(236,38,143,.04));border:1px solid rgba(80,89,188,.12);border-radius:var(--radius-md);padding:1.25rem 1.5rem; }
.terms-box h5{ display:flex;align-items:center;gap:.5rem;font-size:.95rem;font-weight:500;color:var(--azul);margin:0 0 .5rem; }
.terms-box p{ font-size:.85rem;color:var(--ink-soft);margin:0 0 .75rem;line-height:1.5; }
.terms-check{ display:flex;align-items:center;gap:.6rem;font-weight:500;cursor:pointer; }
.terms-check input{ width:1.15rem;height:1.15rem;accent-color:var(--azul); }

.leyes-sidebar{ position:sticky;top:100px;background:rgba(255,255,255,.85);backdrop-filter:blur(16px);border:1px solid rgba(0,32,58,.06);border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow-soft);max-height:calc(100vh - 130px);overflow-y:auto; }
.sidebar-title{ font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.18em;color:var(--muted);margin-bottom:1rem; }
.leyes-index{ list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.25rem; }
.leyes-index a{ display:flex;align-items:center;gap:.75rem;padding:.65rem .85rem;border-radius:10px;color:var(--ink-soft);text-decoration:none;font-size:.85rem;font-weight:400;transition:all .2s;border:1px solid transparent; }
.leyes-index a:hover{ background:rgba(80,89,188,.06);color:var(--azul); }
.leyes-index a.active{ background:linear-gradient(135deg,rgba(80,89,188,.1),rgba(236,38,143,.06));color:var(--azul);border-color:rgba(80,89,188,.15); }
.leyes-index a span{ font-size:.65rem;font-weight:600;background:rgba(80,89,188,.1);color:var(--azul);padding:.15rem .45rem;border-radius:.4rem;letter-spacing:.05em;min-width:32px;text-align:center; }
.leyes-list{ display:flex;flex-direction:column;gap:1rem; }
.ley-card{ position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto auto;column-gap:1.25rem;align-items:start;padding:1.5rem 2rem 1.5rem 1.75rem;background:#fff;border-radius:var(--radius-lg);border:1px solid rgba(0,32,58,.06);box-shadow:var(--shadow-soft);transition:transform .3s ease,box-shadow .3s;overflow:hidden; }
.ley-card:hover{ transform:translateX(6px);box-shadow:0 30px 50px -25px rgba(0,32,58,.3); }
.ley-card::before{ content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--azul),var(--fucsia)); }
.ley-tag{ grid-column:1;grid-row:1;align-self:start;justify-self:start;padding:.2rem .55rem;background:var(--azul);color:#fff;font-size:.6rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;border-radius:.4rem; }
.ley-tag.dec{ background:var(--noche); }
.ley-tag.reg{ background:var(--fucsia-deep); }
.ley-tag.ord{ background:var(--azul-deep); }
.ley-num{ grid-column:2;grid-row:1;display:block;font-size:.7rem;font-weight:400;color:var(--muted);letter-spacing:.1em;margin-bottom:.25rem;align-self:center; }
.ley-card h3{ grid-column:2;grid-row:2;font-size:1.15rem;font-weight:500;margin:0 0 .5rem;letter-spacing:-.01em;color:var(--ink); }
.ley-card p{ grid-column:2;grid-row:3;font-size:.92rem;color:var(--ink-soft);margin:0 0 1rem;line-height:1.55; }
.ley-link{ grid-column:2;grid-row:4;align-self:start;display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .9rem;background:rgba(80,89,188,.08);color:var(--azul);border-radius:999px;font-size:.8rem;font-weight:500;text-decoration:none;transition:all .2s; }
.ley-link:hover{ background:var(--azul);color:#fff;transform:translateX(3px); }
@media (max-width:991px){ .leyes-sidebar{ position:static;max-height:none; } }

.cta-banner{ padding:4rem 0 6rem; }
.cta-inner{ display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;padding:3rem;background:linear-gradient(135deg,var(--azul) 0%,var(--fucsia) 100%);border-radius:var(--radius-xl);color:#fff;position:relative;overflow:hidden;box-shadow:0 30px 60px -25px rgba(80,89,188,.5); }
.cta-inner::before{ content:"";position:absolute;inset:0;background:radial-gradient(400px 200px at 90% 50%,rgba(255,255,255,.15),transparent 60%); }
.cta-inner > *{ position:relative; }
.cta-inner h3{ font-size:clamp(1.6rem,3vw,2.4rem);font-weight:600;margin:0 0 .5rem;letter-spacing:-.02em;line-height:1.1; }
.cta-inner p{ margin:0;color:rgba(255,255,255,.9);max-width:460px; }

.footer{ background:linear-gradient(180deg,#001828 0%,var(--noche) 100%);color:#fff;padding:5rem 0 2rem;position:relative;overflow:hidden; }
.footer::before{ content:"";position:absolute;inset:0;background:radial-gradient(600px 300px at 20% 0%,rgba(80,89,188,.2),transparent 70%); }
.footer .container{ position:relative; }
.footer-logo{ width:100%;max-width:340px;height:auto;display:block;margin-bottom:1.25rem; }
.footer-copy{ color:rgba(255,255,255,.8);font-size:.95rem;line-height:1.6;max-width:340px; }
.footer-h{ font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.18em;color:rgba(255,255,255,.6);margin-bottom:1rem; }
.footer-link{ display:inline-flex;align-items:flex-start;gap:.6rem;color:#fff;text-decoration:none;font-size:.95rem;line-height:1.5;transition:color .2s; }
.footer-link.big-link{ font-size:1.2rem;font-weight:500; }
.footer-link i{ color:var(--fucsia);margin-top:.2rem; }
.footer-link:hover{ color:var(--fucsia); }
.socials{ display:flex;gap:.75rem;margin-top:.5rem; }
.socials a{ width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff;text-decoration:none;font-size:1.05rem;transition:all .25s; }
.socials a:hover{ background:#fff;color:var(--azul);transform:translateY(-3px) scale(1.05); }
.footer-bottom{ margin-top:4rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.15);display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:rgba(255,255,255,.65); }
.footer-bottom i{ color:var(--fucsia); }

[data-reveal]{ opacity:0;transform:translateY(24px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1); }
[data-reveal].is-in{ opacity:1;transform:translateY(0); }

@media (max-width:991px){
  .navbar-logo{ height:40px; }
  .nav-cta{ padding:.5rem 1rem;font-size:.9rem; }
  .hero{ padding:6rem 0 2.5rem; }
  .article-top-spacer{ padding-top:6rem; }
  .hero-visual{ margin-top:3rem; }
  .section{ padding:5rem 0; }
  .section-head{ margin-bottom:2.5rem; }
  .form-card{ padding:1.5rem; }
  .cta-inner{ padding:2rem; }
}
@media (max-width:575px){
  .hero-stats{ gap:1rem; }
  .stat-num{ font-size:1.4rem; }
  .visual-badge{ font-size:.7rem;padding:.4rem .7rem; }
  .form-tabs{ border-radius:var(--radius-md); }
  .footer-logo{ max-width:100%; }
}

/* =========================================================
   FORMULARIO ÚNICO — Componentes adicionales
   ========================================================= */

/* ---- Botón Limpiar (azul outline, solo formulario) ---- */
.btn-clear-form{
  display:inline-flex;align-items:center;gap:.6rem;
  padding:1rem 1.5rem;
  background:transparent;
  border:1.5px solid var(--azul);
  border-radius:999px;
  font-weight:500;color:var(--azul);
  font-family:var(--font);font-size:.9rem;
  transition:all .25s ease;cursor:pointer;
}
.btn-clear-form:hover{ background:var(--azul);color:#fff;transform:translateY(-2px); }
.btn-clear-form i{ font-size:1rem; }

/* ---- Guardar deshabilitado ---- */
.btn-primary-2026:disabled{
  opacity:.42;
  cursor:not-allowed;
  pointer-events:none;
}

/* ---- Fila de acciones (Términos + botones) ---- */
.form-actions-row{ display:flex;align-items:center;gap:.75rem;flex-wrap:wrap; }
.form-actions-footer{ margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--line); }

/* ---- Multi-select con tags ---- */
.multiselect-wrap{ display:flex;flex-direction:column;gap:.6rem; }
.tag-pool{ display:flex;flex-wrap:wrap;gap:.4rem;min-height:0; }
.tag-pool:empty{ display:none; }
.feature-tag-item{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.3rem .75rem .3rem .9rem;
  background:linear-gradient(135deg,rgba(80,89,188,.1),rgba(80,89,188,.05));
  border:1px solid rgba(80,89,188,.22);
  border-radius:999px;
  font-size:.8rem;font-weight:500;color:var(--azul);
  animation:tagIn .2s ease;
}
@keyframes tagIn{ from{ opacity:0;transform:scale(.85); } to{ opacity:1;transform:scale(1); } }
.tag-remove{
  display:inline-flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:50%;
  background:rgba(80,89,188,.15);
  color:var(--azul);border:none;cursor:pointer;
  font-size:.75rem;line-height:1;padding:0;
  transition:all .15s;flex-shrink:0;
}
.tag-remove:hover{ background:var(--fucsia);color:#fff; }

/* ---- Botones Si/No tipo pill toggle ---- */
.si-no-group{ display:inline-flex;gap:.4rem; }
.si-no-opt{ cursor:pointer;user-select:none; }
.si-no-opt input{ display:none; }
.si-no-opt span{
  display:block;
  padding:.5rem 1.4rem;
  border-radius:999px;
  border:1.5px solid rgba(80,89,188,.2);
  font-size:.9rem;font-weight:500;color:var(--ink-soft);
  background:var(--bg-soft);
  transition:all .2s;
}
/* :has() en vez de "input:checked + span": el form theme de Symfony (bootstrap_5)
   siempre mete un <label> vacío entre el <input> y lo que sigue (incluso con
   label:false), así que el span deja de ser hermano inmediato del input. */
.si-no-opt:has(input:checked) span{ background:var(--azul);color:#fff;border-color:var(--azul); }
.si-no-opt:hover span{ border-color:var(--azul);color:var(--azul); }

/* ---- Field-group (label + toggle apilados) ---- */
.field-group{ display:flex;flex-direction:column;gap:.5rem; }

/* ---- Título de sección dentro del formulario ---- */
.form-section-title{
  font-size:.85rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.14em;color:var(--azul);
  padding-bottom:.75rem;
  border-bottom:1.5px solid rgba(80,89,188,.15);
  margin:0 0 .25rem;
}

/* ---- Item de Ocupación Actual ---- */
.ocupacion-item{
  padding:1rem 1.25rem;
  background:var(--bg-soft);
  border-radius:var(--radius-md);
  border:1px solid rgba(0,32,58,.05);
  display:flex;flex-direction:column;gap:.6rem;
}

/* ---- Nota/observación destacada ---- */
.form-note{
  display:flex;align-items:flex-start;gap:.6rem;
  padding:1rem 1.25rem;
  background:linear-gradient(135deg,rgba(80,89,188,.07),rgba(236,38,143,.03));
  border:1px solid rgba(80,89,188,.12);
  border-left:3px solid var(--azul);
  border-radius:var(--radius-md);
  font-size:.9rem;color:var(--ink-soft);
  line-height:1.45;font-weight:400;
}
.form-note i{ color:var(--azul);font-size:1.05rem;margin-top:.05rem;flex-shrink:0; }

/* ---- Label hint (texto pequeño junto al label) ---- */
.label-hint{
  font-size:.72rem;font-weight:400;
  color:var(--muted);text-transform:none;letter-spacing:0;
  padding:.15rem .5rem;
  background:rgba(80,89,188,.07);
  border-radius:999px;
  margin-left:.4rem;
  vertical-align:middle;
}

/* ---- Botón agregar "Otra experiencia" ---- */
.btn-add-tag{
  display:inline-flex;align-items:center;justify-content:center;
  width:48px;height:48px;border-radius:var(--radius-md);
  background:var(--azul);color:#fff;border:none;cursor:pointer;
  font-size:1.1rem;flex-shrink:0;
  transition:all .25s;font-family:var(--font);
}
.btn-add-tag:hover{ background:var(--azul-deep);transform:scale(1.06); }

/* ---- Responsive: botones formulario en móvil ---- */
@media(max-width:575px){
  .form-actions-row{ flex-direction:column; }
  .form-actions-row .btn-primary-2026,
  .form-actions-row .btn-clear-form{ width:100%;justify-content:center; }
  .si-no-group{ flex-wrap:wrap; }
  .ocupacion-item{ padding:.85rem 1rem; }
}

/* =========================================================
   BOTONES FLOTANTES — Ir arriba + WhatsApp
   ========================================================= */
.btn-top,
.btn-whatsapp{
  position:fixed;right:1.5rem;
  width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;
  cursor:pointer;border:none;
  font-size:1.2rem;text-decoration:none;
  transition:opacity .3s,transform .3s ease,box-shadow .25s ease;
  z-index:990;font-family:var(--font);
}
.btn-top{
  bottom:1.5rem;
  background:linear-gradient(135deg,var(--azul),var(--azul-deep));
  color:#fff;
  box-shadow:0 8px 24px -8px rgba(80,89,188,.55);
  opacity:0;pointer-events:none;
  transform:translateY(10px);
}
.btn-top.visible{ opacity:1;pointer-events:auto;transform:translateY(0); }
.btn-top:hover{ transform:translateY(-3px);box-shadow:0 14px 32px -8px rgba(80,89,188,.7); }
.btn-whatsapp{
  bottom:5.25rem;
  background:#25D366;color:#fff;
  box-shadow:0 8px 24px -8px rgba(37,211,102,.55);
  font-size:1.35rem;
}
.btn-whatsapp:hover{ transform:translateY(-3px) scale(1.06);box-shadow:0 14px 32px -8px rgba(37,211,102,.7);color:#fff; }

/* =========================================================
   PAGINAS INTERNAS — Noticias / Articulo
   ========================================================= */

/* ---- Nav: item activo en pagina interna ---- */
.nav-pill.active-page{ color:var(--azul) !important;background:rgba(80,89,188,.08); }
.nav-pill.active-page::after{ width:24px; }

/* ---- Page Header (encabezado compacto para paginas internas) ---- */
.page-header{ position:relative;padding:8rem 0 3rem;overflow:hidden;isolation:isolate; }
.page-header-bg{ position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;z-index:-2;opacity:.45;pointer-events:none; }
.page-header::before{ content:"";position:absolute;inset:0;z-index:-1;background:rgba(0,0,0,.42); }
.page-header-inner{ position:relative;z-index:1; }
.page-header-title{ font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:600;letter-spacing:-.03em;color:#fff;margin:.5rem 0 0;line-height:1; }

/* ---- Breadcrumb ---- */
.article-top-spacer{ padding-top:7.5rem; }
.breadcrumb-2026{ display:inline-flex;align-items:center;gap:.45rem;font-size:.82rem;font-weight:400;color:var(--muted);margin-bottom:2rem;flex-wrap:wrap; }
.breadcrumb-2026 a{ color:var(--azul);text-decoration:none;transition:color .2s; }
.breadcrumb-2026 a:hover{ color:var(--fucsia); }
.breadcrumb-2026 .bc-sep{ color:rgba(0,32,58,.3);font-size:.75rem; }
.breadcrumb-2026 .bc-current{ color:var(--ink-soft);font-weight:500; }

/* ---- Barra de herramientas: busqueda + filtros ---- */
.news-toolbar{ display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem; }
.news-search-wrap{ position:relative;flex:1;min-width:260px; }
.news-search-wrap i{ position:absolute;left:1.1rem;top:50%;transform:translateY(-50%);color:var(--muted);font-size:1rem;pointer-events:none; }
.news-search{ width:100%;padding:.75rem 1rem .75rem 2.8rem;background:rgba(255,255,255,.85);backdrop-filter:blur(10px);border:1.5px solid rgba(0,32,58,.1);border-radius:999px;font-family:var(--font);font-size:.95rem;color:var(--ink);transition:all .25s;outline:none; }
.news-search:focus{ border-color:var(--azul);background:#fff;box-shadow:0 0 0 4px rgba(80,89,188,.12); }
.news-search::placeholder{ color:var(--muted); }

/* ---- Fila meta: contador + por pagina ---- */
.news-meta-row{ display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:2rem;padding-bottom:1.25rem;border-bottom:1px solid var(--line); }
.news-count-label{ font-size:.88rem;color:var(--muted); }
.news-count-label strong{ color:var(--ink); }
.per-page-group{ display:flex;align-items:center;gap:.4rem; }
.per-page-label{ font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin-right:.25rem; }
.per-page-chip{ padding:.35rem .8rem !important;font-size:.8rem !important; }

/* ---- Sin resultados ---- */
.no-results{ text-align:center;padding:5rem 1rem;color:var(--muted); }
.no-results i{ font-size:2.8rem;display:block;margin-bottom:1rem;opacity:.5; }
.no-results p{ font-size:1rem;margin-bottom:1.5rem; }

/* ---- Paginacion ---- */
.news-pagination{ display:flex;justify-content:center;gap:.4rem;flex-wrap:wrap;margin-top:3.5rem; }
.page-btn{ min-width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0 .6rem;background:rgba(255,255,255,.7);backdrop-filter:blur(10px);border:1.5px solid rgba(0,32,58,.1);border-radius:10px;font-family:var(--font);font-size:.9rem;font-weight:500;color:var(--ink-soft);cursor:pointer;transition:all .2s; }
.page-btn:hover:not(:disabled){ border-color:var(--azul);color:var(--azul); }
.page-btn.active{ background:linear-gradient(135deg,var(--azul),var(--azul-deep));border-color:transparent;color:#fff;box-shadow:0 8px 20px -8px rgba(80,89,188,.5); }
.page-btn:disabled{ opacity:.35;cursor:not-allowed; }
.page-btn.dots{ border-color:transparent;background:transparent;cursor:default; }

/* ---- Seccion listado noticias ---- */
.section-noticias-page{ background:#fff;padding:4rem 0 5rem; }

/* ---- Pagina articulo ---- */
.article-section{ padding:3.5rem 0 5rem; }
.article-container{ max-width:820px;margin:0 auto;padding:0 1.5rem; }
.article-tag-row{ display:flex;align-items:center;gap:.75rem;margin-bottom:1.25rem;flex-wrap:wrap; }
.article-cat-tag{ padding:.3rem .85rem;border-radius:999px;font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em;background:rgba(80,89,188,.1);color:var(--azul); }
.article-cat-tag.tag-cyan{ background:rgba(192,25,111,.08);color:var(--fucsia-deep); }
.article-cat-tag.tag-pink{ background:rgba(236,38,143,.08);color:var(--fucsia); }
.article-title{ font-size:clamp(1.9rem,4vw,2.9rem);font-weight:600;letter-spacing:-.03em;color:var(--ink);line-height:1.08;margin-bottom:1.25rem; }
.article-lead{ font-size:1.08rem;color:var(--ink-soft);line-height:1.65;font-style:italic;border-left:3px solid var(--fucsia);padding-left:1.25rem;margin-bottom:1.5rem; }
.article-date{ display:inline-flex;align-items:center;gap:.5rem;font-size:.88rem;color:var(--muted);letter-spacing:.03em;margin-bottom:2rem; }
.article-date i{ color:var(--fucsia);font-size:.95rem; }
.article-divider{ width:48px;height:3px;background:linear-gradient(90deg,var(--azul),var(--fucsia));border-radius:2px;margin:2rem 0 2.25rem; }
.article-body{ font-size:1rem;color:var(--ink-soft);line-height:1.8; }
.article-body p{ margin-bottom:1.25rem; }
.article-body p:last-child{ margin-bottom:0; }
.article-body strong{ color:var(--ink);font-weight:500; }

/* ---- Mas de [Categoria] (igual a notindi.png) ---- */
.mas-de-wrapper{ border-top:2px solid rgba(0,32,58,.08);padding:2.5rem 0 0;margin-top:3.5rem; }
.mas-de-header{ display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;gap:1rem; }
.mas-de-title{ font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.18em;color:var(--ink); }
.mas-de-title strong{ color:var(--azul); }
.mas-de-link{ font-size:.82rem;font-weight:500;color:var(--azul);text-decoration:none;display:inline-flex;align-items:center;gap:.3rem;white-space:nowrap;transition:color .2s; }
.mas-de-link:hover{ color:var(--fucsia); }
.mas-card{ display:flex;flex-direction:column;gap:.55rem;text-decoration:none;color:inherit;transition:transform .3s ease; }
.mas-card:hover{ transform:translateY(-4px); }
.mas-card-img{ aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius-md);background:var(--bg-soft); }
.mas-card-img img{ width:100%;height:100%;object-fit:cover;transition:transform .4s ease; }
.mas-card:hover .mas-card-img img{ transform:scale(1.06); }
.mas-card-cat{ font-size:.7rem;font-weight:500;color:var(--azul);text-transform:uppercase;letter-spacing:.1em; }
.mas-card-cat.tag-cyan{ color:var(--fucsia-deep); }
.mas-card-cat.tag-pink{ color:var(--fucsia); }
.mas-card-title{ font-size:.9rem;font-weight:500;color:var(--ink);line-height:1.35;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }

/* ---- Enlace + Ver todas en home ---- */
.ver-todas-link{ display:inline-flex;align-items:center;gap:.35rem;font-size:.82rem;font-weight:500;color:var(--azul);text-decoration:none;letter-spacing:.03em;transition:color .2s;white-space:nowrap; }
.ver-todas-link:hover{ color:var(--fucsia); }

@media(max-width:991px){
  .news-toolbar{ flex-direction:column;align-items:stretch; }
  .news-meta-row{ flex-direction:column;align-items:flex-start; }
  .article-container{ padding:0 1rem; }
  .page-header{ padding:7rem 0 2.5rem; }
}
@media(max-width:575px){
  .news-search-wrap{ min-width:100%; }
  .per-page-group{ flex-wrap:wrap; }
  .article-title{ font-size:1.8rem; }
}

/* ============================================================
   VIOLENCIA DE GÉNERO — estilos portados del <style> inline
   ============================================================ */

/* Teléfonos de emergencia (fondo oscuro) */
.seccion-emergencia{ background:var(--noche,#00203a);padding:3rem 0; }
.seccion-emergencia .section-title{ color:#fff; }
.seccion-emergencia .section-eyebrow{ color:rgba(255,255,255,.8); }
.seccion-emergencia .eyebrow-line{ background:linear-gradient(90deg,rgba(255,255,255,.5),transparent); }
.emerg-card{ background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:1rem;padding:1.75rem 1rem;text-align:center;transition:transform .2s,border-color .2s; }
.emerg-card:hover{ transform:translateY(-4px);border-color:rgba(255,255,255,.4); }
.emerg-card .emerg-icon{ font-size:2rem;color:var(--azul,#5059bc);margin-bottom:.5rem; }
.emerg-card .emerg-num{ font-family:'Kanit',sans-serif;font-size:2.25rem;font-weight:600;color:#fff;line-height:1;display:block; }
.emerg-card .emerg-desc{ font-size:.82rem;color:rgba(255,255,255,.65);margin-top:.4rem; }
.emerg-card a{ text-decoration:none; }
.emerg-card a:hover .emerg-num{ color:var(--azul,#5059bc); }

/* Tipos de violencia */
.tipo-card{ background:rgba(255,255,255,.8);backdrop-filter:blur(16px);border:1px solid rgba(0,32,58,.07);border-radius:1rem;padding:1.5rem;height:100%;box-shadow:0 14px 40px -18px rgba(80,89,188,.15); }
.tipo-card .tipo-icon{ font-size:2rem;color:var(--azul,#5059bc);margin-bottom:.75rem; }
.tipo-card h3{ font-family:'Kanit',sans-serif;font-size:1.05rem;font-weight:600;color:var(--ink,#00203a);margin-bottom:.6rem; }
.tipo-card ul{ padding-left:1.1rem;margin:0; }
.tipo-card ul li{ font-size:.83rem;color:var(--ink-soft,#2d4e68);margin-bottom:.25rem; }

/* Circuito de denuncias */
.circuito-section{ padding:4rem 0; }
.pasos-row{ display:flex;flex-wrap:wrap;gap:0;align-items:flex-start; }
.paso-item{ flex:1 1 0;min-width:160px;position:relative;padding:1.5rem 1rem;text-align:center; }
.paso-item:not(:last-child)::after{ content:'\F285';font-family:'bootstrap-icons';position:absolute;right:-12px;top:50%;transform:translateY(-50%);font-size:1.25rem;color:var(--azul,#5059bc);z-index:2; }
@media(max-width:767px){
  .pasos-row{ flex-direction:column; }
  .paso-item:not(:last-child)::after{ content:'\F282';right:50%;top:auto;bottom:-14px;transform:translateX(50%); }
  .paso-item{ padding-bottom:2rem; }
}
.paso-num{ font-family:'Kanit',sans-serif;font-size:2.5rem;font-weight:600;color:var(--azul,#5059bc);line-height:1;display:block; }
.paso-title{ font-family:'Kanit',sans-serif;font-size:.95rem;font-weight:600;color:var(--ink,#00203a);margin:.4rem 0; }
.paso-desc{ font-size:.8rem;color:var(--ink-soft,#2d4e68); }

/* Dependencias */
.dep-card{ background:rgba(255,255,255,.8);backdrop-filter:blur(16px);border:1px solid rgba(0,32,58,.07);border-radius:1rem;padding:1.25rem;height:100%;display:flex;flex-direction:column;gap:.4rem;box-shadow:0 14px 40px -18px rgba(80,89,188,.12); }
.dep-card h3{ font-family:'Kanit',sans-serif;font-size:.95rem;font-weight:600;color:var(--ink,#00203a);margin:0 0 .3rem; }
.dep-card p{ font-size:.82rem;color:var(--ink-soft,#2d4e68);margin:0;display:flex;align-items:flex-start;gap:.35rem; }
.dep-card p i{ margin-top:2px;color:var(--azul,#5059bc);flex-shrink:0; }
.dep-card .dep-map{ margin-top:auto;padding-top:.75rem; }
.dep-col.is-hidden{ display:none; }

/* Violentómetro */
.violentometro-section{ padding:4rem 0; }
.zona-block{ border-radius:1rem;padding:1.75rem;margin-bottom:1.5rem; }
.zona-verde{ background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.4); }
.zona-amarillo{ background:rgba(245,158,11,.1);border:1px solid rgba(245,158,11,.4); }
.zona-rojo{ background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.4); }
.zona-title{ font-family:'Kanit',sans-serif;font-size:1.15rem;font-weight:600;margin-bottom:.25rem; }
.zona-verde .zona-title{ color:#16a34a; }
.zona-amarillo .zona-title{ color:#b45309; }
.zona-rojo .zona-title{ color:#dc2626; }
.zona-sub{ font-size:.82rem;color:var(--ink-soft,#2d4e68);margin-bottom:1rem; }
.vm-grid{ display:flex;flex-wrap:wrap;gap:.5rem; }
.vm-item{ position:relative; }
.vm-btn{ background:rgba(0,32,58,.05);border:1px solid rgba(0,32,58,.14);border-radius:.5rem;padding:.4rem .85rem;font-size:.82rem;color:var(--ink-soft,#2d4e68);cursor:pointer;transition:background .2s,border-color .2s;text-align:left; }
.vm-btn:hover,.vm-btn.open{ background:rgba(0,32,58,.1);border-color:rgba(0,32,58,.28);color:var(--ink,#00203a); }
.vm-msg{ display:none;background:rgba(0,32,58,.9);border-radius:.5rem;padding:.6rem .85rem;font-size:.8rem;color:rgba(255,255,255,.92);margin-top:.3rem;max-width:300px; }
.vm-msg.show{ display:block; }

/* Tips rápidos */
.tip-card{ background:rgba(255,255,255,.8);backdrop-filter:blur(16px);border:1px solid rgba(0,32,58,.07);border-radius:1rem;padding:1.25rem 1rem;text-align:center;height:100%;box-shadow:0 14px 40px -18px rgba(80,89,188,.12); }
.tip-card .tip-icon{ font-size:1.75rem;color:var(--azul,#5059bc);margin-bottom:.6rem; }
.tip-card p{ font-size:.85rem;color:var(--ink-soft,#2d4e68);margin:0; }

/* Atención psicológica CTA */
.atencion-cta{ padding:4rem 0; }
.atencion-inner{ background:linear-gradient(135deg,rgba(99,102,241,.18),rgba(168,85,247,.18));border:1px solid rgba(99,102,241,.35);border-radius:1.5rem;padding:3rem 2rem;text-align:center; }
.atencion-inner h2{ font-family:'Kanit',sans-serif;font-size:2rem;font-weight:600;color:var(--ink,#00203a);margin-bottom:.5rem; }
.atencion-inner .atencion-sub{ font-size:1rem;color:var(--ink-soft,#2d4e68);margin-bottom:1.5rem; }
.atencion-inner .atencion-info{ display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem;margin-bottom:2rem; }
.atencion-info-item{ display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:var(--ink-soft,#2d4e68); }
.atencion-info-item i{ color:var(--azul,#5059bc); }

/* Subtítulo del page-header */
.page-header-sub{ font-size:1rem;color:rgba(255,255,255,.82);margin-top:.5rem;max-width:560px; }

/* ============================================================
   ADMIN LOGIN — formulario centrado sobre fondo del index
   ============================================================ */
.section-admin-login{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  padding:8rem 0 4rem;
  background:linear-gradient(135deg,var(--noche) 0%,var(--azul) 60%,var(--azul-deep) 100%);
  overflow:hidden;
}
.section-admin-login::before{
  content:"";
  position:absolute;inset:0;
  background:
    radial-gradient(600px 320px at 80% 0%,rgba(236,38,143,.22),transparent 70%),
    radial-gradient(520px 320px at 0% 100%,rgba(80,89,188,.28),transparent 70%);
  z-index:0;
}
.section-admin-login .container{ position:relative;z-index:1; }

.admin-login-card{
  padding:2.5rem 2.25rem;
  border-radius:var(--radius-xl);
  background:rgba(255,255,255,.97);
  box-shadow:
    0 50px 100px -30px rgba(0,0,0,.55),
    0 0 0 1px rgba(255,255,255,.6) inset;
  position:relative;
  overflow:hidden;
}
.admin-login-card::after{
  content:"";
  position:absolute;
  top:0;left:0;right:0;height:4px;
  background:linear-gradient(90deg,var(--azul),var(--fucsia),var(--azul-soft));
}

.admin-login-head{ text-align:center;margin-bottom:1.75rem; }
.admin-login-icon{
  width:72px;height:72px;
  margin:0 auto 1.25rem;
  display:flex;align-items:center;justify-content:center;
  border-radius:22px;
  background:linear-gradient(135deg,var(--azul) 0%,var(--fucsia) 100%);
  color:#fff;
  font-size:2rem;
  box-shadow:0 18px 40px -12px rgba(236,38,143,.55);
  position:relative;
}
.admin-login-icon::before{
  content:"";
  position:absolute;inset:-6px;
  border-radius:26px;
  background:linear-gradient(135deg,rgba(80,89,188,.25),rgba(236,38,143,.2));
  filter:blur(14px);z-index:-1;
}
.admin-login-head .section-eyebrow{
  display:inline-flex;justify-content:center;margin-bottom:.75rem;
}
.admin-login-title{
  font-family:'Kanit',sans-serif;
  font-weight:600;
  font-size:clamp(1.6rem,2.4vw,2rem);
  letter-spacing:-.01em;
  color:var(--ink);
  margin:.25rem 0 .5rem;
  line-height:1.15;
}
.admin-login-sub{
  color:var(--ink-soft);
  font-size:.95rem;
  margin:0 auto;
  max-width:34ch;
}

.admin-login-alert{
  display:flex;align-items:flex-start;gap:.65rem;
  padding:.85rem 1rem;
  margin-bottom:1.25rem;
  background:linear-gradient(135deg,rgba(236,38,143,.08),rgba(192,25,111,.05));
  border:1px solid rgba(236,38,143,.25);
  border-left:4px solid var(--fucsia);
  border-radius:14px;
  color:var(--fucsia-deep);
  font-size:.9rem;
  font-weight:500;
}
.admin-login-alert i{ font-size:1.1rem;line-height:1.2; }

.admin-login-form{ display:flex;flex-direction:column;gap:1.1rem; }
.admin-field{ display:flex;flex-direction:column;gap:.4rem; }
.admin-field .form-label{
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--ink-soft);
  margin:0;
}
.admin-input-wrap{ position:relative; }
.admin-input-wrap > i{
  position:absolute;
  left:1rem;top:50%;
  transform:translateY(-50%);
  color:var(--azul);
  font-size:1rem;
  pointer-events:none;
  transition:color .2s;
  z-index:2;
}
.admin-input-wrap .form-control-2026{
  width:100%;
  padding-left:2.75rem;
}
.admin-input-wrap:focus-within > i{ color:var(--fucsia); }

.admin-login-submit{
  width:100%;
  justify-content:center;
  margin-top:.4rem;
}

.admin-login-back{
  display:inline-flex;align-items:center;justify-content:center;
  gap:.5rem;
  margin-top:.4rem;
  color:var(--ink-soft);
  text-decoration:none;
  font-size:.88rem;
  font-weight:500;
  transition:color .2s;
}
.admin-login-back:hover{ color:var(--fucsia); }

@media(max-width:575px){
  .section-admin-login{ padding:7rem 0 3rem; }
  .admin-login-card{ padding:2rem 1.5rem; }
  .admin-login-icon{ width:64px;height:64px;font-size:1.75rem; }
}