/* ════════════════════════════════════════════════════════════════════
   legislae-asesoria-municipio.css — Páginas ricas de municipio
   Legislae Asesores · paleta teal
   Modo día por defecto, modo noche como override [data-theme="dark"]
   ════════════════════════════════════════════════════════════════════ */

/* ── Reset + tipografía ── */
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
img{display:block;max-width:100%;height:auto;}
a{text-decoration:none;color:inherit;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}

/* ── VARIABLES — TEMA DÍA (default) ── */
:root{
  --navy:#0B1929;
  --navy2:#122236;
  --navy-soft:#1c2c44;
  --teal:#2BA09C;
  --teal2:#4EC9C4;
  --teal-bg:#E8F7F5;
  --gold:#C9A96E;
  --gold2:#E2C08D;
  --cream:#FAF8F4;
  --cream2:#F0EBE1;
  --white:#FFFFFF;
  --muted:#6B7585;
  --text:#1c2c44;
  --text-soft:#4a5567;
  --bg:#FAF8F4;
  --bg-alt:#FFFFFF;
  --bg-elev:#FFFFFF;
  --bg-section:#F4F1EA;
  --border:rgba(11,25,41,0.10);
  --border-strong:rgba(11,25,41,0.18);
  --serif:"Playfair Display",Georgia,serif;
  --sans:"Inter",system-ui,sans-serif;
  --ease:cubic-bezier(0.16,1,0.3,1);
  --ease2:cubic-bezier(0.34,1.56,0.64,1);
  --radius:6px;
  --radius-lg:10px;
  --shadow-sm:0 2px 8px rgba(11,25,41,0.06);
  --shadow:0 8px 24px rgba(11,25,41,0.08);
  --shadow-lg:0 20px 60px rgba(11,25,41,0.12);
}

/* ── VARIABLES — TEMA NOCHE ── */
[data-theme="dark"]{
  --teal:#4EC9C4;
  --teal-bg:#0d2a29;
  --text:#E8ECF1;
  --text-soft:#A8B0BD;
  --muted:#7d8593;
  --bg:#0a1422;
  --bg-alt:#0B1929;
  --bg-elev:#122236;
  --bg-section:#0d1a2b;
  --border:rgba(255,255,255,0.08);
  --border-strong:rgba(255,255,255,0.14);
  --shadow-sm:0 2px 8px rgba(0,0,0,0.3);
  --shadow:0 8px 24px rgba(0,0,0,0.4);
  --shadow-lg:0 20px 60px rgba(0,0,0,0.5);
}

