/* ============================================================
   PERFINOVA — CAPA POLISH (refinamiento visual nivel agencia)
   Afina: jerarquía, espaciado, tipografía, contraste, botones,
   tarjetas, hover, microinteracciones y móvil.
   NO cambia identidad (oscuro+bronce) ni contenido.
   Reversible: quitar el <link> de polish.css en index.html.
   ============================================================ */

:root{
  --ease-p:cubic-bezier(.22,.61,.36,1);
  --t-fast:.25s;
  --t-mid:.4s;
  --r-card:10px;     /* radio unificado tarjetas */
  --r-btn:8px;       /* radio unificado botones */
  /* +contraste de texto atenuado para lectura cómoda en oscuro */
  --bone-dim:rgba(243,239,233,.70);
  --bone-dim2:rgba(243,239,233,.48);
}

/* ════════ 1 · RITMO VERTICAL UNIFICADO ════════ */
.value-prop,
.catalog-makers,
.catalog-clients,
.chain-section,
.gallery,
.testimonials,
.faq,
.contact{
  padding-top:clamp(76px,9vw,132px);
  padding-bottom:clamp(76px,9vw,132px);
}

/* ════════ 2 · TIPOGRAFÍA ════════ */
/* Eyebrows / etiquetas — un solo estilo */
.section-tag,
.catalog-sub-tag,
.pergola-tag,
.ispec-header .section-tag,
.audience-tag{
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.2em;
  text-transform:uppercase;
}
/* Títulos de sección — más grandes, tighter, mejor interlínea */
.section-title{ font-size:clamp(1.95rem,4.2vw,3.1rem); }
.section-title,
.catalog-sub-title,
.catalog-sub-title--dark,
.audience-title,
.pergola-title,
.contact-title,
.ispec-header .section-title,
.imodels-title,
.ispec-quien-title{
  letter-spacing:-.022em;
  line-height:1.07;
}
/* Cuerpos — interlínea generosa, lectura premium */
.section-desc,
.value-card p,
.catalog-body p,
.chain-step-desc,
.ispec-card p,
.imodel-info p,
.faq-answer p,
.audience-desc,
.maker-card-desc{ line-height:1.72; }

/* ════════ 3 · SISTEMA DE BOTONES UNIFICADO ════════ */
.btn-phero,
.btn-inno-primary,.btn-inno-secondary,
.maker-cta,.project-cta,
.pergola-cta-main,.pergola-cta-wa,
.btn-outline-cyan,.btn-download-catalog,
.ispec-cta-btn,.audience-cta,
.form-next-btn,.form-submit-btn{
  border-radius:var(--r-btn);
  font-weight:600;
  letter-spacing:.012em;
  transition:transform var(--t-mid) var(--ease-p),
             background var(--t-mid) var(--ease-p),
             border-color var(--t-mid) var(--ease-p),
             box-shadow var(--t-mid) var(--ease-p),
             color var(--t-mid) var(--ease-p);
}
/* Lift consistente al hover */
.btn-phero:hover,
.btn-inno-primary:hover,.btn-inno-secondary:hover,
.maker-cta:hover,.project-cta:hover,
.pergola-cta-main:hover,.pergola-cta-wa:hover,
.btn-outline-cyan:hover,.btn-download-catalog:hover,
.ispec-cta-btn:hover,.audience-cta:hover{ transform:translateY(-2px); }

/* CTA primario del hero — más peso visual (jerarquía) */
.btn-phero-solid{ padding:16px 34px; font-weight:700; box-shadow:0 10px 30px rgba(192,145,92,.22); }
.btn-phero-solid:hover{ box-shadow:0 14px 38px rgba(192,145,92,.34); }
.btn-phero-ghost{ color:rgba(243,239,233,.78); border-color:rgba(255,255,255,.28); }

/* Pills de navegación conservan su forma */
.nav-cta,.mobile-cta{ border-radius:100px; }

/* ════════ 4 · TARJETAS — calidad unificada ════════ */
.value-card,.ispec-card,.imodel-card,.chain-step,
.maker-card,.catalog-card,.ispec-quien-card,.testimonial-card{
  border-radius:var(--r-card);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045);
  transition:transform var(--t-mid) var(--ease-p),
             border-color var(--t-mid) var(--ease-p),
             box-shadow var(--t-mid) var(--ease-p),
             background var(--t-mid) var(--ease-p);
}
.value-card:hover,.ispec-card:hover,.chain-step:hover,
.maker-card:hover,.ispec-quien-card:hover,.testimonial-card:hover{
  transform:translateY(-6px);
  border-color:rgba(192,145,92,.42);
  box-shadow:0 24px 52px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.07);
}
.imodel-card:hover,.catalog-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 52px rgba(0,0,0,.55);
}
/* Zoom de imagen sutil y consistente */
.catalog-card:hover .catalog-img-wrap img,
.imodel-card:hover .imodel-thumb img{ transform:scale(1.045); }

