:root{
  --brand-1:#00bfd8; /* cian del logo */
  --brand-2:#2aa5c0; /* turquesa */
  --brand-3:#0e2a3a; /* azul profundo */
  --ink:#e9f7fb;
  --bg:#061219;
  --card:#0b1e28f2;
  --shadow:0 10px 30px rgba(0,0,0,.25);
}

/* Reset + base */
*,*::before,*::after{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial;color:var(--ink);background:
  radial-gradient(1200px 600px at 10% 0%, rgba(42,165,192,.25), transparent 60%),
  radial-gradient(1000px 800px at 90% 10%, rgba(0,191,216,.15), transparent 70%),
  var(--bg);}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.no-scroll{overflow:hidden}

/* Animated gradient accent */
.gradient{background-image:linear-gradient(110deg,var(--brand-1),var(--brand-2) 50%,#48d3e6);background-size:200% 200%;animation:shift 8s ease-in-out infinite}
.text-gradient{-webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes shift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}

/* Top Nav */
.nav{position:fixed;inset:0 0 auto 0;z-index:40;backdrop-filter:blur(10px);
  background:linear-gradient(180deg,rgba(6,18,25,.8),rgba(6,18,25,.35) 70%,transparent);
  border-bottom:1px solid rgba(255,255,255,.06)}
.nav-inner{max-width:1200px;margin:auto;display:flex;align-items:center;gap:16px;padding:14px 20px}
.brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.4px}
.brand img{width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(0,191,216,.25))}
.brand-muted{opacity:.75;font-weight:600}
.badge{font-weight:600;font-size:.7rem;padding:4px 8px;border-radius:999px;background:linear-gradient(90deg,rgba(0,191,216,.18),rgba(42,165,192,.18));border:1px solid rgba(255,255,255,.1)}

.links{margin-left:auto;display:flex;gap:8px}
.links a{position:relative;padding:10px 14px;border-radius:10px;font-weight:600}
.links a::after{content:"";position:absolute;left:12px;right:12px;bottom:6px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--brand-1),transparent);opacity:0;transform:translateY(4px);transition:.3s}
.links a:hover{background:rgba(255,255,255,.04)}
.links a:hover::after{opacity:1;transform:translateY(0)}
.menu-btn{display:none;margin-left:8px;background:transparent;border:0;color:var(--ink);font-size:1.2rem;padding:8px;cursor:pointer;border-radius:10px}
.menu-btn:focus-visible{outline:2px solid var(--brand-1)}

