/* GDP · mejoras de UI/UX (capa encima de gdp.css y gdp-ux.css) */

/* 1. Móvil: ninguna página debe desplazarse en horizontal (Academia desbordaba a 838px) */
html,body{max-width:100%}
.lms-toolbar-fila,.lms-buscador-top,.lms-toolbar-fila>*{min-width:0;max-width:100%}
.lms-buscador-top{flex:1 1 220px}
.lms-buscador-top input{width:100%}

/* 2. Accesos rápidos: centrar la última fila incompleta */
.acc{justify-content:center}

/* 3. Aviso de TikTok Live y botón de WhatsApp: no tapar el contenido en móvil */
@media(max-width:639px){
  .live-fab{left:12px;right:84px;bottom:12px;max-width:none}
  .wa-fab{right:12px;bottom:12px}
  body{padding-bottom:84px}
}

/* 4. Foco visible y objetivos táctiles de 44px mínimo */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #0B4FA0;outline-offset:3px}
.live-fab-close,.cmd-btn{min-width:44px;min-height:44px}

/* 5. Legibilidad: ancho de línea cómodo y ritmo de párrafos */
main p{max-width:68ch}
main :is(.hero,.hero2,.cabeza) p{max-width:56ch}

/* 6. Respeto a quien prefiere menos movimiento */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}

/* 7. Portada: accesos rápidos. Escritorio = 5 (Canal WhatsApp, Asesoría inicial, Perfilador, Academia GDP, Vive Sabana) · Celular = primeros 3 */
@media(max-width:720px){
  .acc-pc{display:none}
  .acc{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:420px!important}
  .acc a{font-size:13px!important;line-height:1.25!important;gap:9px!important;white-space:normal!important}
}

/* 8. Pie de página: sin cuña blanca. El techo se dibuja hacia arriba y las esquinas
      quedan transparentes, así se ve el color de la sección anterior. */
.site-f{clip-path:none!important;box-shadow:none!important;margin-top:0!important;padding-top:64px!important;position:relative}
.site-f::before{content:"";position:absolute;left:0;right:0;bottom:calc(100% - 1px);height:35px;background:#001731;clip-path:polygon(0 100%,50% 0,100% 100%);pointer-events:none}

/* 9. Tarjetas de servicios (portada): imagen completa y cuadrada, sin zoom ni recortes */
.paso-media,.paso-wide .paso-media{aspect-ratio:1/1!important}
.paso-img,.paso-media img{object-fit:contain!important;object-position:center!important}
.paso-icon{transition:transform .2s cubic-bezier(.23,1,.32,1)}
@media(hover:hover) and (pointer:fine){
.paso:hover .paso-media img{transform:none!important;filter:none!important}
.paso:hover{transform:translateY(-5px)!important}
.paso:hover .paso-media::after{transform:translateX(120%);transition:transform .6s cubic-bezier(.22,.8,.3,1)}
.paso:hover .paso-icon{transform:translateY(-3px)!important}
.paso:hover .paso-links a:first-child .i{transform:translateX(5px)}
}

/* Nueva animación: la tarjeta se eleva, un brillo suave cruza la foto y el ícono "salta" */
.paso-media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.38) 50%,transparent 65%);
  transform:translateX(-120%)}
.paso-media{transition:none}
.paso:active{transform:scale(.985)!important}
@media(prefers-reduced-motion:reduce){.paso-icon{transition:none}.paso-media::after{display:none}}

/* 10. Portada · Canal de WhatsApp: bloque de texto y botón "Unirme al canal" centrados */
.wa-g>div:first-child{text-align:center}
.wa-g .wa-p{margin-left:auto;margin-right:auto}
.wa-g .btn{display:inline-flex;justify-content:center;margin-left:auto;margin-right:auto}
@media(max-width:720px){.wa-g .btn{display:flex;width:min(100%,340px)}}

/* 11. Encabezado: el botón "Escríbenos" se comprimía y recortaba su texto */
.h-cta{flex:0 0 auto;white-space:nowrap}

