/* =========================================================
   María Alejandra Flores — La Voz del Orinoco
   Hoja de estilos principal
   ---------------------------------------------------------
   PALETA (cambia aquí los colores de todo el sitio)
   ========================================================= */
:root{
  --verde:        #1C2313;   /* verde oscuro principal */
  --dorado:       #B6842E;   /* dorado / acento */
  --texto:        #F9F9F9;   /* texto claro */
  --blanco:       #FCFCFC;   /* titulares */
  --dorado-claro: #FFE3B1;   /* frase del footer */
  --oliva:        #3A3203;   /* fondo bloque "La Voz del Orinoco" */

  --f-serif:  "Libre Baskerville", Georgia, serif;
  --f-script: "Great Vibes", cursive;
  --f-menu:   "Poppins", sans-serif;
  --f-btn:    "Work Sans", sans-serif;

  --ancho:    1200px;  /* ancho del contenido */
  --ancho-sm: 1140px;  /* ancho del footer */

  /* TAMAÑOS UNIFICADOS DE TEXTO (corrección 2)
     Todos los títulos de sección usan --fs-titulo
     Todos los subtextos / párrafos usan --fs-subtexto */
  --fs-titulo:   32px;
  --lh-titulo:   38px;
  --fs-subtexto: 16px;
  --lh-subtexto: 24px;

  /* Ruta base de las imágenes.
     Para usar imágenes locales: descarga la carpeta wp-content/uploads,
     colócala en assets/ y reemplaza en todo el proyecto
     https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads
     por  assets                                                        */
}

/* ===================== RESET ===================== */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{
  margin:0;
  background:var(--verde);
  color:var(--texto);
  font-family:var(--f-serif);
  font-size:16px;
  line-height:1.5;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,p,ul{margin:0;}
ul{padding-left:1.2em;}

.container{width:100%;max-width:var(--ancho);margin:0 auto;padding:0 24px;}
.container-sm{width:100%;max-width:var(--ancho-sm);margin:0 auto;padding:0 24px;}
.center{text-align:center;}
.center-block{display:flex;justify-content:center;}

.hide-mobile{display:block;}
.show-mobile-only{display:none;}

/* ===================== HEADER ===================== */
.site-header{
  background:var(--verde);
  padding:15px 0;
  position:relative;
  z-index:20;
}
.header-inner{display:flex;justify-content:center;}
.main-nav{width:100%;}
.nav-list{
  list-style:none;margin:0;padding:0;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
}
.nav-list > li{position:relative;}
.nav-item{
  display:block;
  padding:13px 44px;
  font-family:var(--f-serif);
  font-size:16px;font-weight:400;
  text-transform:uppercase;
  color:var(--texto);
  position:relative;
  transition:color .3s;
  white-space:nowrap;
}
.nav-item::after{
  content:"";
  position:absolute;left:44px;right:44px;bottom:6px;
  height:2px;background:var(--dorado);
  transform:scaleX(0);transform-origin:center;
  transition:transform .3s;
}
.nav-item:hover,.nav-item.is-active{color:var(--dorado);}
.nav-item:hover::after,.nav-item.is-active::after{transform:scaleX(1);}

.caret{
  display:inline-block;width:0;height:0;margin-left:6px;vertical-align:middle;
  border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid currentColor;
}

/* submenús */
.submenu{
  list-style:none;margin:0;padding:0;
  position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(8px);
  min-width:260px;
  background:var(--dorado);
  opacity:0;visibility:hidden;
  transition:opacity .25s, transform .25s, visibility .25s;
  z-index:30;
}
.has-submenu:hover .submenu,
.has-submenu.open .submenu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.submenu a{
  display:block;padding:12px 20px;
  font-family:var(--f-menu);font-weight:500;font-size:15px;
  color:var(--texto);
  transition:background .25s,color .25s;
}
.submenu a:hover{background:var(--dorado);color:var(--verde);}

/* botón hamburguesa (solo móvil) */
.nav-toggle{
  display:none;
  margin-left:auto;
  background:none;border:0;cursor:pointer;padding:10px;
}
.nav-toggle span{
  display:block;width:26px;height:2px;margin:5px 0;background:var(--dorado);
  transition:transform .3s,opacity .3s;
}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.open span:nth-child(2){opacity:0;}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ===================== BOTÓN ===================== */
.btn{
  display:inline-block;
  background:transparent;
  border:2px solid var(--dorado);
  border-radius:8px;
  padding:16px 32px;
  font-family:var(--f-btn);
  font-size:18px;font-weight:500;
  color:var(--texto);
  text-align:center;
  transition:transform .3s, background .3s, color .3s;
}
.btn:hover{transform:translateY(-5px);background:var(--dorado);color:var(--verde);}
.btn-inner{display:flex;flex-direction:row-reverse;align-items:center;gap:10px;justify-content:center;}
.btn-icon svg{width:18px;height:18px;fill:currentColor;display:block;}

/* ===================== 1. HERO ===================== */
.hero{
  background-image:url("https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads/2026/07/Banner_Principal-1.jpg");
  background-size:cover;
  background-position:center top;
  background-repeat:no-repeat;
  padding:0 24px;
}
.hero-inner{
  display:flex;flex-direction:row;gap:20px;
  padding:150px 0;
  min-height:751px;
}
.hero-copy{
  display:flex;flex-direction:column;gap:20px;
  width:504px;max-width:100%;
}
.hero-name{
  font-family:var(--f-serif);
  font-size:58px;line-height:58px;font-weight:400;
  color:var(--blanco);
}
.hero-surname{
  font-family:var(--f-script);
  font-size:95px;line-height:95px;font-weight:400;
  color:var(--dorado);
  margin-top:14px;   /* corrección 1: aire real entre "Alejandra" y el rasgo de la F */
}
.hero-kicker{
  font-family:var(--f-serif);
  font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--dorado);
}
.divider{height:1px;background:var(--dorado);border:0;}
.divider-hero{width:302px;max-width:100%;}
.hero-tagline{
  font-family:var(--f-serif);font-style:italic;
  font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--dorado);
}
.hero-text{font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--texto);}
.hero-cta{display:flex;justify-content:flex-start;}