/* Dropdown (desktop) */
.dropdown{position:relative}
.dropdown>a{display:inline-flex;align-items:center;gap:6px}
.caret{font-size:.8rem;opacity:.8}
.submenu{position:absolute;top:calc(100% + 8px);left:0;min-width:240px;background:#0b1e28f2;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:8px;display:none;box-shadow:var(--shadow);z-index:60}
.submenu a{display:block;padding:10px;border-radius:10px}
.submenu a:hover{background:rgba(255,255,255,.06)}
.links>.dropdown>.submenu{display:none !important}
.links>.dropdown:hover>.submenu,
.links>.dropdown:focus-within>.submenu{display:block !important}

/* Mobile menu */
.drawer{display:none}
@media (max-width:900px){
  .links{display:none}
  .menu-btn{display:inline-flex}
  .drawer{position:fixed;inset:56px 12px auto 12px;background:#0b1e28ee;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:10px;display:none;backdrop-filter:blur(10px);box-shadow:var(--shadow);z-index:50}
  .drawer a{display:block;padding:12px;border-radius:12px}
  .drawer a + a{margin-top:6px}
  .drawer a:hover{background:rgba(255,255,255,.06)}
  .drawer.open{display:block !important}
  .drawer .group{border-top:1px dashed rgba(255,255,255,.08);margin-top:6px;padding-top:6px}
  .drawer .sub-btn{width:100%;text-align:left;padding:12px;border-radius:12px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.08);color:var(--ink)}
  .drawer .nested{display:none;padding-left:6px}
  .drawer .nested.open{display:block}
  .drawer .nested a{padding:10px 12px}
}

/* Hero */
.hero{position:relative;height:86vh;min-height:520px;display:grid;place-items:center;overflow:hidden}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:contrast(1.05) saturate(1.05) brightness(.8)}
.hero .overlay{position:absolute;inset:0;background:radial-gradient(60% 60% at 30% 20%, rgba(0,191,216,.35),transparent 60%), radial-gradient(70% 60% at 70% 0%, rgba(14,42,58,.55), rgba(14,42,58,.8));}
.hero .content{position:relative;z-index:2;max-width:1100px;margin:0 20px;text-align:center}
.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.06);backdrop-filter:blur(6px);font-weight:600;font-size:.8rem}
.eyebrow .dot{width:8px;height:8px;border-radius:50%;background:conic-gradient(from 0deg, var(--brand-1), var(--brand-2));box-shadow:0 0 0 4px rgba(0,191,216,.15)}
h1{margin:.8rem auto .6rem;line-height:1.03;font-weight:900;font-size:clamp(2.2rem, 4.2vw + 1rem, 4.2rem);letter-spacing:.2px}
.subtitle{opacity:.9;max-width:850px;margin:0 auto 1.2rem;font-size:clamp(1rem,1.1vw+1rem,1.35rem)}
.cta{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:14px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:14px;font-weight:700;border:1px solid rgba(255,255,255,.14);box-shadow:0 8px 24px rgba(0,0,0,.25);transition:transform .18s ease, box-shadow .2s ease}
.btn.primary{background-image:linear-gradient(120deg, rgba(0,191,216,.95), rgba(42,165,192,.95));color:#06222b}
.btn.secondary{background:rgba(255,255,255,.06)}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(0,0,0,.35)}
.blob{position:absolute;inset:auto auto -120px -120px;width:280px;height:280px;border-radius:50%;filter:blur(40px);opacity:.5}
.blob.two{inset:auto -140px -120px auto;width:320px;height:320px;opacity:.4}

/* Feature Cards (overlap hero ~10%) */
.cards-wrap{max-width:1150px;margin:0 auto;padding:0 20px;position:relative;transform:translateY(-10%)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:980px){.cards{grid-template-columns:1fr}}
.card{position:relative;border-radius:18px;background:linear-gradient(160deg, rgba(11,30,40,.9), rgba(6,18,25,.92));border:1px solid rgba(255,255,255,.1);padding:22px 20px 20px;box-shadow:var(--shadow);overflow:hidden;
  animation:float 8s ease-in-out infinite;transition:transform .25s ease, box-shadow .25s ease, filter .25s ease}
.card::before{content:"";position:absolute;inset:-1px;z-index:0;border-radius:20px;padding:1px;background:linear-gradient(140deg, rgba(0,191,216,.6), rgba(42,165,192,.1), rgba(72,211,230,.5));-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.card h3{position:relative;z-index:1;margin:0 0 10px;font-size:1.15rem}
.card p{position:relative;z-index:1;opacity:.95;line-height:1.6}
.card .tag{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;font-size:.8rem;padding:6px 10px;border-radius:999px;background:rgba(0,191,216,.15);border:1px solid rgba(0,191,216,.35)}
.card .tag svg{width:16px;height:16px}
.cards .card:nth-child(2){animation-delay:.6s}
.cards .card:nth-child(3){animation-delay:1.2s}
.card:hover{animation-play-state:paused;box-shadow:0 24px 48px rgba(0,0,0,.45);filter:saturate(1.05)}
.card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.18) 12%, transparent 22%);transform:translateX(-120%) skewX(-15deg);opacity:.0}
.card:hover::after{opacity:.8;animation:shine .9s linear}
@keyframes float {0%{transform:translateY(0)}50%{transform:translateY(-8px)}100%{transform:translateY(0)}}
@keyframes shine{to{transform:translateX(120%) skewX(-15deg)}}

/* Reveal on scroll */
.reveal{opacity:0;transform:translateY(18px);transition:.6s ease}
.reveal.in{opacity:1;transform:none}