html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--sans);
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  padding-top:68px;
}
::selection{background:var(--teal);color:#fff;}

.container{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0 clamp(20px,5vw,48px);
}

/* ── Botones ── */
.btn-blue,
.btn-ghost{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:14px 28px;
  font-family:var(--sans);
  font-size:14px;
  font-weight:600;
  letter-spacing:.04em;
  border-radius:var(--radius);
  text-decoration:none;
  transition:transform .2s var(--ease2),box-shadow .2s,background .2s,color .2s,border-color .2s;
  white-space:nowrap;
  line-height:1;
  cursor:pointer;
}
.btn-blue{
  background:var(--teal);
  color:#fff;
  box-shadow:0 6px 18px rgba(43,160,156,0.25);
}
.btn-blue:hover{
  background:var(--teal2);
  transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(43,160,156,0.35);
  color:#fff;
}
[data-theme="dark"] .btn-blue{box-shadow:0 6px 18px rgba(78,201,196,0.25);}
[data-theme="dark"] .btn-blue:hover{box-shadow:0 10px 26px rgba(78,201,196,0.35);}
.btn-ghost{
  background:transparent;
  color:var(--text);
  border:1.5px solid var(--border-strong);
}
.btn-ghost:hover{
  border-color:var(--teal);
  color:var(--teal);
  transform:translateY(-2px);
}

/* ══════════════════════════════════════════════════════════════════
   HERO
   ══════════════════════════════════════════════════════════════════ */
.hero{
  position:relative;
  min-height:clamp(560px,80vh,760px);
  display:flex;
  align-items:center;
  overflow:hidden;
}
.hero-bg-wrap{position:absolute;inset:0;z-index:0;}
.hero-img{width:100%;height:100%;object-fit:cover;object-position:center;}
.hero-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(11,25,41,0.78) 0%,rgba(11,25,41,0.55) 60%,rgba(43,160,156,0.45) 100%);
}
[data-theme="dark"] .hero-overlay{
  background:linear-gradient(135deg,rgba(11,25,41,0.88) 0%,rgba(11,25,41,0.7) 60%,rgba(43,160,156,0.35) 100%);
}
.hero-content{
  position:relative;
  z-index:1;
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:clamp(80px,12vw,120px) clamp(20px,5vw,48px);
  color:#fff;
}
.hero-eyebrow{
  display:inline-block;
  font-size:12px;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--teal2);
  margin-bottom:18px;
  padding:6px 12px;
  background:rgba(78,201,196,0.12);
  border:1px solid rgba(78,201,196,0.3);
  border-radius:100px;
}
.hero-h1{
  font-family:var(--serif);
  font-size:clamp(2rem,5vw,3.6rem);
  font-weight:900;
  line-height:1.08;
  margin-bottom:22px;
  letter-spacing:-0.02em;
}
.hero-h1 .h1-blue{color:var(--teal2);}
.hero-p{
  font-size:clamp(1rem,1.4vw,1.15rem);
  line-height:1.65;
  max-width:660px;
  margin-bottom:36px;
  color:rgba(255,255,255,0.88);
}
.hero-p strong{color:#fff;font-weight:600;}
.hero-btns{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:48px;
}
.hero-btns .btn-ghost{
  color:#fff;
  border-color:rgba(255,255,255,0.4);
}
.hero-btns .btn-ghost:hover{
  border-color:var(--teal2);
  color:var(--teal2);
  background:rgba(78,201,196,0.06);
}
.hero-micro{
  display:flex;
  align-items:center;
  gap:clamp(16px,3vw,32px);
  flex-wrap:wrap;
}
.micro-item{display:flex;flex-direction:column;gap:4px;}
.micro-num{
  font-family:var(--serif);
  font-size:clamp(1.4rem,2vw,1.75rem);
  font-weight:900;
  color:var(--teal2);
  line-height:1;
}
.micro-num em{font-style:normal;}
.micro-lbl{
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.65);
}
.micro-sep{width:1px;height:34px;background:rgba(255,255,255,0.2);}

/* Animaciones hero */
.au{opacity:0;transform:translateY(20px);animation:up .8s var(--ease) forwards;}
.au.d1{animation-delay:.1s;}
.au.d2{animation-delay:.25s;}
.au.d3{animation-delay:.45s;}
.au.d4{animation-delay:.65s;}
@keyframes up{to{opacity:1;transform:translateY(0);}}

/* ══════════════════════════════════════════════════════════════════
   PATRONES DE SECCIÓN
   ══════════════════════════════════════════════════════════════════ */
.band-eyebrow{
  display:inline-block;
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--teal);
  margin-bottom:14px;
}
.section-h2{
  font-family:var(--serif);
  font-size:clamp(1.75rem,3.5vw,2.8rem);
  font-weight:900;
  line-height:1.15;
  margin-bottom:18px;
  color:var(--text);
  letter-spacing:-0.015em;
}
.section-h2 span{color:var(--teal);font-style:italic;}
.section-p{
  font-size:clamp(.95rem,1.3vw,1.05rem);
  color:var(--text-soft);
  line-height:1.7;
  max-width:760px;
  margin-bottom:48px;
}

/* ══════════════════════════════════════════════════════════════════
   SERVICIOS
   ══════════════════════════════════════════════════════════════════ */