/* ============ 2. BLOQUE "JESÚS SOTO" ============ */
.soto-band{
  min-height:576px;
  background-image:url("https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads/2026/07/segunda_xl75m8xl75m8xl75.jpg");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.soto-band-mobile img{width:100%;}

/* ============ 3. MENSAJE ECOLÓGICO ============ */
.eco{
  background:var(--verde);
  margin-top:-17px;
  padding:0 24px;
  position:relative;
}
.eco-inner{
  display:flex;flex-direction:column;align-items:center;gap:32px;
  padding:72px 0;
}
.eco-title{
  font-family:var(--f-serif);
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);font-weight:400;
  color:var(--blanco);text-align:center;
}
.eco-text{font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);text-align:center;color:var(--texto);}

/* ============ 4. LA VOZ DEL ORINOCO ============ */
.voz{
  background:var(--oliva);
  min-height:738px;
  padding:0 24px;
  display:flex;align-items:center;
}
.voz-inner{
  width:100%;max-width:1000px;margin:0 auto;
  display:flex;gap:20px;justify-content:space-between;align-items:center;
  padding:72px 0;
}
/* corrección 3: imagen más pequeña y animación más visible */
.voz-media{width:290px;max-width:100%;display:flex;flex-direction:column;justify-content:flex-start;gap:32px;}
.voz-media img{width:100%;}
.voz-media .anim.is-visible{animation-duration:1.6s;animation-timing-function:cubic-bezier(.16,.84,.34,1);}
.voz-copy{width:379px;max-width:100%;display:flex;flex-direction:column;justify-content:center;gap:32px;}
.divider-voz{width:228px;max-width:100%;margin-top:-25px;}
.voz-copy .rich{margin-top:-23px;}

