/* ACP Datos — capa de movimiento y adaptación móvil */
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
img,svg{max-width:100%}
:focus-visible{outline:2px solid #2DD4BF;outline-offset:3px}

/* ---------- Encabezado fijo ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,26,47,.82);-webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid transparent;transition:background .3s ease,border-color .3s ease,box-shadow .3s ease}
.site-header.is-scrolled{background:rgba(10,26,47,.96);border-bottom-color:#22344F;box-shadow:0 10px 30px -18px rgba(0,0,0,.6)}
.site-header header{transition:padding .3s ease}
.site-header.is-scrolled header{padding-top:12px!important;padding-bottom:12px!important}
.site-header header > a:first-child svg{transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.site-header header > a:first-child:hover svg{transform:rotate(-8deg) scale(1.08)}

/* enlaces del menú: subrayado animado */
.site-header nav a{position:relative;transition:color .2s ease}
.site-header nav a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:#2DD4BF;transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2,.8,.2,1)}
.site-header nav a:hover,.site-header nav a.is-active{color:#F4F5F2!important}
.site-header nav a:hover::after,.site-header nav a.is-active::after{transform:scaleX(1)}

/* botón hamburguesa */
.menu-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #3A4E6A;border-radius:6px;background:transparent;color:#F4F5F2;cursor:pointer;padding:0}
.menu-toggle span{position:relative;display:block;width:20px;height:2px;background:currentColor;transition:background .2s ease}
.menu-toggle span::before,.menu-toggle span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor;transition:transform .3s cubic-bezier(.2,.8,.2,1),top .3s ease}
.menu-toggle span::before{top:-6px}.menu-toggle span::after{top:6px}
.site-header.menu-open .menu-toggle span{background:transparent}
.site-header.menu-open .menu-toggle span::before{top:0;transform:rotate(45deg)}
.site-header.menu-open .menu-toggle span::after{top:0;transform:rotate(-45deg)}

/* ---------- Franja del curso ---------- */
.promo-bar{position:relative;overflow:hidden}
.promo-bar::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);animation:shine 5s ease-in-out infinite}
@keyframes shine{0%,60%{left:-40%}100%{left:120%}}
.pulse{position:relative}
.pulse::before{content:"";position:absolute;inset:-3px;border-radius:5px;border:2px solid #0A1A2F;opacity:0;animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{transform:scale(.9);opacity:.6}100%{transform:scale(1.25);opacity:0}}

/* ---------- Héroe ---------- */
.hero-in > *{opacity:0;transform:translateY(22px);animation:rise .9s cubic-bezier(.2,.8,.2,1) forwards}
.hero-in > *:nth-child(1){animation-delay:.05s}.hero-in > *:nth-child(2){animation-delay:.15s}.hero-in > *:nth-child(3){animation-delay:.27s}.hero-in > *:nth-child(4){animation-delay:.39s}.hero-in > *:nth-child(5){animation-delay:.5s}
@keyframes rise{to{opacity:1;transform:none}}
.status-card{animation:floaty 7s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.status-row{opacity:0;transform:translateX(16px);animation:slidein .6s cubic-bezier(.2,.8,.2,1) forwards}
.status-row > span:last-child{transition:transform .2s ease}
.status-row:hover > span:last-child{transform:scale(1.08)}
@keyframes slidein{to{opacity:1;transform:none}}

/* ---------- Franja de marcos normativos: carrusel continuo ---------- */
.ticker{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ticker-track{display:flex!important;flex-wrap:nowrap!important;width:max-content;gap:56px!important;justify-content:flex-start!important;animation:ticker 32s linear infinite;max-width:none!important}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track span{white-space:nowrap}
@keyframes ticker{to{transform:translateX(-50%)}}

/* ---------- Aparición al desplazarse ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:var(--d,0s)}
.reveal.is-visible{opacity:1;transform:none}

/* ---------- Tarjetas y botones ---------- */
.lift{transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease}
.lift:hover{transform:translateY(-6px);box-shadow:0 22px 40px -24px rgba(10,26,47,.45)}
.btn{transition:transform .2s ease,box-shadow .25s ease,background-color .2s ease,filter .2s ease}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px -12px rgba(0,0,0,.45);filter:brightness(1.05)}
.btn:active{transform:translateY(0)}
.step-num{transition:color .4s ease,transform .4s cubic-bezier(.2,.8,.2,1)}
.step:hover .step-num{color:#0F766E!important;transform:translateX(6px)}
input,textarea{transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}
input:focus,textarea:focus{outline:none;border-color:#0F766E!important;background:#FFFFFF!important;box-shadow:0 0 0 4px rgba(15,118,110,.15)}

/* ---------- Botón flotante de WhatsApp ---------- */
.wa-fab{position:fixed;right:20px;bottom:20px;z-index:60;display:flex;align-items:center;gap:10px;height:56px;padding:0 18px 0 16px;border-radius:28px;background:#25D366;color:#0A1A2F;font:600 15px/1 'IBM Plex Sans',system-ui,sans-serif;text-decoration:none;box-shadow:0 14px 30px -12px rgba(0,0,0,.5);transform:translateY(120px);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .2s ease}
.wa-fab.is-shown{transform:none}
.wa-fab:hover{box-shadow:0 18px 36px -12px rgba(0,0,0,.6)}
.wa-fab svg{flex:none}
.to-top{position:fixed;right:20px;bottom:88px;z-index:60;width:44px;height:44px;border-radius:22px;border:1px solid #3A4E6A;background:#0A1A2F;color:#F4F5F2;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity .3s ease,transform .3s ease}
.to-top.is-shown{opacity:1;pointer-events:auto;transform:none}

/* ---------- Móvil y tableta ---------- */
@media (max-width:960px){
  .site-header header{flex-wrap:nowrap!important;gap:12px!important}
  .menu-toggle{display:inline-flex;order:3}
  .site-header nav{display:none!important;position:absolute;left:0;right:0;top:100%;flex-direction:column!important;gap:0!important;padding:8px 24px 24px;background:#0A1A2F;border-bottom:1px solid #22344F;box-shadow:0 24px 40px -20px rgba(0,0,0,.6)}
  .site-header.menu-open nav{display:flex!important;animation:drop .35s cubic-bezier(.2,.8,.2,1)}
  .site-header nav a{display:flex!important;align-items:center;min-height:52px;font-size:17px!important;border-bottom:1px solid #1B3050}
  .site-header nav a::after{display:none}
  .site-header header > a.hdr-cta{margin-left:auto}
  @keyframes drop{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
}
@media (max-width:640px){
  [style*="padding: 112px 24px"],[style*="padding: 96px 24px"]{padding-top:64px!important;padding-bottom:64px!important}
  [style*="padding: 72px 24px 96px"],[style*="padding: 56px 24px 88px"]{padding-top:40px!important;padding-bottom:56px!important}
  [style*="padding: 72px 24px"],[style*="padding: 88px 24px"]{padding-top:56px!important;padding-bottom:56px!important}
  [style*="margin-bottom: 56px"]{margin-bottom:36px!important}
  [style*="padding: 36px"]{padding:24px!important}
  [style*="padding: 36px 32px"]{padding:28px 22px!important}
  [style*="gap: 56px"]{gap:36px!important}
  .site-header header > a.hdr-cta{display:none!important}
  .site-header header > a.hdr-back{font-size:14px!important}
  .promo-bar{font-size:13px!important;padding:8px 16px!important}
  .wa-fab{padding:0;width:56px;justify-content:center}
  .wa-fab .wa-label{display:none}
  .status-card{animation:none}
  h1{word-break:normal;overflow-wrap:anywhere}
}

/* ---------- Movimiento reducido ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal,.hero-in > *,.status-row{opacity:1!important;transform:none!important}
  .ticker-track{flex-wrap:wrap!important;width:auto}
}
