:root{
  --bg:#050505;
  --panel:#0c0d0d;
  --panel-2:#121414;
  --text:#f6f4ee;
  --muted:#b9beb9;
  --green:#8fc719;
  --yellow:#f3c623;
  --orange:#ef6d22;
  --teal:#159aa0;
  --petrol:#0d5d65;
  --purple:#9f7aea;
  --gray:#8f9690;
  --radius:28px;
  --shadow:0 24px 60px rgba(0,0,0,.34);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
a{color:inherit;text-decoration:none}

body.negro{
  min-height:100vh;
  color:var(--text);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.6;
  background:
    radial-gradient(circle at 12% 8%, rgba(143,199,25,.08), transparent 28%),
    radial-gradient(circle at 88% 14%, rgba(21,154,160,.08), transparent 30%),
    radial-gradient(circle at 72% 88%, rgba(239,109,34,.05), transparent 28%),
    var(--bg);
  overflow-x:hidden;
}

.container{width:min(1120px,calc(100% - 40px));margin:0 auto}
.shell{width:min(1180px,calc(100% - 40px));margin:0 auto}

.topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:26px 0 8px;
}
.brand{
  font-size:.84rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#d7dbd6;
}
.toplinks{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.pill{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:40px;padding:0 14px;border:1px solid rgba(255,255,255,.12);
  border-radius:999px;color:#dfe3df;font-size:.86rem;transition:.2s ease;
}
.pill:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.25)}

.hero{text-align:center;padding:26px 0 42px}
.logo{
  width:min(500px,88vw);
  height:auto;
  margin-bottom:18px;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.28));
}
.hero h1{
  font-size:clamp(2.8rem,7vw,5.5rem);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:900;
}
.hero h1 span,.gradient-title{
  background:linear-gradient(90deg,var(--green),var(--yellow),var(--orange),var(--teal));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.subtitle{margin-top:14px;color:#e7e9e7;font-size:1.08rem;font-weight:700}
.intro{max-width:820px;margin:18px auto 0;color:var(--muted);font-size:1.05rem}
.footer{
  text-align:center;margin-top:48px;padding:24px 0 34px;
  border-top:1px solid rgba(255,255,255,.08);color:#8f9690;font-size:.9rem;
}

/* =========================================================
   SOSTENER — PORTADA
========================================================= */
.page-sostener-home .topbar{padding:28px 0 10px}
.page-sostener-home .brand{font-size:.88rem}
.page-sostener-home .back{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;
  border:1px solid rgba(255,255,255,.12);border-radius:999px;color:#dfe3df;
  transition:.2s ease;font-size:.92rem;
}
.page-sostener-home .back:hover{
  border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.04);transform:translateY(-1px);
}
.page-sostener-home .hero{padding:35px 0 26px}
.logo-wrap{display:flex;justify-content:center;margin-bottom:10px}
.logo-wrap img{
  width:min(560px,86vw);height:auto;display:block;
  filter:drop-shadow(0 18px 30px rgba(0,0,0,.25));
}
.page-sostener-home .hero h1{font-size:clamp(2.8rem,7vw,6rem);font-weight:800;margin-top:-14px}
.page-sostener-home .hero p{
  max-width:760px;margin:24px auto 0;font-size:clamp(1.05rem,2vw,1.34rem);color:var(--muted);
}
.page-sostener-home .cards{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:34px 0 70px;
}
.page-sostener-home .card{
  --accent:#fff;position:relative;min-height:290px;padding:32px;border-radius:var(--radius);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),var(--panel);
  border:1px solid rgba(255,255,255,.09);box-shadow:var(--shadow);overflow:hidden;
  transition:transform .22s ease,background .22s ease;display:flex;flex-direction:column;justify-content:space-between;
}
.page-sostener-home .card::before{
  content:"";position:absolute;width:150px;height:150px;border-radius:50%;right:-45px;top:-45px;
  background:var(--accent);opacity:.09;
}
.page-sostener-home .card::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--accent);opacity:.85;
}
.page-sostener-home .card:hover{
  transform:translateY(-6px);
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.016)),var(--panel-2);
}
.page-sostener-home .icon{
  width:54px;height:54px;border-radius:18px;display:grid;place-items:center;margin-bottom:26px;
  font-size:1.6rem;color:var(--accent);border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);
}
.page-sostener-home .card h2{font-size:clamp(1.55rem,2.4vw,2.15rem);letter-spacing:-.03em;margin-bottom:10px}
.page-sostener-home .card p{color:var(--muted);max-width:480px;font-size:1rem}
.page-sostener-home .go{margin-top:28px;display:flex;align-items:center;justify-content:space-between;color:#f7f8f6;font-weight:700}
.page-sostener-home .arrow{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#070707;font-size:1.2rem;
}
.page-sostener-home .books{--accent:var(--yellow)}
.page-sostener-home .exercises{--accent:var(--teal)}
.page-sostener-home .support{--accent:var(--green)}
.page-sostener-home .closing{text-align:center;padding:0 0 58px;color:#d7dbd7}
.page-sostener-home .closing strong{color:#fff;font-size:1.2rem}
.page-sostener-home .closing p{margin-top:8px;color:var(--muted)}
.page-sostener-home footer{
  border-top:1px solid rgba(255,255,255,.08);padding:25px 0 34px;color:#8f9690;font-size:.9rem;
}
.page-sostener-home .footer-inner{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap}

/* =========================================================
   LIBROS — ÍNDICE
========================================================= */
.page-libros-index .menu{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:28px 0 56px;
}
.page-libros-index .menu a{
  --accent:var(--green);position:relative;min-height:220px;display:flex;flex-direction:column;justify-content:space-between;
  padding:28px;border-radius:var(--radius);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),var(--panel);
  border:1px solid rgba(255,255,255,.09);box-shadow:var(--shadow);overflow:hidden;transition:.22s ease;
}
.page-libros-index .menu a:nth-child(1){--accent:var(--teal)}
.page-libros-index .menu a:nth-child(2){--accent:var(--orange)}
.page-libros-index .menu a:nth-child(3){--accent:var(--yellow)}
.page-libros-index .menu a:nth-child(4){--accent:var(--green)}
.page-libros-index .menu a:nth-child(5){--accent:var(--purple)}
.page-libros-index .menu a:nth-child(6){--accent:var(--petrol)}
.page-libros-index .menu a:nth-child(7){--accent:#888}
.page-libros-index .menu a::before{
  content:"";position:absolute;width:140px;height:140px;top:-44px;right:-44px;border-radius:50%;background:var(--accent);opacity:.09;
}
.page-libros-index .menu a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--accent)}
.page-libros-index .menu a:hover{
  transform:translateY(-5px);
  background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.016)),var(--panel-2);
}
.page-libros-index .menu strong{display:block;font-size:1.45rem;line-height:1.1;letter-spacing:-.025em}
.page-libros-index .menu em{
  display:inline-block;margin-top:10px;font-style:normal;color:var(--accent);font-size:.86rem;font-weight:900;
  letter-spacing:.08em;text-transform:uppercase;
}
.page-libros-index .menu span{display:block;margin-top:14px;color:var(--muted);font-size:.96rem;line-height:1.55}
.page-libros-index .go{margin-top:24px;display:flex;justify-content:flex-end}
.page-libros-index .arrow{
  width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#050505;font-weight:900;
}

