:root{
  /* Global Zend brand palette */
  --ink:#0d1028;
  --ink-2:#161463;
  --muted:#5d6485;

  --p-1:#f4f1ff;
  --p-2:#edeafe;
  --p-3:#eef1ff;
  --p-4:#f7f8ff;
  --p-5:#f1efff;
  --p-6:#7f5cff;
  --p-7:#eef0ff;

  --primary:#5223de;
  --primary-2:#3f1ab2;
  --primary-3:#7b5cff;
  --navy:#161463;
  --navy-2:#0f0e47;
  --accent-soft:#e8deff;

  --card:rgba(255,255,255,.82);
  --glass:rgba(255,255,255,.12);
  --border:rgba(22,20,99,.12);

  --shadow:0 24px 60px rgba(22,20,99,.14);
  --radius:20px;

  --navH:74px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:var(--ink);
  background:linear-gradient(180deg,#ffffff 0%, #f6f5ff 100%);
  padding-top:var(--navH);
}
a{text-decoration:none;}
.object-fit-cover{object-fit:cover;}
.object-fit-contain{object-fit:contain;}
/* =========================
   NAVBAR
========================= */
.nav-glass{
  backdrop-filter:blur(10px);
  background:rgba(255,255,255,.72);
  border-bottom:1px solid rgba(82,35,222,.10);
  min-height:var(--navH);
  height:auto; /* opcional pero recomendado */
}

.nav-link{color:var(--ink-2);font-weight:500;}
.nav-link.active{color:var(--primary)!important;text-shadow:0 0 0 rgba(0,0,0,0);}

/* Logo mark */
.navbar-brand .brand-mark{
  width:26px;height:26px;
  border-radius:7px;
  background:linear-gradient(135deg,var(--navy),var(--primary),#8d74ff);
  box-shadow:0 10px 24px rgba(82,35,222,.28);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:relative;
  vertical-align:middle;
}
/* Sphere */
.navbar-brand .brand-mark::before{
  content:'';
  position:absolute;
  width:13px;height:13px;
  background:transparent;
  border:1.5px solid rgba(255,255,255,.90);
  border-radius:50%;
  z-index:2;
}
/* Orbit line + point */
.navbar-brand .brand-mark::after{
  content:'';
  position:absolute;
  width:20px;height:9px;
  border-bottom:1.5px solid #fff;
  border-radius:50%;
  transform:rotate(-25deg);
  z-index:1;
  box-shadow:5px 1px 0px -1px #fff;
}

/* =========================
   BUTTONS (Bootstrap overrides)
========================= */
.btn-primary{
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  border-color:var(--primary);
  box-shadow:0 16px 34px rgba(82,35,222,.22);
}
.btn-primary:hover{
  background:linear-gradient(135deg,var(--primary-2),var(--navy));
  border-color:var(--primary-2);
}
.btn-outline-light{border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.06);}

/* =========================
   HERO
========================= */
.hero-wrap{
  position:relative;
  min-height:calc(100vh - var(--navH));
  overflow:hidden;
  border-bottom:1px solid rgba(82,35,222,.10);
}
.hero-video{position:absolute;inset:0;}
.hero-video video{
  width:100%;
  height:100%;
  object-fit:cover;
  transform:scale(1.02);
}
.hero-overlay{
  position:absolute;inset:0;
  background:linear-gradient(125deg, rgba(15,14,71,.18) 0%, rgba(22,20,99,.70) 48%, rgba(13,16,40,.88) 100%);
}
.hero-grain{
  position:absolute;inset:0;
  opacity:.12;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='260' height='260' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
.hero-content{position:relative;z-index:2;padding:64px 0 88px;}

.hero-card{
  padding:28px 26px;
  border-radius:var(--radius);
  background:linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.20);
  color:#fff;
  box-shadow:0 24px 70px rgba(5,8,30,.30);
  backdrop-filter:blur(10px);
}
.pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.20);
  font-size:.9rem;
}
.pill .dot{
  width:8px;height:8px;border-radius:999px;
  background:linear-gradient(135deg,#9b85ff,var(--primary));
  box-shadow:0 0 0 6px rgba(123,92,255,.18);
}

.hero-metrics{display:flex;gap:14px;flex-wrap:wrap;}
.metric{
  min-width:130px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.16);
}
.metric .k{font-weight:700;letter-spacing:.3px;}
.metric .v{opacity:.85;font-size:.92rem;}

