/* =====================================================================
   Konoze Editorial — estilos globales
   Bloque 1: CSS del prototipo (reference/04-contacto.dc.html, que es el
   superconjunto de las 4 páginas). Copiado tal cual salvo:
     - variables de marca movidas a :root
     - familias tipográficas → var(--f-d) / var(--f-b) (fonts.css del tema)
   Bloque 2 (al final): añadidos de producción (responsive, menú móvil,
   fallbacks de animación, foco visible).
   ===================================================================== */
:root{--f-d:"Plus Jakarta Sans","Instrument Sans",system-ui,sans-serif;--f-b:"Instrument Sans",system-ui,sans-serif;--g:#00703A;--gd:#0A3D24;--au:#C4A24C;--cr:#F2F4F3;--sg:#D5E6D8;--pa:#E8F2EA;--ink:#111A14;--mu:#4A5A50}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#F2F4F3;font-family:var(--f-b);color:var(--ink)} /* también para lo que los plugins pintan fuera de .kz (aviso de cookies…) */
*{box-sizing:border-box}
a{color:#00703A;text-decoration:none}a:hover{color:#0A3D24}
.kz{font-family:var(--f-b);color:var(--ink);background:#F2F4F3;overflow-x:clip}
.dsp{font-family:var(--f-d);letter-spacing:-0.035em}
h1.dsp{font-weight:700!important}
.wrap{max-width:1760px;margin:0 auto;padding-inline:clamp(20px,4vw,80px)}
.nav-a{color:var(--ink);font-size:15px;font-weight:500;min-height:44px;padding:0 16px;border-radius:999px;display:inline-flex;align-items:center;transition:background .3s,color .3s}
.nav-a:hover,.nav-on{color:var(--g);background:rgba(0,112,58,.09)}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font-weight:600;font-size:15px;transition:transform .3s cubic-bezier(.2,.8,.2,1),background .3s,color .3s,box-shadow .3s}
.btn:hover{transform:translateY(-2px)}
.btn-p{background:var(--g);color:#fff}.btn-p:hover{background:var(--gd);color:#fff}
.btn-s{background:transparent;color:var(--ink);border:1.5px solid rgba(17,26,20,.2)}.btn-s:hover{border-color:var(--ink);color:var(--ink)}
.btn-l{background:var(--cr);color:var(--gd)}.btn-l:hover{background:#fff;color:var(--gd)}
.ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;margin-right:-14px;background:rgba(255,255,255,.18);overflow:hidden}
.ic svg,.ext .ei svg,.svc-go svg{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.btn:hover .ic svg,.ext:hover .ei svg,.svc:hover .svc-go svg{transform:rotate(45deg)}
.btn-s .ic{background:var(--g);color:#fff}.btn-l .ic{background:var(--gd);color:var(--cr)}
.ext{display:inline-flex;align-items:center;gap:8px}
.ext .ei{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--g);color:#fff}
.ft-a.ext .ei{background:rgba(247,245,236,.14);color:var(--au)}
.pre{display:inline-flex;align-items:center;gap:10px;font-size:16px;font-weight:500;color:var(--mu);letter-spacing:-0.01em}
.pre b{display:none}
.pre-l{color:rgba(247,245,236,.78)}.pre-l b{color:var(--au)}
.ph{position:relative;overflow:hidden;background:repeating-linear-gradient(135deg,#EEF2EF 0 14px,#E5EBE6 14px 28px);display:flex;align-items:flex-end;justify-content:center;padding:20px}
.ph-l{background:rgba(255,255,255,.92);color:var(--ink);font-size:13px;font-weight:600;border-radius:12px;padding:10px 14px;line-height:1.35;text-align:center}
.ph-l small{display:block;font-weight:400;color:var(--mu)}
.rise{opacity:0;transform:translateY(28px);animation:rise .9s cubic-bezier(.2,.8,.2,1) forwards}
.d1{animation-delay:.08s}.d2{animation-delay:.18s}.d3{animation-delay:.3s}.d4{animation-delay:.45s}.d5{animation-delay:.6s}
@keyframes rise{to{opacity:1;transform:none}}
.pop{opacity:0;transform:scale(.6);animation:pop 1s cubic-bezier(.2,.9,.25,1.2) forwards}
@keyframes pop{to{opacity:1;transform:none}}
.spin{animation:spin 40s linear infinite;transform-origin:center;transform-box:fill-box}
.spin-r{animation:spin 60s linear infinite reverse;transform-origin:center;transform-box:fill-box}
@keyframes spin{to{transform:rotate(360deg)}}
.float{animation:float 6s ease-in-out infinite}.float2{animation:float 7s ease-in-out -2s infinite}.float3{animation:float 8s ease-in-out -4s infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.sway{animation:sway 9s ease-in-out infinite;transform-origin:center;transform-box:fill-box}
@keyframes sway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
.marq{display:flex;gap:56px;width:max-content;animation:marq 38s linear infinite}
/* (sin pausa al pasar el ratón: el usuario quiere que la cinta no se detenga) */
@keyframes marq{to{transform:translateX(-50%)}}
.feat{display:flex;flex-direction:column;gap:18px}
.feat .badge{width:84px;height:84px;position:relative;display:grid;place-items:center;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.feat:hover .badge{transform:rotate(-8deg) scale(1.06)}
.feat .badge svg.bg{position:absolute;inset:0}
.feat .badge svg.i{position:relative;z-index:1}
.feat h3{margin:0;font-size:clamp(24px,2.1vw,32px);font-weight:600}
.feat p{margin:0;color:var(--mu);line-height:1.65;font-size:17px}
.svc{display:flex;flex-direction:column;border-radius:32px;overflow:hidden;background:#fff;border:1px solid rgba(17,26,20,.08);color:var(--ink);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s}
.svc:hover{transform:translateY(-6px);color:var(--ink)}
.svc .pat{height:220px;position:relative;overflow:hidden}
.svc .pat svg{position:absolute;inset:-10%;width:120%;height:120%;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.svc:hover .pat svg{transform:translate(-4%,-4%) rotate(-3deg)}
.svc .body{padding:clamp(32px,2.8vw,44px);display:flex;flex-direction:column;gap:26px;flex:1}
.svc h3{margin:0;font-size:clamp(24px,2.1vw,32px);font-weight:600;line-height:1.05}
.svc p{margin:0;color:var(--mu);line-height:1.65;font-size:16px}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tags span{font-size:14px;font-weight:500;padding:8px 14px;border-radius:999px;background:var(--cr);border:1px solid rgba(17,26,20,.08)}
.svc-go{margin-top:auto;display:inline-flex;align-items:center;gap:10px;font-weight:600;color:var(--g)}
.svc-go span{width:40px;height:40px;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center}
.cloud{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr));column-gap:clamp(32px,4vw,72px);font-family:var(--f-d);font-size:clamp(22px,1.9vw,30px);font-weight:500;line-height:1.2;letter-spacing:-0.02em}
.cloud .w{display:flex;align-items:center;gap:18px;padding:20px 0;color:var(--ink);transition:opacity .45s,color .45s,padding .5s cubic-bezier(.2,.8,.2,1)}
.cloud .w sup{order:-1;font-family:var(--f-b);font-size:14px;font-weight:600;letter-spacing:0;color:var(--au);min-width:24px}
.cloud:hover .w{opacity:.35}
.cloud .w:hover{opacity:1;color:var(--g);padding-left:10px}
.cloud .w .wi{margin-left:auto;flex:none;width:34px;height:34px;opacity:0;transform:scale(0) rotate(-120deg);transition:opacity .35s,transform .6s cubic-bezier(.2,.9,.25,1.3)}
.cloud .w:hover .wi{opacity:1;transform:scale(1) rotate(0)}
.ftile{position:relative;overflow:hidden;border-radius:32px;min-height:clamp(300px,24vw,380px);padding:clamp(28px,2.6vw,40px);display:flex;flex-direction:column;gap:10px;cursor:default;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.ftile:hover{transform:translateY(-6px)}
.ftile .ft{position:relative;font-size:clamp(48px,5vw,84px);font-weight:600;line-height:1;letter-spacing:-0.03em}
.ftile .fd{position:relative;font-size:17px;font-weight:500;opacity:.85}
.ftile .fs{position:absolute;right:-24px;bottom:-24px;width:clamp(180px,16vw,250px);height:auto;transition:transform .9s cubic-bezier(.2,.8,.2,1);transform-origin:bottom right}
.ftile:hover .fs{transform:rotate(-12deg) scale(1.1)}
.fund{display:flex;flex-direction:column;gap:14px;padding:8px 0 8px clamp(24px,3vw,44px);border-left:1px solid rgba(17,26,20,.14);cursor:default}
.fund:first-of-type{border-left:0;padding-left:0}
.fund .ft{font-size:clamp(44px,5.2vw,76px);font-weight:600;line-height:1;letter-spacing:-0.035em;white-space:nowrap;color:var(--ink);transition:color .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
.fund:hover .ft{color:var(--g);transform:translateX(8px)}
.fund .fd{font-size:16px;color:var(--mu)}
.seg{display:flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:999px;background:rgba(242,244,243,.1);margin-bottom:20px}
.tab{flex:1 1 150px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 20px;border:0;border-radius:999px;background:transparent;color:#F2F4F3;font:600 16px var(--f-b);cursor:pointer;transition:background .3s,color .3s}
.tab:hover{background:rgba(242,244,243,.12)}
.tab-n{min-width:28px;height:24px;padding:0 8px;border-radius:999px;display:inline-grid;place-items:center;font-size:13px;background:rgba(242,244,243,.16);transition:background .3s,color .3s}
.tab-on,.tab-on:hover{background:var(--au);color:var(--gd)}
.tab-on .tab-n{background:var(--gd);color:#F2F4F3}
.course{animation:cin .5s cubic-bezier(.2,.8,.2,1) both}
@keyframes cin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.course{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 4px;border-bottom:1px solid rgba(247,245,236,.15);color:var(--cr);font-size:clamp(17px,1.6vw,22px);transition:padding .35s,color .35s}
.course:hover{padding-left:16px;color:var(--au)}
.course .h{font-size:13px;color:rgba(247,245,236,.65);white-space:nowrap}
.mode{font-size:clamp(60px,8vw,136px);font-weight:700;line-height:.92;letter-spacing:-0.045em;color:#F2F4F3;transition:color .45s,transform .6s cubic-bezier(.2,.8,.2,1);cursor:default}
.mode:hover{color:var(--au);transform:translateX(12px)}
.cities{display:flex;flex-wrap:wrap;gap:8px}
.cities span{font-size:14px;font-weight:500;padding:8px 14px;border-radius:999px;background:rgba(242,244,243,.1);color:#F2F4F3}
.steps{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:clamp(32px,4vw,64px)}
.steps-line{position:absolute;left:48px;top:28px;width:calc(100% - 96px);height:40px;z-index:0;overflow:visible}
.step{position:relative;z-index:1;display:flex;flex-direction:column;gap:16px}
.step-b{position:relative;width:96px;height:96px;display:grid;place-items:center;transition:transform .6s cubic-bezier(.2,.9,.25,1.3)}
.step-b svg:first-child{position:absolute;inset:0;width:100%;height:100%}
.step-i{position:relative}
.step:hover .step-b{transform:rotate(-10deg) scale(1.08)}
.step h3{margin:8px 0 0;font-size:clamp(24px,2.1vw,32px);font-weight:600}
.step p{margin:0;color:var(--mu);line-height:1.65;font-size:17px;max-width:320px}
.city-list{display:flex;flex-wrap:wrap;gap:10px}
.city-list button{min-height:48px;padding:0 22px;border-radius:999px;border:1.5px solid rgba(17,26,20,.16);background:#fff;color:var(--ink);font:600 16px var(--f-b);cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.city-list button:hover{border-color:var(--g)}
.city-list .c-on{background:var(--g);border-color:var(--g);color:#fff}
.pin .pin-dot{fill:#00703A;transition:fill .3s,r .3s}
.pin .pin-ring{transform-box:fill-box;transform-origin:center;animation:pring 2.4s ease-out infinite;opacity:0}
.pin .pin-t{font:600 15px var(--f-b);fill:#4A5A50;transition:fill .3s}
.pin-on .pin-dot{fill:#C4A24C;r:11}
.pin-on .pin-ring{stroke:#C4A24C}
.pin-on .pin-t{fill:#0A3D24;font-weight:700}
@keyframes pring{0%{transform:scale(.6);opacity:.8}100%{transform:scale(2.2);opacity:0}}
.stk-wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(40px,5vw,96px);align-items:start}
.stk-head{position:sticky;top:140px;display:flex;flex-direction:column;gap:20px}
.stk{display:flex;flex-direction:column;gap:clamp(40px,8vh,90px)}
.stk-card{position:sticky;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,2.4vw,40px);align-items:center;padding:clamp(24px,2.4vw,36px);border-radius:40px;border:1px solid rgba(17,26,20,.06);animation:stkin linear both;animation-timeline:view();animation-range:entry 0% entry 90%}
.stk-card .tx{display:flex;flex-direction:column;gap:14px;padding:8px 4px 8px 12px}
.stk-card h3{margin:0;font-size:clamp(24px,2.1vw,32px);font-weight:600;line-height:1.05}
.stk-card p{margin:0;font-size:17px;line-height:1.55;opacity:.85;max-width:320px}
.stk-card .ri{width:40px;height:40px;margin-bottom:6px}
.stage{position:relative;aspect-ratio:16/10;border-radius:26px;overflow:hidden;background:#E3EFE6}
.stage img{display:block;width:100%;height:100%;object-fit:cover;animation:imgin linear both;animation-timeline:view();animation-range:entry 0% cover 50%}
@keyframes imgin{from{transform:scale(1.18)}to{transform:none}}
@keyframes stkin{from{opacity:0;transform:translateY(120px) scale(.92) rotate(2deg)}to{opacity:1;transform:none}}
@media (max-width:900px){.stk-wrap{grid-template-columns:1fr}.stk-head{position:static}.stk-card{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){.stk-card,.stage img{animation:none!important;opacity:1!important;transform:none!important}}
.btn-d{background:var(--gd);color:#F2F4F3}.btn-d:hover{background:#062a18;color:#F2F4F3}
.btn-o2{background:transparent;color:var(--gd);border:1.5px solid rgba(10,61,36,.35)}.btn-o2:hover{border-color:var(--gd);color:var(--gd)}
@supports (animation-timeline: view()){.steps-line{animation:drawl linear both;animation-timeline:view();animation-range:entry 10% cover 45%}}
@keyframes drawl{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
.fh{font-size:17px;font-weight:600;color:var(--au);margin-bottom:4px}
.edge{position:absolute;left:0;width:100%;height:clamp(36px,4.5vw,70px);display:block;pointer-events:none;z-index:3}
.edge-t{top:-1px}.edge-b{bottom:-1px}
.lang{display:inline-flex;padding:4px;border-radius:999px;background:#E3E9E5}
.lang button{min-width:44px;min-height:40px;padding:0 12px;border:0;border-radius:999px;background:transparent;color:var(--mu);font:600 14px var(--f-b);cursor:pointer;transition:background .3s,color .3s}
.lang button:hover{color:var(--ink)}
.lang .lang-on{background:#fff;color:var(--g)}
.wa{position:fixed;right:clamp(16px,2.4vw,32px);bottom:clamp(16px,2.4vw,32px);z-index:90;display:inline-flex;align-items:center;gap:0;height:60px;min-width:60px;padding:0 17px;border-radius:999px;background:var(--g);color:#fff;font:600 15px var(--f-b);opacity:0;transform:scale(.6);animation:pop .8s cubic-bezier(.2,.9,.25,1.2) 1.2s forwards;transition:background .3s}
.wa:hover{background:var(--gd);color:#fff}
.wa svg{flex:none;position:relative}
.wa-t{max-width:0;overflow:hidden;white-space:nowrap;transition:max-width .5s cubic-bezier(.2,.8,.2,1),margin-left .5s cubic-bezier(.2,.8,.2,1)}
.wa:hover .wa-t{max-width:120px;margin-left:10px}
.wa-ring{position:absolute;inset:0;border-radius:999px;border:2px solid var(--g);animation:ring 2.4s ease-out 2s infinite;pointer-events:none}
@keyframes ring{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.6);opacity:0}}
.fmail{display:inline-block;color:#F2F4F3;font-size:clamp(26px,2.6vw,44px);font-weight:500;letter-spacing:-0.02em;transition:opacity .3s}
.fmail:hover{color:#F2F4F3;opacity:.6}
.fmail .fi{display:none}
.fband{animation:fband 14s ease-in-out infinite alternate}
@keyframes fband{from{transform:translateX(0)}to{transform:translateX(-60px)}}
.ft-a{color:#F2F4F3;font-size:15px;transition:opacity .3s}.ft-a:hover{color:#F2F4F3;opacity:.6}
@supports (animation-timeline: view()){
.rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% cover 28%}
.rvs{animation:rvs linear both;animation-timeline:view();animation-range:entry 0% cover 35%}
.word{animation:word linear both;animation-timeline:view();animation-range:cover 10% cover 45%}
.drift{animation:drift linear both;animation-timeline:view()}
}
@keyframes rv{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:none}}
@keyframes rvs{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
@keyframes word{from{color:rgba(17,26,20,.18)}to{color:var(--ink)}}
@keyframes drift{from{transform:translateY(60px) rotate(-12deg)}to{transform:translateY(-60px) rotate(12deg)}}
@media (prefers-reduced-motion: reduce){.rise,.pop,.spin,.spin-r,.float,.float2,.float3,.sway,.marq,.fband,.rv,.rvs,.word,.drift{animation:none!important;opacity:1!important;transform:none!important}}
@media (max-width:900px){.hide-m{display:none!important}.fund,.fund:first-of-type{border-left:0;padding-left:0;padding-bottom:32px;border-bottom:1px solid rgba(17,26,20,.14)}}

/* ===== CURSOS ===== */
.srch{position:relative;display:flex;align-items:center;width:100%;max-width:720px;height:76px;border-radius:999px;background:#fff;border:1.5px solid rgba(17,26,20,.1);transition:border-color .3s}
.srch:focus-within{border-color:var(--g)}
.srch svg{position:absolute;left:28px;color:var(--g)}
.srch input{width:100%;height:100%;border:0;background:transparent;padding:0 28px 0 70px;font:500 19px var(--f-b);color:var(--ink);outline:none;border-radius:999px}
.srch input::placeholder{color:#8A978F}
.qchips{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.qchips > span{font-size:15px;color:var(--mu);margin-right:6px}
.qchips button span{margin:0!important}
.qchips button{display:inline-flex;align-items:center;justify-content:center;line-height:1;min-height:40px;padding:0 18px;border-radius:999px;border:1.5px solid rgba(17,26,20,.14);background:transparent;color:var(--ink);font:500 15px var(--f-b);cursor:pointer;transition:background .3s,border-color .3s,color .3s}
.qchips button:hover{border-color:var(--g);color:var(--g)}
.qchips .q-on{background:var(--g);border-color:var(--g);color:#fff}
.cseg{display:inline-flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:999px;background:#fff}
.ctab{display:inline-flex;align-items:center;gap:10px;min-height:52px;padding:0 22px;border:0;border-radius:999px;background:transparent;color:var(--ink);font:600 16px var(--f-b);cursor:pointer;transition:background .3s,color .3s}
.ctab:hover{background:#EEF3EF}
.ctab .n{min-width:28px;height:24px;padding:0 8px;border-radius:999px;display:inline-grid;place-items:center;font-size:13px;background:#E7ECE9;transition:background .3s,color .3s}
.ctab-on,.ctab-on:hover{background:var(--g);color:#fff}
.ctab-on .n{background:rgba(255,255,255,.2);color:#fff}
.clist{display:flex;flex-direction:column}
.crow{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) auto 120px 52px;align-items:center;gap:24px;padding:22px 24px;border-radius:28px;color:var(--ink);transition:background .4s,padding .5s cubic-bezier(.2,.8,.2,1)}
.crow:hover{background:#fff;color:var(--ink);padding-left:34px}
.crow .ci{width:40px;height:40px;transition:transform .6s cubic-bezier(.2,.9,.25,1.3)}
.crow:hover .ci{transform:rotate(90deg) scale(1.1)}
.crow .ct{font:600 clamp(19px,1.5vw,23px)/1.25 var(--f-d);letter-spacing:-0.02em;transition:color .3s}
.crow:hover .ct{color:var(--g)}
.crow .cg{justify-self:start;font-size:14px;font-weight:600;padding:7px 14px;border-radius:999px;background:#E3EFE6;color:var(--gd);white-space:nowrap}
.crow .cg-none{visibility:hidden}
.crow .cg-p{background:#F3EBD3;color:#6B5318}
.crow .ch{font-size:15px;color:var(--mu);text-align:right;white-space:nowrap}
.crow .go{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:transparent;border:1.5px solid rgba(17,26,20,.14);color:var(--ink);transition:background .35s,border-color .35s,color .35s}
.crow .go svg{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.crow:hover .go{background:var(--g);border-color:var(--g);color:#fff}
.crow:hover .go svg{transform:rotate(45deg)}
.more{align-self:center;margin-top:32px}
.more button{display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 30px;border-radius:999px;border:1.5px solid rgba(17,26,20,.2);background:transparent;color:var(--ink);font:600 16px var(--f-b);cursor:pointer;transition:border-color .3s,background .3s}
.more button:hover{border-color:var(--ink);background:#fff}
.more .pl{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--g);color:#fff;margin-right:-14px;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.more button:hover .pl{transform:rotate(90deg)}
.spec{display:flex;flex-direction:column}
.spec-r{display:grid;grid-template-columns:96px minmax(0,1fr) minmax(0,1.2fr);gap:32px;align-items:center;padding:34px 0;border-top:1px solid rgba(242,244,243,.14)}
.spec-r:last-child{border-bottom:1px solid rgba(242,244,243,.14)}
.spec-r .sv{width:72px;height:72px;transition:transform .8s cubic-bezier(.2,.9,.25,1.3)}
.spec-r:hover .sv{transform:rotate(-90deg)}
.spec-r h3{margin:0;font-size:clamp(24px,2.1vw,32px);font-weight:600;line-height:1.05;transition:color .3s}
.spec-r:hover h3{color:var(--au)}
.spec-r p{margin:0;font-size:17px;line-height:1.6;color:rgba(242,244,243,.78);max-width:460px}
@media (max-width:900px){.crow{grid-template-columns:40px minmax(0,1fr) 44px}.crow .cg,.crow .ch{display:none}.spec-r{grid-template-columns:64px 1fr}.spec-r p{grid-column:2}}

/* ===== CONTACTO ===== */
.cm{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) 52px;align-items:center;gap:22px;padding:26px 28px;border-radius:32px;background:#fff;color:var(--ink);border:1px solid rgba(17,26,20,.06);transition:background .4s,color .4s,padding .5s cubic-bezier(.2,.8,.2,1)}
.cm:hover{background:var(--g);color:#fff;padding-left:36px}
.cm .cmi{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:#E3EFE6;color:var(--g);transition:background .4s,color .4s,transform .6s cubic-bezier(.2,.9,.25,1.3)}
.cm:hover .cmi{background:rgba(255,255,255,.16);color:#fff;transform:rotate(-12deg)}
.cm .cml{font-size:15px;color:var(--mu);transition:color .4s}
.cm:hover .cml{color:rgba(255,255,255,.8)}
.cm .cmv{display:block;font:600 clamp(22px,1.9vw,30px)/1.15 var(--f-d);letter-spacing:-0.025em;margin-top:4px}
.cm .go{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;border:1.5px solid rgba(17,26,20,.14);transition:border-color .35s,background .35s}
.cm .go svg{transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.cm:hover .go{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.12)}
.cm:hover .go svg{transform:rotate(45deg)}
.fcard{position:relative;border-radius:40px;background:#fff;padding:clamp(32px,3.6vw,64px);display:flex;flex-direction:column;gap:32px}
.flbl{font-size:15px;font-weight:600;color:var(--ink);margin-bottom:12px;display:block}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;justify-content:center;line-height:1;min-height:46px;padding:0 20px;border-radius:999px;border:1.5px solid rgba(17,26,20,.14);background:transparent;color:var(--ink);font:500 15px var(--f-b);cursor:pointer;transition:background .3s,border-color .3s,color .3s}
.chip:hover{border-color:var(--g);color:var(--g)}
.chip-on,.chip-on:hover{background:var(--g);border-color:var(--g);color:#fff}
.chip span{margin:0!important}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fl{position:relative;display:block}
.fl input,.fl textarea{width:100%;min-height:64px;padding:26px 22px 10px;border-radius:20px;border:1.5px solid rgba(17,26,20,.12);background:#F2F4F3;font:500 17px var(--f-b);color:var(--ink);outline:none;transition:border-color .3s,background .3s;resize:vertical}
.fl textarea{min-height:140px;padding-top:30px}
.fl input:focus,.fl textarea:focus{border-color:var(--g);background:#fff}
.fl span{position:absolute;left:23px;top:21px;font-size:16px;color:#6B7A70;pointer-events:none;transition:top .25s,font-size .25s,color .25s}
.fl input:focus+span,.fl input:not(:placeholder-shown)+span,.fl textarea:focus+span,.fl textarea:not(:placeholder-shown)+span{top:9px;font-size:12px;color:var(--g);font-weight:600}
.fwide{grid-column:1 / -1}
.chk{display:flex;align-items:center;gap:12px;font-size:15px;color:var(--mu)}
.chk input{width:22px;height:22px;accent-color:var(--g);margin:0}
.sent{display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:40px 0}
.city{display:flex;flex-direction:column;align-items:flex-start;gap:20px;padding:32px;border-radius:32px;background:#fff;transition:background .4s,color .4s}
.city .cs{width:56px;height:56px;transition:transform .8s cubic-bezier(.2,.9,.25,1.3)}
.city:hover{background:var(--gd);color:#F2F4F3}
.city:hover .cs{transform:rotate(-90deg) scale(1.1)}
.city h3{margin:0;font-size:clamp(24px,2.1vw,32px);font-weight:600;line-height:1.05}
@media (max-width:900px){.fgrid{grid-template-columns:1fr}}

/* =====================================================================
   Bloque 2 — añadidos de producción (no están en el prototipo)
   ===================================================================== */
.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}
.skip{position:absolute;left:16px;top:-80px;z-index:200;padding:12px 20px;border-radius:999px;background:var(--gd);color:#fff;font-weight:600;transition:top .2s}
.skip:focus{top:16px;color:#fff}
:focus-visible{outline:3px solid var(--au);outline-offset:3px;border-radius:12px}
.btn:focus-visible,.nav-a:focus-visible,.lang button:focus-visible,.wa:focus-visible{border-radius:999px}
img{max-width:100%}

/* Cabecera */
.hdr{position:sticky;top:0;z-index:50;background:rgba(242,244,243,.88);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:88px}
.hdr-logo{display:flex;align-items:center;flex:none}
.hdr-logo img{height:54px;width:auto;display:block}
.hdr-r{display:flex;align-items:center;gap:20px}
.hdr-nav{display:flex;align-items:center;gap:4px}
.burger{display:none;width:48px;height:48px;border:0;border-radius:50%;background:#E3E9E5;color:var(--ink);cursor:pointer;place-items:center;flex:none;transition:background .3s}
.burger:hover{background:#D9E1DC}
.burger span{display:block;width:20px;height:2px;border-radius:2px;background:currentColor;position:relative;transition:background .3s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:20px;height:2px;border-radius:2px;background:currentColor;transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.mnav{position:fixed;inset:88px 0 0;z-index:49;background:#F2F4F3;padding:24px clamp(20px,4vw,80px) 40px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-12px);transition:opacity .3s,transform .35s cubic-bezier(.2,.8,.2,1),visibility 0s .35s}
.mnav.open{opacity:1;visibility:visible;transform:none;transition:opacity .3s,transform .35s cubic-bezier(.2,.8,.2,1)}
.mnav .nav-a{font-family:var(--f-d);font-size:clamp(28px,8vw,40px);font-weight:600;letter-spacing:-0.03em;min-height:64px;padding:0 20px;justify-content:space-between}
.mnav .lang{align-self:flex-start;margin-top:24px}
@media (max-width:900px){
  .burger{display:grid}
  .hdr-r{gap:10px}
  .hdr-r > .lang{display:none}
  .hdr-in{height:76px}
  .hdr-logo img{height:44px}
  .mnav{inset:76px 0 0}
}
@media (max-width:420px){
  .hdr-cta{padding:0 18px!important;min-height:44px!important;font-size:14px!important}
  .hdr-cta .ic{display:none}
  .hdr-logo img{height:38px}
}
@media (min-width:901px){.mnav{display:none}}

/* Pie */
@media (max-width:600px){
  .fmail{font-size:clamp(20px,6.4vw,26px);word-break:break-word}
  .ft-cols{gap:40px 32px!important}
  .ft-cols > :first-child{flex-basis:100%}
}

/* WhatsApp: en táctil no hay hover, se queda en círculo */
@media (hover:none){.wa:hover .wa-t{max-width:0;margin-left:0}}
.ftr{position:relative;background:var(--gd);color:#F2F4F3;border-radius:48px 48px 0 0;overflow:hidden}
.admin-bar .hdr{top:32px}
@media (max-width:782px){.admin-bar .hdr{top:46px}}
@media (max-width:600px){#wpadminbar{position:fixed}}

/* Páginas de texto (legales y genéricas) */
.txt-page{padding:clamp(56px,7vw,112px) 0 clamp(96px,11vw,170px)}
.txt-page h1{margin:0 0 clamp(32px,4vw,56px);font-size:clamp(40px,5vw,80px);line-height:.98}
.prose{max-width:780px;font-size:17px;line-height:1.7;color:var(--ink)}
.prose h2{font-family:var(--f-d);font-weight:600;letter-spacing:-0.025em;font-size:clamp(24px,2.1vw,32px);line-height:1.15;margin:2em 0 .6em}
.prose h3{font-family:var(--f-d);font-weight:600;font-size:20px;margin:1.6em 0 .5em}
.prose p,.prose ul,.prose ol{margin:0 0 1.1em}
.prose a{text-decoration:underline;text-underline-offset:3px}

/* =====================================================================
   Animaciones de entrada (una vez al aparecer, sutiles) — 2026-11-04
   Clases para cualquier plantilla:
     .in   sube 36px + fundido      .in-s  escala .95→1 + fundido (fotos, bloques)
     .in-f solo fundido
   Solo se ocultan si hay JS (html.kz-in, puesto en <head>) y no hay «reducir movimiento».
   main.js añade .is-in al asomar (escalonado por orden con --d) y, al terminar, la cambia
   por .in-done: así la animación no bloquea los transform de los hovers.
   data-in-delay="0.2" fuerza el retardo (segundos) de un elemento.
   ===================================================================== */
@media (prefers-reduced-motion: no-preference){
  .kz-in .in:not(.in-done){opacity:0;transform:translateY(36px)}
  .kz-in .in-s:not(.in-done){opacity:0;transform:scale(.95)}
  .kz-in .in-f:not(.in-done){opacity:0}
  .kz-in .in.is-in{animation:kzIn .9s cubic-bezier(.2,.8,.2,1) var(--d,0s) both}
  .kz-in .in-s.is-in{animation:kzInS 1.1s cubic-bezier(.2,.8,.2,1) var(--d,0s) both}
  .kz-in .in-f.is-in{animation:kzInF .9s ease var(--d,0s) both}
}
@keyframes kzIn{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
@keyframes kzInS{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:none}}
@keyframes kzInF{from{opacity:0}to{opacity:1}}

/* Traductor GTranslate con el aspecto de la píldora ES/EN del diseño (.lang) */
.gtranslate_wrapper.lang{gap:0;min-height:48px;align-items:center}
.gtranslate_wrapper a{min-width:44px;min-height:40px;padding:0 12px;border-radius:999px;display:inline-grid;place-items:center;color:var(--mu);font:600 14px var(--f-b);text-decoration:none;transition:background .3s,color .3s}
.gtranslate_wrapper a:hover{color:var(--ink)}
.gtranslate_wrapper a.gt-current-lang{background:#fff;color:var(--g)}
.mnav-lang .gtranslate_wrapper{margin-top:24px}
/* Sin consentimiento el traductor no se carga: no se muestra la píldora vacía */
.gtranslate_wrapper:empty{display:none}

/* Cookies (GDPR Cookie Compliance): el botón flotante de ajustes, abajo a la izquierda con los mismos
   márgenes que el botón de WhatsApp (abajo a la derecha). El plugin lo pega a ~15-20px del borde. */
#moove_gdpr_save_popup_settings_button{left:clamp(16px,2.4vw,32px)!important;bottom:clamp(16px,2.4vw,32px)!important}

/* La barra de Google Translate que aparece al traducir no debe empujar la página */
body{top:0!important}
.skiptranslate iframe,#goog-gt-tt,.goog-te-balloon-frame{display:none!important}

/* Menú móvil: la flecha de los enlaces externos (Campus Virtual) a escala del texto grande */
.mnav .ext .ei{width:clamp(36px,9vw,44px);height:clamp(36px,9vw,44px);flex:none}
.mnav .ext .ei svg{width:clamp(15px,3.8vw,18px);height:clamp(15px,3.8vw,18px);stroke-width:2.4}
.mnav .nav-a.ext{justify-content:flex-start;gap:14px}

/* Áreas formativas (Inicio): la forma del hover aparece solo con fundido, sin girar ni crecer */
.cloud .w .wi,.cloud .w:hover .wi{transform:none;transition:opacity .35s}

/* Catálogo de cursos: la forma de cada fila no se mueve en el hover */
.crow:hover .ci{transform:none}

/* Buscador de cursos: botón de borrar propio (sustituye la X azul del navegador) */
.srch input::-webkit-search-cancel-button{
  -webkit-appearance:none;appearance:none;flex:none;width:32px;height:32px;margin-left:8px;border-radius:50%;cursor:pointer;
  background:#E3EFE6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A3D24' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E") center/14px no-repeat;
  transition:background-color .3s
}
.srch input::-webkit-search-cancel-button:hover{background-color:#D5E6D8}

/* Sedes (Contacto): la forma de cada ciudad no se mueve en el hover */
.city:hover .cs{transform:none}