/* BOTONES */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);font-family:var(--font-family);font-weight:700;line-height:1;border-radius:var(--radius-xl);cursor:pointer;border:none;transition:transform var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast);text-decoration:none;white-space:nowrap}
.btn:hover{transform:scale(1.03)}.btn:active{transform:scale(.98)}
.btn:focus-visible{outline:3px solid var(--color-primary);outline-offset:3px}
.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}
.btn--sm{padding:var(--space-2) var(--space-5);font-size:var(--font-size-sm)}
.btn--lg{padding:var(--space-4) var(--space-10);font-size:var(--font-size-lg);border-radius:var(--radius-2xl)}
.btn--full{width:100%}
.btn--primary{background:var(--color-primary);color:#fff;box-shadow:0 4px 20px var(--color-primary-20)}
.btn--primary:hover{background:var(--color-primary-light);box-shadow:var(--shadow-primary)}
.btn--accent{background:var(--color-accent);color:#fff}
.btn--accent:hover{background:var(--color-accent-light)}
.btn--ghost{background:rgba(255,255,255,.10);color:#fff;border:2px solid rgba(255,255,255,.30);backdrop-filter:blur(8px)}
.btn--ghost:hover{background:rgba(255,255,255,.20)}

/* ICON BUTTON */
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius-full);background:var(--color-primary-10);color:var(--color-primary);transition:background var(--transition-fast),color var(--transition-fast);border:none;cursor:pointer}
.icon-btn:hover{background:var(--color-primary);color:#fff}

/* ══════════════════════════════════════
   SPRITE DE INSTRUMENTOS
   Imagen: 1728×623 (white) / 2000×721 (dark)
   8 íconos: 4 columnas × 2 filas
   Cada celda: ~432×311 (white) / ~500×360 (dark)
   ══════════════════════════════════════ */
.instrumento-card{
  position:relative;
  background:var(--color-surface);
  border-radius:var(--radius-xl);
  border:2px solid var(--color-primary);
  overflow:hidden;
  aspect-ratio:16/9;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:var(--space-3);
  padding:var(--space-4);
  transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base);
  cursor:default;
}
.instrumento-card:nth-child(even){border-color:var(--color-accent)}
.instrumento-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}

/* Sprite: cada ícono se muestra con background-position */
.instrumento-icon{
  width:80px;
  height:56px;
  background-image:url('/images/iconos-instrumentos-white.png');
  background-repeat:no-repeat;
  background-size:400% 200%; /* 4 cols × 2 rows */
  flex-shrink:0;
}
/* Dark mode usa el sprite oscuro */
.dark .instrumento-icon{
  background-image:url('/images/iconos-instrumentos-dark.png');
}

/* Posiciones: fila 1 col 1=guitarra criolla, col 2=piano, col 3=guitarra eléctrica, col 4=batería */
/*             fila 2 col 1=violonchelo, col 2=ukelele, col 3=violín, col 4=bajo */
.instrumento-icon--guitarra-criolla { background-position: 0% 0%; }
.instrumento-icon--piano            { background-position: 33.33% 0%; }
.instrumento-icon--guitarra-elect   { background-position: 66.66% 0%; }
.instrumento-icon--bateria          { background-position: 100% 0%; }
.instrumento-icon--violonchelo      { background-position: 0% 100%; }
.instrumento-icon--ukelele          { background-position: 33.33% 100%; }
.instrumento-icon--violin           { background-position: 66.66% 100%; }
.instrumento-icon--bajo             { background-position: 100% 100%; }

.instrumento-name{
  font-size:var(--font-size-sm);
  font-weight:700;
  color:var(--color-text);
  text-align:center;
  line-height:1.2;
}

/* ══════════════════════════════════════
   CARDS DE MÓDULOS (Iniciación / Composición)
   ══════════════════════════════════════ */