.hero-float{display:flex;justify-content:flex-end;}
.glass-card{
  width:min(420px,100%);
  padding:18px;
  border-radius:var(--radius);
  background:rgba(255,255,255,.20);
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 18px 55px rgba(0,0,0,.15);
  backdrop-filter:blur(10px);
  color:#fff;
}
.mini-bars{display:flex;gap:8px;align-items:flex-end;height:54px;}
.mini-bars span{
  width:10px;border-radius:8px;
  background:linear-gradient(180deg,#f0e9ff,#b9a8ff);
  display:inline-block;
  height:20%;
}
.mini-bars span:nth-child(2){height:55%;}
.mini-bars span:nth-child(3){height:35%;}
.mini-bars span:nth-child(4){height:80%;}
.mini-bars span:nth-child(5){height:48%;}

.scroll-cue{
  position:absolute;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  width:34px;height:54px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(255,255,255,.08);
  display:flex;
  justify-content:center;
  align-items:flex-start;
  padding-top:10px;
  z-index:3;
}
.scroll-cue span{
  width:6px;height:10px;
  border-radius:999px;
  background:rgba(255,255,255,.75);
  animation:scrollDot 1.25s infinite ease-in-out;
}
@keyframes scrollDot{
  0%{transform:translateY(0);opacity:.65;}
  60%{transform:translateY(14px);opacity:1;}
  100%{transform:translateY(0);opacity:.65;}
}

/* =========================
   SECTIONS + CARDS
========================= */
.section{padding:88px 0;}
.section-soft{background:linear-gradient(180deg,#ffffff 0%, #f8f7ff 100%);}

.pastel-1{background:linear-gradient(180deg,#f4f1ff 0%, #ece7ff 100%);}
.pastel-2{background:linear-gradient(180deg,#edeafe 0%, #e5e0ff 100%);}
.pastel-3{background:linear-gradient(180deg,#eef1ff 0%, #e8e9ff 100%);}
.pastel-4{background:linear-gradient(180deg,#f7f8ff 0%, #efefff 100%);}
.pastel-5{background:linear-gradient(180deg,#f0e9ff,#b9a8ff);}
.pastel-6{background:linear-gradient(180deg,#eef0ff 0%, #e8ebff 100%);}

.section-card{
  position:relative;
  overflow:hidden; /* hide drifting layers */
  /* subtle mesh layer (parallax moves background-position via --bgY) */
  background-image:
    radial-gradient(900px 500px at 15% 10%, rgba(82,35,222,.20), rgba(82,35,222,0) 60%),
    radial-gradient(800px 460px at 85% 30%, rgba(22,20,99,.16), rgba(22,20,99,0) 60%),
    radial-gradient(700px 420px at 30% 90%, rgba(123,92,255,.16), rgba(123,92,255,0) 60%);
  background-size:120% 120%;
  background-position:50% calc(50% + var(--bgY, 0px));
}

/* Decorative blobs (move via vars set in JS) */
.section-card::before{
  content:"";
  position:absolute;
  width:420px;height:420px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(82,35,222,.20), rgba(82,35,222,0) 60%);
  filter:blur(2px);
  top:-130px;
  right:-140px;
  pointer-events:none;
  transform:translate3d(var(--p1x,0px), var(--p1y,0px), 0);
  opacity:1;
}
.section-card::after{
  content:"";
  position:absolute;
  width:320px;height:320px;
  border-radius:50%;
  background:radial-gradient(circle at 40% 40%, rgba(22,20,99,.16), rgba(22,20,99,0) 60%);
  bottom:-120px;
  left:-120px;
  pointer-events:none;
  transform:translate3d(var(--p2x,0px), var(--p2y,0px), 0);
  opacity:.95;
}

.content-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  padding:26px;
  box-shadow:var(--shadow);
  position:relative;
}
/* Floating highlight on content cards (parallax vars) */
.section-card .content-card::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:var(--radius);
  pointer-events:none;
  background:radial-gradient(1200px 600px at 20% 10%, rgba(255,255,255,.76), rgba(255,255,255,0) 55%);
  opacity:var(--glow,.40);
  transform:translate3d(var(--glowX,0px), var(--glowY,0px), 0);
  will-change:transform,opacity;
}

.eyebrow{
  font-size:.86rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(22,20,99,.70);
  margin-bottom:10px;
}

.tag-row{display:flex;gap:10px;flex-wrap:wrap;}
.tag{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(82,35,222,.10);
  font-size:.9rem;
}

/* Media frame (supports Bootstrap .ratio) */
.media-frame{
  position:relative;
  border-radius:var(--radius);
  overflow:hidden;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(82,35,222,.10);
  box-shadow:var(--shadow);
  min-height:320px;
}
.shadow-soft{box-shadow:0 18px 55px rgba(17,24,39,.14);}

/* Parallax media layer (JS wraps children into .parallax-inner) */
.media-frame .parallax-inner{
  position:absolute;
  inset:0;
  transform:translate3d(0, var(--mediaY,0px), 0) scale(1.08);
  will-change:transform;
}
.media-frame .parallax-inner > img,
.media-frame .parallax-inner > video,
.media-frame .parallax-inner > iframe{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Checklist */
.checklist{list-style:none;padding-left:0;margin:0;}
.checklist li{
  position:relative;
  padding-left:28px;
  margin-bottom:10px;
  color:rgba(17,24,39,.80);
}
.checklist li::before{
  content:"";
  position:absolute;
  left:0;top:6px;
  width:16px;height:16px;
  border-radius:6px;
  background:rgba(82,35,222,.14);
  border:1px solid rgba(82,35,222,.20);
  box-shadow:0 8px 16px rgba(82,35,222,.14);
}
.checklist li::after{
  content:"";
  position:absolute;
  left:5px;top:10px;
  width:6px;height:3px;
  border-left:2px solid var(--primary);
  border-bottom:2px solid var(--primary);
  transform:rotate(-45deg);
}

/* Quote / stats / insights */
.quote-card{
  border-radius:var(--radius);
  background:rgba(255,255,255,.75);
  border:1px solid rgba(82,35,222,.10);
  padding:22px;
  box-shadow:var(--shadow);
}
.quote-accent{
  border-left:4px solid var(--primary);box-shadow:0 18px 42px rgba(82,35,222,.10);
  padding-left:22px;
  background:rgba(255,255,255,.92);
}

.stat-card{
  border-radius:var(--radius);
  background:rgba(255,255,255,.78);
  border:1px solid rgba(82,35,222,.10);
  padding:22px;
  box-shadow:0 14px 40px rgba(17,24,39,.12);
  height:100%;
}
.stat-k{font-weight:700;margin-bottom:8px;}
.stat-v{color:rgba(231,229,255,.78);}

/* Base insight card (kept for compatibility) */
.insight-card{
  display:block;
  border-radius:var(--radius);
  background:rgba(255,255,255,.82);
  border:1px solid rgba(82,35,222,.10);
  padding:22px;
  box-shadow:0 14px 40px rgba(17,24,39,.10);
  transition:transform .2s ease, box-shadow .2s ease;
  color:var(--ink);
  height:100%;
}
.insight-card:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 65px rgba(17,24,39,.14);
}
.insight-meta{font-size:.86rem;color:rgba(17,24,39,.55);margin-bottom:8px;}
.insight-title{font-weight:650;font-size:1.05rem;margin-bottom:10px;}
.insight-cta{color:var(--primary);font-weight:600;}

/* Contact form card */
.form-card{
  border-radius:var(--radius);
  background:rgba(255,255,255,.88);
  border:1px solid rgba(82,35,222,.10);
  padding:26px;
  box-shadow:var(--shadow);
}

/* =========================
   HIGHLIGHTED WHITE SECTION
========================= */
.section-highlight{position:relative;}
.section-highlight::before{
  content:"";
  position:absolute;
  left:50%;
  top:20%;
  transform:translateX(-50%);
  width:85%;
  height:60%;
  background:radial-gradient(circle at center, rgba(82,35,222,.08), rgba(255,255,255,0) 70%);
  pointer-events:none;
}

/* =========================
   INSIGHTS (PRO)
========================= */
.insights-wrap{position:relative;}
.insights-wrap::before{
  content:"";
  position:absolute;
  left:50%;
  top:10%;
  transform:translateX(-50%);
  width:92%;
  height:70%;
  background:radial-gradient(800px 420px at 20% 30%, rgba(82,35,222,.08), rgba(255,255,255,0) 70%);
  pointer-events:none;
}

.insights-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(82,35,222,.06);
  border:1px solid rgba(17,24,39,.08);
  font-size:.9rem;
}
.insights-pill .dot{
  width:8px;height:8px;
  border-radius:999px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  box-shadow:0 0 0 6px rgba(82,35,222,.12);
}

/* Pro insight card variant (image cover + tighter spacing) */
.insight-card-pro{
  overflow:hidden;
  padding:0;
  border-radius:var(--radius);
  background:rgba(255,255,255,.88);
  border:1px solid rgba(82,35,222,.10);
  box-shadow:0 14px 40px rgba(17,24,39,.08);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.insight-card-pro:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 70px rgba(17,24,39,.14);
  border-color:rgba(82,35,222,.25);
}
.insight-body{padding:20px 22px 22px;}
.insight-desc{
  color:rgba(17,24,39,.70);
  margin-bottom:12px;
  font-size:.95rem;
  line-height:1.45;
}

/* Insight cover + thematic variants */
.insight-cover{
  height:150px;
  position:relative;
  border-bottom:1px solid rgba(82,35,222,.10);
  overflow:hidden;
}
/* Grid overlay for “infra” feel */
.insight-cover::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.18;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.18) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.14) 1px, transparent 1px);
  background-size:26px 26px;
  pointer-events:none;
}
/* Soft highlight sweep */
.insight-cover::after{
  content:"";
  position:absolute;
  inset:-40% -20%;
  transform:rotate(12deg);
  background:radial-gradient(closest-side, rgba(255,255,255,.30), rgba(255,255,255,0) 70%);
  opacity:.55;
  pointer-events:none;
}

/* IMF: global blue/green */
.cover-imf{
  background:
    radial-gradient(700px 260px at 15% 30%, rgba(82,35,222,.46), rgba(82,35,222,0) 60%),
    radial-gradient(680px 260px at 85% 20%, rgba(123,92,255,.24), rgba(123,92,255,0) 60%),
    radial-gradient(520px 220px at 55% 95%, rgba(232,222,255,.20), rgba(232,222,255,0) 60%),
    linear-gradient(135deg, rgba(15,14,71,.95), rgba(22,20,99,.55));
}
/* ECB: euro/policy lavender + blue */
.cover-ecb{
  background:
    radial-gradient(720px 260px at 20% 30%, rgba(123,92,255,.34), rgba(123,92,255,0) 60%),
    radial-gradient(680px 260px at 85% 25%, rgba(82,35,222,.22), rgba(82,35,222,0) 60%),
    radial-gradient(520px 220px at 50% 95%, rgba(244,241,255,.34), rgba(244,241,255,0) 70%),
    linear-gradient(135deg, rgba(15,14,71,.95), rgba(64,57,150,.40));
}
/* BIS: research amber + green */
.cover-bis{
  background:
    radial-gradient(720px 260px at 18% 35%, rgba(82,35,222,.22), rgba(82,35,222,0) 60%),
    radial-gradient(680px 260px at 85% 20%, rgba(22,20,99,.24), rgba(22,20,99,0) 60%),
    radial-gradient(520px 220px at 55% 95%, rgba(232,222,255,.24), rgba(232,222,255,0) 70%),
    linear-gradient(135deg, rgba(13,16,40,.95), rgba(22,20,99,.42));
}

/* =========================
   FOOTER
========================= */
.footer{
  padding:34px 0;
  border-top:1px solid rgba(17,24,39,.08);
}
.footer-extended{
  padding:64px 0;
  background:linear-gradient(180deg, rgba(18,18,74,.98), rgba(13,16,40,.98));
  border-top:1px solid rgba(17,24,39,.08);
}
.footer-title{
  font-weight:600;
  font-size:.95rem;
  margin-bottom:12px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(231,229,255,.78);
}
.footer-links{
  list-style:none;
  padding:0;
  margin:0;
}
.footer-links li{margin-bottom:8px;}
.footer-links a{
  color:rgba(231,229,255,.66);
  font-size:.95rem;
  transition:color .2s ease;
}
.footer-links a:hover{
  color:var(--primary);
  text-decoration:none;
}

/* =========================
   COOKIE BANNER
========================= */
.cookie-banner{
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  background:rgba(13,16,40,.94);
  backdrop-filter:blur(8px);
  border-top:1px solid rgba(123,92,255,.24);
  padding:16px 0;
  z-index:9999;
  box-shadow:0 -12px 30px rgba(13,16,40,.26);
}
.cookie-banner a{color:var(--primary);text-decoration:underline;}
.cookie-text{font-size:.95rem;}

/* =========================
   MISC
========================= */
.parallax{will-change:transform;}
.text-dorado{color:var(--p-5);}

/* Visual confirmation when parallax is on */
body.parallax-on .nav-glass{
  box-shadow:0 10px 30px rgba(17,24,39,.10);
}

/* Responsive tweaks */
@media (max-width:991px){
  :root{--navH:70px;}
  body{padding-top:70px;}
  .hero-content{padding:54px 0 86px;}
  .media-frame{min-height:240px;}
  .footer-extended{padding:48px 0;}
}
@media (max-width:575px){
  .cookie-text{font-size:.9rem;}
}
/* ===== Mobile hamburger menu readability fix ===== */
@media (max-width: 991px){

  /* El panel que se despliega al abrir la hamburguesa */
  #topNav .navbar-collapse{
    margin-top: 10px;
    padding: 12px 14px;
    border-radius: 16px;

    /* Fondo claro para que se lea sobre el hero oscuro */
    background: rgba(255,255,255,.96);
    border: 1px solid rgba(17,24,39,.10);
    box-shadow: 0 18px 50px rgba(17,24,39,.20);
    backdrop-filter: blur(10px);
  }

  /* Links del menú en móvil */
  #topNav .navbar-nav .nav-link{
    color: rgba(17,24,39,.90) !important;
    padding: 10px 10px;
    border-radius: 12px;
  }

  /* Hover / focus para que se sienta “premium” */
  #topNav .navbar-nav .nav-link:hover,
  #topNav .navbar-nav .nav-link:focus{
    background: rgba(37,99,235,.08);
    color: rgba(17,24,39,.95) !important;
  }

  /* Activo */
  #topNav .navbar-nav .nav-link.active{
    background: rgba(37,99,235,.10);
    color: var(--primary) !important;
  }

  /* Botón "Get started" alineado y con separación */
  #topNav .navbar-collapse .btn{
    width: 100%;
  }
}

/* ===== Footer mobile alignment fix ===== */
@media (max-width: 991px){

  /* 1) Un poco más de aire general */
  .footer-extended{
    padding-left: 10px;
    padding-right: 10px;
  }

  /* 2) Convertimos el top del footer en grid 2 columnas */
  .footer-extended .footer-top{
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 18px;
    row-gap: 18px;
    align-items: start;
  }

  /* 3) La marca ocupa todo el ancho */
  .footer-extended .footer-top > .col-lg-4{
    grid-column: 1 / -1;
  }

  /* 4) Alineación visual: igualamos el "offset" del bloque brand */
  /* Ajusta este valor si quieres más/menos: 44px suele quedar perfecto */
  .footer-extended .footer-top > .col-lg-2,
  .footer-extended .footer-top > .col-lg-3{
    padding-left: 44px;
  }

  /* 5) Limpieza para que no se vea pegado */
  .footer-extended .footer-links{
    padding-left: 0;
    margin-top: 6px;
  }

  .footer-extended .footer-links a{
    display: inline-block;
    padding: 6px 0;
  }

  .footer-extended hr.my-4{
    margin-top: 22px !important;
    margin-bottom: 18px !important;
  }
}

@media (max-width: 991px){
  .footer-extended .footer-disclaimer > .col-12{
    padding-left: 44px;
  }
}

/* Animaciòn logo */
/* Animaciòn logo (shine recortado al texto) */
.gtrade-logo{
  font-weight: 600;
  font-size: 2.5rem; /* display-6 aprox */
  letter-spacing: 0.5px;
  color: #111;

  /* CLAVE: el brillo queda dentro del ancho real del texto */
  display: inline-block;
  position: relative;
  overflow: hidden;
  white-space: nowrap;

  /* si algún estilo del header lo estira, esto lo mantiene “tight” */
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;

  padding: 2px 4px;
}

/* capa shine (solo existe dentro del span por el overflow hidden) */
.gtrade-logo:after{
  content: "";
  position: absolute;
  top: -30%;
  left: -60%;
  width: 55%;
  height: 160%;
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.95) 45%,
    rgba(255,255,255,0) 100%);
  transform: skewX(-20deg);
  opacity: 0;
  pointer-events: none;
}

