:root{ --ink:#0A0B0C; --white:#FFFFFF; }
*{box-sizing:border-box}

.cae-embed, .cae-embed > div, .cae-embed :where(.wp-block-group, .wp-block-post-content, .wp-site-blocks){
  margin:0 !important; padding:0 !important; max-width:none !important; width:100vw !important; background:transparent !important;
}

html.caeconecta-active, body.caeconecta-active{
  height:100% !important; overflow:hidden !important; background:transparent !important;
}

.cae-takeover{
  position:fixed; inset:0; z-index: 99999;
  display:grid; place-items:center; overflow:hidden;
}

.cae-fx-bg{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image: var(--cae-fondo-url);
  background-size: cover; background-position: center;
  background-repeat: no-repeat;
}

.cae-viewport{
  position:relative; z-index:1;
  width: min(100vw, calc(100vh * 16/9));
  height: min(100vh, calc(100vw * 9/16));
}

.cae-stage{ position:relative; width:100%; height:100%; }

.cae-img1,.cae-img2,.cae-img3{
  position:absolute; overflow:hidden; border-radius: 12px;
  box-shadow: 0 18px 38px rgba(0,0,0,.28);
}
.cae-img1{ left: 3.0%; top: 12.2%; width: 23.0%; height: 22.5%; }
.cae-img2{ left: 28.0%; top: 17.0%; width: 23.0%; height: 22.5%; }
.cae-img3{ left: 3.0%;  top: 42.0%; width: 23.0%; height: 22.5%; }
.cae-img1 img,.cae-img2 img,.cae-img3 img{ width:100%; height:100%; object-fit:cover; display:block; }

.cae-menu{
  position:absolute; left: 19.5%; top: 68.0%;
  color: var(--white); text-transform: uppercase; font-weight: 800;
  line-height: 1.28; letter-spacing: .2px;
  font-size: 4.6vh;
  text-shadow: 0 2px 6px rgba(0,0,0,.25);
}
.cae-menu .l1{ margin: 1.6vh 0; padding-left: 0%;  white-space:nowrap; }
.cae-menu .l2{ margin: 1.6vh 0; padding-left: 4%;  white-space:nowrap; }
.cae-menu .l3{ margin: 1.6vh 0; padding-left: 8%;  white-space:nowrap; }
.cae-menu a{ color:#FFFFFF; text-decoration:none; }
.cae-menu a:hover{ color:#9EE6F0; text-decoration:none; filter:drop-shadow(0 2px 6px rgba(0,0,0,.25)); }

/* CAE Conecta: top 70%, right 50% */
.cae-caec{ position:absolute; right: 80%; top: 90%; display:flex; flex-direction:column; gap: 1.6vh; }
.cae-line{ display:flex; align-items:baseline; gap: .45ch; white-space:nowrap; }
.cae-cap{ font-size: 9.72vh; font-weight: 900; color:#000; line-height: .95; }
.cae-rest{ font-size: 5.508vh; font-weight: 800; color:#fff; text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: .12em; text-shadow: 0 2px 6px rgba(0,0,0,.30); }
.cae-line.conecta .cae-rest{ color:#000; text-decoration:none; text-shadow:none; }

@media (max-aspect-ratio: 9/10){
  .cae-viewport{ width:100vw; height:100vh; }
  .cae-stage{ width:94vw; height:auto; aspect-ratio:auto; display:grid; grid-template-columns:1fr; gap:2vh; padding:3vh 0; }
  .cae-img1,.cae-img2,.cae-img3,.cae-menu,.cae-caec{ position:static; }
  .cae-img1,.cae-img2,.cae-img3{ width:92%; height:auto; aspect-ratio:16/9; justify-self:center; }
  .cae-menu{ text-align:center; font-size:4.2vh; }
  .cae-menu .l1,.cae-menu .l2,.cae-menu .l3{ padding-left:0; margin:1.2vh 0; }
  .cae-caec{ align-items:center; gap:1.2vh; }
  .cae-cap{ font-size:8.6vh; }
  .cae-rest{ font-size:4.9vh; }
}