/* Fuentes propias de la web (antes se cargaban de Google Fonts, que bloqueaba el render).
   Subconjuntos latín y latín extendido. Archivos en /fonts/. Licencia SIL OFL. */
/* latin-ext */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/ibm-plex-mono-normal-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/ibm-plex-mono-normal-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/ibm-plex-sans-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/ibm-plex-sans-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/ibm-plex-sans-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/ibm-plex-sans-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/ibm-plex-sans-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 600;
  font-stretch: 100%;
  font-display: swap;
  src: url(../fonts/ibm-plex-sans-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/newsreader-italic-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: italic;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/newsreader-italic-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin-ext */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/newsreader-normal-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
  font-family: 'Newsreader';
  font-style: normal;
  font-weight: 500;
  font-display: optional;
  src: url(../fonts/newsreader-normal-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============================================================
   EduIngenio — hoja de estilo editorial (rediseño, oct 2026)
   Papel claro + los dos azules del logo + títulos con remates.
   Todo color, letra y medida sale de un token de :root.
   La usan: index.html (fase 1). Los cursos se suman en la fase 2.
   ============================================================ */

:root{
  /* papel y tinta */
  --paper:#F3EEE4;
  --paper-deep:#E9E2D4;
  --sheet:#FBF8F2;
  --ink:#1D1B17;
  --ink-soft:#4A463F;
  --muted:#645E54;
  --rule:rgba(29,27,23,.16);
  --rule-strong:#1D1B17;
  /* azules del logo: "Ingenio" #222366 · "Edu" #4861A7 */
  --brand:#222366;
  --brand-hover:#181A4F;
  --brand-2:#4861A7;
  --brand-tint:rgba(34,35,102,.07);
  --brand-3:#8FA3E3;
  --calido:#D9963A;
  --agua:#2F8C9B;
  --ia:#6D5BB5;
  /* estados */
  --ok:#2E6B3F;
  --danger:#9B2C22;
  /* alias: los usan estilos en línea viejos y el JS de la portada */
  --accent:var(--brand);
  --border:var(--rule);
  /* letras */
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,"Liberation Mono",monospace;
  /* movimiento */
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-in-out:cubic-bezier(.77,0,.175,1);
  /* grano de papel: ruido muy fino que quita el aspecto plano de pantalla */
  --grano:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .11 0 0 0 0 .1 0 0 0 0 .09 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E");
  --header-h:72px;
  /* aviso de cookies: js/consentimiento.js toma estas variables (las páginas
     que no las definen conservan sus colores de siempre) */
  --ck-bg:var(--sheet);
  --ck-fg:var(--ink);
  --ck-borde:var(--rule-strong);
  --ck-acento:var(--brand);
  --ck-hover:var(--brand-tint);
  --ck-sombra:0 12px 32px rgba(29,27,23,.16);
  --ck-radio:2px;
  --ck-font:var(--sans);
  --ck-foco:var(--brand-2);
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:var(--header-h);-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--grano),var(--paper);color:var(--ink);font:400 17px/1.6 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration-thickness:1px;text-underline-offset:3px}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:500;color:var(--ink);letter-spacing:-.015em}
p{margin:0}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brand-2);outline-offset:3px}
::selection{background:var(--brand);color:var(--paper)}
.ico{width:1em;height:1em;display:inline-block;vertical-align:-.14em;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
section{position:relative;padding:64px 0;overflow-x:clip}
section + section{border-top:1px solid var(--rule)}

/* ---------- títulos de sección ---------- */
.section-label{display:flex;align-items:center;gap:12px;margin-bottom:18px;font:500 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--brand-2)}
.section-label::before{content:"";width:28px;height:1px;background:currentColor}
.section-title{font-size:clamp(34px,5vw,56px);line-height:1.04;max-width:18ch;text-wrap:balance}
.section-desc{margin-top:16px;max-width:52ch;font-size:18px;color:var(--ink-soft)}

/* ---------- botones: al pasar el mouse un relleno barre de izquierda a derecha ---------- */
.btn-primary,.btn-secondary,.btn-carrito,.btn-herr,.btn-pagar,.nav-cta{
  position:relative;overflow:hidden;isolation:isolate;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:48px;padding:12px 22px;border:1.5px solid var(--brand);border-radius:2px;
  font:600 16px/1.2 var(--sans);letter-spacing:.005em;text-decoration:none;cursor:pointer;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:scale 160ms var(--ease-out),translate 280ms var(--ease-out),color 220ms ease,border-color 220ms ease,background-color 220ms ease}
.btn-primary::before,.btn-secondary::before,.btn-carrito::before,.btn-herr::before,.btn-pagar::before,.nav-cta::before{
  content:"";position:absolute;inset:0;z-index:-1;transform:scaleX(0);transform-origin:right center;transition:transform 420ms var(--ease-out)}