.services-section{padding:clamp(72px,10vw,128px) 0;background:var(--bg);}
.services-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:20px;
}
.service-card{
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:32px 28px;
  transition:transform .25s var(--ease2),box-shadow .25s,border-color .25s;
}
.service-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
  border-color:rgba(43,160,156,0.4);
}
[data-theme="dark"] .service-card:hover{border-color:rgba(78,201,196,0.4);}
.service-icon{
  width:44px;
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:18px;
  border-radius:10px;
  background:var(--teal-bg);
  color:var(--teal);
}
.service-icon svg{width:24px;height:24px;display:block;}
[data-theme="dark"] .service-icon{background:rgba(78,201,196,0.10);}
.service-h3{
  font-family:var(--serif);
  font-size:1.35rem;
  font-weight:800;
  color:var(--text);
  margin-bottom:10px;
  line-height:1.2;
}
.service-p{font-size:.92rem;color:var(--text-soft);line-height:1.65;margin-bottom:18px;}
.service-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.85rem;
  font-weight:600;
  color:var(--teal);
  letter-spacing:.02em;
  transition:gap .2s,color .2s;
}
.service-link:hover{gap:10px;color:var(--teal2);}

/* ══════════════════════════════════════════════════════════════════
   BANDA SEDE
   ══════════════════════════════════════════════════════════════════ */
.band-section{
  position:relative;
  min-height:clamp(380px,55vw,520px);
  display:flex;
  align-items:center;
  overflow:hidden;
}
.band-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.band-overlay{
  position:relative;
  z-index:1;
  width:100%;
  background:linear-gradient(90deg,rgba(11,25,41,0.92) 0%,rgba(11,25,41,0.65) 60%,rgba(11,25,41,0.25) 100%);
  min-height:inherit;
  display:flex;
  align-items:center;
}
.band-content{
  width:100%;
  max-width:760px;
  margin:0 auto;
  padding:clamp(60px,8vw,96px) clamp(20px,5vw,48px);
  color:#fff;
}
.band-content .band-eyebrow{color:var(--teal2);}
.band-title{
  font-family:var(--serif);
  font-size:clamp(1.6rem,3.5vw,2.6rem);
  font-weight:900;
  line-height:1.15;
  margin-bottom:18px;
  color:#fff;
}
.band-title span{color:var(--teal2);font-style:italic;}
.band-p{
  font-size:clamp(.95rem,1.3vw,1.05rem);
  color:rgba(255,255,255,0.85);
  line-height:1.7;
  margin-bottom:32px;
  max-width:600px;
}

/* ══════════════════════════════════════════════════════════════════
   CONTEXTO LOCAL
   ══════════════════════════════════════════════════════════════════ */
.local-section{padding:clamp(72px,10vw,128px) 0;background:var(--bg-section);}
.local-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:clamp(40px,6vw,80px);
  align-items:center;
}
.local-p{font-size:1rem;color:var(--text-soft);line-height:1.75;margin-bottom:18px;}
.local-p strong{color:var(--text);font-weight:600;}
.local-stats{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  margin-top:32px;
  padding:0;
}
.local-stats li{
  padding:18px 20px;
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-radius:var(--radius);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.local-stats strong{
  font-family:var(--serif);
  font-size:1.5rem;
  font-weight:900;
  color:var(--teal);
  line-height:1;
}
.local-stats span{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.local-img-col{position:relative;}
.local-img{
  width:100%;
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
  aspect-ratio:4/3;
  object-fit:cover;
}

/* ══════════════════════════════════════════════════════════════════
   POR QUÉ
   ══════════════════════════════════════════════════════════════════ */
.porq-section{padding:clamp(72px,10vw,128px) 0;background:var(--bg);}
.porq-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:18px;
  margin-top:8px;
}
.porq-card{
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px 26px;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.porq-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow);
  border-color:rgba(43,160,156,0.4);
}
.porq-icon-v{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
  border-radius:8px;
  background:var(--teal-bg);
  color:var(--teal);
}
.porq-icon-v svg{width:22px;height:22px;display:block;}
[data-theme="dark"] .porq-icon-v{background:rgba(78,201,196,0.10);}