/* =========================================================
   LIBROS — CATEGORÍAS
========================================================= */
.page-libros-index .back,
.page-libros-categoria .back,
.page-ejercicios .back,
.page-informacion .back{text-align:center;margin-top:10px}
.page-libros-index .back a,
.page-libros-categoria .back a,
.page-ejercicios .back a,
.page-informacion .back a{
  display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;border-radius:999px;
  border:1px solid rgba(255,255,255,.14);color:#e7ebe7;
}
.page-libros-categoria .books{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin:30px 0 58px;
}
.page-libros-categoria .book{
  --accent:var(--teal);position:relative;display:flex;flex-direction:column;padding:24px;border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),var(--panel);
  box-shadow:var(--shadow);overflow:hidden;
}
.page-libros-categoria .book::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--accent)}
.page-libros-categoria .book img{
  width:100%;height:340px;object-fit:contain;margin-bottom:22px;border-radius:18px;background:#090909;
}
.page-libros-categoria .book-content{display:flex;flex-direction:column;flex:1}
.page-libros-categoria .book h2{margin:0 0 8px;font-size:1.5rem;line-height:1.15;letter-spacing:-.025em}
.page-libros-categoria .code{
  color:var(--accent);font-size:.86rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase;margin-bottom:14px;
}
.page-libros-categoria .book p{margin:0 0 12px;color:var(--muted);line-height:1.6}
.page-libros-categoria .price{margin-top:auto!important;padding-top:8px;color:#fff!important;font-weight:700;line-height:1.7}
.page-libros-categoria .unavailable{
  margin-top:auto!important;padding-top:8px;color:#9ea49f!important;font-style:italic;font-weight:700;
}
.page-libros-categoria .button{margin-top:20px}
.page-libros-categoria .button a{
  display:inline-flex;align-items:center;justify-content:center;width:100%;min-height:50px;padding:0 18px;border-radius:999px;
  background:var(--accent);color:#050505;font-weight:900;transition:.2s ease;
}
.page-libros-categoria .button a:hover{transform:translateY(-2px)}
.page-libros-categoria.accent-orange .book{--accent:var(--orange)}
.page-libros-categoria.accent-petrol .book{--accent:var(--petrol)}
.page-libros-categoria.accent-petrol .button a{color:#fff}
.page-libros-categoria.accent-teal .book{--accent:var(--teal)}
.page-libros-categoria.accent-purple .book{--accent:var(--purple)}
.page-libros-categoria.accent-yellow .book{--accent:var(--yellow)}
.page-libros-categoria.accent-green .book{--accent:var(--green)}
.page-libros-categoria.single-book .book{max-width:380px;width:100%;justify-self:center}
.page-otros .empty{
  max-width:760px;margin:42px auto 58px;padding:42px 32px;border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),var(--panel);
  box-shadow:var(--shadow);text-align:center;position:relative;overflow:hidden;
}
.page-otros .empty::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--gray)}
.page-otros .empty h2{font-size:2rem;margin-bottom:14px;letter-spacing:-.03em}
.page-otros .empty p{color:var(--muted);margin:8px 0}

