/* ============================================================
   AUDIO PLANET ARGENTINA SRL — Estilos compartidos
   Descripciones largas de producto (WooCommerce / Kadence Blocks)
   Alojar UNA sola vez y reutilizar en todas las fichas de producto.
   Scope: .ap-pdp
   Sin tipografía propia: hereda la fuente por defecto del tema.
============================================================= */

.ap-pdp{
  --ap-bg:#ffffff;
  --ap-ink-soft:#4b4f58;
  --ap-line:#e6e3db;
  --ap-accent:#C38356;
  --ap-accent-soft: rgba(195,131,86,0.38);
  --ap-dark:#282727;
  --ap-radius:14px;
  --ap-maxw:1180px;
  --ap-text-maxw:760px;
  --ap-transition: .8s cubic-bezier(.22,.61,.36,1);
  color:#161616;
  line-height: 1.65;
  overflow-x: clip; /* necesario para permitir full-bleed sin scroll horizontal */
}
.ap-pdp *{ box-sizing: border-box; }
.ap-pdp .ap-wrap{ max-width: var(--ap-maxw); margin: 0 auto; padding: 0 24px; }
.ap-pdp img{ max-width:100%; height:auto; display:block; }
.ap-pdp a{ color: var(--ap-accent); text-decoration: underline; text-underline-offset:2px; }
.ap-pdp a:hover{ color:#a86c40; }
.ap-pdp strong{ font-weight:700; } /* no se fuerza color: hereda el color del texto que envuelve */

/* ---------- Full-bleed: rompe el ancho del contenedor de WordPress ---------- */
.ap-pdp .ap-full{
  width:100vw; position:relative; left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
}

/* ---------- Fade-in on scroll ---------- */
.ap-pdp .ap-fade{
  opacity:0; transform: translateY(26px);
  transition: opacity var(--ap-transition), transform var(--ap-transition);
  will-change: opacity, transform;
}
.ap-pdp .ap-fade-img{
  opacity:0; transform: scale(1.06);
  transition: opacity 1s cubic-bezier(.22,.61,.36,1), transform 1.1s cubic-bezier(.22,.61,.36,1);
}
.ap-pdp .ap-hero-fade{
  opacity:0; transform: scale(1.035);
  filter: blur(9px);
  transition: opacity 1.5s cubic-bezier(.16,.84,.44,1),
              transform 1.7s cubic-bezier(.16,.84,.44,1),
              filter 1.4s ease-out;
}
.ap-pdp .ap-fade.is-visible,
.ap-pdp .ap-fade-img.is-visible,
.ap-pdp .ap-hero-fade.is-visible{ opacity:1; transform:none; filter:blur(0); }

/* Cascada: retrasos escalonados para título/subtítulo y h3/h4 */
.ap-pdp .ap-d1{ transition-delay: .12s; }
.ap-pdp .ap-d2{ transition-delay: .32s; }
.ap-pdp .ap-d3{ transition-delay: .52s; }
.ap-pdp .ap-d4{ transition-delay: .72s; }
@media (prefers-reduced-motion: reduce){
  .ap-pdp .ap-fade, .ap-pdp .ap-fade-img, .ap-pdp .ap-hero-fade{ opacity:1; transform:none; filter:none; transition:none; }
}

/* ---------- Hero principal: imagen full-bleed con título/subtítulo superpuestos ---------- */
.ap-pdp .ap-hero{
  position:relative; overflow:hidden; background:#111;
  min-height: 420px;
  margin-top: -54px;
}
.ap-pdp .ap-hero img{
  width:100%; height:100%; object-fit:cover; /* cover = nunca deforma, siempre recorta */
  aspect-ratio: 2/1;
  min-height: 420px;
}
@media (max-width: 720px){
  .ap-pdp .ap-hero img{ aspect-ratio: 4/5; }
}
.ap-pdp .ap-hero::after{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.28) 42%, rgba(0,0,0,0) 68%),
    linear-gradient(0deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,0) 45%);
  pointer-events:none;
}
.ap-pdp .ap-hero-copy{
  position:absolute; left:0; right:0; bottom:0;
  padding: 0 0 4rem 4rem;
  z-index:1;
}
.ap-pdp .ap-hero-title{
  color:#fff; font-weight:700; line-height:0;
  font-size: 40px; margin:0 0 22px;
  text-shadow: 0 2px 18px rgba(0,0,0,.25);
}
.ap-pdp .ap-hero-subtitle{
  color:#f2f1ee; font-weight:500;
  font-size: clamp(14px, 1.5vw, 19px); max-width: 780px; margin:0;
  letter-spacing:-0.03em; line-height:1;
  text-shadow: 0 1px 12px rgba(0,0,0,.25);
}