.h-gold{
  font-family:var(--f-serif);
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);font-weight:400;
  color:var(--dorado);
}
.section-title{
  font-family:var(--f-serif);
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);font-weight:400;
  color:var(--blanco);text-align:center;
}

/* texto enriquecido genérico */
.rich{font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--texto);}
.rich p{margin:0 0 1em;}
.rich p:last-child{margin-bottom:0;}
.rich ul{margin:0;padding-left:1.2em;}
.rich li{margin-bottom:.6em;}
.rich li p{margin:0;}
.rich strong{font-weight:700;}

/* ============ 5. BIOGRAFÍA ============ */
.bio{
  background-color:var(--verde);
  background-image:url("https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads/2026/07/img-9.png");
  background-size:cover;background-position:center;background-repeat:no-repeat;
  padding:0 24px;
}
.bio-inner{display:flex;gap:20px;padding:72px 0;}
.bio-col{flex:1 1 0;display:flex;flex-direction:column;gap:32px;min-width:0;}
.bio-head{display:flex;gap:20px;padding:10px 0;align-items:center;}
.bio-sun{width:88.5px;flex:0 0 88.5px;}
.bio-head-title{flex:1 1 auto;display:flex;align-items:center;}
.bio-gallery{gap:0;}
.bio-row{display:flex;gap:20px;padding:10px 0;}
.bio-row-center{justify-content:center;}
.bio-cell{flex:0 0 285px;max-width:285px;}
.bio-cell-wide{flex:0 0 295px;max-width:295px;}
.bio-cell img{width:100%;}

/* ============ 6. TRAYECTORIA ============ */
.tray{
  background-image:url("https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads/2026/07/img-13.png");
  background-size:cover;background-position:center;background-repeat:no-repeat;
  padding:0;
}
.tray-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  padding-top:70px;padding-bottom:70px;
}
.tray-col{display:flex;flex-direction:column;gap:32px;padding-top:48px;padding-inline:8px;}
.tray-img{display:flex;justify-content:center;}
.tray-img img{width:318px;}

/* ============ 7. GÉNEROS MUSICALES ============ */
.generos{background:var(--verde);padding:72px 0;}
.generos-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  padding:10px;margin-top:32px;
}
.genero-card{
  background:var(--card-bg);
  border:1px solid var(--dorado);
  border-radius:13px;
  padding:11px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;
  text-align:center;
  transition:transform .35s, box-shadow .35s;
}
.genero-card:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(0,0,0,.35);}
.genero-img{width:205px;max-width:100%;display:flex;justify-content:center;align-items:center;}
.genero-img img{width:100%;}
.genero-img img.narrow{width:169px;}
.genero-title{
  font-family:var(--f-serif);
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);font-weight:400;color:var(--texto);
  hyphens:manual;overflow-wrap:break-word;max-width:100%;
}
.genero-text{font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--texto);}

/* ============ 8. BANDA FRASE ============ */
.frase-band img{width:100%;}

/* ============ 9. GALERÍA + VIDEOS ============ */
.galeria{
  background-color:var(--verde);
  background-image:url("https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads/2026/07/img-9.png");
  background-size:cover;background-position:center;background-repeat:no-repeat;
  padding:100px 0 72px;
}
.galeria > .container{display:flex;flex-direction:column;gap:32px;}
.videos-wrap{padding:0 100px;margin:25px 0;}
.videos-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.video-embed{position:relative;padding-top:56.25%;}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

/* masonry en columnas */
.masonry{column-count:3;column-gap:10px;}
.masonry-item{
  display:block;break-inside:avoid;margin-bottom:10px;position:relative;overflow:hidden;
}
.masonry-item img{width:100%;display:block;transition:transform .4s;}
.masonry-item::after{
  content:"";position:absolute;inset:0;background:rgba(28,35,19,.55);
  opacity:0;transition:opacity .35s;
}
.masonry-item:hover::after{opacity:1;}
.masonry-item:hover img{transform:scale(1.04);}

.montana img{width:360px;}

/* página galeria.html */
.pagina-galeria{padding:72px 0;min-height:70vh;}
.pagina-galeria .section-title{margin-bottom:8px;}