/* =========================================================
   EJERCICIOS
========================================================= */
.page-ejercicios .content-card{
  position:relative;max-width:860px;margin:20px auto 0;padding:42px;border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),var(--panel);
  box-shadow:var(--shadow);overflow:hidden;
}
.page-ejercicios .content-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--teal)}
.page-ejercicios .content-card h2{font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.12;letter-spacing:-.03em;margin-bottom:24px}
.page-ejercicios .content-card p{color:var(--muted);font-size:1.07rem;margin-bottom:19px}
.page-ejercicios .content-card p:last-of-type{margin-bottom:0}
.page-ejercicios .cta{text-align:center;padding:34px 0 16px}
.page-ejercicios .cta a{
  display:inline-flex;align-items:center;justify-content:center;min-height:58px;padding:0 28px;border-radius:999px;
  background:var(--teal);color:#050505;font-weight:900;font-size:1.03rem;transition:.2s ease;
}
.page-ejercicios .cta a:hover{transform:translateY(-3px);background:var(--green)}
.page-ejercicios .cta-note{margin-top:13px;color:#8f9690;font-size:.9rem}
.page-ejercicios .button-whatsapp{margin-top:24px;text-align:center}
.page-ejercicios .button-whatsapp a{
  display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 24px;border-radius:999px;
  background:#25D366;color:#041007;font-weight:900;transition:.2s ease;
}

/* =========================================================
   INFORMACIÓN
========================================================= */
.page-informacion .section{
  margin:22px 0;padding:38px;border-radius:var(--radius);border:1px solid rgba(255,255,255,.09);
  background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),var(--panel);
  box-shadow:var(--shadow);position:relative;overflow:hidden;
}
.page-informacion .section::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--accent,var(--green))}
.page-informacion .section h2{font-size:clamp(1.85rem,4vw,2.7rem);line-height:1.08;letter-spacing:-.035em;margin-bottom:20px}
.page-informacion .section p{color:var(--muted);font-size:1.04rem;margin-bottom:16px}
.page-informacion .section p:last-child{margin-bottom:0}
.page-informacion .intro-card{--accent:var(--green)}
.page-informacion .personal-card{--accent:var(--yellow)}
.page-informacion .org-card{--accent:var(--orange)}
.page-informacion .resources-card{--accent:var(--teal)}
.page-informacion .transparency-card{--accent:var(--petrol)}
.page-informacion .jump,.page-informacion .whatsapp{
  display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 18px;margin-top:10px;
  border-radius:999px;font-weight:900;
}
.page-informacion .jump{background:var(--yellow);color:#050505}
.page-informacion .whatsapp{min-height:50px;padding:0 20px;background:#25D366;color:#041007}
.page-informacion .resource-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}
.page-informacion .resource{
  padding:22px;border-radius:20px;border:1px solid rgba(255,255,255,.08);background:var(--panel-2);
}
.page-informacion .resource h3{font-size:1.1rem;margin-bottom:8px;color:#fff}
.page-informacion .resource p{margin:0;font-size:.96rem}
.page-informacion .highlight{
  margin-top:24px;padding:22px 24px;border-radius:20px;background:rgba(21,154,160,.08);
  border:1px solid rgba(21,154,160,.22);color:#eef7f7;font-size:1.06rem;font-weight:700;
}

/* =========================================================
   APACIGUA — PÁGINA PRINCIPAL
========================================================= */
.page-apacigua-home{
  padding:42px 0 60px;
}

.page-apacigua-home .container{
  width:min(90%,900px);
  text-align:center;
}

.page-apacigua-home .logo img{
  width:min(500px,88vw);
  height:auto;
  display:block;
  margin:0 auto 18px;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.28));
}