/* Iconos dentro de botones */
.btn-blue .ico,
.btn-ghost .ico{
  flex-shrink:0;
  vertical-align:middle;
}
.btn-blue .ico{color:#fff;}
.porq-title-v{
  font-family:var(--serif);
  font-size:1.15rem;
  font-weight:800;
  color:var(--text);
  margin-bottom:10px;
  line-height:1.25;
}
.porq-body-v{font-size:.92rem;color:var(--text-soft);line-height:1.65;}

/* ══════════════════════════════════════════════════════════════════
   CASOS
   ══════════════════════════════════════════════════════════════════ */
.cases-section{padding:clamp(72px,10vw,128px) 0;background:var(--bg-section);}
.cases-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
  gap:20px;
}
.case-card{
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px 26px 24px;
  display:flex;
  flex-direction:column;
  gap:12px;
  transition:transform .25s,box-shadow .25s,border-color .25s;
}
.case-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shadow);
  border-color:rgba(43,160,156,0.4);
}
.case-tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--teal);
  margin-bottom:4px;
}
.tag-dot{width:6px;height:6px;border-radius:50%;background:var(--teal);}
.case-h3{
  font-family:var(--serif);
  font-size:1.15rem;
  font-weight:800;
  color:var(--text);
  line-height:1.25;
}
.case-p{font-size:.92rem;color:var(--text-soft);line-height:1.65;flex:1;}
.case-result{
  margin-top:auto;
  padding-top:14px;
  border-top:1px dashed var(--border);
  font-size:.92rem;
  font-weight:600;
  color:var(--teal);
}
[data-theme="dark"] .case-result{color:var(--teal2);}

/* ══════════════════════════════════════════════════════════════════
   TESTIMONIOS
   ══════════════════════════════════════════════════════════════════ */
.testi-section{padding:clamp(72px,10vw,128px) 0;background:var(--bg);}
.testi-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:20px;
}
.testi-card{
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:28px 26px;
  display:flex;
  flex-direction:column;
  gap:14px;
  transition:transform .25s,box-shadow .25s;
}
.testi-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.testi-stars{font-size:1.1rem;color:#F5B81C;letter-spacing:1px;}
.testi-body{
  font-size:.95rem;
  color:var(--text);
  line-height:1.7;
  flex:1;
  font-style:italic;
}
.testi-body::before{content:"\201C";font-size:1.4rem;color:var(--teal);font-weight:900;margin-right:2px;}
.testi-body::after{content:"\201D";font-size:1.4rem;color:var(--teal);font-weight:900;}
.testi-author{
  font-size:.82rem;
  font-weight:600;
  color:var(--text);
  padding-top:8px;
  border-top:1px solid var(--border);
}
.testi-author span{color:var(--muted);font-weight:400;}

/* ══════════════════════════════════════════════════════════════════
   ORGANISMOS / JUDICIAL
   ══════════════════════════════════════════════════════════════════ */
.judicial-section{padding:clamp(72px,10vw,128px) 0;background:var(--bg-section);}
.judicial-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:20px;
}
.jud-card{
  background:var(--bg-elev);
  border:1px solid var(--border);
  border-left:3px solid var(--teal);
  border-radius:var(--radius);
  padding:26px 26px;
}
.jud-h3{
  font-family:var(--serif);
  font-size:1.2rem;
  font-weight:800;
  color:var(--text);
  margin-bottom:10px;
  line-height:1.25;
}
.jud-p{font-size:.92rem;color:var(--text-soft);line-height:1.65;}

/* ══════════════════════════════════════════════════════════════════
   FAQ
   ══════════════════════════════════════════════════════════════════ */
