:root{
  --azul:#123A63; --teal:#17849B; --teal-claro:#17A2B8; --coral:#FF6B6B;
  --papel:#FCFBF9; --tinta:#23303F; --gris:#5C6B7D; --gris-2:#61707F; --gris-3:#7A8794;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--papel);color:var(--tinta);font-family:'Nunito',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--teal);text-decoration:none}
a:hover{color:var(--coral)}
h1,h2,h3{margin:0}
img{display:block}
.wrap{max-width:1120px;margin:0 auto}

@keyframes c-rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}
@keyframes c-fade{from{opacity:0}to{opacity:1}}
@keyframes c-blob{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(3%,-4%) scale(1.1)}}
@keyframes c-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* NAV */
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 34px}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:42px;height:42px;object-fit:contain;mix-blend-mode:multiply}
.brand span{font-family:'Sora',sans-serif;font-size:16px;font-weight:600;letter-spacing:.02em;color:var(--azul)}
.pills{display:flex;align-items:center;gap:6px;padding:6px;border-radius:999px;background:#F1EFEA}
.pills a{padding:10px 18px;border-radius:999px;font-size:14px;font-weight:600;color:#4C5B6D;transition:background .3s ease,color .3s ease}
.pills a:hover{background:#fff;color:var(--azul)}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 24px;border:0;border-radius:999px;background:var(--azul);color:#fff;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;box-shadow:0 14px 28px -14px rgba(18,58,99,.7);transition:transform .4s cubic-bezier(.2,1,.3,1)}
.btn-primary:hover{transform:translateY(-2px);color:#fff}
.btn-primary.lg{padding:17px 30px;font-size:15.5px;box-shadow:0 20px 40px -20px rgba(18,58,99,.8)}
.btn-primary.lg:hover{transform:translateY(-3px)}
.btn-primary.block{width:100%;padding:18px;font-size:15.5px}
.btn-light{display:inline-flex;align-items:center;justify-content:center;padding:17px 30px;border-radius:999px;background:#fff;color:var(--azul);font-size:15.5px;font-weight:700;box-shadow:0 14px 30px -20px rgba(18,58,99,.6);transition:transform .4s cubic-bezier(.2,1,.3,1)}
.btn-light:hover{transform:translateY(-3px);color:var(--azul)}

/* HERO */
.hero{position:relative;padding:60px 34px 0;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none}
.blob-a{width:620px;height:620px;left:-180px;top:-180px;background:radial-gradient(circle,rgba(23,162,184,.26),transparent 68%);animation:c-blob 18s ease-in-out infinite}
.blob-b{width:520px;height:520px;right:-140px;top:80px;background:radial-gradient(circle,rgba(255,107,107,.22),transparent 68%);animation:c-blob 24s ease-in-out infinite reverse}
.hero-copy{position:relative;max-width:1120px;margin:0 auto;text-align:center}
.hero-copy h1{font-family:'Sora',sans-serif;font-weight:300;font-size:clamp(40px,6vw,86px);line-height:1.06;letter-spacing:-.035em;color:var(--azul);text-wrap:balance;animation:c-rise 1s cubic-bezier(.2,1,.3,1) .1s both}
.hero-copy h1 span{font-weight:600;color:var(--teal)}
.hero-copy>p{margin:22px auto 0;max-width:600px;font-size:18px;line-height:1.68;color:var(--gris);animation:c-rise 1s cubic-bezier(.2,1,.3,1) .2s both}
.hero-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px;animation:c-rise 1s cubic-bezier(.2,1,.3,1) .3s both}
.hero-shots{position:relative;max-width:1120px;margin:56px auto 0;display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:16px;align-items:end;animation:c-fade 1.4s ease .3s both}
.shot{position:relative;overflow:hidden}
.shot.small{height:230px;border-radius:28px;box-shadow:0 30px 60px -34px rgba(18,58,99,.5)}
.shot.big{height:330px;border-radius:34px;box-shadow:0 40px 80px -34px rgba(18,58,99,.55)}
.float-a{animation:c-float 9s ease-in-out infinite}
.float-b{animation:c-float 11s ease-in-out infinite reverse}

/* PLACEHOLDER DE IMAGEN */
.slot{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:22px;text-align:center;
  background:linear-gradient(150deg,#E8F3F7,#F3EFF6 55%,#FBEDEA);
  box-shadow:inset 0 0 0 1px rgba(18,58,99,.07)}
.slot::before{content:"";position:absolute;inset:-25%;background:radial-gradient(closest-side,rgba(23,162,184,.35),transparent 70%),radial-gradient(closest-side,rgba(255,107,107,.28),transparent 70%);background-position:25% 30%,75% 70%;background-size:60% 60%,55% 55%;background-repeat:no-repeat;filter:blur(28px)}
.slot span{position:relative;font-size:13px;font-weight:700;letter-spacing:.04em;color:#5C6B7D;background:rgba(255,255,255,.72);padding:9px 14px;border-radius:999px}
.slot.filled::before,.slot.filled span{display:none}
.slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* FAMILIA */
.familia{padding:110px 34px 0}
.head-center{text-align:center;max-width:640px;margin:0 auto}
.head-center h2{font-family:'Sora',sans-serif;font-weight:300;font-size:clamp(32px,4vw,54px);line-height:1.1;letter-spacing:-.03em;color:var(--azul)}
.head-center p{margin:16px 0 0;font-size:17px;line-height:1.65;color:var(--gris)}
.grid-serv{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.card-serv{display:flex;flex-direction:column;min-height:250px;padding:30px;border-radius:30px;background:#fff;box-shadow:0 18px 40px -30px rgba(18,58,99,.45);transition:transform .5s cubic-bezier(.2,1,.3,1),box-shadow .5s ease}
.card-serv:hover{transform:translateY(-8px);box-shadow:0 40px 70px -34px rgba(18,58,99,.5)}
.ico{display:flex;align-items:center;justify-content:center;width:62px;height:62px;border-radius:18px;overflow:hidden}
.ico img{width:100%;height:100%;object-fit:contain}
.ico.mark{font-family:'Sora',sans-serif;font-size:19px;font-weight:600}
.card-serv h3{margin:20px 0 0;font-family:'Sora',sans-serif;font-size:20px;font-weight:600;letter-spacing:-.01em;color:var(--azul)}
.card-serv p{margin:10px 0 0;font-size:14.8px;line-height:1.6;color:var(--gris-2);flex:1}
.card-serv .cta{font-size:13.5px;font-weight:700;color:var(--teal)}

/* APRENDER */
.aviso-academia{margin-top:110px;padding:40px 34px;background:#F1F8FA}
.aviso{max-width:640px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.aviso p{margin:0;font-size:15px;line-height:1.6;color:var(--gris)}
.split{display:grid;grid-template-columns:.95fr 1.05fr;gap:52px;align-items:center}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
.h2-light{margin:14px 0 0;font-family:'Sora',sans-serif;font-weight:300;font-size:clamp(30px,3.8vw,50px);line-height:1.1;letter-spacing:-.03em;color:var(--azul)}
.h2-light strong{font-weight:600}

/* HISTORIA */
.historia{padding:110px 34px 0}
.historia .split{grid-template-columns:1.05fr .95fr}
.lead{margin:20px 0 0;font-size:17px;line-height:1.72;color:var(--gris)}
.lead+.lead{margin-top:14px}
.shot.historia-shot{height:400px;border-radius:36px;box-shadow:0 40px 80px -40px rgba(18,58,99,.5)}
.glow{position:absolute;inset:-30px;background:radial-gradient(circle at 50% 40%,rgba(23,162,184,.4),transparent 66%);filter:blur(46px)}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:52px}
.panel{position:relative;overflow:hidden;padding:40px;border-radius:32px}
.panel.dark{background:linear-gradient(150deg,#123A63,#17849B);color:#fff}
.panel.light{background:#fff;box-shadow:0 22px 50px -36px rgba(18,58,99,.55)}
.kicker{font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.kicker.teal{color:var(--teal)}
.panel .big{margin:18px 0 0;font-family:'Sora',sans-serif;font-size:24px;font-weight:300;line-height:1.42}
.panel.light .big{color:var(--azul)}
.panel .small{margin:16px 0 0;font-size:15px;line-height:1.62;color:rgba(255,255,255,.72)}
.panel.light .small{color:var(--gris-2)}
.blob-c{width:240px;height:240px;right:-90px;bottom:-110px;background:radial-gradient(circle,rgba(255,107,107,.18),transparent 70%);filter:blur(24px);animation:c-blob 20s ease-in-out infinite}

/* VALORES */
.valores{padding:100px 34px 0}
.valores .wrap{text-align:center}
.valores h2{font-family:'Sora',sans-serif;font-weight:300;font-size:clamp(30px,3.6vw,48px);letter-spacing:-.03em;color:var(--azul)}
.grid-val{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:44px;text-align:left}
.val{padding:26px 22px;border-radius:24px;background:#fff;box-shadow:0 16px 34px -30px rgba(18,58,99,.5);transition:transform .45s cubic-bezier(.2,1,.3,1)}
.val:hover{transform:translateY(-6px)}
.bar{display:block;width:30px;height:4px;border-radius:4px;background:var(--teal-claro)}
.val-t{margin-top:16px;font-family:'Sora',sans-serif;font-size:15px;font-weight:600;color:var(--azul)}
.val p{margin:8px 0 0;font-size:13.8px;line-height:1.55;color:#6C7A88}
.meta-frase{margin:56px auto 0;max-width:760px;font-family:'Sora',sans-serif;font-size:clamp(22px,2.4vw,32px);font-weight:300;line-height:1.35;letter-spacing:-.02em;color:var(--azul)}
.meta-frase strong{font-weight:600;color:var(--teal)}

/* SUCURSALES */
.sucursales{padding:110px 34px 0}
.suc-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px}
.suc-head .lead{margin-top:14px;font-size:16.5px;line-height:1.6}
.grid-suc{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.suc{display:block;padding:26px;border-radius:26px;background:#fff;box-shadow:0 16px 36px -32px rgba(18,58,99,.5);transition:transform .45s cubic-bezier(.2,1,.3,1),box-shadow .4s ease}
.suc:hover{transform:translateY(-6px);box-shadow:0 34px 60px -34px rgba(18,58,99,.5)}
.suc-n{font-family:'Sora',sans-serif;font-size:17px;font-weight:600;color:var(--azul)}
.suc-d{margin-top:9px;font-size:14.2px;line-height:1.55;color:#6C7A88}
.suc-cta{margin-top:14px;font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--teal)}

/* FOOTER */
.foot{margin-top:100px;padding:60px 34px 40px;background:var(--azul);color:#fff}
.foot-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
.foot-brand img{width:46px;height:46px;object-fit:contain;border-radius:12px;background:#fff;mix-blend-mode:normal}
.foot-name{font-family:'Sora',sans-serif;font-size:15px;font-weight:600}
.foot-sub{font-size:13.5px;color:rgba(255,255,255,.6)}
.foot-social{display:flex;gap:10px}
.foot-social a{padding:12px 20px;border-radius:999px;background:rgba(255,255,255,.12);color:#fff;font-size:13.5px;font-weight:700;transition:background .3s ease}
.foot-social a:hover{background:rgba(255,255,255,.24);color:#fff}
.foot-legal{margin-top:34px;padding-top:22px;border-top:1px solid rgba(255,255,255,.16);font-size:13px;color:rgba(255,255,255,.5)}

/* RESPONSIVE */
@media (max-width:960px){
  .grid-serv{grid-template-columns:repeat(2,1fr)}
  .split{grid-template-columns:1fr;gap:34px}
  .historia .split{grid-template-columns:1fr}
  .grid-2{grid-template-columns:1fr}
  .grid-val{grid-template-columns:repeat(2,1fr)}
  .grid-suc{grid-template-columns:repeat(2,1fr)}
  .hero-shots{grid-template-columns:1fr;gap:14px}
  .shot.small,.shot.big{height:260px}
  .pills{display:none}
}
@media (max-width:600px){
  .nav{padding:16px 20px}
  .hero,.familia,.historia,.valores,.sucursales{padding-left:20px;padding-right:20px}
  .aviso-academia{padding:30px 20px}
  .grid-serv,.grid-val,.grid-suc{grid-template-columns:1fr}
  .foot{padding:50px 20px 34px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition-duration:.01ms !important}
}