.page-apacigua-home .marca{
  font-size:clamp(2.8rem,7vw,5.5rem);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:900;
  margin-bottom:12px;
  background:linear-gradient(90deg,var(--green),var(--yellow),var(--orange),var(--teal));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-apacigua-home .descripcion{
  max-width:620px;
  margin:0 auto 26px;
  color:var(--muted);
  font-size:1.08rem;
}

.page-apacigua-home .menu-superior{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:42px;
}

.page-apacigua-home .menu-superior a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#dfe3df;
  font-size:.86rem;
  font-weight:700;
  transition:.2s ease;
}

.page-apacigua-home .menu-superior a:hover{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.25);
}

.page-apacigua-home .nav-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}

.page-apacigua-home .nav-btn{
  --accent:var(--teal);
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height:145px;
  padding:28px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.09);
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    var(--panel);
  color:var(--text);
  text-align:left;
  box-shadow:var(--shadow);
  overflow:hidden;
  transition:.22s ease;
}

.page-apacigua-home .nav-btn::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:5px;
  background:var(--accent);
}

.page-apacigua-home .nav-btn:hover{
  transform:translateY(-4px);
  background:
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.016)),
    var(--panel-2);
}

.page-apacigua-home .nav-btn .label{
  font-size:1.65rem;
  font-weight:800;
  line-height:1.12;
  letter-spacing:-.025em;
}

.page-apacigua-home .nav-btn .sublabel{
  display:block;
  margin-top:10px;
  font-size:.95rem;
  color:var(--muted);
  line-height:1.5;
}

.page-apacigua-home .nav-btn.ancho{
  grid-column:1/-1;
  min-height:125px;
}

.page-apacigua-home .nav-btn.destacado{
  --accent:var(--yellow);
  background:
    linear-gradient(135deg,rgba(243,198,35,.08),rgba(239,109,34,.04)),
    var(--panel);
}

.page-apacigua-home .nav-btn.taller{
  --accent:var(--teal);
}

.page-apacigua-home .nav-btn.inactivo{
  opacity:.72;
  cursor:default;
}

.page-apacigua-home .nav-btn.inactivo:hover{
  transform:none;
}

.page-apacigua-home .nav-btn.patria{
  --accent:var(--petrol);
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px 30px;
}

.page-apacigua-home .nav-btn.patria img{
  display:block;
  width:min(430px,90%);
  max-height:150px;
  object-fit:contain;
  margin:0 auto;
}

.page-apacigua-home .seccion{
  margin-top:54px;
}

.page-apacigua-home .seccion-encabezado{
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:32px;
  margin-bottom:22px;
  text-align:left;
}

.page-apacigua-home .seccion-encabezado h2{
  font-size:2rem;
  line-height:1.2;
  font-weight:800;
  letter-spacing:-.025em;
  color:var(--text);
}

.page-apacigua-home .footer{
  margin-top:60px;
}

.page-apacigua-home .footer p{margin:4px 0}
.page-apacigua-home .footer a{color:var(--teal);font-weight:800}

/* Utilidades */
.text-white{color:#fff!important}
.mt-22{margin-top:22px!important}
.text-center{text-align:center}

@media(max-width:900px){
  .page-sostener-home .cards{grid-template-columns:1fr}
  .page-sostener-home .card{min-height:230px}
}

@media(max-width:760px){
  .container{width:min(100% - 24px,1120px)}
  .shell{width:min(100% - 24px,1180px)}
  .topbar{padding-top:18px;gap:14px;align-items:flex-start}
  .brand{font-size:.74rem;padding-top:8px}
  .pill{font-size:.8rem;padding:0 11px}
  .page-sostener-home .back{padding:8px 11px;font-size:.82rem}
  .page-sostener-home .hero{padding-top:24px}
  .page-sostener-home .logo-wrap img{width:min(420px,94vw)}
  .page-sostener-home .hero h1{margin-top:-4px}
  .page-sostener-home .hero p{margin-top:18px}
  .page-sostener-home .cards{padding-top:28px}
  .page-sostener-home .card{padding:26px}
  .page-libros-index .menu{grid-template-columns:1fr}
  .page-libros-index .menu a{min-height:200px;padding:24px}
  .page-libros-categoria .books{grid-template-columns:1fr}
  .page-libros-categoria .book{padding:20px}
  .page-libros-categoria .book img{height:300px}
  .page-libros-categoria.single-book .book{max-width:none}
  .page-otros .empty{padding:32px 22px}
  .page-ejercicios .content-card{padding:28px 22px}
  .page-informacion .section{padding:28px 22px}
  .page-informacion .resource-grid{grid-template-columns:1fr}
  .page-apacigua-home{padding-top:24px}
  .page-apacigua-home .nav-grid{grid-template-columns:1fr}
  .page-apacigua-home .nav-btn.ancho{grid-column:auto}
  .page-apacigua-home .menu-superior{gap:6px}
  .page-apacigua-home .menu-superior a{font-size:.8rem;padding:0 10px}
  .page-apacigua-home .seccion{margin-top:44px}
  .page-apacigua-home .seccion-encabezado{padding-top:27px}
  .page-apacigua-home .seccion-encabezado h2{font-size:1.75rem}
  .page-apacigua-home .nav-btn.patria img{width:min(370px,96%)}
}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important}
}

