/* ===========================================================
   Re:Cycla — páginas de destino de los anuncios de ChatGPT
   /chatgpt/<grupo>. Compactas: portada corta, prendas, pruebas
   y el formulario de dos pasos (el mismo de la portada).
   Se apoyan en estilo.css y formulario.css; aquí solo lo propio.
   =========================================================== */

/* menú: logo y "Cotizar" también en teléfono */
.lp .nav-cta{display:inline-flex;align-items:center;min-height:40px;padding:0 18px;border-radius:999px;
  background:var(--naranja);color:var(--fondo);font-weight:700;font-size:15px;text-decoration:none}

/* ---------- portada corta ---------- */
.lp-heroe{position:relative;padding:var(--nav) var(--g) 30px;padding-top:calc(var(--nav) + env(safe-area-inset-top))}
.escena{position:relative;height:clamp(200px,30vh,250px);margin:0 calc(-1 * var(--g))}
.escena img{position:absolute;width:auto;max-width:none}
.escena .pri{left:50%;top:6px;height:calc(100% - 6px);transform:translateX(-50%)}
.escena .sec{height:50%;bottom:4%}
.escena .s1{left:calc(50% + 46px)}
.escena .s2{right:calc(50% + 46px)}
.escena::after{content:"";position:absolute;left:0;right:0;bottom:0;height:38%;pointer-events:none;
  background:linear-gradient(180deg,rgba(11,11,12,0) 0%,var(--fondo) 100%)}
/* variante con foto (pádel, club, agencias) */
.escena.con-foto{margin:0;border-radius:14px;overflow:hidden}
.escena.con-foto img{position:static;width:100%;height:100%;object-fit:cover;transform:none}
.escena.con-foto::after{height:45%}

.lp-heroe .texto{position:relative;z-index:2;margin-top:-26px;max-width:680px;margin-left:auto;margin-right:auto}
.lp-heroe .chips{margin-bottom:16px;gap:6px}
.lp-heroe .chips li{font-size:12.5px;padding:4px 10px}
.lp-heroe .chips .insignia{font-size:11px;padding:5px 10px}
.lp-heroe .raya{margin-bottom:12px}
.lp-heroe h1.tit{font-size:min(32px,8.4vw)}
.lp-heroe .parr{margin-top:10px;font-size:15.5px}
.acciones{display:grid;gap:10px;margin-top:20px}
.acciones .btn-nar{min-height:50px;text-decoration:none}
.btn-wa{display:flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 20px;white-space:nowrap;border-radius:999px;
  font-size:15.5px;font-weight:700;color:var(--blanco);text-decoration:none;border:1.5px solid #25D366;background:rgba(37,211,102,.08);
  transition:background-color .18s}