/* ---------- Bloques: texto centrado + imagen HERO full-bleed debajo ---------- */
.ap-pdp .ap-block{ padding:0; }

/* Fondo en degradado a TODO el ancho de pantalla, el texto adentro mantiene su columna */
.ap-pdp .ap-block-bg{
  background: linear-gradient(180deg, rgba(239,239,239,0.2) 0%, rgba(239,239,239,1) 100%);
}
.ap-pdp .ap-block-copy{
  text-align:center; max-width: var(--ap-text-maxw); margin: 0 auto;
  padding: 9em 24px 14em;
}
.ap-pdp .ap-block-copy h3{
  font-size:54px; font-weight:800; margin:0 0 48px;
  letter-spacing:-0.04em; line-height:1;
}
.ap-pdp .ap-block-copy h4{
  font-weight:400; font-size:19px; color:#2b2b2b; margin:0; text-align:center;
  line-height:1.45; letter-spacing:-0.015em;
}

.ap-pdp .ap-hero-media{ overflow:hidden; background:#eee; }
.ap-pdp .ap-hero-media img{
  width:100%; aspect-ratio: 2/1; object-fit: cover; min-height: 420px;
}
@media (max-width: 720px){
  .ap-pdp .ap-hero-media img{ aspect-ratio: 4/5; min-height: 0; }
}

/* ---------- Video: ancho completo, sin márgenes ---------- */
.ap-pdp .ap-video{ padding:0; }
.ap-pdp .ap-video-frame{
  position:relative; width:100%; padding-top:42.85%; /* ~21:9 a todo el ancho */
  overflow:hidden; background:#0e0f12;
}
.ap-pdp .ap-video-frame iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0;
  opacity:0; transition: opacity .9s ease;
}
.ap-pdp .ap-video-frame iframe.is-loaded{ opacity:1; }
@media (max-width: 720px){
  .ap-pdp .ap-video-frame{ padding-top:56.25%; } /* 16:9 en mobile, más legible */
}

/* ============================================================
   Datos & Descargas — bloque de 2 columnas (40% / 60%)
============================================================= */
.ap-pdp .ap-data{ background: var(--ap-dark); padding: 140px 0; }
.ap-pdp .ap-data-grid{
  max-width: var(--ap-maxw); margin:0 auto;
  display:grid; grid-template-columns: 40% 60%; align-items:start;
}
@media (max-width: 860px){
  .ap-pdp .ap-data-grid{ grid-template-columns: 1fr; gap:60px; }
}
.ap-pdp .ap-data-title-col{ padding-left:50px; }
.ap-pdp .ap-data-title{
  font-size:42px; line-height:1; color:#F2F5F7; margin:0; font-weight:600;
}
.ap-pdp .ap-data-acc-col{ padding-right:50px; }

/* Acordeón */
.ap-pdp .ap-accordion{ width:100%; }
.ap-pdp .ap-acc-item{
  border:1px solid var(--ap-accent); border-radius:6px;
  margin-bottom:10px; overflow:hidden;
  transition: border-color .3s ease;
}
.ap-pdp .ap-acc-item:hover{ border-color: var(--ap-accent-soft); }
.ap-pdp .ap-acc-item.is-open{ border-color: var(--ap-dark); }