/* Corrección de centrado del logo en portada de Apacigua */
.page-apacigua-home .logo{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  text-align:center;
}

.page-apacigua-home .logo a{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
}

.page-apacigua-home .logo img{
  margin:0 auto 18px;
}

/* =========================================================
   UNIVERSO DIGITAL DE APACIGUA
========================================================= */

.page-uda{
  padding:42px 0 60px;
}

.page-uda .container{
  width:min(90%,1080px);
}

.page-uda .encabezado{
  text-align:center;
}

.page-uda .logo{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  text-align:center;
}

.page-uda .logo a{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
}

.page-uda .logo img{
  width:min(500px,88vw);
  height:auto;
  display:block;
  margin:0 auto 18px;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.28));
}

.page-uda .marca{
  font-size:clamp(2.8rem,7vw,5.5rem);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:900;
  margin-bottom:12px;
  background:linear-gradient(90deg,var(--green),var(--yellow),var(--orange),var(--teal));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-uda .descripcion{
  max-width:620px;
  margin:0 auto 26px;
  color:var(--muted);
  font-size:1.08rem;
}

.page-uda .menu-superior{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:46px;
}

.page-uda .menu-superior a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#dfe3df;
  font-size:.86rem;
  font-weight:700;
  transition:.2s ease;
}

.page-uda .menu-superior a:hover{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.25);
}

.page-uda .hero{
  text-align:center;
  margin-bottom:48px;
  padding:0;
}

.page-uda .hero h1{
  font-size:clamp(2.7rem,6vw,4.8rem);
  font-weight:900;
  line-height:1;
  letter-spacing:-.05em;
  margin-bottom:14px;
  background:linear-gradient(90deg,var(--teal),var(--green),var(--yellow));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-uda .hero p{
  color:var(--muted);
  font-size:1.08rem;
  max-width:760px;
  margin:0 auto;
}

.page-uda .categoria{
  margin-bottom:52px;
}

.page-uda .categoria-header{
  margin-bottom:20px;
}

.page-uda .categoria-titulo{
  font-size:2rem;
  font-weight:900;
  letter-spacing:-.03em;
  color:var(--text);
  margin-bottom:8px;
}

.page-uda .categoria-descripcion{
  color:var(--muted);
  font-size:1rem;
  max-width:760px;
}

.page-uda .herramientas-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;
}

.page-uda .herramienta-boton{
  --accent:var(--teal);
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:145px;
  padding:26px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.09);
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    var(--panel);
  color:var(--text);
  box-shadow:var(--shadow);
  overflow:hidden;
  transition:.22s ease;
}

.page-uda .herramienta-boton::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:5px;
  background:var(--accent);
}

.page-uda .herramienta-boton:hover{
  transform:translateY(-4px);
  background:
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.016)),
    var(--panel-2);
}

.page-uda .herramienta-boton strong{
  font-size:1.38rem;
  font-weight:900;
  line-height:1.15;
  margin-bottom:10px;
  letter-spacing:-.02em;
}

.page-uda .herramienta-boton span{
  color:var(--muted);
  font-size:.92rem;
}

.page-uda .herramienta-boton.sostener{
  --accent:var(--yellow);
  background:
    linear-gradient(135deg,rgba(243,198,35,.08),rgba(239,109,34,.04)),
    var(--panel);
}

.page-uda .categoria:nth-of-type(2) .herramienta-boton{--accent:var(--green)}
.page-uda .categoria:nth-of-type(3) .herramienta-boton{--accent:var(--petrol)}
.page-uda .categoria:nth-of-type(4) .herramienta-boton{--accent:var(--orange)}
.page-uda .categoria:nth-of-type(5) .herramienta-boton{--accent:var(--purple)}
.page-uda .categoria:nth-of-type(6) .herramienta-boton{--accent:var(--yellow)}

.page-uda .paneles{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:58px;
}

.page-uda .panel{
  position:relative;
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    var(--panel);
  border:1px solid rgba(255,255,255,.09);
  border-radius:var(--radius);
  padding:28px;
  box-shadow:var(--shadow);
  overflow:hidden;
}