.faq-section{padding:clamp(72px,10vw,128px) 0;background:var(--bg);}
.faq-container{max-width:880px;}
.faq-item{border-bottom:1px solid var(--border);}
.faq-item:first-of-type{border-top:1px solid var(--border);margin-top:24px;}
.faq-btn{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:22px 0;
  font-size:clamp(.98rem,1.3vw,1.08rem);
  font-weight:600;
  color:var(--text);
  text-align:left;
  font-family:inherit;
  transition:color .2s;
}
.faq-btn:hover{color:var(--teal);}
.faq-icon{
  flex-shrink:0;
  width:32px;
  height:32px;
  border-radius:50%;
  background:var(--teal-bg);
  color:var(--teal);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  font-weight:300;
  line-height:1;
  transition:transform .3s var(--ease2),background .2s,color .2s;
}
.faq-item.open .faq-icon{transform:rotate(45deg);background:var(--teal);color:#fff;}
.faq-answer{
  max-height:0;
  overflow:hidden;
  font-size:.95rem;
  color:var(--text-soft);
  line-height:1.75;
  transition:max-height .35s var(--ease),padding .35s var(--ease);
  padding:0;
}
.faq-item.open .faq-answer{max-height:1000px;padding:0 0 22px;}

/* ══════════════════════════════════════════════════════════════════
   CTA FINAL
   ══════════════════════════════════════════════════════════════════ */
.cta-section{
  position:relative;
  min-height:clamp(420px,60vw,560px);
  display:flex;
  align-items:center;
  overflow:hidden;
}
.cta-bg{position:absolute;inset:0;z-index:0;}
.cta-bg img{width:100%;height:100%;object-fit:cover;}
.cta-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,rgba(11,25,41,0.92) 0%,rgba(11,25,41,0.75) 50%,rgba(43,160,156,0.55) 100%);
}
.cta-inner{
  position:relative;
  z-index:1;
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:clamp(72px,10vw,120px) clamp(20px,5vw,48px);
  color:#fff;
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:60px;
  align-items:center;
}
.cta-eyebrow{
  display:inline-block;
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--teal2);
  margin-bottom:12px;
}
.cta-h2{font-family:var(--serif);font-weight:900;line-height:1.15;margin-bottom:18px;}
.cta-h2 span{color:var(--teal2);font-style:italic;}
.cta-p{font-size:clamp(.95rem,1.3vw,1.05rem);color:rgba(255,255,255,0.85);line-height:1.7;}
.cta-btns{display:flex;flex-direction:column;gap:12px;}
.cta-btns .btn-ghost{color:#fff;border-color:rgba(255,255,255,0.4);}
.cta-btns .btn-ghost:hover{border-color:var(--teal2);color:var(--teal2);}

/* ══════════════════════════════════════════════════════════════════
   RESPONSIVE — MÓVIL
   ══════════════════════════════════════════════════════════════════ */
@media(max-width:1024px){
  .local-grid{grid-template-columns:1fr;gap:48px;}
  .local-img-col{max-width:560px;}
  .cta-inner{grid-template-columns:1fr;gap:32px;}
}

@media(max-width:768px){
  body{font-size:15px;}
  .hero{min-height:auto;padding:0;}
  .hero-content{padding:clamp(96px,18vw,140px) 22px clamp(48px,8vw,72px);}
  .hero-h1{font-size:clamp(1.75rem,7vw,2.4rem);line-height:1.15;}
  .hero-p{font-size:.95rem;margin-bottom:28px;}
  .hero-btns{gap:10px;}
  .hero-btns .btn-blue,
  .hero-btns .btn-ghost{
    width:100%;
    padding:14px 22px;
    font-size:.92rem;
    justify-content:center;
  }
  .hero-micro{gap:14px;justify-content:space-between;width:100%;}
  .micro-sep{display:none;}
  .micro-item{flex:1;min-width:0;}
  .micro-num{font-size:1.35rem;}
  .micro-lbl{font-size:10px;}

  .services-grid,
  .porq-grid,
  .cases-grid,
  .testi-grid,
  .judicial-grid{grid-template-columns:1fr;gap:16px;}
  .service-card,.porq-card,.case-card,.testi-card,.jud-card{padding:24px 22px;}

  .section-h2{font-size:clamp(1.5rem,6vw,2rem);}
  .section-p{margin-bottom:32px;}

  .band-content{padding:clamp(56px,12vw,80px) 22px;}
  .band-title{font-size:clamp(1.4rem,5.5vw,2rem);}

  .local-stats{grid-template-columns:1fr 1fr;gap:12px;}
  .local-stats li{padding:14px 16px;}
  .local-stats strong{font-size:1.3rem;}

  .faq-btn{padding:18px 0;font-size:.98rem;gap:12px;}
  .faq-icon{width:28px;height:28px;font-size:16px;}

  .cta-h2{font-size:clamp(1.45rem,5.5vw,2rem);}
  .cta-btns .btn-blue,.cta-btns .btn-ghost{
    width:100%;
    padding:14px 22px;
    font-size:.92rem;
  }

  .testi-body{font-size:.92rem;}
  .testi-body::before,.testi-body::after{font-size:1.2rem;}
}

@media(max-width:480px){
  body{padding-top:60px;}
  .container{padding:0 18px;}
  .hero-content{padding:96px 18px 56px;}
  .hero-eyebrow{font-size:11px;padding:5px 10px;}
  .hero-h1{font-size:1.7rem;}
  .local-stats{grid-template-columns:1fr;}
  .section-h2{font-size:1.5rem;}
  .band-title{font-size:1.4rem;}
  .cta-h2{font-size:1.45rem;}
  .service-card,.porq-card,.case-card,.testi-card{padding:22px 20px;}
}

/* ── Accesibilidad ── */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:2px;}