/* Más aire interno en tarjetas (respiración premium) */
.value-card{ padding:34px 30px; }
.ispec-quien-card{ padding:34px 30px; }
.imodel-info{ padding:18px 20px 20px; }

/* ════════ 5 · MICROINTERACCIONES ════════ */
/* Links "→": la flecha se desliza */
.catalog-link,.maker-card-link{
  display:inline-flex; align-items:center; gap:6px;
  transition:gap var(--t-mid) var(--ease-p), color var(--t-mid) var(--ease-p);
}
.catalog-link:hover,.maker-card-link:hover{ gap:13px; }
/* Play de los modelos — escala suave */
.imodel-play{ transition:transform var(--t-mid) var(--ease-p), background var(--t-mid) var(--ease-p), color var(--t-mid) var(--ease-p); }
/* Nav links — subrayado más fino y elegante */
.nav-link::after{ height:1px; }
/* Botón flotante WhatsApp — pulso sutil al hover ya existe; suavizar */
.whatsapp-float{ transition:transform var(--t-mid) var(--ease-p), box-shadow var(--t-mid) var(--ease-p), background var(--t-mid) var(--ease-p); }

/* ════════ 6 · TABLA DE MEDIDAS más refinada ════════ */
.ispec-table{ font-size:.92rem; }
.ispec-table th{ font-size:.72rem; letter-spacing:.1em; padding:16px 24px; }
.ispec-table td{ padding:16px 24px; }
.ispec-table tbody tr{ transition:background var(--t-fast) var(--ease-p); }

/* ════════ 7 · TRUST BAND más sobrio ════════ */
.trust-item{ font-size:.84rem; letter-spacing:.01em; }

/* ════════ 8 · STATS DEL HÉROE ════════ */
.phs small{ letter-spacing:.12em; }
.phs-num{ letter-spacing:-.02em; }

/* ════════ 9 · EXPERIENCIA MÓVIL ════════ */
@media (max-width:768px){
  .value-prop,.catalog-makers,.catalog-clients,.chain-section,
  .gallery,.testimonials,.faq,.contact{
    padding-top:clamp(56px,12vw,82px);
    padding-bottom:clamp(56px,12vw,82px);
  }
  /* Tap targets cómodos (≥48px) */
  .btn-phero,.btn-inno-primary,.btn-inno-secondary,.maker-cta,.project-cta,
  .pergola-cta-main,.pergola-cta-wa,.btn-outline-cyan,.btn-download-catalog,
  .ispec-cta-btn,.audience-cta,.form-next-btn,.form-submit-btn,.nav-cta,.mobile-cta{
    min-height:50px; display:inline-flex; align-items:center; justify-content:center;
  }
  /* Títulos con buen impacto sin desbordar */
  .section-title{ font-size:clamp(1.7rem,7.4vw,2.3rem); }
  /* Tarjetas con padding cómodo */
  .value-card,.ispec-quien-card{ padding:26px 22px; }
  /* Más separación entre stats del héroe en pantallas chicas */
  .phero-stats{ gap:20px 0; }
}

/* ════════ 10 · DETALLE: foco accesible en CTAs ════════ */
.btn-phero:focus-visible,.btn-inno-primary:focus-visible,
.maker-cta:focus-visible,.project-cta:focus-visible,
.pergola-cta-main:focus-visible,.ispec-cta-btn:focus-visible,
.nav-cta:focus-visible,.form-submit-btn:focus-visible,
.flagship-btn:focus-visible,.flagship-play:focus-visible{
  outline:2px solid var(--cyan-light);
  outline-offset:3px;
}

/* ════════ 11 · GSAP: evita doble animación en reveals ════════ */
.has-gsap .reveal{ transition:none; }

/* ════════ 12b · TARJETA-ENLACE A PÁGINA DE PRODUCTO ════════ */
.imodel-card{ text-decoration:none; -webkit-tap-highlight-color:transparent; }
.imodel-card:active{ transform:translateY(-2px) scale(.99); }
.imodel-cta{
  display:inline-flex; align-items:center; gap:6px; margin-top:14px;
  font-size:.82rem; font-weight:600; letter-spacing:.01em; color:var(--cyan-light);
  transition:gap var(--t-mid) var(--ease-p), color var(--t-mid) var(--ease-p);
}
.imodel-cta svg{ width:15px; height:15px; transition:transform var(--t-mid) var(--ease-p); }
.imodel-card:hover .imodel-cta{ color:var(--bone); }
.imodel-card:hover .imodel-cta svg{ transform:translateX(5px); }
/* El play es interacción secundaria, clara y accesible */
.imodel-play{ cursor:pointer; }
.imodel-play:focus-visible{ outline:2px solid var(--cyan-light); outline-offset:3px; }