.page-uda .panel::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:5px;
  background:var(--teal);
}

.page-uda .panel h3{
  font-size:1.55rem;
  font-weight:900;
  color:#fff;
  margin-bottom:10px;
  letter-spacing:-.025em;
}

.page-uda .panel p{
  color:var(--muted);
  font-size:.95rem;
  margin-bottom:16px;
}

.page-uda .panel a,
.page-uda .panel .dato{
  display:block;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  padding:12px 14px;
  margin-top:10px;
  background:rgba(255,255,255,.035);
  color:#eef3ef;
  font-weight:800;
  text-align:center;
}

.page-uda .panel a:hover{
  border-color:var(--teal);
  color:var(--teal);
}

.page-uda .footer{
  text-align:center;
  margin-top:70px;
  padding-top:30px;
  border-top:1px solid rgba(255,255,255,.08);
  color:var(--gray);
  font-size:.9rem;
}

.page-uda .footer a{
  color:var(--teal);
  font-weight:800;
}

@media(max-width:850px){
  .page-uda .paneles{
    grid-template-columns:1fr;
  }
}

@media(max-width:700px){
  .page-uda{padding-top:24px}
  .page-uda .menu-superior{gap:6px}
  .page-uda .menu-superior a{font-size:.8rem;padding:0 10px}
}

@media(max-width:520px){
  .page-uda .herramientas-grid{
    grid-template-columns:1fr;
  }

  .page-uda .herramienta-boton{
    min-height:auto;
  }

  .page-uda .categoria-titulo{
    font-size:1.75rem;
  }
}

/* =========================================================
   REDES SOCIALES — APACIGUA
========================================================= */

.page-redes-sociales{
  padding:42px 0 60px;
}

.page-redes-sociales .container{
  width:min(90%,900px);
  text-align:center;
}

.page-redes-sociales .logo{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
  text-align:center;
}

.page-redes-sociales .logo a{
  display:flex;
  justify-content:center;
  align-items:center;
  width:100%;
}

.page-redes-sociales .logo img{
  width:min(500px,88vw);
  height:auto;
  display:block;
  margin:0 auto 18px;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.28));
}

.page-redes-sociales .marca{
  font-size:clamp(2.8rem,7vw,5.5rem);
  line-height:.96;
  letter-spacing:-.055em;
  font-weight:900;
  margin-bottom:12px;
  background:linear-gradient(90deg,var(--green),var(--yellow),var(--orange),var(--teal));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-redes-sociales .descripcion{
  max-width:620px;
  margin:0 auto 26px;
  color:var(--muted);
  font-size:1.08rem;
}

.page-redes-sociales .menu-superior{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:42px;
}

.page-redes-sociales .menu-superior a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 14px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  color:#dfe3df;
  font-size:.86rem;
  font-weight:700;
  transition:.2s ease;
}

.page-redes-sociales .menu-superior a:hover{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.25);
}

.page-redes-sociales .grupo-label{
  text-align:left;
  font-size:.78rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--teal);
  margin:42px 0 14px 4px;
  font-weight:900;
}

.page-redes-sociales .nav-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}

.page-redes-sociales .nav-btn{
  --accent:var(--teal);
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height:165px;
  padding:28px;
  border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.09);
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    var(--panel);
  color:var(--text);
  text-align:left;
  box-shadow:var(--shadow);
  overflow:hidden;
  transition:.22s ease;
}

.page-redes-sociales .nav-btn::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:5px;
  background:var(--accent);
}

.page-redes-sociales .nav-btn:hover{
  transform:translateY(-4px);
  background:
    linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.016)),
    var(--panel-2);
}

.page-redes-sociales .nav-btn.full{
  grid-column:1/-1;
}

.page-redes-sociales .nav-btn .label{
  font-size:1.55rem;
  font-weight:900;
  line-height:1.15;
  letter-spacing:-.025em;
}

.page-redes-sociales .nav-btn .sublabel{
  display:block;
  margin-top:8px;
  font-size:.98rem;
  font-weight:800;
  color:var(--accent);
}

.page-redes-sociales .nav-btn .descripcion-red{
  display:block;
  margin-top:10px;
  font-size:.92rem;
  line-height:1.5;
  color:var(--muted);
}

.page-redes-sociales .nav-btn .redirect{
  display:block;
  margin-top:12px;
  font-size:.78rem;
  color:var(--gray);
}

.page-redes-sociales .nav-btn.destacado{
  --accent:var(--yellow);
  background:
    linear-gradient(135deg,rgba(243,198,35,.08),rgba(239,109,34,.04)),
    var(--panel);
}