/* Info + Footer */
.info{max-width:1100px;margin:40px auto 0;padding:0 20px}
.info h2{font-size:clamp(1.6rem,1.5vw + 1rem,2.1rem);margin:24px 0 10px}
.info h3{margin:16px 0 6px}
.info p{opacity:.85;line-height:1.7}

footer{margin-top:60px;border-top:1px solid rgba(255,255,255,.06);padding:28px 20px 60px;background:linear-gradient(180deg, transparent, rgba(255,255,255,.02))}
.foot-inner{max-width:1150px;margin:auto;display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}
@media (max-width:780px){.foot-inner{grid-template-columns:1fr}}
.tiny{opacity:.7;font-size:.9rem}
.brand-footer{margin-bottom:8px}

/* ===== NOSOTROS ===== */
.about{
  max-width:1150px; margin:60px auto 0; padding:0 20px;
  display:grid; grid-template-columns:1.1fr 1fr; gap:36px; align-items:center;
}
@media (max-width:980px){ .about{ grid-template-columns:1fr; gap:22px } }

.kicker{
  display:inline-block; font-weight:800; letter-spacing:.4px; margin-bottom:8px;
  padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06); backdrop-filter:blur(6px);
}
.about h2{ font-size:clamp(1.8rem,2.2vw + 1rem,2.6rem); margin:.2rem 0 .6rem }
.about p{ opacity:.9; line-height:1.75 }

/* Media (imagen + badge) */
.photo{
  position:relative; border-radius:22px; overflow:hidden; box-shadow:0 18px 36px rgba(0,0,0,.35);
  transform-style:preserve-3d; background:linear-gradient(180deg, rgba(11,30,40,.6), rgba(6,18,25,.9));
}
.photo img{ width:100%; display:block; filter:saturate(1.05) contrast(1.05) }
.photo::before{
  content:""; position:absolute; inset:-1px; border-radius:24px; padding:1px;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}