.modulo-card{
  background:var(--color-surface);
  border-radius:var(--radius-2xl);
  padding:var(--space-8);
  display:flex;
  align-items:center;
  gap:var(--space-8);
  border:1.5px solid #1a1a2e;
  box-shadow:var(--shadow-sm);
  transition:transform var(--transition-base),box-shadow var(--transition-base);
}
.dark .modulo-card{background:#2d1a4a;border-color:rgba(255,255,255,.20)}
.modulo-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.modulo-card__content{flex:1}
.modulo-card__title{font-size:var(--font-size-2xl);font-weight:900;color:var(--color-primary);margin-bottom:var(--space-4)}
.modulo-card__list{display:flex;flex-direction:column;gap:var(--space-2)}
.modulo-card__item{display:flex;align-items:center;gap:var(--space-3);font-size:var(--font-size-sm);color:var(--color-text-muted)}
.modulo-card__item::before{content:'';width:.4rem;height:.4rem;border-radius:50%;background:var(--color-accent);flex-shrink:0}
.modulo-card__action{flex-shrink:0}
@media(max-width:640px){
  .modulo-card{flex-direction:column;text-align:center}
  .modulo-card__list{align-items:center}
  .modulo-card__item{justify-content:center}
}

/* MODAL */
dialog.modal{border:none;border-radius:var(--radius-2xl);padding:0;max-width:500px;width:calc(100vw - 2rem);box-shadow:var(--shadow-xl);background:var(--color-surface);color:var(--color-text);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;opacity:0;animation:none}
dialog.modal[open]{animation:modal-in 0.5s ease forwards}
dialog.modal::backdrop{background:rgba(0,0,0,.65);backdrop-filter:blur(6px);animation:backdrop-in 0.5s ease forwards}
@keyframes modal-in{from{opacity:0;transform:translate(-50%,-50%) scale(0.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes backdrop-in{from{opacity:0}to{opacity:1}}
.modal__inner{padding:var(--space-8)}
.modal__header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-6)}
.modal__title{font-size:var(--font-size-2xl);font-weight:900}
.modal__desc{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-top:var(--space-1)}
.modal__close{flex-shrink:0;background:var(--color-bg-muted);color:var(--color-text-muted)}

/* FORM */
.form{display:flex;flex-direction:column;gap:var(--space-4)}
.form__group{display:flex;flex-direction:column;gap:var(--space-1)}
.form__label{font-size:var(--font-size-sm);font-weight:700;color:var(--color-text)}
.form__required{color:#ef4444}
.form__input,.form__select,.form__textarea{width:100%;padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);border:1.5px solid var(--color-border-strong);background:var(--color-bg);color:var(--color-text);font-family:var(--font-family);font-size:var(--font-size-sm);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none}
.form__input:focus,.form__select:focus,.form__textarea:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-10)}
.form__input.is-invalid{border-color:#ef4444;box-shadow:0 0 0 3px rgba(239,68,68,.1)}
.form__textarea{resize:vertical;min-height:90px}
.form__select{appearance:none;cursor:pointer}
.form__error{color:#ef4444;font-size:var(--font-size-xs);font-weight:600}
.form__spinner{animation:spin .8s linear infinite}

/* CHECKLIST */
.checklist{display:flex;flex-direction:column;gap:var(--space-3)}
.checklist__item{display:flex;align-items:center;gap:var(--space-3);font-weight:600;font-size:var(--font-size-sm)}
.checklist__icon{width:1.75rem;height:1.75rem;border-radius:var(--radius-full);background:var(--color-primary-10);color:var(--color-primary);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.checklist__icon .material-symbols-outlined{font-size:.9rem}

/* MODALITY CARDS */
.modality-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
.modality-card{background:rgba(255,255,255,.12);padding:var(--space-5);border-radius:var(--radius-xl);border:1px solid rgba(255,255,255,.15)}
.modality-card .material-symbols-outlined{color:#f5a623;display:block;margin-bottom:var(--space-2)}
.modality-card h3,.modality-card h4{font-weight:700;margin-bottom:var(--space-1);color:#fff}
.modality-card p{font-size:var(--font-size-sm);color:rgba(255,255,255,.80)}
.modality-grid--card{background:var(--color-surface);border:1.5px solid var(--color-primary)}
.modality-grid--card .modality-card{background:transparent;border:none;padding:var(--space-4)}
.modality-grid--card .modality-card .material-symbols-outlined{color:var(--color-accent)}
.modality-grid--card .modality-card h3,.modality-grid--card .modality-card h4{color:var(--color-primary)}
.modality-grid--card .modality-card p{color:var(--color-text-muted)}
.dark .modality-grid--card{background:#2d1a4a;border-color:rgba(255,255,255,.20)}
.dark .modality-grid--card .modality-card h3,.dark .modality-grid--card .modality-card h4{color:#fff}

/* INFO ITEMS */
.info-item{display:flex;align-items:flex-start;gap:var(--space-4)}
.info-item__icon{padding:var(--space-3);border-radius:var(--radius-lg);flex-shrink:0}
.info-item__icon--primary{background:var(--color-primary-10);color:var(--color-primary)}
.info-item__icon--accent{background:var(--color-accent-10);color:var(--color-accent)}
.info-item__title{font-size:var(--font-size-xl);font-weight:700;margin-bottom:var(--space-2)}
.info-item__text{color:var(--color-text-muted);line-height:1.6}

/* ══════════════════════════════════════
   SOCIAL LINKS — Sprite de íconos
   Imagen: 1817×592px, 4 íconos en fila
   Cada ícono: ~454×592px
   ══════════════════════════════════════ */
.social-links{display:flex;gap:var(--space-4);padding-top:var(--space-6);border-top:1px solid var(--color-border);flex-wrap:wrap;align-items:center}
.social-link{
  width:64px;
  height:64px;
  border-radius:var(--radius-full);
  overflow:hidden;
  display:block;
  transition:transform var(--transition-fast),filter var(--transition-fast);
  text-decoration:none;
  background-image:url('/images/icons-social-media.png');
  background-repeat:no-repeat;
  background-size:400% 100%; /* 4 íconos en 1 fila */
  flex-shrink:0;
}
.social-link:hover{transform:scale(1.1);filter:brightness(1.15)}
/* Posiciones de cada red social en el sprite */
.social-link--whatsapp  { background-position: 0% 0%; }
.social-link--instagram { background-position: 33.33% 0%; }
.social-link--facebook  { background-position: 66.66% 0%; }
.social-link--email     { background-position: 100% 0%; }

/* TICKER VALORES */
@keyframes ticker{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.valores-ticker-wrap{overflow:hidden;position:relative;padding-block:var(--space-2);mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0%,black 8%,black 92%,transparent 100%)}
.valores-ticker{display:flex;gap:var(--space-4);width:max-content;animation:ticker 28s linear infinite}
.valores-ticker:hover{animation-play-state:paused}
.valor-chip{display:inline-flex;align-items:center;gap:var(--space-3);background:var(--color-surface);border:1.5px solid var(--color-border-strong);border-radius:var(--radius-full);padding:var(--space-3) var(--space-6);white-space:nowrap;font-size:var(--font-size-sm);font-weight:600;color:var(--color-text);box-shadow:var(--shadow-sm)}
.valor-chip__dot{width:.5rem;height:.5rem;border-radius:var(--radius-full);background:var(--color-primary);flex-shrink:0}

/* MVV CARDS */
.mvv-layout{display:grid;grid-template-columns:1fr;gap:var(--space-8);margin-bottom:var(--space-16)}
@media(min-width:768px){.mvv-layout{grid-template-columns:1fr 1fr}}
.mvv-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);border-radius:var(--radius-2xl);padding:var(--space-8)}
.mvv-card__icon{font-size:2rem;margin-bottom:var(--space-4);color:var(--color-accent)}
.mvv-card__title{font-size:var(--font-size-xl);font-weight:900;margin-bottom:var(--space-3);color:#fff}
.mvv-card__text{font-size:var(--font-size-sm);color:rgba(255,255,255,.75);line-height:1.75}

/* GALERÍA CASONA */
.galeria-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4)}
@media(min-width:640px){.galeria-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:1024px){.galeria-grid{grid-template-columns:repeat(4,1fr)}}
.galeria-item{border-radius:var(--radius-xl);overflow:hidden;aspect-ratio:4/3;background:var(--color-bg-muted)}
.galeria-item img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow)}
.galeria-item:hover img{transform:scale(1.05)}

/* INFANCIAS CARDS */
.infancia-card{background:var(--color-surface);border-radius:var(--radius-2xl);border:1px solid var(--color-border);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform var(--transition-base),box-shadow var(--transition-base)}
.infancia-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.infancia-card__img{width:100%;height:200px;object-fit:cover}
.infancia-card__header{background:var(--color-primary);color:#fff;padding:var(--space-5) var(--space-6)}
.infancia-card--accent .infancia-card__header{background:var(--color-accent)}
.infancia-card--dark .infancia-card__header{background:#1e1330}
.infancia-card__title{font-size:var(--font-size-lg);font-weight:900}
.infancia-card__age{font-size:var(--font-size-xs);opacity:.80;margin-top:var(--space-1)}
.infancia-card__body{padding:var(--space-5) var(--space-6)}
.infancia-card__text{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:1.65}

/* FOOTER */
.footer{background:#0f0a1a;color:#fff;padding:var(--space-12) var(--container-pad)}
.footer__inner{display:flex;flex-direction:column;align-items:center;gap:var(--space-8);text-align:center}
@media(min-width:768px){.footer__inner{flex-direction:row;justify-content:space-between;text-align:left}}
.footer__brand{display:flex;align-items:center;gap:var(--space-3)}
.footer__logo{height:44px;width:auto}
.footer__copy{color:rgba(255,255,255,.40);font-size:var(--font-size-sm)}
.footer__links{display:flex;gap:var(--space-6)}
.footer__link{font-size:var(--font-size-sm);font-weight:600;color:rgba(255,255,255,.60);transition:color var(--transition-fast)}
.footer__link:hover{color:var(--color-accent)}

/* GRID FOTOS TEATRO */
.teatro-photos-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2);border-radius:var(--radius-2xl);overflow:hidden}
.teatro-photos-grid img:first-child{grid-column:1 / -1;aspect-ratio:32/9;width:100%;height:100%;object-fit:cover;display:block}
.teatro-photos-grid img:not(:first-child){aspect-ratio:2/1;width:100%;height:100%;object-fit:cover;display:block}

/* INSTRUMENTOS SIN ÍCONO — solo texto con hover naranja */
.instrumento-card--text{display:flex;align-items:center;justify-content:center;min-height:90px;cursor:default;border-radius:var(--radius-xl);border:1.5px solid var(--color-primary);background:var(--color-surface);transition:background var(--transition-fast),border-color var(--transition-fast)}
.instrumento-card--text:nth-child(even){border-color:var(--color-accent)}
.instrumento-card--text:hover,.instrumento-card--text:focus-within{background:var(--color-accent);border-color:var(--color-accent)}
.instrumento-card--text:hover .instrumento-name,.instrumento-card--text:focus-within .instrumento-name{color:#fff}
.instrumento-card--text .instrumento-name{font-size:var(--font-size-base);font-weight:700;text-align:center;transition:color var(--transition-fast)}

/* INFANCIAS LAYOUT NUEVO (texto izquierda + mosaico derecha) */
.infancias-layout{display:grid;grid-template-columns:1fr;gap:var(--space-10)}
@media(min-width:900px){.infancias-layout{grid-template-columns:1fr 1fr;align-items:stretch}}
.infancias-cards{display:flex;flex-direction:column;gap:var(--space-5)}
.infancia-text-card{background:var(--color-surface);border-radius:var(--radius-2xl);border:1px solid var(--color-border);overflow:hidden;box-shadow:var(--shadow-sm);transition:transform var(--transition-base),box-shadow var(--transition-base)}
.dark .infancia-text-card{border-color:rgba(255,255,255,.15);box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.infancia-text-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.infancia-text-card__header{background:var(--color-primary);color:#fff;padding:var(--space-4) var(--space-6)}
.infancia-text-card--accent .infancia-text-card__header{background:var(--color-accent)}
.infancia-text-card--dark .infancia-text-card__header{background:#3d1f6e}
.dark .infancia-text-card--dark .infancia-text-card__header{background:#5a2fa0}
.infancia-text-card__title{font-size:var(--font-size-lg);font-weight:900}
.infancia-text-card__age{font-size:var(--font-size-xs);opacity:.80;margin-top:var(--space-1)}
.infancia-text-card__text{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:1.65;padding:var(--space-4) var(--space-6)}
.infancias-mosaic{display:flex;flex-direction:column;gap:var(--space-3);height:100%}
.infancias-mosaic__top,.infancias-mosaic__bottom{display:grid;gap:var(--space-3);flex:1}
.infancias-mosaic__top{grid-template-columns:1fr 1fr}
.infancias-mosaic__bottom{grid-template-columns:1fr 1fr 1fr}
.infancias-mosaic img{width:100%;height:100%;min-height:120px;border-radius:var(--radius-xl);object-fit:cover;display:block}

/* CONTACTO REDES TEXTO */
.social-text-links{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-6)}
.social-text-item{font-size:var(--font-size-sm);color:var(--color-text-muted)}
.social-text-item strong{color:var(--color-text);margin-right:var(--space-2)}
.social-text-item a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}
.social-text-item a:hover{color:var(--color-accent);text-decoration:underline}

/* MÓDULOS MUSICALES — 2 columnas en desktop */
@media(min-width:640px){.modulos-grid{grid-template-columns:1fr 1fr !important}}

/* TEATRO LAYOUT — grid de fotos izquierda + contenido derecha */
.teatro-layout{display:grid;grid-template-columns:1fr;gap:var(--space-10);align-items:center}
@media(min-width:768px){.teatro-layout{grid-template-columns:1fr 1fr}}
.teatro-layout__content{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-4)}

/* MODO OSCURO — textos en violeta pasan a blanco/claro para mejor legibilidad */
.dark .section__label { color: rgba(255,255,255,.55) }
.dark .modulo-card__title { color: #c084fc }
.dark .info-item__title { color: #fff }
.dark .social-text-item a { color: #c084fc }
.dark .social-text-item a:hover { color: var(--color-accent) }
.dark .footer__link { color: rgba(255,255,255,.60) }
.dark .footer__link:hover { color: var(--color-accent) }
.dark .info-item__text a[href*="wa.me"] { color: #c084fc }
.dark .info-item__text a[href*="wa.me"]:hover { color: #fff }

/* INSTRUMENTOS — layout con imagen derecha + chips izquierda */
.instrumentos-layout{display:grid;grid-template-columns:1fr;gap:var(--space-10);align-items:center;margin-top:var(--space-4)}
@media(min-width:768px){.instrumentos-layout{grid-template-columns:1fr 1fr}}
.instrumentos-layout__chips{display:flex;flex-direction:column}
.instrumentos-layout__image{position:relative}
.instrumentos-layout__image .canto-layout__frame{position:absolute;inset:-.75rem;border:2px solid var(--color-accent);border-radius:var(--radius-2xl);z-index:0;pointer-events:none}
.instrumentos-layout__image .canto-layout__photo{position:relative;z-index:1;border-radius:var(--radius-2xl);overflow:hidden;aspect-ratio:4/3}
.instrumentos-layout__image .canto-layout__photo img{width:100%;height:100%;object-fit:cover;display:block}

/* CHIPS de instrumentos */
.instrumentos-chips{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.instrumento-chip{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-3) var(--space-4);border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:700;cursor:default;transition:background var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast);border:1.5px solid;min-width:3rem;text-align:center}
.instrumento-chip--primary{border-color:var(--color-primary);color:var(--color-primary);background:transparent}
.instrumento-chip--accent{border-color:var(--color-accent);color:var(--color-accent);background:transparent}
.instrumento-chip--primary:hover{background:var(--color-primary);border-color:var(--color-primary);color:#fff !important}
.instrumento-chip--accent:hover{background:var(--color-accent);border-color:var(--color-accent);color:#fff !important}
.dark .instrumento-chip--primary{color:#c084fc;border-color:#c084fc}
.dark .instrumento-chip--accent{color:var(--color-accent);border-color:var(--color-accent)}
.dark .instrumento-chip--primary:hover{background:#c084fc;border-color:#c084fc;color:#fff !important}
.dark .instrumento-chip--accent:hover{background:var(--color-accent);border-color:var(--color-accent);color:#fff !important}

/* INFANCIAS — tarjetas con altura distribuida */
.infancias-cards .infancia-text-card{flex:1}

/* FLIP CARDS — danza */
.dance-flip-card{perspective:1000px;cursor:pointer}
.dance-flip-card__inner{position:relative;width:100%;height:100%;transition:transform 0.6s cubic-bezier(0.4,0,0.2,1);transform-style:preserve-3d}
.dance-flip-card:hover .dance-flip-card__inner,
.dance-flip-card.is-flipped .dance-flip-card__inner{transform:rotateY(180deg)}
.dance-flip-card__front,
.dance-flip-card__back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:var(--radius-2xl);overflow:hidden}
.dance-flip-card__front{z-index:2}
.dance-flip-card__back{background:var(--color-primary);display:flex;align-items:center;justify-content:center;transform:rotateY(180deg);z-index:1}
.dance-flip-card--sm:nth-child(even) .dance-flip-card__back{background:var(--color-accent)}
.dance-flip-card__price{color:#fff;font-size:var(--font-size-xl);font-weight:900;text-align:center;line-height:1.3}
.dance-flip-card__price small{font-size:var(--font-size-sm);font-weight:500;opacity:.85}

/* Tarjetas de texto en modal danza */
.dance-flip-card__front--text{background:var(--color-primary);border:none;display:flex;align-items:center;justify-content:center;padding:var(--space-4)}
.dance-flip-card__front--text span{font-size:var(--font-size-base);font-weight:700;color:#fff;text-align:center}
.dance-flip-card--sm:nth-child(even) .dance-flip-card__front--text{background:var(--color-accent)}
.dark .dance-flip-card__front--text{background:var(--color-primary)}
.dark .dance-flip-card--sm:nth-child(even) .dance-flip-card__front--text{background:var(--color-accent)}
.dark .dance-flip-card__front--text span{color:#fff}

/* Necesitamos que dance-flip-card tenga el mismo aspect-ratio que dance-card */
.dance-grid-v2 .dance-flip-card{aspect-ratio:4/3;border-radius:var(--radius-2xl)}
.dance-grid-v2 .dance-flip-card__inner{height:100%}

/* Grid modal danza */
.dance-more-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4);margin-top:var(--space-6)}
@media(min-width:480px){.dance-more-grid{grid-template-columns:repeat(3,1fr)}}
.dance-flip-card--sm{aspect-ratio:1/1}
.dance-flip-card--sm .dance-flip-card__inner{height:100%}

/* Modal danza */
.modal--danza .modal__inner{max-width:520px}

/* BANNER instrumentos */
.instrumento-banner{display:flex;align-items:center;gap:var(--space-4);margin-top:var(--space-8);background:var(--color-primary);color:#fff;border-radius:var(--radius-2xl);padding:var(--space-5) var(--space-6)}
.instrumento-banner .material-symbols-outlined{font-size:2rem;flex-shrink:0;color:var(--color-accent)}
.instrumento-banner strong{display:block;font-size:var(--font-size-base);font-weight:800;margin-bottom:var(--space-1)}
.instrumento-banner p{font-size:var(--font-size-sm);opacity:.90;margin:0}

/* CHIPS hover violeta — texto blanco en ambos modos (ver bloque arriba) */

/* COMPOSICIÓN MUSICAL — foto izquierda + texto derecha */
.composicion-layout{display:grid;grid-template-columns:1fr;gap:var(--space-10);align-items:center;margin-bottom:var(--space-16)}
@media(min-width:768px){.composicion-layout{grid-template-columns:1fr 1fr}}
.composicion-layout__content{display:flex;flex-direction:column;gap:var(--space-4)}

/* MODAL fade-out */
@keyframes modal-out{from{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(0.96)}}
dialog.modal.is-closing{animation:modal-out 0.45s ease forwards}
dialog.modal.is-closing::backdrop{animation:backdrop-out 0.45s ease forwards}
@keyframes backdrop-out{from{opacity:1}to{opacity:0}}