.btn-wa svg{width:20px;height:20px;flex:none;color:#25D366}
.btn-wa:hover{background:rgba(37,211,102,.16)}

/* ---------- prendas y pruebas ---------- */
.lp-prendas{padding:30px var(--g) 34px;border-top:1px solid var(--linea)}
.lp-prendas .bloque{max-width:680px;margin:0 auto}
.lp-prendas h2.tit{font-size:min(24px,6.4vw)}
.lp .kit{grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:12px 8px;margin-top:16px;max-width:none}
.lp .kit img{max-height:none;min-height:0}
.lp .kit b{font-size:13px;margin-top:4px}
.lp .kit span{font-size:12px}

.pruebas{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:22px}
.prueba{background:var(--panel);border-left:3px solid var(--naranja);border-radius:0 10px 10px 0;padding:10px 12px;
  font-size:13px;line-height:1.35;color:var(--texto)}
.prueba b{display:block;font-family:'Excon','Satoshi',system-ui,sans-serif;font-size:16px;letter-spacing:-0.01em;color:var(--blanco);margin-bottom:2px}
.prueba .sellitos{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.prueba .sellitos img{height:26px;width:auto}

/* ---------- formulario ---------- */
.lp-cotiza{padding:34px var(--g) 40px;border-top:1px solid var(--linea);scroll-margin-top:var(--nav)}
.lp-cotiza .cotiza-in{max-width:680px;margin:0 auto;display:grid;gap:20px}
.lp-cotiza h2.tit{font-size:min(26px,6.8vw)}
.lp-cotiza .parr{font-size:15px}
.lp-cotiza .forma{grid-area:auto;margin-top:0}
.lp-cotiza .alterna{display:grid;gap:8px}
.lp-cotiza .alterna p{font-size:13.5px;color:var(--gris);text-align:center}
.lp-cotiza .destacado{margin-top:0;font-size:14.5px;color:var(--texto)}
.ya-marcado{font-size:13.5px;line-height:1.45;color:var(--texto);padding:10px 12px;border-radius:10px;
  background:rgba(248,72,8,.08);border:1px solid rgba(248,72,8,.35)}
.ya-marcado b{color:var(--blanco)}

.lp .pie{line-height:1.6}
.lp .pie span{display:block}

/* ===================== TABLETA ===================== */
@media (min-width:600px){
  .lp-heroe{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);align-items:center;gap:24px;
    padding-top:calc(var(--nav) + 28px);padding-bottom:36px}
  .lp-heroe .texto{margin:0;max-width:none;order:1}
  .escena{order:2;height:340px;margin:0}
  .escena::after{display:none}
  .escena .pri{top:0;height:100%}
  .escena .sec{height:46%;bottom:0}
  .escena .s1{left:auto;right:-6px}
  .escena .s2{right:auto;left:-6px}
  .lp-heroe h1.tit{font-size:40px}
  .acciones{display:flex;flex-wrap:wrap;gap:10px}
  .acciones .btn-nar{width:auto;padding:0 26px}
  .lp-prendas .bloque,.lp-cotiza .cotiza-in{max-width:none}
  .lp-prendas h2.tit{font-size:28px}
  .lp .kit{max-width:620px}
  .lp .kit img{max-width:150px;margin:0 auto}
  .pruebas{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
  .lp-cotiza h2.tit{font-size:32px}
  .lp .pie span{display:inline}
  .lp .pie span + span::before{content:" · "}
}

/* ===================== COMPUTADORA ===================== */
@media (min-width:1024px){
  .lp-heroe,.lp-prendas,.lp-cotiza{padding-left:max(var(--g),calc((100% - 1240px) / 2));padding-right:max(var(--g),calc((100% - 1240px) / 2))}
  .lp-heroe{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;min-height:min(70svh,620px);
    padding-top:calc(var(--nav) + 36px);padding-bottom:40px}
  .escena{height:min(58svh,520px)}
  .lp-heroe h1.tit{font-size:clamp(42px,3.7vw,56px)}
  .lp-heroe .parr{font-size:17px;max-width:560px}
  .acciones{margin-top:26px}

  .lp-prendas{padding-top:44px;padding-bottom:48px}
  .lp-prendas .bloque{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:end}
  .lp .kit{max-width:none}
  .lp .kit img{max-width:none;max-height:190px}
  .pruebas{grid-template-columns:1fr 1fr;margin-top:0}
  .prueba{padding:14px 16px;font-size:14px}
  .prueba b{font-size:18px}

  .lp-cotiza{padding-top:56px;padding-bottom:64px}
  .lp-cotiza .cotiza-in{grid-template-columns:minmax(0,1fr) minmax(380px,480px);grid-template-rows:auto 1fr;gap:24px 64px;align-items:start}
  .lp-cotiza .cotiza-texto{grid-column:1;grid-row:1}
  .lp-cotiza .forma{grid-column:2;grid-row:1 / span 2;align-self:start;max-width:none;justify-self:stretch}
  .lp-cotiza .alterna{grid-column:1;grid-row:2;align-self:start;max-width:420px}
  .lp-cotiza .alterna p{text-align:left}
  .lp-cotiza h2.tit{font-size:clamp(36px,3vw,46px)}
  .lp-cotiza .parr{font-size:16.5px}
}
/* iPad Pro de pie: nada a pantalla completa */
@media (min-width:1024px) and (orientation:portrait){
  .lp-heroe{min-height:0}
  .escena{height:420px}
}