.page-redes-sociales .nav-btn.grupo-facebook{
  --accent:var(--green);
  grid-column:1/-1;
  border-color:rgba(143,199,25,.24);
  background:
    linear-gradient(135deg,rgba(143,199,25,.07),rgba(21,154,160,.035)),
    var(--panel);
}

.page-redes-sociales .badge-grupo{
  display:inline-block;
  width:fit-content;
  margin-bottom:12px;
  padding:6px 10px;
  border-radius:999px;
  background:var(--green);
  color:#050505;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.page-redes-sociales .footer{
  margin-top:60px;
}

.page-redes-sociales .footer p{
  margin:4px 0;
}

.page-redes-sociales .footer a{
  color:var(--teal);
  font-weight:800;
}

@media(max-width:700px){
  .page-redes-sociales{
    padding-top:24px;
  }

  .page-redes-sociales .nav-grid{
    grid-template-columns:1fr;
  }

  .page-redes-sociales .nav-btn.full,
  .page-redes-sociales .nav-btn.grupo-facebook{
    grid-column:auto;
  }

  .page-redes-sociales .menu-superior{
    gap:6px;
  }

  .page-redes-sociales .menu-superior a{
    font-size:.8rem;
    padding:0 10px;
  }
}

/* =========================================================
   BIBLIOTECA MUSICAL — APACIGUA
========================================================= */

.page-biblioteca-musical{
  padding-bottom:140px;
}

.page-biblioteca-musical .contenedor{
  width:min(1120px,calc(100% - 40px));
  margin:0 auto;
}

.page-biblioteca-musical .header{
  padding:28px 0 6px;
}

.page-biblioteca-musical .header .contenedor{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}

.page-biblioteca-musical .header .logo{
  width:min(500px,88vw);
  height:auto;
  display:block;
  margin:0 auto 12px;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.28));
}

.page-biblioteca-musical .header .marca h2{
  font-size:clamp(2rem,5vw,3.4rem);
  line-height:1;
  letter-spacing:-.045em;
  font-weight:900;
  background:linear-gradient(90deg,var(--green),var(--yellow),var(--orange),var(--teal));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-biblioteca-musical .header .marca p{
  margin-top:10px;
  color:var(--muted);
  font-size:1rem;
}

.page-biblioteca-musical .hero{
  text-align:center;
  padding:30px 0 34px;
}

.page-biblioteca-musical .hero h1{
  font-size:clamp(2.7rem,7vw,5.2rem);
  line-height:.96;
  letter-spacing:-.05em;
  font-weight:900;
}

.page-biblioteca-musical .hero h1{
  background:linear-gradient(90deg,var(--teal),var(--green),var(--yellow));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-biblioteca-musical .hero p{
  max-width:760px;
  margin:14px auto 0;
  color:var(--muted);
  font-size:1.05rem;
}

.page-biblioteca-musical .navegacion{
  margin-bottom:24px;
}

.page-biblioteca-musical .boton{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  font-weight:800;
}

.page-biblioteca-musical .boton.secundario{
  border:1px solid rgba(255,255,255,.14);
  color:#e7ebe7;
  background:rgba(255,255,255,.025);
}

.page-biblioteca-musical .boton.secundario:hover{
  border-color:var(--teal);
  color:var(--teal);
}

.page-biblioteca-musical .categorias{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:24px;
}

.page-biblioteca-musical .cat-btn{
  padding:16px 14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:var(--panel);
  color:var(--text);
  font-size:.9rem;
  font-weight:800;
  font-family:Arial,Helvetica,sans-serif;
  cursor:pointer;
  transition:.2s ease;
  text-align:center;
}

.page-biblioteca-musical .cat-btn:hover{
  transform:translateY(-2px);
  border-color:rgba(21,154,160,.38);
}

.page-biblioteca-musical .cat-btn.active{
  background:var(--teal);
  color:#050505;
  border-color:transparent;
}

.page-biblioteca-musical .cat-count{
  display:block;
  font-size:.72rem;
  font-weight:700;
  margin-top:4px;
  opacity:.78;
}

.page-biblioteca-musical .seccion{
  display:none;
}

.page-biblioteca-musical .seccion.visible{
  display:block;
}

.page-biblioteca-musical .search-wrap{
  margin-bottom:14px;
}

.page-biblioteca-musical .search-wrap input{
  width:100%;
  min-height:50px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:var(--panel);
  color:var(--text);
  font-size:1rem;
  outline:none;
}

.page-biblioteca-musical .search-wrap input:focus{
  border-color:var(--teal);
  box-shadow:0 0 0 3px rgba(21,154,160,.10);
}

.page-biblioteca-musical .search-wrap input::placeholder{
  color:#7e8580;
}

.page-biblioteca-musical .count{
  font-size:.82rem;
  color:var(--gray);
  margin-bottom:12px;
}

.page-biblioteca-musical .song-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  text-align:left;
}

.page-biblioteca-musical .song-item{
  background:
    linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.012)),
    var(--panel);
  border:1px solid rgba(255,255,255,.09);
  border-radius:20px;
  padding:14px 16px;
  display:flex;
  align-items:center;
  gap:14px;
  transition:.2s ease;
}