/* ===== páginas internas (proyectos.html / musica.html) ===== */
.pagina{
  background-color:var(--verde);
  background-image:url("https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads/2026/07/img-9.png");
  background-size:cover;background-position:center;background-repeat:no-repeat;
  padding:72px 0;min-height:70vh;
}
.pagina .container{display:flex;flex-direction:column;gap:40px;}

/* título con filetes dorados a los lados */
.titulo-linea{
  display:flex;align-items:center;gap:18px;
  font-family:var(--f-serif);
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);font-weight:400;
  color:var(--dorado);text-align:center;justify-content:center;
}
.titulo-linea::before,.titulo-linea::after{
  content:"";height:1px;background:var(--dorado);flex:1 1 auto;max-width:240px;
}
.titulo-linea .rombo{color:var(--dorado);font-size:.6em;}

/* subtítulos interiores (Créditos, Ficha Técnica) */
.subtitulo{
  font-family:var(--f-serif);font-style:italic;font-weight:700;
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);
  color:var(--texto);text-align:center;
}
.subtitulo-nota{
  font-family:var(--f-serif);font-style:italic;font-weight:400;
  font-size:var(--fs-subtexto);color:var(--texto);
}

/* listas con rombo dorado */
.lista-dorada{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px;}
.lista-dorada li{
  position:relative;padding-left:32px;
  font-family:var(--f-serif);
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);
  color:var(--dorado);
}
.lista-dorada li::before{
  content:"\2756";position:absolute;left:0;top:0;
  font-size:.55em;line-height:calc(var(--lh-titulo) * 1.1);color:var(--dorado);
}
.lista-datos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;
  font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--texto);}

.texto-centrado{font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--texto);text-align:center;max-width:720px;margin:0 auto;}

/* bloque de imagen de la página */
.bloque-img{display:flex;justify-content:center;}
.bloque-img img{max-width:560px;width:100%;border:1px solid var(--dorado);border-radius:6px;}
.bloque-img-doble{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;}
.bloque-img-doble img{max-width:440px;width:100%;border:1px solid var(--dorado);border-radius:6px;}

/* marcador temporal mientras faltan las imágenes del PDF */
.falta-img{
  border:1px dashed var(--dorado);border-radius:6px;
  padding:40px 24px;text-align:center;color:var(--dorado);
  font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);
  max-width:560px;margin:0 auto;width:100%;
}

.montana-linea{display:flex;justify-content:center;}
.montana-linea img{width:360px;}

@media (max-width:767px){
  .titulo-linea::before,.titulo-linea::after{max-width:40px;}
  .lista-dorada li{padding-left:24px;}
}

/* ===================== FOOTER ===================== */
.footer-main{
  background-color:var(--verde);
  background-image:url("https://lawngreen-dotterel-972565.hostingersite.com/wp-content/uploads/2026/07/img-19.png");
  background-size:cover;background-position:center;background-repeat:no-repeat;
  padding:80px 0 30px;
}
.footer-grid{display:flex;align-items:center;gap:20px;}
.footer-left,.footer-right{flex:1 1 50%;min-width:0;}
.footer-right{display:flex;flex-direction:column;gap:0;}
.footer-left{display:flex;flex-direction:column;gap:14px;}
.footer-logo img{width:30%;max-width:139px;}
.footer-quote{
  font-family:var(--f-serif);font-style:italic;font-weight:400;
  font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--dorado-claro);
  margin-top:-5px;
}
.footer-follow{
  font-family:var(--f-serif);font-size:var(--fs-titulo);line-height:var(--lh-titulo);font-weight:700;
  color:var(--texto);text-align:right;margin-bottom:4px;
}
.social{display:flex;justify-content:flex-end;gap:5px;}
.social-icon{
  width:40px;height:40px;
  display:flex;align-items:center;justify-content:center;
  color:var(--dorado);
  transition:transform .3s;
}
.social-icon svg{width:22px;height:22px;fill:currentColor;}
.social-icon:hover{animation:pulse .6s;}
@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.15)}100%{transform:scale(1)}}
.footer-btn-wrap{display:flex;justify-content:flex-end;margin-top:56px;}