.btn-primary,.btn-pagar,.nav-cta{background:var(--brand);color:var(--paper)}
.btn-primary::before,.btn-pagar::before,.nav-cta::before{background:var(--brand-2)}
.btn-secondary,.btn-carrito,.btn-herr{background:transparent;color:var(--brand)}
.btn-secondary::before,.btn-carrito::before,.btn-herr::before{background:var(--brand)}
.btn-primary:active,.btn-secondary:active,.btn-carrito:active,.btn-herr:not(:disabled):active,.btn-pagar:active,.nav-cta:active{scale:.97}
.btn-primary .flecha{display:inline-block;transition:translate 220ms var(--ease-out)}
.btn-herr:disabled{cursor:not-allowed;color:var(--muted);border-color:var(--rule);background:transparent}
.btn-herr:disabled::before{display:none}
@media (hover:hover) and (pointer:fine){
  .btn-primary:hover::before,.btn-secondary:hover::before,.btn-carrito:hover::before,.btn-herr:not(:disabled):hover::before,.btn-pagar:hover::before,.nav-cta:hover::before{transform:scaleX(1);transform-origin:left center}
  .btn-primary:hover,.btn-pagar:hover,.nav-cta:hover{border-color:var(--brand-2)}
  .btn-secondary:hover,.btn-carrito:hover,.btn-herr:not(:disabled):hover{color:var(--paper)}
  .btn-primary:hover .flecha{translate:4px 0}
}

/* ---------- cabecera ---------- */
#mainNav{position:sticky;top:0;z-index:50;height:var(--header-h);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 20px;background:var(--paper);border-bottom:1px solid var(--rule);transition:transform 380ms var(--ease-out),border-color 160ms ease,background-color 200ms ease}
#mainNav.scrolled{border-bottom-color:var(--rule-strong);background:rgba(243,238,228,.94)}
#mainNav.oculto{transform:translateY(-101%)}
.progreso{position:absolute;left:0;right:0;bottom:-1px;height:2px;pointer-events:none}
.progreso span{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--brand-2) 70%,var(--brand-3));transform:scaleX(0);transform-origin:left center}
.nav-logo{display:flex;align-items:center;gap:14px;color:var(--ink);text-decoration:none}
.nav-logo-img{height:54px;width:auto}
.nav-logo-sub{display:none;max-width:22ch;padding-left:14px;border-left:1px solid var(--rule);font:500 12px/1.35 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.nav-links{display:none}
.hamburger{display:flex;flex-direction:column;justify-content:center;gap:6px;width:44px;height:44px;padding:11px 9px;background:none;border:0;cursor:pointer}
.hamburger span{display:block;height:1.5px;background:var(--ink);transition:transform 200ms var(--ease-out),opacity 150ms ease}
.hamburger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.mobile-menu{display:none;position:fixed;top:var(--header-h);left:0;right:0;z-index:49;padding:4px 20px 20px;background:var(--paper);border-bottom:1.5px solid var(--rule-strong)}
.mobile-menu.open{display:block}
.mobile-menu a{display:flex;align-items:center;gap:12px;min-height:56px;border-bottom:1px solid var(--rule);font:500 24px/1.2 var(--serif);color:var(--ink);text-decoration:none}
@media (min-width:640px){.nav-logo-sub{display:block}}
@media (min-width:1024px){
  #mainNav{padding:0 32px}
  .hamburger,.mobile-menu,.mobile-menu.open{display:none}
  .nav-links{display:flex;align-items:center;gap:28px}
  #mainNav.scrolled{background:rgba(243,238,228,.86);-webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px)}
  .nav-links a:not(.nav-cta){position:relative;padding:8px 0;font:500 15px/1 var(--sans);color:var(--ink-soft);text-decoration:none;transition:color 200ms ease}
  .nav-links a:not(.nav-cta)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--brand);transform:scaleX(0);transform-origin:right center;transition:transform 380ms var(--ease-out)}
  .nav-links a.active{color:var(--ink)}
  .nav-links a.active::after{transform:scaleX(1)}
  .nav-links .nav-wa{display:inline-flex;align-items:center;gap:8px}
  .nav-links .nav-cta{min-height:40px;padding:8px 16px;font-size:15px}
}
@media (min-width:1024px) and (hover:hover) and (pointer:fine){
  .nav-links a:not(.nav-cta):hover{color:var(--ink)}
  .nav-links a:not(.nav-cta):hover::after{transform:scaleX(1);transform-origin:left center}
}