/* activación de animación */
.gtrade-animate{
  animation: gtradePop 900ms ease-in-out;
}

/* shine durante la animación */
.gtrade-animate:after{
  opacity: 1;
  animation: gtradeShine 900ms ease-in-out;
}

@keyframes gtradePop{
  0%   { transform: scale(1);     filter: none; }
  35%  { transform: scale(1.08);  filter: drop-shadow(0 6px 10px rgba(0,0,0,0.25)); }
  65%  { transform: scale(0.99);  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.18)); }
  100% { transform: scale(1);     filter: none; }
}

@keyframes gtradeShine{
  0%   { left: -60%; }
  100% { left: 120%; }
}
/* Fin animaciòn logo */

/* =========================
   HERO VIDEO LOADER (pro)
========================= */
.hero-video{
  background: linear-gradient(135deg, rgba(15,14,71,.92), rgba(13,16,40,.76));
}

/* Loader encima del video */
.hero-loader{
  position:absolute;
  inset:0;
  z-index:2; /* debajo del overlay/grain? -> lo ponemos antes del overlay, pero con z-index controlado */
  display:flex;
  align-items:center;
  justify-content:center;

  /* look pro: shimmer + leve blur */
  background:
    radial-gradient(900px 520px at 15% 20%, rgba(82,35,222,.24), rgba(82,35,222,0) 60%),
    radial-gradient(760px 420px at 85% 35%, rgba(22,20,99,.22), rgba(22,20,99,0) 60%),
    linear-gradient(135deg, rgba(15,14,71,.94), rgba(13,16,40,.82));
  overflow:hidden;
}