.footer-bottom{background:var(--verde);padding:40px 0;}
.footer-copy{
  font-family:var(--f-serif);font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);font-weight:700;
  color:var(--texto);text-align:center;
}

/* ===================== ANIMACIONES ===================== */
.anim{opacity:0;}
.anim.is-visible{opacity:1;animation-duration:1s;animation-fill-mode:both;}
.anim.is-visible[data-anim="fadeInRight"]{animation-name:fadeInRight;}
.anim.is-visible[data-anim="fadeInLeft"] {animation-name:fadeInLeft;}
.anim.is-visible[data-anim="fadeInUp"]   {animation-name:fadeInUp;}
.anim.is-visible[data-anim="zoomIn"]     {animation-name:zoomIn;}

@keyframes fadeInRight{from{opacity:0;transform:translate3d(100%,0,0)}to{opacity:1;transform:none}}
@keyframes fadeInLeft {from{opacity:0;transform:translate3d(-100%,0,0)}to{opacity:1;transform:none}}
@keyframes fadeInUp   {from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}
@keyframes zoomIn     {from{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}to{opacity:1;transform:none}}

@media (prefers-reduced-motion: reduce){
  .anim{opacity:1;animation:none!important;}
  html{scroll-behavior:auto;}
}

/* ===================== LIGHTBOX ===================== */
.lightbox{
  position:fixed;inset:0;z-index:100;
  background:rgba(10,12,8,.94);
  display:flex;align-items:center;justify-content:center;
}
.lightbox[hidden]{display:none;}
.lightbox img{max-width:88vw;max-height:88vh;object-fit:contain;}
.lb-close,.lb-prev,.lb-next{
  position:absolute;background:none;border:0;color:var(--dorado);
  font-size:38px;line-height:1;cursor:pointer;padding:12px;
}
.lb-close{top:10px;right:18px;font-size:46px;}
.lb-prev{left:12px;top:50%;transform:translateY(-50%);}
.lb-next{right:12px;top:50%;transform:translateY(-50%);}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1024px){
  :root{--ancho:1024px;--ancho-sm:1024px;--fs-titulo:28px;--lh-titulo:34px;}
  .nav-item{padding:13px 20px;}
  .hero-inner{padding:110px 0;min-height:640px;}
  .hero-name{font-size:46px;line-height:48px;}
  .hero-surname{font-size:76px;line-height:76px;margin-top:11px;}
  .bio-inner{flex-direction:column;}
  .bio-col{width:100%;}
  .tray-grid{grid-template-columns:repeat(2,1fr);}
  .generos-grid{grid-template-columns:repeat(2,1fr);}
  .videos-wrap{padding:0 20px;}
  .masonry{column-count:2;}
  
}

