/* =========================================================================
   EUROPREV — prevención de riesgos laborales
   Verde y naranja del logo; el marco naranja de «PREV» es el motivo de la web.
   ========================================================================= */

@font-face{font-family:'Jost';font-style:normal;font-weight:100 900;font-display:swap;src:url('../fonts/jost-var-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}
@font-face{font-family:'Jost';font-style:normal;font-weight:100 900;font-display:swap;src:url('../fonts/jost-var-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+20A0-20AB,U+20AD-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Geist Mono';font-style:normal;font-weight:100 900;font-display:swap;src:url('../fonts/geist-mono-var-latin.woff2') format('woff2')}

:root{
  --noche:#0C2416;
  --noche-2:#123321;
  --menta:#CFE8D5;
  --verde:#199B37;
  --verde-texto:#13772B;
  --naranja:#EB6719;
  --naranja-texto:#B4470C;
  --papel:#F3F2EC;
  --blanco:#FFFFFF;
  --tinta:#13201A;
  --tinta-2:#4B5A51;
  --raya:rgba(19,32,26,.14);
  --gut:clamp(16px,4vw,40px);
  --wrap:1240px;
  --nav-h:76px;
  --curva:cubic-bezier(.7,0,.2,1);
  --sale:cubic-bezier(.2,.7,.2,1);
  --mono:'Geist Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{background:var(--noche);-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--nav-h)}
body{margin:0;background:var(--blanco);color:var(--tinta);font:400 1.0625rem/1.6 'Jost',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4,p,ul{margin:0}
ul{padding:0;list-style:none}
button,input,textarea{font:inherit;color:inherit}
.oculto{position:absolute;width:0;height:0;overflow:hidden}
:focus-visible{outline:2px solid var(--naranja);outline-offset:3px}

.envoltorio{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.saltar{position:absolute;left:-999px;top:8px;z-index:200;background:var(--blanco);color:var(--tinta);padding:10px 16px;border-radius:999px}
.saltar:focus{left:12px}

/* ---------------------------------------------------------------- logo */
.logo{width:auto;height:44px}
.logo{--l-euro:#199B37;--l-prev:#EB6719;--l-marco:#EB6719;--l-lema:#199B37}
.logo-euro{fill:var(--l-euro)}
.logo-prev{fill:var(--l-prev)}
.logo-marco{fill:var(--l-marco)}
.logo-lema{fill:var(--l-lema)}

/* ----------------------------------------------------------------- nav */
.nav{position:fixed;inset:0 0 auto;z-index:50;height:var(--nav-h);display:flex;align-items:center;gap:32px;
  padding-inline:max(var(--gut),calc((100vw - var(--wrap))/2 + var(--gut)));
  color:var(--blanco);transition:background .35s,color .35s,box-shadow .35s,transform .35s var(--curva)}
.nav.en-cima{position:absolute}
.nav .logo{--l-euro:#fff;--l-lema:var(--menta)}
.nav.is-solida{background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);color:var(--tinta);box-shadow:0 1px 0 var(--raya),0 10px 30px -18px rgba(12,36,22,.35)}
.nav.is-solida .logo{--l-euro:#199B37;--l-lema:#199B37}
.nav.is-oculta{transform:translateY(-100%)}
.nav__marca{flex:none;display:block}
.nav__enlaces{display:flex;align-items:center;gap:clamp(18px,2.2vw,32px);margin-left:auto;font-weight:500;font-size:.98rem}
.nav__enlaces a{text-decoration:none;position:relative;padding-block:6px}
.nav__enlaces > li:not(.nav__acceso) a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--naranja);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--curva)}
.nav__enlaces > li:not(.nav__acceso) a:hover::after{transform:scaleX(1);transform-origin:left}
.nav__acceso a{display:inline-flex;align-items:center;gap:8px;border:1.5px solid currentColor;border-radius:999px;padding:8px 16px;font-size:.92rem;opacity:.92;transition:background .25s,color .25s,border-color .25s}
.nav__acceso a:hover{background:var(--naranja);border-color:var(--naranja);color:var(--noche);opacity:1}
.nav__boton{display:none}

@media (max-width:980px){
  :root{--nav-h:66px}
  .logo{height:36px}
  .nav__boton{display:flex;flex-direction:column;justify-content:center;gap:6px;margin-left:auto;width:46px;height:46px;padding:0 11px;background:none;border:0;cursor:pointer;position:relative;z-index:2}
  .nav__boton span{display:block;height:2px;background:currentColor;border-radius:2px;transition:transform .35s var(--curva),opacity .2s}
  .nav.is-abierta .nav__boton span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .nav.is-abierta .nav__boton span:nth-child(2){opacity:0}
  .nav.is-abierta .nav__boton span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .nav__enlaces{position:fixed;inset:0;z-index:1;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;margin:0;
    padding:var(--nav-h) var(--gut) 40px;background:var(--papel);color:var(--tinta);font-size:1.9rem;font-weight:400;
    opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
  .nav__acceso{margin-top:22px;font-size:1rem}
  .nav.is-abierta{color:var(--tinta)}
  .nav.is-abierta .logo{--l-euro:#199B37;--l-lema:#199B37}
  .nav.is-abierta .nav__marca{position:relative;z-index:2}
  .nav.is-abierta .nav__enlaces{opacity:1;visibility:visible}
}

/* -------------------------------------------------------------- botones */
.botones{display:flex;flex-wrap:wrap;gap:12px}
.boton{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;background:var(--naranja);color:var(--noche);
  font-weight:500;font-size:1.02rem;text-decoration:none;border:1.5px solid var(--naranja);cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s var(--sale)}
.boton:hover{background:#F27A33;border-color:#F27A33}
.boton svg{transition:transform .3s var(--sale)}
.boton:hover svg{transform:translateX(4px)}
.boton--linea{background:transparent;color:inherit;border-color:currentColor}
.boton--linea:hover{background:currentColor;border-color:currentColor}
.boton--linea:hover{color:inherit}
.sec--noche .boton--linea:hover,.hero .boton--linea:hover{background:var(--blanco);color:var(--noche);border-color:var(--blanco)}
.sec:not(.sec--noche) .boton--linea:hover{background:var(--tinta);color:var(--blanco);border-color:var(--tinta)}
.boton--oscuro{background:var(--noche);border-color:var(--noche);color:var(--blanco)}
.boton--oscuro:hover{background:#000;border-color:#000}
.boton.is-desactivado{opacity:.4;pointer-events:none}

/* ----------------------------------------------------------------- hero */
.hero{background:var(--noche);color:var(--blanco);padding-top:calc(var(--nav-h) + clamp(28px,4vw,56px));overflow:hidden}
.hero__texto{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);gap:24px clamp(32px,5vw,80px);align-items:end}
.antetitulo{grid-column:1/-1;font:500 .8rem/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--menta);display:flex;align-items:center;gap:12px}
.antetitulo::before{content:"";width:28px;height:2px;background:var(--naranja);flex:none}
.hero__titulo{font-weight:400;font-size:clamp(2.6rem,5.4vw,5.1rem);line-height:1;letter-spacing:-.015em}
.hero__lado{display:grid;gap:26px;padding-bottom:.4em}
.hero__lado p{color:var(--menta);font-size:1.12rem;max-width:44ch}

/* el marco de «PREV» del logo, alrededor de una palabra */
.marco{position:relative;display:inline-block;padding:0 .16em .04em 0;margin-right:.04em}
.marco::before{content:"";position:absolute;top:-.04em;right:0;bottom:-.1em;left:.36em;border:solid var(--naranja);border-width:.055em .055em 0 0}
.marco::after{content:"";position:absolute;left:-.16em;right:0;bottom:-.1em;height:.055em;background:var(--naranja)}

/* --------------------------------------------- recorrido por los riesgos */
.recorrido{margin-top:clamp(20px,3vw,40px)}
.recorrido__lienzo{position:relative;display:grid;grid-template-columns:minmax(240px,330px) minmax(0,min(1320px,calc((100svh - 420px) * 1.935)));
  gap:clamp(24px,3vw,56px);justify-content:center;align-items:start;padding-inline:var(--gut)}
.recorrido__lienzo .escena{grid-column:2}
.recorrido__lienzo .ficha{grid-column:1;grid-row:1;margin-top:4%}
.escena{width:100%;height:auto;color:var(--menta);overflow:visible}
.escena *{vector-effect:non-scaling-stroke}
.e-rejilla{opacity:.05}
.e-rejilla,.e-terreno,.e-linea,.e-fondo,.e-marco{pointer-events:none}
.e-terreno{opacity:.1}
.e-linea,.e-trazo,.e-fina,.e-cuerpo,.e-miembro{fill:none;stroke:var(--menta);stroke-linecap:round;stroke-linejoin:round}
.e-linea,.e-trazo{stroke-width:2.5}
.e-fina{stroke-width:1.5;opacity:.8}
.e-muro{fill:#10301D;stroke:var(--menta);stroke-width:2.5;stroke-linejoin:round}
.e-losa{fill:var(--menta);opacity:.85}
.e-hueco{fill:#0A1F12;stroke:var(--menta);stroke-width:1.5}
.e-pantalla{fill:#163F28;stroke:var(--menta);stroke-width:2.5}
.e-maquina{fill:#174A2C;stroke:var(--menta);stroke-width:2.5;stroke-linejoin:round}
.e-acero,.e-contrapeso,.e-cabeza{fill:var(--menta)}
.e-bidon{fill:var(--verde);stroke:var(--menta);stroke-width:2}
.e-caja{fill:#2A5C3B;stroke:var(--menta);stroke-width:2}
.e-rueda{fill:#0A1F12;stroke:var(--menta);stroke-width:2.5}
.e-cuerpo{stroke-width:10}
.e-miembro{stroke-width:6}
.e-bata{fill:#E9F4EB}
.e-casco{fill:var(--naranja)}
.e-cascos-oido{fill:none;stroke:var(--naranja);stroke-width:5;stroke-linecap:round}
.e-acento{stroke:var(--verde);opacity:1}
.e-aviso{stroke:var(--naranja)}
.e-arnes{stroke:var(--naranja);opacity:1}

.e-fondo,.e-riesgo{transition:opacity .6s}
.escena.enfocando .e-riesgo:not(.is-foco){opacity:.32}
.escena.enfocando .e-fondo{opacity:.6}
.e-marco{opacity:0;transition:opacity .4s}
.escena.enfocando .e-marco{opacity:1}
.e-marco__esq{fill:none;stroke:var(--naranja);stroke-width:4;stroke-linecap:square;transition:transform .75s var(--curva)}

/* vida en la escena: poca y lenta */
.e-piston{animation:piston 1.2s ease-in-out infinite}
@keyframes piston{0%,100%{transform:translateY(0)}40%,58%{transform:translateY(14px)}}
.e-ondas path{opacity:0;animation:onda 1.2s ease-out infinite}
.e-ondas path:nth-child(2){animation-delay:.12s}
.e-ondas path:nth-child(3){animation-delay:.24s}
@keyframes onda{40%{opacity:0}55%{opacity:1}100%{opacity:0}}
.e-carretilla{animation:carretilla 11s ease-in-out infinite}
@keyframes carretilla{0%,12%{transform:translateX(0)}45%,62%{transform:translateX(46px)}95%,100%{transform:translateX(0)}}
.e-carro{animation:carro 16s ease-in-out infinite}
@keyframes carro{0%,10%{transform:translateX(0)}45%,60%{transform:translateX(-96px)}95%,100%{transform:translateX(0)}}
.e-carga{transform-origin:1072px 106px;animation:balanceo 3.2s ease-in-out infinite alternate}
@keyframes balanceo{from{transform:rotate(-2.5deg)}to{transform:rotate(2.5deg)}}
.e-aguja-m{transform-origin:305px 262px;animation:giro 8s linear infinite}
.e-aguja-h{transform-origin:305px 262px;animation:giro 96s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
.e-pantalla-luz{animation:teclea 3s steps(1) infinite}
@keyframes teclea{0%{opacity:.8}33%{opacity:.45}66%{opacity:.95}}
.e-operario{animation:respira 3.6s ease-in-out infinite}
@keyframes respira{50%{transform:translateY(1.5px)}}

.ficha{position:relative;padding:20px 22px 22px;border:1px solid rgba(207,232,213,.22);border-radius:10px;
  background:rgba(12,36,22,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transform:translateY(8px);transition:opacity .45s,transform .45s var(--sale)}
.ficha.is-visible{opacity:1;transform:none}
.ficha__esp{font:500 .74rem/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--naranja);display:flex;align-items:center;gap:10px}
.ficha__esp::before{content:"";width:9px;height:9px;border:2px solid var(--naranja);border-width:2px 2px 0 0;flex:none}
.ficha__titulo{margin-top:8px;font-size:1.55rem;line-height:1.15;font-weight:500}
.ficha__texto{margin-top:8px;color:var(--menta);font-size:.98rem;line-height:1.5}

.riesgos{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:8px;padding-block:22px clamp(48px,6vw,80px);border-top:1px solid rgba(207,232,213,.16)}
@media (min-width:1100px){.riesgos{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.riesgo{height:100%;width:100%}}
.riesgo{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px 16px 10px;border:1px solid rgba(207,232,213,.25);border-radius:10px;
  background:transparent;color:var(--blanco);font-size:.98rem;text-align:left;cursor:pointer;transition:border-color .3s,background .3s}
.riesgo__esp{font:500 .66rem/1.2 var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--menta);opacity:.8}
.riesgo:hover{border-color:rgba(207,232,213,.6)}
.riesgo.is-activo{border-color:var(--naranja);background:rgba(235,103,25,.12)}
.riesgo.is-activo .riesgo__esp{color:var(--naranja);opacity:1}

@media (max-width:1000px){
  .hero__texto{grid-template-columns:1fr}
  .hero__lado p{max-width:60ch}
  .recorrido__lienzo{display:block;padding-inline:0}
  .recorrido__lienzo .ficha{max-width:640px;margin:14px var(--gut) 0;opacity:1;transform:none;min-height:172px}
}
@media (max-width:760px){
  .hero__lado{padding-bottom:0}
  .recorrido__lienzo .escena{aspect-ratio:4/3.3}
  .riesgos{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);scrollbar-width:none;border-top:0;padding-top:14px}
  .riesgos::-webkit-scrollbar{display:none}
  .riesgos li{flex:none;scroll-snap-align:start}
}

/* ------------------------------------------------------------ secciones */
.sec{padding-block:clamp(76px,10vw,140px)}
.sec--papel{background:var(--papel)}
.sec--noche{background:var(--noche);color:var(--blanco)}
.cabecera{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px clamp(32px,5vw,80px);align-items:end;margin-bottom:clamp(40px,5vw,64px)}
.titulo{font-weight:400;font-size:clamp(2.3rem,4.8vw,4.2rem);line-height:1.02;letter-spacing:-.012em}
.titulo--m{font-size:clamp(2rem,3.8vw,3.3rem)}
.cabecera__texto{color:var(--tinta-2);font-size:1.12rem;max-width:52ch}
.cabecera__texto a{color:var(--verde-texto);text-underline-offset:3px}
@media (max-width:760px){.cabecera{grid-template-columns:1fr}}

/* ------------------------------------------------------- especialidades */
.especialidades{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.4vw,32px)}
.especialidad{position:relative;padding-top:26px;border-top:1px solid var(--tinta)}
.especialidad::before{content:"";position:absolute;top:-1px;right:0;width:22px;height:22px;border:solid var(--naranja);border-width:3px 3px 0 0;transform:scale(.4);transform-origin:top right;opacity:0;transition:transform .45s var(--curva),opacity .3s}
.especialidad:hover::before{transform:none;opacity:1}
.especialidad__icono{color:var(--verde);margin-bottom:22px}
.especialidad h3{font-weight:500;font-size:1.38rem;line-height:1.2;margin-bottom:16px}
.especialidad li{padding-block:9px;border-top:1px solid var(--raya);color:var(--tinta-2);font-size:.98rem;line-height:1.4}
@media (max-width:1000px){.especialidades{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}}
@media (max-width:560px){.especialidades{grid-template-columns:1fr}}

/* ---------------------------------------------------- pestañas (perfiles) */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:36px}
.tabs button{border:1.5px solid var(--raya);background:var(--blanco);border-radius:999px;padding:11px 22px;font-weight:500;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.tabs button:hover{border-color:var(--tinta)}
.tabs button.is-activa{background:var(--noche);border-color:var(--noche);color:var(--blanco)}
.panel{display:none}
.panel.is-activo{display:block;animation:entra .5s var(--sale)}
@keyframes entra{from{opacity:0;transform:translateY(10px)}}
.no-js .panel{display:block;margin-bottom:48px}
.panel__intro{font-size:1.3rem;line-height:1.45;max-width:58ch;margin-bottom:30px}
.lista-check{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.lista-check li{position:relative;padding:15px 0 15px 36px;border-top:1px solid var(--raya);line-height:1.4}
.lista-check li::before{content:"";position:absolute;left:4px;top:19px;width:14px;height:8px;border:solid var(--verde);border-width:0 0 2.5px 2.5px;transform:rotate(-45deg)}
.grupos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.grupo{background:var(--blanco);border-radius:10px;padding:24px}
.grupo h4{font-weight:500;font-size:1.15rem;margin-bottom:12px}
.grupo li{padding-block:7px;border-top:1px solid var(--raya);color:var(--tinta-2);font-size:.96rem;line-height:1.4}
@media (max-width:1000px){.grupos{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){
  .lista-check,.grupos{grid-template-columns:1fr}
  .panel__intro{font-size:1.15rem}
  .tabs button{padding:10px 18px}
}

/* ------------------------------------------------------------- formación */
.formacion{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(40px,6vw,96px);align-items:start}
.formacion > div:first-child,.cursos{display:grid;gap:22px}
.cursos{gap:0}
.formacion > div:first-child p{color:var(--menta);font-size:1.1rem;max-width:50ch}
.formacion .botones{margin-top:10px}
.campus{display:grid;gap:12px;margin-top:8px;padding-top:22px;border-top:1px solid rgba(207,232,213,.18)}
.formacion .campus p{font-size:.98rem}
.campus .botones{margin-top:0}
.boton--chico{min-height:42px;padding:0 18px;font-size:.94rem}
.cursos__lista li{display:flex;align-items:center;gap:18px;padding-block:18px;border-top:1px solid rgba(207,232,213,.18);font-size:clamp(1.15rem,1.8vw,1.45rem);line-height:1.3}
.cursos__lista li::before{content:"";width:10px;height:10px;border:solid var(--naranja);border-width:2px 2px 0 0;flex:none}
.tpc{display:flex;gap:22px;align-items:center;margin-top:26px;padding:22px;border:1px solid rgba(207,232,213,.22);border-radius:10px}
.tpc p{color:var(--menta);line-height:1.5}
.tpc strong{color:var(--blanco);font-weight:500}
.tpc__sello{flex:none;width:76px;height:76px;display:grid;place-items:center;background:var(--naranja);border-radius:8px}
.tpc__sello span{font:600 1.35rem/1 var(--mono);color:var(--noche);letter-spacing:.04em}
@media (max-width:860px){.formacion{grid-template-columns:1fr}}
@media (max-width:480px){.tpc{flex-direction:column;align-items:flex-start}}

/* ------------------------------------------------------------ asistente */
.asistente{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px 40px;align-items:start}
.paso{grid-column:1;margin:0;padding:28px 0 32px;border:0;border-top:1px solid var(--raya);min-width:0}
.paso legend{float:left;width:100%;padding:0;margin-bottom:18px;font-size:1.35rem;font-weight:500}
.paso legend + *{clear:both}
.opciones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.opciones--dos{grid-template-columns:repeat(2,minmax(0,160px))}
.opciones--marcas{display:flex;flex-wrap:wrap;gap:8px}
.opcion,.marca{position:relative;cursor:pointer}
.opcion input,.marca input{position:absolute;opacity:0;width:1px;height:1px}
.opcion span{display:flex;flex-direction:column;gap:4px;height:100%;padding:18px 18px 20px;border:1.5px solid var(--raya);border-radius:10px;color:var(--tinta-2);font-size:.92rem;line-height:1.4;transition:border-color .25s,background .25s,box-shadow .25s}
.opcion b{color:var(--tinta);font-weight:500;font-size:1.08rem}
.opcion--corta span{padding:14px 18px;align-items:center}
.opcion:hover span{border-color:var(--tinta)}
.opcion input:checked + span{border-color:var(--naranja);background:rgba(235,103,25,.06);box-shadow:inset 0 0 0 1px var(--naranja)}
.opcion input:focus-visible + span,.marca input:focus-visible + span{outline:2px solid var(--naranja);outline-offset:3px}
.marca span{display:inline-flex;align-items:center;gap:10px;padding:11px 18px;border:1.5px solid var(--raya);border-radius:999px;font-weight:500;transition:border-color .25s,background .25s,color .25s}
.marca span::before{content:"";width:16px;height:16px;border:1.5px solid currentColor;border-radius:4px;opacity:.5;flex:none;transition:background .2s,border-color .2s,opacity .2s}
.marca:hover span{border-color:var(--tinta)}
.marca input:checked + span{border-color:var(--noche);background:var(--noche);color:var(--blanco)}
.marca input:checked + span::before{opacity:1;background:var(--naranja);border-color:var(--naranja);box-shadow:inset 0 0 0 3px var(--noche)}
.aviso-acta{display:none;margin-top:14px;padding:14px 18px;border-left:3px solid var(--naranja);background:var(--papel);border-radius:0 8px 8px 0}
.aviso-acta a{color:var(--naranja-texto);font-weight:500}
.paso:has(input[value="Sí"]:checked) .aviso-acta{display:block}
.campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.campo{display:grid;gap:6px;font-size:.92rem;color:var(--tinta-2)}
.campo--ancho{grid-column:1/-1}
.campo input,.campo textarea{width:100%;padding:13px 15px;border:1.5px solid var(--raya);border-radius:8px;background:var(--blanco);font-size:1.02rem;color:var(--tinta);transition:border-color .2s}
.campo textarea{resize:vertical;min-height:96px}
.campo input:focus,.campo textarea:focus{outline:0;border-color:var(--naranja)}
.resumen{grid-column:2;grid-row:1/span 4;position:sticky;top:calc(var(--nav-h) + 20px);display:grid;gap:20px;padding:28px;border-radius:12px;background:var(--noche);color:var(--blanco)}
.resumen__texto{color:var(--menta);font-size:1rem;line-height:1.55}
.resumen__texto b{color:var(--blanco);font-weight:500}
.resumen__texto ul{display:grid;gap:4px;margin-top:6px}
.resumen__texto li{position:relative;padding-left:18px}
.resumen__texto li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border:solid var(--naranja);border-width:2px 2px 0 0}
.resumen__nota{font-size:.84rem;color:var(--menta);opacity:.75}
.resumen .boton{width:100%;justify-content:center}
.resumen .boton--linea{color:var(--blanco)}
@media (max-width:980px){
  .asistente{grid-template-columns:1fr}
  .resumen{grid-column:1;grid-row:auto;position:static}
}
@media (max-width:640px){
  .opciones{grid-template-columns:1fr}
  .opciones--dos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .campos{grid-template-columns:1fr}
}

/* ------------------------------------------------------------ opiniones */
.opiniones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.opinion{margin:0;padding:28px;border:1px solid var(--raya);border-radius:12px;display:flex;flex-direction:column;gap:18px}
.opinion blockquote{margin:0;font-size:1.12rem;line-height:1.5}
.opinion figcaption{margin-top:auto;font-size:.9rem;color:var(--tinta-2)}
.nota-google{display:flex;align-items:baseline;gap:12px;font-size:1rem;color:var(--tinta-2)}
.nota-google strong{font-size:2.4rem;font-weight:500;color:var(--tinta);line-height:1}
.estrellas{color:var(--naranja);letter-spacing:2px}
@media (max-width:900px){.opiniones{grid-template-columns:1fr}}

/* ---------------------------------------------------------------- sedes */
.sedes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.sede{position:relative;display:grid;gap:14px;align-content:start;padding:clamp(26px,3.4vw,44px);background:var(--blanco);border-radius:12px;overflow:hidden}
.sede h3{font-weight:400;font-size:clamp(2rem,3.6vw,3rem);line-height:1}
.sede p{color:var(--tinta-2);font-size:1.08rem;line-height:1.55}
.sede::after{content:"";position:absolute;top:18px;right:18px;width:30px;height:30px;border:solid var(--naranja);border-width:3px 3px 0 0}
.enlace-flecha{justify-self:start;display:inline-flex;align-items:center;gap:8px;margin-top:6px;font-weight:500;color:var(--verde-texto);text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:2px}
.enlace-flecha::after{content:"→";transition:transform .3s var(--sale)}
.enlace-flecha:hover::after{transform:translateX(4px)}
@media (max-width:700px){.sedes{grid-template-columns:1fr}}

/* --------------------------------------------------------------- cierre */
.cierre{background:var(--naranja);color:var(--noche);padding-block:clamp(64px,8vw,110px)}
.cierre__dentro{display:grid;gap:22px;justify-items:start}
.cierre p{font-size:1.15rem;max-width:56ch}
.cierre .titulo{max-width:28ch}

/* ------------------------------------------------------------------ pie */
.pie{background:var(--noche);color:var(--menta);padding-block:64px 36px;font-size:.95rem}
.pie__arriba{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:32px 56px;align-items:start}
.logo--pie{height:52px;--l-euro:#fff;--l-lema:var(--menta)}
.pie p{line-height:1.7}
.pie strong{color:var(--blanco);font-weight:500}
.pie a{text-decoration:none}
.pie a:hover{color:var(--blanco);text-decoration:underline}
.pie__enlaces{display:grid;gap:4px;text-align:right}
.pie__fondos{margin-top:44px;max-width:640px;padding:14px 20px;background:var(--blanco);border-radius:8px}
.pie__fondos img{width:100%;height:auto}
.pie__credito{margin-top:28px;padding-top:22px;border-top:1px solid rgba(207,232,213,.16);font-size:.85rem;opacity:.75}
@media (max-width:860px){
  .pie__arriba{grid-template-columns:1fr}
  .pie__enlaces{text-align:left}
}


/* --------------------------------------------------------------- cifras */
.cifras{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.4vw,32px);margin-bottom:clamp(76px,9vw,128px)}
.cifra{display:grid;gap:4px;align-content:start}
.cifra__dato{position:relative;justify-self:start;font-weight:300;font-size:clamp(3rem,6vw,5.4rem);line-height:1;letter-spacing:-.02em;padding:0 .14em .06em 0;margin-bottom:12px}
.cifra__dato::before{content:"";position:absolute;top:.02em;right:0;width:.32em;height:.32em;border:solid var(--naranja);border-width:3px 3px 0 0}
.cifra__etq{font-weight:500;font-size:1.12rem}
.cifra__nota{color:var(--tinta-2);font-size:.95rem;line-height:1.45}
@media (max-width:900px){.cifras{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}}

/* --------------------------------------------- opiniones de los cursos */
.opiniones-curso{grid-column:1/-1;display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:20px;align-items:stretch;margin-top:clamp(56px,7vw,96px);padding-top:clamp(36px,4vw,52px);border-top:1px solid rgba(207,232,213,.18)}
.opiniones-curso .nota-google{flex-direction:column;align-items:flex-start;gap:8px;color:var(--menta);padding-right:20px}
.opiniones-curso .nota-google strong{color:var(--blanco);font-size:3.4rem;font-weight:300}
.opiniones-curso .nota-google span:last-child{max-width:16ch;line-height:1.4}
.opiniones-curso .opinion{border-color:rgba(207,232,213,.2)}
.opiniones-curso .opinion figcaption{color:var(--menta)}
@media (max-width:1000px){.opiniones-curso{grid-template-columns:1fr}.opiniones-curso .nota-google{flex-direction:row;align-items:baseline}.opiniones-curso .nota-google span:last-child{max-width:none}}
.sede__tel a{color:var(--tinta);font-weight:500;text-decoration:none}
.sede__tel a:hover{color:var(--verde-texto)}

/* ------------------------------------------------------------ al subir */
.to-top{position:fixed;right:18px;bottom:18px;z-index:40;width:46px;height:46px;display:grid;place-items:center;border:0;border-radius:50%;background:var(--noche);color:var(--blanco);cursor:pointer;
  box-shadow:0 8px 24px -8px rgba(0,0,0,.4);opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .3s,visibility .3s,transform .3s}
.to-top.is-visible{opacity:1;visibility:visible;transform:none}

/* --------------------------------------------------------- apariciones */
.js-listo .revela{opacity:0;transform:translateY(26px);transition:opacity .8s var(--sale),transform .8s var(--sale)}
.js-listo .revela.visto{opacity:1;transform:none}
.js-listo .hero__texto > *{opacity:0;transform:translateY(var(--dy,40px));transition:opacity .9s var(--sale),transform 1s var(--sale);transition-delay:calc(var(--i,0) * 110ms + 80ms)}
.js-listo.entrada .hero__texto > *{opacity:1;transform:none}
.js-listo .recorrido{opacity:0;transition:opacity 1.2s .45s}
.js-listo.entrada .recorrido{opacity:1}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* marca de agua: la propuesta es de AutomatIA hasta que se contrate */
.marca-agua{
  position:fixed; inset:0; z-index:90; pointer-events:none;
}
.marca-agua::before{
  content:""; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='360'%3E%3Cg transform='rotate(-28 280 180)' font-family='Arial,Helvetica,sans-serif' font-weight='700' text-anchor='middle' fill='%23808080' fill-opacity='.26'%3E%3Ctext x='280' y='172' font-size='19' letter-spacing='1'%3EPROPIEDAD DE PABLO GONZALEZ HIPOLITO%3C/text%3E%3Ctext x='280' y='200' font-size='17' letter-spacing='1'%3EPROPIEDAD DE EMPRESA AUTOMATIA.ME%3C/text%3E%3C/g%3E%3C/svg%3E");
  background-size:560px 360px; background-position:center calc(50% - 180px);
  -webkit-mask-image:linear-gradient(#000 0 30%, transparent 37% 63%, #000 70%); mask-image:linear-gradient(#000 0 30%, transparent 37% 63%, #000 70%);
}
/* en móvil la baldosa cabe entera y centrada: si no, las frases se cortan por la derecha y parece ladeada */
@media (max-width:540px){ .marca-agua::before{ background-size:min(96vw, 420px) auto; background-position:center calc(50% - min(48vw, 210px) * 360 / 560); } .marca-agua__centro{ width:78vw; } }
.sello{
  position:fixed; left:16px; bottom:16px; z-index:91; display:flex; align-items:center; gap:.85rem;
  padding:.65rem 1.25rem .65rem .8rem; border-radius:999px; background:#fff; color:#1f2a6b;
  box-shadow:0 8px 28px rgba(0,0,0,.28); text-decoration:none; font:700 1rem/1.15 Arial, Helvetica, sans-serif;
  max-width:calc(100vw - 32px); border:2px solid #2b3aa0;
}
.sello img{ height:42px; width:auto; flex:none; }
.sello small{ display:block; font-size:.82em; font-weight:600; color:#5b4bd6; }
.sello:hover{ background:#fff; box-shadow:0 10px 32px rgba(0,0,0,.34); }
@media (max-width:540px){ .sello{ left:10px; bottom:10px; gap:.6rem; padding:.5rem .95rem .5rem .6rem; font-size:.86rem; } .sello img{ height:32px; } }
/* marca de agua central: logo de AutomatIA y las dos líneas, en medio de la pantalla (también en móvil) */
.marca-agua{ display:grid; place-items:center; }
.marca-agua__centro{
  position:relative; width:min(84vw, 640px); transform:rotate(-24deg); opacity:.2; text-align:center;
  filter:grayscale(.2);
}
.marca-agua__centro img{ width:100%; height:auto; }
.marca-agua__centro p{
  margin:.4rem 0 0; font-family:Arial, Helvetica, sans-serif; font-weight:700; letter-spacing:.06em; line-height:1.5;
  font-size:clamp(.72rem, 2.9vw, 1.2rem); color:#6b6b6b;
  text-shadow:0 0 1px rgba(255,255,255,.6);
}

/* marca de agua v2 (ordenada): franjas paralelas de texto continuo, al mismo ángulo que la marca central,
   con la misma separación entre filas y un hueco limpio en el centro para la marca grande */
.marca-agua{ overflow:hidden; --fila:96px; }
.marca-agua::before{
  inset:auto; left:50%; top:50%; width:260vmax; height:260vmax;
  transform:translate(-50%, -50%) rotate(-24deg);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='760' height='96'%3E%3Cg font-family='Arial,Helvetica,sans-serif' font-weight='700' font-size='15' fill='%23808080' fill-opacity='.28'%3E%3Ctext x='20' y='53' textLength='700' lengthAdjust='spacing'%3EPROPIEDAD DE PABLO GONZ%C3%81LEZ HIP%C3%93LITO %C2%B7 PROPIEDAD DE EMPRESA AUTOMATIA.ME%3C/text%3E%3Ctext x='740' y='53' text-anchor='middle'%3E%C2%B7%3C/text%3E%3C/g%3E%3C/svg%3E");
  background-size:calc(var(--fila) * 760 / 96) var(--fila); background-position:center center;
  -webkit-mask-image:linear-gradient(#000 calc(50% - var(--fila) * 2.5), transparent 0 calc(50% + var(--fila) * 2.5), #000 0);
          mask-image:linear-gradient(#000 calc(50% - var(--fila) * 2.5), transparent 0 calc(50% + var(--fila) * 2.5), #000 0);
}
@media (max-width:540px){
  .marca-agua{ --fila:76px; }
  .marca-agua::before{ background-size:calc(var(--fila) * 760 / 96) var(--fila); background-position:center center; }
}