/* shimmer */
.hero-loader:before{
  content:"";
  position:absolute;
  top:-30%;
  left:-60%;
  width:55%;
  height:160%;
  background: linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.18) 45%,
    rgba(255,255,255,0) 100%);
  transform: skewX(-18deg);
  animation: heroShimmer 1.2s linear infinite;
  opacity:.9;
}

@keyframes heroShimmer{
  0%   { left:-60%; }
  100% { left:120%; }
}

.hero-loader-inner{
  position:relative;
  z-index:1;
  text-align:center;
  color:#fff;
  padding:14px 18px;
  border-radius:14px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 50px rgba(0,0,0,.22);
}

.hero-loader-spinner{
  width:34px;
  height:34px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,.22);
  border-top-color: rgba(255,255,255,.85);
  margin:0 auto 10px auto;
  animation: heroSpin 0.9s linear infinite;
}

@keyframes heroSpin{
  0%{ transform:rotate(0); }
  100%{ transform:rotate(360deg); }
}

.hero-loader-text{
  font-size:.95rem;
  opacity:.92;
}

/* Estado: video listo -> ocultamos loader suavemente */
.hero-video.is-ready .hero-loader{
  opacity:0;
  visibility:hidden;
  transition: opacity .35s ease, visibility .35s ease;
}
/* Fin ehader video load */