.page-biblioteca-musical .song-item:hover{
  transform:translateY(-2px);
  border-color:rgba(21,154,160,.28);
}

.page-biblioteca-musical .song-item.active{
  border-color:var(--teal);
  background:rgba(21,154,160,.08);
}

.page-biblioteca-musical .play-btn{
  width:42px;
  height:42px;
  border-radius:50%;
  border:none;
  background:var(--teal);
  color:#050505;
  font-size:1rem;
  cursor:pointer;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.page-biblioteca-musical .song-info{
  flex:1;
  min-width:0;
}

.page-biblioteca-musical .song-name{
  font-size:.96rem;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.page-biblioteca-musical .song-author{
  font-size:.8rem;
  color:var(--gray);
  margin-top:2px;
}

.page-biblioteca-musical .no-results{
  color:var(--gray);
  font-size:.95rem;
  margin-top:20px;
  text-align:center;
}

.page-biblioteca-musical .footer{
  text-align:center;
  margin-top:70px;
  padding-top:30px;
  border-top:1px solid rgba(255,255,255,.08);
  color:var(--gray);
  font-size:.9rem;
}

.page-biblioteca-musical .player-bar{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  background:rgba(12,13,13,.97);
  border-top:1px solid rgba(255,255,255,.10);
  box-shadow:0 -12px 35px rgba(0,0,0,.28);
  padding:14px 20px;
  display:none;
  flex-direction:column;
  gap:10px;
  z-index:100;
  backdrop-filter:blur(10px);
}

.page-biblioteca-musical .player-bar.visible{
  display:flex;
}

.page-biblioteca-musical .player-top{
  display:flex;
  align-items:center;
  gap:14px;
  max-width:1120px;
  margin:auto;
  width:100%;
}

.page-biblioteca-musical .player-info{
  flex:1;
  min-width:0;
  text-align:left;
}

.page-biblioteca-musical .player-title{
  font-size:.9rem;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.page-biblioteca-musical .player-sub{
  font-size:.76rem;
  color:var(--gray);
}

.page-biblioteca-musical .ctrl-btn{
  width:40px;
  height:40px;
  border-radius:50%;
  border:none;
  background:var(--teal);
  color:#050505;
  font-size:1.05rem;
  cursor:pointer;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.page-biblioteca-musical .ctrl-btn.secondary{
  background:var(--panel-2);
  border:1px solid rgba(255,255,255,.12);
  color:var(--text);
  font-size:.85rem;
}

.page-biblioteca-musical .progress-wrap{
  max-width:1120px;
  margin:auto;
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
}

.page-biblioteca-musical .progress-wrap input[type=range]{
  flex:1;
  height:4px;
  accent-color:var(--teal);
  cursor:pointer;
}

.page-biblioteca-musical .time-label{
  font-size:.76rem;
  color:var(--gray);
  min-width:36px;
}

@media(max-width:700px){
  .page-biblioteca-musical .contenedor{
    width:min(100% - 24px,1120px);
  }

  .page-biblioteca-musical .header{
    padding-top:20px;
  }
}

@media(max-width:500px){
  .page-biblioteca-musical .categorias{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   ESTÁNDAR DE IDENTIDAD APACIGUA
   Usar estas medidas en páginas migradas con logo + EL MOVIMIENTO
========================================================= */

.page-apacigua-home .logo img,
.page-uda .logo img,
.page-redes-sociales .logo img{
  width:min(500px,88vw);
  margin:0 auto 6px;
}

.page-apacigua-home .marca,
.page-uda .marca,
.page-redes-sociales .marca{
  margin-top:-2px;
  margin-bottom:10px;
}

.page-apacigua-home .descripcion,
.page-uda .descripcion,
.page-redes-sociales .descripcion{
  margin-top:0;
}

/* =========================================================
   AJUSTE FINO PORTADA APACIGUA — ESPACIADO DE IDENTIDAD
   Compensa el espacio transparente interno del PNG del logo.
========================================================= */

.page-apacigua-home{
  padding-top:18px;
}

.page-apacigua-home .logo img{
  margin-top:-10px;
  margin-bottom:-58px;
}

.page-apacigua-home .marca{
  margin-top:0;
  margin-bottom:8px;
}