/* 9. Accesos rápidos: mismo diseño que las redes, con naranja como color principal */
.accesos .accesos-t{display:block!important;margin:0 auto!important;max-width:24ch;text-align:center;text-transform:none!important;white-space:normal!important;letter-spacing:-.03em!important;font-size:clamp(1.5rem,4vw,2.25rem)!important;font-weight:800;line-height:1.15;color:#00234C!important;text-wrap:balance}
.accesos .ar-list{list-style:none;margin:36px auto 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:22px 12px;max-width:760px}
.accesos .ar-item{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;text-decoration:none;color:#00234C;-webkit-tap-highlight-color:transparent}
.accesos .ar-av{position:relative;display:block;width:84px;height:84px;border-radius:50%;padding:5px;background:linear-gradient(135deg,#FFD2AE,#F3730C);box-shadow:0 14px 28px -16px rgba(221,87,0,.6);transition:transform .25s cubic-bezier(.23,1,.32,1)}
.accesos .ar-ico{display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:linear-gradient(135deg,#F3730C 0%,#F26B00 48%,#DD5700 100%);color:#fff;border:3px solid #fff}
.accesos .ar-ico .i{width:34px;height:34px;stroke-width:1.8}
.accesos .ar-badge{position:absolute;right:-3px;bottom:-2px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#fff;box-shadow:0 4px 12px rgba(0,35,76,.25)}
.accesos .ar-badge::before{content:"";position:absolute;inset:3px;border-radius:50%;background:linear-gradient(150deg,#00234C,#0B3A75)}
.accesos .ar-b{position:relative;width:12px;height:12px;color:#fff;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.accesos .ar-item strong{margin-top:10px;font-size:0.875rem;font-weight:700;line-height:1.25;color:#00234C;text-wrap:balance}
.accesos .ar-item small{font-size:0.875rem;font-weight:600;color:#C95A00}
.accesos .ar-item:focus-visible{outline:3px solid #00234C;outline-offset:6px;border-radius:14px}
@media (hover:hover){.accesos .ar-item:hover .ar-av{transform:translateY(-4px)}}
@media(max-width:720px){
  .accesos .ar-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 8px;max-width:380px}
  .accesos .ar-av{width:68px;height:68px}
  .accesos .ar-ico .i{width:27px;height:27px}
  .accesos .ar-badge{width:24px;height:24px}
  .accesos .ar-item strong{font-size:0.875rem;margin-top:9px}
  .accesos .ar-item small{font-size:0.75rem}
}
@media(prefers-reduced-motion:reduce){.accesos .ar-av{transition:none}}

/* 10. Canal de WhatsApp: más aire arriba y abajo */
section.wa{padding:var(--space-section) 0!important}
section.sec.accesos{padding:var(--space-block) 0!important}
section.ruta{padding:var(--space-block) 0!important}

/* Espacio reservado para el formulario de Builderall (se oculta solo al pegar el código dentro) */
.form-slot{width:100%;min-height:360px}
.form-slot:empty{display:grid;place-items:center;padding:32px;border:1.5px dashed rgba(255,255,255,.35);border-radius:20px;background:rgba(255,255,255,.06);color:#CFDAE8;text-align:center}
.form-slot:empty::before{content:"Aquí va el formulario de Builderall";font-weight:600}

/* Herramientas: portada con tarjetas */
.tools{padding:clamp(40px,6vw,72px) 0 var(--space-block-lg,96px)}
.tools-head{max-width:640px;margin:0 0 clamp(32px,5vw,56px);animation:tools-up .6s var(--ease,cubic-bezier(.23,1,.32,1)) both}
.tools-head p{margin:16px 0 0;color:var(--gris,#55677D);font-size:1.125rem;line-height:1.6}
.tools-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:24px}
.tool-card{display:flex;flex-direction:column;align-items:flex-start;gap:12px;height:100%;padding:32px;border:1px solid var(--linea,#DCE4EF);border-radius:var(--r-card,20px);background:#fff;color:#00234C;text-decoration:none;animation:tools-up .6s var(--ease,cubic-bezier(.23,1,.32,1)) .1s both;transition:border-color .2s ease,box-shadow .2s ease,transform .2s var(--ease,cubic-bezier(.23,1,.32,1))}
.tool-ico{display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#F3730C 0%,#F26B00 48%,#DD5700 100%);color:#fff;border:4px solid #fff;box-shadow:0 0 0 3px #FFD2AE,0 14px 28px -16px rgba(221,87,0,.6)}
.tool-ico svg{width:28px;height:28px}
.tool-tag{margin-top:8px;color:#0B4FA0;font-size:.875rem;font-weight:600}
.tool-t{margin:0;font-size:1.5rem;font-weight:800;letter-spacing:-.02em;line-height:1.2}
.tool-d{margin:0;color:var(--gris,#55677D);font-size:1rem;line-height:1.6}
.tool-cta{display:inline-flex;align-items:center;margin-top:12px;min-height:52px;padding:0 24px;border-radius:var(--r-btn,12px);background:linear-gradient(135deg,#F3730C 0%,#F26B00 48%,#DD5700 100%);color:#fff;font-size:1.125rem;font-weight:700}
.tool-card:active{transform:scale(.99)}
.tool-card:focus-visible{outline:3px solid #00234C;outline-offset:4px}
@media(hover:hover) and (pointer:fine){.tool-card:hover{border-color:#B7C9E2;box-shadow:0 24px 40px -28px rgba(0,35,76,.45);transform:translateY(-2px)}}
@keyframes tools-up{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(max-width:639px){.tool-card{padding:24px}}
@media(prefers-reduced-motion:reduce){.tools-head,.tool-card{animation:none}}