/* ===== FIX NAVBAR LOGO / HAMBURGER (NO OVERFLOW) =====
   Objetivo: evitar que el logo empuje el botón hamburguesa fuera de pantalla
   en tamaños móviles, sin alterar el layout en desktop.
*/
#topNav .navbar > .container{
  flex-wrap: nowrap;
}

/* Permite que el brand pueda “encogerse” y deje espacio al toggler */
#topNav .navbar-brand{
  flex: 0 1 auto;
  min-width: 0;
  max-width: calc(100% - 70px); /* reserva espacio para el botón */
  overflow: hidden;
}

/* Control del tamaño del logo */
#topNav .navbar-brand img.navbar-logo{
  display: block;
  width: auto !important;
  height: auto !important;
  object-fit: contain;

  /* Limita alto y ancho para que no rompa el navbar */
  max-height: calc(var(--navH) - 18px);
  max-width: 192px;
}

@media (max-width: 991px){
  #topNav .navbar-brand img.navbar-logo{
    max-height: 42px;
    max-width: 150px;
  }
}

@media (max-width: 420px){
  #topNav .navbar-brand img.navbar-logo{
    max-width: 130px;
  }
}

/* Mantiene el toggler visible y pegado a la derecha */
#topNav .navbar-toggler{
  margin-left: auto;
}




