/* =======================================================================
   NEUROSHOCK / DISEÑO v1.1.1
   1. INICIO / lanzamiento: tres columnas (portada, título, sello).
   2. ICONOS / plataformas: iguales en inicio y tarjetas de discografía.
   3. DEMÁS SECCIONES: preservadas de v1.1 (catálogo, playlist, contacto).
   Para cambiar textos, portadas o URLs: editar content.js, NO este CSS.
   ======================================================================= */

/* 1. INICIO: las tres columnas se adaptan sin ocultar el logo original. */
.ns-feature-hero { background: #0b0d0e; }
.ns-feature-layout {
  width: min(1460px, calc(100% - 48px));
  max-width: 1460px;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 1.14fr) minmax(0, .98fr);
  align-items: stretch;
  gap: clamp(16px, 1.9vw, 28px);
  min-height: 570px;
  padding-top: 22px;
  padding-bottom: 22px;
}
.ns-feature-art { position:relative; min-width:0; align-self:center; background:#090d15; border:1px solid #343b43; padding:clamp(12px,1.3vw,20px); }
.ns-feature-art img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:contain; }
.ns-feature-tag,.ns-feature-art-footer { display:block; font-size:9px; font-weight:900; letter-spacing:1.5px; color:var(--accent); }
.ns-feature-tag { margin-bottom:14px; }
.ns-feature-art-footer { display:flex; justify-content:space-between; gap:5px; margin-top:14px; color:#bfc5c1; }
.ns-feature-art-footer span {color:var(--accent)}
.ns-feature-details { display:flex; flex-direction:column; justify-content:center; min-width:0; padding:24px 0; }
.ns-feature-topline { color:var(--accent); font-size:10px; font-weight:900; letter-spacing:1.1px; display:flex; align-items:center; gap:10px; margin-bottom:29px; }
.ns-feature-eyebrow { font-size:11px; letter-spacing:2px; font-weight:900; color:#bbc5bf; margin:0 0 17px; }
.ns-feature-hero h1 { font-family:var(--display); font-size:clamp(54px,6.0vw,92px); line-height:.89; letter-spacing:-1.5px; margin:0 0 25px; white-space:normal; overflow-wrap:normal; text-transform:uppercase; }
.ns-feature-hero h1 span { color:var(--accent); }
.ns-feature-description { font-size:14px; line-height:1.7; color:#c0c7c3; margin:0 0 20px; max-width:500px; }
.ns-feature-actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.ns-feature-branding { border-top:1px solid #39413a; display:flex; gap:12px; align-items:center; margin-top:25px; padding-top:18px; }
.ns-feature-branding img { width:70px; height:45px; object-fit:contain; }
.ns-feature-branding div { display:flex; flex-direction:column; gap:5px; }
.ns-feature-branding strong { font-family:var(--display); font-size:16px; letter-spacing:.2px; }
.ns-feature-branding span { font-size:9px; letter-spacing:1.1px; color:#9da49d; font-weight:800; }

/* Panel original con logo, repuesto como tercera columna. */
.ns-feature-identity { order:0; min-height:0; height:100%; border:1px solid var(--stroke); }
.ns-feature-identity .hero-identity-mark { min-height:480px; }
.ns-feature-identity .hero-identity-rings { width:min(88%,350px); }
.ns-feature-identity .identity-logo { width:min(100%,390px); }
.ns-feature-identity .cover-label { left:20px; right:20px; font-size:8px; letter-spacing:1.3px; }
.ns-feature-identity .identity-topline { font-size:9px; letter-spacing:2px; }
.ns-feature-identity .identity-records { font-size:clamp(12px,1.1vw,18px); letter-spacing:clamp(4px,.5vw,8px); }

/* 2. PLATAFORMAS: imágenes vectoriales clicables, sin librerías externas. */
.ns-service-links { display:flex; align-items:center; gap:13px; flex-wrap:wrap; }
.ns-service-link { display:inline-flex; justify-content:center; align-items:center; width:58px; height:58px; padding:3px; color:#f4f5f3; border:1px solid transparent; border-radius:12px; transition:transform .18s, color .18s, border-color .18s; }
.ns-service-link svg { width:100%; height:100%; display:block; }
.ns-service-link:hover { color:var(--accent); transform:translateY(-3px); }
.ns-service-link:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.ns-feature-platforms {gap:13px}
.ns-feature-platforms .ns-service-link { width:65px; height:65px; }
.ns-release-platforms { margin-top:14px; }
.ns-release-platforms .ns-service-link { width:43px; height:43px; }

/* 3. AJUSTES RESPONSIVE. En móvil el logo queda visible debajo del lanzamiento. */
@media(max-width:1160px) {
  .ns-feature-layout { grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); }
  .ns-feature-identity { grid-column:1/-1; min-height:260px; }
  .ns-feature-identity .hero-identity-mark { min-height:260px; padding:20px; }
  .ns-feature-identity .identity-logo { width:min(42%,330px); }
  .ns-feature-identity .hero-identity-rings { width:min(35%,250px); }
  .ns-feature-hero h1 { font-size:clamp(62px,8vw,95px); }
}
@media(max-width:680px) {
  .ns-feature-layout { width:calc(100% - 30px); grid-template-columns:1fr; gap:14px; padding-top:18px; padding-bottom:18px; }
  .ns-feature-art { max-width:520px; width:100%; margin:auto; padding:12px; }
  .ns-feature-tag,.ns-feature-art-footer {font-size:8px;letter-spacing:1px}
  .ns-feature-details { padding:15px 2px 24px; }
  .ns-feature-topline {margin-bottom:21px;font-size:9px}
  .ns-feature-hero h1 {font-size:clamp(58px,13vw,83px); margin-bottom:22px}
  .ns-feature-description {font-size:14px}
  .ns-feature-identity { grid-column:auto; min-height:310px; }
  .ns-feature-identity .hero-identity-mark { min-height:310px; }
  .ns-feature-identity .identity-logo { width:min(88%,320px); }
  .ns-feature-identity .hero-identity-rings { width:min(78%,290px); }
  .ns-feature-branding {margin-top:22px}
}
@media(prefers-reduced-motion:reduce) { .ns-service-link {transition:none} }

#lanzamientos{background:#141718}
#artistas{background:#0b0d0e}
#nosotros{background:#eae9e1}
#releases-grid{margin-bottom:12px}
.release-card .release-art{background:#080b11}
.release-card .release-art .artwork-img{object-fit:cover}
.release-card .card-link{font-size:12px}
.ns-discography-panel{display:block;margin:42px 0 0;border:1px solid #39463b;background:#101515;overflow:hidden}
.ns-playlist-summary{cursor:pointer;list-style:none;padding:26px 30px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.ns-playlist-summary::-webkit-details-marker{display:none}
.ns-playlist-summary>span:first-child{display:flex;flex-direction:column;gap:9px}
.ns-playlist-summary small{color:var(--accent);font-weight:900;letter-spacing:2px;font-size:10px}
.ns-playlist-summary strong{font-family:var(--display);font-size:clamp(24px,3vw,38px);line-height:1.08}
.ns-playlist-summary span span{color:#bbc4be;font-size:13px;line-height:1.6;max-width:560px}
.ns-playlist-expand{border:1px solid var(--accent);padding:14px 16px;font-size:11px;font-weight:900;letter-spacing:.5px;color:var(--accent);flex-shrink:0}
.ns-playlist-summary:hover .ns-playlist-expand{background:var(--accent);color:var(--bg)}
.ns-playlist-body{padding:0 30px 30px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.ns-discography-action{display:inline-flex;padding:12px 15px;color:#0b0d0e;background:var(--accent);font-size:11px;font-weight:900}
.ns-spotify-frame{width:100%;height:410px;display:block;background:#141919;border:0;border-radius:10px}
.ns-contact-help{margin-top:25px;padding:20px 0;border-top:1px solid #6b8b29}
.ns-contact-heading{font-size:12px;font-weight:900;letter-spacing:1.2px;margin-bottom:10px}
.ns-contact-help p:not(.ns-contact-heading){font-size:14px;line-height:1.6;color:#35481c}
.ns-contact-help-link{display:inline-block;background:#101512;color:var(--accent);padding:14px 16px;font-size:12px;font-weight:900}
.ns-contact-help-link:hover{background:#364626;color:white}
.ns-contact-help small{display:block;font-size:11px;line-height:1.6;margin-top:13px;color:#374921}
/* 4. CATÁLOGO / PLAYLIST / CONTACTO: responsive sólo en sus componentes. */
@media (max-width:540px) {
  .ns-playlist-summary {padding:22px 18px;display:block}
  .ns-playlist-expand {display:inline-block;margin-top:19px}
  .ns-playlist-body {padding:0 18px 20px}
  .ns-spotify-frame {height:410px}
}
.social-links:empty {display:none}
/* =========================================
   NEUROSHOCK - PANEL DE IDENTIDAD EN MÓVILES
   Evita que las etiquetas se superpongan.
   No modifica el diseño de escritorio.
   ========================================= */

@media (max-width: 680px) {

  /* Ocultar etiquetas decorativas duplicadas */
  .ns-feature-identity .cover-label {
    display: none;
  }

  /* Centrar correctamente el contenido */
  .ns-feature-identity .hero-identity-mark {
    min-height: 340px;
    padding: 28px 12px;
  }

  /* Separar el lema del logotipo */
  .ns-feature-identity .identity-topline {
    margin-bottom: 14px;
  }

  /* Mantener el logo completo */
  .ns-feature-identity .identity-logo {
    width: min(85%, 300px);
  }

  /* Separar la línea decorativa inferior */
  .ns-feature-identity .identity-divider {
    margin-top: 16px;
  }
}