/* =========================================================
   ACTUALIZACIÓN PREMIUM V6
   Tipografía Roboto, campañas independientes, videos,
   contenido visual y desarrollo Flutter.
   ========================================================= */
:root{
  --heading-weight:500;
  --heading-tracking:-.035em;
  --campaign-nav-height:78px;
}
body{font-family:Roboto,Arial,sans-serif;font-weight:400}
h1,h2,h3,h4,.display-title{font-family:Roboto,Arial,sans-serif;font-weight:var(--heading-weight)!important;letter-spacing:var(--heading-tracking)}
.hero h1,.campaign-hero h1,.page-hero h1,.platform-page-hero h1{
  font-weight:500!important;
  letter-spacing:-.045em;
}
.section-head h2,.platform-title-row h2,.marketing-home-copy h2,.growth-system-copy h2,
.cta-panel h2,.ecosystem-copy h2,.all-platforms-heading h2{
  font-weight:500!important;
  letter-spacing:-.036em;
}
.marketing-home-copy h2,.growth-system-copy h2{font-size:clamp(2.45rem,3.8vw,3.85rem);line-height:1.1}
.panel-number,.campaign-stat b{font-weight:500}
.service-card h3,.platform-body h3,.step-card h3,.campaign-feature h3,.video-copy h3{font-weight:500!important}

/* Navegación del portal: Marketing, IA y Corretaje son enlaces directos */
.desktop-nav .nav-item>.nav-link{font-weight:500}
.desktop-nav .nav-item>a.nav-link{padding-inline:11px}
.mobile-direct{font-weight:500}
@media(min-width:1280px) and (max-width:1440px){
  .desktop-nav .nav-item>.nav-link{font-size:.75rem;padding-inline:7px}
  .brand-link{min-width:185px}
}

/* Header propio de cada landing de campaña */
.campaign-shell{padding-top:var(--campaign-nav-height)}
.campaign-header{
  position:fixed!important;
  inset:0 0 auto!important;
  height:var(--campaign-nav-height)!important;
  z-index:1200;
  background:rgba(10,15,25,.965);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 5px 22px rgba(2,8,18,.24);
  backdrop-filter:blur(18px);
  transition:height .25s ease,background .25s ease;
}
.campaign-header.compact{height:66px!important;background:rgba(10,15,25,.99)}
.campaign-nav{height:100%;display:flex;align-items:center;gap:20px;justify-content:flex-start!important}
.campaign-header .brand-link{flex:0 0 auto;min-width:205px}
.campaign-header .brand-logo{width:218px!important;height:58px!important;object-fit:contain;object-position:left center}
.campaign-header.compact .brand-logo{width:198px!important;height:50px!important}
.campaign-desktop-menu{
  flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:3px;
}
.campaign-menu-link{
  position:relative;min-height:40px;padding:0 9px;display:inline-flex;align-items:center;gap:6px;
  border-radius:11px;color:#cfd8e8;font-size:.73rem;line-height:1.15;font-weight:500;white-space:nowrap;
  transition:.2s;
}
.campaign-menu-link .material-symbols-rounded{font-size:18px;color:#7db3ff}
.campaign-menu-link:hover,.campaign-menu-link.active{color:#fff;background:rgba(255,255,255,.09)}
.campaign-menu-link.active:after{
  content:"";position:absolute;left:10px;right:10px;bottom:1px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,#4285f4,#34a853,#fbbc04,#ea4335);
}
.campaign-actions{display:flex;align-items:center;gap:8px;margin-left:auto;color:#fff}
.campaign-portal-link,.campaign-quote{
  height:42px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;gap:7px;
  border-radius:12px;font-size:.79rem;font-weight:500;white-space:nowrap;
}
.campaign-portal-link{color:#d6deeb;background:rgba(255,255,255,.07)}
.campaign-quote{color:#fff;background:linear-gradient(135deg,#1a73e8,#0b57d0);box-shadow:0 8px 22px rgba(26,115,232,.25)}
.campaign-portal-link .material-symbols-rounded,.campaign-quote .material-symbols-rounded{font-size:19px}
.campaign-menu-button{
  display:none;width:42px;height:42px;border:0;border-radius:12px;background:rgba(255,255,255,.1);color:#fff;
  place-items:center;
}
.campaign-drawer{position:fixed;inset:0;z-index:1400;visibility:hidden;pointer-events:none}
.campaign-drawer.open{visibility:visible;pointer-events:auto}
.campaign-drawer-backdrop{position:absolute;inset:0;border:0;background:rgba(4,9,18,.72);opacity:0;transition:.25s}
.campaign-drawer.open .campaign-drawer-backdrop{opacity:1}
.campaign-drawer-panel{
  position:absolute;top:0;right:0;width:min(420px,92vw);height:100%;background:#fff;
  transform:translateX(100%);transition:.28s;box-shadow:-20px 0 60px rgba(0,0,0,.28);overflow:auto;
}
.campaign-drawer.open .campaign-drawer-panel{transform:none}
.campaign-drawer-head{height:74px;padding:7px 16px;display:flex;align-items:center;justify-content:space-between;background:#101722}
.campaign-drawer-head .brand-logo{width:212px;height:56px}
.campaign-drawer-head button{width:42px;height:42px;border:0;border-radius:12px;background:rgba(255,255,255,.1);color:#fff}
.campaign-drawer-title{margin:18px;padding:18px;display:flex;align-items:center;gap:12px;border-radius:18px;background:linear-gradient(135deg,#e8f0fe,#f4f7ff);color:#172033}
.campaign-drawer-title>.material-symbols-rounded{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:#1a73e8;color:#fff}
.campaign-drawer-title div{display:grid}.campaign-drawer-title small{color:#64738b}.campaign-drawer-title strong{font-weight:500}
.campaign-mobile-menu{padding:0 16px 18px;display:grid;gap:5px}
.campaign-mobile-menu .campaign-menu-link{min-height:50px;padding:0 13px;color:#34435d;background:#f6f8fc;font-size:.88rem}
.campaign-mobile-menu .campaign-menu-link .material-symbols-rounded{color:#1a73e8}
.campaign-mobile-menu .campaign-menu-link.active{background:#e8f0fe;color:#0b57d0}
.campaign-drawer-quote{margin:0 16px 30px;min-height:50px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:14px;background:#1a73e8;color:#fff;font-weight:500}

/* Los hero de campaña ya consideran el header fijo */
.campaign-shell .campaign-hero{padding-top:82px}
.campaign-shell .page-hero{padding-top:86px}

/* Selector visual dentro de cada landing especializada */
.campaign-options-section{
  position:relative;z-index:4;padding:34px 0;background:#fff;border-bottom:1px solid #e7ebf2;
  box-shadow:0 12px 34px rgba(25,40,65,.06);
}
.campaign-options-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:20px}
.campaign-options-head h2{margin:0;font-size:clamp(1.65rem,2.3vw,2.35rem);font-weight:500!important}
.campaign-options-head p{margin:0;color:var(--muted);max-width:590px}
.campaign-options-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.campaign-option-card{
  min-height:118px;padding:16px 13px;display:flex;flex-direction:column;justify-content:space-between;
  border:1px solid #e2e7f0;border-radius:17px;background:#fff;box-shadow:0 6px 18px rgba(24,38,63,.06);
  transition:.22s;color:#27354d;
}
.campaign-option-card:hover{transform:translateY(-4px);border-color:#9fc1ff;box-shadow:0 15px 32px rgba(24,38,63,.12);color:#0b57d0}
.campaign-option-card .material-symbols-rounded{
  width:39px;height:39px;display:grid;place-items:center;border-radius:12px;background:#e8f0fe;color:#1a73e8;
}
.campaign-option-card strong{font-size:.83rem;line-height:1.35;font-weight:500}
.campaign-option-card small{display:flex;align-items:center;gap:4px;color:#6b7890;font-size:.67rem}
.campaign-theme-marketing .campaign-option-card .material-symbols-rounded{background:#f3e8fd;color:#8e24aa}
.campaign-theme-ai .campaign-option-card .material-symbols-rounded{background:#e8f4ff;color:#2556d8}
.campaign-theme-realestate .campaign-option-card .material-symbols-rounded{background:#e6f4ea;color:#188038}

/* Secciones visuales de contenido y Flutter */
.visual-promo-section{overflow:hidden;position:relative}
.content-promo-section{
  background:
    radial-gradient(circle at 15% 20%,rgba(234,67,53,.18),transparent 27%),
    radial-gradient(circle at 88% 78%,rgba(66,133,244,.22),transparent 30%),
    linear-gradient(145deg,#101726,#1b2640 58%,#0b57d0);
  color:#fff;
}
.flutter-promo-section{
  background:
    radial-gradient(circle at 15% 80%,rgba(52,168,83,.17),transparent 27%),
    radial-gradient(circle at 85% 15%,rgba(66,133,244,.18),transparent 30%),
    linear-gradient(180deg,#f7faff,#fff);
}
.visual-promo-grid{display:grid;grid-template-columns:minmax(0,.93fr) minmax(470px,1.07fr);gap:72px;align-items:center}
.visual-promo-grid.reverse{grid-template-columns:minmax(470px,1.07fr) minmax(0,.93fr)}
.visual-promo-copy h2{
  font-size:clamp(2.45rem,3.8vw,3.85rem);line-height:1.08;margin:18px 0;font-weight:500!important;
}
.visual-promo-copy>p{font-size:1.05rem;max-width:650px;color:var(--muted)}
.content-promo-section .visual-promo-copy>p{color:rgba(255,255,255,.74)}
.visual-promo-list{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin:26px 0}
.visual-promo-list span{
  min-height:48px;padding:10px 12px;display:flex;align-items:center;gap:9px;border:1px solid #e4e9f1;border-radius:13px;background:#fff;color:#35435a;font-size:.86rem;box-shadow:0 6px 18px rgba(22,36,60,.06);
}
.content-promo-section .visual-promo-list span{border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.08);color:#fff}
.visual-promo-list i{color:#34a853}
.visual-promo-media{
  position:relative;min-height:520px;padding:18px;border-radius:32px;
  background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.6);
  box-shadow:0 38px 90px rgba(4,18,48,.25);
}
.visual-promo-media img{width:100%;height:100%;min-height:484px;display:block;object-fit:cover;border-radius:23px}
.content-promo-section .visual-promo-media img{object-position:center center}
.flutter-promo-section .visual-promo-media img{object-position:center}
.media-floating-card{
  position:absolute;left:-30px;bottom:42px;padding:13px 15px;display:flex;align-items:center;gap:10px;
  border-radius:16px;background:#fff;color:#27344d;box-shadow:0 18px 45px rgba(14,30,61,.2);font-size:.78rem;font-weight:500;
}
.media-floating-card .material-symbols-rounded{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#e8f0fe;color:#1a73e8}
.media-tech-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.media-tech-row span{padding:7px 10px;border-radius:999px;background:#edf3ff;color:#155fc6;font-size:.72rem;font-weight:500}

/* Página de desarrollo Flutter */
.flutter-detail-section{background:linear-gradient(145deg,#07182e,#0b57d0 60%,#6b4eff);color:#fff}
.flutter-detail-grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(460px,1.15fr);gap:65px;align-items:center}
.flutter-detail-grid h2{font-size:clamp(2.35rem,3.8vw,3.7rem);line-height:1.08;margin:16px 0}
.flutter-detail-grid p{color:rgba(255,255,255,.78);font-size:1.05rem}
.flutter-detail-grid .visual-promo-media{min-height:430px}
.flutter-detail-grid .visual-promo-media img{min-height:394px}

/* Videos premium */
.videos-premium-section{
  overflow:hidden;background:
  radial-gradient(circle at 9% 10%,rgba(66,133,244,.14),transparent 25%),
  radial-gradient(circle at 92% 88%,rgba(234,67,53,.10),transparent 28%),
  linear-gradient(180deg,#f7f9fd,#fff);
}
.videos-premium-section .section-head code{display:none}
.video-grid{gap:22px}
.video-card-premium{position:relative;overflow:hidden;border-radius:26px;background:#fff}
.video-card-premium:before{content:"";display:block;height:4px;background:linear-gradient(90deg,#4285f4,#34a853,#fbbc04,#ea4335)}
.video-card-premium .video-frame{position:relative;aspect-ratio:16/9;background:#0e1420}
.video-card-premium .video-frame iframe{display:block}
.video-number{
  position:absolute;left:14px;top:14px;padding:7px 10px;border-radius:999px;
  background:rgba(10,16,27,.78);color:#fff;font-size:.65rem;letter-spacing:.09em;font-weight:500;backdrop-filter:blur(10px);
}
.video-card-premium .video-copy{padding:25px}
.video-card-premium .video-copy h3{font-size:1.45rem;line-height:1.28;margin:13px 0 9px}
.video-card-premium .video-copy p{min-height:54px}
.video-youtube-link{display:inline-flex;align-items:center;gap:5px;margin-top:17px;color:#0b57d0;font-size:.82rem;font-weight:500}
.video-youtube-link .material-symbols-rounded{font-size:17px}
.video-accent-2:before{background:linear-gradient(90deg,#7b61ff,#ea4335,#fbbc04)}

/* Footer especializado más útil y compacto */
.campaign-footer-grid{grid-template-columns:260px 1fr auto!important;align-items:start!important}
.campaign-footer-brand p{margin:8px 0 0;color:#aeb7c7;font-size:.82rem}
.campaign-footer-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 16px;padding-top:4px}
.campaign-footer-links a{color:#cbd5e4;font-size:.75rem}
.campaign-footer-links a:hover{color:#8ab4f8}

/* Ajustes para notebook y tablet */
@media(max-width:1399px){
  .campaign-header .brand-link{min-width:185px}
  .campaign-header .brand-logo{width:195px!important}
  .campaign-menu-link{font-size:.66rem;padding-inline:6px;gap:4px}
  .campaign-menu-link .material-symbols-rounded{display:none}
  .campaign-portal-link span{display:none}
  .campaign-portal-link{width:42px;padding:0}
  .campaign-options-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:1279px){
  .campaign-desktop-menu{display:none}
  .campaign-menu-button{display:grid}
  .campaign-actions{margin-left:auto}
  .visual-promo-grid,.visual-promo-grid.reverse,.flutter-detail-grid{grid-template-columns:1fr 1fr;gap:38px}
  .visual-promo-media{min-height:450px}.visual-promo-media img{min-height:414px}
}
@media(max-width:991px){
  .campaign-shell{--campaign-nav-height:70px}
  .campaign-header{height:70px!important}
  .campaign-header .brand-logo{width:205px!important;height:54px!important}
  .campaign-portal-link{display:none}
  .campaign-shell .campaign-hero{padding-top:60px}
  .campaign-shell .page-hero{padding-top:70px}
  .campaign-options-head{display:block}.campaign-options-head p{margin-top:8px}
  .visual-promo-grid,.visual-promo-grid.reverse,.flutter-detail-grid{grid-template-columns:1fr}
  .visual-promo-grid.reverse .visual-promo-media{order:2}
  .visual-promo-grid.reverse .visual-promo-copy{order:1}
  .visual-promo-media{max-width:680px;width:100%;margin-inline:auto}
  .campaign-footer-grid{grid-template-columns:1fr!important;text-align:left!important}
  .campaign-footer-links{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:767px){
  body{padding-bottom:68px}
  .campaign-header .brand-link{min-width:0}
  .campaign-header .brand-logo{width:184px!important;height:48px!important}
  .campaign-quote span{display:none}.campaign-quote{width:42px;padding:0}
  .campaign-options-section{padding:27px 0}
  .campaign-options-grid{grid-template-columns:1fr 1fr}
  .campaign-option-card{min-height:105px}
  .visual-promo-section{padding:68px 0}
  .visual-promo-copy h2{font-size:2.25rem}
  .visual-promo-list{grid-template-columns:1fr}
  .visual-promo-media{min-height:390px;padding:11px;border-radius:24px}
  .visual-promo-media img{min-height:368px;border-radius:17px}
  .content-promo-section .visual-promo-media img{object-fit:cover}
  .media-floating-card{left:20px;right:20px;bottom:26px}
  .video-card-premium .video-copy{padding:19px}
  .video-card-premium .video-copy h3{font-size:1.18rem}
  .video-card-premium .video-copy p{min-height:0;font-size:.9rem}
  .campaign-footer-links{grid-template-columns:1fr 1fr}
  .campaign-footer-links a{font-size:.69rem}
}
@media(max-width:420px){
  .campaign-header .brand-logo{width:168px!important}
  .campaign-actions{gap:5px}
  .campaign-options-grid{grid-template-columns:1fr}
  .campaign-option-card{min-height:82px}
  .campaign-footer-links{grid-template-columns:1fr}
}

/* =========================================================
   V7 · ACCIONES GLOBALES SIN BOTÓN EN EL NAVBAR
   ========================================================= */

/* El botón de cotización ya no pertenece al navbar. */
.nav-quote,
.campaign-quote,
.campaign-drawer-quote {
  display: none !important;
}

/* El espacio de acciones conserva solamente el botón de menú cuando corresponde. */
.navbar-actions,
.campaign-actions {
  flex-shrink: 0;
}

/* Escritorio y tablet: redes, cotización, WhatsApp y volver arriba. */
@media (min-width: 768px) {
  .floating-socials {
    display: flex !important;
  }

  .floating-actions {
    display: flex !important;
  }

  .mobile-action-bar {
    display: none !important;
  }
}

/* Celulares: redes compactas + barra inferior tipo aplicación. */
@media (max-width: 767.98px) {
  .floating-actions {
    display: none !important;
  }

  .floating-socials {
    display: flex !important;
    right: 7px;
    top: 46%;
    bottom: auto;
    z-index: 1420;
    gap: 6px;
    transform: translateY(-50%);
  }

  .float-social {
    width: 33px;
    height: 33px;
    border-radius: 10px;
    font-size: 0.86rem;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.22);
  }

  .mobile-action-bar {
    display: grid !important;
  }
}

@media (max-width: 390px) {
  .floating-socials {
    right: 5px;
  }

  .float-social {
    width: 31px;
    height: 31px;
    border-radius: 9px;
    font-size: 0.8rem;
  }
}

/* =========================================================
   V7 · VIDEOS DIRECTOS EN PORTADA
   ========================================================= */
.pwch-video-section{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(circle at 9% 8%,rgba(66,133,244,.25),transparent 30%),
    radial-gradient(circle at 90% 92%,rgba(155,81,224,.20),transparent 32%),
    linear-gradient(135deg,#07111f,#0c1728 50%,#121a2d);
}
.pwch-video-section:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:56px 56px}
.pwch-video-section>.container-wide{position:relative;z-index:2}
.pwch-video-heading{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr);gap:56px;align-items:end;margin-bottom:38px}
.pwch-video-heading h2{max-width:920px;margin:17px 0 15px;color:#fff;font-size:clamp(2.35rem,4.2vw,4.15rem);font-weight:500!important;line-height:1.06;letter-spacing:-.045em}
.pwch-video-heading h2 span{color:#8ab4f8;font-weight:600}
.pwch-video-heading p{max-width:790px;margin:0;color:#b7c3d4;font-size:1.02rem;line-height:1.75}
.pwch-video-highlights{display:grid;gap:11px}.pwch-video-highlights span{display:flex;align-items:center;gap:11px;padding:15px 16px;border:1px solid rgba(255,255,255,.1);border-radius:16px;background:rgba(255,255,255,.06);color:#dce7f8;font-size:.84rem;box-shadow:0 15px 34px rgba(0,0,0,.17)}.pwch-video-highlights i{width:37px;height:37px;display:grid;place-items:center;border-radius:12px;background:rgba(66,133,244,.18);color:#a8c7fa}
.pwch-video-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:23px}
.pwch-video-card{overflow:hidden;border:1px solid rgba(255,255,255,.11);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.035));box-shadow:0 30px 75px rgba(0,0,0,.3);backdrop-filter:blur(18px);transition:.25s}
.pwch-video-card:hover{transform:translateY(-6px);border-color:rgba(138,180,248,.38)}
.pwch-video-label{min-height:54px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;color:#d9e6fa;font-size:.76rem}.pwch-video-label small{color:rgba(255,255,255,.38);letter-spacing:.08em}
.pwch-video-frame{position:relative;margin:0 12px;aspect-ratio:16/9;overflow:hidden;border-radius:18px;background:#020711;box-shadow:0 18px 40px rgba(0,0,0,.32)}
.pwch-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.pwch-video-copy{display:grid;grid-template-columns:50px minmax(0,1fr);gap:16px;padding:24px}.pwch-video-copy>.material-symbols-rounded{width:50px;height:50px;display:grid;place-items:center;border-radius:16px;background:rgba(66,133,244,.17);color:#a8c7fa}.pwch-video-copy>.video-marketing-icon{background:rgba(251,188,4,.15);color:#fdd663}.pwch-video-copy small{display:block;color:#8ab4f8;font-size:.68rem;font-weight:600;letter-spacing:.07em}.pwch-video-copy h3{margin:8px 0 10px;color:#fff;font-size:1.42rem;font-weight:500!important}.pwch-video-copy p{margin:0;color:#aeb9c8;font-size:.9rem;line-height:1.68}.pwch-video-copy a{display:inline-flex;align-items:center;gap:5px;margin-top:16px;color:#a8c7fa;font-size:.8rem;font-weight:500}.pwch-video-copy a .material-symbols-rounded{font-size:16px}
@media(max-width:991px){.pwch-video-heading{grid-template-columns:1fr;gap:25px}.pwch-video-highlights{grid-template-columns:1fr 1fr}.pwch-video-grid{grid-template-columns:1fr}}
@media(max-width:767px){.pwch-video-heading h2{font-size:2.35rem}.pwch-video-heading p{font-size:.94rem}.pwch-video-highlights{grid-template-columns:1fr}.pwch-video-card{border-radius:21px}.pwch-video-frame{border-radius:15px}.pwch-video-copy{grid-template-columns:1fr;padding:19px}.pwch-video-copy h3{font-size:1.22rem}}

/* =========================================================
   ACTUALIZACIÓN V8 · MEGA MENÚ RESPONSIVE
   Evita que Programación Web salga fuera de la pantalla y
   garantiza que todas sus opciones permanezcan visibles.
   ========================================================= */

@media (min-width: 1280px) {
  /* El menú se posiciona respecto a la ventana y no al botón. */
  .desktop-nav .nav-item:first-child .nav-dropdown.mega {
    position: fixed;
    top: 80px;
    left: 50%;
    right: auto;
    width: min(920px, calc(100vw - 48px));
    max-width: calc(100vw - 48px);
    max-height: calc(100vh - 104px);
    overflow-x: hidden;
    overflow-y: auto;
    transform: translate(-50%, -8px) scale(.985);
    transform-origin: top center;
    scrollbar-width: thin;
    scrollbar-color: #b8c5d9 transparent;
  }

  .main-navbar.compact .desktop-nav .nav-item:first-child .nav-dropdown.mega {
    top: 68px;
  }

  .desktop-nav .nav-item:first-child.open .nav-dropdown.mega,
  .desktop-nav .nav-item:first-child:hover .nav-dropdown.mega {
    transform: translate(-50%, 0) scale(1);
  }

  .desktop-nav .nav-dropdown.mega .dropdown-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px 8px;
  }

  .desktop-nav .nav-dropdown.mega .dropdown-entry {
    min-width: 0;
    min-height: 48px;
    padding: 10px 11px;
  }

  .desktop-nav .nav-dropdown.mega .dropdown-entry > span:not(.material-symbols-rounded) {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
  }

  .desktop-nav .nav-dropdown.mega .dropdown-title {
    align-items: center;
    gap: 20px;
  }

  .desktop-nav .nav-dropdown.mega .dropdown-title small {
    flex-shrink: 0;
    white-space: nowrap;
  }
}

/* Notebook 14–15 pulgadas y zoom alto. */
@media (min-width: 1280px) and (max-width: 1440px) {
  .desktop-nav .nav-item:first-child .nav-dropdown.mega {
    width: min(860px, calc(100vw - 36px));
    max-width: calc(100vw - 36px);
  }

  .desktop-nav .nav-dropdown.mega .dropdown-entry {
    font-size: .79rem;
  }
}

/* Pantallas de poca altura: el contenido se puede desplazar sin cortarse. */
@media (min-width: 1280px) and (max-height: 720px) {
  .desktop-nav .nav-item:first-child .nav-dropdown.mega {
    top: 72px;
    max-height: calc(100vh - 84px);
  }

  .main-navbar.compact .desktop-nav .nav-item:first-child .nav-dropdown.mega {
    top: 62px;
  }
}

/* =========================================================
   ACTUALIZACIÓN V9 · MENÚ VERTICAL PREMIUM
   Panel compacto tipo aplicación Google Material.
   ========================================================= */

@media (min-width: 1280px) {
  .desktop-nav > ul {
    gap: 3px;
  }

  .desktop-nav .nav-link {
    position: relative;
    min-height: 44px;
    height: 44px;
    gap: 7px;
    padding-inline: 11px;
    border: 1px solid transparent;
    border-radius: 13px;
    color: #d7deeb;
    font-size: .78rem;
    font-weight: 500;
    transition: background .2s ease, border-color .2s ease, color .2s ease;
  }

  .desktop-nav .nav-link:hover,
  .desktop-nav .nav-link.active,
  .desktop-nav .nav-item.active > .nav-link,
  .desktop-nav .has-dropdown.open > .nav-link {
    border-color: rgba(255, 255, 255, .075);
    background: rgba(255, 255, 255, .09);
    color: #fff;
  }

  .desktop-nav .nav-main-icon {
    color: #79aaf4;
    font-size: 18px;
  }

  .desktop-nav .nav-dropdown-chevron {
    margin-left: 1px;
    color: #dce5f4;
    font-size: 18px;
    transition: transform .2s ease;
  }

  .desktop-nav .has-dropdown.open .nav-dropdown-chevron {
    transform: rotate(180deg);
  }

  .desktop-nav .nav-item:first-child .nav-dropdown.premium-vertical-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    right: auto;
    width: 365px;
    max-width: min(365px, calc(100vw - 32px));
    max-height: calc(100vh - 92px);
    padding: 12px;
    overflow-x: hidden;
    overflow-y: auto;
    border: 1px solid #dfe5ef;
    border-radius: 20px;
    background: rgba(255, 255, 255, .985);
    box-shadow:
      0 28px 68px rgba(6, 18, 38, .23),
      0 8px 22px rgba(6, 18, 38, .08);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-7px) scale(.985);
    transform-origin: top left;
    backdrop-filter: blur(20px);
    scrollbar-width: thin;
    scrollbar-color: #b9c5d6 transparent;
    z-index: 1500;
  }

  .main-navbar.compact .desktop-nav .nav-item:first-child .nav-dropdown.premium-vertical-dropdown {
    top: calc(100% + 8px);
  }

  .desktop-nav .nav-item:first-child.open .nav-dropdown.premium-vertical-dropdown,
  .desktop-nav .nav-item:first-child:hover .nav-dropdown.premium-vertical-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
  }

  .premium-dropdown-pointer {
    position: absolute;
    top: -7px;
    left: 27px;
    width: 15px;
    height: 15px;
    border-top: 1px solid #dfe5ef;
    border-left: 1px solid #dfe5ef;
    background: #fff;
    transform: rotate(45deg);
  }

  .premium-dropdown-heading {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 52px;
    padding: 4px 8px 8px;
  }

  .premium-dropdown-heading-icon {
    display: grid;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 12px;
    background: #eef3fb;
    color: #526c93;
  }

  .premium-dropdown-heading-icon .material-symbols-rounded {
    font-size: 20px;
  }

  .premium-dropdown-heading strong,
  .premium-dropdown-heading small {
    display: block;
  }

  .premium-dropdown-heading strong {
    margin-bottom: 2px;
    color: #202d43;
    font-size: .96rem;
    font-weight: 500;
  }

  .premium-dropdown-heading small {
    color: #7a8aa3;
    font-size: .72rem;
    font-weight: 400;
  }

  .premium-dropdown-divider {
    height: 1px;
    margin: 0 2px 8px;
    background: #e8edf4;
  }

  .premium-dropdown-summary,
  .premium-dropdown-option {
    display: grid;
    align-items: center;
    text-decoration: none;
  }

  .premium-dropdown-summary {
    grid-template-columns: 35px minmax(0, 1fr);
    gap: 10px;
    min-height: 48px;
    margin-bottom: 7px;
    padding: 6px 10px;
    border-radius: 13px;
    background: linear-gradient(135deg, #2879eb 0%, #1967d2 100%);
    color: #fff;
    font-size: .79rem;
    font-weight: 500;
    box-shadow: 0 10px 24px rgba(26, 103, 210, .22);
  }

  .premium-dropdown-summary:hover {
    color: #fff;
    filter: brightness(1.035);
  }

  .premium-dropdown-summary-icon,
  .premium-dropdown-option-icon {
    display: grid;
    place-items: center;
  }

  .premium-dropdown-summary-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: rgba(255, 255, 255, .14);
  }

  .premium-dropdown-summary-icon .material-symbols-rounded {
    font-size: 19px;
  }

  .premium-dropdown-list {
    display: grid;
    gap: 3px;
  }

  .premium-dropdown-option {
    grid-template-columns: 35px minmax(0, 1fr) auto;
    gap: 10px;
    min-height: 47px;
    padding: 5px 9px;
    border: 1px solid transparent;
    border-radius: 13px;
    color: #40506a;
    font-size: .79rem;
    font-weight: 400;
    transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
  }

  .premium-dropdown-option:hover,
  .premium-dropdown-option.is-current {
    border-color: #dce7f6;
    background: #f3f7fd;
    color: #155fc6;
    transform: translateX(2px);
  }

  .premium-dropdown-option-icon {
    width: 34px;
    height: 34px;
    border-radius: 11px;
    background: #eef3fb;
    color: #60789d;
  }

  .premium-dropdown-option-icon .material-symbols-rounded {
    font-size: 19px;
  }

  .premium-dropdown-option-label {
    min-width: 0;
    line-height: 1.25;
  }

  .premium-dropdown-catalog {
    margin-top: 3px;
    border-color: #d8e4f5;
    background: linear-gradient(135deg, #f6f9fe, #edf4fd);
    color: #304761;
  }

  .premium-dropdown-catalog .premium-dropdown-option-icon {
    background: #e4edfb;
    color: #526e98;
  }

  .premium-dropdown-end {
    color: #6b7f9d;
    font-size: 17px;
    opacity: .78;
    transition: transform .18s ease;
  }

  .premium-dropdown-catalog:hover .premium-dropdown-end {
    transform: translateX(3px);
  }
}

/* Notebooks de 14 y 15 pulgadas. */
@media (min-width: 1280px) and (max-width: 1450px) {
  .desktop-nav .nav-link {
    gap: 5px;
    padding-inline: 8px;
    font-size: .72rem;
  }

  .desktop-nav .nav-main-icon {
    font-size: 17px;
  }

  .desktop-nav .nav-item:first-child .nav-dropdown.premium-vertical-dropdown {
    width: 350px;
  }
}

/* El drawer móvil conserva iconos y flecha final. */
.mobile-direct {
  grid-template-columns: 30px minmax(0, 1fr) 22px;
}

.mobile-direct-arrow {
  color: #8795aa;
  font-size: 18px;
}

/* =========================================================
   ACTUALIZACIÓN V10 · PLATAFORMAS REALES Y NUEVO HERO
   ========================================================= */

/* Cuarto slide: plataformas rápidas y eficientes */
.slide-platform-fast {
  background:
    radial-gradient(circle at 14% 16%, rgba(52, 168, 83, .24), transparent 30%),
    radial-gradient(circle at 86% 76%, rgba(251, 188, 4, .20), transparent 32%),
    linear-gradient(135deg, #071d35 0%, #0b57d0 48%, #1a8f63 100%);
}

.slide-platform-fast .hero-copy h1 span { color: #c5f5d8; }

.hero-platform-fast-art {
  position: relative;
  min-height: 540px;
  perspective: 1200px;
}

.fast-platform-glow {
  position: absolute;
  inset: 12% 8%;
  border-radius: 50%;
  background: rgba(140, 255, 195, .25);
  filter: blur(72px);
}

.fast-platform-card {
  position: absolute;
  overflow: hidden;
  border: 10px solid rgba(255, 255, 255, .94);
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 28px 70px rgba(2, 14, 35, .34);
}

.fast-platform-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.fast-card-main {
  z-index: 3;
  top: 72px;
  left: 50%;
  width: min(430px, 72%);
  aspect-ratio: 4 / 3;
  transform: translateX(-50%) rotate(-1.5deg);
}

.fast-card-main > span {
  position: absolute;
  right: 14px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 0 13px;
  border-radius: 12px;
  background: rgba(7, 17, 31, .88);
  color: #fff;
  font-size: .76rem;
  font-weight: 500;
  backdrop-filter: blur(10px);
}

.fast-card-left {
  z-index: 2;
  left: 0;
  bottom: 64px;
  width: min(260px, 43%);
  aspect-ratio: 4 / 3;
  transform: rotate(-8deg);
}

.fast-card-right {
  z-index: 2;
  right: 0;
  bottom: 48px;
  width: min(255px, 42%);
  aspect-ratio: 4 / 3;
  transform: rotate(7deg);
}

.fast-platform-badge {
  z-index: 5;
  right: 18px;
  top: 18px;
}

/* Sección de plataformas: botón y flechas siempre separados */
.platforms-catalog-preview .platform-title-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 34px;
  margin-bottom: 28px;
}

.platforms-catalog-preview .platform-title-copy { max-width: 920px; }

.platforms-catalog-preview .platform-title-copy p {
  max-width: 760px;
  margin-bottom: 0;
}

.platforms-catalog-preview .platforms-main-button {
  align-self: end;
  position: static !important;
  min-width: 220px;
  margin: 0 !important;
  white-space: nowrap;
}

.platforms-catalog-preview .premium-platform-shell { position: relative; }

.platform-carousel-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 54px;
  margin-bottom: 8px;
}

.platform-carousel-toolbar > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #6b7890;
  font-size: .79rem;
}

.platform-carousel-toolbar > span .material-symbols-rounded {
  color: #1a73e8;
  font-size: 19px;
}

.platforms-catalog-preview .platform-carousel-nav {
  position: static !important;
  inset: auto !important;
  display: flex;
  justify-content: flex-end;
  gap: 9px;
  margin: 0 !important;
}

.platforms-catalog-preview .platform-carousel-nav button {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  color: #0b57d0;
  box-shadow: 0 8px 22px rgba(15, 45, 90, .10);
}

.platforms-catalog-preview .platform-viewport { padding-top: 7px; }

.platforms-catalog-preview .platform-track {
  grid-auto-columns: calc((100% - 66px) / 4);
  gap: 22px;
}

.platforms-catalog-preview .platform-card {
  min-height: 480px;
  border-radius: 22px;
}

.platform-catalog-image {
  display: block;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 4 / 3;
  background: #eef3f9;
}

.platform-catalog-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}

.platform-card-with-image:hover .platform-catalog-image img { transform: scale(1.025); }

.platform-card-with-image .platform-body {
  display: flex;
  min-height: 230px;
  flex-direction: column;
  padding: 20px 20px 18px;
}

.platform-card-with-image .platform-category {
  align-self: flex-start;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: none;
  letter-spacing: 0;
}

.platform-card-with-image .platform-body h3 {
  margin: 13px 0 8px;
  font-size: 1.08rem;
  line-height: 1.3;
}

.platform-card-with-image .platform-body p {
  display: -webkit-box;
  min-height: 66px;
  margin-bottom: 18px;
  overflow: hidden;
  font-size: .84rem;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.platform-card-with-image .platform-actions {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 8px;
  margin-top: auto;
}

.platform-card-with-image .platform-actions a {
  min-height: 39px;
  justify-content: center;
  padding: 0 12px;
  border-radius: 12px;
  font-size: .76rem;
}

.platform-card-with-image .platform-actions .platform-quote {
  background: #1a73e8;
  color: #fff;
}

.platform-card-with-image .platform-actions .platform-info {
  background: #eef2f8;
  color: #40516b;
}

.platform-card-with-image .platform-actions .material-symbols-rounded { font-size: 17px; }

/* Imagen de generación de contenido más equilibrada */
.content-promo-section .visual-promo-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(390px, .82fr);
  gap: 62px;
}

.content-promo-section .content-promo-media {
  width: min(100%, 510px);
  min-height: 0;
  margin-left: auto;
  padding: 13px;
  border-radius: 28px;
}

.content-promo-section .content-promo-media img {
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: 610px;
  aspect-ratio: 550 / 744;
  object-fit: cover;
  border-radius: 20px;
}

.content-promo-section .content-promo-media .media-floating-card {
  left: -18px;
  bottom: 34px;
}

@media (max-width: 1279px) {
  .platforms-catalog-preview .platform-track { grid-auto-columns: calc((100% - 44px) / 3); }
  .hero-platform-fast-art { min-height: 480px; }
}

@media (max-width: 991px) {
  .platforms-catalog-preview .platform-title-row {
    grid-template-columns: 1fr;
    align-items: start;
    gap: 20px;
  }

  .platforms-catalog-preview .platforms-main-button { justify-self: start; }
  .platforms-catalog-preview .platform-track { grid-auto-columns: calc((100% - 20px) / 2); }
  .content-promo-section .visual-promo-grid { grid-template-columns: 1fr; }
  .content-promo-section .content-promo-media { margin-inline: auto; }

  .hero-platform-fast-art {
    max-width: 700px;
    width: 100%;
    margin-inline: auto;
  }
}

@media (max-width: 680px) {
  .slide-platform-fast .hero-grid { padding-bottom: 92px; }
  .hero-platform-fast-art { min-height: 360px; }

  .fast-card-main {
    top: 54px;
    width: 76%;
    border-width: 7px;
    border-radius: 20px;
  }

  .fast-card-left,
  .fast-card-right {
    bottom: 38px;
    width: 43%;
    border-width: 6px;
    border-radius: 17px;
  }

  .fast-platform-badge {
    top: 0;
    right: 0;
  }

  .platforms-catalog-preview .platform-title-row { margin-bottom: 18px; }
  .platforms-catalog-preview .platforms-main-button { display: none; }

  .platform-carousel-toolbar {
    align-items: center;
    min-height: 48px;
  }

  .platform-carousel-toolbar > span {
    max-width: 190px;
    font-size: .7rem;
    line-height: 1.35;
  }

  .platforms-catalog-preview .platform-carousel-nav button {
    width: 42px;
    height: 42px;
  }

  .platforms-catalog-preview .platform-track {
    grid-auto-columns: 100%;
    gap: 14px;
  }

  .platforms-catalog-preview .platform-card { min-height: 0; }
  .platform-catalog-image { aspect-ratio: 4 / 3; }
  .platform-card-with-image .platform-body { min-height: 220px; }
  .platform-card-with-image .platform-actions { grid-template-columns: 1fr 1fr; }

  .content-promo-section .content-promo-media {
    width: min(100%, 430px);
    padding: 9px;
    border-radius: 22px;
  }

  .content-promo-section .content-promo-media img {
    max-height: 570px;
    border-radius: 16px;
  }

  .content-promo-section .content-promo-media .media-floating-card {
    left: 14px;
    right: 14px;
    bottom: 20px;
  }
}

@media (max-width: 420px) {
  .hero-platform-fast-art { min-height: 320px; }

  .fast-platform-badge {
    transform: scale(.88);
    transform-origin: top right;
  }

  .platform-card-with-image .platform-actions { grid-template-columns: 1fr; }
}


/* =========================================================
   V11 · CONTROLES VISIBLES DEL HERO
   ========================================================= */
.hero-navigation-buttons {
  position: absolute;
  z-index: 18;
  right: clamp(22px, 4vw, 72px);
  bottom: 30px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.hero-arrow {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .32);
  border-radius: 15px;
  background: rgba(255, 255, 255, .94);
  color: #0b57d0;
  box-shadow: 0 14px 32px rgba(7, 20, 45, .20);
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
  backdrop-filter: blur(14px);
}

.hero-arrow:hover {
  transform: translateY(-2px);
  background: #fff;
  box-shadow: 0 18px 38px rgba(7, 20, 45, .26);
}

.hero-arrow .material-symbols-rounded { font-size: 25px; }

/* =========================================================
   V11 · FLECHAS DE PLATAFORMAS SIN TAPAR EL CTA
   ========================================================= */
.platforms-catalog-preview .premium-platform-shell {
  position: relative;
  overflow: visible;
}

.platform-carousel-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 58px;
  margin-top: 18px;
  padding: 12px 14px 0;
  border-top: 1px solid rgba(118, 139, 171, .18);
}

.platform-carousel-help {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #68778f;
  font-size: .8rem;
}

.platform-carousel-help .material-symbols-rounded {
  color: #1a73e8;
  font-size: 20px;
}

.platforms-catalog-preview .platform-carousel-nav {
  position: static !important;
  inset: auto !important;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin: 0 !important;
  transform: none !important;
}

.platforms-catalog-preview .platform-carousel-nav button {
  position: static !important;
  inset: auto !important;
  width: 46px;
  height: 46px;
  border: 1px solid #d7e2f2;
  border-radius: 15px;
  background: #fff;
  color: #0b57d0;
  box-shadow: 0 9px 23px rgba(14, 44, 92, .11);
  transform: none !important;
}

.platforms-catalog-preview .platform-carousel-nav button:hover {
  background: #eef5ff;
  border-color: #bcd1f4;
}

@media (max-width: 767.98px) {
  .hero-navigation-buttons {
    right: 18px;
    bottom: 62px;
    gap: 8px;
  }

  .hero-arrow {
    width: 42px;
    height: 42px;
    border-radius: 13px;
  }

  .platform-carousel-footer {
    align-items: center;
    margin-top: 14px;
    padding: 12px 0 0;
  }

  .platform-carousel-help {
    max-width: 190px;
    font-size: .71rem;
    line-height: 1.35;
  }

  .platforms-catalog-preview .platform-carousel-nav button {
    width: 42px;
    height: 42px;
  }
}

@media (max-width: 430px) {
  .hero-navigation-buttons {
    bottom: 58px;
  }

  .platform-carousel-footer {
    gap: 10px;
  }

  .platform-carousel-help {
    max-width: 160px;
  }
}

/* =========================================================
   V12 · CARRUSELES, MENÚ Y FOOTER CON MEJOR LEGIBILIDAD
   ========================================================= */

/* Navbar de escritorio: texto más visible sin saturar el ancho. */
.desktop-nav .nav-link {
  color: #e8eef8;
  font-size: clamp(.84rem, .78vw, .96rem);
  font-weight: 500;
  letter-spacing: -.01em;
}

.desktop-nav .nav-link .material-symbols-rounded {
  color: #82b1ff;
  font-size: 20px;
}

/* Menú móvil: opciones grandes, táctiles y fáciles de leer. */
.mobile-direct,
.mobile-group-toggle {
  min-height: 56px;
  padding: 14px 12px;
  color: #1f2d44;
  font-size: 1.02rem;
  font-weight: 500;
  line-height: 1.3;
}

.mobile-direct > .material-symbols-rounded,
.mobile-group-toggle > .material-symbols-rounded {
  font-size: 23px;
}

.mobile-submenu {
  padding: 7px 0 12px 16px;
}

.mobile-submenu a {
  min-height: 48px;
  padding: 12px 11px;
  color: #46566f;
  font-size: .96rem;
  font-weight: 400;
  line-height: 1.35;
}

.mobile-submenu a .material-symbols-rounded {
  font-size: 21px;
}

/* ---------------------------------------------------------
   FLECHAS DEL HERO: pequeñas, transparentes y a ambos lados.
   --------------------------------------------------------- */
.hero-navigation-buttons {
  position: absolute;
  z-index: 18;
  inset: 0;
  display: block;
  pointer-events: none;
}

.hero-arrow {
  position: absolute;
  top: 50%;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, .48);
  border-radius: 50%;
  background: rgba(255, 255, 255, .72);
  color: #0b57d0;
  box-shadow: 0 9px 24px rgba(4, 20, 50, .17);
  transform: translateY(-50%);
  pointer-events: auto;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.hero-arrow-prev {
  left: clamp(8px, 1.8vw, 28px);
}

.hero-arrow-next {
  right: clamp(8px, 1.8vw, 28px);
}

.hero-arrow:hover {
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 12px 28px rgba(4, 20, 50, .23);
  transform: translateY(-50%) scale(1.04);
}

.hero-arrow .material-symbols-rounded {
  font-size: 23px;
}

/* ---------------------------------------------------------
   FLECHAS DEL CARRUSEL DE PLATAFORMAS SOBRE LOS COSTADOS.
   El texto de ayuda permanece debajo del carrusel.
   --------------------------------------------------------- */
.platforms-catalog-preview .premium-platform-shell {
  position: relative;
  overflow: visible;
}

.platforms-catalog-preview .platform-viewport {
  position: relative;
  z-index: 1;
}

.platform-carousel-footer {
  position: static;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 46px;
  margin-top: 12px;
  padding: 10px 2px 0;
  border-top: 1px solid rgba(118, 139, 171, .16);
}

.platforms-catalog-preview .platform-carousel-nav {
  position: absolute !important;
  z-index: 12;
  inset: 0 !important;
  display: block;
  margin: 0 !important;
  pointer-events: none;
  transform: none !important;
}

.platforms-catalog-preview .platform-carousel-nav button {
  position: absolute !important;
  top: 43%;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background: rgba(255, 255, 255, .72);
  color: #0b57d0;
  box-shadow: 0 9px 22px rgba(11, 44, 96, .17);
  transform: translateY(-50%) !important;
  pointer-events: auto;
  backdrop-filter: blur(11px);
  -webkit-backdrop-filter: blur(11px);
}

.platforms-catalog-preview .platform-carousel-nav button:first-child {
  left: 8px !important;
  right: auto !important;
}

.platforms-catalog-preview .platform-carousel-nav button:last-child {
  right: 8px !important;
  left: auto !important;
}

.platforms-catalog-preview .platform-carousel-nav button:hover {
  border-color: rgba(255, 255, 255, .95);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 12px 28px rgba(11, 44, 96, .23);
  transform: translateY(-50%) scale(1.05) !important;
}

.platforms-catalog-preview .platform-carousel-nav button .material-symbols-rounded {
  font-size: 22px;
}

/* ---------------------------------------------------------
   FOOTER: letras más grandes y con mejor contraste.
   --------------------------------------------------------- */
.site-footer {
  color: #f4f7fb;
}

.footer-brand p {
  color: #c3ccda;
  font-size: .96rem;
  line-height: 1.65;
}

.footer-contact {
  color: #a8c7fa;
  font-size: .94rem;
}

.footer-column h3,
.footer-column h3 a {
  color: #47d7ff;
  font-size: 1.08rem;
  font-weight: 500;
  line-height: 1.3;
}

.footer-column li {
  margin: 9px 0;
}

.footer-column a {
  color: #e2e8f1;
  font-size: .94rem;
  line-height: 1.5;
}

.footer-column a:hover {
  color: #a8c7fa;
}

.footer-more {
  margin-top: 10px;
  font-size: .92rem !important;
  font-weight: 500;
}

.footer-bottom {
  color: #aeb9c9;
  font-size: .88rem;
  line-height: 1.5;
}

@media (max-width: 1279.98px) {
  .desktop-nav .nav-link {
    font-size: .84rem;
  }
}

@media (max-width: 767.98px) {
  .hero-arrow {
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, .68);
  }

  .hero-arrow-prev {
    left: 7px;
  }

  .hero-arrow-next {
    right: 7px;
  }

  .hero-arrow .material-symbols-rounded {
    font-size: 21px;
  }

  .platforms-catalog-preview .platform-carousel-nav button {
    top: 42%;
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, .72);
  }

  .platforms-catalog-preview .platform-carousel-nav button:first-child {
    left: 5px !important;
  }

  .platforms-catalog-preview .platform-carousel-nav button:last-child {
    right: 5px !important;
  }

  .platforms-catalog-preview .platform-carousel-nav button .material-symbols-rounded {
    font-size: 20px;
  }

  .platform-carousel-help {
    max-width: 235px;
    color: #53647e;
    font-size: .79rem;
    line-height: 1.4;
  }

  .site-footer {
    padding-top: 36px;
  }

  .footer-brand p {
    max-width: 350px;
    font-size: .91rem;
    line-height: 1.55;
  }

  .footer-contact {
    font-size: .86rem;
  }

  .footer-column h3,
  .footer-column h3 a {
    font-size: .98rem;
  }

  .footer-column a {
    font-size: .86rem;
    line-height: 1.5;
  }

  .footer-bottom {
    font-size: .8rem;
  }
}

@media (max-width: 430px) {
  .mobile-direct,
  .mobile-group-toggle {
    font-size: 1rem;
  }

  .mobile-submenu a {
    font-size: .94rem;
  }

  .platform-carousel-help {
    max-width: 205px;
    font-size: .75rem;
  }
}


/* =========================================================
   V13 · CARRUSEL INFINITO, REDES MÓVILES Y FOOTER SIMPLIFICADO
   ========================================================= */

/* El carrusel usa tres grupos clonados; se mantiene el desplazamiento suave. */
.platforms-catalog-preview .platform-track[data-infinite-carousel="true"] {
  will-change: transform;
}

/* Escritorio y tablet: flechas cuadradas sobre los costados de las tarjetas. */
@media (min-width: 768px) {
  .platforms-catalog-preview .platform-carousel-nav {
    position: absolute !important;
    z-index: 20;
    inset: 0 !important;
    display: block !important;
    margin: 0 !important;
    pointer-events: none;
  }

  .platforms-catalog-preview .platform-carousel-nav button {
    position: absolute !important;
    top: 43%;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(255, 255, 255, .86);
    border-radius: 12px;
    background: rgba(255, 255, 255, .82);
    color: #0b57d0;
    box-shadow: 0 10px 25px rgba(12, 43, 91, .18);
    transform: translateY(-50%) !important;
    pointer-events: auto;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  .platforms-catalog-preview .platform-carousel-nav button:first-child {
    left: 9px !important;
    right: auto !important;
  }

  .platforms-catalog-preview .platform-carousel-nav button:last-child {
    right: 9px !important;
    left: auto !important;
  }
}

/* Celular: flechas cuadradas, juntas y debajo del carrusel. */
@media (max-width: 767.98px) {
  body {
    padding-bottom: 118px !important;
  }

  .platform-carousel-footer {
    display: flex !important;
    min-height: 54px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding: 11px 0 0;
  }

  .platforms-catalog-preview .premium-platform-shell .platform-carousel-nav {
    position: static !important;
    inset: auto !important;
    display: flex !important;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0 0 0 auto !important;
    transform: none !important;
    pointer-events: auto;
  }

  .platforms-catalog-preview .premium-platform-shell .platform-carousel-nav button,
  .platforms-catalog-preview .premium-platform-shell .platform-carousel-nav button:first-child,
  .platforms-catalog-preview .premium-platform-shell .platform-carousel-nav button:last-child {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: 40px;
    height: 40px;
    margin: 0 !important;
    border: 1px solid #cfdbed;
    border-radius: 11px;
    background: #fff;
    color: #0b57d0;
    box-shadow: 0 8px 20px rgba(13, 44, 90, .11);
    transform: none !important;
  }

  .platforms-catalog-preview .premium-platform-shell .platform-carousel-nav button:hover {
    transform: none !important;
  }

  .platform-carousel-help {
    max-width: 205px;
    font-size: .74rem;
    line-height: 1.35;
  }

  /* Redes sociales horizontales justo sobre la barra inferior fija. */
  .floating-socials {
    position: fixed !important;
    z-index: 1510 !important;
    top: auto !important;
    right: auto !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    left: 50% !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 7px !important;
    padding: 6px 8px;
    border: 1px solid rgba(216, 225, 239, .95);
    border-radius: 15px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 9px 25px rgba(18, 39, 72, .16);
    transform: translateX(-50%) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .float-social {
    width: 33px !important;
    height: 33px !important;
    border-radius: 10px !important;
    font-size: .84rem;
  }

  .float-social:hover {
    transform: translateY(-2px) scale(1.03) !important;
  }
}

/* Footer: únicamente las opciones principales del menú. */
.site-footer-menu-only {
  padding: 0 !important;
  background: #111823;
  color: #fff;
}

.footer-main-menu {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  padding: 34px 0 28px;
}

.footer-main-link {
  display: flex;
  min-height: 54px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 14px;
  background: rgba(255, 255, 255, .04);
  color: #eef3fa;
  font-size: .94rem;
  font-weight: 500;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
}

.footer-main-link .material-symbols-rounded {
  color: #79a9ff;
  font-size: 20px;
}

.footer-main-link:hover,
.footer-main-link.is-current {
  border-color: rgba(121, 169, 255, .35);
  background: rgba(66, 133, 244, .12);
  color: #fff;
}

.footer-bottom-minimal {
  padding: 17px 0 20px;
  border-top: 1px solid rgba(255, 255, 255, .09);
  color: #aeb9c8;
  font-size: .84rem;
}

.footer-bottom-minimal a {
  color: #a8c7fa;
}

@media (max-width: 1199.98px) {
  .footer-main-menu {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .footer-main-menu {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 25px 0 20px;
  }

  .footer-main-link {
    min-height: 50px;
    padding: 9px 8px;
    font-size: .83rem;
  }

  .footer-main-link .material-symbols-rounded {
    font-size: 19px;
  }

  .footer-bottom-minimal {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: center;
    padding: 14px 0 18px;
    font-size: .73rem;
    text-align: center;
  }
}


/* =========================================================
   V14 · HERO, CARRUSELES MÓVILES Y FOOTER PREMIUM COMPACTO
   ========================================================= */

/* Flechas del carrusel principal: cuadradas, juntas y debajo. */
.hero-navigation-buttons {
  position: absolute !important;
  z-index: 22 !important;
  inset: auto auto 20px 50% !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto !important;
  transform: translateX(-50%) !important;
  pointer-events: auto !important;
}

.hero-arrow,
.hero-arrow-prev,
.hero-arrow-next {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  margin: 0 !important;
  border: 1px solid rgba(255, 255, 255, .68);
  border-radius: 11px !important;
  background: rgba(255, 255, 255, .88);
  color: #0b57d0;
  box-shadow: 0 10px 28px rgba(6, 27, 62, .20);
  transform: none !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.hero-arrow:hover {
  background: #fff;
  transform: translateY(-2px) !important;
}

.hero-controls {
  bottom: 78px !important;
}

/* Carouseles Bootstrap de tarjetas: solo para celular. */
.mobile-card-carousel {
  display: none;
}

@media (max-width: 767.98px) {
  .desktop-service-grid,
  .desktop-process-grid {
    display: none !important;
  }

  .mobile-card-carousel {
    display: block;
    position: relative;
    overflow: visible;
  }

  .mobile-card-carousel .carousel-inner {
    overflow: hidden;
    padding: 3px 2px 5px;
    border-radius: 24px;
  }

  .mobile-card-carousel .carousel-item {
    transition: transform .48s cubic-bezier(.2, .75, .25, 1);
  }

  .mobile-carousel-card-wrap {
    padding: 4px 3px 12px;
  }

  .mobile-services-carousel .service-card,
  .mobile-process-carousel .step-card {
    width: 100%;
    margin: 0;
    box-shadow: 0 16px 38px rgba(32, 55, 91, .12);
  }

  .mobile-services-carousel .service-card {
    min-height: 315px;
    padding: 24px 22px 66px;
  }

  .mobile-services-carousel .service-card a {
    right: 22px;
    bottom: 22px;
    left: 22px;
  }

  .mobile-process-carousel .step-card {
    min-height: 275px;
    padding: 25px 23px;
  }

  .mobile-process-carousel .step-card > .material-symbols-rounded {
    position: absolute;
    top: 25px;
    right: 22px;
  }

  .mobile-carousel-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 13px;
  }

  .mobile-carousel-controls button {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    padding: 0;
    border: 1px solid #cbd9ec;
    border-radius: 10px;
    background: rgba(255, 255, 255, .96);
    color: #0b57d0;
    box-shadow: 0 8px 20px rgba(13, 44, 90, .12);
  }

  .mobile-carousel-controls button:active {
    transform: scale(.96);
  }

  .mobile-carousel-controls .material-symbols-rounded {
    font-size: 23px;
  }

  .hero-navigation-buttons {
    bottom: 18px !important;
  }

  .hero-arrow,
  .hero-arrow-prev,
  .hero-arrow-next {
    width: 42px;
    height: 42px;
    border-radius: 10px !important;
  }

  .hero-controls {
    bottom: 72px !important;
  }
}

@media (min-width: 768px) {
  .mobile-card-carousel {
    display: none !important;
  }
}

/* Footer con el formato corporativo, pero solo títulos principales. */
.site-footer-compact-menu {
  padding: 0 !important;
  background: #111823;
  color: #fff;
}

.footer-premium-grid {
  display: grid;
  grid-template-columns: minmax(310px, 1.15fr) minmax(0, 2.85fr);
  gap: clamp(42px, 6vw, 92px);
  align-items: start;
  padding: 58px 0 48px;
}

.footer-brand-block {
  max-width: 390px;
}

.footer-brand-link {
  display: inline-flex;
  margin-bottom: 23px;
}

.footer-brand-logo {
  width: min(100%, 320px) !important;
  height: auto !important;
  object-fit: contain;
  object-position: left center;
}

.footer-brand-block > p {
  margin: 0 0 22px;
  color: #d2dbea;
  font-size: 1.01rem;
  line-height: 1.75;
}

.footer-contact-email {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 24px;
  color: #a8c7fa;
  font-size: .98rem;
  text-decoration: none;
}

.footer-contact-email .material-symbols-rounded {
  font-size: 22px;
}

.footer-social-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.footer-social-button {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border-radius: 13px;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 9px 20px rgba(0, 0, 0, .15);
}

.footer-social-button.facebook,
.footer-social-button.linkedin { background: #1473e6; }
.footer-social-button.instagram { background: linear-gradient(135deg, #ff7139, #d12b94); }
.footer-social-button.tiktok,
.footer-social-button.x { background: #080b10; }
.footer-social-button.youtube { background: #f31224; }

.footer-menu-titles {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 17px 22px;
}

.footer-title-link {
  display: flex;
  min-height: 68px;
  align-items: center;
  gap: 11px;
  padding: 16px 17px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 16px;
  background: rgba(255, 255, 255, .035);
  color: #eef4ff;
  font-size: 1.02rem;
  font-weight: 500;
  line-height: 1.28;
  text-decoration: none;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.footer-title-link .material-symbols-rounded {
  flex: 0 0 auto;
  color: #52d5ff;
  font-size: 23px;
}

.footer-title-link:hover,
.footer-title-link.is-current {
  border-color: rgba(82, 213, 255, .34);
  background: rgba(82, 213, 255, .09);
  color: #fff;
  transform: translateY(-2px);
}

.footer-bottom-premium {
  padding: 20px 0 23px;
  border-top: 1px solid rgba(255, 255, 255, .10);
  color: #aebbd0;
  font-size: .88rem;
}

.footer-bottom-premium a {
  color: #a8c7fa;
}

@media (max-width: 1199.98px) {
  .footer-premium-grid {
    grid-template-columns: minmax(280px, .95fr) minmax(0, 2.05fr);
    gap: 42px;
  }

  .footer-menu-titles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .footer-premium-grid {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 42px 0 31px;
  }

  .footer-brand-block {
    max-width: none;
    text-align: center;
  }

  .footer-brand-link {
    display: flex;
    justify-content: center;
  }

  .footer-brand-logo {
    width: min(100%, 270px) !important;
    object-position: center;
  }

  .footer-brand-block > p {
    max-width: 440px;
    margin: 0 auto 18px;
    font-size: .94rem;
  }

  .footer-contact-email,
  .footer-social-row {
    justify-content: center;
  }

  .footer-menu-titles {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }

  .footer-title-link {
    min-height: 58px;
    padding: 12px 10px;
    border-radius: 13px;
    font-size: .86rem;
  }

  .footer-title-link .material-symbols-rounded {
    font-size: 20px;
  }

  .footer-bottom-premium {
    display: flex;
    flex-direction: column;
    gap: 7px;
    align-items: center;
    padding: 16px 0 20px;
    font-size: .77rem;
    text-align: center;
  }
}

/* V14.1 · Ajuste final solicitado */
@media (max-width: 767.98px) {
  .mobile-carousel-controls {
    justify-content: flex-end;
    padding-right: 4px;
  }
}

/* Títulos principales del footer sin submenús ni cajas pesadas. */
.footer-title-link {
  min-height: auto;
  padding: 9px 2px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #52d5ff;
  font-size: 1.13rem;
  font-weight: 500;
}

.footer-title-link .material-symbols-rounded {
  color: #7fb1ff;
  font-size: 22px;
}

.footer-title-link:hover,
.footer-title-link.is-current {
  border-color: transparent;
  background: transparent;
  color: #ffffff;
  transform: translateX(3px);
}

@media (max-width: 767.98px) {
  .footer-title-link {
    padding: 9px 0;
    font-size: .93rem;
  }
}

/* =========================================================
   V15 · FOOTER EQUILIBRADO, CARRUSELES AUTOMÁTICOS Y MÓVIL
   ========================================================= */

/* El footer se divide en dos áreas realmente equilibradas. */
.site-footer-compact-menu .container-wide {
  max-width: 1560px;
}

.footer-premium-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: clamp(34px, 4vw, 72px) !important;
  align-items: stretch !important;
  padding: 54px 0 44px !important;
}

.footer-brand-block,
.footer-menu-titles {
  min-width: 0;
  min-height: 300px;
}

.footer-brand-block {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: none !important;
  padding: 8px clamp(28px, 4vw, 66px) 8px 4px;
  border-right: 1px solid rgba(255, 255, 255, .10);
}

.footer-brand-link {
  margin-bottom: 18px !important;
}

.footer-brand-logo {
  width: min(100%, 330px) !important;
}

.footer-brand-block > p {
  max-width: 540px;
  margin-bottom: 18px !important;
  font-size: 1rem !important;
  line-height: 1.7 !important;
}

.footer-contact-email {
  width: fit-content;
  max-width: 100%;
  margin-bottom: 20px !important;
  font-size: .98rem !important;
}

.footer-contact-email span:last-child {
  overflow-wrap: anywhere;
}

.footer-menu-titles {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: minmax(66px, auto);
  align-content: center;
  gap: 12px 28px !important;
  padding: 10px 2px;
}

.footer-title-link {
  display: flex !important;
  min-height: 66px !important;
  align-items: center;
  gap: 12px !important;
  padding: 12px 14px !important;
  border: 1px solid rgba(255, 255, 255, .07) !important;
  border-radius: 15px !important;
  background: rgba(255, 255, 255, .025) !important;
  color: #58d7ff !important;
  font-size: 1.06rem !important;
  line-height: 1.25;
}

.footer-title-link:hover,
.footer-title-link.is-current {
  border-color: rgba(82, 213, 255, .28) !important;
  background: rgba(82, 213, 255, .08) !important;
  color: #fff !important;
  transform: translateX(3px) !important;
}

.footer-bottom-premium {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 34px;
  padding: 19px 250px 22px 0 !important;
  text-align: center;
}

/* El movimiento automático conserva transiciones suaves. */
.mobile-card-carousel .carousel-item {
  transition: transform .58s cubic-bezier(.22, .68, .24, 1), opacity .35s ease !important;
}

@media (max-width: 1199.98px) {
  .footer-premium-grid {
    grid-template-columns: minmax(300px, .9fr) minmax(0, 1.1fr) !important;
    gap: 38px !important;
  }

  .footer-brand-block {
    padding-right: 36px;
  }

  .footer-title-link {
    font-size: .96rem !important;
  }

  .footer-bottom-premium {
    padding-right: 210px !important;
  }
}

@media (max-width: 767.98px) {
  .footer-premium-grid {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    padding: 34px 0 24px !important;
  }

  .footer-brand-block,
  .footer-menu-titles {
    min-height: auto;
  }

  .footer-brand-block {
    align-items: center;
    padding: 0 8px 23px !important;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .10);
    text-align: center;
  }

  .footer-brand-logo {
    width: min(100%, 245px) !important;
  }

  .footer-brand-block > p {
    max-width: 390px;
    font-size: .88rem !important;
    line-height: 1.6 !important;
  }

  .footer-contact-email {
    justify-content: center;
    margin-bottom: 0 !important;
    font-size: .84rem !important;
  }

  /* En celular no se muestran iconos sociales, ni flotantes ni en el footer. */
  .floating-socials,
  .footer-social-row {
    display: none !important;
  }

  .footer-menu-titles {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(54px, auto);
    gap: 8px !important;
    padding: 0 !important;
  }

  .footer-title-link {
    min-height: 54px !important;
    justify-content: flex-start;
    padding: 10px 11px !important;
    border-radius: 12px !important;
    font-size: .82rem !important;
  }

  .footer-title-link .material-symbols-rounded {
    font-size: 19px !important;
  }

  .footer-bottom-premium {
    flex-direction: column !important;
    gap: 5px !important;
    padding: 14px 0 calc(90px + env(safe-area-inset-bottom)) !important;
    font-size: .72rem !important;
  }

  /* Controles de los carruseles móviles agrupados y centrados. */
  .mobile-carousel-controls {
    justify-content: center !important;
    padding-right: 0 !important;
  }
}

/* V15.1 · Conserva el formato limpio del footer y centra su línea inferior. */
.footer-title-link {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding-inline: 4px !important;
}

.footer-title-link:hover,
.footer-title-link.is-current {
  border-color: transparent !important;
  background: transparent !important;
}

.footer-bottom-premium {
  padding: 19px 0 22px !important;
}

@media (max-width: 1199.98px) {
  .footer-bottom-premium {
    padding-right: 0 !important;
  }
}

@media (max-width: 767.98px) {
  .footer-title-link {
    padding: 10px 2px !important;
  }
}


/* =========================================================
   V16 · PIE DE PÁGINA DIRECTORIO DE SERVICIOS Y PLATAFORMAS
   ========================================================= */
.site-footer-directory {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 9% 10%, rgba(46, 128, 255, .12), transparent 34%),
    radial-gradient(circle at 92% 85%, rgba(30, 210, 175, .08), transparent 30%),
    #101824;
  color: #edf4ff;
}

.site-footer-directory::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: .17;
  background-image:
    linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: linear-gradient(to bottom, #000, transparent 94%);
}

.site-footer-directory > .container-wide {
  position: relative;
  z-index: 1;
  max-width: 1660px;
}

.footer-directory-grid {
  display: grid;
  grid-template-columns:
    minmax(250px, .92fr)
    minmax(230px, .8fr)
    minmax(440px, 1.55fr)
    minmax(240px, .82fr);
  gap: clamp(28px, 3vw, 58px);
  align-items: start;
  padding: 62px 0 52px;
}

.footer-directory-brand,
.footer-directory-section {
  min-width: 0;
}

.footer-directory-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-right: clamp(10px, 2vw, 28px);
}

.footer-directory-brand .footer-brand-link {
  display: inline-flex;
  margin: 0 0 22px;
}

.footer-directory-brand .footer-brand-logo {
  width: min(100%, 305px) !important;
  max-height: 92px;
  object-fit: contain;
  object-position: left center;
}

.footer-directory-brand > p {
  max-width: 360px;
  margin: 0 0 20px;
  color: #c7d2e2;
  font-size: .98rem;
  line-height: 1.72;
}

.footer-directory-brand .footer-contact-email {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  max-width: 100%;
  margin: 0 0 21px;
  color: #a8c7fa;
  font-size: .91rem;
  text-decoration: none;
}

.footer-directory-brand .footer-contact-email span:last-child {
  overflow-wrap: anywhere;
}

.footer-directory-brand .footer-social-row {
  gap: 8px;
}

.footer-directory-brand .footer-social-button {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.footer-directory-section {
  padding-top: 4px;
}

.footer-section-title {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 48px;
  margin: 0 0 17px;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(255, 255, 255, .11);
  color: #55d8ff;
  font-size: 1.08rem;
  font-weight: 500;
  line-height: 1.25;
  text-decoration: none;
}

.footer-section-title:hover {
  color: #fff;
}

.footer-section-icon {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(111, 174, 255, .18);
  border-radius: 12px;
  background: rgba(55, 125, 235, .13);
  color: #81b4ff;
}

.footer-section-icon .material-symbols-rounded {
  font-size: 21px;
}

.footer-section-arrow {
  margin-left: auto;
  color: #86a9db;
  font-size: 18px !important;
}

.footer-service-list {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-service-link {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 7px 7px;
  border-radius: 12px;
  color: #e7edf7;
  font-size: .91rem;
  line-height: 1.35;
  text-decoration: none;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}

.footer-service-link:hover {
  background: rgba(255, 255, 255, .055);
  color: #fff;
  transform: translateX(3px);
}

.footer-service-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 10px;
  background: rgba(255, 255, 255, .055);
  color: #80adf4;
}

.footer-service-icon .material-symbols-rounded {
  font-size: 18px;
}

.footer-link-arrow {
  color: #6585b1;
  font-size: 17px !important;
  opacity: .72;
}

.footer-platform-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.footer-platform-link {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 10px;
  min-height: 62px;
  padding: 9px 10px;
  border: 1px solid rgba(255, 255, 255, .075);
  border-radius: 14px;
  background: rgba(255, 255, 255, .032);
  color: #edf4ff;
  text-decoration: none;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}

.footer-platform-link:hover {
  border-color: rgba(91, 181, 255, .27);
  background: rgba(255, 255, 255, .065);
  color: #fff;
  transform: translateY(-2px);
}

.footer-platform-icon {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border-radius: 12px;
  background: rgba(48, 128, 255, .14);
  color: #75abff;
}

.footer-platform-icon .material-symbols-rounded {
  font-size: 20px;
}

.footer-platform-green .footer-platform-icon {
  background: rgba(34, 197, 94, .14);
  color: #65d88e;
}

.footer-platform-purple .footer-platform-icon {
  background: rgba(139, 92, 246, .15);
  color: #b49aff;
}

.footer-platform-orange .footer-platform-icon {
  background: rgba(249, 115, 22, .15);
  color: #ffad72;
}

.footer-platform-red .footer-platform-icon {
  background: rgba(239, 68, 68, .15);
  color: #ff8c8c;
}

.footer-platform-cyan .footer-platform-icon {
  background: rgba(6, 182, 212, .15);
  color: #67d8eb;
}

.footer-platform-copy {
  min-width: 0;
}

.footer-platform-copy strong,
.footer-platform-copy small {
  display: block;
}

.footer-platform-copy strong {
  color: #edf4ff;
  font-size: .82rem;
  font-weight: 500;
  line-height: 1.27;
}

.footer-platform-copy small {
  margin-top: 3px;
  color: #91a0b6;
  font-size: .69rem;
}

.footer-platform-arrow {
  color: #6585b1;
  font-size: 17px !important;
  opacity: .72;
}

.footer-contact-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  width: 100%;
  min-height: 48px;
  margin-top: 18px;
  padding: 0 15px;
  border-radius: 13px;
  background: #168c4e;
  color: #fff;
  font-size: .85rem;
  font-weight: 500;
  text-decoration: none;
  box-shadow: 0 12px 26px rgba(11, 105, 55, .22);
}

.footer-contact-cta:hover {
  background: #1ca45d;
  color: #fff;
}

.footer-bottom-directory {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 20px 0 24px;
  border-top: 1px solid rgba(255, 255, 255, .10);
  color: #a9b7ca;
  font-size: .82rem;
}

.footer-bottom-directory > div {
  display: flex;
  gap: 22px;
}

.footer-bottom-directory a {
  color: #a8c7fa;
  text-decoration: none;
}

.footer-bottom-directory a:hover {
  color: #fff;
}

@media (max-width: 1399.98px) {
  .footer-directory-grid {
    grid-template-columns: minmax(245px, .9fr) minmax(220px, .75fr) minmax(390px, 1.35fr);
  }

  .footer-strategy-section {
    grid-column: 2 / 4;
    display: grid;
    grid-template-columns: minmax(220px, .75fr) minmax(390px, 1.35fr);
    gap: 24px;
    align-items: start;
    padding-top: 6px;
  }

  .footer-strategy-section .footer-section-title {
    grid-column: 1 / -1;
    margin-bottom: 0;
  }

  .footer-strategy-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
  }

  .footer-contact-cta {
    align-self: center;
    margin-top: 0;
  }
}

@media (max-width: 991.98px) {
  .footer-directory-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 30px;
    padding: 48px 0 40px;
  }

  .footer-directory-brand {
    padding-right: 0;
  }

  .footer-platforms-section {
    grid-column: 1 / -1;
  }

  .footer-strategy-section {
    grid-column: auto;
    display: block;
    padding-top: 4px;
  }

  .footer-strategy-list {
    grid-template-columns: 1fr;
  }

  .footer-contact-cta {
    margin-top: 18px;
  }
}

@media (max-width: 767.98px) {
  .footer-directory-grid {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 37px 0 26px;
  }

  .footer-directory-brand {
    align-items: center;
    padding: 0 5px 29px;
    text-align: center;
  }

  .footer-directory-brand .footer-brand-logo {
    width: min(100%, 245px) !important;
    object-position: center;
  }

  .footer-directory-brand > p {
    max-width: 410px;
    margin-bottom: 16px;
    font-size: .88rem;
  }

  .footer-directory-brand .footer-contact-email {
    justify-content: center;
    margin-bottom: 0;
    font-size: .82rem;
  }

  .footer-directory-brand .footer-social-row {
    display: none !important;
  }

  .footer-directory-section {
    padding: 23px 0;
    border-top: 1px solid rgba(255, 255, 255, .09);
  }

  .footer-section-title {
    min-height: 42px;
    margin-bottom: 11px;
    padding-bottom: 10px;
    font-size: 1rem;
  }

  .footer-section-icon {
    width: 35px;
    height: 35px;
    flex-basis: 35px;
  }

  .footer-service-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 5px 8px;
  }

  .footer-service-link {
    grid-template-columns: 30px minmax(0, 1fr);
    gap: 8px;
    min-height: 44px;
    padding: 6px 3px;
    font-size: .82rem;
  }

  .footer-service-icon {
    width: 30px;
    height: 30px;
  }

  .footer-link-arrow {
    display: none;
  }

  .footer-platform-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .footer-platform-link {
    grid-template-columns: 35px minmax(0, 1fr);
    gap: 8px;
    min-height: 58px;
    padding: 8px;
    border-radius: 12px;
  }

  .footer-platform-icon {
    width: 35px;
    height: 35px;
  }

  .footer-platform-copy strong {
    font-size: .75rem;
  }

  .footer-platform-copy small {
    font-size: .64rem;
  }

  .footer-platform-arrow {
    display: none;
  }

  .footer-strategy-list {
    grid-template-columns: 1fr;
  }

  .footer-contact-cta {
    min-height: 46px;
    margin-top: 13px;
  }

  .footer-bottom-directory {
    flex-direction: column;
    justify-content: center;
    gap: 7px;
    padding: 16px 0 calc(94px + env(safe-area-inset-bottom));
    font-size: .72rem;
    text-align: center;
  }

  .footer-bottom-directory > div {
    gap: 15px;
  }
}

@media (max-width: 430px) {
  .footer-service-list,
  .footer-platform-grid {
    grid-template-columns: 1fr;
  }

  .footer-platform-link {
    min-height: 55px;
  }
}


/* =========================================================
   FOOTER PREMIUM V17
   ========================================================= */
.footer-premium-v17 {
  position: relative;
  overflow: hidden;
  padding: 72px 0 0;
  color: #dbe7f7;
  background:
    radial-gradient(circle at 12% 0%, rgba(30, 136, 229, .12), transparent 32%),
    radial-gradient(circle at 88% 100%, rgba(0, 188, 212, .08), transparent 30%),
    linear-gradient(145deg, #0c1522 0%, #101b2b 55%, #0b1720 100%);
  border-top: 1px solid rgba(255,255,255,.07);
}

.footer-premium-v17::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.7), transparent 92%);
}

.footer-premium-v17 .container-wide { position: relative; z-index: 1; }

.footer-premium-grid {
  display: grid;
  grid-template-columns: minmax(230px, 1.15fr) minmax(180px, .82fr) minmax(260px, 1.12fr) minmax(210px, .9fr);
  gap: clamp(34px, 4vw, 74px);
  align-items: start;
  padding-bottom: 54px;
}

.footer-premium-logo { display: inline-flex; margin-bottom: 20px; }
.footer-premium-logo img { width: min(100%, 315px); height: auto; max-height: 74px; object-fit: contain; object-position: left center; }
.footer-premium-brand p { max-width: 330px; margin: 0 0 18px; color: #aebed2; font-size: 1rem; line-height: 1.7; }
.footer-premium-email { display: inline-block; margin-bottom: 22px; color: #b9d4ff; font-size: .98rem; text-decoration: none; overflow-wrap: anywhere; }
.footer-premium-email:hover { color: #fff; }

.footer-premium-socials { display: flex; flex-wrap: wrap; gap: 9px; }
.footer-premium-socials .footer-social-button { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 17px; box-shadow: 0 8px 20px rgba(0,0,0,.18); }

.footer-premium-section { padding-top: 4px; }
.footer-premium-section h3 { margin: 0 0 20px; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,.1); color: #fff; font-family: "Roboto", sans-serif; font-size: 1.08rem; font-weight: 500; letter-spacing: .01em; }
.footer-premium-section h3::after { content: ""; display: block; width: 38px; height: 2px; margin-top: 13px; border-radius: 999px; background: linear-gradient(90deg, #4285f4, #00c2ff); }
.footer-premium-section h3 a { color: inherit; text-decoration: none; }
.footer-premium-section h3 a:hover { color: #8ab4f8; }

.footer-premium-links { list-style: none; display: grid; gap: 12px; margin: 0; padding: 0; }
.footer-premium-links li { margin: 0; padding: 0; }
.footer-premium-links a { position: relative; display: inline-block; color: #c4d0df; font-size: .94rem; line-height: 1.45; text-decoration: none; transition: color .18s ease, transform .18s ease; }
.footer-premium-links a::after { content: ""; position: absolute; left: 0; bottom: -3px; width: 0; height: 1px; background: #6ea8fe; transition: width .2s ease; }
.footer-premium-links a:hover { color: #fff; transform: translateX(2px); }
.footer-premium-links a:hover::after { width: 100%; }

.footer-catalog-links { grid-template-columns: 1fr; gap: 11px; }
.footer-catalog-all { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; padding: 10px 14px; border: 1px solid rgba(110,168,254,.22); border-radius: 12px; background: rgba(66,133,244,.08); color: #9fc5ff; font-size: .86rem; font-weight: 500; text-decoration: none; transition: .2s ease; }
.footer-catalog-all:hover { color: #fff; border-color: rgba(110,168,254,.38); background: rgba(66,133,244,.15); }

.footer-premium-cta { display: inline-flex; align-items: center; gap: 9px; margin-top: 22px; padding: 12px 15px; border-radius: 12px; background: #159447; color: #fff; font-size: .88rem; font-weight: 500; text-decoration: none; box-shadow: 0 12px 26px rgba(21,148,71,.16); }
.footer-premium-cta:hover { background: #1aa653; color: #fff; transform: translateY(-1px); }

.footer-premium-bottom { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 72px; border-top: 1px solid rgba(255,255,255,.09); color: #8293a8; font-size: .86rem; }
.footer-premium-bottom > div { display: flex; gap: 20px; }
.footer-premium-bottom a { color: #9bacbf; text-decoration: none; }
.footer-premium-bottom a:hover { color: #fff; }

@media (max-width: 1199.98px) {
  .footer-premium-grid { grid-template-columns: 1.05fr 1fr 1fr; }
  .footer-premium-brand { grid-row: span 2; }
  .footer-premium-solutions { grid-column: 2 / 4; }
  .footer-premium-solutions .footer-premium-links { grid-template-columns: repeat(3, minmax(0,1fr)); }
}

@media (max-width: 767.98px) {
  .footer-premium-v17 { padding: 46px 0 calc(120px + env(safe-area-inset-bottom)); }
  .footer-premium-grid { grid-template-columns: 1fr; gap: 34px; padding-bottom: 34px; }
  .footer-premium-brand { grid-row: auto; text-align: center; }
  .footer-premium-logo { justify-content: center; }
  .footer-premium-logo img { width: min(86vw, 280px); object-position: center; }
  .footer-premium-brand p { max-width: 420px; margin-left: auto; margin-right: auto; font-size: .95rem; }
  .footer-premium-socials { display: none !important; }
  .footer-premium-section { padding: 0; }
  .footer-premium-section h3 { margin-bottom: 16px; font-size: 1.05rem; }
  .footer-premium-links { gap: 10px; }
  .footer-premium-links a { font-size: .94rem; }
  .footer-premium-solutions { grid-column: auto; }
  .footer-premium-solutions .footer-premium-links { grid-template-columns: 1fr; }
  .footer-premium-cta { width: 100%; justify-content: center; }
  .footer-premium-bottom { flex-direction: column; justify-content: center; min-height: auto; padding: 22px 0 8px; text-align: center; }
  .footer-premium-bottom > div { justify-content: center; flex-wrap: wrap; }
}

/* =========================================================
   FOOTER V18 · DISTRIBUCIÓN HORIZONTAL PREMIUM
   ========================================================= */
.footer-premium-v18 {
  position: relative;
  overflow: hidden;
  padding: 54px 0 24px;
  background:
    radial-gradient(circle at 10% 0%, rgba(66,133,244,.09), transparent 28%),
    linear-gradient(135deg, #101823 0%, #121b27 58%, #0e1722 100%);
  color: #eaf1fb;
  border-top: 1px solid rgba(255,255,255,.07);
}

.footer-premium-v18::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(0,194,255,.025), transparent);
}

.footer-premium-v18 .container-wide {
  position: relative;
  z-index: 1;
}

.footer-v18-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 72px);
  align-items: start;
}

.footer-v18-column {
  min-width: 0;
}

.footer-v18-column h3 {
  margin: 0 0 20px;
  color: #20d2ff;
  font-family: "Roboto", sans-serif;
  font-size: clamp(1rem, 1.15vw, 1.15rem);
  font-weight: 500;
  line-height: 1.25;
}

.footer-v18-column h3 a {
  color: inherit;
  text-decoration: none;
  transition: color .18s ease;
}

.footer-v18-column h3 a:hover {
  color: #8ab4f8;
}

.footer-v18-links {
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-v18-links li {
  margin: 0;
  padding: 0;
}

.footer-v18-links a {
  display: inline-block;
  color: #f0f4fa;
  font-size: .95rem;
  font-weight: 400;
  line-height: 1.45;
  text-decoration: none;
  transition: color .18s ease, transform .18s ease;
}

.footer-v18-links a:hover {
  color: #8ab4f8;
  transform: translateX(2px);
}

.footer-v18-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  color: #75a7ff;
  font-size: .94rem;
  font-weight: 500;
  text-decoration: none;
}

.footer-v18-more span {
  transition: transform .18s ease;
}

.footer-v18-more:hover {
  color: #a8c7fa;
}

.footer-v18-more:hover span {
  transform: translateX(3px);
}

.footer-v18-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: 46px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,.09);
  color: #9eb0c7;
  font-size: .82rem;
}

.footer-v18-bottom > div {
  display: flex;
  align-items: center;
  gap: 24px;
}

.footer-v18-bottom a {
  color: #9eb0c7;
  text-decoration: none;
}

.footer-v18-bottom a:hover {
  color: #d9e6f7;
}

/* Notebook */
@media (max-width: 1399.98px) {
  .footer-v18-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 30px;
  }
  .footer-v18-links a { font-size: .9rem; }
}

/* Tablet */
@media (max-width: 991.98px) {
  .footer-v18-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 38px 46px;
  }
  .footer-v18-column:last-child {
    grid-column: 1 / -1;
  }
}

/* Celular */
@media (max-width: 767.98px) {
  .footer-premium-v18 {
    padding: 40px 0 calc(110px + env(safe-area-inset-bottom));
  }

  .footer-v18-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px 24px;
  }

  .footer-v18-column:last-child {
    grid-column: auto;
  }

  .footer-v18-column h3 {
    margin-bottom: 15px;
    font-size: 1rem;
  }

  .footer-v18-links {
    gap: 11px;
  }

  .footer-v18-links a,
  .footer-v18-more {
    font-size: .86rem;
  }

  .footer-v18-bottom {
    flex-direction: column;
    align-items: center;
    margin-top: 36px;
    padding-top: 18px;
    text-align: center;
  }

  .footer-v18-bottom > div {
    gap: 18px;
  }
}

@media (max-width: 480px) {
  .footer-v18-grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px 18px;
  }

  .footer-v18-column h3 {
    font-size: .94rem;
  }

  .footer-v18-links a,
  .footer-v18-more {
    font-size: .81rem;
    line-height: 1.35;
  }
}


/* =========================================================
   FOOTER V19 · COLUMNAS COMPACTAS PREMIUM
   ========================================================= */
.footer-premium-v19 {
  position: relative;
  overflow: hidden;
  padding: 46px 0 20px;
  background:
    radial-gradient(circle at 12% -10%, rgba(66,133,244,.10), transparent 30%),
    radial-gradient(circle at 88% 120%, rgba(0,194,255,.05), transparent 28%),
    linear-gradient(135deg, #0d1622 0%, #111b28 52%, #0d1722 100%);
  color: #eaf1fa;
  border-top: 1px solid rgba(255,255,255,.075);
}

.footer-premium-v19::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.012) 50%, transparent 100%);
}

.footer-v19-container {
  position: relative;
  z-index: 1;
}

.footer-v19-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
  align-items: start;
}

.footer-v19-column {
  position: relative;
  min-width: 0;
  padding: 0 clamp(20px, 2.15vw, 38px);
}

.footer-v19-column:first-child { padding-left: 0; }
.footer-v19-column:last-child { padding-right: 0; }

.footer-v19-column:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 3px;
  right: 0;
  width: 1px;
  height: min(100%, 210px);
  background: linear-gradient(to bottom, rgba(255,255,255,.10), rgba(255,255,255,.025), transparent);
}

.footer-v19-heading {
  margin-bottom: 17px;
}

.footer-v19-heading h3 {
  margin: 0;
  font-family: "Roboto", sans-serif;
  font-size: clamp(1rem, 1.08vw, 1.13rem);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -.01em;
}

.footer-v19-heading h3 a {
  color: #41d8ff;
  text-decoration: none;
  transition: color .18s ease;
}

.footer-v19-heading h3 a:hover { color: #9edfff; }

.footer-v19-heading-line {
  display: block;
  width: 34px;
  height: 2px;
  margin-top: 10px;
  border-radius: 99px;
  background: linear-gradient(90deg, #4285f4, #29d3ff);
  opacity: .8;
}

.footer-v19-links {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-v19-links li { margin: 0; padding: 0; min-width: 0; }

.footer-v19-links a {
  display: inline-block;
  max-width: 100%;
  color: #d8e1ed;
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.42;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: color .18s ease, transform .18s ease;
}

.footer-v19-links a:hover {
  color: #ffffff;
  transform: translateX(2px);
}

.footer-v19-more {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: 16px;
  color: #77a9ff;
  font-size: .84rem;
  font-weight: 500;
  line-height: 1.35;
  text-decoration: none;
  transition: color .18s ease;
}

.footer-v19-more span { transition: transform .18s ease; }
.footer-v19-more:hover { color: #b6d1ff; }
.footer-v19-more:hover span { transform: translateX(3px); }

.footer-v19-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  min-height: 54px;
  margin-top: 34px;
  padding-top: 15px;
  border-top: 1px solid rgba(255,255,255,.08);
  color: #889bb2;
  font-size: .79rem;
}

.footer-v19-bottom > div {
  display: flex;
  align-items: center;
  gap: 13px;
}

.footer-v19-bottom a {
  color: #98aac0;
  text-decoration: none;
  transition: color .18s ease;
}

.footer-v19-bottom a:hover { color: #fff; }

.footer-v19-dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #52667d;
}

@media (max-width: 1399.98px) {
  .footer-v19-column { padding: 0 20px; }
  .footer-v19-column:first-child { padding-left: 0; }
  .footer-v19-column:last-child { padding-right: 0; }
  .footer-v19-links a { font-size: .86rem; }
  .footer-v19-more { font-size: .8rem; }
}

@media (max-width: 1099.98px) {
  .footer-v19-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 32px 0;
  }

  .footer-v19-column {
    padding: 0 28px 0 0;
  }

  .footer-v19-column::after { display: none; }
  .footer-v19-column:nth-child(3n+2) { padding-left: 20px; }
  .footer-v19-column:nth-child(3n+3) { padding-left: 20px; padding-right: 0; }
}

@media (max-width: 767.98px) {
  .footer-premium-v19 {
    padding: 38px 0 calc(112px + env(safe-area-inset-bottom));
  }

  .footer-v19-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 29px 20px;
  }

  .footer-v19-column,
  .footer-v19-column:nth-child(3n+2),
  .footer-v19-column:nth-child(3n+3) {
    padding: 0;
  }

  .footer-v19-column:nth-child(odd) {
    padding-right: 8px;
  }

  .footer-v19-column:nth-child(even) {
    padding-left: 8px;
  }

  .footer-v19-column:last-child {
    grid-column: 1 / -1;
    padding: 18px 0 0;
    border-top: 1px solid rgba(255,255,255,.075);
  }

  .footer-v19-heading { margin-bottom: 13px; }
  .footer-v19-heading h3 { font-size: .98rem; }
  .footer-v19-heading-line { margin-top: 8px; width: 28px; }
  .footer-v19-links { gap: 9px; }
  .footer-v19-links a { font-size: .84rem; line-height: 1.4; }
  .footer-v19-more { margin-top: 12px; font-size: .8rem; }

  .footer-v19-bottom {
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    min-height: auto;
    margin-top: 28px;
    padding-top: 16px;
    text-align: center;
  }

  .footer-v19-bottom > div { gap: 10px; }
}

@media (max-width: 420px) {
  .footer-v19-grid { gap: 26px 14px; }
  .footer-v19-column:nth-child(odd) { padding-right: 4px; }
  .footer-v19-column:nth-child(even) { padding-left: 4px; }
  .footer-v19-heading h3 { font-size: .91rem; }
  .footer-v19-links a { font-size: .79rem; }
  .footer-v19-more { font-size: .76rem; }
}


/* =========================================================
   FOOTER V20 · COLUMNA PRINCIPAL + COLUMNAS COMPACTAS
   ========================================================= */
.footer-premium-v20 {
  position: relative;
  overflow: hidden;
  padding: 54px 0 20px;
  background:
    radial-gradient(circle at 8% 0%, rgba(66,133,244,.09), transparent 31%),
    radial-gradient(circle at 94% 110%, rgba(0,194,255,.05), transparent 28%),
    linear-gradient(135deg, #0d1622 0%, #111b28 55%, #0d1722 100%);
  color: #edf4fc;
  border-top: 1px solid rgba(255,255,255,.075);
}

.footer-v20-container { position: relative; z-index: 1; }

.footer-v20-grid {
  display: grid;
  grid-template-columns: minmax(270px, 1.32fr) minmax(0, 4.68fr);
  gap: clamp(38px, 4vw, 72px);
  align-items: start;
}

.footer-v20-brand-column {
  min-width: 0;
  padding-right: clamp(26px, 3vw, 48px);
  border-right: 1px solid rgba(255,255,255,.08);
}

.footer-v20-logo-link {
  display: inline-block;
  width: min(100%, 300px);
  text-decoration: none;
}

.footer-v20-logo {
  display: block;
  width: 100%;
  max-width: 300px;
  height: auto;
  object-fit: contain;
}

.footer-v20-description {
  max-width: 315px;
  margin: 22px 0 18px;
  color: #d6e2ef;
  font-size: .97rem;
  font-weight: 400;
  line-height: 1.62;
}

.footer-v20-email {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  max-width: 100%;
  color: #9dc1ff;
  font-size: .9rem;
  font-weight: 400;
  line-height: 1.4;
  text-decoration: none;
  overflow-wrap: anywhere;
}

.footer-v20-email i { flex: 0 0 auto; font-size: 1.06rem; }
.footer-v20-email:hover { color: #fff; }

.footer-v20-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 21px;
}

.footer-v20-social {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 11px;
  color: #fff;
  font-size: .97rem;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(0,0,0,.15);
  transition: transform .18s ease, filter .18s ease;
}

.footer-v20-social:hover { color: #fff; transform: translateY(-2px); filter: brightness(1.06); }
.footer-v20-social.facebook { background: #1877f2; }
.footer-v20-social.instagram { background: linear-gradient(135deg,#ff7a18,#e1306c 55%,#833ab4); }
.footer-v20-social.linkedin { background: #0a66c2; }
.footer-v20-social.tiktok { background: #080b10; }
.footer-v20-social.x { background: #080b10; }
.footer-v20-social.youtube { background: #ff0000; }

.footer-v20-links-area {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(22px, 2.3vw, 38px);
  min-width: 0;
}

.footer-v20-column { min-width: 0; }

.footer-v20-column h3 {
  min-height: 42px;
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  font-family: "Roboto", sans-serif;
  font-size: clamp(.94rem, 1vw, 1.08rem);
  font-weight: 500;
  line-height: 1.28;
}

.footer-v20-column h3 a {
  color: #42d8ff;
  text-decoration: none;
  transition: color .18s ease;
}
.footer-v20-column h3 a:hover { color: #a2e9ff; }

.footer-v20-links {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.footer-v20-links li { margin: 0; padding: 0; min-width: 0; }

.footer-v20-links a {
  display: inline-block;
  max-width: 100%;
  color: #d5dfeb;
  font-size: .86rem;
  font-weight: 400;
  line-height: 1.42;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: color .18s ease, transform .18s ease;
}

.footer-v20-links a:hover { color: #fff; transform: translateX(2px); }

.footer-v20-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 15px;
  color: #77a9ff;
  font-size: .81rem;
  font-weight: 500;
  text-decoration: none;
}
.footer-v20-more:hover { color: #c3d8ff; }

.footer-v20-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 36px;
  padding-top: 15px;
  border-top: 1px solid rgba(255,255,255,.08);
  color: #8fa2b8;
  font-size: .78rem;
}

.footer-v20-bottom > div { display: flex; align-items: center; gap: 12px; }
.footer-v20-bottom a { color: #9badc2; text-decoration: none; }
.footer-v20-bottom a:hover { color: #fff; }
.footer-v20-dot { width: 3px; height: 3px; border-radius: 50%; background: #52667d; }

@media (max-width: 1499.98px) {
  .footer-v20-grid { grid-template-columns: minmax(245px, 1.2fr) minmax(0, 4.8fr); gap: 34px; }
  .footer-v20-brand-column { padding-right: 30px; }
  .footer-v20-links-area { gap: 24px; }
  .footer-v20-links a { font-size: .82rem; }
  .footer-v20-column h3 { font-size: .95rem; }
}

@media (max-width: 1199.98px) {
  .footer-v20-grid {
    grid-template-columns: minmax(240px, .95fr) minmax(0, 2.05fr);
    gap: 38px;
  }
  .footer-v20-links-area { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px 28px; }
  .footer-v20-column h3 { min-height: auto; }
}

@media (max-width: 899.98px) {
  .footer-v20-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-v20-brand-column {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(0, 1.2fr);
    grid-template-areas:
      "logo copy"
      "logo email"
      "social social";
    gap: 8px 30px;
    padding: 0 0 28px;
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .footer-v20-logo-link { grid-area: logo; align-self: start; }
  .footer-v20-description { grid-area: copy; max-width: 520px; margin: 4px 0 5px; }
  .footer-v20-email { grid-area: email; }
  .footer-v20-socials { grid-area: social; margin-top: 13px; }
  .footer-v20-links-area { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767.98px) {
  .footer-premium-v20 { padding: 38px 0 calc(116px + env(safe-area-inset-bottom)); }
  .footer-v20-grid { gap: 28px; }
  .footer-v20-brand-column {
    display: block;
    padding-bottom: 25px;
  }
  .footer-v20-logo-link { width: min(100%, 270px); }
  .footer-v20-logo { max-width: 270px; }
  .footer-v20-description { max-width: 350px; margin: 18px 0 15px; font-size: .91rem; }
  .footer-v20-email { font-size: .84rem; }
  .footer-v20-socials { margin-top: 18px; }
  .footer-v20-social { width: 36px; height: 36px; border-radius: 10px; }
  .footer-v20-links-area { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 20px; }
  .footer-v20-column h3 { min-height: auto; margin-bottom: 12px; padding-bottom: 8px; font-size: .95rem; }
  .footer-v20-links { gap: 8px; }
  .footer-v20-links a { font-size: .81rem; line-height: 1.38; }
  .footer-v20-more { margin-top: 11px; font-size: .77rem; }
  .footer-v20-apps { grid-column: 1 / -1; }
  .footer-v20-bottom {
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    margin-top: 27px;
    text-align: center;
  }
}

@media (max-width: 460px) {
  .footer-premium-v20 { padding-top: 34px; }
  .footer-v20-logo-link { width: min(100%, 245px); }
  .footer-v20-logo { max-width: 245px; }
  .footer-v20-links-area { gap: 25px 16px; }
  .footer-v20-column h3 { font-size: .9rem; }
  .footer-v20-links a { font-size: .77rem; }
  .footer-v20-more { font-size: .74rem; }
  .footer-v20-bottom { font-size: .72rem; }
}


/* =========================================================
   FOOTER V21 · TOTALMENTE ADMINISTRABLE
   ========================================================= */
.footer-premium-v21 {
  position: relative;
  overflow: hidden;
  padding: 52px 0 18px;
  background:
    radial-gradient(circle at 4% -10%, rgba(26,115,232,.10), transparent 30%),
    radial-gradient(circle at 100% 120%, rgba(0,188,212,.055), transparent 30%),
    linear-gradient(135deg,#0c1520 0%,#111b28 56%,#0d1722 100%);
  border-top: 1px solid rgba(255,255,255,.075);
  color:#eef5fc;
}
.footer-v21-container{position:relative;z-index:1}
.footer-v21-grid{display:grid;grid-template-columns:minmax(275px,1.28fr) minmax(0,4.72fr);gap:clamp(38px,4vw,70px);align-items:start}
.footer-v21-no-brand{grid-template-columns:1fr}
.footer-v21-brand-column{min-width:0;padding-right:clamp(26px,3vw,46px);border-right:1px solid rgba(255,255,255,.085)}
.footer-v21-logo-link{display:inline-block;width:min(100%,290px);text-decoration:none}
.footer-v21-logo{display:block;width:100%;max-width:290px;height:auto;object-fit:contain}
.footer-v21-description{max-width:320px;margin:20px 0 17px;color:#d5e1ee;font-size:.96rem;font-weight:400;line-height:1.62}
.footer-v21-email{display:inline-flex;align-items:center;gap:10px;max-width:100%;color:#9ec1ff;font-size:.88rem;font-weight:400;line-height:1.42;text-decoration:none;overflow-wrap:anywhere}
.footer-v21-email:hover{color:#fff}.footer-v21-email i{font-size:1.04rem;flex:0 0 auto}
.footer-v21-socials{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.footer-v21-social{display:grid;width:37px;height:37px;place-items:center;border-radius:10px;color:#fff;font-size:.94rem;text-decoration:none;box-shadow:0 7px 18px rgba(0,0,0,.16);transition:transform .18s ease,filter .18s ease}
.footer-v21-social:hover{color:#fff;transform:translateY(-2px);filter:brightness(1.06)}
.footer-v21-social.facebook{background:#1877f2}.footer-v21-social.instagram{background:linear-gradient(135deg,#ff7a18,#e1306c 55%,#833ab4)}.footer-v21-social.linkedin{background:#0a66c2}.footer-v21-social.tiktok,.footer-v21-social.x{background:#080b10}.footer-v21-social.youtube{background:#ff0000}
.footer-v21-links-area{display:grid;grid-template-columns:repeat(var(--footer-columns,5),minmax(0,1fr));gap:clamp(22px,2.35vw,38px);min-width:0}
.footer-v21-column{min-width:0}
.footer-v21-column h3{margin:0 0 15px;padding:0 0 10px;border-bottom:1px solid rgba(255,255,255,.09);font-family:"Roboto",sans-serif;font-size:clamp(.95rem,1vw,1.08rem);font-weight:500;line-height:1.28}
.footer-v21-column h3 a,.footer-v21-column h3 span{color:#45d7ff;text-decoration:none}.footer-v21-column h3 a:hover{color:#b3efff}
.footer-v21-links{display:grid;gap:10px;margin:0;padding:0;list-style:none}.footer-v21-links li{margin:0;padding:0;min-width:0}
.footer-v21-links a{display:inline-block;max-width:100%;color:#d8e2ec;font-size:.85rem;font-weight:400;line-height:1.43;text-decoration:none;overflow-wrap:anywhere;transition:color .18s ease,transform .18s ease}.footer-v21-links a:hover{color:#fff;transform:translateX(2px)}
.footer-v21-more{display:inline-flex;align-items:center;gap:6px;margin-top:15px;color:#79aaff;font-size:.8rem;font-weight:500;text-decoration:none}.footer-v21-more:hover{color:#cbdcff}
.footer-v21-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:34px;padding-top:15px;border-top:1px solid rgba(255,255,255,.08);color:#91a3b8;font-size:.77rem}.footer-v21-bottom>div{display:flex;align-items:center;gap:11px}.footer-v21-bottom a{color:#a5b5c8;text-decoration:none}.footer-v21-bottom a:hover{color:#fff}.footer-v21-dot{display:inline-block;width:3px;height:3px;border-radius:50%;background:#53677d}
@media(max-width:1499.98px){.footer-v21-grid{grid-template-columns:minmax(245px,1.16fr) minmax(0,4.84fr);gap:34px}.footer-v21-brand-column{padding-right:28px}.footer-v21-links-area{grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:25px}.footer-v21-links a{font-size:.82rem}.footer-v21-column h3{font-size:.96rem}}
@media(max-width:999.98px){.footer-v21-grid{grid-template-columns:1fr;gap:30px}.footer-v21-brand-column{display:grid;grid-template-columns:minmax(220px,.82fr) minmax(0,1.18fr);grid-template-areas:"logo copy" "logo email" "social social";gap:8px 30px;padding:0 0 27px;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}.footer-v21-logo-link{grid-area:logo}.footer-v21-description{grid-area:copy;max-width:520px;margin:3px 0 5px}.footer-v21-email{grid-area:email}.footer-v21-socials{grid-area:social;margin-top:12px}.footer-v21-links-area{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px}}
@media(max-width:767.98px){.footer-premium-v21{padding:38px 0 calc(116px + env(safe-area-inset-bottom))}.footer-v21-grid{gap:27px}.footer-v21-brand-column{display:block;padding-bottom:24px}.footer-v21-logo-link{width:min(100%,260px)}.footer-v21-logo{max-width:260px}.footer-v21-description{max-width:360px;margin:17px 0 14px;font-size:.9rem}.footer-v21-email{font-size:.83rem}.footer-v21-socials{display:none}.footer-v21-links-area{grid-template-columns:repeat(2,minmax(0,1fr));gap:27px 18px}.footer-v21-column h3{margin-bottom:11px;padding-bottom:8px;font-size:.94rem}.footer-v21-links{gap:8px}.footer-v21-links a{font-size:.8rem;line-height:1.38}.footer-v21-more{margin-top:11px;font-size:.76rem}.footer-v21-bottom{flex-direction:column;justify-content:center;gap:8px;margin-top:26px;text-align:center}}
@media(max-width:430px){.footer-premium-v21{padding-top:34px}.footer-v21-logo-link{width:min(100%,240px)}.footer-v21-logo{max-width:240px}.footer-v21-links-area{gap:24px 14px}.footer-v21-column h3{font-size:.88rem}.footer-v21-links a{font-size:.76rem}.footer-v21-more{font-size:.73rem}.footer-v21-bottom{font-size:.71rem}}


/* =========================================================
   V22 · HERO EDITORIAL TIPO LEONARDO — SOLO PORTADA
   ========================================================= */
.home-leonardo .main-navbar {
  background: linear-gradient(180deg, rgba(4, 9, 17, .52) 0%, rgba(4, 9, 17, .20) 70%, rgba(4, 9, 17, 0) 100%);
  border-bottom-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.home-leonardo .main-navbar:not(.compact) .nav-link {
  color: rgba(255, 255, 255, .93);
  text-shadow: 0 1px 14px rgba(0, 0, 0, .38);
}

.home-leonardo .main-navbar:not(.compact) .nav-link:hover,
.home-leonardo .main-navbar:not(.compact) .nav-link.active,
.home-leonardo .main-navbar:not(.compact) .nav-item.active > .nav-link {
  background: rgba(0, 0, 0, .28);
  color: #fff;
}

.home-leonardo .main-navbar:not(.compact) .menu-button {
  background: rgba(8, 14, 24, .34);
  border: 1px solid rgba(255, 255, 255, .12);
  box-shadow: 0 8px 28px rgba(0, 0, 0, .16);
  backdrop-filter: blur(9px);
  -webkit-backdrop-filter: blur(9px);
}

.home-leonardo .main-navbar.compact {
  background: rgba(10, 15, 24, .985);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  box-shadow: 0 5px 22px rgba(0, 0, 0, .24);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.leonardo-reference-hero {
  position: relative;
  display: block;
  min-height: clamp(760px, 92vh, 930px);
  padding: 0;
  overflow: hidden;
  background: #020509;
  color: #fff;
  isolation: isolate;
}

.leonardo-hero-media {
  position: absolute;
  z-index: 0;
  inset: 0;
  background-image: url("https://cybersecurity.leonardo.com/o/adaptive-media/image/31446390/w_596/f9cb10f02660d29b1836deda21f898e9e8daf627.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  filter: saturate(1.08) contrast(1.09) brightness(.93);
  transform: scale(1.025);
  transform-origin: center;
}

.leonardo-hero-overlay {
  position: absolute;
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(1, 5, 10, .52) 0%, rgba(2, 8, 16, .14) 28%, rgba(3, 8, 16, .18) 58%, rgba(0, 0, 0, .73) 100%),
    linear-gradient(90deg, rgba(0, 5, 12, .25) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 4, 10, .14) 100%);
}

.leonardo-hero-bottom-fade {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 190px;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.76) 70%, #000 100%);
}

.leonardo-hero-content {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  min-height: clamp(760px, 92vh, 930px);
  padding-top: calc(var(--navh) + 70px);
  padding-bottom: clamp(150px, 18vh, 205px);
}

.leonardo-hero-copy {
  width: min(1120px, 94%);
  margin: 0 auto;
  text-align: center;
  text-shadow: 0 3px 26px rgba(0, 0, 0, .56);
}

.leonardo-hero-kicker {
  display: inline-block;
  margin-bottom: 20px;
  color: rgba(255, 255, 255, .82);
  font-size: .78rem;
  font-weight: 500;
  letter-spacing: .19em;
  text-transform: uppercase;
}

.leonardo-reference-hero h1 {
  max-width: none;
  margin: 0;
  color: #fff;
  font-family: "Roboto", sans-serif;
  font-size: clamp(4rem, 7vw, 7.25rem);
  font-weight: 300;
  line-height: .98;
  letter-spacing: .015em;
  text-transform: uppercase;
}

.leonardo-reference-hero p {
  max-width: 920px;
  margin: 34px auto 0;
  color: rgba(255, 255, 255, .95);
  font-size: clamp(1.25rem, 1.8vw, 1.72rem);
  font-weight: 300;
  line-height: 1.45;
  letter-spacing: .002em;
}

.leonardo-hero-scroll {
  position: absolute;
  z-index: 4;
  left: 50%;
  bottom: 56px;
  display: grid;
  justify-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, .66);
  font-size: .67rem;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  transform: translateX(-50%);
}

.leonardo-hero-scroll i {
  display: block;
  width: 1px;
  height: 34px;
  background: linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,0));
}

@media (max-width: 991.98px) {
  .leonardo-reference-hero,
  .leonardo-hero-content {
    min-height: 820px;
  }

  .leonardo-hero-media {
    background-position: 60% center;
  }

  .leonardo-hero-content {
    padding-bottom: 145px;
  }

  .leonardo-reference-hero h1 {
    font-size: clamp(3.45rem, 10vw, 5.6rem);
  }

  .leonardo-reference-hero p {
    max-width: 720px;
    font-size: 1.18rem;
  }
}

@media (max-width: 680px) {
  .home-leonardo .main-navbar:not(.compact) {
    background: linear-gradient(180deg, rgba(3, 8, 15, .68), rgba(3, 8, 15, .16) 82%, transparent);
  }

  .leonardo-reference-hero,
  .leonardo-hero-content {
    min-height: 760px;
  }

  .leonardo-hero-media {
    background-position: 67% center;
    transform: scale(1.04);
  }

  .leonardo-hero-overlay {
    background:
      linear-gradient(180deg, rgba(1,5,10,.55) 0%, rgba(2,8,16,.16) 24%, rgba(1,5,11,.28) 52%, rgba(0,0,0,.82) 100%),
      linear-gradient(90deg, rgba(0,0,0,.22), rgba(0,0,0,0));
  }

  .leonardo-hero-content {
    align-items: flex-end;
    padding-top: 100px;
    padding-bottom: 138px;
  }

  .leonardo-hero-copy {
    width: 100%;
  }

  .leonardo-hero-kicker {
    margin-bottom: 15px;
    font-size: .65rem;
    letter-spacing: .15em;
  }

  .leonardo-reference-hero h1 {
    font-size: clamp(2.7rem, 13vw, 4.15rem);
    line-height: 1.01;
    letter-spacing: -.01em;
  }

  .leonardo-reference-hero p {
    max-width: 94%;
    margin-top: 22px;
    font-size: 1rem;
    line-height: 1.5;
  }

  .leonardo-hero-scroll {
    bottom: 42px;
  }

  .leonardo-hero-bottom-fade {
    height: 165px;
  }
}

/* =========================================================
   V23 · HERO CARRUSEL CINEMÁTICO + NAVBAR DEGRADADO
   ========================================================= */
.home-leonardo .main-navbar:not(.compact){
  background:
    linear-gradient(90deg,
      rgba(0,0,0,.96) 0%,
      rgba(2,7,14,.76) 10%,
      rgba(2,7,14,.32) 30%,
      rgba(2,7,14,.18) 50%,
      rgba(2,7,14,.32) 70%,
      rgba(2,7,14,.76) 90%,
      rgba(0,0,0,.96) 100%),
    linear-gradient(180deg,rgba(0,0,0,.48),rgba(0,0,0,.10) 75%,transparent);
  border-bottom:1px solid rgba(255,255,255,.035);
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.home-leonardo .main-navbar.compact{
  background:linear-gradient(90deg,#05080e 0%,#0b111c 18%,#0b111c 82%,#05080e 100%);
}

.hero-v23{position:relative;display:block;min-height:clamp(720px,90vh,900px);padding:0;overflow:hidden;background:#020407;color:#fff}
.hero-v23-carousel,.hero-v23-carousel .carousel-inner,.hero-v23-slide{min-height:clamp(720px,90vh,900px)}
.hero-v23-slide{position:relative;overflow:hidden;background:#020407}
.hero-v23-media{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center center;background-repeat:no-repeat;transform:scale(1.012);filter:saturate(1.06) contrast(1.06) brightness(.98)}
.hero-v23-shade{position:absolute;inset:0;z-index:1;background:
  linear-gradient(90deg,rgba(0,0,0,.96) 0%,rgba(0,5,13,.91) 24%,rgba(0,5,13,.70) 39%,rgba(0,5,13,.28) 55%,rgba(0,0,0,.04) 76%),
  linear-gradient(180deg,rgba(0,0,0,.24) 0%,rgba(0,0,0,.05) 48%,rgba(0,0,0,.62) 100%)}
.hero-v23-content{position:relative;z-index:3;display:flex;align-items:center;min-height:clamp(720px,90vh,900px);padding-top:calc(var(--navh) + 38px);padding-bottom:88px}
.hero-v23-copy{width:min(680px,46vw);padding:12px 0;text-align:left;text-shadow:0 4px 28px rgba(0,0,0,.72)}
.hero-v23-kicker{display:inline-flex;margin-bottom:18px;color:#fff;font-size:clamp(.7rem,.8vw,.86rem);font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.hero-v23-copy h1{margin:0;max-width:680px;color:#fff;font-family:"Roboto",sans-serif;font-size:clamp(2.85rem,4.4vw,5.55rem);font-weight:500;line-height:.96;letter-spacing:-.035em;text-transform:uppercase}
.hero-v23-copy h1 span{display:block}
.hero-v23-subtitle{max-width:600px;margin:20px 0 0;color:rgba(255,255,255,.91);font-size:clamp(1rem,1.25vw,1.28rem);font-weight:400;line-height:1.45;text-transform:uppercase;letter-spacing:.025em}
.hero-v23-features{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;max-width:650px}
.hero-v23-features span{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.82);font-size:.8rem;font-weight:400;white-space:nowrap}
.hero-v23-features i{color:#4ea1ff;font-size:.88rem}
.hero-v23-tagline{margin:25px 0 0;color:rgba(255,255,255,.76);font-size:.82rem;font-weight:400;letter-spacing:.055em;text-transform:uppercase}
.hero-v23-tagline strong{color:#38a0ff;font-weight:500}
.hero-accent-blue{color:#2487ff!important}.hero-accent-cyan{color:#18baf2!important}.hero-accent-red{color:#ff334f!important}.hero-accent-purple{color:#9a63ff!important}

.hero-v23-arrow{top:auto;bottom:44px;width:44px;height:44px;border:1px solid rgba(255,255,255,.16);border-radius:4px;background:rgba(5,10,18,.48);color:#fff;opacity:1;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .2s ease,border-color .2s ease,transform .2s ease}
.hero-v23-arrow:hover{background:rgba(22,108,230,.78);border-color:rgba(100,167,255,.7);transform:translateY(-2px)}
.hero-v23-arrow span{font-size:22px}
.hero-v23-arrow-prev{left:auto;right:calc(5.5% + 52px)}
.hero-v23-arrow-next{right:5.5%}
.hero-v23-indicators{left:5.5%;right:auto;bottom:55px;margin:0;gap:8px;justify-content:flex-start}
.hero-v23-indicators [data-bs-target]{width:30px;height:2px;margin:0;border:0;border-radius:0;background:rgba(255,255,255,.34);opacity:1}
.hero-v23-indicators .active{background:#2c89ff}

@media(max-width:991.98px){
  .hero-v23,.hero-v23-carousel,.hero-v23-carousel .carousel-inner,.hero-v23-slide,.hero-v23-content{min-height:780px}
  .hero-v23-media{background-position:58% center}
  .hero-v23-shade{background:linear-gradient(90deg,rgba(0,0,0,.95) 0%,rgba(1,7,15,.86) 38%,rgba(1,7,15,.42) 66%,rgba(0,0,0,.08) 100%),linear-gradient(180deg,rgba(0,0,0,.24),rgba(0,0,0,.62))}
  .hero-v23-copy{width:min(620px,67vw)}
}
@media(max-width:680px){
  .home-leonardo .main-navbar:not(.compact){background:linear-gradient(90deg,rgba(0,0,0,.97),rgba(5,11,20,.80) 50%,rgba(0,0,0,.97))}
  .hero-v23,.hero-v23-carousel,.hero-v23-carousel .carousel-inner,.hero-v23-slide,.hero-v23-content{min-height:740px}
  .hero-v23-media{background-position:67% center;transform:scale(1.02)}
  .hero-v23-shade{background:linear-gradient(90deg,rgba(0,0,0,.96) 0%,rgba(0,4,12,.91) 54%,rgba(0,4,12,.42) 86%,rgba(0,0,0,.14) 100%),linear-gradient(180deg,rgba(0,0,0,.24),rgba(0,0,0,.72))}
  .hero-v23-content{align-items:flex-end;padding-top:110px;padding-bottom:122px}
  .hero-v23-copy{width:100%;max-width:100%;padding-right:8px}
  .hero-v23-kicker{margin-bottom:13px;font-size:.62rem;letter-spacing:.13em}
  .hero-v23-copy h1{max-width:94%;font-size:clamp(2.45rem,12vw,3.65rem);line-height:.98}
  .hero-v23-subtitle{max-width:94%;margin-top:16px;font-size:.91rem;line-height:1.42}
  .hero-v23-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 12px;margin-top:19px;max-width:94%}
  .hero-v23-features span{font-size:.68rem;white-space:normal}
  .hero-v23-tagline{max-width:94%;margin-top:19px;font-size:.68rem;line-height:1.4}
  .hero-v23-arrow{bottom:35px;width:40px;height:40px}
  .hero-v23-arrow-prev{right:66px}.hero-v23-arrow-next{right:18px}
  .hero-v23-indicators{left:18px;bottom:47px}
  .hero-v23-indicators [data-bs-target]{width:20px}
}


/* =========================================================
   V26 · REFINAMIENTO CIBER IA PREMIUM
   Sección blanca de confianza, footer oscuro IA y heroes internos.
   ========================================================= */

/* --- Sección blanca: “Una presencia digital diseñada para generar confianza” --- */
.service-overview {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(67, 139, 255, .05), transparent 20%),
    radial-gradient(circle at 92% 18%, rgba(0, 194, 255, .045), transparent 22%),
    linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
}

.service-overview::before,
.service-overview::after {
  content: "";
  position: absolute;
  pointer-events: none;
  opacity: .55;
}

.service-overview::before {
  inset: 0;
  background-image:
    linear-gradient(rgba(18, 76, 160, .032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 76, 160, .032) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, transparent 0, rgba(0,0,0,.75) 14%, rgba(0,0,0,.75) 82%, transparent 100%);
}

.service-overview::after {
  width: 460px;
  height: 460px;
  right: -140px;
  bottom: -210px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(42, 120, 255, .075) 0%, rgba(0, 194, 255, .045) 34%, transparent 72%);
  filter: blur(10px);
}

.service-overview .section-head-split {
  position: relative;
  gap: clamp(26px, 4vw, 70px);
  margin-bottom: 38px;
}

.service-overview .section-head h2,
.service-overview .section-head-split h2 {
  max-width: 760px;
  letter-spacing: -.048em;
}

.service-overview .section-head p,
.service-overview .section-head-split p {
  max-width: 560px;
  font-size: 1.06rem;
  line-height: 1.72;
}

.value-ribbon {
  position: relative;
  z-index: 8;
}

.ribbon-grid {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(193, 205, 223, .72);
  background:
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(250,252,255,.98) 100%);
  box-shadow: 0 22px 62px rgba(16, 38, 77, .14);
}

.ribbon-grid::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(66,133,244,.06), transparent 24%, transparent 76%, rgba(0,194,255,.05));
  mix-blend-mode: screen;
}

.ribbon-item {
  position: relative;
  min-height: 104px;
  transition: background .2s ease, transform .2s ease;
}

.ribbon-item:hover {
  background: rgba(248, 251, 255, .92);
}

.ribbon-item::after {
  content: "";
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(53, 103, 183, .16) 18%, rgba(53, 103, 183, .16) 82%, transparent 100%);
  opacity: 0;
  transition: opacity .2s ease;
}

.ribbon-item:hover::after {
  opacity: 1;
}

.ribbon-icon {
  position: relative;
  box-shadow: 0 12px 28px rgba(56, 91, 150, .10), inset 0 1px 0 rgba(255,255,255,.7);
}

.ribbon-icon::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 11px;
  border: 1px solid rgba(255,255,255,.55);
}

.services-grid-premium,
.services-grid.desktop-service-grid {
  gap: 24px;
}

.service-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(223, 230, 241, .95);
  border-radius: 26px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.985) 0%, rgba(251,253,255,.985) 100%);
  box-shadow: 0 18px 48px rgba(17, 35, 74, .10);
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  isolation: isolate;
}

.service-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 22px 58px rgba(17, 35, 74, .14);
  border-color: rgba(188, 202, 223, .98);
}

.service-card::before {
  width: 210px;
  height: 210px;
  right: -72px;
  top: -72px;
  opacity: .9;
  background:
    radial-gradient(circle at center, rgba(255,255,255,.84) 0%, color-mix(in srgb, var(--soft-color,#e8f0fe) 88%, #ffffff) 54%, color-mix(in srgb, var(--soft-color,#e8f0fe) 100%, #ffffff) 100%);
}

.service-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(125deg, rgba(255,255,255,.0) 0%, rgba(255,255,255,.0) 62%, rgba(255,255,255,.44) 100%),
    linear-gradient(rgba(16, 88, 196, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16, 88, 196, .025) 1px, transparent 1px);
  background-size: auto, 26px 26px, 26px 26px;
  mask-image: linear-gradient(to bottom right, rgba(0,0,0,.08), rgba(0,0,0,.98));
}

.service-icon {
  width: 60px;
  height: 60px;
  border-radius: 19px;
  box-shadow: 0 16px 34px color-mix(in srgb, var(--accent,#4285f4) 26%, transparent);
}

.service-icon::after {
  content: "";
  position: absolute;
  inset: 7px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.35);
}

.service-tag {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 22px;
  letter-spacing: .12em;
}

.service-tag::before {
  content: "";
  width: 20px;
  height: 1px;
  background: color-mix(in srgb, var(--accent,#4285f4) 50%, #ffffff);
}

.service-card h3 {
  max-width: 270px;
  font-size: 1.46rem;
  letter-spacing: -.03em;
}

.service-card p {
  position: relative;
  z-index: 1;
  max-width: 320px;
  line-height: 1.72;
}

.service-card a {
  z-index: 2;
  font-size: .95rem;
}

.service-card a .material-symbols-rounded {
  transition: transform .2s ease;
}

.service-card:hover a .material-symbols-rounded {
  transform: translateX(2px);
}

@media (max-width: 767.98px) {
  .service-overview .section-head-split {
    margin-bottom: 26px;
  }

  .ribbon-grid {
    box-shadow: 0 14px 36px rgba(18, 38, 73, .11);
  }

  .ribbon-item {
    min-height: 78px;
  }

  .service-card {
    border-radius: 22px;
  }

  .service-card h3 {
    max-width: none;
    font-size: 1.36rem;
  }

  .service-card p {
    max-width: none;
    font-size: .95rem;
  }
}

/* --- Hero interno de landings: panel tecnológico IA manteniendo los colores base --- */
.page-hero {
  overflow: hidden;
}

.page-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  top: 28px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.11) 0%, rgba(255,255,255,.02) 48%, transparent 70%);
  filter: blur(8px);
  pointer-events: none;
}

.hero-icon-panel {
  position: relative;
  height: 398px;
  border-radius: 36px;
  border: 1px solid rgba(255,255,255,.22);
  background:
    radial-gradient(circle at 16% 18%, rgba(255,255,255,.16), transparent 18%),
    radial-gradient(circle at 82% 80%, rgba(255,255,255,.14), transparent 16%),
    linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.06));
  box-shadow: 0 30px 80px rgba(4, 23, 65, .24), inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  isolation: isolate;
}

.hero-icon-panel::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.08), transparent 52%);
  background-size: 34px 34px, 34px 34px, 100% 100%;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}

.hero-icon-panel::after {
  content: "";
  position: absolute;
  inset: 54px 70px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.18);
  background:
    linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.03)),
    radial-gradient(circle at 50% 50%, rgba(132, 196, 255, .18) 0%, transparent 64%);
  box-shadow: inset 0 0 28px rgba(255,255,255,.05), 0 18px 40px rgba(9, 24, 61, .20);
}

.hero-icon-panel > .material-symbols-rounded {
  position: relative;
  z-index: 2;
  font-size: 132px;
  color: rgba(255,255,255,.96);
  text-shadow: 0 14px 34px rgba(5, 20, 57, .28);
}

.hero-icon-panel i {
  z-index: 3;
  width: 78px;
  height: 78px;
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(240,246,255,.92));
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: 0 18px 44px rgba(6, 24, 58, .22);
}

.hero-icon-panel i::before,
.hero-icon-panel i::after {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  border-radius: 999px;
  background: rgba(52, 94, 170, .20);
}

.hero-icon-panel i::before {
  top: 24px;
  height: 8px;
}

.hero-icon-panel i::after {
  top: 40px;
  height: 8px;
  right: 24px;
}

.page-blue .hero-icon-panel > .material-symbols-rounded,
.page-purple .hero-icon-panel > .material-symbols-rounded,
.page-red .hero-icon-panel > .material-symbols-rounded,
.page-orange .hero-icon-panel > .material-symbols-rounded,
.page-green .hero-icon-panel > .material-symbols-rounded,
.page-teal .hero-icon-panel > .material-symbols-rounded {
  color: rgba(255,255,255,.98);
}

@media (max-width: 991.98px) {
  .hero-icon-panel {
    height: 330px;
    max-width: 560px;
  }

  .hero-icon-panel::after {
    inset: 42px 54px;
  }
}

@media (max-width: 680px) {
  .hero-icon-panel {
    height: 270px;
    border-radius: 28px;
  }

  .hero-icon-panel::before {
    inset: 14px;
    border-radius: 22px;
    background-size: 26px 26px, 26px 26px, 100% 100%;
  }

  .hero-icon-panel::after {
    inset: 36px 38px;
    border-radius: 18px;
  }

  .hero-icon-panel > .material-symbols-rounded {
    font-size: 96px;
  }

  .hero-icon-panel i {
    width: 58px;
    height: 58px;
    border-radius: 18px;
  }

  .hero-icon-panel i::before {
    top: 18px;
    left: 12px;
    right: 12px;
  }

  .hero-icon-panel i::after {
    top: 31px;
    left: 12px;
    right: 20px;
  }
}

/* --- Footer oscuro con motivos visuales de ciberseguridad / IA --- */
.footer-premium-v21 {
  position: relative;
  overflow: hidden;
  padding: 56px 0 24px;
  color: #e9f2ff;
  background:
    radial-gradient(circle at 86% 14%, rgba(0, 140, 255, .15), transparent 18%),
    radial-gradient(circle at 72% 74%, rgba(255, 51, 102, .10), transparent 20%),
    radial-gradient(circle at 20% 6%, rgba(0, 194, 255, .08), transparent 18%),
    linear-gradient(135deg, #07111d 0%, #091728 28%, #0b1321 62%, #0a1625 100%);
  border-top: 1px solid rgba(255,255,255,.08);
}

.footer-premium-v21::before,
.footer-premium-v21::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.footer-premium-v21::before {
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, transparent 0%, rgba(53,123,255,.10) 50%, transparent 100%);
  background-size: 42px 42px, 42px 42px, 100% 100%;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.75), rgba(0,0,0,.95));
}

.footer-premium-v21::after {
  background:
    linear-gradient(90deg, transparent 0, rgba(110,190,255,.08) 20%, transparent 34%),
    linear-gradient(180deg, transparent 0, rgba(255,255,255,.03) 22%, transparent 36%),
    radial-gradient(circle at 84% 30%, rgba(255,255,255,.06) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 35%, rgba(255,255,255,.06) 0 2px, transparent 3px),
    radial-gradient(circle at 76% 40%, rgba(255,255,255,.06) 0 2px, transparent 3px),
    radial-gradient(circle at 72% 45%, rgba(255,255,255,.06) 0 2px, transparent 3px);
  opacity: .85;
}

.footer-v21-container {
  position: relative;
  z-index: 1;
}

.footer-v21-grid {
  gap: clamp(38px, 4vw, 76px);
}

.footer-v21-brand-column {
  padding-right: clamp(24px, 3vw, 42px);
  border-right: 1px solid rgba(255,255,255,.10);
}

.footer-v21-description {
  color: #d7e5f2;
  line-height: 1.74;
}

.footer-v21-email {
  color: #a7c9ff;
  font-size: .92rem;
}

.footer-v21-email:hover {
  color: #ffffff;
}

.footer-v21-socials {
  gap: 10px;
}

.footer-v21-social {
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
}

.footer-v21-links-area {
  gap: clamp(24px, 2.6vw, 42px);
}

.footer-v21-column h3 {
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.11);
}

.footer-v21-column h3 a,
.footer-v21-column h3 span {
  color: #44ddff;
}

.footer-v21-column h3 a:hover {
  color: #b4f1ff;
}

.footer-v21-links a {
  color: #e4edf8;
  font-size: .89rem;
  line-height: 1.52;
}

.footer-v21-links a:hover {
  color: #ffffff;
}

.footer-v21-more {
  color: #8fc0ff;
  font-size: .82rem;
}

.footer-v21-more:hover {
  color: #d8e8ff;
}

.footer-v21-bottom {
  margin-top: 40px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.11);
  color: #98adbf;
}

.footer-v21-bottom a {
  color: #bfd0df;
}

.footer-v21-bottom a:hover {
  color: #ffffff;
}

@media (max-width: 999.98px) {
  .footer-v21-brand-column {
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.10);
  }
}

@media (max-width: 767.98px) {
  .footer-premium-v21 {
    padding-top: 40px;
  }

  .footer-v21-description {
    line-height: 1.66;
  }

  .footer-v21-links a {
    font-size: .82rem;
  }
}


/* =========================================================
   V27 · AJUSTES FINALES CIBER IA PREMIUM
   Fondo enlazado al hero, barra premium, catálogo refinado,
   footer con estética IA y hero internos más tecnológicos.
   ========================================================= */
body.home-leonardo {
  background:
    linear-gradient(180deg,
      #081019 0,
      #09111d 510px,
      #edf1f6 510px,
      #f2f5f9 760px,
      #fafbfd 1080px,
      #ffffff 100%);
}

.service-overview {
  margin-top: -86px;
  padding-top: 158px;
  background:
    radial-gradient(circle at 12% 14%, rgba(71, 131, 255, .08), transparent 20%),
    radial-gradient(circle at 88% 22%, rgba(0, 194, 255, .06), transparent 22%),
    linear-gradient(180deg, #edf1f6 0%, #f4f6fa 22%, #fbfcfe 58%, #ffffff 100%);
}

.service-overview::before {
  background-image:
    linear-gradient(rgba(29, 73, 151, .028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29, 73, 151, .028) 1px, transparent 1px),
    linear-gradient(135deg, rgba(255,255,255,.40), transparent 48%);
  background-size: 46px 46px, 46px 46px, 100% 100%;
}

.service-overview .container-wide,
.platforms-home-section .container-wide,
.site-footer.footer-premium-v21 .container-wide {
  position: relative;
  z-index: 2;
}

.value-ribbon {
  margin-top: -36px;
  padding-bottom: 8px;
}

.ribbon-grid {
  position: relative;
  border: 1px solid rgba(196, 209, 228, .82);
  border-radius: 30px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(249,251,255,.98) 100%);
  box-shadow:
    0 26px 64px rgba(11, 31, 71, .16),
    inset 0 1px 0 rgba(255,255,255,.75);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.ribbon-grid::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 15% 15%, rgba(61,125,255,.10), transparent 18%),
    radial-gradient(circle at 84% 80%, rgba(255,66,118,.08), transparent 18%),
    linear-gradient(rgba(27, 95, 196, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(27, 95, 196, .022) 1px, transparent 1px);
  background-size: auto, auto, 28px 28px, 28px 28px;
  border-radius: inherit;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.95), rgba(0,0,0,.82));
}

.ribbon-item {
  min-height: 110px;
  padding: 24px 26px;
}

.ribbon-item > div { position: relative; z-index: 1; }
.ribbon-item h3 { font-size: 1.03rem; letter-spacing: -.02em; }
.ribbon-item p { font-size: .89rem; color: #5f6d85; }

.ribbon-icon {
  width: 52px;
  height: 52px;
  border-radius: 17px;
  background: linear-gradient(145deg, rgba(237,244,255,.98), rgba(220,236,255,.92));
  border: 1px solid rgba(196, 215, 241, .92);
  box-shadow: 0 14px 34px rgba(30, 71, 146, .12);
}

.ribbon-item:nth-child(2) .ribbon-icon { background: linear-gradient(145deg, rgba(235,249,240,.98), rgba(223,244,231,.94)); color: #239862; }
.ribbon-item:nth-child(3) .ribbon-icon { background: linear-gradient(145deg, rgba(255,246,225,.98), rgba(255,238,199,.94)); color: #c38100; }
.ribbon-item:nth-child(4) .ribbon-icon { background: linear-gradient(145deg, rgba(255,238,240,.98), rgba(253,223,228,.94)); color: #df465d; }

.services-grid-premium,
.services-grid.desktop-service-grid {
  gap: 26px;
}

.service-card {
  min-height: 335px;
  padding: 28px 28px 26px;
  box-shadow: 0 20px 56px rgba(15, 30, 66, .10);
}

.service-card::after {
  background:
    linear-gradient(125deg, rgba(255,255,255,.0) 0%, rgba(255,255,255,.0) 62%, rgba(255,255,255,.46) 100%),
    radial-gradient(circle at 16% 80%, color-mix(in srgb, var(--accent,#4285f4) 18%, transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 26% 72%, color-mix(in srgb, var(--accent,#4285f4) 15%, transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 36% 64%, color-mix(in srgb, var(--accent,#4285f4) 12%, transparent) 0 2px, transparent 3px),
    linear-gradient(rgba(16, 88, 196, .020) 1px, transparent 1px),
    linear-gradient(90deg, rgba(16, 88, 196, .020) 1px, transparent 1px);
  background-size: auto, auto, auto, auto, 22px 22px, 22px 22px;
}

.service-card h3 {
  max-width: 290px;
  margin: 18px 0 12px;
}

.service-card p {
  max-width: 340px;
  margin-bottom: 18px;
}

.service-card a {
  position: static;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-top: auto;
  font-size: .94rem;
  font-weight: 500;
}

.platforms-home-section {
  position: relative;
  overflow: hidden;
  padding-top: 88px;
  background:
    radial-gradient(circle at 14% 16%, rgba(66, 133, 244, .09), transparent 20%),
    radial-gradient(circle at 86% 20%, rgba(0, 194, 255, .06), transparent 20%),
    linear-gradient(180deg, #eff2f6 0%, #f3f6fa 20%, #fafbfd 56%, #ffffff 100%);
}

.platforms-home-section::before,
.platforms-home-section::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.platforms-home-section::before {
  background-image:
    linear-gradient(rgba(20, 78, 169, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(20, 78, 169, .025) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.7), rgba(0,0,0,.28) 76%, transparent 100%);
}

.platforms-home-section::after {
  background:
    radial-gradient(circle at 24% 38%, rgba(255,255,255,.66), transparent 18%),
    radial-gradient(circle at 74% 18%, rgba(255,255,255,.45), transparent 14%);
}

.platforms-catalog-preview .platform-title-row {
  grid-template-columns: 1fr;
  gap: 18px;
  margin-bottom: 26px;
}

.platforms-catalog-preview .platform-title-copy {
  max-width: 980px;
}

.platforms-catalog-preview .platform-title-copy h2 {
  max-width: 780px;
}

.platforms-catalog-preview .platform-title-copy p {
  max-width: 820px;
  color: #5f6d84;
  font-size: 1.04rem;
}

.platforms-catalog-preview .platforms-main-button {
  display: none !important;
}

.platforms-catalog-preview .premium-platform-shell {
  border: 1px solid rgba(205, 217, 233, .86);
  border-radius: 34px;
  padding: 22px 22px 18px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.72) 0%, rgba(255,255,255,.96) 100%);
  box-shadow:
    0 24px 62px rgba(16, 35, 74, .12),
    inset 0 1px 0 rgba(255,255,255,.82);
}

.platforms-catalog-preview .premium-platform-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    linear-gradient(125deg, rgba(255,255,255,.58), transparent 34%),
    linear-gradient(rgba(21, 87, 184, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21, 87, 184, .018) 1px, transparent 1px);
  background-size: auto, 20px 20px, 20px 20px;
}

.platforms-catalog-preview .platform-viewport {
  padding: 8px 3px 14px;
}

.platforms-catalog-preview .platform-track {
  grid-auto-columns: calc((100% - 72px) / 4);
  gap: 24px;
}

.platforms-catalog-preview .platform-card {
  min-height: 500px;
  border: 1px solid rgba(216, 226, 239, .96);
  border-radius: 28px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(250,252,255,.98) 100%);
  box-shadow: 0 20px 54px rgba(18, 35, 74, .10);
}

.platforms-catalog-preview .platform-card:hover {
  transform: translateY(-6px);
  border-color: rgba(190, 204, 227, .98);
  box-shadow: 0 28px 68px rgba(18, 35, 74, .14);
}

.platform-catalog-image {
  position: relative;
  aspect-ratio: 16 / 10;
  border-bottom: 1px solid rgba(219, 228, 239, .90);
}

.platform-catalog-image::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 24%, rgba(7, 14, 28, .0) 72%, rgba(7, 14, 28, .12) 100%),
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: auto, 26px 26px, 26px 26px;
}

.platform-card-with-image .platform-body {
  min-height: 246px;
  padding: 22px 22px 21px;
}

.platform-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.platform-card-with-image .platform-category,
.platform-category {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
  background: linear-gradient(180deg, #edf3fb, #e8eef8);
  border: 1px solid rgba(215, 226, 241, .94);
  color: #6d7b92;
  font-size: .79rem;
  font-weight: 500;
}

.platform-mini-icon {
  display: inline-grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(231,240,255,.98), rgba(243,247,255,.95));
  border: 1px solid rgba(208, 221, 241, .96);
  color: #1f73e8;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
}

.platform-mini-icon .material-symbols-rounded {
  font-size: 18px;
}

.platform-card-with-image .platform-body h3 {
  margin: 16px 0 10px;
  font-size: 1.22rem;
  line-height: 1.22;
  letter-spacing: -.028em;
  color: #1c2940;
}

.platform-card-with-image .platform-body p {
  min-height: 82px;
  margin-bottom: 18px;
  color: #65728a;
  font-size: .92rem;
  line-height: 1.68;
  -webkit-line-clamp: 4;
}

.platform-card-with-image .platform-actions {
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: 10px;
}

.platform-card-with-image .platform-actions a {
  min-height: 44px;
  padding: 0 14px;
  border-radius: 14px;
  font-size: .83rem;
  font-weight: 500;
  border: 1px solid transparent;
  box-shadow: 0 10px 22px rgba(18, 35, 74, .08);
}

.platform-card-with-image .platform-actions .platform-quote {
  background: linear-gradient(135deg, #1f7af2, #2e8dff);
  color: #fff;
}

.platform-card-with-image .platform-actions .platform-info {
  background: linear-gradient(180deg, #f3f6fb, #edf2f8);
  border-color: rgba(220, 228, 240, .96);
  color: #4b5b74;
}

.platform-card-with-image .platform-actions .platform-info:hover {
  background: #ffffff;
  color: #154388;
}

.platforms-catalog-preview .platform-carousel-footer {
  margin-top: 16px;
  gap: 18px;
}

.platform-carousel-help {
  color: #6c7990;
  font-size: .83rem;
}

.platforms-catalog-preview .platform-carousel-nav button {
  width: 48px;
  height: 48px;
  border: 1px solid rgba(211, 222, 237, .94);
  border-radius: 16px;
  background: linear-gradient(180deg, #ffffff, #eef3fa);
  color: #185cc0;
  box-shadow: 0 12px 28px rgba(16, 40, 83, .10);
}

.platforms-catalog-preview .platform-carousel-nav button:hover {
  background: linear-gradient(180deg, #ffffff, #f7fbff);
  color: #114a9d;
}

.platform-mobile-cta {
  display: flex !important;
  justify-content: center;
  margin-top: 30px;
}

.platform-mobile-cta .btn-material {
  min-width: 280px;
  min-height: 52px;
  padding-inline: 28px;
  border-radius: 999px;
  box-shadow: 0 16px 34px rgba(31, 82, 167, .18);
}

.page-hero {
  background-size: cover;
}

.page-hero::before {
  background:
    radial-gradient(circle at 82% 10%, rgba(255,255,255,.20), transparent 28%),
    radial-gradient(circle at 20% 90%, rgba(255,255,255,.10), transparent 30%),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: auto, auto, 36px 36px, 36px 36px;
}

.page-hero::after {
  right: -80px;
  top: 10px;
  width: 470px;
  height: 470px;
  background: radial-gradient(circle, rgba(255,255,255,.12) 0%, rgba(255,255,255,.03) 42%, transparent 72%);
}

.hero-icon-panel {
  box-shadow: 0 34px 82px rgba(5, 23, 65, .28), inset 0 1px 0 rgba(255,255,255,.22);
}

.hero-icon-panel::before {
  background:
    linear-gradient(rgba(255,255,255,.065) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.065) 1px, transparent 1px),
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.15), transparent 16%),
    radial-gradient(circle at 84% 76%, rgba(255,255,255,.12), transparent 18%),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.07), transparent 52%);
  background-size: 32px 32px, 32px 32px, auto, auto, 100% 100%;
}

.hero-icon-panel::after {
  background:
    linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.03)),
    radial-gradient(circle at 50% 50%, rgba(132, 196, 255, .22) 0%, transparent 64%);
}

.hero-icon-panel > .material-symbols-rounded {
  filter: drop-shadow(0 16px 34px rgba(7, 18, 58, .28));
}

.hero-icon-panel i {
  background: linear-gradient(145deg, rgba(255,255,255,.98), rgba(237,243,255,.93));
}

.hero-icon-panel i:nth-child(2) {
  left: 28px;
  top: 34px;
}

.hero-icon-panel i:nth-child(3) {
  right: 32px;
  bottom: 28px;
}

.footer-premium-v21 {
  padding: 62px 0 24px;
  background:
    radial-gradient(circle at 12% 0%, rgba(0, 163, 255, .14), transparent 22%),
    radial-gradient(circle at 88% 14%, rgba(35, 93, 255, .16), transparent 22%),
    radial-gradient(circle at 76% 76%, rgba(255, 62, 98, .12), transparent 18%),
    linear-gradient(135deg, #06101c 0%, #081628 24%, #0a1430 56%, #091425 100%);
}

.footer-premium-v21::before {
  background-image:
    linear-gradient(rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(90deg, transparent 0%, rgba(0,194,255,.10) 38%, transparent 54%, rgba(65,118,255,.08) 84%, transparent 100%);
  background-size: 36px 36px, 36px 36px, 100% 100%;
}

.footer-premium-v21::after {
  background:
    linear-gradient(90deg, transparent 0, rgba(110,190,255,.09) 16%, transparent 30%),
    linear-gradient(180deg, transparent 0, rgba(255,255,255,.03) 22%, transparent 36%),
    radial-gradient(circle at 84% 28%, rgba(255,255,255,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 33%, rgba(255,255,255,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 76% 38%, rgba(255,255,255,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 72% 43%, rgba(255,255,255,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 68% 48%, rgba(255,255,255,.08) 0 2px, transparent 3px),
    linear-gradient(135deg, transparent 0 48%, rgba(255,255,255,.04) 49%, transparent 50%) left 74% top 32% / 110px 110px no-repeat;
}

.footer-v21-grid {
  gap: clamp(38px, 4vw, 84px);
}

.footer-v21-brand-column {
  border-right-color: rgba(255,255,255,.12);
}

.footer-v21-column h3 {
  margin-bottom: 17px;
  padding-bottom: 13px;
}

.footer-v21-links a {
  color: #dfe9f5;
}

.footer-v21-links a:hover {
  color: #ffffff;
}

@media (max-width: 1199.98px) {
  .platforms-catalog-preview .platform-track {
    grid-auto-columns: calc((100% - 48px) / 3);
  }
}

@media (max-width: 991.98px) {
  .service-overview {
    margin-top: -64px;
    padding-top: 132px;
  }

  .platforms-home-section {
    padding-top: 76px;
  }

  .platforms-catalog-preview .platform-track {
    grid-auto-columns: calc((100% - 20px) / 2);
  }
}

@media (max-width: 767.98px) {
  body.home-leonardo {
    background:
      linear-gradient(180deg,
        #081019 0,
        #09111d 470px,
        #edf1f6 470px,
        #f3f6fa 670px,
        #ffffff 100%);
  }

  .service-overview {
    margin-top: -38px;
    padding-top: 108px;
  }

  .value-ribbon {
    margin-top: -18px;
  }

  .ribbon-grid {
    border-radius: 24px;
  }

  .ribbon-item {
    min-height: 84px;
    padding: 18px 18px;
  }

  .service-card {
    min-height: 0;
    padding: 24px 22px 22px;
  }

  .platforms-home-section {
    padding-top: 60px;
  }

  .platforms-catalog-preview .premium-platform-shell {
    padding: 16px 14px 16px;
    border-radius: 26px;
  }

  .platforms-catalog-preview .platform-card {
    min-height: 0;
    border-radius: 22px;
  }

  .platform-card-with-image .platform-body {
    min-height: 0;
    padding: 18px 18px 18px;
  }

  .platform-card-with-image .platform-body h3 {
    font-size: 1.11rem;
  }

  .platform-card-with-image .platform-body p {
    min-height: 0;
    font-size: .87rem;
    line-height: 1.58;
    -webkit-line-clamp: 4;
  }

  .platform-card-with-image .platform-actions {
    grid-template-columns: 1fr;
  }

  .platform-card-with-image .platform-actions a {
    min-height: 42px;
    font-size: .80rem;
  }

  .platform-mobile-cta {
    margin-top: 24px;
  }

  .platform-mobile-cta .btn-material {
    width: 100%;
    min-width: 0;
  }

  .footer-premium-v21 {
    padding-top: 42px;
  }
}

/* =========================================================
   V27.1 · REFINAMIENTO CIBER IA DE SECCIONES Y FOOTER
   Motivos tecnológicos, tarjetas KPI premium y proceso más visual.
   ========================================================= */

/* 1) Marketing digital integrado */
.marketing-home-section{
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(circle at 12% 88%, rgba(234,67,53,.16), transparent 24%),
    radial-gradient(circle at 82% 18%, rgba(96,165,250,.26), transparent 26%),
    linear-gradient(135deg,#141424 0%,#35204f 48%,#1a51bc 100%);
}
.marketing-home-section::before,
.marketing-home-section::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.marketing-home-section::before{
  opacity:.7;
  background:
    radial-gradient(circle at 16% 30%, rgba(255,255,255,.18) 0 2px, transparent 3px),
    radial-gradient(circle at 24% 38%, rgba(255,255,255,.14) 0 2px, transparent 3px),
    radial-gradient(circle at 31% 26%, rgba(255,255,255,.12) 0 2px, transparent 3px),
    radial-gradient(circle at 74% 62%, rgba(255,255,255,.12) 0 2px, transparent 3px),
    radial-gradient(circle at 82% 52%, rgba(255,255,255,.14) 0 2px, transparent 3px),
    linear-gradient(120deg, transparent 0 17%, rgba(255,255,255,.06) 17.2%, transparent 17.7%) 0 0/240px 170px,
    linear-gradient(145deg, transparent 0 27%, rgba(255,255,255,.05) 27.2%, transparent 27.7%) 0 0/260px 180px,
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:auto,auto,auto,auto,auto,240px 170px,260px 180px,42px 42px,42px 42px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.78), rgba(0,0,0,.92));
}
.marketing-home-section::after{
  background:
    radial-gradient(circle at 78% 22%, rgba(255,255,255,.12), transparent 18%),
    radial-gradient(circle at 24% 76%, rgba(255,255,255,.08), transparent 18%);
  mix-blend-mode:screen;
}
.marketing-home-copy>p{color:rgba(255,255,255,.82)}
.marketing-pill-grid a{
  border:1px solid rgba(255,255,255,.17);
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.07));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 16px 36px rgba(6,15,34,.14);
}
.marketing-pill-grid .material-symbols-rounded{
  background:linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.12);
}
.marketing-command{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.28);
  background:
    linear-gradient(180deg, rgba(252,253,255,.98) 0%, rgba(245,249,255,.97) 100%);
  box-shadow:
    0 42px 96px rgba(3,10,27,.34),
    inset 0 1px 0 rgba(255,255,255,.82);
}
.marketing-command::before,
.marketing-command::after{
  content:"";
  position:absolute;
  pointer-events:none;
}
.marketing-command::before{
  inset:0;
  border-radius:inherit;
  background:
    radial-gradient(circle at 18% 24%, rgba(33,115,240,.10), transparent 22%),
    radial-gradient(circle at 82% 84%, rgba(255,68,116,.10), transparent 24%),
    linear-gradient(rgba(31,107,228,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,107,228,.035) 1px, transparent 1px);
  background-size:auto,auto,22px 22px,22px 22px;
}
.marketing-command::after{
  top:70px;
  right:-90px;
  width:220px;
  height:220px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(73,141,255,.16) 0%, rgba(73,141,255,.05) 44%, transparent 74%);
  filter:blur(10px);
}
.command-top{position:relative;z-index:1}
.command-top b{
  background:linear-gradient(180deg,#ecf9f0,#dff4e7);
  border:1px solid #cfe9d7;
}
.command-kpis{
  position:relative;
  z-index:1;
  gap:12px;
}
.command-kpis>div{
  position:relative;
  overflow:hidden;
  padding:16px 16px 15px;
  border:1px solid rgba(220,228,242,.98);
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff 0%, #f8fbff 100%);
  box-shadow:0 12px 28px rgba(16,34,66,.08);
}
.command-kpis>div::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:4px;
  background:var(--kpi-accent,#2e7ef7);
}
.command-kpis>div::after{
  content:"";
  position:absolute;
  right:-32px;
  top:-34px;
  width:110px;
  height:110px;
  border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb, var(--kpi-accent,#2e7ef7) 16%, white) 0%, transparent 66%);
}
.command-kpis>div:nth-child(1){--kpi-accent:#1a73e8}
.command-kpis>div:nth-child(2){--kpi-accent:#34a853}
.command-kpis>div:nth-child(3){--kpi-accent:#ea4335}
.command-kpis span{letter-spacing:.02em}
.command-kpis b{position:relative;z-index:1;font-size:1.75rem;font-weight:500;color:#1a2335}
.command-kpis small{position:relative;z-index:1;font-size:.72rem;font-weight:500}
.command-body{position:relative;z-index:1;gap:14px}
.command-chart,.command-feed{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(220,228,242,.98);
  background:linear-gradient(180deg,#ffffff 0%, #f8fbff 100%);
  box-shadow:0 14px 30px rgba(17,34,68,.07);
}
.command-chart::before,
.command-feed::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(26,115,232,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(26,115,232,.028) 1px, transparent 1px);
  background-size:22px 22px,22px 22px;
}
.chart-lines{position:relative}
.chart-lines::before{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0; top:20px;
  background:
    radial-gradient(circle at 16% 72%, rgba(26,115,232,.16) 0 2px, transparent 3px),
    radial-gradient(circle at 31% 59%, rgba(26,115,232,.16) 0 2px, transparent 3px),
    radial-gradient(circle at 48% 48%, rgba(26,115,232,.16) 0 2px, transparent 3px),
    radial-gradient(circle at 64% 39%, rgba(26,115,232,.16) 0 2px, transparent 3px),
    radial-gradient(circle at 79% 28%, rgba(26,115,232,.16) 0 2px, transparent 3px),
    radial-gradient(circle at 93% 17%, rgba(26,115,232,.16) 0 2px, transparent 3px);
}
.chart-lines i{box-shadow:0 14px 25px rgba(31,94,210,.16)}
.command-feed>div{position:relative;z-index:1}
.command-floating{
  border:1px solid rgba(220,228,242,.98);
  background:rgba(255,255,255,.97);
}

/* 2) Sección de contenido con motivos tecnológicos */
.content-promo-section{
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(circle at 10% 16%, rgba(255,95,126,.13), transparent 20%),
    radial-gradient(circle at 84% 82%, rgba(66,133,244,.18), transparent 22%),
    linear-gradient(145deg,#12182a 0%, #16223a 36%, #1b2f58 68%, #1a4fb7 100%);
}
.content-promo-section::before,
.content-promo-section::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.content-promo-section::before{
  opacity:.76;
  background:
    radial-gradient(circle at 16% 30%, rgba(255,255,255,.16) 0 2px, transparent 3px),
    radial-gradient(circle at 23% 39%, rgba(255,255,255,.14) 0 2px, transparent 3px),
    radial-gradient(circle at 30% 27%, rgba(255,255,255,.12) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 64%, rgba(255,255,255,.12) 0 2px, transparent 3px),
    radial-gradient(circle at 77% 53%, rgba(255,255,255,.14) 0 2px, transparent 3px),
    linear-gradient(135deg, transparent 0 18%, rgba(255,255,255,.055) 18.2%, transparent 18.7%) 0 0/240px 160px,
    linear-gradient(155deg, transparent 0 32%, rgba(255,255,255,.048) 32.2%, transparent 32.7%) 0 0/260px 180px,
    linear-gradient(rgba(255,255,255,.024) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.024) 1px, transparent 1px);
  background-size:auto,auto,auto,auto,auto,240px 160px,260px 180px,40px 40px,40px 40px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.82), rgba(0,0,0,.98));
}
.content-promo-section::after{
  background:radial-gradient(circle at 80% 12%, rgba(255,255,255,.08), transparent 20%);
}
.content-promo-section .visual-promo-media{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,251,255,.95));
  border:1px solid rgba(255,255,255,.58);
  box-shadow:0 40px 96px rgba(3,16,40,.28), inset 0 1px 0 rgba(255,255,255,.74);
}
.content-promo-section .visual-promo-media::before{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:24px;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.24);
}
.content-promo-section .visual-promo-list span{
  background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.06));
  border-color:rgba(255,255,255,.16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 14px 28px rgba(5,15,30,.10);
}
.content-promo-section .media-floating-card{
  background:rgba(249,251,255,.98);
  border:1px solid rgba(223,231,243,.96);
}

/* 3) Proceso más premium / ciber IA */
.process-premium-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 14%, rgba(66,133,244,.12), transparent 22%),
    radial-gradient(circle at 90% 88%, rgba(52,168,83,.10), transparent 24%),
    linear-gradient(180deg,#f1f5fa 0%, #f6f8fc 42%, #fbfcfe 100%);
}
.process-premium-section::before,
.process-premium-section::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.process-premium-section::before{
  background:
    radial-gradient(circle at 18% 20%, rgba(44,111,224,.14) 0 2px, transparent 3px),
    radial-gradient(circle at 24% 28%, rgba(44,111,224,.11) 0 2px, transparent 3px),
    radial-gradient(circle at 31% 18%, rgba(44,111,224,.11) 0 2px, transparent 3px),
    radial-gradient(circle at 74% 73%, rgba(52,168,83,.12) 0 2px, transparent 3px),
    radial-gradient(circle at 82% 64%, rgba(52,168,83,.10) 0 2px, transparent 3px),
    linear-gradient(136deg, transparent 0 17%, rgba(54,113,228,.04) 17.2%, transparent 17.8%) 0 0/240px 170px,
    linear-gradient(155deg, transparent 0 31%, rgba(54,113,228,.035) 31.2%, transparent 31.8%) 0 0/260px 180px,
    linear-gradient(rgba(31,98,203,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(31,98,203,.02) 1px, transparent 1px);
  background-size:auto,auto,auto,auto,auto,240px 170px,260px 180px,48px 48px,48px 48px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.82), rgba(0,0,0,.98));
}
.process-premium-section::after{
  background:radial-gradient(circle at 50% 100%, rgba(66,133,244,.08), transparent 28%);
}
.process-premium-section .section-head p{max-width:880px;margin-inline:auto}
.steps-premium{
  gap:22px;
}
.steps-premium .step-card{
  min-height:300px;
  padding:28px 24px 24px;
  border:1px solid rgba(220,228,240,.96);
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(249,251,255,.98) 100%);
  box-shadow:0 22px 56px rgba(16,35,74,.10);
}
.steps-premium .step-card::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(circle at 86% 18%, color-mix(in srgb, var(--step-color) 13%, transparent) 0 52px, transparent 53px),
    linear-gradient(rgba(24,95,208,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(24,95,208,.018) 1px, transparent 1px);
  background-size:auto, 22px 22px, 22px 22px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.78), rgba(0,0,0,.96));
}
.steps-premium .step-card>.material-symbols-rounded{
  right:20px;
  top:20px;
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:color-mix(in srgb, var(--step-color) 10%, white);
  border:1px solid color-mix(in srgb, var(--step-color) 24%, white);
  font-size:24px;
}
.steps-premium .step-number{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  border-radius:18px;
  border:1px solid color-mix(in srgb, var(--step-color) 16%, white);
  font-size:1.05rem;
  font-weight:500;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}
.steps-premium .step-card h3{font-size:1.52rem;letter-spacing:-.03em}
.steps-premium .step-card p{font-size:.97rem;line-height:1.72;color:#607089}

/* 4) Footer más oscuro / IA */
.footer-premium-v21{
  background:
    radial-gradient(circle at 12% 0%, rgba(0,163,255,.10), transparent 18%),
    radial-gradient(circle at 82% 14%, rgba(67,96,255,.12), transparent 18%),
    radial-gradient(circle at 74% 72%, rgba(175,62,255,.09), transparent 16%),
    linear-gradient(135deg, #040b14 0%, #07111e 28%, #09152a 58%, #071120 100%);
}
.footer-premium-v21::before{
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, transparent 0%, rgba(0,194,255,.08) 38%, transparent 54%, rgba(65,118,255,.06) 84%, transparent 100%),
    linear-gradient(135deg, transparent 0 22%, rgba(255,255,255,.035) 22.2%, transparent 22.8%) 0 0/240px 180px;
  background-size:34px 34px,34px 34px,100% 100%,240px 180px;
}
.footer-premium-v21::after{
  background:
    radial-gradient(circle at 86% 26%, rgba(255,255,255,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 82% 32%, rgba(255,255,255,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 78% 38%, rgba(255,255,255,.07) 0 2px, transparent 3px),
    radial-gradient(circle at 74% 44%, rgba(255,255,255,.07) 0 2px, transparent 3px),
    radial-gradient(circle at 70% 50%, rgba(255,255,255,.07) 0 2px, transparent 3px),
    linear-gradient(90deg, transparent 0, rgba(110,190,255,.07) 16%, transparent 30%);
  background-size:auto;
}
.footer-v21-column h3 a,
.footer-v21-column h3 span{color:#3de3ff}
.footer-v21-links a{color:#dce8f5}
.footer-v21-description{color:#d5e3ef}

@media (max-width: 767.98px){
  .marketing-home-section::before,
  .content-promo-section::before,
  .process-premium-section::before{opacity:.6}
  .command-kpis{grid-template-columns:1fr}
  .steps-premium .step-card{min-height:0;padding:24px 20px 20px}
}

/* =========================================================
   V28 · MOBILE PREMIUM + CARDS CIBER IA + CARRUSEL 1 A 1
   ========================================================= */

/* Cards de la sección Presencia Digital: más sólidos y tecnológicos */
.service-overview .service-card{
  border:1px solid color-mix(in srgb,var(--accent,#1a73e8) 24%,#dce5f2);
  background:
    radial-gradient(circle at 88% 14%, color-mix(in srgb,var(--accent,#1a73e8) 13%,transparent) 0%, transparent 28%),
    linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
  box-shadow:
    0 24px 60px rgba(15,35,74,.13),
    0 0 0 1px rgba(255,255,255,.72) inset;
}
.service-overview .service-card::before{
  width:190px;
  height:190px;
  right:-62px;
  top:-62px;
  opacity:1;
  background:
    radial-gradient(circle at 50% 50%, color-mix(in srgb,var(--accent,#1a73e8) 15%,white) 0 38%, color-mix(in srgb,var(--accent,#1a73e8) 7%,white) 39% 58%, transparent 59%);
}
.service-overview .service-card::after{
  opacity:.9;
  background:
    radial-gradient(circle at 82% 22%, color-mix(in srgb,var(--accent,#1a73e8) 28%,transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 73% 30%, color-mix(in srgb,var(--accent,#1a73e8) 20%,transparent) 0 2px, transparent 3px),
    radial-gradient(circle at 64% 22%, color-mix(in srgb,var(--accent,#1a73e8) 16%,transparent) 0 2px, transparent 3px),
    linear-gradient(145deg,transparent 0 69%,color-mix(in srgb,var(--accent,#1a73e8) 9%,transparent) 69.3%,transparent 69.7%) 0 0/150px 110px,
    linear-gradient(rgba(22,88,190,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(22,88,190,.025) 1px,transparent 1px);
  background-size:auto,auto,auto,150px 110px,24px 24px,24px 24px;
  mask-image:linear-gradient(135deg,rgba(0,0,0,.24),rgba(0,0,0,1));
}
.service-overview .service-card::marker{display:none}
.service-overview .service-card{
  border-top-width:3px;
  border-top-color:var(--accent,#1a73e8);
}
.service-overview .service-icon{
  position:relative;
  z-index:2;
  width:62px;
  height:62px;
  border:1px solid color-mix(in srgb,var(--accent,#1a73e8) 35%,white);
  box-shadow:
    0 16px 34px color-mix(in srgb,var(--accent,#1a73e8) 22%,transparent),
    inset 0 1px 0 rgba(255,255,255,.45);
}
.service-overview .service-icon::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:23px;
  border:1px solid color-mix(in srgb,var(--accent,#1a73e8) 15%,transparent);
  opacity:.7;
}
.service-overview .service-tag,
.service-overview .service-card h3,
.service-overview .service-card p,
.service-overview .service-card a{position:relative;z-index:3}
.service-overview .service-card h3{
  color:#17243b;
  font-weight:500!important;
}
.service-overview .service-card p{
  color:#607089;
}
.service-overview .service-card a{
  color:var(--accent,#1a73e8)!important;
  font-weight:500!important;
}

/* Móvil: hero más proporcionado, texto más arriba y menos grande */
@media(max-width:680px){
  .hero-v23,
  .hero-v23-carousel,
  .hero-v23-carousel .carousel-inner,
  .hero-v23-slide,
  .hero-v23-content{
    min-height:690px;
  }
  .hero-v23-content{
    align-items:flex-start;
    padding-top:138px;
    padding-bottom:94px;
  }
  .hero-v23-copy{
    width:100%;
    max-width:100%;
    padding:0 8px 0 0;
  }
  .hero-v23-kicker{
    margin-bottom:11px;
    font-size:.57rem;
    line-height:1.2;
    letter-spacing:.12em;
  }
  .hero-v23-copy h1{
    max-width:92%;
    font-size:clamp(1.95rem,9.4vw,2.72rem);
    line-height:.99;
    letter-spacing:-.028em;
  }
  .hero-v23-subtitle{
    max-width:92%;
    margin-top:14px;
    font-size:.79rem;
    line-height:1.42;
    letter-spacing:.018em;
  }
  .hero-v23-features{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px 10px;
    margin-top:16px;
    max-width:94%;
  }
  .hero-v23-features span{
    font-size:.61rem;
    line-height:1.3;
  }
  .hero-v23-features i{font-size:.72rem}
  .hero-v23-tagline{
    max-width:94%;
    margin-top:15px;
    font-size:.61rem;
    line-height:1.35;
  }
  .hero-v23-arrow{
    bottom:26px;
    width:38px;
    height:38px;
  }
  .hero-v23-arrow-prev{right:62px}
  .hero-v23-arrow-next{right:16px}
  .hero-v23-indicators{left:16px;bottom:38px}

  /* Presencia digital: card móvil más fuerte */
  .service-overview{
    padding-top:96px;
  }
  .service-overview .section-head-split h2{
    font-size:clamp(1.95rem,8.5vw,2.45rem);
    line-height:1.08;
    letter-spacing:-.04em;
  }
  .service-overview .section-head-split p{
    font-size:.95rem;
    line-height:1.65;
  }
  .mobile-services-carousel .service-card{
    min-height:332px;
    padding:24px 20px 22px;
    border-radius:24px;
    border-top-width:3px;
    box-shadow:0 22px 54px rgba(15,35,74,.15);
  }
  .mobile-services-carousel .service-icon{
    width:56px;
    height:56px;
    border-radius:17px;
  }
  .mobile-services-carousel .service-tag{
    margin-top:20px;
    font-size:.63rem;
  }
  .mobile-services-carousel .service-card h3{
    margin:15px 0 9px;
    font-size:1.24rem;
  }
  .mobile-services-carousel .service-card p{
    font-size:.88rem;
    line-height:1.58;
  }
  .mobile-services-carousel .service-card a{
    margin-top:16px;
    font-size:.84rem;
  }

  /* Catálogo: un solo producto por vez en teléfono */
  .platforms-catalog-preview .platform-track,
  .platforms-catalog-preview .platform-track[data-infinite-carousel="true"]{
    grid-auto-columns:100%!important;
    gap:14px!important;
  }
  .platforms-catalog-preview .platform-viewport{
    overflow:hidden;
    padding-inline:0;
  }
  .platforms-catalog-preview .platform-card{
    width:100%;
    min-width:0;
  }
  .platforms-catalog-preview .premium-platform-shell{
    padding:14px 12px 15px;
  }
  .platform-catalog-image{
    aspect-ratio:16/10;
  }
  .platform-card-with-image .platform-body{
    padding:19px 18px 18px;
  }
  .platform-card-with-image .platform-body h3{
    font-size:1.18rem;
  }
  .platform-card-with-image .platform-body p{
    font-size:.9rem;
    line-height:1.58;
  }
  .platform-card-with-image .platform-actions{
    grid-template-columns:1fr 1fr;
    gap:9px;
  }
  .platform-card-with-image .platform-actions a{
    min-height:43px;
    font-size:.79rem;
    padding-inline:10px;
  }
}

@media(max-width:430px){
  .hero-v23-content{padding-top:126px}
  .hero-v23-copy h1{font-size:clamp(1.82rem,9vw,2.36rem)}
  .hero-v23-subtitle{font-size:.75rem}
  .hero-v23-features span{font-size:.58rem}
  .hero-v23-tagline{font-size:.58rem}
  .service-overview .section-head-split h2{font-size:2rem}
  .platform-card-with-image .platform-actions{grid-template-columns:1fr 1fr}
}

/* =========================================================
   V29 · AJUSTES DE HERO Y FOOTER RESPONSIVE
   - Hero móvil más compacto
   - Tipografía de hero desktop más proporcionada
   - Sin franja blanca debajo del footer móvil
   ========================================================= */

/* Desktop: títulos del slideshow menos grandes y más elegantes */
@media (min-width: 992px){
  .hero-v23-copy{
    width:min(650px,44vw);
  }
  .hero-v23-copy h1{
    max-width:650px;
    font-size:clamp(2.65rem,3.7vw,4.7rem);
    line-height:.98;
    letter-spacing:-.032em;
  }
  .hero-v23-subtitle{
    max-width:590px;
    font-size:clamp(.96rem,1.08vw,1.16rem);
  }
  .hero-v23-features{
    margin-top:22px;
  }
  .hero-v23-tagline{
    margin-top:22px;
  }
}

/* Teléfonos: reducir la altura total del hero y eliminar espacio vacío inferior */
@media (max-width:680px){
  .hero-v23,
  .hero-v23-carousel,
  .hero-v23-carousel .carousel-inner,
  .hero-v23-slide,
  .hero-v23-content{
    min-height:590px!important;
    height:590px;
  }

  .hero-v23-content{
    align-items:flex-start!important;
    padding-top:112px!important;
    padding-bottom:72px!important;
  }

  .hero-v23-copy{
    padding-top:0!important;
  }

  .hero-v23-kicker{
    margin-bottom:9px!important;
    font-size:.55rem!important;
  }

  .hero-v23-copy h1{
    max-width:94%!important;
    font-size:clamp(1.78rem,8.7vw,2.32rem)!important;
    line-height:.98!important;
    letter-spacing:-.025em!important;
  }

  .hero-v23-subtitle{
    max-width:95%!important;
    margin-top:12px!important;
    font-size:.73rem!important;
    line-height:1.38!important;
  }

  .hero-v23-features{
    max-width:96%!important;
    gap:6px 9px!important;
    margin-top:13px!important;
  }

  .hero-v23-features span{
    font-size:.56rem!important;
    line-height:1.25!important;
  }

  .hero-v23-features i{
    font-size:.68rem!important;
  }

  .hero-v23-tagline{
    max-width:95%!important;
    margin-top:12px!important;
    font-size:.56rem!important;
    line-height:1.3!important;
  }

  .hero-v23-arrow{
    bottom:18px!important;
    width:36px!important;
    height:36px!important;
  }

  .hero-v23-arrow-prev{right:58px!important}
  .hero-v23-arrow-next{right:14px!important}
  .hero-v23-indicators{left:14px!important;bottom:29px!important}
  .hero-v23-indicators [data-bs-target]{width:18px!important}

  /* El footer termina sobre fondo oscuro. La barra fija queda encima sin crear espacio blanco. */
  html{
    background:#040b14!important;
  }

  body{
    padding-bottom:0!important;
  }

  #siteFooter{
    display:block;
    margin:0!important;
    padding:0!important;
    background:#040b14!important;
  }

  .footer-premium-v21{
    margin:0!important;
    padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;
    background:
      radial-gradient(circle at 12% 0%,rgba(0,163,255,.10),transparent 18%),
      radial-gradient(circle at 82% 14%,rgba(67,96,255,.12),transparent 18%),
      radial-gradient(circle at 74% 72%,rgba(175,62,255,.09),transparent 16%),
      linear-gradient(135deg,#040b14 0%,#07111e 28%,#09152a 58%,#071120 100%)!important;
  }

  .footer-v21-bottom{
    margin-bottom:0!important;
  }

  .mobile-action-bar{
    margin:0!important;
  }
}

@media (max-width:430px){
  .hero-v23,
  .hero-v23-carousel,
  .hero-v23-carousel .carousel-inner,
  .hero-v23-slide,
  .hero-v23-content{
    min-height:565px!important;
    height:565px;
  }

  .hero-v23-content{
    padding-top:102px!important;
    padding-bottom:66px!important;
  }

  .hero-v23-copy h1{
    font-size:clamp(1.68rem,8.4vw,2.14rem)!important;
  }

  .hero-v23-subtitle{
    font-size:.70rem!important;
  }
}


/* =========================================================
   V30 · MOBILE UX FINAL
   - Hero más corto en celular sin espacio muerto
   - Cinta inferior del hero 1 a 1 en móvil
   - Carrusel de plataformas deslizable con el dedo
   - Características del hero más legibles en celular
   - Proceso más tecnológico con flechas superpuestas
   - Sin barra fija inferior; botones flotantes a la derecha
   ========================================================= */
@media (max-width: 680px){
  .hero-v23,
  .hero-v23-carousel,
  .hero-v23-carousel .carousel-inner,
  .hero-v23-slide,
  .hero-v23-content{
    min-height:520px !important;
    height:520px !important;
  }

  .hero-v23-content{
    align-items:flex-start !important;
    padding-top:98px !important;
    padding-bottom:52px !important;
  }

  .hero-v23-copy h1{
    max-width:92% !important;
    font-size:clamp(1.72rem,8.4vw,2.18rem) !important;
    line-height:0.99 !important;
  }

  .hero-v23-subtitle{
    max-width:94% !important;
    margin-top:12px !important;
    font-size:0.76rem !important;
    line-height:1.42 !important;
  }

  .hero-v23-features{
    max-width:95% !important;
    gap:8px 10px !important;
    margin-top:14px !important;
  }

  .hero-v23-features span{
    font-size:0.71rem !important;
    line-height:1.35 !important;
    color:rgba(255,255,255,.92) !important;
    font-weight:500 !important;
  }

  .hero-v23-features i{
    font-size:0.78rem !important;
  }

  .hero-v23-tagline{
    max-width:95% !important;
    margin-top:14px !important;
    font-size:0.67rem !important;
    line-height:1.38 !important;
    color:rgba(255,255,255,.86) !important;
  }

  .hero-v23-arrow{
    bottom:14px !important;
    width:38px !important;
    height:38px !important;
  }

  .hero-v23-arrow-prev{ right:58px !important; }
  .hero-v23-arrow-next{ right:14px !important; }
  .hero-v23-indicators{ left:14px !important; bottom:26px !important; }
  .hero-v23-indicators [data-bs-target]{ width:18px !important; }

  .value-ribbon{
    margin-top:-12px !important;
    padding-bottom:0 !important;
  }

  .ribbon-grid{
    display:grid !important;
    grid-template-columns:none !important;
    grid-auto-flow:column !important;
    grid-auto-columns:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    border-radius:24px !important;
  }

  .ribbon-grid::-webkit-scrollbar{ display:none; }

  .ribbon-item{
    scroll-snap-align:start;
    min-height:94px !important;
    padding:18px 18px !important;
    border-right:0 !important;
    border-bottom:0 !important;
  }

  .ribbon-item + .ribbon-item{
    border-left:1px solid rgba(214,224,238,.72);
  }

  .ribbon-item::after{ display:none !important; }
  .ribbon-item h3{ font-size:1rem !important; }
  .ribbon-item p{ font-size:0.86rem !important; line-height:1.45 !important; }

  .platforms-catalog-preview .platform-viewport{
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;
    scroll-behavior:smooth;
    touch-action:pan-x pinch-zoom;
    padding-inline:0 !important;
  }

  .platforms-catalog-preview .platform-track,
  .platforms-catalog-preview .platform-track[data-infinite-carousel="true"]{
    grid-auto-columns:100% !important;
    gap:14px !important;
  }

  .platforms-catalog-preview .platform-card{ scroll-snap-align:center; }

  .process-premium-section{
    background:
      radial-gradient(circle at 10% 16%, rgba(66,133,244,.17), transparent 23%),
      radial-gradient(circle at 88% 86%, rgba(0,194,255,.12), transparent 24%),
      linear-gradient(180deg, #eef3f9 0%, #f5f8fc 38%, #fbfcfe 100%) !important;
  }

  .process-premium-section .section-head h2{
    font-size:clamp(1.98rem,9vw,2.55rem);
    line-height:1.08;
    letter-spacing:-.042em;
  }

  .process-premium-section .section-head p{
    font-size:0.96rem;
    line-height:1.66;
  }

  .mobile-process-carousel{
    position:relative;
    padding:2px 0 8px;
  }

  .mobile-process-carousel .carousel-inner{
    overflow:visible;
    padding:6px 0 14px;
  }

  .mobile-process-carousel .mobile-carousel-card-wrap{
    padding:6px 0 16px;
  }

  .mobile-process-carousel .step-card{
    position:relative;
    min-height:312px;
    padding:26px 22px 22px;
    border-radius:28px;
    border:1px solid rgba(203,216,235,.96);
    background:
      radial-gradient(circle at 84% 16%, color-mix(in srgb, var(--step-color) 14%, transparent) 0 56px, transparent 57px),
      linear-gradient(145deg, transparent 0 66%, color-mix(in srgb, var(--step-color) 8%, transparent) 66.2%, transparent 66.8%) 0 0/160px 120px,
      linear-gradient(rgba(21,92,195,.022) 1px, transparent 1px),
      linear-gradient(90deg, rgba(21,92,195,.022) 1px, transparent 1px),
      linear-gradient(180deg, rgba(255,255,255,.99) 0%, rgba(248,251,255,.99) 100%);
    background-size:auto,160px 120px,24px 24px,24px 24px,auto;
    box-shadow:0 22px 56px rgba(16,35,74,.14);
  }

  .mobile-process-carousel .step-card h3{
    font-size:1.5rem;
    margin:18px 0 10px;
  }

  .mobile-process-carousel .step-card p{
    font-size:0.92rem;
    line-height:1.66;
  }

  .mobile-process-carousel .mobile-carousel-controls{
    position:absolute;
    left:-2px;
    right:-2px;
    top:50%;
    z-index:4;
    margin:0;
    padding:0 2px;
    transform:translateY(-50%);
    justify-content:space-between;
    pointer-events:none;
  }

  .mobile-process-carousel .mobile-carousel-controls button{
    width:44px;
    height:44px;
    border-radius:50%;
    background:rgba(9,19,33,.94);
    color:#ffffff;
    border:1px solid rgba(101,166,255,.26);
    box-shadow:0 14px 30px rgba(10,27,53,.24);
    pointer-events:auto;
  }

  .mobile-process-carousel .mobile-carousel-controls .material-symbols-rounded{
    font-size:24px;
  }

  .floating-socials{
    display:none !important;
  }

  .floating-actions{
    display:flex !important;
    right:12px !important;
    bottom:16px !important;
    z-index:1500 !important;
    gap:10px !important;
    align-items:flex-end !important;
  }

  .floating-actions .back-top{
    display:none !important;
  }

  .floating-actions .float-quote{
    width:70px !important;
    height:70px !important;
    min-height:70px !important;
    padding:8px !important;
    border-radius:50% !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    gap:2px !important;
    text-align:center !important;
    font-size:0.58rem !important;
    line-height:1.02 !important;
    font-weight:700 !important;
    background:linear-gradient(135deg,#0b57d0,#2f86ff) !important;
    box-shadow:0 16px 34px rgba(11,87,208,.34) !important;
  }

  .floating-actions .float-quote .material-symbols-rounded{
    font-size:20px !important;
  }

  .floating-actions .float-quote span{
    display:block !important;
  }

  .floating-actions .float-whatsapp{
    width:54px !important;
    height:54px !important;
    min-height:54px !important;
    padding:0 !important;
    border-radius:50% !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    box-shadow:0 14px 28px rgba(22,136,77,.28) !important;
  }

  .floating-actions .float-whatsapp span{ display:none !important; }
  .floating-actions .float-whatsapp i{ font-size:24px !important; }

  .mobile-action-bar{ display:none !important; }
  html{ background:#040b14 !important; }
  body{ padding-bottom:0 !important; }
  #siteFooter{ margin:0 !important; padding:0 !important; background:#040b14 !important; }
  .footer-premium-v21{
    margin:0 !important;
    padding-bottom:28px !important;
  }
}

@media (max-width: 430px){
  .hero-v23,
  .hero-v23-carousel,
  .hero-v23-carousel .carousel-inner,
  .hero-v23-slide,
  .hero-v23-content{
    min-height:500px !important;
    height:500px !important;
  }

  .hero-v23-content{
    padding-top:92px !important;
    padding-bottom:46px !important;
  }

  .hero-v23-copy h1{
    font-size:clamp(1.62rem,8.2vw,2.05rem) !important;
  }

  .hero-v23-subtitle{ font-size:0.74rem !important; }
  .hero-v23-features span{ font-size:0.68rem !important; }
  .hero-v23-tagline{ font-size:0.64rem !important; }

  .ribbon-item h3{ font-size:0.95rem !important; }
  .ribbon-item p{ font-size:0.82rem !important; }

  .floating-actions .float-quote{
    width:66px !important;
    height:66px !important;
    min-height:66px !important;
    font-size:0.54rem !important;
  }
}


/* =========================================================
   V31 · AJUSTE PREMIUM CELULAR PORTADA
   Solicitud 16-08-2026
   - Hero más corto y sin vacío inferior
   - Copy más abajo y proporcional
   - Cinta de valor compacta/premium
   - CTA flotante "Cotizar Página Web" tipo píldora
   - Proceso móvil refinado con flechas reales a los costados
   ========================================================= */
@media (max-width: 680px){
  /* HERO: exclusivamente móvil. */
  body.home-leonardo .hero-v23,
  body.home-leonardo .hero-v23-carousel,
  body.home-leonardo .hero-v23-carousel .carousel-inner,
  body.home-leonardo .hero-v23-slide,
  body.home-leonardo .hero-v23-content{
    min-height:455px !important;
    height:455px !important;
  }

  body.home-leonardo .hero-v23-content{
    align-items:flex-end !important;
    padding-top:92px !important;
    padding-bottom:66px !important;
  }

  body.home-leonardo .hero-v23-copy{
    width:100% !important;
    max-width:100% !important;
    padding:0 4px 0 0 !important;
  }

  body.home-leonardo .hero-v23-kicker{
    margin-bottom:9px !important;
    font-size:.58rem !important;
    letter-spacing:.13em !important;
  }

  body.home-leonardo .hero-v23-copy h1{
    max-width:92% !important;
    font-size:clamp(1.56rem,7.85vw,2.02rem) !important;
    line-height:1 !important;
    letter-spacing:-.025em !important;
  }

  body.home-leonardo .hero-v23-subtitle{
    max-width:92% !important;
    margin-top:10px !important;
    font-size:.70rem !important;
    line-height:1.36 !important;
  }

  body.home-leonardo .hero-v23-features{
    max-width:96% !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px 10px !important;
    margin-top:12px !important;
  }

  body.home-leonardo .hero-v23-features span{
    gap:6px !important;
    font-size:.64rem !important;
    line-height:1.27 !important;
    font-weight:500 !important;
  }

  body.home-leonardo .hero-v23-features i{
    flex:0 0 auto;
    font-size:.69rem !important;
  }

  body.home-leonardo .hero-v23-tagline{
    max-width:95% !important;
    margin-top:11px !important;
    font-size:.59rem !important;
    line-height:1.3 !important;
    letter-spacing:.04em !important;
  }

  body.home-leonardo .hero-v23-arrow{
    bottom:12px !important;
    width:36px !important;
    height:36px !important;
    border-radius:7px !important;
    background:rgba(4,10,19,.72) !important;
  }

  body.home-leonardo .hero-v23-arrow-prev{right:56px !important;}
  body.home-leonardo .hero-v23-arrow-next{right:14px !important;}
  body.home-leonardo .hero-v23-indicators{left:14px !important;bottom:24px !important;}

  /* Cinta inmediatamente bajo el hero: menos alta, limpia y premium. */
  body.home-leonardo .value-ribbon{
    margin-top:-10px !important;
    position:relative;
    z-index:7;
  }

  body.home-leonardo .value-ribbon .container-wide{
    width:calc(100% - 28px) !important;
  }

  body.home-leonardo .ribbon-grid{
    border:1px solid rgba(213,224,239,.96) !important;
    border-radius:20px !important;
    background:rgba(255,255,255,.98) !important;
    box-shadow:0 16px 34px rgba(26,53,96,.12) !important;
  }

  body.home-leonardo .ribbon-item{
    min-height:76px !important;
    padding:12px 14px !important;
    gap:11px !important;
    background:
      radial-gradient(circle at 100% 0%,rgba(234,67,53,.045),transparent 38%),
      linear-gradient(180deg,#fff 0%,#fbfdff 100%) !important;
  }

  body.home-leonardo .ribbon-icon{
    width:44px !important;
    height:44px !important;
    flex:0 0 44px !important;
    border-radius:14px !important;
    box-shadow:inset 0 0 0 1px rgba(45,112,220,.08) !important;
  }

  body.home-leonardo .ribbon-icon .material-symbols-rounded{
    font-size:21px !important;
  }

  body.home-leonardo .ribbon-item h3{
    margin:0 0 2px !important;
    font-size:.90rem !important;
    line-height:1.2 !important;
    font-weight:600 !important;
    letter-spacing:-.01em !important;
  }

  body.home-leonardo .ribbon-item p{
    margin:0 !important;
    font-size:.74rem !important;
    line-height:1.32 !important;
    color:#637089 !important;
  }

  /* PROCESO: una tarjeta más sobria con navegación realmente lateral. */
  body.home-leonardo .process-premium-section{
    padding-top:62px !important;
    padding-bottom:68px !important;
    background:
      radial-gradient(circle at 7% 10%,rgba(66,133,244,.12),transparent 22%),
      radial-gradient(circle at 93% 88%,rgba(93,197,255,.10),transparent 24%),
      linear-gradient(180deg,#f2f6fb 0%,#f8fafe 52%,#ffffff 100%) !important;
  }

  body.home-leonardo .process-premium-section .section-head{
    max-width:100%;
    margin:0 0 24px !important;
  }

  body.home-leonardo .process-premium-section .section-head .eyebrow{
    min-height:28px;
    padding:5px 10px;
    border:1px solid #d9e6f6;
    border-radius:999px;
    background:#fff;
    box-shadow:0 5px 16px rgba(34,68,116,.06);
  }

  body.home-leonardo .process-premium-section .section-head h2{
    max-width:350px;
    margin-top:12px;
    font-size:clamp(1.82rem,8.2vw,2.18rem) !important;
    line-height:1.04 !important;
    letter-spacing:-.045em !important;
  }

  body.home-leonardo .process-premium-section .section-head p{
    max-width:345px;
    margin:12px 0 0 !important;
    font-size:.88rem !important;
    line-height:1.58 !important;
    color:#637089 !important;
  }

  body.home-leonardo .mobile-process-carousel{
    position:relative;
    padding:0 10px 4px !important;
  }

  body.home-leonardo .mobile-process-carousel .carousel-inner{
    overflow:visible !important;
    padding:4px 0 10px !important;
    border-radius:0 !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-card-wrap{
    padding:3px 0 12px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card{
    min-height:246px !important;
    padding:22px 20px 21px !important;
    border:1px solid rgba(207,220,238,.98) !important;
    border-radius:24px !important;
    background:
      radial-gradient(circle at 91% 2%,color-mix(in srgb,var(--step-color) 8%,transparent),transparent 31%),
      linear-gradient(rgba(25,91,188,.021) 1px,transparent 1px),
      linear-gradient(90deg,rgba(25,91,188,.021) 1px,transparent 1px),
      linear-gradient(180deg,#ffffff 0%,#fbfdff 100%) !important;
    background-size:auto,26px 26px,26px 26px,auto !important;
    box-shadow:0 18px 44px rgba(18,42,79,.12) !important;
    overflow:hidden !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card::before{
    height:4px !important;
    background:linear-gradient(90deg,var(--step-color),color-mix(in srgb,var(--step-color) 52%,#59b6ff)) !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card::after{
    opacity:.55 !important;
    background:
      radial-gradient(circle at 88% 18%,color-mix(in srgb,var(--step-color) 9%,transparent) 0 36px,transparent 37px),
      linear-gradient(rgba(24,95,208,.014) 1px,transparent 1px),
      linear-gradient(90deg,rgba(24,95,208,.014) 1px,transparent 1px) !important;
    background-size:auto,24px 24px,24px 24px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-number{
    position:relative;
    z-index:2;
    width:46px !important;
    height:46px !important;
    border-radius:14px !important;
    font-size:.92rem !important;
    font-weight:600 !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card > .material-symbols-rounded{
    z-index:2;
    top:20px !important;
    right:20px !important;
    width:44px !important;
    height:44px !important;
    display:grid !important;
    place-items:center !important;
    border-radius:14px !important;
    font-size:22px !important;
    background:color-mix(in srgb,var(--step-color) 8%,#fff) !important;
    border:1px solid color-mix(in srgb,var(--step-color) 18%,#fff) !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card h3{
    position:relative;
    z-index:2;
    margin:26px 0 8px !important;
    max-width:82%;
    font-size:1.34rem !important;
    line-height:1.15 !important;
    font-weight:500 !important;
    letter-spacing:-.025em !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card p{
    position:relative;
    z-index:2;
    max-width:90%;
    margin:0 !important;
    font-size:.84rem !important;
    line-height:1.55 !important;
    color:#65748b !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls{
    position:absolute !important;
    left:-5px !important;
    right:-5px !important;
    top:51% !important;
    z-index:8 !important;
    display:flex !important;
    justify-content:space-between !important;
    padding:0 !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
    pointer-events:none !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button{
    width:42px !important;
    height:42px !important;
    flex:0 0 42px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border:3px solid rgba(255,255,255,.98) !important;
    border-radius:50% !important;
    background:linear-gradient(145deg,#17283f,#091522) !important;
    color:#fff !important;
    box-shadow:0 10px 26px rgba(12,31,58,.22) !important;
    pointer-events:auto !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button:first-child{
    transform:translateX(-5px) !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button:last-child{
    transform:translateX(5px) !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls .material-symbols-rounded{
    font-size:22px !important;
  }

  /* CTA flotante solicitado: píldora azul, no círculo. */
  body.home-leonardo .floating-actions{
    right:12px !important;
    bottom:14px !important;
    gap:8px !important;
    align-items:flex-end !important;
  }

  body.home-leonardo .floating-actions .float-whatsapp{
    order:1;
    width:48px !important;
    height:48px !important;
    min-height:48px !important;
  }

  body.home-leonardo .floating-actions .float-quote{
    order:2;
    width:auto !important;
    min-width:184px !important;
    height:46px !important;
    min-height:46px !important;
    padding:0 18px !important;
    border:1px solid rgba(255,255,255,.28) !important;
    border-radius:999px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
    white-space:nowrap !important;
    font-size:.78rem !important;
    line-height:1 !important;
    font-weight:700 !important;
    letter-spacing:-.005em !important;
    background:linear-gradient(135deg,#0b75f5,#0874e8 55%,#0866d8) !important;
    box-shadow:0 10px 24px rgba(8,103,220,.32) !important;
  }

  body.home-leonardo .floating-actions .float-quote .material-symbols-rounded{
    font-size:19px !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo .hero-v23,
  body.home-leonardo .hero-v23-carousel,
  body.home-leonardo .hero-v23-carousel .carousel-inner,
  body.home-leonardo .hero-v23-slide,
  body.home-leonardo .hero-v23-content{
    min-height:440px !important;
    height:440px !important;
  }

  body.home-leonardo .hero-v23-content{
    padding-top:88px !important;
    padding-bottom:62px !important;
  }

  body.home-leonardo .hero-v23-copy h1{
    font-size:clamp(1.48rem,7.6vw,1.94rem) !important;
  }

  body.home-leonardo .hero-v23-subtitle{font-size:.67rem !important;}
  body.home-leonardo .hero-v23-features span{font-size:.60rem !important;}
  body.home-leonardo .hero-v23-tagline{font-size:.56rem !important;}

  body.home-leonardo .process-premium-section .section-head h2{
    font-size:clamp(1.72rem,8vw,2.04rem) !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card{
    min-height:232px !important;
  }

  body.home-leonardo .floating-actions .float-quote{
    min-width:178px !important;
    height:44px !important;
    min-height:44px !important;
    padding-inline:16px !important;
    font-size:.75rem !important;
  }
}


/* =========================================================
   V32 · CORRECCIONES CELULAR HERO + PRODUCTOS
   - Hero centrado sin espacio superior excesivo
   - Etiquetas Google Ads / Contenido / Analítica más legibles
   - Productos en carrusel Bootstrap 5.3 solo móvil
   - Scroll vertical de la página libre en la sección productos
   ========================================================= */
.platform-mobile-carousel{display:none}

@media (max-width: 680px){
  /* HERO: texto centrado verticalmente y sin vacío arriba */
  body.home-leonardo .hero-v23,
  body.home-leonardo .hero-v23-carousel,
  body.home-leonardo .hero-v23-carousel .carousel-inner,
  body.home-leonardo .hero-v23-slide,
  body.home-leonardo .hero-v23-content{
    min-height:448px !important;
    height:448px !important;
  }

  body.home-leonardo .hero-v23-content{
    align-items:center !important;
    padding-top:76px !important;
    padding-bottom:34px !important;
  }

  body.home-leonardo .hero-v23-copy{
    width:100% !important;
    max-width:100% !important;
    padding-right:0 !important;
  }

  body.home-leonardo .hero-v23-kicker{
    margin-bottom:10px !important;
    font-size:.60rem !important;
  }

  body.home-leonardo .hero-v23-copy h1{
    max-width:95% !important;
    font-size:clamp(1.72rem,8.35vw,2.18rem) !important;
    line-height:1 !important;
  }

  body.home-leonardo .hero-v23-subtitle{
    max-width:95% !important;
    margin-top:11px !important;
    font-size:.73rem !important;
    line-height:1.42 !important;
  }

  body.home-leonardo .hero-v23-features{
    max-width:96% !important;
    gap:8px 10px !important;
    margin-top:14px !important;
  }

  body.home-leonardo .hero-v23-features span{
    font-size:.72rem !important;
    line-height:1.34 !important;
  }

  body.home-leonardo .hero-v23-features i{font-size:.78rem !important;}

  body.home-leonardo .hero-v23-tagline{
    margin-top:13px !important;
    font-size:.64rem !important;
  }

  body.home-leonardo .hero-v23-arrow{
    bottom:14px !important;
    width:38px !important;
    height:38px !important;
  }

  body.home-leonardo .hero-v23-arrow-prev{right:58px !important;}
  body.home-leonardo .hero-v23-arrow-next{right:14px !important;}
  body.home-leonardo .hero-v23-indicators{left:14px !important;bottom:28px !important;}

  /* Marketing integrado: Google Ads / Contenido / Analítica más grandes */
  body.home-leonardo .marketing-pill-grid b,
  body.home-leonardo .flow-node b,
  body.home-leonardo .flow-brand b{
    font-size:.92rem !important;
    line-height:1.18 !important;
  }

  body.home-leonardo .marketing-pill-grid small,
  body.home-leonardo .flow-node small,
  body.home-leonardo .flow-brand small{
    font-size:.73rem !important;
    line-height:1.2 !important;
  }

  body.home-leonardo .marketing-pill-grid a{
    min-height:68px !important;
  }

  /* PRODUCTOS: usar carrusel Bootstrap 5.3 solo en móvil */
  body.home-leonardo .platform-shell.premium-platform-shell{
    display:none !important;
  }

  body.home-leonardo .platform-mobile-carousel{
    display:block !important;
    position:relative;
    margin-top:16px;
  }

  body.home-leonardo .platform-mobile-carousel .carousel-inner{
    overflow:visible;
    padding:8px 0 24px;
  }

  body.home-leonardo .platform-mobile-carousel .carousel-item{
    padding:2px 0;
  }

  body.home-leonardo .mobile-platform-carousel-card-wrap{
    padding:4px 14px 10px;
  }

  body.home-leonardo .platform-mobile-carousel .platform-card{
    min-height:auto !important;
    border-radius:28px !important;
    box-shadow:0 18px 46px rgba(16,35,74,.12) !important;
  }

  body.home-leonardo .platform-mobile-carousel .platform-catalog-image{
    aspect-ratio:16/10;
  }

  body.home-leonardo .platform-mobile-carousel .platform-body{
    padding:20px 18px 18px !important;
  }

  body.home-leonardo .platform-mobile-carousel .platform-body h3{
    font-size:1.16rem !important;
    line-height:1.18 !important;
  }

  body.home-leonardo .platform-mobile-carousel .platform-body p{
    font-size:.89rem !important;
    line-height:1.56 !important;
  }

  body.home-leonardo .platform-mobile-carousel .platform-actions{
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }

  body.home-leonardo .platform-mobile-carousel .platform-actions a{
    min-height:44px !important;
    font-size:.80rem !important;
  }

  body.home-leonardo .platform-mobile-arrow{
    top:50% !important;
    bottom:auto !important;
    width:42px !important;
    height:42px !important;
    opacity:1 !important;
    transform:translateY(-50%);
    border:2px solid rgba(255,255,255,.98);
    border-radius:50%;
    background:linear-gradient(145deg,#17283f,#091522) !important;
    color:#fff !important;
    box-shadow:0 12px 28px rgba(11,28,52,.24);
  }

  body.home-leonardo .platform-mobile-arrow .material-symbols-rounded{
    font-size:22px;
  }

  body.home-leonardo .platform-mobile-arrow-prev{
    left:-4px !important;
  }

  body.home-leonardo .platform-mobile-arrow-next{
    right:-4px !important;
  }

  body.home-leonardo .platform-mobile-indicators{
    position:relative;
    left:auto;
    right:auto;
    bottom:auto;
    margin:2px 0 0;
    justify-content:center;
    gap:7px;
  }

  body.home-leonardo .platform-mobile-indicators [data-bs-target]{
    width:22px;
    height:3px;
    margin:0;
    border:0;
    border-radius:999px;
    background:rgba(20,34,58,.22);
    opacity:1;
  }

  body.home-leonardo .platform-mobile-indicators .active{
    background:#1a73e8;
  }

  /* Evita bloqueo del scroll vertical de la página en productos */
  body.home-leonardo .platform-mobile-carousel,
  body.home-leonardo .platform-mobile-carousel .carousel-inner,
  body.home-leonardo .platform-mobile-carousel .carousel-item,
  body.home-leonardo .mobile-platform-carousel-card-wrap{
    touch-action:pan-y pinch-zoom;
  }
}

@media (max-width: 430px){
  body.home-leonardo .hero-v23,
  body.home-leonardo .hero-v23-carousel,
  body.home-leonardo .hero-v23-carousel .carousel-inner,
  body.home-leonardo .hero-v23-slide,
  body.home-leonardo .hero-v23-content{
    min-height:432px !important;
    height:432px !important;
  }

  body.home-leonardo .hero-v23-content{
    padding-top:72px !important;
    padding-bottom:30px !important;
  }

  body.home-leonardo .hero-v23-copy h1{
    font-size:clamp(1.60rem,7.9vw,2.02rem) !important;
  }

  body.home-leonardo .hero-v23-subtitle{font-size:.69rem !important;}
  body.home-leonardo .hero-v23-features span{font-size:.67rem !important;}
  body.home-leonardo .marketing-pill-grid b,
  body.home-leonardo .flow-node b,
  body.home-leonardo .flow-brand b{font-size:.86rem !important;}
  body.home-leonardo .marketing-pill-grid small,
  body.home-leonardo .flow-node small,
  body.home-leonardo .flow-brand small{font-size:.68rem !important;}
  body.home-leonardo .mobile-platform-carousel-card-wrap{padding-inline:12px;}
  body.home-leonardo .platform-mobile-arrow{width:40px !important;height:40px !important;}
}


/* =========================================================
   V33 · NAVBAR MÓVIL + FLECHA IZQUIERDA
   - Logotipo más grande en celular
   - Navbar móvil un poco más alto
   - Botón flecha para volver arriba visible a la izquierda al hacer scroll
   ========================================================= */
@media (max-width: 680px){
  body.home-leonardo{
    --navh: 74px !important;
  }

  body.home-leonardo .main-navbar{
    height:74px !important;
  }

  body.home-leonardo .main-navbar.compact{
    height:66px !important;
  }

  body.home-leonardo .navbar-row{
    gap:12px !important;
  }

  body.home-leonardo .brand-link{
    min-width:0 !important;
    flex:1 1 auto !important;
    max-width:none !important;
  }

  body.home-leonardo .brand-logo{
    width:228px !important;
    height:58px !important;
    max-width:calc(100vw - 96px) !important;
    object-fit:contain !important;
    object-position:left center !important;
  }

  body.home-leonardo .main-navbar.compact .brand-logo{
    width:214px !important;
    height:54px !important;
    max-width:calc(100vw - 96px) !important;
  }

  body.home-leonardo .menu-button{
    width:44px !important;
    height:44px !important;
    flex:0 0 44px !important;
    border-radius:12px !important;
  }

  /* Flecha izquierda para volver arriba al bajar scroll */
  body.home-leonardo .floating-actions .back-top{
    display:grid !important;
    place-items:center !important;
    position:fixed !important;
    left:12px !important;
    right:auto !important;
    bottom:14px !important;
    width:46px !important;
    height:46px !important;
    border-radius:14px !important;
    border:1px solid rgba(255,255,255,.22) !important;
    background:rgba(8,18,31,.92) !important;
    color:#fff !important;
    box-shadow:0 12px 28px rgba(10,27,53,.24) !important;
    z-index:1600 !important;
  }

  body.home-leonardo .floating-actions .back-top .material-symbols-rounded{
    font-size:21px !important;
  }

  body.home-leonardo .floating-actions .back-top.show{
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo{
    --navh: 72px !important;
  }

  body.home-leonardo .main-navbar{
    height:72px !important;
  }

  body.home-leonardo .main-navbar.compact{
    height:64px !important;
  }

  body.home-leonardo .brand-logo{
    width:212px !important;
    height:54px !important;
    max-width:calc(100vw - 92px) !important;
  }

  body.home-leonardo .main-navbar.compact .brand-logo{
    width:198px !important;
    height:50px !important;
    max-width:calc(100vw - 92px) !important;
  }

  body.home-leonardo .floating-actions .back-top{
    left:10px !important;
    bottom:12px !important;
    width:44px !important;
    height:44px !important;
  }
}


/* =========================================================
   V34 · CARRUSEL PRODUCTOS MÓVIL MÁS RÁPIDO
   - Respuesta táctil más inmediata
   - Deslizamiento horizontal fácil con el dedo
   ========================================================= */
@media (max-width: 680px){
  body.home-leonardo .platform-mobile-carousel{
    user-select:none;
    -webkit-user-select:none;
    -webkit-tap-highlight-color:transparent;
  }

  body.home-leonardo .platform-mobile-carousel .carousel-inner,
  body.home-leonardo .platform-mobile-carousel .carousel-item,
  body.home-leonardo .mobile-platform-carousel-card-wrap{
    touch-action:manipulation !important;
  }

  body.home-leonardo .platform-mobile-carousel .carousel-item,
  body.home-leonardo .platform-mobile-carousel .carousel-item.active,
  body.home-leonardo .platform-mobile-carousel .carousel-item-next,
  body.home-leonardo .platform-mobile-carousel .carousel-item-prev{
    transition:transform .22s ease-out !important;
  }

  body.home-leonardo .platform-mobile-carousel .platform-card,
  body.home-leonardo .platform-mobile-carousel .platform-catalog-image img,
  body.home-leonardo .platform-mobile-carousel .platform-actions a{
    pointer-events:auto;
  }
}


/* =========================================================
   V35 · HERO IMÁGENES MÓVILES + AJUSTE RESPONSIVE FINAL
   - Desktop mantiene sus imágenes originales
   - Móvil usa imágenes verticales optimizadas para el hero
   - Ajustes finos para celular y tablet sin alterar desktop
   ========================================================= */
.hero-v23-media{
  /* La imagen desktop se define inline en index.php. */
}

@media (max-width: 680px){
  body.home-leonardo .hero-v23-media{
    background-position:72% center !important;
    background-size:cover !important;
    transform:none !important;
    filter:saturate(1.04) contrast(1.03) brightness(.96) !important;
  }

  body.home-leonardo .hero-v23-shade{
    background:
      linear-gradient(180deg, rgba(1, 4, 14, .58) 0%, rgba(1, 5, 16, .72) 22%, rgba(1, 5, 16, .84) 48%, rgba(1, 4, 14, .96) 100%),
      linear-gradient(90deg, rgba(0, 0, 0, .84) 0%, rgba(0, 7, 18, .68) 34%, rgba(0, 7, 18, .28) 68%, rgba(0, 0, 0, .10) 100%) !important;
  }

  body.home-leonardo .hero-v23-copy{
    text-shadow:0 4px 24px rgba(0,0,0,.72) !important;
  }
}

@media (min-width: 681px) and (max-width: 1024px){
  body.home-leonardo .hero-v23,
  body.home-leonardo .hero-v23-carousel,
  body.home-leonardo .hero-v23-carousel .carousel-inner,
  body.home-leonardo .hero-v23-slide,
  body.home-leonardo .hero-v23-content{
    min-height:760px;
  }

  body.home-leonardo .hero-v23-content{
    padding-top:calc(var(--navh) + 28px);
    padding-bottom:88px;
  }

  body.home-leonardo .hero-v23-copy{
    width:min(620px,62vw);
  }
}


/* =========================================================
   V36 · FIX DEFINITIVO IMÁGENES HERO
   - Restaura las imágenes originales en desktop mediante inline style
   - Usa fondos móviles directos por clase (sin variables CSS con rutas)
   - WebP móvil optimizado para carga rápida
   ========================================================= */
@media (max-width: 680px){
  body.home-leonardo .hero-v23-media-development{
    background-image:url('../img/hero-v23/slide-desarrollo-web-mobile.webp') !important;
    background-position:68% center !important;
  }

  body.home-leonardo .hero-v23-media-marketing{
    background-image:url('../img/hero-v23/slide-marketing-digital-mobile.webp') !important;
    background-position:70% center !important;
  }

  body.home-leonardo .hero-v23-media-analytics{
    background-image:url('../img/hero-v23/slide-ia-analitica-mobile.webp') !important;
    background-position:72% center !important;
  }

  body.home-leonardo .hero-v23-media-ai{
    background-image:url('../img/hero-v23/slide-inteligencia-artificial-mobile.webp') !important;
    background-position:72% center !important;
  }


  body.home-leonardo .hero-v23-media-automation{
    background-image:url('../img/hero-v23/slide-automatizacion-empresarial-mobile.webp') !important;
    background-position:64% center !important;
  }

  body.home-leonardo .hero-v23-media-transformation{
    background-image:url('../img/hero-v23/slide-transformacion-digital-mobile.webp') !important;
    background-position:56% center !important;
  }

  body.home-leonardo .hero-v23-media{
    background-size:cover !important;
    background-repeat:no-repeat !important;
    transform:none !important;
  }
}


/* =========================================================
   V37 · HERO MÓVIL FOTOS MÁS VISIBLES
   - Menos oscurecimiento sobre las imágenes móviles
   - Reencuadre por slide para que el sujeto se distinga mejor
   - Más brillo y contraste solo en celular
   ========================================================= */
@media (max-width: 680px){
  body.home-leonardo .hero-v23-media{
    filter:saturate(1.08) contrast(1.10) brightness(1.12) !important;
    transform:scale(1.02) !important;
  }

  body.home-leonardo .hero-v23-shade{
    background:
      linear-gradient(180deg, rgba(1,4,14,.34) 0%, rgba(1,5,16,.48) 20%, rgba(1,5,16,.68) 50%, rgba(1,4,14,.86) 100%),
      linear-gradient(90deg, rgba(0,0,0,.86) 0%, rgba(0,7,18,.62) 34%, rgba(0,7,18,.18) 70%, rgba(0,0,0,.02) 100%) !important;
  }

  body.home-leonardo .hero-v23-media-development{
    background-position:78% center !important;
  }

  body.home-leonardo .hero-v23-media-marketing{
    background-position:82% center !important;
  }

  body.home-leonardo .hero-v23-media-analytics{
    background-position:83% center !important;
  }

  body.home-leonardo .hero-v23-media-ai{
    background-position:84% center !important;
  }

  body.home-leonardo .hero-v23-copy{
    text-shadow:0 4px 18px rgba(0,0,0,.62) !important;
  }

  body.home-leonardo .hero-v23-kicker,
  body.home-leonardo .hero-v23-subtitle,
  body.home-leonardo .hero-v23-features span,
  body.home-leonardo .hero-v23-tagline{
    color:rgba(255,255,255,.95) !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo .hero-v23-media-development{background-position:80% center !important;}
  body.home-leonardo .hero-v23-media-marketing{background-position:84% center !important;}
  body.home-leonardo .hero-v23-media-analytics{background-position:85% center !important;}
  body.home-leonardo .hero-v23-media-ai{background-position:86% center !important;}
}


/* =========================================================
   V38 · IA DESKTOP 14" + VARIANTES NUEVAS
   - Corrige la visibilidad del robot IA en pantallas de 14 pulgadas
   - Usa una nueva imagen principal para la slide de IA en desktop/tablet landscape
   - Incluye 2 variantes adicionales dentro del proyecto como alternativas
   ========================================================= */
@media (min-width: 681px){
  body.home-leonardo .hero-v23-media-analytics{
    background-image:url('../img/hero-v23/slide-ia-analitica-desktop-v38.png') !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
    background-position:72% center !important;
    filter:saturate(1.06) contrast(1.08) brightness(.99) !important;
  }
}

@media (min-width: 1025px) and (max-width: 1440px){
  body.home-leonardo .hero-v23-media-analytics{
    background-position:76% center !important;
  }
}

@media (min-width: 1200px) and (max-width: 1366px){
  body.home-leonardo .hero-v23-media-analytics{
    background-position:79% center !important;
  }
}

@media (min-width: 1367px) and (max-width: 1600px){
  body.home-leonardo .hero-v23-media-analytics{
    background-position:77% center !important;
  }
}


/* =========================================================
   V39 · IA DESKTOP NUEVA FOTO PRINCIPAL
   - Reemplaza la foto desktop original de IA por la nueva versión
   - Ajuste fino para notebooks 14" y pantallas desktop grandes 27"
   ========================================================= */
@media (min-width: 681px){
  body.home-leonardo .hero-v23-media-analytics{
    background-image:url('../img/hero-v23/slide-ia-analitica.jpg') !important;
    background-size:cover !important;
    background-repeat:no-repeat !important;
    background-position:75% center !important;
    filter:saturate(1.05) contrast(1.08) brightness(.99) !important;
  }
}

/* notebooks y monitores 14" aprox */
@media (min-width: 1200px) and (max-width: 1440px){
  body.home-leonardo .hero-v23-media-analytics{
    background-position:79% center !important;
  }
}

/* desktop medianos y grandes */
@media (min-width: 1441px) and (max-width: 1919px){
  body.home-leonardo .hero-v23-media-analytics{
    background-position:76% center !important;
  }
}

/* 27 pulgadas y pantallas amplias */
@media (min-width: 1920px){
  body.home-leonardo .hero-v23-media-analytics{
    background-position:74% center !important;
  }
}


/* =========================================================
   V40 · FLECHAS CARRUSELES SOBRE LOS CARDS
   - Flecha izquierda y derecha superpuestas al carrusel
   - Centradas verticalmente sobre el card
   - Solo ajustes responsive; no altera el contenido
   ========================================================= */
@media (max-width: 680px){

  /* Productos */
  body.home-leonardo .platform-mobile-carousel{
    position:relative !important;
  }

  body.home-leonardo .platform-mobile-arrow{
    position:absolute !important;
    top:50% !important;
    bottom:auto !important;
    z-index:30 !important;
    width:44px !important;
    height:44px !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
    opacity:1 !important;
    display:grid !important;
    place-items:center !important;
    border:3px solid rgba(255,255,255,.96) !important;
    border-radius:50% !important;
    background:rgba(8,18,31,.94) !important;
    color:#fff !important;
    box-shadow:0 12px 30px rgba(7,20,39,.30) !important;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }

  body.home-leonardo .platform-mobile-arrow-prev{
    left:8px !important;
    right:auto !important;
  }

  body.home-leonardo .platform-mobile-arrow-next{
    right:8px !important;
    left:auto !important;
  }

  body.home-leonardo .platform-mobile-arrow .material-symbols-rounded{
    font-size:23px !important;
  }

  /* Servicios y proceso: mismo criterio visual */
  body.home-leonardo .mobile-card-carousel{
    position:relative !important;
  }

  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls{
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:50% !important;
    z-index:30 !important;
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    padding:0 8px !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
    pointer-events:none !important;
  }

  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls button{
    width:44px !important;
    height:44px !important;
    flex:0 0 44px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    margin:0 !important;
    border:3px solid rgba(255,255,255,.96) !important;
    border-radius:50% !important;
    background:rgba(8,18,31,.94) !important;
    color:#fff !important;
    box-shadow:0 12px 30px rgba(7,20,39,.30) !important;
    transform:none !important;
    pointer-events:auto !important;
  }

  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls button:first-child,
  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls button:last-child{
    transform:none !important;
  }

  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls .material-symbols-rounded{
    font-size:23px !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo .platform-mobile-arrow,
  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls button{
    width:40px !important;
    height:40px !important;
    flex-basis:40px !important;
  }

  body.home-leonardo .platform-mobile-arrow-prev{left:6px !important;}
  body.home-leonardo .platform-mobile-arrow-next{right:6px !important;}
  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls{
    padding-inline:6px !important;
  }
}


/* =========================================================
   V41 · FLECHAS HERO EN LOS EXTREMOS
   - Flecha izquierda en el extremo izquierdo del hero
   - Flecha derecha en el extremo derecho del hero
   - Superpuestas al carrusel y centradas verticalmente
   ========================================================= */
body.home-leonardo .hero-v23-carousel{
  position:relative !important;
}

body.home-leonardo .hero-v23-arrow{
  top:50% !important;
  bottom:auto !important;
  transform:translateY(-50%) !important;
  z-index:30 !important;
}

body.home-leonardo .hero-v23-arrow-prev{
  left:20px !important;
  right:auto !important;
}

body.home-leonardo .hero-v23-arrow-next{
  right:20px !important;
  left:auto !important;
}

@media (max-width: 680px){
  body.home-leonardo .hero-v23-arrow{
    width:42px !important;
    height:42px !important;
  }

  body.home-leonardo .hero-v23-arrow-prev{
    left:10px !important;
    right:auto !important;
  }

  body.home-leonardo .hero-v23-arrow-next{
    right:10px !important;
    left:auto !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo .hero-v23-arrow{
    width:40px !important;
    height:40px !important;
  }

  body.home-leonardo .hero-v23-arrow-prev{ left:8px !important; }
  body.home-leonardo .hero-v23-arrow-next{ right:8px !important; }
}


/* =========================================================
   V42 · TEXTO HERO MÁS ARRIBA EN DESKTOP
   - Sube el bloque de texto del hero solo en desktop
   - Mantiene celular/tablet sin cambios
   ========================================================= */
@media (min-width: 1025px){
  body.home-leonardo .hero-v23-copy{
    transform:translateY(-42px) !important;
  }
}

@media (min-width: 1025px) and (max-height: 800px){
  body.home-leonardo .hero-v23-copy{
    transform:translateY(-54px) !important;
  }
}


/* =========================================================
   V43 · SECCIÓN PRODUCTOS FONDO OSCURO CIBER IA
   - Fondo oscuro premium con look ciber/IA
   - Cards más atractivos para presentar productos
   - Mantiene legibilidad en desktop y celular
   ========================================================= */
body.home-leonardo .platforms-home-section{
  background:
    radial-gradient(circle at 14% 18%, rgba(36, 116, 255, .20), transparent 20%),
    radial-gradient(circle at 86% 14%, rgba(110, 72, 255, .16), transparent 18%),
    radial-gradient(circle at 82% 78%, rgba(0, 194, 255, .12), transparent 18%),
    linear-gradient(180deg, #060c17 0%, #09111d 26%, #0a1322 62%, #09101c 100%) !important;
  padding-top: 96px;
}

body.home-leonardo .platforms-home-section::before{
  background-image:
    linear-gradient(rgba(76, 125, 220, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(76, 125, 220, .08) 1px, transparent 1px);
  background-size: 28px 28px;
  opacity:.58;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.82), rgba(0,0,0,.70) 68%, transparent 100%);
}

body.home-leonardo .platforms-home-section::after{
  background:
    radial-gradient(circle at 24% 34%, rgba(64, 129, 255, .20), transparent 18%),
    radial-gradient(circle at 74% 22%, rgba(176, 87, 255, .16), transparent 16%),
    radial-gradient(circle at 58% 72%, rgba(0, 204, 255, .10), transparent 18%);
  opacity:.95;
}

body.home-leonardo .platforms-home-section .pglow-one{
  width:520px;
  height:520px;
  left:-190px;
  top:-160px;
  background:radial-gradient(circle, rgba(28, 112, 255, .26), transparent 68%);
  filter:blur(18px);
}

body.home-leonardo .platforms-home-section .pglow-two{
  width:540px;
  height:540px;
  right:-190px;
  bottom:-220px;
  background:radial-gradient(circle, rgba(168, 87, 255, .20), transparent 68%);
  filter:blur(18px);
}

body.home-leonardo .platforms-catalog-preview .platform-title-copy .eyebrow{
  background:rgba(33, 114, 255, .14);
  border:1px solid rgba(82, 145, 255, .26);
  color:#9bc0ff;
  box-shadow:0 10px 26px rgba(21,43,82,.18);
}

body.home-leonardo .platforms-catalog-preview .platform-title-copy h2{
  color:#f4f8ff;
}

body.home-leonardo .platforms-catalog-preview .platform-title-copy p{
  color:#a9b7cc;
}

body.home-leonardo .platforms-catalog-preview .premium-platform-shell{
  border:1px solid rgba(74, 96, 132, .50);
  background:
    linear-gradient(180deg, rgba(13, 22, 38, .90) 0%, rgba(10, 18, 30, .94) 100%);
  box-shadow:
    0 26px 70px rgba(0, 0, 0, .36),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(57, 101, 177, .08);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

body.home-leonardo .platforms-catalog-preview .premium-platform-shell::before{
  background:
    linear-gradient(125deg, rgba(255,255,255,.08), transparent 30%),
    linear-gradient(rgba(56, 106, 196, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(56, 106, 196, .055) 1px, transparent 1px);
  background-size:auto, 18px 18px, 18px 18px;
  opacity:.86;
}

body.home-leonardo .platforms-catalog-preview .platform-carousel-help{
  color:#93a5bf;
}

body.home-leonardo .platforms-catalog-preview .platform-carousel-help .material-symbols-rounded{
  color:#73a7ff;
}

body.home-leonardo .platforms-catalog-preview .platform-card{
  border:1px solid rgba(82, 103, 136, .55);
  background:
    linear-gradient(180deg, rgba(17, 28, 46, .96) 0%, rgba(11, 19, 31, .98) 100%);
  box-shadow:
    0 22px 56px rgba(0, 0, 0, .34),
    inset 0 1px 0 rgba(255,255,255,.05);
}

body.home-leonardo .platforms-catalog-preview .platform-card:hover{
  transform:translateY(-7px);
  border-color:rgba(101, 132, 181, .72);
  box-shadow:
    0 30px 70px rgba(0, 0, 0, .42),
    0 0 0 1px rgba(75, 126, 214, .20),
    inset 0 1px 0 rgba(255,255,255,.08);
}

body.home-leonardo .platforms-catalog-preview .platform-catalog-image{
  border-bottom:1px solid rgba(73, 95, 131, .54);
}

body.home-leonardo .platforms-catalog-preview .platform-catalog-image::before{
  background:
    linear-gradient(180deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 22%, rgba(7,14,28,.06) 70%, rgba(7,14,28,.24) 100%),
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
}

body.home-leonardo .platform-card-meta .platform-mini-icon{
  background:linear-gradient(145deg, rgba(29, 52, 85, .95), rgba(16, 29, 50, .95));
  border:1px solid rgba(70, 110, 184, .55);
  color:#7bb0ff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 10px 24px rgba(0,0,0,.22);
}

body.home-leonardo .platform-card-with-image .platform-category,
body.home-leonardo .platform-category{
  background:linear-gradient(180deg, rgba(31, 52, 84, .95), rgba(20, 36, 60, .95));
  border:1px solid rgba(70, 110, 184, .42);
  color:#a9c5ff;
}

body.home-leonardo .platform-card-with-image .platform-body h3{
  color:#f3f7ff;
}

body.home-leonardo .platform-card-with-image .platform-body p{
  color:#a7b5ca;
}

body.home-leonardo .platform-card-with-image .platform-actions .platform-quote{
  background:linear-gradient(135deg, #1d7cff, #7d4dff);
  box-shadow:0 12px 24px rgba(53, 103, 226, .28);
}

body.home-leonardo .platform-card-with-image .platform-actions .platform-info{
  background:linear-gradient(180deg, rgba(20, 33, 53, .96), rgba(16, 27, 43, .96));
  border-color:rgba(78, 101, 138, .55);
  color:#c1d0e6;
}

body.home-leonardo .platform-card-with-image .platform-actions .platform-info:hover{
  background:linear-gradient(180deg, rgba(28, 45, 70, .98), rgba(20, 35, 56, .98));
  color:#ffffff;
}

body.home-leonardo .platform-mobile-carousel .platform-card{
  border:1px solid rgba(82, 103, 136, .55) !important;
  background:linear-gradient(180deg, rgba(17, 28, 46, .97) 0%, rgba(11, 19, 31, .99) 100%) !important;
  box-shadow:0 22px 56px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05) !important;
}

body.home-leonardo .platform-mobile-cta .btn-material,
body.home-leonardo .platforms-catalog-preview .platforms-main-button{
  background:linear-gradient(135deg, #1f7bff, #7f4dff);
  box-shadow:0 18px 40px rgba(45, 88, 210, .26);
}

@media (max-width: 680px){
  body.home-leonardo .platforms-home-section{
    padding-top:78px;
  }

  body.home-leonardo .platforms-catalog-preview .platform-title-copy h2{
    font-size:clamp(2rem, 8vw, 2.45rem);
  }

  body.home-leonardo .platforms-catalog-preview .platform-title-copy p{
    font-size:.95rem;
    line-height:1.68;
  }
}


/* =========================================================
   V44 · PROCESO OSCURO CIBER IA
   - Sección “De la idea a una solución…” rediseñada con fondo oscuro
   - Cards premium con estilo ciber IA y mejor contraste
   - Ajuste completo para desktop, tablet y móvil
   ========================================================= */
body.home-leonardo .process-premium-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 10% 16%, rgba(39, 117, 255, .18), transparent 18%),
    radial-gradient(circle at 88% 18%, rgba(134, 76, 255, .16), transparent 18%),
    radial-gradient(circle at 82% 78%, rgba(0, 201, 255, .10), transparent 20%),
    linear-gradient(180deg, #050b16 0%, #08111e 24%, #0a1321 58%, #09111d 100%) !important;
}

body.home-leonardo .process-premium-section::before{
  background:
    linear-gradient(rgba(82, 131, 219, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(82, 131, 219, .055) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 22%, rgba(95, 145, 255, .06) 22.2%, transparent 22.8%) 0 0/240px 180px,
    radial-gradient(circle at 24% 32%, rgba(113, 169, 255, .12) 0 2px, transparent 3px),
    radial-gradient(circle at 68% 64%, rgba(106, 246, 255, .10) 0 2px, transparent 3px);
  background-size:30px 30px,30px 30px,240px 180px,auto,auto;
  opacity:.82;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.92), rgba(0,0,0,.98));
}

body.home-leonardo .process-premium-section::after{
  background:
    radial-gradient(circle at 50% 100%, rgba(43, 123, 255, .16), transparent 24%),
    linear-gradient(90deg, transparent 0%, rgba(0, 208, 255, .06) 40%, transparent 72%);
}

body.home-leonardo .process-premium-section .section-head .eyebrow{
  background:rgba(27, 91, 204, .18) !important;
  border:1px solid rgba(81, 144, 255, .34) !important;
  color:#9fc5ff !important;
  box-shadow:0 10px 26px rgba(0,0,0,.18);
}

body.home-leonardo .process-premium-section .section-head h2{
  color:#f3f7ff !important;
}

body.home-leonardo .process-premium-section .section-head p{
  color:#a8b7cc !important;
}

body.home-leonardo .steps-premium .step-card{
  border:1px solid rgba(79, 102, 139, .55) !important;
  border-radius:30px !important;
  background:
    linear-gradient(180deg, rgba(17, 28, 46, .96) 0%, rgba(11, 19, 31, .98) 100%) !important;
  box-shadow:
    0 24px 60px rgba(0, 0, 0, .36),
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 0 1px rgba(59, 95, 164, .08) !important;
}

body.home-leonardo .steps-premium .step-card::after{
  background:
    radial-gradient(circle at 86% 18%, color-mix(in srgb, var(--step-color) 16%, transparent) 0 54px, transparent 55px),
    linear-gradient(rgba(74, 126, 219, .040) 1px, transparent 1px),
    linear-gradient(90deg, rgba(74, 126, 219, .040) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 30%, color-mix(in srgb, var(--step-color) 10%, transparent) 30.2%, transparent 30.8%) 0 0/180px 120px;
  background-size:auto, 22px 22px, 22px 22px, 180px 120px;
  opacity:.98;
}

body.home-leonardo .steps-premium .step-card:hover{
  transform:translateY(-8px);
  border-color:rgba(110, 140, 191, .72) !important;
  box-shadow:
    0 32px 74px rgba(0, 0, 0, .42),
    0 0 0 1px rgba(80, 132, 227, .18),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.home-leonardo .steps-premium .step-card>.material-symbols-rounded{
  background:color-mix(in srgb, var(--step-color) 16%, #0f1d31) !important;
  border:1px solid color-mix(in srgb, var(--step-color) 34%, rgba(255,255,255,.10)) !important;
  color:color-mix(in srgb, var(--step-color) 78%, white) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 12px 24px rgba(0,0,0,.22);
}

body.home-leonardo .steps-premium .step-number{
  background:color-mix(in srgb, var(--step-color) 14%, #0f1d31) !important;
  border:1px solid color-mix(in srgb, var(--step-color) 30%, rgba(255,255,255,.10)) !important;
  color:color-mix(in srgb, var(--step-color) 76%, white) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 10px 22px rgba(0,0,0,.18);
}

body.home-leonardo .steps-premium .step-card h3{
  color:#f4f8ff !important;
}

body.home-leonardo .steps-premium .step-card p{
  color:#a7b6ca !important;
}

body.home-leonardo .mobile-card-carousel .mobile-carousel-controls button{
  border-color:rgba(255,255,255,.92) !important;
  background:rgba(8, 18, 31, .94) !important;
  color:#fff !important;
  box-shadow:0 14px 30px rgba(0,0,0,.28) !important;
}

@media (max-width: 992px){
  body.home-leonardo .process-premium-section{
    padding-top:72px !important;
    padding-bottom:78px !important;
  }
}

@media (max-width: 680px){
  body.home-leonardo .process-premium-section{
    background:
      radial-gradient(circle at 9% 11%, rgba(39,117,255,.18), transparent 18%),
      radial-gradient(circle at 92% 89%, rgba(0,205,255,.10), transparent 22%),
      linear-gradient(180deg, #050b16 0%, #08111e 28%, #0a1321 68%, #09111d 100%) !important;
    padding-top:62px !important;
    padding-bottom:70px !important;
  }

  body.home-leonardo .process-premium-section .section-head .eyebrow{
    background:rgba(27, 91, 204, .16) !important;
    border-color:rgba(81, 144, 255, .28) !important;
  }

  body.home-leonardo .process-premium-section .section-head h2{
    max-width:360px;
    color:#f4f8ff !important;
  }

  body.home-leonardo .process-premium-section .section-head p{
    max-width:350px;
    color:#a7b6ca !important;
  }

  body.home-leonardo .steps-premium .step-card{
    border-radius:28px !important;
  }
}


/* =========================================================
   V45 · PROCESO CLARO CON DEGRADÉ Y TRAMA CIBER IA
   - Fondo claro premium con degradé suave
   - Trama tecnológica/ciber IA elegante
   - Cards claras atractivas y legibles
   ========================================================= */
body.home-leonardo .process-premium-section{
  background:
    radial-gradient(circle at 10% 16%, rgba(66, 133, 244, .12), transparent 18%),
    radial-gradient(circle at 88% 18%, rgba(128, 96, 255, .10), transparent 18%),
    radial-gradient(circle at 80% 76%, rgba(0, 194, 255, .08), transparent 20%),
    linear-gradient(135deg, #eef4fb 0%, #f5f8fd 34%, #fbfcff 68%, #eef6f4 100%) !important;
}

body.home-leonardo .process-premium-section::before{
  background:
    linear-gradient(rgba(73, 123, 214, .050) 1px, transparent 1px),
    linear-gradient(90deg, rgba(73, 123, 214, .050) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 22%, rgba(82, 132, 222, .045) 22.2%, transparent 22.8%) 0 0/240px 180px,
    linear-gradient(155deg, transparent 0 31%, rgba(82, 132, 222, .030) 31.2%, transparent 31.8%) 0 0/260px 180px,
    radial-gradient(circle at 22% 28%, rgba(91, 151, 255, .16) 0 2px, transparent 3px),
    radial-gradient(circle at 28% 34%, rgba(91, 151, 255, .12) 0 2px, transparent 3px),
    radial-gradient(circle at 72% 62%, rgba(122, 210, 255, .14) 0 2px, transparent 3px),
    radial-gradient(circle at 78% 68%, rgba(122, 210, 255, .11) 0 2px, transparent 3px);
  background-size:30px 30px,30px 30px,240px 180px,260px 180px,auto,auto,auto,auto;
  opacity:.96;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.88), rgba(0,0,0,.98));
}

body.home-leonardo .process-premium-section::after{
  background:
    radial-gradient(circle at 50% 100%, rgba(66, 133, 244, .10), transparent 26%),
    linear-gradient(90deg, transparent 0%, rgba(110, 190, 255, .08) 38%, transparent 62%, rgba(88, 133, 255, .05) 82%, transparent 100%);
}

body.home-leonardo .process-premium-section .section-head .eyebrow{
  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(194, 214, 243, .98) !important;
  color:#2b73e8 !important;
  box-shadow:0 10px 24px rgba(56, 88, 140, .08) !important;
}

body.home-leonardo .process-premium-section .section-head h2{
  color:#1d2740 !important;
}

body.home-leonardo .process-premium-section .section-head p{
  color:#61718a !important;
}

body.home-leonardo .steps-premium .step-card{
  border:1px solid rgba(214, 225, 239, .98) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(248,251,255,.98) 100%) !important;
  box-shadow:
    0 22px 58px rgba(20, 42, 78, .10),
    inset 0 1px 0 rgba(255,255,255,.92),
    0 0 0 1px rgba(218, 228, 243, .60) !important;
}

body.home-leonardo .steps-premium .step-card::after{
  background:
    radial-gradient(circle at 86% 18%, color-mix(in srgb, var(--step-color) 12%, transparent) 0 56px, transparent 57px),
    linear-gradient(rgba(57, 113, 212, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(57, 113, 212, .022) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 30%, color-mix(in srgb, var(--step-color) 7%, transparent) 30.2%, transparent 30.8%) 0 0/180px 120px;
  background-size:auto,22px 22px,22px 22px,180px 120px;
  opacity:.98;
}

body.home-leonardo .steps-premium .step-card:hover{
  transform:translateY(-8px);
  border-color:rgba(193, 208, 229, .98) !important;
  box-shadow:
    0 28px 70px rgba(20, 42, 78, .14),
    0 0 0 1px rgba(94, 142, 226, .12),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}

body.home-leonardo .steps-premium .step-card>.material-symbols-rounded{
  background:color-mix(in srgb, var(--step-color) 10%, white) !important;
  border:1px solid color-mix(in srgb, var(--step-color) 24%, white) !important;
  color:color-mix(in srgb, var(--step-color) 82%, #244073) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.90), 0 10px 22px rgba(26, 52, 96, .08) !important;
}

body.home-leonardo .steps-premium .step-number{
  background:color-mix(in srgb, var(--step-color) 10%, white) !important;
  border:1px solid color-mix(in srgb, var(--step-color) 20%, white) !important;
  color:color-mix(in srgb, var(--step-color) 78%, #22406e) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.94), 0 8px 18px rgba(26, 52, 96, .06) !important;
}

body.home-leonardo .steps-premium .step-card h3{
  color:#18253d !important;
}

body.home-leonardo .steps-premium .step-card p{
  color:#61718a !important;
}

@media (max-width: 680px){
  body.home-leonardo .process-premium-section{
    background:
      radial-gradient(circle at 8% 12%, rgba(66,133,244,.14), transparent 20%),
      radial-gradient(circle at 92% 88%, rgba(0,194,255,.08), transparent 22%),
      linear-gradient(135deg, #eef4fb 0%, #f6f9fd 38%, #fbfcff 72%, #eff6f5 100%) !important;
  }

  body.home-leonardo .process-premium-section .section-head h2{
    color:#1d2740 !important;
  }

  body.home-leonardo .process-premium-section .section-head p{
    color:#637089 !important;
  }
}


/* =========================================================
   V46 · AJUSTES HERO, SERVICIOS, PRODUCTOS Y PROCESO
   - Flechas del hero más abajo en móvil y sin tapar texto
   - Flechas cuadradas claras para hero/servicios/proceso en móvil
   - En desktop 14-15" las flechas del hero bajan para no tapar textos
   - Producto cambia botón Cotizar por Ver demo
   - Centro de crecimiento móvil más compacto
   - Fotos del hero móvil más visibles
   ========================================================= */

/* Desktop 14" y 15": bajar flechas del hero para que no tapen el texto */
@media (min-width: 1025px) and (max-width: 1600px){
  body.home-leonardo .hero-v23-arrow{
    top:auto !important;
    bottom:86px !important;
    transform:none !important;
    width:46px !important;
    height:46px !important;
    border-radius:12px !important;
    border:1px solid rgba(182,205,236,.42) !important;
    background:rgba(10,17,30,.42) !important;
    box-shadow:0 10px 28px rgba(3,10,24,.18) !important;
  }
  body.home-leonardo .hero-v23-arrow-prev{left:20px !important;}
  body.home-leonardo .hero-v23-arrow-next{right:20px !important;}
}

/* Desktop amplio: mantener diseño limpio sin tapar la copia */
@media (min-width: 1601px){
  body.home-leonardo .hero-v23-arrow{
    top:auto !important;
    bottom:88px !important;
    transform:none !important;
    border-radius:12px !important;
    background:rgba(10,17,30,.42) !important;
  }
}

/* Hero móvil: flechas más abajo, cuadradas y claras */
@media (max-width: 680px){
  body.home-leonardo .hero-v23-arrow{
    top:auto !important;
    bottom:92px !important;
    transform:none !important;
    width:42px !important;
    height:42px !important;
    border-radius:11px !important;
    border:1px solid rgba(189,210,239,.90) !important;
    background:rgba(255,255,255,.92) !important;
    color:#183b75 !important;
    box-shadow:0 12px 26px rgba(14,32,64,.16) !important;
  }
  body.home-leonardo .hero-v23-arrow:hover,
  body.home-leonardo .hero-v23-arrow:active{
    background:#ffffff !important;
    color:#145cc7 !important;
    border-color:rgba(162,193,236,.96) !important;
  }
  body.home-leonardo .hero-v23-arrow-prev{left:14px !important; right:auto !important;}
  body.home-leonardo .hero-v23-arrow-next{right:14px !important; left:auto !important;}
  body.home-leonardo .hero-v23-arrow .material-symbols-rounded{font-size:23px !important;}

  /* Hacer que las imágenes del hero se distingan más en móvil */
  body.home-leonardo .hero-v23-media{
    filter:saturate(1.16) contrast(1.14) brightness(1.20) !important;
    transform:scale(1.035) !important;
  }
  body.home-leonardo .hero-v23-shade{
    background:
      linear-gradient(180deg, rgba(1,4,14,.22) 0%, rgba(1,5,16,.34) 20%, rgba(1,5,16,.56) 50%, rgba(1,4,14,.78) 100%),
      linear-gradient(90deg, rgba(0,0,0,.82) 0%, rgba(0,7,18,.54) 34%, rgba(0,7,18,.10) 72%, rgba(0,0,0,0) 100%) !important;
  }
  body.home-leonardo .hero-v23-media-development{background-position:82% center !important;}
  body.home-leonardo .hero-v23-media-marketing{background-position:86% center !important;}
  body.home-leonardo .hero-v23-media-analytics{background-position:88% center !important;}
  body.home-leonardo .hero-v23-media-ai{background-position:84% center !important;}

  /* Servicios y proceso: flechas debajo, cuadradas y claras para no tapar texto */
  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    bottom:auto !important;
    transform:none !important;
    margin-top:14px !important;
    padding:0 14px !important;
    justify-content:space-between !important;
    pointer-events:auto !important;
  }
  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls button{
    width:42px !important;
    height:42px !important;
    flex:0 0 42px !important;
    border-radius:11px !important;
    border:1px solid rgba(189,210,239,.92) !important;
    background:rgba(255,255,255,.94) !important;
    color:#183b75 !important;
    box-shadow:0 10px 24px rgba(14,32,64,.14) !important;
  }
  body.home-leonardo .mobile-card-carousel .mobile-carousel-controls .material-symbols-rounded{
    font-size:22px !important;
  }

  /* Más espacio visual en cards móviles */
  body.home-leonardo .mobile-services-carousel .service-card,
  body.home-leonardo .mobile-process-carousel .step-card{
    min-height:auto !important;
  }

  /* Centro de crecimiento más compacto en móvil */
  body.home-leonardo .marketing-command{
    padding:16px !important;
    border-radius:26px !important;
  }
  body.home-leonardo .command-top{
    margin-bottom:12px !important;
  }
  body.home-leonardo .command-top span{font-size:.92rem !important;}
  body.home-leonardo .command-top b{font-size:.72rem !important; padding:8px 12px !important;}
  body.home-leonardo .command-kpis{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  body.home-leonardo .command-kpis > div{
    padding:12px 12px 12px !important;
    border-radius:18px !important;
    min-height:120px !important;
  }
  body.home-leonardo .command-kpis b{font-size:1.05rem !important;}
  body.home-leonardo .command-kpis small{font-size:.69rem !important;}
  body.home-leonardo .command-body{
    display:block !important;
    margin-top:12px !important;
  }
  body.home-leonardo .command-chart{
    min-height:170px !important;
    border-radius:22px !important;
    padding:14px 14px 12px !important;
  }
  body.home-leonardo .command-chart span{font-size:.88rem !important;}
  body.home-leonardo .chart-lines{height:100px !important;}
  body.home-leonardo .chart-lines i{border-radius:10px 10px 0 0 !important;}
  body.home-leonardo .command-feed{
    display:none !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo .hero-v23-arrow{
    bottom:88px !important;
    width:40px !important;
    height:40px !important;
  }
  body.home-leonardo .hero-v23-arrow-prev{left:10px !important;}
  body.home-leonardo .hero-v23-arrow-next{right:10px !important;}
  body.home-leonardo .hero-v23-media-development{background-position:84% center !important;}
  body.home-leonardo .hero-v23-media-marketing{background-position:88% center !important;}
  body.home-leonardo .hero-v23-media-analytics{background-position:90% center !important;}
  body.home-leonardo .hero-v23-media-ai{background-position:86% center !important;}
  body.home-leonardo .command-kpis{
    grid-template-columns:1fr !important;
  }
  body.home-leonardo .command-kpis > div{
    min-height:auto !important;
  }
  body.home-leonardo .command-chart{
    min-height:148px !important;
  }
}


/* =========================================================
   V47 · HERO MÓVIL FLECHAS MÁS ABAJO Y OSCURAS
   - En celular las flechas del hero bajan aún más
   - Estilo oscuro/transparente para integrarlas al hero
   ========================================================= */
@media (max-width: 680px){
  body.home-leonardo .hero-v23-arrow{
    bottom:58px !important;
    border-radius:12px !important;
    border:1px solid rgba(255,255,255,.14) !important;
    background:rgba(6, 12, 22, .52) !important;
    color:#ffffff !important;
    box-shadow:0 12px 26px rgba(5, 14, 28, .22) !important;
    backdrop-filter:blur(10px) !important;
    -webkit-backdrop-filter:blur(10px) !important;
  }

  body.home-leonardo .hero-v23-arrow:hover,
  body.home-leonardo .hero-v23-arrow:active{
    background:rgba(8, 16, 30, .68) !important;
    color:#ffffff !important;
    border-color:rgba(255,255,255,.22) !important;
  }

  body.home-leonardo .hero-v23-arrow-prev{
    left:14px !important;
  }

  body.home-leonardo .hero-v23-arrow-next{
    right:14px !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo .hero-v23-arrow{
    bottom:54px !important;
    width:40px !important;
    height:40px !important;
  }

  body.home-leonardo .hero-v23-arrow-prev{left:10px !important;}
  body.home-leonardo .hero-v23-arrow-next{right:10px !important;}
}


/* =========================================================
   V48 · CHIP DESTACADO / PREMIUM EN PRODUCTOS
   - Añade un chip visual sobre las imágenes de los productos
   - Alterna entre “Destacado” y “Premium” para que resalten más
   ========================================================= */
.platform-catalog-image{
  position:relative;
}

.platform-highlight-badge{
  position:absolute;
  top:14px;
  right:14px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:34px;
  padding:8px 13px;
  border-radius:999px;
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.01em;
  line-height:1;
  box-shadow:0 12px 26px rgba(9, 16, 30, .24);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.platform-highlight-badge .material-symbols-rounded{
  font-size:16px;
  line-height:1;
}

.platform-highlight-badge-featured{
  background:linear-gradient(135deg, rgba(255, 197, 42, .96), rgba(235, 165, 14, .95));
  color:#5d3c00;
  border:1px solid rgba(255, 223, 130, .95);
}

.platform-highlight-badge-premium{
  background:linear-gradient(135deg, rgba(90, 115, 255, .96), rgba(123, 72, 255, .95));
  color:#ffffff;
  border:1px solid rgba(193, 179, 255, .60);
}

@media (max-width: 680px){
  .platform-highlight-badge{
    top:12px;
    right:12px;
    min-height:32px;
    padding:7px 12px;
    font-size:.70rem;
  }
  .platform-highlight-badge .material-symbols-rounded{
    font-size:15px;
  }
}


/* =========================================================
   V49 · PROCESO PREMIUM CIBER IA COLORIDO
   - Fondo con degradé claro/tecnológico
   - Cards más premium, coloridas y con glow suave
   - Trama IA visible en desktop y móvil
   ========================================================= */
body.home-leonardo .process-premium-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(71, 136, 255, .16), transparent 20%),
    radial-gradient(circle at 88% 18%, rgba(130, 103, 255, .14), transparent 18%),
    radial-gradient(circle at 78% 78%, rgba(0, 214, 255, .12), transparent 22%),
    linear-gradient(135deg, #eef4ff 0%, #f5f8ff 28%, #fcfdff 56%, #eef8fb 100%) !important;
}

body.home-leonardo .process-premium-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(76, 123, 214, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(76, 123, 214, .055) 1px, transparent 1px),
    linear-gradient(145deg, transparent 0 24%, rgba(95, 145, 238, .05) 24.2%, transparent 24.8%) 0 0/240px 180px,
    linear-gradient(35deg, transparent 0 64%, rgba(112, 196, 255, .06) 64.2%, transparent 64.8%) 0 0/260px 190px,
    radial-gradient(circle at 16% 18%, rgba(80, 153, 255, .16) 0 2px, transparent 3px),
    radial-gradient(circle at 22% 22%, rgba(80, 153, 255, .10) 0 2px, transparent 3px),
    radial-gradient(circle at 68% 56%, rgba(116, 214, 255, .13) 0 2px, transparent 3px),
    radial-gradient(circle at 76% 62%, rgba(116, 214, 255, .10) 0 2px, transparent 3px);
  background-size:32px 32px, 32px 32px, 240px 180px, 260px 190px, auto, auto, auto, auto;
  opacity:.95;
}

body.home-leonardo .process-premium-section::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 0% 100%, rgba(63, 125, 255, .16), transparent 22%),
    radial-gradient(circle at 100% 0%, rgba(154, 89, 255, .14), transparent 24%),
    linear-gradient(90deg, transparent 0%, rgba(95, 173, 255, .07) 36%, transparent 60%, rgba(76, 121, 255, .05) 84%, transparent 100%);
}

body.home-leonardo .process-premium-section .section-head{
  position:relative;
  z-index:1;
}

body.home-leonardo .process-premium-section .section-head .eyebrow{
  background:linear-gradient(135deg, rgba(255,255,255,.9), rgba(240,246,255,.94)) !important;
  border:1px solid rgba(191, 212, 244, .95) !important;
  color:#2f74e6 !important;
  box-shadow:0 12px 28px rgba(44, 82, 145, .08) !important;
}

body.home-leonardo .process-premium-section .section-head h2{
  color:#182844 !important;
  letter-spacing:-.04em;
}

body.home-leonardo .process-premium-section .section-head p{
  color:#61738d !important;
}

body.home-leonardo .steps-premium .step-card,
body.home-leonardo .mobile-process-carousel .step-card{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(204, 219, 240, .96) !important;
  border-radius:32px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(249,252,255,.99) 100%) !important;
  box-shadow:
    0 28px 70px rgba(35, 57, 96, .10),
    inset 0 1px 0 rgba(255,255,255,.92),
    0 0 0 1px rgba(222, 231, 245, .66) !important;
}

body.home-leonardo .steps-premium .step-card::before,
body.home-leonardo .mobile-process-carousel .step-card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg, var(--step-color), color-mix(in srgb, var(--step-color) 56%, #72bfff));
  opacity:.96;
}

body.home-leonardo .steps-premium .step-card::after,
body.home-leonardo .mobile-process-carousel .step-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 88% 16%, color-mix(in srgb, var(--step-color) 14%, transparent) 0 62px, transparent 63px),
    linear-gradient(rgba(68, 118, 210, .028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(68, 118, 210, .028) 1px, transparent 1px),
    linear-gradient(135deg, transparent 0 32%, color-mix(in srgb, var(--step-color) 8%, transparent) 32.2%, transparent 32.8%) 0 0/180px 120px;
  background-size:auto, 22px 22px, 22px 22px, 180px 120px;
  opacity:1;
}

body.home-leonardo .steps-premium .step-card:hover{
  transform:translateY(-8px);
  border-color:color-mix(in srgb, var(--step-color) 24%, #d8e4f6) !important;
  box-shadow:
    0 34px 78px rgba(34, 58, 98, .14),
    0 0 0 1px color-mix(in srgb, var(--step-color) 12%, transparent),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}

body.home-leonardo .steps-premium .step-number,
body.home-leonardo .mobile-process-carousel .step-number{
  background:linear-gradient(180deg, color-mix(in srgb, var(--step-color) 12%, white), rgba(255,255,255,.95)) !important;
  border:1px solid color-mix(in srgb, var(--step-color) 18%, #eaf1fb) !important;
  color:color-mix(in srgb, var(--step-color) 82%, #244071) !important;
  box-shadow:0 10px 22px rgba(38, 63, 107, .07), inset 0 1px 0 rgba(255,255,255,.94) !important;
}

body.home-leonardo .steps-premium .step-card > .material-symbols-rounded,
body.home-leonardo .mobile-process-carousel .step-card > .material-symbols-rounded{
  background:linear-gradient(180deg, color-mix(in srgb, var(--step-color) 11%, white), rgba(255,255,255,.96)) !important;
  border:1px solid color-mix(in srgb, var(--step-color) 20%, #ebf2ff) !important;
  color:color-mix(in srgb, var(--step-color) 86%, #22406f) !important;
  box-shadow:0 12px 24px rgba(38, 63, 107, .08), inset 0 1px 0 rgba(255,255,255,.94) !important;
}

body.home-leonardo .steps-premium .step-card h3,
body.home-leonardo .mobile-process-carousel .step-card h3{
  color:#18253e !important;
  font-weight:700 !important;
}

body.home-leonardo .steps-premium .step-card p,
body.home-leonardo .mobile-process-carousel .step-card p{
  color:#62738c !important;
}

body.home-leonardo .mobile-process-carousel .mobile-carousel-controls{
  margin-top:16px !important;
  padding-inline:18px !important;
}

body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button{
  width:46px !important;
  height:46px !important;
  border-radius:14px !important;
  border:1px solid rgba(197, 214, 239, .95) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,248,255,.96)) !important;
  color:#213f73 !important;
  box-shadow:0 12px 26px rgba(34, 58, 98, .10) !important;
}

body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button:hover,
body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button:active{
  background:linear-gradient(180deg, rgba(255,255,255,.99), rgba(239,245,255,.98)) !important;
  color:#145cc7 !important;
}

@media (max-width: 680px){
  body.home-leonardo .process-premium-section{
    padding-top:64px !important;
    padding-bottom:72px !important;
    background:
      radial-gradient(circle at 8% 10%, rgba(71, 136, 255, .18), transparent 22%),
      radial-gradient(circle at 92% 88%, rgba(0, 210, 255, .12), transparent 22%),
      linear-gradient(135deg, #eff5ff 0%, #f7f9ff 42%, #fbfdff 70%, #eef8fb 100%) !important;
  }

  body.home-leonardo .process-premium-section .section-head h2{
    max-width:360px;
    font-size:clamp(2rem, 9vw, 2.75rem) !important;
  }

  body.home-leonardo .process-premium-section .section-head p{
    max-width:340px;
    font-size:.98rem !important;
    line-height:1.72 !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card{
    border-radius:30px !important;
    min-height:300px !important;
    padding:28px 20px 22px !important;
  }
}


/* =========================================================
   V50 · FOOTER PREMIUM EN CARDS DE PROCESO
   - Añade una franja inferior tecnológica para evitar espacios vacíos
   - Chips y barra de progreso visual para un look más premium/ciber IA
   ========================================================= */
body.home-leonardo .steps-premium .step-card,
body.home-leonardo .mobile-process-carousel .step-card{
  display:flex !important;
  flex-direction:column !important;
}

body.home-leonardo .steps-premium .step-card p,
body.home-leonardo .mobile-process-carousel .step-card p{
  max-width: 95%;
}

body.home-leonardo .step-card-footer{
  margin-top:auto;
  padding-top:18px;
  display:grid;
  gap:14px;
  position:relative;
  z-index:1;
}

body.home-leonardo .step-card-chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

body.home-leonardo .step-card-chips span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--step-color) 18%, #dfe9f8);
  background:linear-gradient(180deg, color-mix(in srgb, var(--step-color) 10%, #ffffff), rgba(255,255,255,.95));
  color:color-mix(in srgb, var(--step-color) 82%, #26426f);
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.01em;
  box-shadow:0 8px 18px rgba(30,55,99,.06), inset 0 1px 0 rgba(255,255,255,.95);
}

body.home-leonardo .step-card-line{
  position:relative;
  height:12px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--step-color) 16%, #e6eefb);
  background:linear-gradient(180deg, rgba(246,249,255,.95), rgba(239,245,255,.96));
  overflow:hidden;
  box-shadow:inset 0 1px 2px rgba(255,255,255,.9), 0 8px 18px rgba(32,57,99,.04);
}

body.home-leonardo .step-card-line::before{
  content:"";
  position:absolute;
  inset:2px;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(255,255,255,.26), transparent 45%, rgba(255,255,255,.16));
}

body.home-leonardo .step-card-line i{
  display:block;
  height:100%;
  border-radius:999px;
  width:68%;
  background:linear-gradient(90deg, var(--step-color), color-mix(in srgb, var(--step-color) 54%, #73c0ff));
  box-shadow:0 0 18px color-mix(in srgb, var(--step-color) 18%, transparent);
}

body.home-leonardo .step-blue .step-card-line i{width:58%;}
body.home-leonardo .step-red .step-card-line i{width:72%;}
body.home-leonardo .step-yellow .step-card-line i{width:82%;}
body.home-leonardo .step-green .step-card-line i{width:92%;}

@media (max-width: 680px){
  body.home-leonardo .mobile-process-carousel .step-card{
    min-height:320px !important;
    padding-bottom:22px !important;
  }

  body.home-leonardo .step-card-footer{
    padding-top:16px;
    gap:12px;
  }

  body.home-leonardo .step-card-chips span{
    min-height:28px;
    padding:6px 11px;
    font-size:.74rem;
  }

  body.home-leonardo .step-card-line{
    height:11px;
  }
}


/* =========================================================
   V51 · PROCESO MÓVIL MÁS COMPACTO
   - Reduce la altura total de la sección en celular
   - Sube las flechas sobre los cards
   - Compacta cards, chips y barra para que ocupen menos espacio
   ========================================================= */
@media (max-width: 680px){
  body.home-leonardo .process-premium-section{
    padding-top:52px !important;
    padding-bottom:52px !important;
  }

  body.home-leonardo .process-premium-section .section-head{
    margin-bottom:24px !important;
  }

  body.home-leonardo .process-premium-section .section-head h2{
    font-size:clamp(1.9rem, 8.2vw, 2.55rem) !important;
    line-height:1.02 !important;
    margin-bottom:12px !important;
  }

  body.home-leonardo .process-premium-section .section-head p{
    font-size:.94rem !important;
    line-height:1.62 !important;
    margin-bottom:0 !important;
  }

  body.home-leonardo .mobile-process-carousel{
    position:relative !important;
    padding:0 !important;
  }

  body.home-leonardo .mobile-process-carousel .carousel-inner{
    overflow:visible !important;
    padding:2px 0 6px !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-card-wrap{
    padding:2px 0 8px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card{
    min-height:272px !important;
    padding:22px 18px 18px !important;
    border-radius:28px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card > .material-symbols-rounded{
    top:16px !important;
    right:16px !important;
    width:44px !important;
    height:44px !important;
    font-size:22px !important;
    border-radius:14px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-number{
    width:48px !important;
    height:48px !important;
    border-radius:16px !important;
    font-size:.98rem !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card h3{
    font-size:1.18rem !important;
    margin:14px 0 8px !important;
    line-height:1.15 !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card p{
    font-size:.88rem !important;
    line-height:1.52 !important;
    max-width:100% !important;
    margin-bottom:0 !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card-footer{
    padding-top:12px !important;
    gap:10px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card-chips{
    gap:6px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card-chips span{
    min-height:26px !important;
    padding:5px 10px !important;
    font-size:.70rem !important;
    border-radius:999px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card-line{
    height:9px !important;
  }

  /* flechas sobre el card para ahorrar espacio */
  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls{
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:auto !important;
    bottom:20px !important;
    transform:none !important;
    margin:0 !important;
    padding:0 10px !important;
    z-index:12 !important;
    pointer-events:none !important;
    justify-content:space-between !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button{
    width:40px !important;
    height:40px !important;
    flex:0 0 40px !important;
    border-radius:12px !important;
    border:1px solid rgba(196, 214, 239, .96) !important;
    background:rgba(255,255,255,.92) !important;
    color:#1e4075 !important;
    box-shadow:0 10px 24px rgba(34, 58, 98, .10) !important;
    pointer-events:auto !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls .material-symbols-rounded{
    font-size:21px !important;
  }
}

@media (max-width: 430px){
  body.home-leonardo .process-premium-section{
    padding-top:48px !important;
    padding-bottom:48px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card{
    min-height:256px !important;
    padding:20px 16px 16px !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card h3{
    font-size:1.12rem !important;
  }

  body.home-leonardo .mobile-process-carousel .step-card p{
    font-size:.85rem !important;
    line-height:1.48 !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls{
    bottom:16px !important;
    padding:0 8px !important;
  }

  body.home-leonardo .mobile-process-carousel .mobile-carousel-controls button{
    width:38px !important;
    height:38px !important;
    flex-basis:38px !important;
  }
}


/* =========================================================
   V52 · PROCESO DESKTOP MÁS COMPACTO
   - Reduce la altura de las cards en desktop
   - Elimina el espacio blanco sobrante
   - Mantiene el look premium ciber IA
   ========================================================= */
@media (min-width: 681px){
  body.home-leonardo .steps-premium{
    gap:22px !important;
  }

  body.home-leonardo .steps-premium .step-card{
    min-height:292px !important;
    padding:26px 24px 18px !important;
    border-radius:28px !important;
  }

  body.home-leonardo .steps-premium .step-number{
    width:56px !important;
    height:56px !important;
    border-radius:18px !important;
    font-size:1rem !important;
  }

  body.home-leonardo .steps-premium .step-card > .material-symbols-rounded{
    top:20px !important;
    right:20px !important;
    width:52px !important;
    height:52px !important;
    border-radius:18px !important;
    font-size:24px !important;
  }

  body.home-leonardo .steps-premium .step-card h3{
    font-size:1.02rem !important;
    line-height:1.18 !important;
    margin:18px 0 8px !important;
  }

  body.home-leonardo .steps-premium .step-card p{
    font-size:.90rem !important;
    line-height:1.56 !important;
    margin-bottom:0 !important;
    max-width:100% !important;
  }

  body.home-leonardo .steps-premium .step-card-footer{
    padding-top:14px !important;
    gap:10px !important;
  }

  body.home-leonardo .steps-premium .step-card-chips{
    gap:7px !important;
  }

  body.home-leonardo .steps-premium .step-card-chips span{
    min-height:28px !important;
    padding:5px 11px !important;
    font-size:.73rem !important;
  }

  body.home-leonardo .steps-premium .step-card-line{
    height:10px !important;
  }
}

@media (min-width: 681px) and (max-width: 1100px){
  body.home-leonardo .steps-premium .step-card{
    min-height:278px !important;
    padding:24px 22px 18px !important;
  }

  body.home-leonardo .steps-premium .step-card h3{
    font-size:.98rem !important;
  }

  body.home-leonardo .steps-premium .step-card p{
    font-size:.87rem !important;
    line-height:1.5 !important;
  }
}

@media (min-width: 1101px){
  body.home-leonardo .steps-premium .step-card{
    min-height:284px !important;
  }
}


/* =========================================================
   V53 · LANDING PAGE / PROCESO EN CARRUSEL MÓVIL
   - Oculta el panel azul del hero en celular
   - Convierte las cards del proceso en carrusel móvil de a una
   - Aplica estilo colorido premium similar a portada
   ========================================================= */
body.landing-page-pro .lp-process-section{
  position:relative;
}

body.landing-page-pro .lp-steps-carousel{display:none;}
body.landing-page-pro .lp-steps-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
}

body.landing-page-pro .lp-process-card{
  --lp-accent:#2e7af0;
  position:relative;
  overflow:hidden;
  min-height:360px;
  padding:26px 26px 24px !important;
  border-radius:34px !important;
  border:1px solid color-mix(in srgb, var(--lp-accent) 28%, #d8e3f6) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(248,251,255,.98) 100%) !important;
  box-shadow:0 24px 64px rgba(29,49,83,.10), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
body.landing-page-pro .lp-process-card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg, var(--lp-accent), color-mix(in srgb, var(--lp-accent) 60%, white));
}
body.landing-page-pro .lp-process-card::after{
  content:"";
  position:absolute;
  width:138px;
  height:138px;
  right:-28px;
  top:-22px;
  border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb, var(--lp-accent) 14%, transparent) 0 56px, transparent 57px);
  opacity:.95;
  pointer-events:none;
}
body.landing-page-pro .lp-process-card.lp-blue{--lp-accent:#2875ea;}
body.landing-page-pro .lp-process-card.lp-green{--lp-accent:#32b257;}
body.landing-page-pro .lp-process-card.lp-yellow{--lp-accent:#f2a400;}
body.landing-page-pro .lp-process-card.lp-red{--lp-accent:#f24d3d;}
body.landing-page-pro .lp-process-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  position:relative;
  z-index:1;
}
body.landing-page-pro .lp-process-card .step-number{
  width:56px;
  height:56px;
  border-radius:18px;
  display:grid;
  place-items:center;
  font-size:1rem;
  font-weight:700;
  background:linear-gradient(180deg, color-mix(in srgb, var(--lp-accent) 12%, white), rgba(255,255,255,.95));
  border:1px solid color-mix(in srgb, var(--lp-accent) 22%, #e7eef9);
  color:color-mix(in srgb, var(--lp-accent) 84%, #24406f);
  box-shadow:0 12px 24px rgba(32,58,101,.08);
}
body.landing-page-pro .lp-process-card .lp-process-top > .material-symbols-rounded{
  width:70px;
  height:70px;
  border-radius:24px;
  display:grid;
  place-items:center;
  font-size:34px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--lp-accent) 8%, white), rgba(255,255,255,.95));
  border:1px solid color-mix(in srgb, var(--lp-accent) 20%, #edf2fb);
  color:var(--lp-accent);
  box-shadow:0 14px 28px rgba(33,58,99,.08), inset 0 1px 0 rgba(255,255,255,.95);
}
body.landing-page-pro .lp-process-kicker{
  display:flex;
  align-items:center;
  gap:12px;
  margin:28px 0 14px;
  color:var(--lp-accent);
  font-size:1.02rem;
  letter-spacing:.15em;
  text-transform:uppercase;
}
body.landing-page-pro .lp-process-kicker::before{
  content:"";
  width:34px;
  height:2px;
  border-radius:999px;
  background:color-mix(in srgb, var(--lp-accent) 45%, #dfe6f5);
}
body.landing-page-pro .lp-process-card h3{
  font-size:1.32rem !important;
  margin:0 0 12px !important;
  color:#152746 !important;
}
body.landing-page-pro .lp-process-card p{
  font-size:1rem !important;
  line-height:1.68 !important;
  color:#60708a !important;
  max-width:95%;
  margin:0 !important;
}
body.landing-page-pro .lp-carousel-arrow{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:12px;
  border:1px solid rgba(195,212,239,.96);
  background:rgba(255,255,255,.94);
  color:#2257a6;
  box-shadow:0 10px 24px rgba(24,44,82,.12);
}
body.landing-page-pro .lp-steps-carousel .carousel-control-prev,
body.landing-page-pro .lp-steps-carousel .carousel-control-next{
  width:auto;
  opacity:1;
  top:auto;
  bottom:18px;
}
body.landing-page-pro .lp-steps-carousel .carousel-control-prev{left:10px;}
body.landing-page-pro .lp-steps-carousel .carousel-control-next{right:10px;}

@media (max-width: 991.98px){
  body.landing-page-pro .page-hero .hero-icon-panel{display:none !important;}
}

@media (max-width: 767.98px){
  body.landing-page-pro .lp-steps-grid{display:none !important;}
  body.landing-page-pro .lp-steps-carousel{display:block !important;}
  body.landing-page-pro .lp-steps-carousel .carousel-inner{overflow:visible;}
  body.landing-page-pro .lp-steps-carousel .carousel-item{padding:2px 0 10px;}
  body.landing-page-pro .lp-process-card{
    min-height:300px;
    padding:22px 20px 72px !important;
    border-radius:30px !important;
  }
  body.landing-page-pro .lp-process-card::after{
    width:120px;
    height:120px;
    right:-24px;
    top:-16px;
  }
  body.landing-page-pro .lp-process-card .step-number{
    width:50px;height:50px;border-radius:16px;font-size:.96rem;
  }
  body.landing-page-pro .lp-process-card .lp-process-top > .material-symbols-rounded{
    width:56px;height:56px;border-radius:18px;font-size:26px;
  }
  body.landing-page-pro .lp-process-kicker{
    margin:18px 0 12px;
    font-size:.90rem;
    letter-spacing:.13em;
  }
  body.landing-page-pro .lp-process-card h3{
    font-size:1.18rem !important;
    margin-bottom:10px !important;
  }
  body.landing-page-pro .lp-process-card p{
    font-size:.92rem !important;
    line-height:1.6 !important;
    max-width:100%;
  }
}


/* =========================================================
   V54 · PROCESOS PREMIUM EN CARRUSEL MÓVIL PARA PÁGINAS DE PRODUCTO
   - Oculta paneles visuales del hero en celular
   - Convierte la sección “Un proceso ordenado…” en carrusel móvil (1 card)
   - Estilo colorido premium con degradado y trama ciber IA
   ========================================================= */
body.process-mobile-carousel-page .pmc-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(69, 134, 255, .14), transparent 20%),
    radial-gradient(circle at 88% 16%, rgba(145, 96, 255, .12), transparent 18%),
    radial-gradient(circle at 82% 80%, rgba(0, 212, 255, .10), transparent 20%),
    linear-gradient(135deg, #eef4ff 0%, #f6f8fd 42%, #fbfcff 72%, #eef7fb 100%);
}
body.process-mobile-carousel-page .pmc-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(75, 124, 216, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(75, 124, 216, .055) 1px, transparent 1px),
    linear-gradient(145deg, transparent 0 24%, rgba(88, 144, 238, .05) 24.2%, transparent 24.8%) 0 0/240px 180px,
    radial-gradient(circle at 20% 24%, rgba(81, 154, 255, .16) 0 2px, transparent 3px),
    radial-gradient(circle at 76% 64%, rgba(101, 214, 255, .12) 0 2px, transparent 3px);
  background-size:32px 32px,32px 32px,240px 180px,auto,auto;
  opacity:.95;
}
body.process-mobile-carousel-page .pmc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;}
body.process-mobile-carousel-page .pmc-carousel{display:none;}
body.process-mobile-carousel-page .pmc-card{
  --pmc-accent:#2b76ea;
  position:relative;
  overflow:hidden;
  min-height:312px;
  padding:24px 24px 22px !important;
  border-radius:32px !important;
  border:1px solid color-mix(in srgb, var(--pmc-accent) 26%, #d7e4f7) !important;
  background:linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(248,251,255,.99) 100%) !important;
  box-shadow:0 24px 62px rgba(29,49,84,.10), inset 0 1px 0 rgba(255,255,255,.95) !important;
}
body.process-mobile-carousel-page .pmc-card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg, var(--pmc-accent), color-mix(in srgb, var(--pmc-accent) 58%, white));
}
body.process-mobile-carousel-page .pmc-card::after{
  content:"";
  position:absolute;
  width:132px;height:132px;right:-24px;top:-18px;border-radius:50%;
  background:radial-gradient(circle, color-mix(in srgb, var(--pmc-accent) 14%, transparent) 0 56px, transparent 57px);
  pointer-events:none;
}
body.process-mobile-carousel-page .pmc-card-a{--pmc-accent:#2b76ea;}
body.process-mobile-carousel-page.pmc-teal .pmc-card-b, body.process-mobile-carousel-page.pmc-purple .pmc-card-b, body.process-mobile-carousel-page.pmc-blue .pmc-card-b{--pmc-accent:#34b15c;}
body.process-mobile-carousel-page .pmc-card-c{--pmc-accent:#f0a500;}
body.process-mobile-carousel-page .pmc-card-d{--pmc-accent:#f24d3d;}
body.process-mobile-carousel-page .pmc-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;position:relative;z-index:1;}
body.process-mobile-carousel-page .pmc-card .step-number{
  width:54px;height:54px;border-radius:18px;display:grid;place-items:center;font-size:1rem;font-weight:700;
  background:linear-gradient(180deg, color-mix(in srgb, var(--pmc-accent) 12%, white), rgba(255,255,255,.96));
  border:1px solid color-mix(in srgb, var(--pmc-accent) 22%, #e8eef8);
  color:color-mix(in srgb, var(--pmc-accent) 84%, #224070);
  box-shadow:0 12px 24px rgba(31,56,98,.08);
}
body.process-mobile-carousel-page .pmc-card-top > .material-symbols-rounded{
  width:64px;height:64px;border-radius:22px;display:grid;place-items:center;font-size:29px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--pmc-accent) 9%, white), rgba(255,255,255,.96));
  border:1px solid color-mix(in srgb, var(--pmc-accent) 22%, #e8eef8);
  color:var(--pmc-accent);
  box-shadow:0 12px 24px rgba(31,56,98,.08), inset 0 1px 0 rgba(255,255,255,.95);
}
body.process-mobile-carousel-page .pmc-kicker{display:flex;align-items:center;gap:12px;margin:22px 0 12px;color:var(--pmc-accent);font-size:.94rem;letter-spacing:.14em;text-transform:uppercase;}
body.process-mobile-carousel-page .pmc-kicker::before{content:"";width:32px;height:2px;border-radius:999px;background:color-mix(in srgb, var(--pmc-accent) 48%, #dbe6f5);}
body.process-mobile-carousel-page .pmc-card h3{margin:0 0 10px !important;font-size:1.22rem !important;line-height:1.18 !important;color:#172844 !important;}
body.process-mobile-carousel-page .pmc-card p{margin:0 !important;font-size:.96rem !important;line-height:1.62 !important;color:#60718c !important;max-width:96%;}
body.process-mobile-carousel-page .pmc-arrow{
  width:42px;height:42px;display:grid;place-items:center;border-radius:12px;border:1px solid rgba(196,212,238,.96);
  background:rgba(255,255,255,.95);color:#1f4c93;box-shadow:0 10px 22px rgba(25,44,82,.12);
}
body.process-mobile-carousel-page .pmc-carousel .carousel-control-prev,
body.process-mobile-carousel-page .pmc-carousel .carousel-control-next{width:auto;opacity:1;top:auto;bottom:16px;}
body.process-mobile-carousel-page .pmc-carousel .carousel-control-prev{left:10px;}
body.process-mobile-carousel-page .pmc-carousel .carousel-control-next{right:10px;}

@media (max-width: 991.98px){
  body.process-mobile-carousel-page .page-hero .hero-icon-panel{display:none !important;}
}
@media (max-width: 767.98px){
  body.process-mobile-carousel-page .pmc-grid{display:none !important;}
  body.process-mobile-carousel-page .pmc-carousel{display:block !important;}
  body.process-mobile-carousel-page .pmc-carousel .carousel-inner{overflow:visible;}
  body.process-mobile-carousel-page .pmc-carousel .carousel-item{padding:2px 0 10px;}
  body.process-mobile-carousel-page .pmc-card{min-height:294px;padding:22px 20px 72px !important;border-radius:28px !important;}
  body.process-mobile-carousel-page .pmc-card::after{width:118px;height:118px;right:-24px;top:-16px;}
  body.process-mobile-carousel-page .pmc-card .step-number{width:50px;height:50px;border-radius:16px;font-size:.96rem;}
  body.process-mobile-carousel-page .pmc-card-top > .material-symbols-rounded{width:56px;height:56px;border-radius:18px;font-size:26px;}
  body.process-mobile-carousel-page .pmc-kicker{margin:18px 0 10px;font-size:.84rem;letter-spacing:.13em;}
  body.process-mobile-carousel-page .pmc-card h3{font-size:1.16rem !important;margin-bottom:8px !important;}
  body.process-mobile-carousel-page .pmc-card p{font-size:.90rem !important;line-height:1.58 !important;max-width:100%;}
}


/* =========================================================
   V55 · SHOWCASE DE DEMOS MARKETPLACE + COTIZADOR
   - Cards de alto impacto visual con imagen, badges y botones de demo
   - Botón de catálogo general
   - Responsive premium en desktop y celular
   ========================================================= */
body.demo-showcase-page .demo-showcase-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 8% 12%, rgba(50,117,255,.16), transparent 18%),
    radial-gradient(circle at 92% 20%, rgba(139,80,255,.14), transparent 20%),
    radial-gradient(circle at 74% 82%, rgba(0,204,255,.10), transparent 22%),
    linear-gradient(135deg,#07101c 0%,#0b1728 42%,#101a31 72%,#08111e 100%);
}
body.demo-showcase-page .demo-showcase-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(104,154,240,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(104,154,240,.045) 1px, transparent 1px),
    linear-gradient(145deg, transparent 0 24%, rgba(93,153,255,.055) 24.2%, transparent 24.8%) 0 0/260px 190px;
  background-size:34px 34px,34px 34px,260px 190px;
  opacity:.85;
}
body.demo-showcase-page .demo-showcase-section .container-wide{position:relative;z-index:1;}
body.demo-showcase-page .demo-showcase-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:30px;
  margin-bottom:34px;
}
body.demo-showcase-page .demo-showcase-head .eyebrow{
  background:rgba(40,111,236,.16);
  border:1px solid rgba(100,157,255,.28);
  color:#9bc1ff;
}
body.demo-showcase-page .demo-showcase-head h2{
  max-width:820px;
  margin:16px 0 12px;
  color:#f5f8ff;
  font-size:clamp(2.1rem,4vw,3.6rem);
  line-height:1.08;
  letter-spacing:-.045em;
}
body.demo-showcase-page .demo-showcase-head p{
  max-width:860px;
  margin:0;
  color:#aebbd0;
  font-size:1.04rem;
  line-height:1.75;
}
body.demo-showcase-page .demo-catalog-button{
  min-height:52px;
  padding-inline:20px;
  border:1px solid rgba(127,162,218,.30);
  background:rgba(255,255,255,.08);
  color:#fff;
  box-shadow:0 16px 36px rgba(0,0,0,.18);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
body.demo-showcase-page .demo-catalog-button:hover{background:rgba(255,255,255,.13);color:#fff;}
body.demo-showcase-page .demo-showcase-grid{
  display:grid;
  gap:26px;
}
body.demo-showcase-page .demo-showcase-grid.two-demos{grid-template-columns:repeat(2,minmax(0,1fr));}
body.demo-showcase-page .demo-showcase-grid.one-demo{grid-template-columns:minmax(0,1fr);max-width:930px;margin-inline:auto;}
body.demo-showcase-page .demo-impact-card{
  --demo-accent:#347cff;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(101,128,173,.44);
  border-radius:34px;
  background:linear-gradient(180deg,rgba(17,28,46,.96) 0%,rgba(10,18,31,.98) 100%);
  box-shadow:0 32px 84px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);
}
body.demo-showcase-page .demo-impact-card::after{
  content:"";
  position:absolute;
  inset:auto -90px -120px auto;
  width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--demo-accent) 20%,transparent),transparent 68%);
  pointer-events:none;
}
body.demo-showcase-page .demo-blue-card{--demo-accent:#2f80ff;}
body.demo-showcase-page .demo-purple-card{--demo-accent:#8c58ff;}
body.demo-showcase-page .demo-cyan-card{--demo-accent:#13b8d7;}
body.demo-showcase-page .demo-image-frame{
  position:relative;
  display:block;
  overflow:hidden;
  aspect-ratio:16/9;
  background:#0a1422;
  border-bottom:1px solid rgba(92,119,163,.38);
}
body.demo-showcase-page .demo-image-frame img{
  width:100%;height:100%;display:block;object-fit:cover;
  transform:scale(1.015);
  transition:transform .45s ease,filter .45s ease;
  filter:saturate(1.05) contrast(1.04);
}
body.demo-showcase-page .demo-impact-card:hover .demo-image-frame img{transform:scale(1.05);filter:saturate(1.12) contrast(1.07);}
body.demo-showcase-page .demo-image-frame::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 45%,rgba(5,12,24,.24) 100%);
  pointer-events:none;
}
body.demo-showcase-page .demo-live-chip{
  position:absolute;top:16px;right:16px;z-index:3;
  display:inline-flex;align-items:center;gap:6px;
  min-height:34px;padding:8px 13px;border-radius:999px;
  background:linear-gradient(135deg,#ffd64d,#f2ac12);
  color:#563900;font-size:.75rem;font-weight:800;
  border:1px solid rgba(255,227,138,.90);
  box-shadow:0 12px 24px rgba(0,0,0,.20);
}
body.demo-showcase-page .demo-premium-chip{background:linear-gradient(135deg,#7c68ff,#ad52ff);color:#fff;border-color:rgba(209,181,255,.62);}
body.demo-showcase-page .demo-live-chip .material-symbols-rounded{font-size:16px;}
body.demo-showcase-page .demo-image-shine{
  position:absolute;inset:-30% auto -30% -22%;width:32%;z-index:2;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);
  transform:skewX(-18deg);
  transition:left .55s ease;
}
body.demo-showcase-page .demo-impact-card:hover .demo-image-shine{left:112%;}
body.demo-showcase-page .demo-impact-body{position:relative;z-index:2;padding:26px 26px 28px;}
body.demo-showcase-page .demo-impact-meta{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;}
body.demo-showcase-page .demo-impact-meta span{color:#9fb2cd;font-size:.78rem;letter-spacing:.10em;text-transform:uppercase;}
body.demo-showcase-page .demo-impact-meta b{
  display:inline-flex;align-items:center;min-height:28px;padding:6px 10px;border-radius:999px;
  background:color-mix(in srgb,var(--demo-accent) 15%,rgba(255,255,255,.04));
  border:1px solid color-mix(in srgb,var(--demo-accent) 32%,rgba(255,255,255,.08));
  color:color-mix(in srgb,var(--demo-accent) 70%,white);font-size:.72rem;
}
body.demo-showcase-page .demo-impact-body h3{margin:0 0 10px;color:#f5f8ff;font-size:1.55rem;letter-spacing:-.03em;}
body.demo-showcase-page .demo-impact-body p{margin:0;color:#a8b8ce;font-size:.95rem;line-height:1.7;}
body.demo-showcase-page .demo-impact-features{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 22px;}
body.demo-showcase-page .demo-impact-features span{
  display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:7px 11px;border-radius:999px;
  background:rgba(255,255,255,.055);border:1px solid rgba(112,139,182,.24);color:#c7d5e8;font-size:.76rem;
}
body.demo-showcase-page .demo-impact-features i{font-size:16px;color:color-mix(in srgb,var(--demo-accent) 72%,white);}
body.demo-showcase-page .demo-impact-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
body.demo-showcase-page .demo-impact-actions a{min-height:46px;border-radius:14px;font-size:.84rem;font-weight:700;}
body.demo-showcase-page .demo-primary-button{background:linear-gradient(135deg,var(--demo-accent),color-mix(in srgb,var(--demo-accent) 66%,#7049ff));color:#fff;box-shadow:0 14px 28px color-mix(in srgb,var(--demo-accent) 24%,transparent);}
body.demo-showcase-page .demo-primary-button:hover{color:#fff;transform:translateY(-2px);}
body.demo-showcase-page .demo-secondary-button{background:rgba(255,255,255,.065);border:1px solid rgba(111,139,181,.28);color:#dbe6f5;}
body.demo-showcase-page .demo-secondary-button:hover{background:rgba(255,255,255,.11);color:#fff;}
body.demo-showcase-page .cotizador-impact-card .demo-image-frame{aspect-ratio:16/8.5;}

@media (max-width: 900px){
  body.demo-showcase-page .demo-showcase-head{grid-template-columns:1fr;align-items:start;}
  body.demo-showcase-page .demo-catalog-button{justify-self:start;}
  body.demo-showcase-page .demo-showcase-grid.two-demos{grid-template-columns:1fr;}
}
@media (max-width: 680px){
  body.demo-showcase-page .demo-showcase-section{padding:72px 0 !important;}
  body.demo-showcase-page .demo-showcase-head{gap:18px;margin-bottom:24px;}
  body.demo-showcase-page .demo-showcase-head h2{font-size:2.15rem;line-height:1.05;}
  body.demo-showcase-page .demo-showcase-head p{font-size:.92rem;line-height:1.65;}
  body.demo-showcase-page .demo-catalog-button{width:100%;}
  body.demo-showcase-page .demo-impact-card{border-radius:28px;}
  body.demo-showcase-page .demo-impact-body{padding:20px 18px 20px;}
  body.demo-showcase-page .demo-impact-body h3{font-size:1.28rem;}
  body.demo-showcase-page .demo-impact-body p{font-size:.89rem;line-height:1.6;}
  body.demo-showcase-page .demo-live-chip{top:12px;right:12px;min-height:31px;padding:7px 11px;font-size:.70rem;}
  body.demo-showcase-page .demo-impact-actions{grid-template-columns:1fr;}
  body.demo-showcase-page .demo-impact-actions a{width:100%;}
  body.demo-showcase-page .cotizador-impact-card .demo-image-frame{aspect-ratio:4/3;}
}


/* =========================================================
   V56 · COTIZADOR CON DOS DEMOS
   - CMS Cotizador + Tienda Virtual Pro
   - Dos cards premium de alto impacto
   ========================================================= */
body.demo-showcase-page .demo-purple-card{
  --demo-accent:#8b5cf6;
  border-color:rgba(132, 94, 246, .34) !important;
  background:
    radial-gradient(circle at 90% 8%, rgba(145, 92, 246, .16), transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(249,247,255,.98) 100%) !important;
}
body.demo-showcase-page .demo-purple-card .demo-impact-meta b{
  color:#7c3aed !important;
  background:rgba(124,58,237,.08) !important;
  border-color:rgba(124,58,237,.16) !important;
}
body.demo-showcase-page .demo-purple-card .demo-primary-button{
  background:linear-gradient(135deg,#7c3aed,#a855f7) !important;
  box-shadow:0 14px 30px rgba(124,58,237,.22) !important;
}
body.demo-showcase-page .demo-purple-card .demo-live-chip{
  background:linear-gradient(135deg,rgba(124,58,237,.96),rgba(168,85,247,.94)) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.42) !important;
}
@media (max-width: 767.98px){
  body.demo-showcase-page .demo-showcase-grid.two-demos{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }
}


/* =========================================================
   V57 · COTIZADOR HOMOLOGA ESTILO DE AMBOS CARDS
   - El segundo card usa el mismo look base oscuro/premium del primero
   ========================================================= */
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2){
  --demo-accent:#13b8d7;
  border-color:rgba(101,128,173,.44) !important;
  background:linear-gradient(180deg,rgba(17,28,46,.96) 0%,rgba(10,18,31,.98) 100%) !important;
  box-shadow:0 32px 84px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-meta span,
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-body p,
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-features span,
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-secondary-button{
  color:inherit;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-body h3{
  color:#f5f8ff !important;
}


/* =========================================================
   V58 · HOMOLOGA TIPOGRAFÍA DEL SEGUNDO CARD EN COTIZADOR
   - Fuerza colores de texto idénticos al card izquierdo
   ========================================================= */
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-meta span{
  color:#9fb2cd !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-meta b{
  background:color-mix(in srgb,var(--demo-accent) 15%,rgba(255,255,255,.04)) !important;
  border:1px solid color-mix(in srgb,var(--demo-accent) 32%,rgba(255,255,255,.08)) !important;
  color:color-mix(in srgb,var(--demo-accent) 70%,white) !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-body h3{
  color:#f5f8ff !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-body p{
  color:#a8b8ce !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-features span{
  background:rgba(255,255,255,.055) !important;
  border:1px solid rgba(112,139,182,.24) !important;
  color:#c7d5e8 !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-features i{
  color:color-mix(in srgb,var(--demo-accent) 72%,white) !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-secondary-button{
  background:rgba(255,255,255,.065) !important;
  border:1px solid rgba(111,139,181,.28) !important;
  color:#dbe6f5 !important;
}
body.demo-showcase-page .cotizador-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-secondary-button:hover{
  background:rgba(255,255,255,.11) !important;
  color:#fff !important;
}


/* =========================================================
   V60 · COTIZADOR IMAGEN COMPLETA EN DEMOS
   - Muestra las imágenes completas dentro de los cards
   - Evita recortes en ambos previews
   ========================================================= */
body.demo-showcase-page .cotizador-demo-section .demo-image-frame{
  background:linear-gradient(180deg,#edf3fb 0%, #dfe9f8 100%) !important;
}

body.demo-showcase-page .cotizador-demo-section .demo-image-frame img{
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
  padding:0 !important;
  background:transparent !important;
}

body.demo-showcase-page .cotizador-demo-section .demo-impact-card:hover .demo-image-frame img{
  transform:none !important;
}


/* =========================================================
   V61 · MARKETPLACE DEMOS CON IMÁGENES ACTUALIZADAS
   - MercadoChile Pro usa su imagen oficial del catálogo
   - FullMarketplace 1.0 usa su imagen oficial del catálogo
   - Las imágenes se muestran completas sin recorte
   ========================================================= */
body.demo-showcase-page .marketplace-demo-section .demo-image-frame{
  background:linear-gradient(180deg,#edf3fb 0%,#dfe9f8 100%) !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-image-frame img{
  object-fit:contain !important;
  object-position:center center !important;
  transform:none !important;
  padding:0 !important;
  background:transparent !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-impact-card:hover .demo-image-frame img{
  transform:none !important;
}


/* =========================================================
   V62 · MARKETPLACE HOMOLOGA SEGUNDO CARD CON EL PRIMERO
   - El segundo card de marketplace usa el mismo estilo visual y tipográfico del izquierdo
   ========================================================= */
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2){
  --demo-accent:#2f80ff;
  border-color:rgba(101,128,173,.44) !important;
  background:linear-gradient(180deg,rgba(17,28,46,.96) 0%,rgba(10,18,31,.98) 100%) !important;
  box-shadow:0 32px 84px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-live-chip{
  background:linear-gradient(135deg,#ffd64d,#f2ac12) !important;
  color:#563900 !important;
  border-color:rgba(255,227,138,.90) !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-meta span{
  color:#9fb2cd !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-meta b{
  background:color-mix(in srgb,var(--demo-accent) 15%,rgba(255,255,255,.04)) !important;
  border:1px solid color-mix(in srgb,var(--demo-accent) 32%,rgba(255,255,255,.08)) !important;
  color:color-mix(in srgb,var(--demo-accent) 70%,white) !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-body h3{
  color:#f5f8ff !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-impact-body p{
  color:#a8b8ce !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-features span{
  background:rgba(255,255,255,.055) !important;
  border:1px solid rgba(112,139,182,.24) !important;
  color:#c7d5e8 !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-features i{
  color:color-mix(in srgb,var(--demo-accent) 72%,white) !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-primary-button{
  background:linear-gradient(135deg,var(--demo-accent),color-mix(in srgb,var(--demo-accent) 66%,#7049ff)) !important;
  color:#fff !important;
  box-shadow:0 14px 28px color-mix(in srgb,var(--demo-accent) 24%,transparent) !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-secondary-button{
  background:rgba(255,255,255,.065) !important;
  border:1px solid rgba(111,139,181,.28) !important;
  color:#dbe6f5 !important;
}
body.demo-showcase-page .marketplace-demo-section .demo-showcase-grid.two-demos .demo-impact-card:nth-child(2) .demo-secondary-button:hover{
  background:rgba(255,255,255,.11) !important;
  color:#fff !important;
}


/* =========================================================
   HERO VISUAL CON IMÁGENES PERSONALIZADAS - V63
   ========================================================= */
body.hero-bg-page .page-hero{
  position:relative;
  overflow:hidden;
  background-color:#061326;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center right;
  padding:168px 0 96px;
}
body.hero-bg-page .page-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(2,8,23,.95) 0%, rgba(4,14,35,.91) 17%, rgba(5,18,43,.83) 32%, rgba(5,18,43,.60) 48%, rgba(5,18,43,.26) 68%, rgba(5,18,43,.10) 100%),
    linear-gradient(180deg, rgba(4,10,24,.38) 0%, rgba(4,10,24,.14) 30%, rgba(4,10,24,.24) 100%);
}
body.hero-bg-page .page-hero::after{
  content:"";
  position:absolute;
  inset:auto;
  right:-90px;
  top:26px;
  width:440px;
  height:440px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(82,150,255,.18) 0%, rgba(82,150,255,.06) 42%, transparent 72%);
  filter:blur(6px);
  pointer-events:none;
}
body.hero-bg-page .page-hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,720px) minmax(0,1fr);
  align-items:center;
  gap:28px;
}
body.hero-bg-page .page-hero-copy{
  max-width:700px;
}
body.hero-bg-page .page-hero h1{
  font-size:clamp(3.15rem, 5vw, 5.6rem);
  line-height:.96;
  letter-spacing:-.065em;
  font-weight:600;
  margin:20px 0 22px;
  text-shadow:0 14px 42px rgba(0,0,0,.28);
  max-width:660px;
}
body.hero-bg-page .page-hero p{
  max-width:660px;
  font-size:1.1rem;
  line-height:1.75;
  color:rgba(255,255,255,.84);
  text-shadow:0 8px 24px rgba(0,0,0,.28);
}
body.hero-bg-page .hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.10);
  color:#fff;
  box-shadow:0 12px 30px rgba(0,0,0,.15);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
body.hero-bg-page .hero-kicker .material-symbols-rounded{
  color:#96c2ff;
}
body.hero-bg-page .hero-actions{
  margin-top:30px;
  gap:14px;
}
body.hero-bg-page .hero-actions .btn-material{
  min-height:54px;
  font-size:.95rem;
  font-weight:600;
}
body.hero-bg-page .hero-actions .btn-light{
  box-shadow:0 18px 40px rgba(3,12,29,.28);
}
body.hero-bg-page .hero-actions .btn-outline{
  border-color:rgba(255,255,255,.26);
  background:rgba(255,255,255,.07);
  color:#fff;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
body.hero-bg-page .hero-actions .btn-outline:hover{
  background:rgba(255,255,255,.13);
  border-color:rgba(255,255,255,.34);
}
body.hero-bg-page .hero-visual-spacer{
  min-height:380px;
}
body.hero-landing-visual .page-hero{background-image:url('../img/page-heroes/landing-page-hero.png'); background-position:72% center;}
body.hero-webbasica-visual .page-hero{background-image:url('../img/page-heroes/pagina-web-basica-hero.png'); background-position:74% center;}
body.hero-wordpress-visual .page-hero{background-image:url('../img/page-heroes/pagina-wordpress-hero.png'); background-position:76% center;}
body.hero-marketplace-visual .page-hero{background-image:url('../img/page-heroes/pagina-marketplace-hero.png'); background-position:75% center;}
body.hero-cotizador-visual .page-hero{background-image:url('../img/page-heroes/cotizador-productos-hero.png'); background-position:78% center;}

@media (max-width: 1540px){
  body.hero-bg-page .page-hero{padding:156px 0 86px;}
  body.hero-bg-page .page-hero-grid{grid-template-columns:minmax(0,640px) minmax(0,1fr);}
  body.hero-bg-page .page-hero h1{font-size:clamp(2.9rem,4.4vw,4.95rem); max-width:600px;}
  body.hero-bg-page .page-hero p{font-size:1.02rem; max-width:580px;}
  body.hero-bg-page .hero-visual-spacer{min-height:320px;}
}
@media (max-width: 1199.98px){
  body.hero-bg-page .page-hero{padding:144px 0 82px;}
  body.hero-bg-page .page-hero-grid{grid-template-columns:minmax(0,580px) minmax(0,1fr); gap:20px;}
  body.hero-bg-page .page-hero h1{font-size:clamp(2.7rem,4.6vw,4.2rem);}
  body.hero-bg-page .page-hero p{font-size:.98rem; line-height:1.68;}
  body.hero-bg-page .hero-visual-spacer{min-height:280px;}
  body.hero-marketplace-visual .page-hero{background-position:79% center;}
  body.hero-cotizador-visual .page-hero{background-position:82% center;}
}
@media (max-width: 991.98px){
  body.hero-bg-page .page-hero{padding:132px 0 72px; background-position:68% center;}
  body.hero-bg-page .page-hero::before{
    background:
      linear-gradient(180deg, rgba(3,10,24,.86) 0%, rgba(4,13,33,.74) 26%, rgba(4,13,33,.64) 100%),
      linear-gradient(90deg, rgba(4,13,33,.90) 0%, rgba(4,13,33,.78) 42%, rgba(4,13,33,.44) 100%);
  }
  body.hero-bg-page .page-hero-grid{grid-template-columns:1fr; gap:0;}
  body.hero-bg-page .hero-visual-spacer{display:none;}
  body.hero-bg-page .page-hero-copy{max-width:100%;}
  body.hero-bg-page .page-hero h1{max-width:580px; font-size:clamp(2.55rem,6.4vw,3.55rem);}
  body.hero-bg-page .page-hero p{max-width:540px; font-size:.98rem;}
}
@media (max-width: 680px){
  body.hero-bg-page .page-hero{
    padding:114px 0 58px;
    min-height:520px;
    background-position:75% center;
  }
  body.hero-bg-page .page-hero::before{
    background:
      linear-gradient(180deg, rgba(3,10,24,.88) 0%, rgba(4,13,33,.74) 26%, rgba(4,13,33,.70) 62%, rgba(4,13,33,.82) 100%),
      linear-gradient(90deg, rgba(4,13,33,.94) 0%, rgba(4,13,33,.80) 58%, rgba(4,13,33,.44) 100%);
  }
  body.hero-bg-page .page-hero::after{
    right:-110px;
    top:54px;
    width:260px;
    height:260px;
    background:radial-gradient(circle, rgba(82,150,255,.18) 0%, rgba(82,150,255,.06) 46%, transparent 74%);
  }
  body.hero-bg-page .page-hero h1{
    font-size:2.58rem;
    line-height:.97;
    max-width:100%;
    margin:16px 0 16px;
  }
  body.hero-bg-page .page-hero p{
    font-size:.95rem;
    line-height:1.62;
    max-width:100%;
  }
  body.hero-bg-page .hero-kicker{
    font-size:.78rem;
    padding:8px 14px;
  }
  body.hero-bg-page .hero-actions{
    display:grid;
    gap:12px;
    margin-top:22px;
  }
  body.hero-bg-page .hero-actions .btn-material{
    width:100%;
    min-height:50px;
  }
  body.hero-landing-visual .page-hero,
  body.hero-webbasica-visual .page-hero,
  body.hero-wordpress-visual .page-hero,
  body.hero-marketplace-visual .page-hero,
  body.hero-cotizador-visual .page-hero{background-position:74% center;}
}


/* =========================================================
   V64 · HERO IMAGES PARA MARKETING DIGITAL Y SUBPÁGINAS
   ========================================================= */
body.hero-bg-page.hero-googleads-visual .page-hero{background-image:url('../img/page-heroes/google-ads-hero.png');background-position:74% center;}
body.hero-bg-page.hero-redes-visual .page-hero{background-image:url('../img/page-heroes/redes-sociales-hero.png');background-position:75% center;}
body.hero-bg-page.hero-contenido-visual .page-hero{background-image:url('../img/page-heroes/generacion-contenido-hero.png');background-position:74% center;}
body.hero-bg-page.hero-influencers-visual .page-hero{background-image:url('../img/page-heroes/influencers-virtuales-hero.png');background-position:75% center;}
body.hero-bg-page.hero-logotipos-visual .page-hero{background-image:url('../img/page-heroes/diseno-logotipos-hero.png');background-position:76% center;}
body.hero-bg-page.hero-seo-visual .page-hero{background-image:url('../img/page-heroes/seo-analitica-hero.png');background-position:74% center;}

body.marketing-hero-image-page .campaign-hero{
  position:relative;
  overflow:hidden;
  padding:170px 0 98px;
  background-color:#071427;
  background-image:url('../img/page-heroes/marketing-digital-hero.png');
  background-repeat:no-repeat;
  background-size:cover;
  background-position:74% center;
}
body.marketing-hero-image-page .campaign-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(2,8,24,.95) 0%, rgba(4,13,34,.90) 18%, rgba(5,17,42,.82) 34%, rgba(5,17,42,.56) 52%, rgba(5,17,42,.20) 74%, rgba(5,17,42,.08) 100%),
    linear-gradient(180deg, rgba(4,10,24,.38) 0%, rgba(4,10,24,.14) 30%, rgba(4,10,24,.22) 100%);
}
body.marketing-hero-image-page .campaign-hero::after{
  content:"";
  position:absolute;
  right:-80px; top:24px; width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle, rgba(47,140,255,.18) 0%, rgba(208,52,255,.10) 38%, transparent 72%);
  filter:blur(8px);
  pointer-events:none;
}
body.marketing-hero-image-page .campaign-hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,710px) minmax(0,1fr);
  align-items:center;
  gap:28px;
}
body.marketing-hero-image-page .campaign-hero-copy{max-width:690px;}
body.marketing-hero-image-page .campaign-hero h1{
  font-size:clamp(3.2rem,5vw,5.3rem);
  line-height:.97;
  letter-spacing:-.055em;
  font-weight:600;
  margin:20px 0 18px;
  max-width:650px;
  text-shadow:0 14px 40px rgba(0,0,0,.30);
}
body.marketing-hero-image-page .campaign-hero p{
  max-width:640px;
  font-size:1.08rem;
  line-height:1.74;
  color:rgba(255,255,255,.84);
  text-shadow:0 8px 24px rgba(0,0,0,.28);
}
body.marketing-hero-image-page .campaign-hero .hero-kicker{
  display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:999px;
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.10);color:#fff;
  box-shadow:0 12px 30px rgba(0,0,0,.15);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
body.marketing-hero-image-page .campaign-hero .hero-kicker .material-symbols-rounded{color:#96c2ff;}
body.marketing-hero-image-page .campaign-hero .hero-actions{margin-top:30px;gap:14px;}
body.marketing-hero-image-page .campaign-hero .hero-actions .btn-material{min-height:54px;font-size:.95rem;font-weight:600;}
body.marketing-hero-image-page .campaign-hero .hero-actions .btn-light{box-shadow:0 18px 40px rgba(3,12,29,.28);}
body.marketing-hero-image-page .campaign-hero .hero-actions .btn-outline{border-color:rgba(255,255,255,.26);background:rgba(255,255,255,.07);color:#fff;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);}
body.marketing-hero-image-page .campaign-hero .hero-actions .btn-outline:hover{background:rgba(255,255,255,.13);border-color:rgba(255,255,255,.34);}
body.marketing-hero-image-page .campaign-hero-spacer{min-height:380px;}

@media (max-width:1540px){
  body.marketing-hero-image-page .campaign-hero{padding:156px 0 88px;}
  body.marketing-hero-image-page .campaign-hero-grid{grid-template-columns:minmax(0,640px) minmax(0,1fr);}
  body.marketing-hero-image-page .campaign-hero h1{font-size:clamp(3rem,4.4vw,4.8rem);max-width:600px;}
  body.marketing-hero-image-page .campaign-hero p{font-size:1rem;max-width:580px;}
  body.marketing-hero-image-page .campaign-hero-spacer{min-height:320px;}
}
@media (max-width:1199.98px){
  body.marketing-hero-image-page .campaign-hero{padding:144px 0 82px; background-position:78% center;}
  body.marketing-hero-image-page .campaign-hero-grid{grid-template-columns:minmax(0,580px) minmax(0,1fr);gap:20px;}
  body.marketing-hero-image-page .campaign-hero h1{font-size:clamp(2.8rem,4.6vw,4.2rem);}
  body.marketing-hero-image-page .campaign-hero p{font-size:.98rem;line-height:1.68;}
  body.marketing-hero-image-page .campaign-hero-spacer{min-height:280px;}
}
@media (max-width:991.98px){
  body.marketing-hero-image-page .campaign-hero{padding:132px 0 74px;background-position:70% center;}
  body.marketing-hero-image-page .campaign-hero::before{background:linear-gradient(180deg, rgba(3,10,24,.88) 0%, rgba(4,13,33,.74) 26%, rgba(4,13,33,.66) 100%),linear-gradient(90deg, rgba(4,13,33,.90) 0%, rgba(4,13,33,.78) 42%, rgba(4,13,33,.44) 100%);}
  body.marketing-hero-image-page .campaign-hero-grid{grid-template-columns:1fr;gap:0;}
  body.marketing-hero-image-page .campaign-hero-spacer{display:none;}
  body.marketing-hero-image-page .campaign-hero-copy{max-width:100%;}
  body.marketing-hero-image-page .campaign-hero h1{max-width:580px;font-size:clamp(2.55rem,6.4vw,3.55rem);}
  body.marketing-hero-image-page .campaign-hero p{max-width:540px;font-size:.98rem;}
}
@media (max-width:680px){
  body.marketing-hero-image-page .campaign-hero{padding:114px 0 58px;min-height:520px;background-position:74% center;}
  body.marketing-hero-image-page .campaign-hero::before{background:linear-gradient(180deg, rgba(3,10,24,.90) 0%, rgba(4,13,33,.76) 26%, rgba(4,13,33,.72) 62%, rgba(4,13,33,.82) 100%),linear-gradient(90deg, rgba(4,13,33,.94) 0%, rgba(4,13,33,.80) 58%, rgba(4,13,33,.44) 100%);} 
  body.marketing-hero-image-page .campaign-hero::after{right:-110px;top:54px;width:260px;height:260px;}
  body.marketing-hero-image-page .campaign-hero h1{font-size:2.56rem;line-height:.97;max-width:100%;margin:16px 0 16px;}
  body.marketing-hero-image-page .campaign-hero p{font-size:.95rem;line-height:1.62;max-width:100%;}
  body.marketing-hero-image-page .campaign-hero .hero-kicker{font-size:.78rem;padding:8px 14px;}
  body.marketing-hero-image-page .campaign-hero .hero-actions{display:grid;gap:12px;margin-top:22px;}
  body.marketing-hero-image-page .campaign-hero .hero-actions .btn-material{width:100%;min-height:50px;}
}


/* =========================================================
   V65 · HERO IA PREMIUM CON IMÁGENES REALISTAS
   ========================================================= */
body.hero-bg-page.hero-desarrollos-ia-visual .page-hero{
  background-image:url('../img/page-heroes/desarrollos-ia-hero.png');
  background-position:76% center;
}
body.hero-bg-page.hero-avances-ia-visual .page-hero{
  background-image:url('../img/page-heroes/avances-ia-hero.png');
  background-position:77% center;
}
body.hero-bg-page.hero-chatbot-ia-visual .page-hero{
  background-image:url('../img/page-heroes/chatbot-ia-hero.png');
  background-position:78% center;
}
body.hero-bg-page.hero-deepprop-ia-visual .page-hero{
  background-image:url('../img/page-heroes/chat-deepprop-ia-hero.png');
  background-position:79% center;
}

/* Ajuste de overlay para mantener legibilidad del contenido en IA */
body.hero-bg-page.hero-desarrollos-ia-visual .page-hero::before,
body.hero-bg-page.hero-avances-ia-visual .page-hero::before,
body.hero-bg-page.hero-chatbot-ia-visual .page-hero::before,
body.hero-bg-page.hero-deepprop-ia-visual .page-hero::before{
  background:
    linear-gradient(90deg, rgba(3,7,18,.97) 0%, rgba(5,10,25,.94) 18%, rgba(8,10,31,.85) 34%, rgba(13,8,31,.60) 49%, rgba(12,7,27,.20) 70%, rgba(7,5,18,.06) 100%),
    linear-gradient(180deg, rgba(2,5,14,.30) 0%, rgba(3,6,18,.10) 40%, rgba(3,6,18,.26) 100%);
}
body.hero-bg-page.hero-desarrollos-ia-visual .page-hero h1,
body.hero-bg-page.hero-avances-ia-visual .page-hero h1,
body.hero-bg-page.hero-chatbot-ia-visual .page-hero h1,
body.hero-bg-page.hero-deepprop-ia-visual .page-hero h1{
  color:#fff !important;
  max-width:680px;
}

body.ai-hero-image-page .campaign-hero{
  position:relative;
  overflow:hidden;
  padding:168px 0 98px;
  background-color:#050914;
  background-image:url('../img/page-heroes/inteligencia-artificial-negocio-hero.png');
  background-repeat:no-repeat;
  background-size:cover;
  background-position:75% center;
}
body.ai-hero-image-page .campaign-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(2,6,17,.98) 0%, rgba(4,8,22,.95) 18%, rgba(8,9,28,.87) 34%, rgba(16,7,31,.61) 51%, rgba(18,6,29,.22) 71%, rgba(7,4,16,.07) 100%),
    linear-gradient(180deg, rgba(3,5,14,.32) 0%, rgba(5,4,15,.10) 40%, rgba(5,4,15,.26) 100%);
}
body.ai-hero-image-page .campaign-hero::after{
  content:"";
  position:absolute;
  right:-110px;
  top:20px;
  width:460px;
  height:460px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(219,25,92,.16) 0%, rgba(131,46,199,.09) 42%, transparent 73%);
  filter:blur(10px);
  pointer-events:none;
}
body.ai-hero-image-page .campaign-hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,720px) minmax(0,1fr);
  align-items:center;
  gap:28px;
}
body.ai-hero-image-page .campaign-hero-copy{max-width:700px;}
body.ai-hero-image-page .campaign-hero h1{
  max-width:680px;
  margin:20px 0 20px;
  font-size:clamp(3.1rem,5vw,5.35rem);
  line-height:.97;
  letter-spacing:-.055em;
  font-weight:600;
  color:#fff;
  text-shadow:0 16px 44px rgba(0,0,0,.34);
}
body.ai-hero-image-page .campaign-hero p{
  max-width:650px;
  color:rgba(255,255,255,.84);
  font-size:1.08rem;
  line-height:1.72;
  text-shadow:0 8px 24px rgba(0,0,0,.28);
}
body.ai-hero-image-page .campaign-hero .hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  color:#fff;
  box-shadow:0 12px 30px rgba(0,0,0,.16);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
body.ai-hero-image-page .campaign-hero .hero-kicker .material-symbols-rounded{color:#ff4d8b;}
body.ai-hero-image-page .campaign-hero .hero-actions{margin-top:30px;gap:14px;}
body.ai-hero-image-page .campaign-hero .hero-actions .btn-material{min-height:54px;font-size:.95rem;font-weight:600;}
body.ai-hero-image-page .campaign-hero .hero-actions .btn-outline{
  border-color:rgba(255,255,255,.26);
  background:rgba(255,255,255,.06);
  color:#fff;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
body.ai-hero-image-page .campaign-hero .hero-actions .btn-outline:hover{background:rgba(255,255,255,.12);}
body.ai-hero-image-page .campaign-hero-spacer{min-height:380px;}

@media (max-width:1540px){
  body.ai-hero-image-page .campaign-hero{padding:156px 0 88px;}
  body.ai-hero-image-page .campaign-hero-grid{grid-template-columns:minmax(0,640px) minmax(0,1fr);}
  body.ai-hero-image-page .campaign-hero h1{font-size:clamp(2.9rem,4.4vw,4.8rem);max-width:610px;}
  body.ai-hero-image-page .campaign-hero p{font-size:1rem;max-width:590px;}
  body.ai-hero-image-page .campaign-hero-spacer{min-height:320px;}
}
@media (max-width:1199.98px){
  body.ai-hero-image-page .campaign-hero{padding:144px 0 82px;background-position:79% center;}
  body.ai-hero-image-page .campaign-hero-grid{grid-template-columns:minmax(0,575px) minmax(0,1fr);gap:20px;}
  body.ai-hero-image-page .campaign-hero h1{font-size:clamp(2.7rem,4.6vw,4.1rem);}
  body.ai-hero-image-page .campaign-hero p{font-size:.98rem;line-height:1.66;}
  body.ai-hero-image-page .campaign-hero-spacer{min-height:280px;}
}
@media (max-width:991.98px){
  body.hero-bg-page.hero-desarrollos-ia-visual .page-hero,
  body.hero-bg-page.hero-avances-ia-visual .page-hero,
  body.hero-bg-page.hero-chatbot-ia-visual .page-hero,
  body.hero-bg-page.hero-deepprop-ia-visual .page-hero{background-position:71% center;}
  body.ai-hero-image-page .campaign-hero{padding:132px 0 74px;background-position:72% center;}
  body.ai-hero-image-page .campaign-hero::before{
    background:
      linear-gradient(180deg, rgba(3,6,18,.90) 0%, rgba(7,7,23,.78) 29%, rgba(9,6,24,.70) 100%),
      linear-gradient(90deg, rgba(3,7,19,.94) 0%, rgba(8,7,24,.84) 48%, rgba(12,7,27,.48) 100%);
  }
  body.ai-hero-image-page .campaign-hero-grid{grid-template-columns:1fr;gap:0;}
  body.ai-hero-image-page .campaign-hero-spacer{display:none;}
  body.ai-hero-image-page .campaign-hero-copy{max-width:100%;}
  body.ai-hero-image-page .campaign-hero h1{max-width:600px;font-size:clamp(2.5rem,6.4vw,3.55rem);}
  body.ai-hero-image-page .campaign-hero p{max-width:550px;font-size:.98rem;}
}
@media (max-width:680px){
  body.hero-bg-page.hero-desarrollos-ia-visual .page-hero,
  body.hero-bg-page.hero-avances-ia-visual .page-hero,
  body.hero-bg-page.hero-chatbot-ia-visual .page-hero,
  body.hero-bg-page.hero-deepprop-ia-visual .page-hero{background-position:72% center;}
  body.ai-hero-image-page .campaign-hero{padding:114px 0 58px;min-height:520px;background-position:72% center;}
  body.ai-hero-image-page .campaign-hero::before{
    background:
      linear-gradient(180deg, rgba(3,6,18,.92) 0%, rgba(7,7,23,.80) 26%, rgba(8,6,24,.75) 62%, rgba(5,5,18,.84) 100%),
      linear-gradient(90deg, rgba(3,7,19,.95) 0%, rgba(8,7,24,.84) 60%, rgba(12,7,27,.48) 100%);
  }
  body.ai-hero-image-page .campaign-hero h1{font-size:2.5rem;line-height:.98;max-width:100%;margin:16px 0 16px;}
  body.ai-hero-image-page .campaign-hero p{font-size:.94rem;line-height:1.6;max-width:100%;}
  body.ai-hero-image-page .campaign-hero .hero-kicker{font-size:.76rem;padding:8px 13px;}
  body.ai-hero-image-page .campaign-hero .hero-actions{display:grid;gap:12px;margin-top:22px;}
  body.ai-hero-image-page .campaign-hero .hero-actions .btn-material{width:100%;min-height:50px;}
}


/* =========================================================
   V66 · CORRETAJE PREMIUM + HERO FOTOGRÁFICOS + CARDS IA
   ========================================================= */

/* ---------- Hero principal Corretaje ---------- */
body.re-campaign-v66 .campaign-hero{
  position:relative;
  overflow:hidden;
  min-height:690px;
  padding:168px 0 96px;
  background:#0b1018 url('../img/page-heroes/corretaje-v66/corretaje-hero.webp') no-repeat 76% center/cover;
}
body.re-campaign-v66 .campaign-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    linear-gradient(90deg,rgba(8,11,17,.97) 0%,rgba(13,17,25,.92) 18%,rgba(18,21,31,.79) 35%,rgba(18,21,31,.50) 52%,rgba(15,18,26,.18) 73%,rgba(10,13,18,.05) 100%),
    linear-gradient(180deg,rgba(8,10,14,.24),rgba(8,10,14,.08) 45%,rgba(8,10,14,.25));
}
body.re-campaign-v66 .campaign-hero::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 72% 25%,rgba(255,56,74,.12),transparent 22%),
    linear-gradient(115deg,transparent 0 46%,rgba(255,255,255,.035) 47%,transparent 48% 100%);
}
body.re-campaign-v66 .campaign-hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,690px) minmax(0,1fr);
  align-items:center;
  gap:30px;
}
body.re-campaign-v66 .campaign-hero-copy{max-width:680px;}
body.re-campaign-v66 .campaign-hero h1{
  max-width:670px;
  margin:20px 0 20px;
  color:#fff;
  font-size:clamp(3.15rem,5vw,5.35rem);
  line-height:.97;
  letter-spacing:-.055em;
  font-weight:650;
  text-shadow:0 16px 46px rgba(0,0,0,.34);
}
body.re-campaign-v66 .campaign-hero p{
  max-width:630px;
  color:rgba(255,255,255,.84);
  font-size:1.07rem;
  line-height:1.72;
  text-shadow:0 8px 25px rgba(0,0,0,.28);
}
body.re-campaign-v66 .campaign-hero .hero-kicker{
  display:inline-flex;align-items:center;gap:9px;
  padding:10px 16px;border:1px solid rgba(255,255,255,.17);border-radius:999px;
  color:#fff;background:rgba(15,20,29,.46);box-shadow:0 12px 32px rgba(0,0,0,.16);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
body.re-campaign-v66 .campaign-hero .hero-kicker .material-symbols-rounded{color:#ff5266;}
body.re-campaign-v66 .campaign-hero .hero-actions{margin-top:30px;gap:14px;}
body.re-campaign-v66 .campaign-hero .hero-actions .btn-material{min-height:54px;font-weight:650;}
body.re-campaign-v66 .campaign-hero .btn-light{box-shadow:0 18px 42px rgba(0,0,0,.25);}
body.re-campaign-v66 .campaign-hero .btn-outline{
  color:#fff;border-color:rgba(255,255,255,.25);background:rgba(255,255,255,.07);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
body.re-campaign-v66 .campaign-visual{min-height:390px;opacity:0;pointer-events:none;}

/* ---------- Imágenes hero por página ---------- */
body.hero-bg-page.hero-corretaje-landing-v66 .page-hero{background-image:url('../img/page-heroes/corretaje-v66/corretaje-landing-hero.webp');background-position:76% center;}
body.hero-bg-page.hero-corretaje-basica-v66 .page-hero{background-image:url('../img/page-heroes/corretaje-v66/corretaje-basica-hero.webp');background-position:76% center;}
body.hero-bg-page.hero-corretaje-profesional-v66 .page-hero{background-image:url('../img/page-heroes/corretaje-v66/corretaje-profesional-hero.webp');background-position:78% center;}
body.hero-bg-page.hero-corretaje-marketplace-v66 .page-hero{background-image:url('../img/page-heroes/corretaje-v66/corretaje-marketplace-hero.webp');background-position:77% center;}
body.hero-bg-page.hero-integracion-portales-v66 .page-hero{background-image:url('../img/page-heroes/corretaje-v66/integracion-portales-hero.webp');background-position:78% center;}
body.hero-bg-page.hero-portafolio-clientes-v66 .page-hero{background-image:url('../img/page-heroes/corretaje-v66/portafolio-clientes-hero.webp');background-position:78% center;}

body.re-premium-v66.hero-bg-page .page-hero::before{
  background:
    linear-gradient(90deg,rgba(6,10,17,.97) 0%,rgba(10,15,24,.93) 18%,rgba(14,19,29,.82) 34%,rgba(14,19,29,.57) 50%,rgba(13,17,25,.20) 72%,rgba(10,13,18,.06) 100%),
    linear-gradient(180deg,rgba(6,8,14,.20),rgba(6,8,14,.07) 45%,rgba(6,8,14,.23));
}
body.re-premium-v66.hero-bg-page .page-hero::after{
  background:radial-gradient(circle,rgba(255,68,82,.13) 0%,rgba(70,113,255,.06) 40%,transparent 73%);
}
body.re-premium-v66.hero-bg-page .page-hero h1{color:#fff!important;text-shadow:0 15px 42px rgba(0,0,0,.34);}
body.re-premium-v66.hero-bg-page .page-hero p{color:rgba(255,255,255,.84)!important;}
body.re-premium-v66.hero-bg-page .hero-kicker{background:rgba(10,16,25,.48);border-color:rgba(255,255,255,.17);}
body.re-premium-v66.hero-bg-page .hero-kicker .material-symbols-rounded{color:#ff5266;}

/* ---------- Secciones premium con trama tecnológica ---------- */
body.re-premium-v66 .section,
body.re-premium-v66 .campaign-section,
body.re-premium-v66 .campaign-options-section{
  position:relative;
  overflow:hidden;
}
body.re-premium-v66 .section-soft,
body.re-premium-v66 .campaign-options-section{
  background:
    radial-gradient(circle at 10% 10%,rgba(44,116,255,.09),transparent 28%),
    radial-gradient(circle at 90% 18%,rgba(255,60,78,.07),transparent 25%),
    linear-gradient(180deg,#f8fbff 0%,#eef4fb 100%);
}
body.re-premium-v66 .section-soft::before,
body.re-premium-v66 .campaign-options-section::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background-image:
    linear-gradient(rgba(62,105,160,.07) 1px,transparent 1px),
    linear-gradient(90deg,rgba(62,105,160,.07) 1px,transparent 1px),
    radial-gradient(circle at 20% 30%,rgba(34,93,180,.14) 0 2px,transparent 2.5px),
    radial-gradient(circle at 70% 60%,rgba(224,66,76,.12) 0 2px,transparent 2.5px);
  background-size:46px 46px,46px 46px,180px 180px,210px 210px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.85),rgba(0,0,0,.28));
}
body.re-premium-v66 .section>.container-wide,
body.re-premium-v66 .section-soft>.container-wide,
body.re-premium-v66 .campaign-options-section>.container-wide,
body.re-premium-v66 .campaign-section>.container-wide{position:relative;z-index:2;}
body.re-premium-v66 .section-head .eyebrow,
body.re-premium-v66 .campaign-options-head .eyebrow{
  display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;
  border:1px solid rgba(33,101,210,.16);background:rgba(255,255,255,.74);
  box-shadow:0 8px 22px rgba(31,74,130,.08);backdrop-filter:blur(8px);
}
body.re-premium-v66 .section-head h2,
body.re-premium-v66 .campaign-options-head h2{letter-spacing:-.035em;}

/* ---------- Cards coloridas / vidrio premium ---------- */
body.re-premium-v66 .feature-grid,
body.re-premium-v66 .steps-grid,
body.re-premium-v66 .campaign-options-grid,
body.re-premium-v66 .campaign-features{gap:24px;}
body.re-premium-v66 .feature-card,
body.re-premium-v66 .step-card,
body.re-premium-v66 .campaign-option-card,
body.re-premium-v66 .campaign-feature{
  --accent:#2f7cff;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  border-radius:26px!important;
  border:1px solid color-mix(in srgb,var(--accent) 24%,#dce6f2)!important;
  background:
    linear-gradient(145deg,rgba(255,255,255,.97),rgba(249,252,255,.91))!important;
  box-shadow:0 22px 54px rgba(27,54,92,.11),inset 0 1px 0 rgba(255,255,255,.92)!important;
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;
}
body.re-premium-v66 .feature-card::before,
body.re-premium-v66 .step-card::before,
body.re-premium-v66 .campaign-option-card::before,
body.re-premium-v66 .campaign-feature::before{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;z-index:0;
  background:linear-gradient(90deg,var(--accent),color-mix(in srgb,var(--accent) 50%,#ffffff));
}
body.re-premium-v66 .feature-card::after,
body.re-premium-v66 .step-card::after,
body.re-premium-v66 .campaign-option-card::after,
body.re-premium-v66 .campaign-feature::after{
  content:"";position:absolute;right:-54px;top:-54px;width:160px;height:160px;border-radius:50%;z-index:-1;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 16%,transparent),transparent 68%);
}
body.re-premium-v66 .feature-card:hover,
body.re-premium-v66 .step-card:hover,
body.re-premium-v66 .campaign-option-card:hover,
body.re-premium-v66 .campaign-feature:hover{
  transform:translateY(-7px);
  border-color:color-mix(in srgb,var(--accent) 44%,#dce6f2)!important;
  box-shadow:0 30px 72px rgba(27,54,92,.16),0 0 0 1px color-mix(in srgb,var(--accent) 10%,transparent)!important;
}
body.re-premium-v66 .feature-card:nth-child(6n+1),body.re-premium-v66 .step-card:nth-child(6n+1),body.re-premium-v66 .campaign-option-card:nth-child(6n+1),body.re-premium-v66 .campaign-feature:nth-child(6n+1){--accent:#2878ff;}
body.re-premium-v66 .feature-card:nth-child(6n+2),body.re-premium-v66 .step-card:nth-child(6n+2),body.re-premium-v66 .campaign-option-card:nth-child(6n+2),body.re-premium-v66 .campaign-feature:nth-child(6n+2){--accent:#ef4452;}
body.re-premium-v66 .feature-card:nth-child(6n+3),body.re-premium-v66 .step-card:nth-child(6n+3),body.re-premium-v66 .campaign-option-card:nth-child(6n+3),body.re-premium-v66 .campaign-feature:nth-child(6n+3){--accent:#7447e8;}
body.re-premium-v66 .feature-card:nth-child(6n+4),body.re-premium-v66 .step-card:nth-child(6n+4),body.re-premium-v66 .campaign-option-card:nth-child(6n+4),body.re-premium-v66 .campaign-feature:nth-child(6n+4){--accent:#159a69;}
body.re-premium-v66 .feature-card:nth-child(6n+5),body.re-premium-v66 .step-card:nth-child(6n+5),body.re-premium-v66 .campaign-option-card:nth-child(6n+5),body.re-premium-v66 .campaign-feature:nth-child(6n+5){--accent:#e59a16;}
body.re-premium-v66 .feature-card:nth-child(6n+6),body.re-premium-v66 .step-card:nth-child(6n+6),body.re-premium-v66 .campaign-option-card:nth-child(6n+6),body.re-premium-v66 .campaign-feature:nth-child(6n+6){--accent:#d83c82;}
body.re-premium-v66 .feature-card>.material-symbols-rounded,
body.re-premium-v66 .campaign-feature>.material-symbols-rounded,
body.re-premium-v66 .campaign-option-card>.material-symbols-rounded:first-child{
  width:58px;height:58px;display:grid;place-items:center;border-radius:18px;
  color:var(--accent)!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 14%,#fff),#fff)!important;
  border:1px solid color-mix(in srgb,var(--accent) 22%,#e7eef7)!important;
  box-shadow:0 14px 28px color-mix(in srgb,var(--accent) 12%,transparent)!important;
}
body.re-premium-v66 .feature-card h3,
body.re-premium-v66 .step-card h3,
body.re-premium-v66 .campaign-feature h3,
body.re-premium-v66 .campaign-option-card strong{color:#152034!important;letter-spacing:-.025em;}
body.re-premium-v66 .feature-card p,
body.re-premium-v66 .step-card p,
body.re-premium-v66 .campaign-feature p{color:#62738d!important;}
body.re-premium-v66 .step-number{
  color:var(--accent)!important;
  background:color-mix(in srgb,var(--accent) 10%,#fff)!important;
  border:1px solid color-mix(in srgb,var(--accent) 18%,#e5ecf5)!important;
  box-shadow:0 10px 22px color-mix(in srgb,var(--accent) 10%,transparent);
}
body.re-premium-v66 .campaign-option-card small{color:var(--accent)!important;font-weight:700;}

/* ---------- Banda y CTA ---------- */
body.re-premium-v66 .campaign-band{
  background:
    radial-gradient(circle at 15% 30%,rgba(255,66,78,.17),transparent 24%),
    radial-gradient(circle at 85% 20%,rgba(58,115,255,.18),transparent 26%),
    linear-gradient(110deg,#101722,#17243a 52%,#101722)!important;
  border-block:1px solid rgba(255,255,255,.08);
}
body.re-premium-v66 .campaign-stat{position:relative;}
body.re-premium-v66 .campaign-stat b{color:#fff!important;text-shadow:0 0 24px rgba(58,119,255,.18);}
body.re-premium-v66 .campaign-stat span{color:rgba(255,255,255,.68)!important;}
body.re-premium-v66 .cta-panel{
  border:1px solid rgba(68,115,184,.20)!important;border-radius:30px!important;
  background:
    radial-gradient(circle at 88% 20%,rgba(255,68,82,.12),transparent 28%),
    radial-gradient(circle at 8% 80%,rgba(47,124,255,.10),transparent 26%),
    linear-gradient(135deg,#101824,#1a2a42)!important;
  box-shadow:0 28px 72px rgba(19,40,72,.20)!important;
}
body.re-premium-v66 .cta-panel h2{color:#fff!important;}
body.re-premium-v66 .cta-panel p{color:rgba(255,255,255,.70)!important;}

@media (max-width:1540px){
  body.re-campaign-v66 .campaign-hero{min-height:620px;padding:152px 0 82px;background-position:78% center;}
  body.re-campaign-v66 .campaign-hero-grid{grid-template-columns:minmax(0,620px) minmax(0,1fr);}
  body.re-campaign-v66 .campaign-hero h1{font-size:clamp(2.9rem,4.5vw,4.75rem);max-width:610px;}
  body.re-campaign-v66 .campaign-visual{min-height:320px;}
}
@media (max-width:1199.98px){
  body.re-campaign-v66 .campaign-hero{min-height:570px;padding:138px 0 76px;background-position:80% center;}
  body.re-campaign-v66 .campaign-hero-grid{grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:20px;}
  body.re-campaign-v66 .campaign-hero h1{font-size:clamp(2.65rem,4.7vw,4rem);}
  body.re-campaign-v66 .campaign-hero p{font-size:.98rem;}
  body.re-campaign-v66 .campaign-visual{min-height:270px;}
}
@media (max-width:991.98px){
  body.re-campaign-v66 .campaign-hero{min-height:540px;padding:126px 0 68px;background-position:70% center;}
  body.re-campaign-v66 .campaign-hero::before{
    background:linear-gradient(180deg,rgba(8,11,17,.91),rgba(12,16,24,.75) 32%,rgba(12,16,24,.78)),linear-gradient(90deg,rgba(8,11,17,.94),rgba(12,16,24,.75) 58%,rgba(12,16,24,.40));
  }
  body.re-campaign-v66 .campaign-hero-grid{grid-template-columns:1fr;gap:0;}
  body.re-campaign-v66 .campaign-visual{display:none;}
  body.re-campaign-v66 .campaign-hero-copy{max-width:100%;}
  body.re-campaign-v66 .campaign-hero h1{max-width:590px;font-size:clamp(2.45rem,6.2vw,3.45rem);}
  body.re-campaign-v66 .campaign-hero p{max-width:545px;}
}
@media (max-width:680px){
  body.re-campaign-v66 .campaign-hero{min-height:500px;padding:110px 0 54px;background-position:72% center;}
  body.re-campaign-v66 .campaign-hero h1{font-size:2.42rem;line-height:.98;margin:15px 0 15px;}
  body.re-campaign-v66 .campaign-hero p{font-size:.93rem;line-height:1.58;}
  body.re-campaign-v66 .campaign-hero .hero-kicker{font-size:.75rem;padding:8px 12px;}
  body.re-campaign-v66 .campaign-hero .hero-actions{display:grid;gap:10px;margin-top:20px;}
  body.re-campaign-v66 .campaign-hero .hero-actions .btn-material{width:100%;min-height:50px;}
  body.re-premium-v66.hero-bg-page .page-hero{background-position:72% center;}
  body.re-premium-v66 .feature-grid,
  body.re-premium-v66 .steps-grid,
  body.re-premium-v66 .campaign-options-grid,
  body.re-premium-v66 .campaign-features{gap:16px;}
  body.re-premium-v66 .feature-card,
  body.re-premium-v66 .step-card,
  body.re-premium-v66 .campaign-option-card,
  body.re-premium-v66 .campaign-feature{border-radius:22px!important;}
}


/* =========================================================
   V67 · DEMOS PREMIUM CORRETAJE
   ========================================================= */
.re-demo-showcase{
  position:relative;
  overflow:hidden;
  padding:92px 0 !important;
  background:
    radial-gradient(circle at 8% 12%,rgba(43,112,255,.13),transparent 26%),
    radial-gradient(circle at 92% 82%,rgba(239,63,71,.10),transparent 27%),
    linear-gradient(135deg,#07111f 0%,#0d1a2d 48%,#101b2a 100%);
  color:#fff;
}
.re-demo-showcase::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.38;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    radial-gradient(circle at 18% 28%,rgba(72,132,255,.55) 0 2px,transparent 3px),
    radial-gradient(circle at 82% 68%,rgba(244,78,85,.46) 0 2px,transparent 3px);
  background-size:44px 44px,44px 44px,180px 180px,220px 220px;
  mask-image:linear-gradient(90deg,rgba(0,0,0,.75),rgba(0,0,0,.18),rgba(0,0,0,.7));
}
.re-demo-showcase .container-wide{position:relative;z-index:1;}
.re-demo-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,520px);gap:42px;align-items:end;margin-bottom:34px;}
.re-demo-head .eyebrow{color:#78aaff;}
.re-demo-head h2{margin:8px 0 0;color:#fff;font-size:clamp(2.2rem,3.7vw,4rem);line-height:1.02;letter-spacing:-.055em;max-width:850px;}
.re-demo-head p{margin:0;color:#aebdd2;font-size:1rem;line-height:1.75;}
.re-demo-grid{display:grid;gap:24px;align-items:stretch;}
.re-demo-grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}
.re-demo-grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.re-demo-card{
  --demo-accent:#438cff;
  position:relative;overflow:hidden;display:flex;flex-direction:column;min-width:0;
  border:1px solid color-mix(in srgb,var(--demo-accent) 38%,rgba(255,255,255,.08));
  border-radius:30px;
  background:linear-gradient(180deg,rgba(20,33,53,.96) 0%,rgba(9,18,31,.98) 100%);
  box-shadow:0 28px 72px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.re-demo-card:hover{transform:translateY(-7px);border-color:color-mix(in srgb,var(--demo-accent) 66%,white 10%);box-shadow:0 38px 90px rgba(0,0,0,.40),0 0 42px color-mix(in srgb,var(--demo-accent) 15%,transparent);}
.re-demo-card::after{content:"";position:absolute;inset:auto -16% -35% 38%;height:58%;background:radial-gradient(circle,color-mix(in srgb,var(--demo-accent) 13%,transparent),transparent 70%);pointer-events:none;}
.re-demo-blue{--demo-accent:#3887ff}.re-demo-red{--demo-accent:#ff4d5f}.re-demo-violet{--demo-accent:#8a6cff}.re-demo-green{--demo-accent:#32c676}.re-demo-amber{--demo-accent:#f4b83d}
.re-demo-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:#0b1422;border-bottom:1px solid rgba(255,255,255,.08);}
.re-demo-media img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#e9edf3;transition:transform .35s ease,filter .35s ease;}
.re-demo-card:hover .re-demo-media img{transform:scale(1.018);filter:saturate(1.06) contrast(1.03);}
.re-demo-media::after{content:"";position:absolute;inset:auto 0 0;height:42%;background:linear-gradient(180deg,transparent,rgba(6,14,26,.72));pointer-events:none;}
.re-demo-status{position:absolute;right:16px;top:16px;z-index:2;display:inline-flex;align-items:center;gap:6px;min-height:34px;padding:7px 12px;border-radius:999px;background:linear-gradient(135deg,var(--demo-accent),color-mix(in srgb,var(--demo-accent) 68%,#7555ff));border:1px solid rgba(255,255,255,.28);box-shadow:0 10px 24px rgba(0,0,0,.24);color:#fff;font-size:.72rem;font-weight:800;letter-spacing:.02em;}
.re-demo-status .material-symbols-rounded{font-size:16px;}
.re-demo-body{position:relative;z-index:2;display:flex;flex-direction:column;flex:1;padding:25px 25px 26px;}
.re-demo-eyebrow{display:block;margin-bottom:10px;color:color-mix(in srgb,var(--demo-accent) 72%,white);font-size:.74rem;line-height:1.3;font-weight:800;text-transform:uppercase;letter-spacing:.12em;}
.re-demo-body h3{margin:0 0 10px;color:#f6f8fc;font-size:1.48rem;letter-spacing:-.035em;}
.re-demo-body p{margin:0;color:#aab8cc;font-size:.93rem;line-height:1.67;}
.re-demo-chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 22px;}
.re-demo-chips span{display:inline-flex;align-items:center;gap:5px;padding:7px 10px;border-radius:999px;border:1px solid color-mix(in srgb,var(--demo-accent) 25%,rgba(255,255,255,.1));background:color-mix(in srgb,var(--demo-accent) 8%,rgba(255,255,255,.035));color:#c9d5e5;font-size:.74rem;font-weight:600;}
.re-demo-chips .material-symbols-rounded{font-size:14px;color:color-mix(in srgb,var(--demo-accent) 76%,white);}
.re-demo-button{display:flex;align-items:center;justify-content:center;gap:8px;min-height:48px;margin-top:auto;border-radius:15px;background:linear-gradient(135deg,var(--demo-accent),color-mix(in srgb,var(--demo-accent) 70%,#7555ff));box-shadow:0 13px 28px color-mix(in srgb,var(--demo-accent) 20%,transparent);color:#fff;text-decoration:none;font-size:.87rem;font-weight:800;transition:transform .2s ease,filter .2s ease;}
.re-demo-button:hover{color:#fff;transform:translateY(-2px);filter:brightness(1.08);}
.re-demo-button .material-symbols-rounded{font-size:19px;}
.re-demo-catalog-wrap{position:relative;z-index:2;display:flex;justify-content:center;padding:0 20px 80px;margin-top:-54px;background:linear-gradient(180deg,transparent,#07111f 42%);}
.re-demo-catalog{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:52px;padding:0 24px;border-radius:16px;border:1px solid rgba(118,157,217,.32);background:linear-gradient(135deg,#203b60,#172a46);box-shadow:0 16px 40px rgba(2,8,18,.28);color:#fff;text-decoration:none;font-weight:800;transition:.22s ease;}
.re-demo-catalog:hover{color:#fff;transform:translateY(-2px);border-color:rgba(126,176,255,.52);background:linear-gradient(135deg,#28517f,#1d395f);}
.re-demo-ai{background:radial-gradient(circle at 86% 16%,rgba(139,86,255,.16),transparent 27%),radial-gradient(circle at 10% 82%,rgba(245,66,85,.12),transparent 24%),linear-gradient(135deg,#0d1020,#15132a 50%,#111a2b);}
.re-demo-modules{background:radial-gradient(circle at 9% 18%,rgba(54,203,122,.11),transparent 27%),radial-gradient(circle at 90% 78%,rgba(246,184,61,.11),transparent 26%),linear-gradient(135deg,#071421,#101d2a 50%,#111a24);}
.re-catalog-section{padding:72px 0 !important;background:linear-gradient(180deg,#f3f7fc,#eef4fb);}
.re-catalog-panel{position:relative;overflow:hidden;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:26px;padding:34px 38px;border:1px solid rgba(64,111,181,.18);border-radius:30px;background:linear-gradient(135deg,#fff 0%,#f7faff 52%,#edf5ff 100%);box-shadow:0 24px 62px rgba(42,76,125,.12);}
.re-catalog-panel::after{content:"";position:absolute;right:-90px;top:-110px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(63,135,255,.17),transparent 68%);}
.re-catalog-icon{position:relative;z-index:1;width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,#246fe8,#6c55f6);color:#fff;box-shadow:0 14px 28px rgba(48,102,216,.23);}
.re-catalog-icon .material-symbols-rounded{font-size:32px;}
.re-catalog-panel h2{margin:6px 0 8px;color:#12203a;font-size:clamp(1.8rem,3vw,2.8rem);letter-spacing:-.045em;}
.re-catalog-panel p{margin:0;color:#64738a;line-height:1.7;max-width:780px;}
.re-catalog-panel .re-demo-catalog{position:relative;z-index:2;white-space:nowrap;}

@media (max-width:1199.98px){
 .re-demo-grid-3{grid-template-columns:repeat(2,minmax(0,1fr));}
 .re-demo-head{grid-template-columns:1fr;gap:18px;align-items:start;}
 .re-catalog-panel{grid-template-columns:auto 1fr;}
 .re-catalog-panel .re-demo-catalog{grid-column:1/-1;justify-self:start;}
}
@media (max-width:767.98px){
 .re-demo-showcase{padding:66px 0 !important;}
 .re-demo-head{margin-bottom:24px;}
 .re-demo-head h2{font-size:2.15rem;}
 .re-demo-head p{font-size:.91rem;line-height:1.62;}
 .re-demo-grid-3,.re-demo-grid-2{grid-template-columns:1fr;gap:18px;}
 .re-demo-card{border-radius:24px;}
 .re-demo-media{aspect-ratio:4/3;}
 .re-demo-body{padding:20px 18px 20px;}
 .re-demo-body h3{font-size:1.3rem;}
 .re-demo-body p{font-size:.88rem;line-height:1.58;}
 .re-demo-status{top:11px;right:11px;min-height:31px;padding:6px 10px;font-size:.68rem;}
 .re-demo-chips{margin:15px 0 18px;}
 .re-demo-catalog-wrap{margin-top:-36px;padding-bottom:58px;}
 .re-demo-catalog{width:calc(100% - 28px);max-width:390px;}
 .re-catalog-section{padding:54px 0 !important;}
 .re-catalog-panel{grid-template-columns:1fr;gap:18px;padding:26px 22px;border-radius:24px;}
 .re-catalog-icon{width:56px;height:56px;border-radius:17px;}
 .re-catalog-panel .re-demo-catalog{width:100%;max-width:none;justify-self:stretch;white-space:normal;text-align:center;}
}


/* =========================================================
   V68 · DEMOS IA VISIBLES Y PREMIUM
   ========================================================= */
.ai-demo-showcase{
  --ai-demo-accent:#7a62ff;
  --ai-demo-accent-2:#ec4759;
  position:relative;
  overflow:hidden;
  padding:52px 0 62px !important;
  background:
    radial-gradient(circle at 8% 18%,color-mix(in srgb,var(--ai-demo-accent) 18%,transparent),transparent 30%),
    radial-gradient(circle at 92% 82%,color-mix(in srgb,var(--ai-demo-accent-2) 14%,transparent),transparent 28%),
    linear-gradient(135deg,#07101d 0%,#101728 46%,#0b1321 100%);
  color:#fff;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.ai-demo-showcase::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.48;
  background-image:
    linear-gradient(rgba(255,255,255,.027) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.027) 1px,transparent 1px),
    radial-gradient(circle at 20% 28%,color-mix(in srgb,var(--ai-demo-accent) 65%,white) 0 1.5px,transparent 2.5px),
    radial-gradient(circle at 82% 66%,color-mix(in srgb,var(--ai-demo-accent-2) 56%,white) 0 1.5px,transparent 2.5px);
  background-size:42px 42px,42px 42px,170px 170px,210px 210px;
  mask-image:linear-gradient(90deg,#000,rgba(0,0,0,.28),#000);
}
.ai-demo-showcase::after{
  content:"neurology";
  font-family:'Material Symbols Rounded';
  position:absolute;right:4.5%;top:14px;font-size:160px;line-height:1;color:color-mix(in srgb,var(--ai-demo-accent) 8%,transparent);font-variation-settings:'FILL' 0,'wght' 300,'GRAD' 0,'opsz' 48;pointer-events:none;
}
.ai-demo-showcase .container-wide{position:relative;z-index:2;}
.ai-demo-multiagents{--ai-demo-accent:#6d63ff;--ai-demo-accent-2:#ef4766;}
.ai-demo-chatbot{--ai-demo-accent:#e34e5f;--ai-demo-accent-2:#7759ff;}
.ai-demo-deepprop{--ai-demo-accent:#3f79ff;--ai-demo-accent-2:#f04b55;}
.ai-demo-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;}
.ai-demo-pill,.ai-demo-live{display:inline-flex;align-items:center;gap:7px;border-radius:999px;font-weight:800;letter-spacing:.025em;}
.ai-demo-pill{padding:8px 13px;border:1px solid color-mix(in srgb,var(--ai-demo-accent) 45%,rgba(255,255,255,.12));background:color-mix(in srgb,var(--ai-demo-accent) 11%,rgba(255,255,255,.04));color:color-mix(in srgb,var(--ai-demo-accent) 70%,white);font-size:.74rem;text-transform:uppercase;}
.ai-demo-pill .material-symbols-rounded{font-size:16px;}
.ai-demo-live{padding:7px 12px;border:1px solid rgba(87,211,142,.22);background:rgba(35,153,94,.08);color:#90e3b4;font-size:.72rem;}
.ai-demo-live i{width:7px;height:7px;border-radius:50%;background:#45d58a;box-shadow:0 0 0 5px rgba(69,213,138,.10);}
.ai-demo-feature-card{
  position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.38fr) minmax(340px,.78fr);align-items:stretch;
  border:1px solid color-mix(in srgb,var(--ai-demo-accent) 34%,rgba(255,255,255,.08));
  border-radius:30px;
  background:
    radial-gradient(circle at 78% 10%,color-mix(in srgb,var(--ai-demo-accent) 12%,transparent),transparent 30%),
    linear-gradient(135deg,rgba(19,29,47,.97),rgba(8,15,28,.99));
  box-shadow:0 30px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.06);
}
.ai-demo-feature-card::after{content:"";position:absolute;right:-100px;bottom:-130px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--ai-demo-accent-2) 15%,transparent),transparent 68%);pointer-events:none;}
.ai-demo-media{position:relative;display:grid;place-items:center;min-width:0;padding:14px;background:linear-gradient(145deg,#0b1322,#111a2b);border-right:1px solid rgba(255,255,255,.08);text-decoration:none;}
.ai-demo-media img{display:block;width:100%;height:100%;max-height:430px;object-fit:contain;object-position:center;border-radius:20px;background:#0c1422;box-shadow:0 15px 42px rgba(0,0,0,.28);}
.ai-demo-media-badge{position:absolute;left:28px;bottom:28px;display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:rgba(6,12,23,.82);border:1px solid color-mix(in srgb,var(--ai-demo-accent) 45%,rgba(255,255,255,.14));backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;font-size:.72rem;font-weight:800;box-shadow:0 10px 24px rgba(0,0,0,.25);}
.ai-demo-media-badge .material-symbols-rounded{font-size:17px;color:color-mix(in srgb,var(--ai-demo-accent) 72%,white);}
.ai-demo-content{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:34px 34px 34px 32px;}
.ai-demo-eyebrow{display:block;margin-bottom:10px;color:color-mix(in srgb,var(--ai-demo-accent) 72%,white);font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em;}
.ai-demo-content h2{margin:0 0 12px;color:#f7f9ff;font-size:clamp(2rem,3vw,3.15rem);line-height:1.02;letter-spacing:-.05em;}
.ai-demo-content p{margin:0;color:#afbed2;font-size:.95rem;line-height:1.68;}
.ai-demo-features{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 24px;}
.ai-demo-features span{display:inline-flex;align-items:center;gap:6px;padding:8px 10px;border-radius:999px;background:color-mix(in srgb,var(--ai-demo-accent) 8%,rgba(255,255,255,.035));border:1px solid color-mix(in srgb,var(--ai-demo-accent) 23%,rgba(255,255,255,.08));color:#d0d9e8;font-size:.73rem;font-weight:700;}
.ai-demo-features .material-symbols-rounded{font-size:15px;color:color-mix(in srgb,var(--ai-demo-accent) 72%,white);}
.ai-demo-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;margin-top:auto;padding:0 19px;border-radius:15px;text-decoration:none;background:linear-gradient(135deg,var(--ai-demo-accent),var(--ai-demo-accent-2));box-shadow:0 14px 30px color-mix(in srgb,var(--ai-demo-accent) 19%,transparent);color:#fff;font-size:.86rem;font-weight:900;transition:.22s ease;}
.ai-demo-button:hover{color:#fff;transform:translateY(-2px);filter:brightness(1.08);}
.ai-demo-button .material-symbols-rounded{font-size:19px;}

/* Las imágenes de demos se muestran completas: nunca se recortan. */
.re-demo-media{height:auto!important;aspect-ratio:auto!important;display:flex;align-items:center;justify-content:center;padding:10px;}
.re-demo-media img{width:100%!important;height:auto!important;max-height:430px;object-fit:contain!important;object-position:center!important;border-radius:16px;}

@media (max-width:991.98px){
 .ai-demo-feature-card{grid-template-columns:1fr;}
 .ai-demo-media{border-right:0;border-bottom:1px solid rgba(255,255,255,.08);}
 .ai-demo-media img{max-height:390px;}
 .ai-demo-content{padding:28px 26px 30px;}
}
@media (max-width:767.98px){
 .ai-demo-showcase{padding:34px 0 42px!important;}
 .ai-demo-showcase::after{font-size:105px;right:-12px;top:8px;}
 .ai-demo-topline{align-items:flex-start;flex-direction:column;gap:9px;margin-bottom:12px;}
 .ai-demo-feature-card{border-radius:23px;}
 .ai-demo-media{padding:8px;}
 .ai-demo-media img{max-height:none;width:100%!important;height:auto!important;border-radius:16px;}
 .ai-demo-media-badge{left:18px;bottom:18px;}
 .ai-demo-content{padding:23px 19px 22px;}
 .ai-demo-content h2{font-size:2rem;}
 .ai-demo-content p{font-size:.89rem;line-height:1.58;}
 .ai-demo-features{margin:18px 0 20px;}
 .ai-demo-button{width:100%;}
 .re-demo-media{padding:7px!important;}
 .re-demo-media img{max-height:none!important;width:100%!important;height:auto!important;}
}


/* =========================================================
   V70 · DOS DEMOS CHATBOT IA
   ========================================================= */
.ai-demo-dual .ai-demo-section-head{max-width:840px;margin:0 0 24px;}
.ai-demo-dual .ai-demo-section-head h2{margin:4px 0 9px;color:#f7f9ff;font-size:clamp(2rem,3vw,3.2rem);line-height:1.02;letter-spacing:-.045em;}
.ai-demo-dual .ai-demo-section-head p{margin:0;color:#aebdd1;font-size:.96rem;line-height:1.68;}
.ai-demo-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:stretch;}
.ai-demo-product-card{--card-accent:#6d63ff;--card-accent-2:#ef4766;position:relative;overflow:hidden;display:flex;flex-direction:column;min-width:0;border:1px solid color-mix(in srgb,var(--card-accent) 34%,rgba(255,255,255,.08));border-radius:28px;background:radial-gradient(circle at 90% 4%,color-mix(in srgb,var(--card-accent) 16%,transparent),transparent 28%),linear-gradient(145deg,rgba(19,29,47,.98),rgba(7,14,26,.995));box-shadow:0 28px 72px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.06);transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;}
.ai-demo-product-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--card-accent) 56%,rgba(255,255,255,.13));box-shadow:0 36px 86px rgba(0,0,0,.42),0 0 38px color-mix(in srgb,var(--card-accent) 13%,transparent);}
.ai-demo-product-card::after{content:"";position:absolute;right:-100px;bottom:-130px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--card-accent-2) 14%,transparent),transparent 68%);pointer-events:none;}
.ai-demo-product-multi{--card-accent:#725cff;--card-accent-2:#ef476f;}
.ai-demo-product-chatbot{--card-accent:#e64f61;--card-accent-2:#805dff;}
.ai-demo-card-media{position:relative;display:flex;align-items:center;justify-content:center;padding:10px;background:linear-gradient(145deg,#0b1322,#111a2b);border-bottom:1px solid rgba(255,255,255,.08);text-decoration:none;}
.ai-demo-card-media img{display:block;width:100%;height:auto;max-height:390px;object-fit:contain!important;object-position:center!important;border-radius:18px;background:#0c1422;box-shadow:0 15px 42px rgba(0,0,0,.28);transition:transform .25s ease,filter .25s ease;}
.ai-demo-product-card:hover .ai-demo-card-media img{transform:scale(1.008);filter:saturate(1.04) contrast(1.02);}
.ai-demo-product-card .ai-demo-media-badge{border-color:color-mix(in srgb,var(--card-accent) 46%,rgba(255,255,255,.14));}
.ai-demo-product-card .ai-demo-media-badge .material-symbols-rounded{color:color-mix(in srgb,var(--card-accent) 70%,white);}
.ai-demo-card-content{position:relative;z-index:2;display:flex;flex:1;flex-direction:column;padding:25px 25px 26px;}
.ai-demo-card-content .ai-demo-eyebrow{color:color-mix(in srgb,var(--card-accent) 72%,white);}
.ai-demo-card-content h3{margin:0 0 10px;color:#f7f9ff;font-size:clamp(1.65rem,2vw,2.15rem);line-height:1.05;letter-spacing:-.04em;}
.ai-demo-card-content p{margin:0;color:#aebdd0;font-size:.91rem;line-height:1.64;}
.ai-demo-product-card .ai-demo-features span{background:color-mix(in srgb,var(--card-accent) 8%,rgba(255,255,255,.035));border-color:color-mix(in srgb,var(--card-accent) 24%,rgba(255,255,255,.08));}
.ai-demo-product-card .ai-demo-features .material-symbols-rounded{color:color-mix(in srgb,var(--card-accent) 72%,white);}
.ai-demo-product-card .ai-demo-button{background:linear-gradient(135deg,var(--card-accent),var(--card-accent-2));box-shadow:0 14px 30px color-mix(in srgb,var(--card-accent) 19%,transparent);}
@media (max-width:991.98px){.ai-demo-card-grid{grid-template-columns:1fr;}.ai-demo-card-media img{max-height:none;}}
@media (max-width:767.98px){.ai-demo-card-grid{gap:16px;}.ai-demo-dual .ai-demo-section-head{margin-bottom:18px;}.ai-demo-dual .ai-demo-section-head h2{font-size:2rem;}.ai-demo-dual .ai-demo-section-head p{font-size:.89rem;line-height:1.58;}.ai-demo-product-card{border-radius:23px;}.ai-demo-card-media{padding:7px;}.ai-demo-card-media img{width:100%!important;height:auto!important;border-radius:16px;}.ai-demo-card-content{padding:21px 18px 21px;}.ai-demo-card-content h3{font-size:1.7rem;}.ai-demo-card-content p{font-size:.88rem;}.ai-demo-product-card .ai-demo-button{width:100%;}}


/* =========================================================
   V71 · TRES DEMOS EN INTELIGENCIA ARTIFICIAL
   ========================================================= */
.ai-demo-product-deepprop{--card-accent:#376ee8;--card-accent-2:#e34855;}
.ai-demo-triple .ai-demo-card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;}
.ai-demo-triple .ai-demo-card-content{padding:23px 21px 24px;}
.ai-demo-triple .ai-demo-card-content h3{font-size:clamp(1.45rem,1.75vw,1.95rem);}
.ai-demo-triple .ai-demo-card-content p{font-size:.87rem;}
.ai-demo-triple .ai-demo-card-media img{max-height:320px;object-fit:contain!important;object-position:center!important;}
@media (max-width:1199.98px){
 .ai-demo-triple .ai-demo-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
 .ai-demo-triple .ai-demo-product-card:last-child{grid-column:1/-1;max-width:760px;width:100%;justify-self:center;}
}
@media (max-width:767.98px){
 .ai-demo-triple .ai-demo-card-grid{grid-template-columns:1fr;}
 .ai-demo-triple .ai-demo-product-card:last-child{grid-column:auto;max-width:none;}
 .ai-demo-triple .ai-demo-card-media img{max-height:none;}
}


/* =========================================================
   V72 · HERO APLICACIONES / CONTACTO + CARDS PREMIUM
   ========================================================= */
body.hero-bg-page.hero-desarrollo-aplicaciones-v72 .page-hero{
  background-image:url('../img/page-heroes/custom-v72/desarrollo-aplicaciones-hero.png');
  background-position:74% center;
}
body.hero-bg-page.hero-contacto-v72 .page-hero{
  background-image:url('../img/page-heroes/custom-v72/contacto-hero.png');
  background-position:76% center;
}
body.hero-bg-page.hero-desarrollo-aplicaciones-v72 .page-hero::after,
body.hero-bg-page.hero-contacto-v72 .page-hero::after{
  background:radial-gradient(circle, rgba(255,82,102,.18) 0%, rgba(67,122,255,.10) 40%, transparent 74%);
}

body.re-premium-v72 .flutter-detail-section{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 14% 18%,rgba(255,82,102,.16),transparent 24%),
    radial-gradient(circle at 86% 22%,rgba(78,126,255,.16),transparent 26%),
    linear-gradient(135deg,#101a29 0%,#142846 48%,#1a2450 100%);
}
body.re-premium-v72 .flutter-detail-section::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.42;
  background-image:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),
    radial-gradient(circle at 18% 28%,rgba(255,82,102,.52) 0 2px,transparent 3px),
    radial-gradient(circle at 82% 72%,rgba(82,134,255,.45) 0 2px,transparent 3px);
  background-size:42px 42px,42px 42px,170px 170px,220px 220px;
}
body.re-premium-v72 .flutter-detail-grid{position:relative;z-index:1;}
body.re-premium-v72 .visual-promo-media{
  padding:14px;
  border-radius:30px;
  background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 26px 62px rgba(10,18,35,.28);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
body.re-premium-v72 .visual-promo-media img{
  border-radius:23px;
  box-shadow:0 26px 62px rgba(7,15,30,.24);
}
body.re-premium-v72 .benefit-item{
  --accent:#2878ff;
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:1px solid color-mix(in srgb,var(--accent) 18%,#d9e3f0);
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(245,249,255,.92));
  box-shadow:0 18px 42px rgba(24,42,72,.08);
}
body.re-premium-v72 .benefit-item::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--accent),color-mix(in srgb,var(--accent) 32%,#ffffff));
}
body.re-premium-v72 .benefit-item::after{
  content:"";position:absolute;right:-50px;top:-42px;width:140px;height:140px;border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 16%,transparent),transparent 68%);
}
body.re-premium-v72 .benefit-item:nth-child(3n+1){--accent:#2878ff;}
body.re-premium-v72 .benefit-item:nth-child(3n+2){--accent:#ef4452;}
body.re-premium-v72 .benefit-item:nth-child(3n+3){--accent:#159a69;}
body.re-premium-v72 .benefit-item h4{color:#152034;letter-spacing:-.02em;}
body.re-premium-v72 .benefit-item p{color:#62738d;}

body.re-premium-v72 .contact-info,
body.re-premium-v72 .contact-form{
  position:relative;
  overflow:hidden;
  border-radius:30px;
}
body.re-premium-v72 .contact-info{
  background:
    radial-gradient(circle at 12% 18%,rgba(255,82,102,.16),transparent 25%),
    radial-gradient(circle at 84% 16%,rgba(82,132,255,.18),transparent 26%),
    linear-gradient(135deg,#0f1826 0%,#17243a 55%,#102138 100%);
  box-shadow:0 26px 70px rgba(13,23,42,.22);
  border:1px solid rgba(255,255,255,.10);
}
body.re-premium-v72 .contact-info::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.34;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px),
    radial-gradient(circle at 18% 72%,rgba(255,82,102,.54) 0 2px,transparent 3px),
    radial-gradient(circle at 76% 32%,rgba(82,132,255,.48) 0 2px,transparent 3px);
  background-size:40px 40px,40px 40px,170px 170px,200px 200px;
}
body.re-premium-v72 .contact-info>*{position:relative;z-index:1;}
body.re-premium-v72 .contact-points{gap:14px;}
body.re-premium-v72 .contact-point{
  padding:14px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
body.re-premium-v72 .contact-point .material-symbols-rounded{color:#9fc2ff;}
body.re-premium-v72 .contact-form{
  border:1px solid rgba(52,92,160,.16);
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(247,250,255,.94));
  box-shadow:0 24px 68px rgba(24,42,72,.10),inset 0 1px 0 rgba(255,255,255,.82);
}
body.re-premium-v72 .contact-form::before{
  content:"";position:absolute;left:0;right:0;top:0;height:4px;
  background:linear-gradient(90deg,#2878ff,#ef4452,#7447e8);
}
body.re-premium-v72 .contact-form::after{
  content:"";position:absolute;right:-90px;top:-90px;width:240px;height:240px;border-radius:50%;
  background:radial-gradient(circle,rgba(40,120,255,.12),transparent 68%);
}
body.re-premium-v72 .contact-form>*{position:relative;z-index:1;}
body.re-premium-v72 .field input,
body.re-premium-v72 .field select,
body.re-premium-v72 .field textarea{
  border-color:#dbe4f1;
  background:linear-gradient(145deg,#ffffff,#f8fbff);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}
body.re-premium-v72 .field input:focus,
body.re-premium-v72 .field select:focus,
body.re-premium-v72 .field textarea:focus{
  border-color:#6e84ff;
  box-shadow:0 0 0 4px rgba(110,132,255,.12);
}

@media (max-width:1199.98px){
  body.hero-bg-page.hero-desarrollo-aplicaciones-v72 .page-hero{background-position:78% center;}
  body.hero-bg-page.hero-contacto-v72 .page-hero{background-position:79% center;}
}
@media (max-width:991.98px){
  body.hero-bg-page.hero-desarrollo-aplicaciones-v72 .page-hero{background-position:70% center;}
  body.hero-bg-page.hero-contacto-v72 .page-hero{background-position:71% center;}
}
@media (max-width:680px){
  body.hero-bg-page.hero-desarrollo-aplicaciones-v72 .page-hero{background-position:76% center;min-height:540px;}
  body.hero-bg-page.hero-contacto-v72 .page-hero{background-position:78% center;min-height:540px;}
  body.re-premium-v72 .contact-info,
  body.re-premium-v72 .contact-form{border-radius:24px;}
  body.re-premium-v72 .contact-point{padding:13px 14px;font-size:.94rem;}
}