@media (max-width:767px){
  :root{--ancho:767px;--ancho-sm:767px;--fs-titulo:24px;--lh-titulo:30px;}
  .hide-mobile{display:none!important;}
  .show-mobile-only{display:block!important;}

  /* menú móvil */
  .header-inner{justify-content:flex-end;}
  .nav-toggle{display:block;}
  .nav-list{
    display:none;width:100%;flex-direction:column;align-items:stretch;
    background:var(--dorado);margin-top:10px;
  }
  .nav-list.open{display:flex;}
  .nav-item{padding:14px 18px;color:var(--verde);text-align:left;}
  .nav-item::after{display:none;}
  .nav-item:hover,.nav-item.is-active{color:var(--verde);background:rgba(28,35,19,.12);}
  .submenu{
    position:static;transform:none;opacity:1;visibility:visible;
    display:none;background:rgba(28,35,19,.12);min-width:0;
  }
  .has-submenu.open .submenu{display:block;transform:none;}
  .submenu a{color:var(--verde);padding:12px 32px;}

  .hero{background-position:center;}
  .hero-inner{padding:70px 0;min-height:auto;}
  .hero-copy{width:100%;}
  .hero-name{font-size:36px;line-height:38px;}
  .hero-surname{font-size:60px;line-height:60px;margin-top:9px;}
  

  .eco-inner{padding:48px 0;gap:20px;}

  .voz{min-height:auto;}
  .voz-inner{flex-direction:column;padding:48px 0;}
  .voz-media,.voz-copy{width:100%;}
  .voz-copy .rich{margin-top:0;}
  .divider-voz{margin-top:0;}

  .bio-inner{padding:48px 0;}
  .bio-head{flex-direction:row;align-items:center;}
  .bio-row{flex-direction:column;align-items:center;}
  .bio-cell,.bio-cell-wide{flex:0 0 auto;max-width:100%;width:100%;}

  .tray-grid{grid-template-columns:1fr;padding-top:48px;padding-bottom:48px;}
  .tray-col{padding-top:24px;}
  .tray-img img{width:100%;max-width:318px;}

  .generos{padding:48px 0;}
  .generos-grid{grid-template-columns:1fr;padding:0;}

  .galeria{padding:56px 0 48px;}
  .videos-wrap{padding:0;}
  .videos-grid{grid-template-columns:1fr;}
  .masonry{column-count:1;}
  .montana img{width:100%;max-width:360px;}

  .footer-main{padding:40px 0;}
  .footer-grid{flex-direction:column;align-items:stretch;}
  .footer-logo img{width:60%;margin:0 auto;}
  .footer-quote{text-align:center;padding-left:7px;margin-top:-8px;}
  .footer-follow{text-align:center;margin-bottom:-11px;}
  .social{justify-content:center;}
  .footer-btn-wrap{justify-content:center;margin-top:20px;}
  .footer-bottom{padding:20px 0;}
  
}

/* ===== páginas internas nuevas ===== */
.pagina-oliva{background-color:var(--oliva);background-image:none;}

.sol-chico{width:110px;}

/* lista de músicos en columnas */
.lista-nombres{
  list-style:none;margin:0;padding:0;
  column-count:3;column-gap:32px;
  font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);color:var(--texto);
}
.lista-nombres li{break-inside:avoid;padding-left:20px;position:relative;margin-bottom:6px;}
.lista-nombres li::before{content:"\2756";position:absolute;left:0;color:var(--dorado);font-size:.7em;}

/* fila de fotos */
.galeria-fila{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;}
.galeria-fila a{flex:0 1 300px;max-width:300px;}
.galeria-fila img{width:100%;border:1px solid var(--dorado);border-radius:6px;}

/* bloque del álbum */
.album{display:flex;gap:40px;align-items:center;flex-wrap:wrap;justify-content:center;}
.album-portada{flex:0 1 360px;max-width:360px;}
.album-portada img{width:100%;border:1px solid var(--dorado);border-radius:6px;}
.album-datos{flex:1 1 380px;min-width:280px;display:flex;flex-direction:column;gap:16px;}
.album-titulo{
  font-family:var(--f-serif);font-style:italic;font-weight:700;
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);color:#fff;
}
.album-sub{
  font-family:var(--f-serif);font-weight:700;
  font-size:var(--fs-titulo);line-height:var(--lh-titulo);color:#fff;
}
.lista-tracks li{font-size:var(--fs-subtexto);line-height:var(--lh-subtexto);}
.lista-tracks li::before{line-height:calc(var(--lh-subtexto) * 1.1);}

/* trabajos discográficos */
.trabajos-grid{display:flex;gap:40px;align-items:center;flex-wrap:wrap;}
.trabajos-media{flex:0 1 340px;max-width:340px;}
.trabajos-media img{width:100%;}
.trabajos-texto{flex:1 1 420px;min-width:280px;}

@media (max-width:1024px){ .lista-nombres{column-count:2;} }
@media (max-width:767px){
  .lista-nombres{column-count:1;}
  .album,.trabajos-grid{gap:24px;}
  .galeria-fila a{flex:0 1 100%;max-width:100%;}
}