/* Badge 10 años con borde conic giratorio + glow */
.badge-exp{
  position:absolute; top:16px; left:16px; display:flex; align-items:center; gap:10px;
  padding:10px 14px; border-radius:14px; background:rgba(6,18,25,.8); color:#e9f7fb;
  border:2px solid transparent; box-shadow:0 8px 24px rgba(0,0,0,.35);
  transform:translateZ(30px); /* efecto 3D con tilt */
}
.badge-exp strong{ font-size:1.6rem; line-height:1; background:linear-gradient(120deg,#e8fdff,#8de5f0); -webkit-background-clip:text; background-clip:text; color:transparent }
.gradient-border{
  background:
    linear-gradient(180deg, rgba(11,30,40,.9), rgba(11,30,40,.6)) padding-box,
    conic-gradient(from 0deg, var(--brand-1), var(--brand-2), #48d3e6, var(--brand-1)) border-box;
  animation:spin 6s linear infinite;
}
@keyframes spin{ to{ background:
    linear-gradient(180deg, rgba(11,30,40,.9), rgba(11,30,40,.6)) padding-box,
    conic-gradient(from 360deg, var(--brand-1), var(--brand-2), #48d3e6, var(--brand-1)) border-box; } }

/* Features */
.about-features{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0 24px;
}
.feature{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; border-radius:16px;
  background:linear-gradient(160deg, rgba(11,30,40,.85), rgba(6,18,25,.92));
  border:1px solid rgba(255,255,255,.08);
  transition:transform .2s ease, box-shadow .25s ease, filter .2s ease;
}
.feature:hover{ transform:translateY(-4px); box-shadow:0 16px 36px rgba(0,0,0,.35); filter:saturate(1.05) }
.feature h3{ margin:0; font-size:1rem; line-height:1.25 }
.icon{
  width:36px; height:36px; display:grid; place-items:center; border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(0,191,216,.35), transparent 60%), rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12)
}
.icon svg{ width:20px; height:20px }

/* CTA */
.about-cta{ margin-top:4px }

/* Hover sutil a la foto */
.photo:hover{ filter:saturate(1.03) }


/* ===== KPI BAR ===== */
.kpi-bar{
  max-width:1150px; margin:28px auto 0; padding:14px;
  display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:10px; align-items:center;
  background:linear-gradient(160deg, rgba(11,30,40,.7), rgba(6,18,25,.85));
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px; backdrop-filter:blur(10px); box-shadow:0 16px 40px rgba(0,0,0,.35);
  position:relative; overflow:hidden;
}
.kpi-bar::before{
  content:""; position:absolute; inset:-1px; border-radius:20px; padding:1px;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.kpi{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:14px 8px; border-radius:14px; position:relative;
  transition:transform .2s ease, box-shadow .25s ease, filter .2s ease;
}
.kpi:hover{ transform:translateY(-3px); box-shadow:0 16px 36px rgba(0,0,0,.35); filter:saturate(1.05) }

.kpi-number{
  font-weight:900; line-height:1; letter-spacing:.5px;
  font-size:clamp(2rem, 3.2vw + .5rem, 3rem);
  position:relative;
}
.kpi-number::after{
  content:"+"; margin-left:2px; font-weight:900; opacity:.95;
  animation:pulseGlow 2.2s ease-in-out infinite;
}
.kpi-label{
  margin-top:6px; font-weight:700; opacity:.9; letter-spacing:.3px;
}

.kpi-divider{
  width:1px; height:42px; justify-self:center;
  background:linear-gradient(180deg, transparent, rgba(255,255,255,.25), transparent);
}

@media (max-width:820px){
  .kpi-bar{ grid-template-columns:1fr; gap:8px; padding:12px; }
  .kpi-divider{
    width:100%; height:1px;
    background:linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent);
  }
}

@keyframes pulseGlow{
  0%,100%{ text-shadow:0 0 0 rgba(72,211,230,0) }
  50%{ text-shadow:0 0 14px rgba(72,211,230,.55) }
}

/* KPI numbers en blanco (override a text-gradient) */
.kpi-number{
  color:#fff !important;
  -webkit-text-fill-color:#fff; /* Safari */
  background:none !important;   /* anula el gradiente */
}
.kpi-number::after{
  color:#fff; /* el “+” también en blanco */
}


/* ===== TESTIMONIOS (Carrusel) ===== */
.testimonials{
  max-width:950px; margin:60px auto 0; padding:18px 18px 24px;
  background:linear-gradient(160deg, rgba(11,30,40,.7), rgba(6,18,25,.88));
  border:1px solid rgba(255,255,255,.08); border-radius:18px; backdrop-filter:blur(10px);
  box-shadow:0 16px 40px rgba(0,0,0,.35); position:relative; overflow:hidden;
}
.testimonials::before{
  content:""; position:absolute; inset:-1px; border-radius:20px; padding:1px;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}

.t-wrap{ overflow:hidden; }
.t-track{
  display:grid; grid-auto-flow:column; grid-auto-columns:100%; gap:0;
  will-change:transform; transform:translateX(0); transition:transform .5s ease;
}
@media (prefers-reduced-motion:reduce){ .t-track{ transition:none } }

.t-card{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; padding:26px 24px; min-height:220px; text-align:center;
}
.stars{ display:flex; gap:6px; }
.star{ width:22px; height:22px; fill:#f5c542; filter:drop-shadow(0 0 6px rgba(245,197,66,.3)); }

.quote{ font-size:clamp(1rem, .8vw + .9rem, 1.15rem); opacity:.95; line-height:1.6; max-width:680px }
.person{ opacity:.85; font-weight:700 }

.t-controls{
  margin-top:16px; display:flex; align-items:center; justify-content:center; gap:12px;
}
.t-arrow{
  padding:10px 14px; border-radius:12px; cursor:pointer; font-weight:800;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);
  color:#e9f7fb; box-shadow:0 8px 24px rgba(0,0,0,.25);
  transition:transform .18s ease, box-shadow .2s ease, background .2s ease;
}
.t-arrow:hover{ transform:translateY(-2px); box-shadow:0 18px 36px rgba(0,0,0,.35); }
.t-index{ min-width:64px; text-align:center; font-weight:800; opacity:.9 }


/* Avatar para testimonios */
.t-card .avatar{
  width:56px; height:56px; border-radius:50%; object-fit:cover;
  border:2px solid transparent; padding:2px; margin-bottom:8px;
  background:
    linear-gradient(#0b1e28, #0b1e28) padding-box,
    linear-gradient(140deg, rgba(0,191,216,.65), rgba(42,165,192,.35), rgba(72,211,230,.55)) border-box;
  box-shadow:0 10px 26px rgba(0,0,0,.35), 0 0 10px rgba(72,211,230,.25);
}


/* ===== POR QUÉ ELEGIRNOS ===== */
.why{ max-width:1150px; margin:60px auto 0; padding:0 20px; }
.why-head{ text-align:center; max-width:820px; margin:0 auto 18px; }
.why-head h2{ font-size:clamp(1.8rem,2.2vw + 1rem,2.6rem); margin:.3rem 0 .6rem }
.why-head p{ opacity:.9; line-height:1.75 }

.why-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:12px;
}
@media (max-width:980px){ .why-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:680px){ .why-grid{ grid-template-columns:1fr } }

.why-card{
  position:relative; border-radius:18px; overflow:hidden;
  background:linear-gradient(160deg, rgba(11,30,40,.9), rgba(6,18,25,.92));
  border:1px solid rgba(255,255,255,.1); padding:18px 16px;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  transition:transform .2s ease, box-shadow .25s ease, filter .2s ease;
}
.why-card::before{
  content:""; position:absolute; inset:-1px; border-radius:20px; padding:1px;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.why-card::after{
  /* Spotlight suave que sigue el puntero (JS coloca variables) */
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.0;
  background:radial-gradient(240px 160px at var(--mx,50%) var(--my,50%), rgba(72,211,230,.18), transparent 55%);
  transition:opacity .25s ease;
}
.why-card:hover{ transform:translateY(-6px); box-shadow:0 24px 48px rgba(0,0,0,.45); filter:saturate(1.04) }
.why-card:hover::after{ opacity:1 }

.w-icon{
  width:44px; height:44px; display:grid; place-items:center; border-radius:12px; margin-bottom:10px;
  background:radial-gradient(circle at 30% 30%, rgba(0,191,216,.35), transparent 60%), rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12); box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.w-icon svg{ width:22px; height:22px }

.why-card h3{ margin:.2rem 0 .35rem; font-size:1.05rem }
.why-card p{ opacity:.9; line-height:1.6; margin:0 }

.why-cta{ display:flex; gap:12px; justify-content:center; margin-top:18px }


/* ===== FOOTER ===== */
.site-footer{
  margin-top:60px; position:relative; background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.04));
  border-top:1px solid rgba(255,255,255,.06);
}
.footer-inner{
  max-width:1150px; margin:auto; padding:28px 20px;
  display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:22px; align-items:start;
  background:linear-gradient(160deg, rgba(11,30,40,.7), rgba(6,18,25,.88));
  border:1px solid rgba(255,255,255,.08); border-radius:18px; backdrop-filter:blur(10px);
  box-shadow:0 16px 40px rgba(0,0,0,.35); transform:translateY(-12px);
}
.site-footer::before{
  content:""; position:absolute; left:50%; transform:translateX(-50%); top:-1px; width:min(1150px, calc(100% - 40px)); height:calc(100% - 54px);
  border-radius:20px; pointer-events:none;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; padding:1px;
}

.foot-brand .brand{display:flex; align-items:center; gap:12px}
.foot-brand img{width:64px; height:64px; object-fit:contain; filter:drop-shadow(0 6px 14px rgba(0,191,216,.25))}
.brand-text{display:flex; flex-direction:column}
.brand-text strong{font-size:1.2rem; letter-spacing:.4px}
.brand-text small{opacity:.9; font-weight:700; letter-spacing:.3px}

.foot-links h3, .foot-contact h3{margin:.2rem 0 .6rem; font-size:1.05rem}
.foot-links ul{list-style:none; padding:0; margin:0 0 8px 0; display:grid; gap:6px}
.foot-links a, .foot-contact a{opacity:.95}
.foot-links a:hover, .foot-contact a:hover{opacity:1; text-decoration:underline}
.privacy{display:inline-block; margin-top:6px; font-weight:700}

.foot-contact p{display:flex; align-items:flex-start; gap:10px; margin:.45rem 0}
.foot-contact svg{width:18px; height:18px; flex:0 0 auto; opacity:.9}

.foot-bottom{
  text-align:center; opacity:.75; padding:12px 20px 28px; margin-top:8px;
}

/* Responsive */
@media (max-width:980px){
  .footer-inner{ grid-template-columns:1fr; gap:16px; }
}


/* ===== IDENTIDAD ===== */
.identity{ max-width:1150px; margin:60px auto 0; padding:0 20px; }
.identity-head{ text-align:center; max-width:820px; margin:0 auto 18px; }
.identity-head h2{ font-size:clamp(1.8rem,2.2vw + 1rem,2.6rem); margin:.3rem 0 .6rem }
.identity-head p{ opacity:.9; line-height:1.75 }

.i-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
@media (max-width:980px){ .i-grid{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:680px){ .i-grid{ grid-template-columns:1fr } }

.i-card{
  position:relative; border-radius:18px; overflow:hidden;
  background:linear-gradient(160deg, rgba(11,30,40,.9), rgba(6,18,25,.92));
  border:1px solid rgba(255,255,255,.1); padding:18px 16px;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
  transition:transform .2s ease, box-shadow .25s ease, filter .2s ease;
}
.i-card::before{
  content:""; position:absolute; inset:-1px; border-radius:20px; padding:1px;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.i-card:hover{ transform:translateY(-6px); box-shadow:0 24px 48px rgba(0,0,0,.45); filter:saturate(1.04) }

.i-icon{
  width:44px; height:44px; display:grid; place-items:center; border-radius:12px; margin-bottom:10px;
  background:radial-gradient(circle at 30% 30%, rgba(0,191,216,.35), transparent 60%), rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12); box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.i-icon svg{ width:22px; height:22px }

.mb8{ margin-bottom:8px }
.chips{ display:flex; flex-wrap:wrap; gap:8px }
.chip{
  padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12); font-weight:700; font-size:.85rem;
  transform:translateY(6px); opacity:0; transition:.4s ease;
}
.chip.in{ transform:none; opacity:1 }

/* ===== EXPERIENCIA ===== */
.exp{ max-width:1150px; margin:60px auto 0; padding:0 20px; }
.exp-wrap{ display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:start; }
@media (max-width:980px){ .exp-wrap{ grid-template-columns:1fr } }

.exp-content h2{ font-size:clamp(1.8rem,2.2vw + 1rem,2.4rem); margin:.2rem 0 .6rem }
.exp-content p{ opacity:.9; line-height:1.75 }
.exp-content .mt12{ margin-top:12px }

.list-check{ list-style:none; padding:0; margin:10px 0 0 0; display:grid; gap:8px }
.list-check li{
  position:relative; padding-left:28px;
}
.list-check li::before{
  content:""; position:absolute; left:0; top:6px; width:18px; height:18px; border-radius:50%;
  background:
    radial-gradient(circle at 30% 30%, rgba(72,211,230,.5), transparent 60%),
    linear-gradient(180deg, rgba(0,191,216,1), rgba(42,165,192,1));
  box-shadow:0 0 10px rgba(72,211,230,.5);
}
.list-check li::after{
  content:""; position:absolute; left:5px; top:10px; width:8px; height:4px; border-left:2px solid #06222b; border-bottom:2px solid #06222b; transform:rotate(-45deg);
}

.exp-aside .badge-kpi{
  position:sticky; top:90px; border-radius:18px; padding:18px; 
  background:linear-gradient(160deg, rgba(11,30,40,.9), rgba(6,18,25,.92));
  border:1px solid rgba(255,255,255,.1); box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.badge-kpi .b-top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:8px }
.badge-kpi img{ width:42px; height:42px; object-fit:contain; filter:drop-shadow(0 6px 14px rgba(0,191,216,.25)) }
.badge-kpi span{ font-weight:900 }
.badge-kpi p{ opacity:.9 }
.b-logos{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px }
.pill{
  padding:6px 10px; border-radius:999px; background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12); font-weight:800; font-size:.8rem
}


/* ===== Trayectoria: imagen al fondo del card ===== */
.badge-kpi{
  position:sticky; top:90px; border-radius:18px; padding:18px;
  background:linear-gradient(160deg, rgba(11,30,40,.9), rgba(6,18,25,.92));
  border:1px solid rgba(255,255,255,.1); box-shadow:0 10px 30px rgba(0,0,0,.25);
}

.b-media{
  margin-top:12px; position:relative; border-radius:16px; overflow:hidden;
  background:linear-gradient(160deg, rgba(11,30,40,.9), rgba(6,18,25,.92));
  border:1px solid rgba(255,255,255,.1); box-shadow:0 10px 28px rgba(0,0,0,.25);
}
.b-media::before{
  content:""; position:absolute; inset:-1px; border-radius:18px; padding:1px;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.b-media img{
  width:100%; display:block; aspect-ratio:16/9; object-fit:cover;
  filter:saturate(1.04) contrast(1.04); transform:scale(1.02);
  transition:transform .5s ease, filter .35s ease;
}
.badge-kpi:hover .b-media img{
  transform:scale(1.06);
  filter:saturate(1.08) contrast(1.06);
}

/* Caption tipo glass */
.b-caption{
  position:absolute; left:12px; bottom:12px; display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:12px; font-weight:800;
  background:rgba(6,18,25,.78); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(6px);
  box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.b-caption .dot{
  width:8px; height:8px; border-radius:50%;
  background:conic-gradient(from 0deg, #00bfd8, #2aa5c0, #48d3e6, #00bfd8);
  box-shadow:0 0 0 4px rgba(0,191,216,.18);
}

/* EXP: aside en columna con separación */
.exp-aside{ display:grid; gap:14px; align-content:start; }

/* Imagen SEPARADA (no dentro del card) */
.b-media{
  margin-top:6px; position:relative; border-radius:16px; overflow:hidden;
  background:linear-gradient(160deg, rgba(11,30,40,.9), rgba(6,18,25,.92));
  border:1px solid rgba(255,255,255,.1); box-shadow:0 10px 28px rgba(0,0,0,.25);
  transform-style:preserve-3d; /* para tilt */
}
.b-media::before{
  content:""; position:absolute; inset:-1px; border-radius:18px; padding:1px;
  background:linear-gradient(140deg, rgba(0,191,216,.55), rgba(42,165,192,.08), rgba(72,211,230,.45));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.b-media img{
  width:100%; display:block; aspect-ratio:16/9; object-fit:cover;
  filter:saturate(1.04) contrast(1.04); transform:scale(1.02);
  transition:transform .5s ease, filter .35s ease;
}
.b-media:hover img{ transform:scale(1.06); filter:saturate(1.08) contrast(1.06); }

/* Caption glass inferior izquierdo */
.b-caption{
  position:absolute; left:12px; bottom:12px; display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:12px; font-weight:800;
  background:rgba(6,18,25,.78); border:1px solid rgba(255,255,255,.14); backdrop-filter:blur(6px);
  box-shadow:0 10px 24px rgba(0,0,0,.25); transform:translateZ(20px);
}
.b-caption .dot{
  width:8px; height:8px; border-radius:50%;
  background:conic-gradient(from 0deg, #00bfd8, #2aa5c0, #48d3e6, #00bfd8);
  box-shadow:0 0 0 4px rgba(0,191,216,.18);
}


/* ===== Justificación de texto en Nosotros ===== */
.justify p,
.justify li,
.identity.justify .identity-head p{
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
}

/* Opcional: mejora legibilidad en listas con checks */
.list-check li{
  line-height: 1.75;
}
/* Imagen fija (sticky) debajo de Trayectoria en desktop */
@media (min-width: 981px){
  .exp-aside{ align-content: start; }
  .exp-aside .b-media{
    position: sticky;
    top: var(--stickOffset, 90px); /* se setea vía JS para quedar justo debajo del card */
    z-index: 1;
  }
}

/* En móvil que fluya normal */
@media (max-width: 980px){
  .exp-aside .b-media{
    position: static;
    top: auto;
  }
}


/* ===== Ajustes de EXPERIENCIA: imagen derecha centrada y más grande ===== */
@media (min-width: 981px){
  /* Centra verticalmente el grid de experiencia */
  .exp-wrap{ align-items: center; }

  /* Columna derecha centrada y ordenada */
  .exp-aside{
    display: grid;
    justify-items: center;   /* centra horizontalmente el figure */
    align-content: center;   /* centra verticalmente dentro de la columna */
    gap: 14px;
  }

  /* Imagen más grande y sin sticky/superposición */
  .exp-aside .b-media{
    position: static !important;
    top: auto !important;
    z-index: auto !important;
    width: clamp(420px, 38vw, 620px); /* ↑ tamaño en desktop */
    max-width: 100%;
    margin: 0 auto;                   /* centrado por si acaso */
    border-radius: 18px;
  }

  /* Que la imagen llene el contenedor con una proporción agradable */
  .exp-aside .b-media img{
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 10;  /* un poco más alta que 16:9 */
    object-fit: cover;
  }
}

/* En móvil fluye normal, a 100% del ancho */
@media (max-width: 980px){
  .exp-aside{
    display: grid;
    justify-items: center;
    align-content: start;
    gap: 12px;
  }
  .exp-aside .b-media{
    position: static !important;
    width: 100%;
    max-width: 680px;
  }
}


  #cookiebar{
    position:fixed; left:0; right:0; bottom:0; z-index:9999;
    display:flex; gap:12px; align-items:flex-start;
    padding:14px 16px; background:rgba(6,18,25,.96); color:#e9f7fb;
    border-top:1px solid rgba(255,255,255,.14);
    box-shadow:0 -16px 40px rgba(0,0,0,.35);
    transform:translateY(0); opacity:1;
    transition:transform .32s ease, opacity .32s ease;
  }
  #cookiebar.hide{ transform:translateY(100%); opacity:0; pointer-events:none; }
  #cookiebar .cb-text{ flex:1; font-size:.95rem; line-height:1.6; opacity:.95 }
  #cookiebar .cb-actions{ display:flex; gap:10px; flex-wrap:wrap }
  #cookiebar a.cb-link{
    color:#48d3e6; text-decoration:underline; text-underline-offset:2px;
  }
  #cookie-accept{
    cursor:pointer; padding:10px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.18);
    background:linear-gradient(160deg, #00bfd8, #48d3e6); color:#0b1e28; font-weight:700;
    box-shadow:0 6px 20px rgba(0,0,0,.25);
  }
  @media (max-width:680px){
    #cookiebar{flex-direction:column; align-items:stretch}
    #cookiebar .cb-actions{justify-content:flex-end}
  }
  @media (prefers-reduced-motion:reduce){
    #cookiebar{transition:none}
  }


    #wa-fab{
    position:fixed; right:18px; bottom:18px; z-index:9999;
    display:inline-flex; align-items:center; gap:10px;
    text-decoration:none; color:#0b1e28; font-weight:800;
    background:#25D366; border:1px solid rgba(255,255,255,.22);
    box-shadow:0 14px 36px rgba(0,0,0,.35);
    border-radius:999px; padding:12px 14px;
  }
  #wa-fab .ico{width:22px;height:22px;display:inline-block}
  #wa-fab .lbl{display:inline-block}
  #wa-fab:hover{filter:brightness(1.05)}
  /* Compacto en móvil */
  @media (max-width:640px){
    #wa-fab{padding:12px}
    #wa-fab .lbl{display:none}
  }
  /* Safe-area iOS */
  @supports (bottom: env(safe-area-inset-bottom)){
    #wa-fab{bottom:calc(18px + env(safe-area-inset-bottom))}
  }