.ap-pdp .ap-acc-btn{
  width:100%; text-align:left; background:transparent; border:0; cursor:pointer;
  display:flex; align-items:center; gap:12px;
  padding:13px 15px; font-size:17px; font-weight:400; color: var(--ap-accent);
  transition: background-color .3s ease, color .3s ease;
}
.ap-pdp .ap-acc-item:hover .ap-acc-btn{ background: rgba(195,131,86,.07); }
.ap-pdp .ap-acc-item.is-open .ap-acc-btn{
  background: var(--ap-accent);
  color: var(--ap-dark);
}
/* El contenido de la pestaña desplegada siempre queda transparente, aunque el header esté activo */
.ap-pdp .ap-acc-panel{ background: transparent; }
.ap-pdp .ap-acc-btn-label{ flex:1 1 auto; }
.ap-pdp .ap-acc-icon-left{ flex:0 0 auto; width:20px; height:20px; display:flex; align-items:center; justify-content:center; }
.ap-pdp .ap-acc-icon-left svg{ width:100%; height:100%; stroke:currentColor; fill:none; }

.ap-pdp .ap-acc-icon{ flex:0 0 auto; width:18px; height:18px; position:relative; margin-left:auto; }
.ap-pdp .ap-acc-icon::before,
.ap-pdp .ap-acc-icon::after{
  content:""; position:absolute; background:currentColor; border-radius:2px;
  transition: transform .35s ease, opacity .35s ease;
}
.ap-pdp .ap-acc-icon::before{ left:0; top:50%; width:100%; height:2px; transform:translateY(-50%); }
.ap-pdp .ap-acc-icon::after{ top:0; left:50%; width:2px; height:100%; transform:translateX(-50%); }
.ap-pdp .ap-acc-item.is-open .ap-acc-icon::after{ transform:translateX(-50%) rotate(90deg); opacity:0; }

.ap-pdp .ap-acc-panel{
  max-height:0; overflow:hidden; transition: max-height .5s cubic-bezier(.34,1.56,.64,1);
}
.ap-pdp .ap-acc-panel-inner{ padding: 20px 15px 24px; }

.ap-pdp .ap-spec-name{ font-weight:700; margin: 16px 0 4px; color:#F2F5F7; }
.ap-pdp .ap-spec-name:first-child{ margin-top:2px; }
.ap-pdp .ap-spec-value{ margin:0 0 4px; color:#c9cdd2; }

.ap-pdp .ap-faq-q{ font-weight:700; margin: 16px 0 6px; color:#F2F5F7; }
.ap-pdp .ap-faq-q:first-child{ margin-top:2px; }
.ap-pdp .ap-faq-a{ margin:0 0 4px; color:#c9cdd2; }

.ap-pdp .ap-dl-list{ list-style:none; margin:6px 0 0; padding:0; display:grid; gap:10px; }
.ap-pdp .ap-dl-list li a{
  display:flex; align-items:center; gap:10px; padding:14px 16px;
  border:1px solid var(--ap-accent); border-radius:6px; text-decoration:none;
  font-weight:600; color:#F2F5F7;
  transition: border-color .25s ease, background .25s ease;
}
.ap-pdp .ap-dl-list li a:hover{ border-color: var(--ap-accent-soft); }
.ap-pdp .ap-dl-list li a::before{ content:"⬇"; color: var(--ap-accent); font-weight:700; }

.ap-pdp .ap-hero img,
.ap-pdp .ap-hero-media img{
  will-change: transform;
}
.ap-pdp .ap-block-copy a,
.ap-pdp .ap-faq-a a{
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0% 1px;
  transition: background-size .35s ease;
}
.ap-pdp .ap-block-copy a:hover,
.ap-pdp .ap-faq-a a:hover{
  background-size: 100% 1px;
}
.ap-pdp .ap-dl-list li a::before{
  display: inline-block;
  transition: transform .25s ease;
}
.ap-pdp .ap-dl-list li a:hover::before{
  transform: translateY(2px);
}
/* ============================================================
   Bloque CTA final — reservado para un mensaje futuro
   sincronizado en todas las publicaciones. Vacío = sin espacio.
============================================================= */
.ap-pdp .ap-cta{ margin:0; padding:0; }
.ap-pdp .ap-cta.is-active{
  padding: 80px 24px; text-align:center; max-width: var(--ap-maxw); margin:0 auto;
}