/* Grupo InteligencIA · sitio v2 · sistema del Manual de identidad v1
   Dos gestos: el punto (pequeño) y el pliegue (grande). Color plano, ángulos de 45 y 90. */

@font-face{font-family:"Bricolage Grotesque";src:url(/assets/fonts/bricolage-grotesque-var.woff2) format("woff2");font-weight:200 800;font-stretch:75% 100%;font-display:swap}
@font-face{font-family:Newsreader;src:url(/assets/fonts/newsreader-italic-var.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:Newsreader;src:url(/assets/fonts/newsreader-var.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ibm-plex-mono-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url(/assets/fonts/ibm-plex-mono-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --ob:#0f172a;--bl:#fff;--pa:#f6f1e7;--pi:#e6dfd0;--su:#55607a;--ff:#d8cfbd;
  --an:#2b44d9;--ma:#f4b92e;--ja:#12a37f;--ba:#f0603a;--bu:#f0508c;
  --ant:#d5dbfa;--mat:#fcecc0;--jat:#cdeee4;--bat:#fbd9cd;--but:#fcd6e5;
  --sans:"Bricolage Grotesque",system-ui,sans-serif;
  --serif:Newsreader,Georgia,serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --gut:max(clamp(20px,5vw,64px),calc((100vw - 1344px)/2));
  --nav-h:72px;
  --sale:cubic-bezier(.2,.7,.2,1);
  --bote:cubic-bezier(.3,1.55,.5,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--nav-h) + 8px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bl);color:var(--ob);font-family:var(--sans);font-size:clamp(17px,1.05vw + 13px,18px);line-height:1.45;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
img,svg{display:block;max-width:100%}
button,input,textarea{font:inherit;color:inherit}
strong,b{font-weight:800}
:focus-visible{outline:3px solid var(--bu);outline-offset:3px}
.c-bu :focus-visible,.c-bu:focus-visible{outline-color:var(--ob)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:16px;top:-80px;z-index:200;background:var(--ob);color:#fff;padding:12px 18px;font-weight:700}
.skip-link:focus{top:12px}

/* ---------- Color ---------- */
.sh{display:inline-block;flex:none;width:.66em;height:.66em;background-color:currentColor}
.c-an{background-color:var(--an)}.c-ma{background-color:var(--ma)}.c-ja{background-color:var(--ja)}.c-ba{background-color:var(--ba)}.c-bu{background-color:var(--bu)}.c-ob{background-color:var(--ob)}
.c-ant{background-color:var(--ant)}.c-mat{background-color:var(--mat)}.c-jat{background-color:var(--jat)}.c-bat{background-color:var(--bat)}
svg .c-an{fill:var(--an);stroke:var(--an)}svg .c-ma{fill:var(--ma);stroke:var(--ma)}svg .c-ja{fill:var(--ja);stroke:var(--ja)}svg .c-ba{fill:var(--ba);stroke:var(--ba)}svg .c-bu{fill:var(--bu);stroke:var(--bu)}svg .c-ob{fill:var(--ob);stroke:var(--ob)}
svg polygon{stroke-width:.7;stroke-linejoin:round}
.on-dark{color:#fff}
.c-t-ma{color:var(--ma)}

/* ---------- Tipografía ---------- */
h1,h2,h3{font-weight:800;text-wrap:balance}
h1{font-size:clamp(2.3rem,4.3vw + .6rem,3.75rem);line-height:.98;letter-spacing:-.04em}
h2{font-size:clamp(2.1rem,3.6vw + .6rem,3.4rem);line-height:1;letter-spacing:-.04em}
.lead{max-width:62ch;text-wrap:pretty}
.rot{font-family:var(--mono);font-weight:500;font-size:12px;line-height:1.3;letter-spacing:.08em;text-transform:uppercase}
.tesis{font-family:var(--serif);font-style:italic;font-weight:300;letter-spacing:-.015em;line-height:1.08;text-wrap:balance}
.cifra{font-family:var(--mono);font-weight:500;font-size:clamp(44px,5vw,64px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}

/* ---------- El punto ---------- */
.sh.ci{border-radius:50%}
.sh.di{transform:rotate(45deg) scale(.86)}
.idx{display:flex;gap:10px;align-items:flex-end;height:22px;margin-bottom:18px;font-size:18px}
.idx .sh:nth-child(2){translate:0 -8px}.idx .sh:nth-child(3){translate:0 -3px}
.punto{position:absolute;display:block;pointer-events:none;z-index:3}
@keyframes resp{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes salto{0%,100%{translate:0 0}40%{translate:0 -7px}}

/* ---------- Layout ---------- */
.wrap{padding-inline:var(--gut)}
.sec{padding-block:clamp(72px,9vw,128px)}
.sec-head{margin-bottom:clamp(36px,5vw,64px)}
.sec-head h2{max-width:16ch}
.sec-head .lead{margin-top:20px}
.sec-pap{background:var(--pa)}

/* ---------- Botones ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:12px 26px 12px 18px;border:2px solid transparent;background:var(--bu);color:var(--ob);font-weight:700;font-size:15px;line-height:1.2;text-decoration:none;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s,translate .12s}
.btn:hover{background:var(--ob);color:#fff}
.btn:active{translate:0 2px}
.btn-ob{background:transparent;border-color:var(--ob);padding-right:18px}
.arr{display:inline-block;transition:translate .25s var(--sale)}
a:hover>.arr,button:hover>.arr,a:hover>b>.arr{translate:4px 0}
.btn[disabled]{cursor:wait;opacity:.7}

/* ---------- Nav ---------- */
.nav{position:fixed;inset:0 0 auto;z-index:100;background:#fff;border-bottom:1px solid transparent;transition:border-color .3s,background-color .3s}
.nav.is-scrolled{border-bottom-color:var(--pi)}
.nav-in{height:var(--nav-h);padding-inline:var(--gut);display:flex;align-items:center;gap:28px}
.nav-in>*{transition:opacity .45s .15s}
.nav-logo{display:block;margin-right:auto;color:var(--ob);flex:none}
.logo{height:42px;width:auto;overflow:visible;transform-origin:0 0}
.logo .d1{fill:var(--ba)}.logo .d2{fill:var(--an)}.logo .d3{fill:var(--ma)}
.nav-links{display:flex;gap:26px}
.nav-links a{display:inline-flex;align-items:center;gap:8px;min-height:44px;text-decoration:none;font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.nav-links .sh{width:10px;height:10px;transition:translate .3s var(--bote)}
.nav-links a:hover .sh{animation:salto .45s var(--sale)}
.nav-links a.activo .sh{translate:0 -6px}
.menu-btn{display:none;align-items:center;gap:10px;min-height:44px;padding:0 4px;background:none;border:0;cursor:pointer}
.menu-dots{display:flex;gap:5px;align-items:flex-end;height:20px;font-size:15px}
.menu-dots .sh{transition:translate .3s var(--bote)}
.menu-dots .sh:nth-child(2){translate:0 -7px}.menu-dots .sh:nth-child(3){translate:0 -3px}
.menu-btn[aria-expanded=true] .menu-dots .sh{translate:0 -3px}
.menu-txt{font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.mm{position:absolute;inset:100% 0 auto;background:#fff;border-bottom:4px solid var(--bu);padding:8px var(--gut) 28px;clip-path:polygon(0 0,100% 0,100% 0,0 0);transition:clip-path .35s var(--sale)}
.mm.abre{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.mm a{display:flex;align-items:center;gap:14px;min-height:56px;font-weight:800;font-size:30px;letter-spacing:-.04em;text-decoration:none}
.mm .sh{width:14px;height:14px}
.mm li{opacity:0;translate:0 -8px;transition:opacity .3s,translate .3s var(--sale);transition-delay:calc(var(--i)*40ms + 80ms)}
.mm.abre li{opacity:1;translate:0 0}
.mm .mm-cta{display:inline-flex;margin-top:12px;background:var(--bu);padding:0 22px 0 16px;font-size:22px}
@media (max-width:939px){
  .nav-links,.nav-cta{display:none}
  .menu-btn{display:inline-flex}
  :root{--nav-h:64px}
  .logo{height:36px}
}
@media (min-width:940px){.mm{display:none}}

/* ---------- Inicio ---------- */
.hero{padding-top:calc(var(--nav-h) + clamp(28px,5vw,56px))}
.hero-top{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 48px;align-items:start}
.hero-copy>.rot{color:var(--su);margin-bottom:14px}
.hero-copy h1{max-width:20ch}
.hero-copy .lead{margin-top:20px;max-width:56ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.cifras{display:grid;gap:18px;text-align:right}
.cifras .rot{margin-top:2px}
@media (max-width:799px){
  .hero-top{grid-template-columns:1fr}
  .cifras{grid-template-columns:auto auto;justify-content:start;gap:28px;text-align:left}
}

/* ---------- La cinta ---------- */
.ribbon{position:relative;display:block;container-type:inline-size;margin-top:clamp(28px,4vw,48px)}
.rb-svg{width:100%;height:auto;overflow:visible}
.rb-sk polygon{fill:var(--pi);stroke:var(--pi)}
.rb-svg .f{transform-box:fill-box}
.rb-svg .gx{transform-origin:0 50%}.rb-svg .gxr{transform-origin:100% 50%}
.rb-svg .gy{transform-origin:50% 0}.rb-svg .gyb{transform-origin:50% 100%}
.rb-m{display:none}
.rb-l{position:absolute;display:flex;align-items:center;gap:.9cqw;text-decoration:none;white-space:nowrap}
.rb-l b{font-size:max(2.66cqw,20px);letter-spacing:-.03em;line-height:1}
.rb-l .rot{font-size:max(.8cqw,10px)}
.rb-l b{background:linear-gradient(currentColor,currentColor) 0 100%/0 3px no-repeat;transition:background-size .3s var(--sale)}
.rb-l:hover b,.rb-l:focus-visible b{background-size:100% 3px}
.rb-hero .rb-l{height:29.4%}
.rb-hero .l1{left:5%;top:28.2%}.rb-hero .l2{left:31.2%;top:65%}.rb-hero .l3{left:55.9%;top:5.65%}.rb-hero .l4{left:80.5%;top:48%}
.rb-hero .p-di{left:68.5%;top:-24%;width:min(3.6cqw,52px);height:min(3.6cqw,52px);rotate:45deg}
.rb-hero .p-ci{left:43.6%;top:41%;width:min(3.1cqw,44px);height:min(3.1cqw,44px);border-radius:50%}
.rb-hero{padding-bottom:clamp(20px,3vw,40px)}
@media (min-width:1100px){.rb-hero{margin-top:calc(-7vw + 28px)}}
@media (min-width:800px) and (max-width:1099px){.rb-l .lg-only{display:none}}

@media (max-width:799px){
  .rb-hero{--rbw:min(34cqw,170px)}
  .rb-hero .rb-d{display:none}.rb-hero .rb-m{display:block;width:var(--rbw);margin-left:calc(var(--gut) - var(--rbw)*.073)}
  .rb-hero .rb-l{left:calc(var(--gut) + var(--rbw)*.927 + 18px);height:auto;flex-direction:column;align-items:flex-start;gap:4px;color:var(--ob)}
  .rb-hero .rb-l b{font-size:26px}.rb-hero .rb-l .rot{font-size:11px}
  .rb-hero .l1{top:5%}.rb-hero .l2{top:30%}.rb-hero .l3{top:53%}.rb-hero .l4{top:79%}
  .rb-hero .p-di{left:auto;right:9%;top:16%;width:26px;height:26px}
  .rb-hero .p-ci{left:auto;right:22%;top:62%;width:22px;height:22px}
  .rb-hero{padding-bottom:0}
}

/* Metodología */
.sec-met{padding-bottom:clamp(56px,7vw,96px)}
.rb-met{margin-top:0}
.rb-f{display:block}
.rb-t{position:absolute;display:flex;flex-direction:column;justify-content:center;gap:2px;height:19.35%}
.rb-t b{font-size:max(2.2cqw,22px);letter-spacing:-.03em;line-height:1.05}
.rb-t .rot{font-size:11px}
.rb-f p{position:absolute;font-size:max(1.13cqw,14px);line-height:1.35}
.f1 .rb-t{left:5%;top:4.03%}.f2 .rb-t{left:28.1%;top:28.2%}.f3 .rb-t{left:52.3%;top:52.4%}.f4 .rb-t{left:76.6%;top:76.6%}
.f1 p{left:5%;top:26.2%;width:13.8%}
.f2 p{left:28.9%;bottom:73.8%;width:18.5%}
.f3 p{left:53.1%;bottom:49.6%;width:18.5%}
.f4 p{left:77.3%;bottom:25.4%;width:18%}
.met-tesis{font-size:clamp(26px,2.6vw,34px);max-width:20em;margin-top:clamp(32px,4vw,56px)}
@media (min-width:1040px){.met-tesis{margin-top:-7%;max-width:15em}}
@media (max-width:1039px){
  .rb-met{--rbw:min(38cqw,190px)}
  .rb-met .rb-d{display:none}.rb-met .rb-m{display:block;width:var(--rbw);margin-left:calc(var(--gut) - var(--rbw)*.073)}
  .rb-f{position:absolute;left:calc(var(--gut) + var(--rbw)*.927 + 18px);right:var(--gut);max-width:34em}
  .rb-f .rb-t,.rb-f p{position:static;width:auto;height:auto}
  .rb-f .rb-t{color:var(--ob);margin-bottom:8px}
  .rb-f .rb-t b{font-size:24px}
  .rb-f p{font-size:clamp(14px,1.6vw,16px)}
  .f1{top:2%}.f2{top:27%}.f3{top:51.5%}.f4{top:76.5%}
}

/* ---------- Fichas de vertical ---------- */
#verticales{padding-bottom:0}
.v-an{--v:var(--an);--vt:var(--ant)}.v-ma{--v:var(--ma);--vt:var(--mat)}.v-ja{--v:var(--ja);--vt:var(--jat)}.v-ba{--v:var(--ba);--vt:var(--bat)}
.ficha{display:grid;grid-template-columns:5fr 7fr;scroll-margin-top:var(--nav-h)}
.ficha-campo{position:relative;background:var(--vt);padding:clamp(36px,4.5vw,64px) 40px clamp(36px,4.5vw,64px) var(--gut);display:flex;flex-direction:column;gap:12px;overflow:hidden}
.ficha-campo::before{content:"";position:absolute;inset:0;background:var(--v);clip-path:polygon(0 0,135% 0,100% 100%,0 100%)}
.ficha-campo>*{position:relative}
.ficha-campo h3{font-size:clamp(2.6rem,5vw,4.5rem);line-height:.92;letter-spacing:-.05em}
.ficha-campo h3 .sh{width:.2em;height:.2em;margin-left:.08em;vertical-align:.62em;background:currentColor;transition:translate .3s var(--bote)}
.ficha:hover h3 .sh{animation:salto .5s var(--sale)}
.ficha-link{margin-top:auto;padding-top:20px;align-self:flex-start;font-family:var(--mono);font-weight:500;font-size:13px;letter-spacing:.04em;text-underline-offset:5px;min-height:44px;display:inline-flex;align-items:flex-end;gap:8px}
.ficha-texto{padding:clamp(36px,4.5vw,64px) var(--gut) clamp(36px,4.5vw,64px) clamp(28px,4.5vw,64px);border-bottom:1px solid var(--pi)}
.ficha-texto>p{max-width:64ch;text-wrap:pretty}
.pts{display:grid;grid-template-columns:1fr 1fr;gap:12px 28px;margin-top:26px;font-size:16px;max-width:64ch}
.pts li{display:flex;gap:12px;align-items:baseline;line-height:1.35}
.pts .sh{background:var(--v);width:11px;height:11px;position:relative;top:0}
.pts a{text-decoration-color:var(--v);text-decoration-thickness:2px;text-underline-offset:4px}
.pts a:hover{text-decoration-thickness:4px}
@media (max-width:859px){
  .ficha{grid-template-columns:1fr}
  .ficha-campo{padding-right:var(--gut)}
  .ficha-link{margin-top:6px;padding-top:0}
  .ficha-texto{padding-left:var(--gut);border-bottom:0}
}
@media (max-width:519px){.pts{grid-template-columns:1fr}}

/* ---------- Collage ---------- */
.collage{--ed:clamp(20px,5vw,64px);max-width:1472px;margin-inline:auto;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(136px,auto);scroll-margin-top:var(--nav-h)}
.blk{position:relative;padding:16px 18px;display:flex;flex-direction:column;justify-content:space-between;gap:14px;overflow:hidden;text-decoration:none;min-width:0}
.blk .rot{font-size:10.5px}
.plat-n{display:block}
.plat-n b{display:block;font-size:clamp(20px,1.9vw,24px);letter-spacing:-.03em;line-height:1}
.plat-n .d{display:block;margin-top:5px;font-size:14px;line-height:1.25}
.b-title{background:#fff;padding:clamp(28px,3.4vw,44px) 40px clamp(28px,3.4vw,44px) var(--ed);overflow:visible;z-index:2;justify-content:flex-start;gap:16px}
.b-title .rot{font-size:11px;letter-spacing:.2em}
.b-title h2{max-width:12ch}
.b-title .q1{right:-20px;top:36%;width:40px;height:40px}
.b-title .q2{right:16%;top:-18px;width:40px;height:40px;border-radius:50%}
.b-tesis{padding:28px var(--ed) 28px 32px;justify-content:flex-start;gap:14px}
.b-tesis .tesis{font-size:clamp(26px,2.5vw,32px);max-width:16em}
.b-nota{font-size:14.5px;line-height:1.4;color:#cbd2e0;max-width:46ch;margin-top:auto}
.b-tec{padding-left:var(--ed);justify-content:center;gap:12px}
.b-tec ul{display:flex;flex-wrap:wrap;gap:6px 22px;font-weight:800;font-size:clamp(18px,1.8vw,24px);letter-spacing:-.03em;line-height:1.15}
.b-cta{justify-content:center;padding-right:var(--ed)}
.b-cta b{font-size:clamp(26px,2.4vw,32px);letter-spacing:-.03em}
.b-cta{transition:background-color .2s,color .2s}
.b-cta:hover{background-color:var(--ob);color:#fff}
/* esquina doblada: invita a voltear el bloque */
.fold::after{content:"";position:absolute;right:0;top:0;width:34px;height:34px;background:#fff;clip-path:polygon(0 0,100% 0,100% 100%);z-index:3}
.fold::before{content:"";position:absolute;right:0;top:0;width:34px;height:34px;background:rgba(15,23,42,.28);clip-path:polygon(0 0,0 100%,100% 100%);z-index:3;transition:width .3s var(--sale),height .3s var(--sale)}
.fold::after{transition:width .3s var(--sale),height .3s var(--sale)}
.back{position:absolute;inset:0;z-index:2;padding:16px 18px;display:flex;flex-direction:column;justify-content:space-between;background:var(--ob);color:#fff;clip-path:polygon(100% 0,100% 0,100% 0);transition:clip-path .3s var(--sale)}
.back b{font-family:var(--mono);font-weight:500;font-size:14px;letter-spacing:0;overflow-wrap:anywhere}
.back .rot{color:var(--ma)}
@media (hover:hover){
  .fold:hover .back,.fold:focus-visible .back{clip-path:polygon(100% 0,-100% 0,100% 200%)}
  .fold:hover::before,.fold:hover::after,.fold:focus-visible::before,.fold:focus-visible::after{width:0;height:0}
}
@media (hover:none){.fold:active::before,.fold:active::after{width:46px;height:46px}}

@media (min-width:1040px){
  .b-title{grid-area:1/1/4/8}.b-tesis{grid-area:1/8/3/13}
  .p-axioma{grid-area:3/8/4/11}.p-jurispro{grid-area:3/11/4/13}
  .p-ninez{grid-area:4/1/5/4}.p-miacademia{grid-area:4/4/5/7}.p-play{grid-area:4/7/5/10}.p-pulso{grid-area:4/10/5/13}
  .p-library{grid-area:5/1/6/3}.p-agora{grid-area:5/3/6/6}.p-ceiba{grid-area:5/6/6/9}.p-deporte{grid-area:5/9/6/11}.p-golazo{grid-area:5/11/6/13}
  .b-tec{grid-area:6/1/7/10}.b-cta{grid-area:6/10/7/13}
  .p-ninez,.p-library{padding-left:var(--ed)}
  .p-jurispro,.p-pulso,.p-golazo{padding-right:var(--ed)}
}
@media (min-width:640px) and (max-width:1039px){
  .collage{grid-template-columns:repeat(6,1fr)}
  .blk{grid-column:span 2}
  .b-title,.b-tesis{grid-column:span 6}
  .b-tesis{padding-left:var(--ed)}
  .p-deporte,.p-golazo{grid-column:span 3}
  .b-tec{grid-column:span 4}
  .b-title .q1{right:12%;top:auto;bottom:-20px}
}
@media (max-width:639px){
  .collage{grid-template-columns:1fr 1fr;grid-auto-rows:minmax(128px,auto)}
  .b-title,.b-tesis,.b-tec,.b-cta,.p-axioma,.p-miacademia,.p-ceiba{grid-column:span 2}
  .b-tesis{padding-left:var(--ed)}
  .b-cta{min-height:112px;padding-left:var(--ed)}
  .b-title .q1{right:14%;top:auto;bottom:-16px;width:32px;height:32px}
  .b-title .q2{width:32px;height:32px;top:-14px}
  .plat-n b{font-size:19px}
}
@media (max-width:1039px){.collage>.plat{padding-inline:clamp(18px,2.6vw,24px)}}
@media (max-width:639px){.collage>.plat{padding-inline:var(--ed) 14px}.b-tec{padding-block:24px}}

/* ---------- Nosotros ---------- */
.nos{display:grid;grid-template-columns:7fr 5fr;gap:clamp(36px,6vw,88px);align-items:start}
.nos-texto h2{max-width:13ch;margin-bottom:28px}
.nos-texto>p{max-width:60ch;text-wrap:pretty}
.nos-texto>p+p{margin-top:16px}
.nos-tesis{font-size:clamp(30px,3.4vw,46px);max-width:16em;margin-block:28px!important}
.lugares{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:32px}
.lugares li{display:flex;align-items:center;gap:10px}
.lugares .sh{width:12px;height:12px}
.lugares li:nth-child(2) .sh{translate:0 -5px}
.vm{padding:clamp(28px,3vw,40px)}
.vm h3{font-size:clamp(30px,3vw,40px);letter-spacing:-.04em;line-height:1;margin-bottom:14px}
.vm p{font-size:16.5px}
@media (max-width:939px){.nos{grid-template-columns:1fr}}

/* ---------- Contacto ---------- */
.contacto{display:grid;grid-template-columns:5fr 7fr;scroll-margin-top:var(--nav-h)}
.ct-campo{padding:clamp(56px,7vw,112px) clamp(28px,4vw,56px) clamp(56px,7vw,112px) var(--gut)}
.ct-campo h2{max-width:9ch}
.ct-campo>p{margin-top:24px;max-width:44ch;text-wrap:pretty}
.ct-datos{margin-top:28px;display:grid;gap:4px;font-weight:700}
.ct-datos li{display:flex;align-items:center;gap:12px;min-height:44px}
.ct-datos .sh{width:12px;height:12px}
.ct-datos a{text-underline-offset:5px;text-decoration-thickness:2px}
.ct-form{padding:clamp(48px,7vw,112px) var(--gut) clamp(56px,7vw,112px) clamp(28px,4.5vw,64px);display:grid;gap:22px;align-content:start}
.ct-form>.rot{color:var(--su)}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.field label{display:block;font-weight:700;font-size:15px;margin-bottom:6px}
.field .opc{font-weight:400;color:var(--su)}
.field input,.field textarea{display:block;width:100%;min-height:50px;padding:12px 14px;background:#fff;border:2px solid var(--ob);border-radius:0;font-size:17px;line-height:1.35;transition:background-color .2s,box-shadow .2s}
.field textarea{resize:vertical;min-height:140px}
.field input:focus,.field textarea:focus{outline:none;box-shadow:6px 6px 0 var(--bu)}
.field.is-invalid input,.field.is-invalid textarea{box-shadow:6px 6px 0 var(--ba)}
.field-error{display:none;align-items:baseline;gap:9px;margin-top:10px;font-size:14.5px;font-weight:700}
.field-error .sh{width:10px;height:10px}
.field.is-invalid .field-error{display:flex}
.f-send{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px}
.f-status{min-height:24px;font-size:15px;font-weight:700;display:flex;align-items:baseline;gap:10px}
.f-status::before{content:"";flex:none;width:11px;height:11px;display:none}
.f-status[data-kind=ok]::before{display:block;background:var(--ja);border-radius:50%;animation:salto .5s var(--sale) 2}
.f-status[data-kind=err]::before{display:block;background:var(--ba)}
.f-status[data-kind=wait]::before{display:block;background:var(--ma);rotate:45deg;animation:resp 1s ease-in-out infinite}
@media (max-width:859px){
  .contacto{grid-template-columns:1fr}
  .ct-campo{padding-right:var(--gut)}
  .ct-form{padding-left:var(--gut)}
}
@media (max-width:519px){.f-row{grid-template-columns:1fr}}

/* ---------- Pie ---------- */
.foot{padding-block:clamp(56px,7vw,96px) 28px;padding-bottom:max(28px,env(safe-area-inset-bottom))}
.foot-tesis{font-size:clamp(38px,6.4vw,92px);max-width:11em}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px 48px;margin-top:clamp(48px,6vw,88px);padding-bottom:48px}
.foot-marca img{width:220px;height:auto}
.foot-marca p{margin-top:20px;font-size:15px;color:#cbd2e0;max-width:36ch}
.foot h2{color:var(--ma);font-size:12px;letter-spacing:.08em;margin-bottom:12px}
.foot li a,.foot li>span{display:inline-flex;align-items:center;gap:10px;min-height:40px;font-size:15px;color:#cbd2e0;text-decoration:none}
.foot li a:hover{color:#fff;text-decoration:underline;text-underline-offset:5px}
.foot li .sh{width:9px;height:9px}
.foot li a:hover .sh{animation:salto .45s var(--sale)}
.redes{display:flex;gap:10px;margin-top:22px}
.redes a{width:44px;height:44px;justify-content:center;background:rgba(255,255,255,.08);color:#fff!important;transition:background-color .2s,color .2s}
.redes a:hover{background:var(--bu);color:var(--ob)!important}
.redes svg{width:20px;height:20px}
.foot-fin{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14);color:#a9b1c4;font-size:11px}
@media (max-width:939px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:519px){.foot-grid{grid-template-columns:1fr}}

/* ---------- Cursor: un punto buganvilia sobre los enlaces ---------- */
.cursor-dot{position:fixed;left:0;top:0;z-index:300;width:14px;height:14px;margin:14px 0 0 14px;border-radius:50%;background:var(--bu);pointer-events:none;opacity:0;scale:.2;transition:opacity .2s,scale .25s var(--bote),background-color .2s}
.cursor-dot.on{opacity:1;scale:1}
.cursor-dot.inv{background:var(--ob)}
@media (hover:none),(pointer:coarse){.cursor-dot{display:none}}

/* =====================================================================
   Precarga, skeleton y movimiento. Solo con JS (html.js) y sin «reducir movimiento».
   ===================================================================== */
.telon{display:none}
@media (prefers-reduced-motion:no-preference){

  /* --- Telón: el logo se arma pliegue a pliegue --- */
  .js.preloading{overflow:hidden}
  .js.preloading .telon,.js .telon.sale{display:block;position:fixed;inset:0;z-index:90;background:#fff;clip-path:polygon(0 0,100% 0,100% 135%,0 100%);transition:clip-path .7s cubic-bezier(.7,0,.2,1)}
  .js .telon.sale{clip-path:polygon(0 0,100% 0,100% 0,0 -35%)}
  .js.preloading .nav{background:transparent}
  .js.preloading .nav-in>:not(.nav-logo){opacity:0}
  .js.preloading .logo:not(.go){visibility:hidden}
  .logo.vuela{transition:transform .75s cubic-bezier(.65,0,.2,1)}

  .logo polygon,.logo .lg-l,.logo .lg-d{transform-box:fill-box}
  .logo.go .s-ba{transform-origin:50% 100%;animation:crece-y .38s var(--sale) both}
  .logo.go .s-an{transform-origin:50% 100%;animation:crece-y .3s var(--sale) .24s both}
  .logo.go .s-ja{transform-origin:0 100%;animation:crece .4s var(--sale) .42s both}
  .logo.go .s-bu{transform-origin:50% 0;animation:crece-y .4s var(--sale) .66s both}
  .logo.go .s-ma{transform-origin:0 50%;animation:crece-x .34s var(--sale) .9s both}
  .logo.go .lg-l{animation:sube .42s var(--sale) calc(1.08s + var(--i)*32ms) both}
  .logo.go .lg-grupo{animation:aparece .4s ease-out 1.5s both}
  .logo.go .lg-d{animation:cae .55s var(--bote) calc(1.56s + var(--i)*110ms) both,resp 4s ease-in-out calc(3.2s + var(--i)*1.3s) infinite}
  .revisita .logo.go .lg-l{animation-delay:calc(.5s + var(--i)*14ms)}
  .revisita .logo.go .lg-grupo{animation-delay:.6s}
  .revisita .logo.go .lg-d{animation-delay:calc(.66s + var(--i)*60ms),calc(3.2s + var(--i)*1.3s)}
  .revisita .logo.go .s-an{animation-delay:.1s}.revisita .logo.go .s-ja{animation-delay:.18s}.revisita .logo.go .s-bu{animation-delay:.28s}.revisita .logo.go .s-ma{animation-delay:.38s}
  .nav-logo:hover .lg-d{animation:salto .5s var(--sale) calc(var(--i)*70ms)}
  @keyframes crece-y{from{transform:scaleY(0)}}
  @keyframes crece-x{from{transform:scaleX(0)}}
  @keyframes crece{from{transform:scale(0)}}
  @keyframes sube{from{opacity:0;transform:translateY(16px)}}
  @keyframes aparece{from{opacity:0}}
  @keyframes cae{from{opacity:0;transform:translateY(-70px)}}

  /* --- Skeleton: renglones de piedra barridos por un pliegue de luz a 45°; se funden con el texto --- */
  .js [data-reveal] .sk{position:relative;transition:color .5s ease-out calc(var(--d,0)*70ms + 60ms)}
  .js [data-reveal] .sk>*{transition:opacity .5s ease-out calc(var(--d,0)*70ms + 60ms)}
  .js [data-reveal] .sk::before{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
    background-color:var(--skc,var(--pi));
    background-image:linear-gradient(135deg,transparent 42%,rgba(255,255,255,.7) 50%,transparent 58%);
    background-size:260% 100%;
    transition:opacity .45s ease-out calc(var(--d,0)*70ms);
  }
  @supports (height:1lh){
    .js [data-reveal] .sk::before{
      background-color:transparent;
      background-image:linear-gradient(135deg,transparent 42%,rgba(255,255,255,.7) 50%,transparent 58%),repeating-linear-gradient(to bottom,var(--skc,var(--pi)) 0 .6em,transparent .6em 1lh);
      background-size:260% 100%,100% 100%;
      background-position:100% 0,0 calc((1lh - .6em)/2);
    }
  }
  .js [data-reveal]:not(.in) .sk{color:transparent!important}
  .js [data-reveal]:not(.in) .sk>*{opacity:0}
  .js [data-reveal]:not(.in) .sk::before{opacity:1;animation:barrido 1.5s linear infinite}
  @keyframes barrido{from{background-position-x:100%}to{background-position-x:0%}}

  /* bloques (botones, cifras, campos, visión y misión) */
  .js [data-reveal]:not(.in) .sk-b{background-color:var(--pi)!important;background-image:linear-gradient(135deg,transparent 42%,rgba(255,255,255,.7) 50%,transparent 58%);background-size:260% 100%;animation:barrido 1.5s linear infinite}
  .js [data-reveal]:not(.in) .sk-b>*{opacity:0}
  .js [data-reveal] .sk-b{transition:background-color .5s ease-out calc(var(--d,0)*70ms)}
  .js [data-reveal] .sk-b>*{transition:opacity .5s ease-out calc(var(--d,0)*70ms + 100ms),background-color .2s,color .2s,box-shadow .2s}

  /* fichas: el campo tenue se llena con el color de la vertical, cortado a 45° */
  .js .ficha .ficha-campo::before{transition:clip-path .7s cubic-bezier(.6,0,.2,1)}
  .js .ficha:not(.in) .ficha-campo::before{clip-path:polygon(0 0,0 0,-35% 100%,0 100%)}
  .js .ficha:not(.in) .ficha-campo>*{opacity:0;translate:-14px 0}
  .js .ficha .ficha-campo>*{transition:opacity .45s ease-out .35s,translate .5s var(--sale) .35s}

  /* la cinta se despliega cara por cara, 400 ms por pliegue */
  .js .ribbon:not(.in) .gx,.js .ribbon:not(.in) .gxr{transform:scaleX(0)}
  .js .ribbon:not(.in) .gy,.js .ribbon:not(.in) .gyb{transform:scaleY(0)}
  .js .ribbon .f{transition:transform .4s var(--sale) calc(var(--i)*.2s)}
  .js .ribbon:not(.in) .rb-l,.js .ribbon:not(.in) .rb-f{opacity:0;translate:-10px 0}
  .js .ribbon .rb-l,.js .ribbon .rb-f{transition:opacity .4s ease-out calc(var(--i)*.2s + .22s),translate .45s var(--sale) calc(var(--i)*.2s + .22s)}
  .js .ribbon:not(.in) .punto{scale:0}
  .js .ribbon .punto{transition:scale .5s var(--bote) 1.5s}
  .ribbon.in .punto{animation:resp 4s ease-in-out 2.2s infinite}
  .ribbon.in .p-ci{animation-delay:3.5s}
  .js .ribbon .rb-sk{transition:opacity .3s 1.9s}
  .js .ribbon.in .rb-sk{opacity:0}

  /* collage: las caras caen a la retícula como bloques */
  .js [data-collage]:not(.in) .blk{background-color:var(--pa)!important;translate:0 -22px}
  .js [data-collage]:not(.in) .blk:nth-child(even){background-color:var(--pi)!important}
  .js [data-collage]:not(.in) .blk>*{opacity:0}
  .js [data-collage]:not(.in) .fold::before,.js [data-collage]:not(.in) .fold::after{width:0;height:0}
  .js [data-collage] .blk{transition:background-color .45s ease-out calc(var(--i)*45ms),translate .55s var(--sale) calc(var(--i)*45ms),color .2s}
  .js [data-collage] .blk>*{transition:opacity .4s ease-out calc(var(--i)*45ms + 160ms)}
  .js [data-collage] .blk>.back{transition:clip-path .3s var(--sale)}
  .js [data-collage].in .blk>.back{opacity:1}
  .collage.in .punto{animation:resp 4s ease-in-out 1.4s infinite}
  .collage.in .q2{animation-delay:2.7s}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

@media print{.nav,.telon,.cursor-dot{display:none}}