/* V8 — Copy más claro y jerarquía UX; mantiene el arte/fotos de V7 */

/* Hero: un solo CTA sin quitarle fuerza al mensaje */
.hero-lead { max-width:570px; }
.hero-actions { gap:0; }
.hero-actions .btn--gold { padding-inline:27px; }

/* Las etapas explican soluciones; un botón unificador termina la sección */
.stages-section { padding-bottom:clamp(65px,6vw,92px); }
.stages-grid { align-items:stretch; }
.stage-card { display:flex;flex-direction:column;padding-bottom:12px; }
.stage-card .stage-img { flex-shrink:0; }
.stage-card .stage-body {
  flex:1;
  margin-bottom:0;
  padding:24px 24px 27px;
  min-height:202px;
}
.stage-card .stage-body h3 {font-size:clamp(20px,1.7vw,23px); line-height:1.25; margin-bottom:10px;}
.stage-card .stage-body p {font-size:15px;line-height:1.65;color:#565052;max-width:36ch;}
.stages-action {margin:35px auto 0;display:flex;justify-content:center;}
.stages-action .btn {min-width:220px;display:inline-flex;justify-content:center;}

/* Cinco pilares más visibles: imágenes protagonistas y nombres legibles */
.pieces-section {background:#fffdf9;padding-top:clamp(76px,7vw,105px);padding-bottom:clamp(72px,7vw,105px);}
.pieces-layout {display:block;}
.pieces-copy {max-width:930px;}
.pieces-copy h2 {max-width:840px;margin-bottom:17px;}
.pieces-copy p {max-width:840px;font-size:16px;line-height:1.75;}
.pieces-copy .pillars-lead {font-weight:600;color:#51463d;margin-top:12px;}
.pieces-gallery {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;margin-top:34px;}
.piece {min-width:0;}
.piece>img,.piece:nth-child(2)>img,.piece:nth-child(4)>img {height:215px;border-radius:24px 24px 22px 22px;box-shadow:0 14px 32px rgba(42,29,16,.1);}
.piece-icon {height:58px;width:58px;border-width:4px;margin:-30px auto 8px;}
.piece-icon .icon {height:27px;width:27px;}
.piece strong {font-size:14px;line-height:1.4;white-space:normal;min-height:40px;display:block;}

/* El texto sobre el video describe una experiencia y el botón REPRODUCE el video */
.experience-pill-row {display:none;}
.experience-copy>p:not(.eyebrow) {font-size:16px;line-height:1.75;}
.video-context {margin-top:20px!important;}
.video-play-cta {cursor:pointer;min-height:50px;display:inline-flex;align-items:center;justify-content:center;gap:12px;border:0;}
.video-play-cta:focus-visible {outline:3px solid #c99b4a;outline-offset:4px;}
#experience-video {scroll-margin-top:110px;}

/* El mensaje del CTA no duplica el encabezado de pilares */
.cta-content h2 {font-size:clamp(27px,2.75vw,40px);line-height:1.19;max-width:740px;}
.cta-content p {font-size:15px;line-height:1.7;}

/* Proceso: los 3 pasos tienen nombres orientados a lo que hará la persona */
.step h3 {font-size:16px;line-height:1.35;}
.step p {font-size:14px;line-height:1.65;}

@media (max-width:1160px) {
  .pieces-gallery {grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;}
  .piece>img,.piece:nth-child(2)>img,.piece:nth-child(4)>img {height:225px;}
}
@media (max-width:760px) {
  .stages-section {padding-bottom:64px;}
  .stage-card .stage-body {min-height:0;padding:21px 22px 26px;}
  .stage-card .stage-body p {font-size:15px;max-width:none;}
  .stages-action {margin-top:26px;}
  .pieces-gallery {display:grid;overflow:visible;margin:26px 0 0;padding:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:19px 13px;}
  .piece {flex:initial;scroll-snap-align:none;}
  .piece>img,.piece:nth-child(2)>img,.piece:nth-child(4)>img {height:190px;}
  .piece strong {font-size:13px;min-height:auto;}
  .pieces-copy p,.experience-copy>p:not(.eyebrow) {font-size:15px;}
  .cta-content h2 {font-size:30px;}
}
@media (max-width:430px) {
  .stage-card .stage-body p {font-size:14px;}
  .piece>img,.piece:nth-child(2)>img,.piece:nth-child(4)>img {height:155px;}
  .piece-icon {width:50px;height:50px;margin-top:-26px;}
  .piece strong {font-size:12px;}
  .stages-action .btn {min-width:0;width:min(100%,290px);}
}