/* Extra premium accents */
.text-primary{color:var(--primary)!important;}
.text-muted{color:var(--muted)!important;}
.btn-dark{background:var(--navy);border-color:var(--navy);box-shadow:0 14px 28px rgba(22,20,99,.18);}
.btn-dark:hover{background:var(--navy-2);border-color:var(--navy-2);}
.btn-outline-dark{color:var(--navy);border-color:rgba(22,20,99,.22);}
.btn-outline-dark:hover{background:var(--navy);border-color:var(--navy);}
.form-control{border:1px solid rgba(82,35,222,.14);box-shadow:none;}
.form-control:focus{border-color:rgba(82,35,222,.40);box-shadow:0 0 0 .2rem rgba(82,35,222,.10);}
.navbar-light .navbar-toggler{border-color:rgba(82,35,222,.16);}
.navbar-light .navbar-toggler:focus{box-shadow:0 0 0 .2rem rgba(82,35,222,.12);}
.footer-extended .text-muted, .footer-extended p.small{color:rgba(231,229,255,.66)!important;}
.footer-extended hr.my-4{border-color:rgba(231,229,255,.10)!important;}
.footer-disclaimer{padding-top:10px;}
body main.section .container h1, body main.section .container h5{color:var(--navy);}
body main.section .container ul li{margin-bottom:8px;}
.cookie-banner .text-muted{color:rgba(231,229,255,.72)!important;}
.cookie-banner strong{color:#fff;}
/* ===== HARD FIX: PREVENT HORIZONTAL OVERFLOW (MOBILE) ===== */
html, body{
  width:100%;
  overflow-x:hidden;
}

/* Ensure navbar items never push the toggler out of view */
#topNav .navbar{
  flex-wrap:nowrap;
}

#topNav .navbar-brand{
  flex:1 1 auto;
  min-width:0;
}

/* Keep toggler visible on the right */
#topNav .navbar-toggler{
  flex:0 0 auto;
}