/* ══════════════════════════════════════════════════════════════════
   TABLA DE CONTENIDOS (TOC)
   ══════════════════════════════════════════════════════════════════ */
.page-toc{
  background:var(--bg-elev);
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
  position:sticky;
  top:68px;
  z-index:50;
  backdrop-filter:blur(10px);
  background:color-mix(in srgb,var(--bg-elev) 92%,transparent);
}
[data-theme="dark"] .page-toc{background:color-mix(in srgb,var(--bg-elev) 90%,transparent);}
.page-toc .container{display:flex;align-items:center;gap:24px;padding-top:12px;padding-bottom:12px;flex-wrap:wrap;}
.toc-toggle{
  display:none;
  align-items:center;
  gap:8px;
  font-family:var(--sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--text);
  padding:8px 12px;
  background:transparent;
  border:1px solid var(--border-strong);
  border-radius:var(--radius);
  cursor:pointer;
  transition:border-color .2s,color .2s;
}
.toc-toggle:hover{border-color:var(--teal);color:var(--teal);}
.toc-chevron{font-size:18px;line-height:1;transition:transform .2s;}
.toc-toggle[aria-expanded="true"] .toc-chevron{transform:rotate(180deg);}
.toc-list{
  list-style:none;
  display:flex;
  gap:6px 18px;
  flex-wrap:wrap;
  margin:0;
  padding:0;
  align-items:center;
  flex:1;
  counter-reset:toc;
}
.toc-list li{counter-increment:toc;}
.toc-list a{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:500;
  color:var(--text-soft);
  padding:6px 0;
  transition:color .15s;
  white-space:nowrap;
  border-bottom:2px solid transparent;
}
.toc-list a::before{
  content:counter(toc,decimal-leading-zero);
  font-size:10px;
  font-weight:700;
  color:var(--teal);
  letter-spacing:.05em;
  font-family:var(--sans);
}
.toc-list a:hover{color:var(--teal);}
.toc-list a:focus-visible{outline:none;color:var(--teal);}

@media(max-width:1024px){
  .toc-list a{font-size:12px;}
  .page-toc .container{gap:12px;}
}
@media(max-width:768px){
  .page-toc{position:static;}
  .page-toc .container{padding-top:14px;padding-bottom:14px;flex-direction:column;align-items:stretch;}
  .toc-toggle{display:inline-flex;align-self:flex-start;width:100%;justify-content:space-between;}
  .toc-list{
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    padding-top:8px;
    width:100%;
  }
  .toc-list.open{display:flex;}
  .toc-list a{
    padding:12px 4px;
    font-size:14px;
    border-bottom:1px solid var(--border);
    width:100%;
  }
  .toc-list li:last-child a{border-bottom:none;}
}

/* Compensación de scroll para anchors (header fijo) */
section[id]{scroll-margin-top:80px;}