/* ════════ 12 · HOVER ELEGANTE EN MODELOS DE PUERTA ════════ */
.imodel-thumb::after{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(to top, rgba(11,11,13,.55), transparent 52%);
  opacity:0; transition:opacity var(--t-mid) var(--ease-p);
}
.imodel-card:hover .imodel-thumb::after{ opacity:1; }
.imodel-play{ z-index:2; }

/* ════════════════════════════════════════════════════════════
   MONUMENTAL — PRODUCTO ANCLA (más premium que el resto)
   ════════════════════════════════════════════════════════════ */
.flagship{
  position:relative;
  background:var(--ink);
  border-top:1px solid var(--line-d);
  border-bottom:1px solid var(--line-d);
  padding:clamp(96px,11vw,170px) 32px;
  overflow:hidden;
}
.flagship-glow{
  position:absolute; top:50%; left:30%; transform:translate(-50%,-50%);
  width:62vw; height:62vw; max-width:840px; max-height:840px;
  background:radial-gradient(circle, rgba(192,145,92,.13), transparent 62%);
  pointer-events:none; z-index:0;
}
.flagship-inner{
  position:relative; z-index:1;
  max-width:1200px; margin:0 auto;
  display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(40px,6vw,84px);
  align-items:center;
}
.flagship-media{
  position:relative; aspect-ratio:4/5; border-radius:12px; overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 50px 110px rgba(0,0,0,.6);
}
.flagship-media img{ width:100%; height:100%; object-fit:cover; }
.flagship-badge{
  position:absolute; top:20px; left:20px; z-index:2;
  font-size:.65rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--ink); background:var(--cyan-light);
  padding:7px 15px; border-radius:100px;
}
.flagship-eyebrow{
  font-size:.74rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase;
  color:var(--cyan-light); margin-bottom:20px;
}
.flagship-title{
  font-family:'Cormorant Garamond', Georgia, serif;
  font-size:clamp(2.4rem,5vw,4rem); font-weight:500; line-height:1.04;
  letter-spacing:.005em; color:var(--bone); margin-bottom:26px;
}
.flagship-title span{ font-style:italic; font-weight:400; color:var(--cyan-light); display:block; }
.flagship-desc{
  font-size:1.06rem; font-weight:300; color:var(--bone-dim); line-height:1.78;
  max-width:460px; margin-bottom:34px;
}
.flagship-benefits{ list-style:none; margin:0 0 38px; padding:0; border-top:1px solid var(--line-d); }
.flagship-benefits li{
  display:flex; align-items:baseline; gap:16px;
  padding:15px 2px; border-bottom:1px solid var(--line-d);
}
.flagship-benefits strong{
  flex-shrink:0; width:148px; font-size:.92rem; font-weight:600; color:var(--bone);
}
.flagship-benefits span{ font-size:.92rem; font-weight:300; color:var(--bone-dim); }
.flagship-cta{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.flagship-btn{
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--cyan); color:var(--ink); font-weight:700; font-size:.96rem;
  padding:16px 36px; border-radius:8px;
  box-shadow:0 10px 30px rgba(192,145,92,.24);
  transition:transform var(--t-mid) var(--ease-p), background var(--t-mid) var(--ease-p), box-shadow var(--t-mid) var(--ease-p);
}
.flagship-btn:hover{ background:var(--cyan-dark); transform:translateY(-2px); box-shadow:0 16px 42px rgba(192,145,92,.36); }
.flagship-play{
  display:inline-flex; align-items:center; gap:9px;
  background:transparent; border:none; cursor:pointer; padding:6px 4px;
  color:var(--bone-dim); font-size:.92rem; font-weight:500; font-family:inherit;
  transition:color var(--t-mid) var(--ease-p), gap var(--t-mid) var(--ease-p);
}
.flagship-play svg{ color:var(--cyan-light); }
.flagship-play:hover{ color:var(--bone); gap:13px; }

