/* Oceanum · Pop Up  ·  Veranza Studio */
@font-face{ font-family:"Poppins"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/Poppins-Regular.woff2") format("woff2"); }
@font-face{ font-family:"Poppins"; font-style:normal; font-weight:500; font-display:swap; src:url("fonts/Poppins-Medium.woff2") format("woff2"); }
@font-face{ font-family:"Poppins"; font-style:normal; font-weight:600; font-display:swap; src:url("fonts/Poppins-SemiBold.woff2") format("woff2"); }
@font-face{ font-family:"Poppins"; font-style:normal; font-weight:700; font-display:swap; src:url("fonts/Poppins-Bold.woff2") format("woff2"); }
.omcc-pop, .omcc-pop *{ font-family:"Poppins", system-ui, -apple-system, "Segoe UI", sans-serif !important; }
.omcc-pop{
  --blue:#2b93e6; --blue2:#2b93e6; --white:#fff;
  --mist:rgba(255,255,255,.86); --hair:rgba(255,255,255,.55);
  position:fixed; inset:0; z-index:99999; display:none;
  align-items:center; justify-content:center; padding:20px;
  background:rgba(4,10,22,.68);
  -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px);
  font-family:"Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  opacity:0; transition:opacity .4s ease;
}
.omcc-pop.is-open{ display:flex; opacity:1; }
.omcc-pop *{ box-sizing:border-box; }

.omcc-card{
  position:relative; width:min(600px,92vw); min-height:min(700px,116vw);
  border-radius:30px; overflow:hidden; color:var(--white);
  box-shadow:0 44px 100px -34px rgba(0,0,0,.86);
  background-image:
    linear-gradient(100deg, rgba(6,16,34,.72) 0%, rgba(6,16,34,.46) 40%, rgba(6,16,34,.14) 64%, rgba(6,16,34,0) 80%),
    var(--omcc-bg);
  background-size:cover; background-position:center;
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(36px,5vw,56px);
  transform:translateY(16px) scale(.985); opacity:0;
  transition:transform .55s cubic-bezier(.2,.8,.25,1), opacity .5s ease;
}
.omcc-pop.is-open .omcc-card{ transform:none; opacity:1; }

/* entrada escalonada del contenido */
.omcc-eyebrow, .omcc-title, .omcc-wave, .omcc-sub, .omcc-cta{ opacity:0; }
@keyframes omcc-rise{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
.omcc-pop.is-open .omcc-eyebrow{ animation:omcc-rise .55s cubic-bezier(.2,.8,.25,1) .16s both, omcc-float 3.2s ease-in-out 1s infinite; }
.omcc-pop.is-open .omcc-title  { animation:omcc-rise .55s cubic-bezier(.2,.8,.25,1) .24s both; }
.omcc-pop.is-open .omcc-wave   { animation:omcc-rise .55s cubic-bezier(.2,.8,.25,1) .34s both; }
.omcc-pop.is-open .omcc-sub    { animation:omcc-rise .55s cubic-bezier(.2,.8,.25,1) .42s both; }
.omcc-pop.is-open .omcc-cta    { animation:omcc-rise .55s cubic-bezier(.2,.8,.25,1) .50s both; }
.omcc-wave path{ stroke-dasharray:130; stroke-dashoffset:130; }
.omcc-pop.is-open .omcc-wave path{ animation:omcc-draw 1.1s ease .58s forwards; }
@keyframes omcc-draw{ to{ stroke-dashoffset:0; } }
@keyframes omcc-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-6px); } }

/* logomark: relieve casi imperceptible en la esquina sup. izq. */
.omcc-watermark{
  position:absolute; top:-30%; left:-24%; width:68%; max-width:420px;
  opacity:.05; pointer-events:none; z-index:0;
  transform:rotate(-8deg); filter:blur(.6px);
}

.omcc-inner{ position:relative; z-index:3; max-width:64%; }

.omcc-eyebrow{
  margin:0 0 14px; font-size:12px; font-weight:600;
  letter-spacing:.3em; text-transform:uppercase; color:var(--blue);
}
.omcc-title{
  margin:0; font-weight:700; letter-spacing:-.02em; line-height:1.06; color:var(--white);
  font-size:clamp(34px,4.6vw,50px); text-shadow:0 2px 22px rgba(4,10,22,.5);
}
.omcc-title .l1{ display:block; }
.omcc-title .l2{ display:block; }
.omcc-wave{ display:block; margin:6px 0 8px; color:var(--blue); opacity:.9; }
.omcc-sub{
  margin:0 0 28px; font-size:clamp(11px,1.35vw,13px); font-weight:500;
  letter-spacing:.2em; text-transform:uppercase; color:var(--mist); line-height:1.6;
}

.omcc-cta{
  display:inline-flex; align-items:center; gap:12px; text-decoration:none !important;
  font-size:12px; font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--white) !important; padding:14px 26px; border-radius:13px;
  border:1px solid var(--hair) !important;
  background:rgba(255,255,255,.06) !important;
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  transition:background .3s ease, border-color .3s ease;
}
.omcc-cta:hover, .omcc-cta:focus, .omcc-cta:active{
  background:rgba(255,255,255,.16) !important;
  border-color:#fff !important;
  color:var(--white) !important;
}
.omcc-cta .omcc-logo{ height:22px; width:auto; display:block; flex:0 0 auto; }
.omcc-cta .omcc-arrow{ transition:transform .3s ease; }
.omcc-cta:hover .omcc-arrow{ transform:translateX(4px); }

.omcc-close{
  position:absolute; top:16px; right:16px; z-index:6;
  width:38px; height:38px; border-radius:50%; cursor:pointer; padding:0; min-width:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(4,10,22,.3); border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px);
  color:var(--white); transition:background .25s ease;
}
.omcc-close:hover{ background:rgba(4,10,22,.6) !important; }
.omcc-pop :focus-visible{ outline:2px solid var(--blue); outline-offset:3px; }

/* Tablet */
@media (min-width:561px) and (max-width:1024px){
  .omcc-card{ width:min(560px,88vw); min-height:min(660px,104vw); }
  .omcc-inner{ max-width:66%; }
  .omcc-title{ font-size:clamp(32px,4.8vw,46px); }
}

/* Móvil */
@media (max-width:560px){
  .omcc-card{
    aspect-ratio:auto; min-height:min(120vw, 620px);
    border-radius:26px;
    background-image:
      linear-gradient(122deg, rgba(6,16,34,.72) 0%, rgba(6,16,34,.44) 52%, rgba(6,16,34,.12) 84%, rgba(6,16,34,0) 100%),
      var(--omcc-bg);
    padding:34px 26px;
  }
  .omcc-watermark{ width:82%; top:-20%; left:-30%; }
  .omcc-inner{ max-width:92%; }
  .omcc-sub{ max-width:180px; }
  .omcc-title{ font-size:clamp(32px,9.6vw,42px); }
  .omcc-cta{ width:100%; justify-content:center; }
}
@media (prefers-reduced-motion:reduce){
  .omcc-pop, .omcc-card, .omcc-cta, .omcc-arrow{ transition:none; }
  .omcc-card{ transform:none; }
  .omcc-eyebrow, .omcc-title, .omcc-wave, .omcc-sub, .omcc-cta{ opacity:1; animation:none; }
  .omcc-wave path{ stroke-dashoffset:0; animation:none; }
}