/* ---------- portada ---------- */
.hero{position:relative;isolation:isolate;padding:40px 0 64px}
/* fondo del hero: cuadrícula de plano + halo azul + órbitas con puntos (como la red del logo) */
.hero-fondo{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.hero-fondo::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(34,35,102,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(34,35,102,.07) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(ellipse 75% 65% at 72% 36%,#000 15%,transparent 72%);mask-image:radial-gradient(ellipse 75% 65% at 72% 36%,#000 15%,transparent 72%)}
/* anillos que giran con una bolita cada uno: mismo efecto de la web publicada (7f5ecc2), en azules */
.hero-glow{position:absolute;top:20%;left:50%;transform:translateX(-50%);width:700px;height:400px;background:radial-gradient(ellipse,rgba(72,97,167,.14) 0%,transparent 70%);pointer-events:none;animation:glow-pulse 4s ease-in-out infinite}
.hero-glow2{position:absolute;bottom:10%;left:20%;width:300px;height:300px;background:radial-gradient(ellipse,rgba(143,163,227,.16) 0%,transparent 70%);pointer-events:none;animation:glow-pulse 6s ease-in-out infinite reverse}
.hero-ring{position:absolute;top:50%;left:50%;border-radius:50%;pointer-events:none}
.hero-ring-1{width:520px;height:520px;margin:-260px 0 0 -260px;border:1px solid rgba(34,35,102,.14);animation:ring-spin 45s linear infinite}
.hero-ring-1::before{content:"";position:absolute;top:-4px;left:50%;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:var(--brand);box-shadow:0 0 14px var(--brand)}
.hero-ring-2{width:820px;height:820px;margin:-410px 0 0 -410px;border:1px solid rgba(72,97,167,.12);animation:ring-spin 70s linear infinite reverse}
.hero-ring-2::before{content:"";position:absolute;top:-3px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--brand-2);box-shadow:0 0 12px var(--brand-2)}
.hero-ring-3{width:1150px;height:1150px;margin:-575px 0 0 -575px;border:1px solid rgba(143,163,227,.22);animation:ring-spin 100s linear infinite}
.hero-ring-3::before{content:"";position:absolute;top:-2.5px;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:var(--brand-3);box-shadow:0 0 10px var(--brand-3)}
.hero-inner{max-width:1200px;margin:0 auto;padding:0 20px}
.hero-titulo{font-size:clamp(42px,6vw,88px);line-height:1;letter-spacing:-.028em;text-wrap:balance}
.hero-linea{display:block}
.hero-titulo em{font-style:italic;color:var(--brand)}
.hero-cuerpo{display:grid;gap:36px;margin-top:32px}
.hero-desc{max-width:40ch;font-size:clamp(17px,1.5vw,20px);line-height:1.55;color:var(--ink-soft)}
.hero-btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-mosaico{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0}
.hero-mosaico{position:relative}
.hero-mosaico a{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--paper-deep);border:1px solid var(--rule);transition:translate 380ms var(--ease-out),scale 380ms var(--ease-out),box-shadow 380ms ease,border-color 200ms ease,opacity 300ms ease}
.hero-mosaico img{width:100%;height:100%;object-fit:cover;transition:scale 800ms var(--ease-out)}
.mosaico-titulo{position:absolute;left:0;right:0;bottom:0;padding:18px 10px 8px;background:linear-gradient(transparent,rgba(16,17,52,.88));color:#fff;font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;translate:0 101%;transition:translate 380ms var(--ease-out)}
.hero-mosaico a:focus-visible .mosaico-titulo{translate:0 0}
.hero-mosaico figcaption{grid-column:1/-1;font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
@media (hover:hover) and (pointer:fine){
  .hero-mosaico:hover a:not(:hover){opacity:.6}
  .hero-mosaico a:hover{z-index:2;translate:0 -6px;scale:1.04;border-color:var(--brand);box-shadow:0 20px 40px -18px rgba(34,35,102,.55)}
  .hero-mosaico a:hover img{scale:1.08}
  .hero-mosaico a:hover .mosaico-titulo{translate:0 0}
}
@media (max-width:479px){.hero-btns > a{flex:1 1 100%}}
@media (max-width:699px){.hero-mosaico a:nth-of-type(n+5){display:none}}
/* ficha técnica (cajetín de plano) con las cifras y las normas */
.hero-ficha{max-width:1200px;margin:48px auto 0;padding:0 20px}
.hero-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--sheet);border:1.5px solid var(--rule-strong)}
.hero-stat{padding:16px 10px 18px;border-right:1px solid var(--rule-strong)}
.hero-stat:last-child{border-right:0}
.hero-stat-num{font:500 clamp(36px,4.2vw,52px)/1 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.hero-stat-label{margin-top:10px;font:500 12px/1.35 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.hero-normas{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 18px;padding:14px 18px;background:var(--sheet);border:1.5px solid var(--rule-strong);border-top:0}
.hero-normas-titulo{font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.hero-normas-lista{display:flex;flex-wrap:wrap;margin:0;padding:0;list-style:none;font-size:14px;line-height:1.6;color:var(--ink-soft)}
.hero-normas-lista li:not(:last-child)::after{content:"·";margin:0 9px;color:var(--muted)}
@media (min-width:700px){
  .hero-mosaico{grid-template-columns:repeat(3,minmax(0,1fr))}
  .hero-stat{padding:20px 20px 22px}
  .hero-stat-label{letter-spacing:.08em}
}
@media (min-width:1024px){
  .hero{padding:72px 0 104px}
  .hero-inner,.hero-ficha{padding:0 32px}
  .hero-cuerpo{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;gap:56px;margin-top:44px}
  .hero-stat{padding:22px 24px 24px}
  .hero-normas{padding:16px 24px}
}

/* ---------- servicios ---------- */
.servicios-header,.cursos-header{margin-bottom:44px}
.servicios-grid{display:grid;border-top:1.5px solid var(--rule-strong)}
.servicio-card{display:flex;flex-direction:column;gap:14px;padding:28px 0 32px;border-bottom:1px solid var(--rule)}
.serv-icon{display:inline-grid;place-items:center;width:58px;height:58px;border:1px solid var(--rule-strong);border-radius:50%;font-size:26px;line-height:1;color:var(--brand);transition:rotate 600ms var(--ease-out),scale 400ms var(--ease-out),background-color 300ms ease,color 300ms ease,border-color 300ms ease}
.serv-title{font:500 28px/1.15 var(--serif);letter-spacing:-.01em}
.serv-desc{color:var(--ink-soft)}
.serv-tags{display:flex;flex-wrap:wrap;font:500 12px/1.6 var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
.serv-tag:not(:last-child)::after{content:"/";margin:0 10px;color:var(--rule-strong)}
.serv-link{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:44px;margin-top:auto;font-weight:600;color:var(--brand);text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}
.serv-link::after{content:"→";transition:transform 160ms var(--ease-out)}
.serv-title{transition:color 250ms ease}
@media (hover:hover) and (pointer:fine){
  .serv-link:hover::after{transform:translateX(3px)}
  .servicio-card:hover .serv-icon{rotate:-12deg;scale:1.08;background:var(--brand);border-color:var(--brand);color:var(--paper)}
  .servicio-card:hover .serv-title{color:var(--brand)}
}
@media (min-width:900px){
  .servicios-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .servicio-card{padding:28px 32px 32px;border-bottom:0;border-right:1px solid var(--rule)}
  .servicio-card:first-child{padding-left:0}
  .servicio-card:last-child{padding-right:0;border-right:0}
}

/* ---------- catálogo de cursos ---------- */
#cursos{background:var(--grano),var(--paper-deep)}
.cursos-header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.cursos-barra{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;margin-bottom:28px;padding-bottom:10px;border-bottom:1.5px solid var(--rule-strong)}
.curso-filter{display:flex;flex-wrap:wrap;gap:0 22px}
.filter-btn{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:10px 0;background:none;border:0;font:500 15px/1 var(--sans);color:var(--ink-soft);cursor:pointer;transition:color 200ms ease}
.filter-btn::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--brand);transform:scaleX(0);transform-origin:right center;transition:transform 380ms var(--ease-out)}
.filter-btn.active{color:var(--ink)}
.filter-btn.active::after{transform:scaleX(1)}
.filter-count{font:500 12px/1 var(--mono);color:var(--muted)}
@media (hover:hover) and (pointer:fine){.filter-btn:hover{color:var(--ink)}.filter-btn:hover::after{transform:scaleX(1);transform-origin:left center}}
.cursos-orden{display:flex;align-items:center;gap:10px}
.cursos-orden label{font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cursos-orden select,select.form-input{appearance:none;-webkit-appearance:none;background:var(--sheet) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%231D1B17' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 14px center/12px 8px;padding-right:40px;cursor:pointer}
.cursos-orden select{min-height:44px;padding:8px 40px 8px 12px;border:1px solid var(--rule-strong);border-radius:2px;font:500 15px/1.2 var(--sans);color:var(--ink)}
.cursos-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.curso-card{position:relative;isolation:isolate;display:flex;flex-direction:column;background:var(--sheet);border:1px solid var(--rule);transition:translate 400ms var(--ease-out),box-shadow 400ms ease,border-color 200ms ease}
.curso-card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(380px circle at var(--x,50%) var(--y,0%),rgba(72,97,167,.14),transparent 62%);opacity:0;transition:opacity 300ms ease}
@media (hover:hover) and (pointer:fine){
  .curso-card:hover{translate:0 -6px;border-color:var(--brand);box-shadow:0 24px 44px -24px rgba(34,35,102,.5)}
  .curso-card:hover::after{opacity:1}
  .curso-card:hover .curso-thumb img{scale:1.06}
}
.curso-thumb{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:var(--paper-deep);border-bottom:1px solid var(--rule)}
.curso-thumb img{width:100%;height:100%;object-fit:cover;transition:scale 800ms var(--ease-out)}
.curso-thumb-icon{display:grid;place-items:center;height:100%;font-size:48px;color:var(--brand)}
.curso-badge{position:absolute;top:12px;left:12px;padding:6px 8px;background:var(--paper);border:1px solid var(--rule-strong);font:500 12px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink)}
.curso-body{display:flex;flex:1;flex-direction:column;gap:10px;padding:20px 20px 22px}
.curso-cat{display:flex;align-items:center;gap:8px;font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--brand-2)}
.curso-cat::before{content:"";flex-shrink:0;width:8px;height:8px;border-radius:50%;background:var(--brand-2)}
.cat-estructural::before{background:var(--brand)}
.cat-bim::before{background:var(--brand-3)}
.cat-hidraulica::before{background:var(--agua)}
.cat-transportes::before{background:var(--calido)}
.cat-ia::before{background:var(--ia)}
.curso-titulo{font:500 22px/1.22 var(--serif);letter-spacing:-.01em}
.curso-titulo a{color:var(--ink);text-decoration:none}
.curso-meta{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:14px;color:var(--muted)}
.curso-meta span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.curso-meta b{font-weight:600;color:var(--ink-soft)}
.curso-mod-bonus{display:flex;align-items:flex-start;gap:8px;font-size:14px;line-height:1.45;color:var(--ink-soft)}
.curso-mod-bonus .ico{margin-top:2px;color:var(--brand)}
.curso-link{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;min-height:32px;font-size:15px;font-weight:600;color:var(--brand);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.curso-price-row{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:auto;padding-top:14px;border-top:1px solid var(--rule)}
.curso-price{font:500 34px/1 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.curso-price-old{margin-top:6px;font-size:13px;color:var(--muted)}
.curso-price-dscto{font:500 12px/1.3 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);text-align:right}
.btn-carrito{width:100%;margin-top:4px}
@media (hover:hover) and (pointer:fine){.curso-titulo a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}}
@media (min-width:700px){.cursos-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.cursos-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}

/* ---------- herramientas ---------- */
.herramientas-grid{margin-top:44px;border-top:1.5px solid var(--rule-strong)}
.herr-card{position:relative;isolation:isolate;display:grid;gap:10px;padding:24px 0;border-bottom:1px solid var(--rule)}
.herr-icon{font-size:26px;line-height:1;color:var(--brand)}
.herr-norma{font:500 12px/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.herr-title{font:500 26px/1.2 var(--serif)}
.herr-desc{max-width:62ch;color:var(--ink-soft)}
.btn-herr{justify-self:start}
.herr-card.is-soon .herr-icon,.herr-card.is-soon .herr-title{color:var(--muted)}
.herr-card::before{content:"";position:absolute;top:0;bottom:0;left:-20px;right:-20px;z-index:-1;background:var(--sheet);transform:scaleX(0);transform-origin:left center;transition:transform 500ms var(--ease-out)}
.herr-icon{transition:rotate 600ms var(--ease-out),scale 400ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){
  .herr-card:not(.is-soon):hover::before{transform:scaleX(1)}
  .herr-card:not(.is-soon):hover .herr-icon{rotate:-12deg;scale:1.1}
}
@media (min-width:900px){
  .herr-card{grid-template-columns:44px minmax(0,1fr) auto;grid-template-areas:"icono norma boton" "icono titulo boton" "icono desc boton";column-gap:24px;row-gap:6px;align-items:center;padding:28px 0}
  .herr-icon{grid-area:icono;align-self:start;padding-top:4px}
  .herr-norma{grid-area:norma}
  .herr-title{grid-area:titulo}
  .herr-desc{grid-area:desc}
  .btn-herr{grid-area:boton;align-self:center}
}

/* ---------- por qué ---------- */
.porque-grid{display:grid;margin-top:44px;border-top:1.5px solid var(--rule-strong)}
.porque-card{padding:24px 0;border-bottom:1px solid var(--rule)}
.porque-num{font:500 13px/1 var(--mono);letter-spacing:.08em;color:var(--brand-2)}
.porque-title{margin-top:14px;font:500 24px/1.2 var(--serif)}
.porque-desc{margin-top:8px;color:var(--ink-soft)}
@media (min-width:700px){
  .porque-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .porque-card{padding:28px 28px 28px 0}
  .porque-card:nth-child(2n){padding-left:28px;padding-right:0;border-left:1px solid var(--rule)}
}
@media (min-width:1100px){
  .porque-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .porque-card,.porque-card:nth-child(2n){padding:28px 24px;border-bottom:0;border-left:1px solid var(--rule)}
  .porque-card:first-child{padding-left:0;border-left:0}
  .porque-card:last-child{padding-right:0}
}

/* franja azul marino: color y contraste en medio de la página */
#porque{background:radial-gradient(900px 520px at 88% -10%,rgba(72,97,167,.55),transparent 62%),radial-gradient(700px 420px at -10% 110%,rgba(143,163,227,.18),transparent 60%),var(--brand);color:var(--paper);border-top:0;--muted:#B9C2E6;--rule:rgba(243,238,228,.16);--rule-strong:rgba(243,238,228,.5)}
#porque + section{border-top:0}
#porque .container{position:relative;z-index:1}
#porque .section-label{color:var(--brand-3)}
#porque .section-title{color:var(--paper)}
#porque .porque-num{font:500 46px/1 var(--serif);letter-spacing:-.02em;color:var(--brand-3);transition:color 300ms ease,translate 400ms var(--ease-out)}
#porque .porque-title{color:var(--paper)}
#porque .porque-desc{color:rgba(243,238,228,.8)}
@media (hover:hover) and (pointer:fine){#porque .porque-card:hover .porque-num{color:var(--paper);translate:0 -4px}}
.puntos{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.puntos span{position:absolute;width:var(--t,6px);height:var(--t,6px);border-radius:50%;background:var(--c,var(--brand-3));opacity:.6;box-shadow:0 0 12px var(--c,var(--brand-3));animation:flotar var(--d,14s) ease-in-out var(--r,0s) infinite alternate}

/* ---------- contacto ---------- */
.contacto-grid{display:grid;gap:40px;margin-top:44px}
.contacto-info h3{font:500 30px/1.15 var(--serif)}
.contacto-info > p{margin-top:12px;max-width:44ch;color:var(--ink-soft)}
.contacto-items{margin-top:28px;border-top:1px solid var(--rule)}
.contacto-item{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--rule)}
.ci-icon{display:grid;place-items:center;flex-shrink:0;width:44px;height:44px;border:1px solid var(--rule-strong);font-size:20px;color:var(--brand);transition:background-color 300ms ease,color 300ms ease,rotate 500ms var(--ease-out)}
@media (hover:hover) and (pointer:fine){.contacto-item:hover .ci-icon{background:var(--brand);color:var(--paper);rotate:-8deg}}
.contacto-form{display:grid;gap:18px;padding:24px;background:var(--sheet);border:1px solid var(--rule-strong)}
.form-row{display:grid;gap:18px}
.form-group{display:grid;gap:8px}
.form-label{font:600 14px/1.3 var(--sans);color:var(--ink)}
.form-input{width:100%;min-height:48px;padding:12px 14px;background:var(--paper);border:1px solid rgba(29,27,23,.42);border-radius:2px;font:400 16px/1.4 var(--sans);color:var(--ink);transition:border-color 150ms ease}
.form-input::placeholder{color:#857E72}
.form-input:focus{border-color:var(--brand)}
select.form-input{background-color:var(--paper)}
textarea.form-input{min-height:140px;resize:vertical}
.fc-trampa{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fc-consent{grid-template-columns:auto minmax(0,1fr);align-items:start;gap:12px;font-size:14px;line-height:1.5;color:var(--ink-soft)}
.fc-consent input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--brand)}
.fc-estado{min-height:1.4em;font-size:14px}
.fc-estado:empty{display:none}
.fc-estado.ok{color:var(--ok)}
.fc-estado.error{color:var(--danger)}
@media (min-width:700px){.form-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){
  .contacto-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:64px}
  .contacto-form{padding:32px}
}

/* ---------- pie ---------- */
footer{padding:56px 0 28px;background:var(--ink);color:var(--paper);--muted:#B5AE9F;--border:rgba(243,238,228,.24)}
.footer-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;max-width:1200px;margin:0 auto;padding:0 20px 28px;border-bottom:1px solid rgba(243,238,228,.18)}
.footer-brand{display:flex;align-items:center;gap:12px}
.footer-links{display:flex;flex-wrap:wrap;gap:0 24px}
.footer-links a{display:inline-flex;align-items:center;min-height:44px;font-weight:500;color:var(--paper);text-decoration:none}
.footer-bottom{max-width:1200px;margin:0 auto;padding:20px 20px 0;font-size:13px;line-height:1.8;color:#C9C2B4}
@media (hover:hover) and (pointer:fine){.footer-links a:hover{text-decoration:underline;text-underline-offset:5px}}
@media (min-width:1024px){.footer-inner{padding:0 32px 28px}.footer-bottom{padding:20px 32px 0}}

/* ---------- carrito ---------- */
.cart-fab{position:fixed;right:16px;bottom:16px;z-index:60;display:grid;place-items:center;width:56px;height:56px;background:var(--brand);color:var(--paper);border:0;border-radius:2px;font-size:22px;cursor:pointer;box-shadow:0 8px 24px rgba(29,27,23,.22);transition:scale 160ms var(--ease-out),translate 280ms var(--ease-out),background-color 200ms ease}
.cart-fab:active{scale:.94}
.cart-fab.pulso{animation:bump 420ms var(--ease-out)}
.cart-fab.pulso::after{content:"";position:absolute;inset:0;border:2px solid var(--brand);animation:onda 700ms var(--ease-out) forwards}
@media (hover:hover) and (pointer:fine){.cart-fab:hover{background:var(--brand-hover)}}
.cart-count{position:absolute;top:-8px;right:-8px;display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;background:var(--paper);color:var(--brand);border:1.5px solid var(--brand);border-radius:12px;font:600 12px/1 var(--mono)}
.cart-count.hidden{display:none}
.modal-overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center;background:rgba(29,27,23,.5);opacity:0;visibility:hidden;transition:opacity 160ms ease,visibility 0s linear 160ms}
.modal-overlay.open{opacity:1;visibility:visible;transition:opacity 200ms var(--ease-out)}
.modal{width:100%;max-width:560px;max-height:92vh;overflow:auto;background:var(--sheet);border:1px solid var(--rule-strong);transform:translateY(16px);transition:transform 240ms var(--ease-out)}
.modal-overlay.open .modal{transform:none}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px 20px;border-bottom:1.5px solid var(--rule-strong)}
.modal-title{display:flex;align-items:center;gap:10px;font:500 13px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}
.modal-close{display:grid;place-items:center;width:44px;height:44px;background:none;border:1px solid transparent;font-size:18px;color:var(--ink);cursor:pointer}
.modal-body{padding:8px 20px 24px}
.cart-empty{display:grid;justify-items:center;gap:10px;padding:28px 8px 8px;text-align:center;color:var(--ink-soft)}
.cart-empty-titulo{font:500 26px/1.2 var(--serif);color:var(--ink)}
.cart-empty .btn-secondary{margin-top:10px}
.cart-item{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--rule)}
.cart-item-name{font-size:15px;line-height:1.4}
.cart-item-price{font:500 20px/1 var(--serif);white-space:nowrap}
.cart-item-del{width:44px;height:44px;background:none;border:1px solid var(--rule);color:var(--ink-soft);cursor:pointer}
.cart-total{display:flex;align-items:baseline;justify-content:space-between;padding:18px 0;border-bottom:1.5px solid var(--rule-strong)}
.cart-total-num{font:500 34px/1 var(--serif);letter-spacing:-.02em}
.pagos-title{margin:22px 0 12px;font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.pagos-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pago-btn{display:flex;align-items:center;gap:8px;min-height:48px;padding:10px 12px;background:var(--paper);border:1px solid var(--rule-strong);font-size:15px;font-weight:500;cursor:pointer;transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease}
.pago-icon{display:inline-flex;color:var(--brand)}
.pago-btn.is-selected{background:var(--brand);border-color:var(--brand);color:var(--paper)}
.pago-btn.is-selected .pago-icon{color:var(--paper)}
.pago-instrucciones{display:none;margin-top:12px;padding:12px 14px;background:var(--brand-tint);border-left:3px solid var(--brand);font-size:14px;line-height:1.5}
.pago-instrucciones.show{display:block}
.btn-pagar{width:100%;margin-top:18px;letter-spacing:.08em}
@media (hover:hover) and (pointer:fine){
  .modal-close:hover{border-color:var(--rule-strong)}
  .cart-item-del:hover{border-color:var(--rule-strong);color:var(--ink)}
  .pago-btn:not(.is-selected):hover{background:var(--brand-tint)}
}
@media (min-width:480px){.pagos-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:700px){
  .modal-overlay{align-items:center;padding:24px}
  .modal{transform:scale(.97)}
}

/* ---------- aviso flotante ---------- */
.toast{position:fixed;left:50%;bottom:24px;z-index:120;max-width:calc(100vw - 32px);padding:12px 18px;background:var(--ink);color:var(--paper);font-size:15px;opacity:0;pointer-events:none;transform:translate(-50%,12px);transition:opacity 180ms ease,transform 220ms var(--ease-out)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- vida: entrada del hero, aparición al bajar, cinta de normas ---------- */
.js .hero-fondo{opacity:0;animation:entrar-fondo 1600ms var(--ease-out) 150ms forwards}
.js .hero-linea{opacity:0;transform:translateY(.4em);animation:entrar 900ms var(--ease-out) forwards}
.js .hero-linea + .hero-linea{animation-delay:120ms}
.js .hero-desc{opacity:0;transform:translateY(18px);animation:entrar 800ms var(--ease-out) 260ms forwards}
.js .hero-btns{opacity:0;transform:translateY(18px);animation:entrar 800ms var(--ease-out) 360ms forwards}
.js .hero-mosaico a{opacity:0;transform:translateY(18px) scale(.96);animation:entrar 800ms var(--ease-out) forwards;animation-delay:calc(420ms + var(--n,0) * 80ms)}
.js .hero-mosaico figcaption{opacity:0;animation:entrar 600ms var(--ease-out) 950ms forwards}
.js .hero-ficha{opacity:0;transform:translateY(24px);animation:entrar 900ms var(--ease-out) 600ms forwards}
.hero-mosaico a:nth-of-type(2){--n:1}
.hero-mosaico a:nth-of-type(3){--n:2}
.hero-mosaico a:nth-of-type(4){--n:3}
.hero-mosaico a:nth-of-type(5){--n:4}
.hero-mosaico a:nth-of-type(6){--n:5}
/* lo que aparece al bajar: el JS de la portada marca .visible al entrar en pantalla */
.js .fade-up,.js .fade-left,.js .fade-right{opacity:0;transition:opacity 900ms var(--ease-out),transform 900ms var(--ease-out)}
.js .fade-up{transform:translateY(36px)}
.js .fade-left{transform:translateX(-36px)}
.js .fade-right{transform:translateX(36px)}
.js .fade-up.visible,.js .fade-left.visible,.js .fade-right.visible{opacity:1;transform:none}
.js .fade-up .section-label::before{transform:scaleX(0);transform-origin:left center;transition:transform 900ms var(--ease-out) 250ms}
.js .fade-up.visible .section-label::before{transform:scaleX(1)}
/* tarjetas de curso: js/movimiento.js agrega .anim y las revela de a tres */
.anim .curso-card.aparecer{opacity:0;transform:translateY(40px);transition:opacity 800ms var(--ease-out) calc(var(--i,0) * 90ms),transform 800ms var(--ease-out) calc(var(--i,0) * 90ms),translate 400ms var(--ease-out),box-shadow 400ms ease,border-color 200ms ease}
.anim .curso-card.aparecer.visible{opacity:1;transform:none}
/* cinta de normas que se desliza sola (se detiene con el mouse encima) */
.cinta{flex:1 1 320px;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.hero-normas-lista.en-cinta{flex-wrap:nowrap;width:max-content;white-space:nowrap;animation:cinta 50s linear infinite}
.hero-normas-lista.en-cinta li::after{content:"·";margin:0 9px;color:var(--muted)}
.hero-normas:hover .en-cinta{animation-play-state:paused}
@keyframes entrar{to{opacity:1;transform:none}}
@keyframes entrar-fondo{to{opacity:1}}
@keyframes glow-pulse{0%,100%{opacity:.7;transform:translateX(-50%) scale(1)}50%{opacity:1;transform:translateX(-50%) scale(1.1)}}
@keyframes ring-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes flotar{from{transform:translate(0,0)}to{transform:translate(var(--dx,30px),var(--dy,-40px))}}
@keyframes cinta{to{transform:translateX(-50%)}}
@keyframes bump{0%{scale:1}35%{scale:1.14}100%{scale:1}}
@keyframes onda{from{opacity:.7;transform:scale(1)}to{opacity:0;transform:scale(1.7)}}

/* ---------- escritorio: más aire ---------- */
@media (min-width:1024px){
  .container{padding:0 32px}
  section{padding:104px 0}
}

/* ---------- movimiento reducido: nada se desplaza; todo se ve completo desde el inicio ---------- */
@media (prefers-reduced-motion:reduce){
  .btn-primary:active,.btn-secondary:active,.btn-carrito:active,.btn-herr:active,.btn-pagar:active,.nav-cta:active,.cart-fab:active{scale:none}
  .btn-primary::before,.btn-secondary::before,.btn-carrito::before,.btn-herr::before,.btn-pagar::before,.nav-cta::before{transition:none}
  .btn-primary .flecha,.serv-link::after,.hamburger span{transition:none}
  .modal,.modal-overlay.open .modal{transform:none;transition:none}
  .toast,.toast.show{transform:translate(-50%,0);transition:opacity 180ms ease}
  .js .hero-fondo,.js .hero-linea,.js .hero-desc,.js .hero-btns,.js .hero-mosaico a,.js .hero-mosaico figcaption,.js .hero-ficha{opacity:1;transform:none;animation:none}
  .js .fade-up,.js .fade-left,.js .fade-right{opacity:1;transform:none;transition:none}
  .js .fade-up .section-label::before{transform:none}
  .hero-glow,.hero-glow2,.hero-ring,.puntos span,.cart-fab.pulso,.cart-fab.pulso::after{animation:none}
  #mainNav{transition:none}
  .curso-card:hover,.hero-mosaico a:hover,.hero-mosaico a:hover img,.curso-card:hover .curso-thumb img{translate:none;scale:none}
  .servicio-card:hover .serv-icon,.herr-card:hover .herr-icon,.contacto-item:hover .ci-icon,#porque .porque-card:hover .porque-num{rotate:none;scale:none;translate:none}
}