@media (max-width:900px){
  .flagship-inner{ grid-template-columns:1fr; gap:38px; }
  .flagship-media{ aspect-ratio:16/12; max-height:60vh; }
  .flagship-desc{ max-width:none; }
  .flagship-glow{ left:50%; top:30%; }
}
@media (max-width:560px){
  .flagship-benefits li{ flex-direction:column; gap:4px; padding:14px 2px; }
  .flagship-benefits strong{ width:auto; }
  .flagship-cta{ flex-direction:column; align-items:stretch; }
  .flagship-btn{ width:100%; }
  .flagship-play{ justify-content:center; min-height:48px; }
}

/* ════════ REORDEN con Monumental entre Hero y modelos ════════ */
.phero{ order:1; } .trust-band{ order:2; } .flagship{ order:3; }
.innovation{ order:4; } .innovation-specs{ order:5; } .value-prop{ order:6; }
.audiences{ order:7; } .catalog{ order:8; } .pergola-hero{ order:9; }
.chain-section{ order:10; } .gallery{ order:11; } .testimonials{ order:12; }
.faq{ order:13; } .contact{ order:14; }

/* ════════════════════════════════════════════════════════════
   CRO · CONVERSIÓN A WHATSAPP
   ════════════════════════════════════════════════════════════ */

/* Reaseguro de precio bajo los CTA */
.cta-note{
  font-size:.82rem; color:var(--bone-dim2); letter-spacing:.01em; margin-top:16px;
}
.phero-note{ color:rgba(255,255,255,.74); }
.ispec-cta-dark .cta-note{ text-align:center; }

/* CTA por modelo dentro del reproductor */
.vlb-actions{ display:flex; flex-direction:column; align-items:center; gap:10px; margin-top:18px; }
.vlb-quote{
  display:inline-flex; align-items:center; gap:10px;
  background:#25D366; color:#fff; font-weight:700; font-size:.95rem;
  padding:14px 28px; border-radius:8px;
  transition:background var(--t-mid) var(--ease-p), transform var(--t-mid) var(--ease-p);
}
.vlb-quote:hover{ background:#1eb958; transform:translateY(-2px); }
.vlb-note{ font-size:.8rem; color:rgba(255,255,255,.55); text-align:center; margin:0; }

/* Pilares de confianza (reemplazan testimonios falsos) */
.testimonials-grid .testimonial-card{ gap:0; }
.testimonial-card .trust-pillar-icon{ width:30px; height:30px; color:var(--cyan-light); margin-bottom:18px; }
.testimonials-grid .testimonial-card h3{ font-size:1.12rem; font-weight:600; color:var(--bone); margin-bottom:10px; letter-spacing:-.01em; }
.testimonials-grid .testimonial-card p{ font-size:.95rem; font-weight:300; color:var(--bone-dim); line-height:1.7; margin:0; }
.trust-cta{ text-align:center; margin-top:50px; display:flex; flex-direction:column; align-items:center; gap:14px; }
.trust-cta-btn{
  display:inline-flex; align-items:center; gap:10px;
  background:#25D366; color:#fff; font-weight:700; font-size:1rem;
  padding:16px 36px; border-radius:8px;
  transition:background var(--t-mid) var(--ease-p), transform var(--t-mid) var(--ease-p);
}
.trust-cta-btn:hover{ background:#1eb958; transform:translateY(-2px); }
.trust-cta .cta-note{ margin-top:0; }

/* Barra fija de WhatsApp — solo móvil */
.wa-bar{ display:none; }
@media (max-width:768px){
  .wa-bar{
    display:flex; align-items:center; gap:12px;
    position:fixed; left:0; right:0; bottom:0; z-index:95;
    background:#25D366; color:#fff; padding:11px 18px;
    box-shadow:0 -6px 24px rgba(0,0,0,.35);
  }
  .wa-bar svg{ flex-shrink:0; }
  .wa-bar strong{ display:block; font-size:.95rem; font-weight:700; line-height:1.15; }
  .wa-bar small{ display:block; font-size:.7rem; opacity:.85; }
  /* el flotante circular se oculta: la barra lo reemplaza */
  .whatsapp-float{ display:none; }
  /* espacio para que la barra no tape el contenido final */
  body{ padding-bottom:62px; }
  .back-to-top{ bottom:74px; }
}

/* ════════ 13 · Miniaturas de video: recorte que oculta rótulos ════════ */
.imodel-thumb img.ithumb-yt{ transform:scale(1.18); object-position:center 32%; }
.imodel-card:hover .imodel-thumb img.ithumb-yt{ transform:scale(1.22); }
.imodel-thumb img.ithumb-hq.ithumb-yt{ transform:scale(1.24); }
.imodel-card:hover .imodel-thumb img.ithumb-hq.ithumb-yt{ transform:scale(1.28); }
