.cei, .cei * { box-sizing: border-box; }
.cei {
  --a: var(--cei-accent, #e8452c);
  --ink: #14110f; --muted: #6b645d; --paper: #fbf8f3; --line: rgba(20,17,15,.1);
  position: fixed; inset: 0; z-index: 999999; display: grid; place-items: center; padding: 20px;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--ink);
}
.cei[hidden] { display: none; }
.cei__backdrop { position: absolute; inset: 0; background: rgba(15,12,10,.55); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); opacity: 0; transition: opacity .25s ease; }
.cei__card {
  position: relative; width: min(920px, 100%); max-height: calc(100dvh - 40px); overflow: auto;
  display: grid; grid-template-columns: 1.05fr 1fr; background: var(--paper); border-radius: 22px;
  box-shadow: 0 40px 100px -20px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.06);
  opacity: 0; transform: translateY(18px) scale(.97); transition: opacity .3s ease, transform .35s cubic-bezier(.2,.8,.2,1);
}
.cei.is-open .cei__backdrop { opacity: 1; }
.cei.is-open .cei__card { opacity: 1; transform: none; }

.cei__close {
  position: absolute; top: 14px; right: 14px; z-index: 3; width: 36px; height: 36px; display: grid; place-items: center;
  border: 0; border-radius: 50%; background: rgba(255,255,255,.9); color: var(--ink); cursor: pointer; transition: transform .2s, background .2s;
}
.cei__close:hover { transform: rotate(90deg); background: #fff; }
.cei button:focus-visible, .cei a:focus-visible { outline: 2px solid var(--a); outline-offset: 3px; }

/* Nota */
.cei__story { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 460px; color: #fff; overflow: hidden; background: #1a1613; }
.cei__story-img { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.cei__story::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,8,6,.15) 0%, rgba(10,8,6,.55) 45%, rgba(10,8,6,.92) 100%); }
.cei--noimg .cei__story { background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--a) 70%, #000) 0%, #14110f 70%); }
.cei__story-body { position: relative; z-index: 2; display: flex; flex-direction: column; gap: 12px; padding: 32px; }
.cei__eyebrow { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.85); }
.cei__eyebrow i { width: 8px; height: 8px; border-radius: 50%; background: var(--a); box-shadow: 0 0 0 0 var(--a); animation: cei-pulse 1.8s infinite; }
@keyframes cei-pulse { 70% { box-shadow: 0 0 0 9px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.cei__cat { align-self: flex-start; padding: 4px 10px; border-radius: 99px; font-size: 12px; font-weight: 600; background: rgba(255,255,255,.16); backdrop-filter: blur(6px); }
.cei__title { margin: 0; text-wrap: balance; font-family: var(--cei-f-title, "Fraunces", Georgia, serif); font-size: var(--cei-s-title, clamp(24px, 3vw, 32px)); line-height: 1.12; font-weight: 600; letter-spacing: -.01em; color: #fff; }

/* Suscripción */
.cei__sub { padding: 40px 36px 28px; display: flex; flex-direction: column; justify-content: center; gap: 10px; }
.cei__tagline { margin: 0 0 18px; padding-bottom: 20px; border-bottom: 1px solid var(--line); font-family: var(--cei-f-tagline, "Fraunces", Georgia, serif); font-size: var(--cei-s-tagline, clamp(28px, 3.4vw, 38px)); line-height: 1.08; font-weight: 600; letter-spacing: -.02em; }
.cei__tagline em { font-style: normal; color: var(--a); white-space: nowrap; }
.cei__sub-title { margin: 0 0 6px; font-family: var(--cei-f-sub, inherit); font-size: var(--cei-s-sub, 13px); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.cei__push {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 14px 18px;
  border: 0; border-radius: 12px; background: var(--ink); color: #fff; font-weight: 600; font-size: var(--cei-s-button, 15px); line-height: 1; font-family: var(--cei-f-button, inherit); cursor: pointer;
  transition: transform .15s, background .2s, box-shadow .2s;
}
.cei__push:hover:not(:disabled) { background: var(--a); box-shadow: 0 10px 24px -10px var(--a); transform: translateY(-1px); }
.cei__push:disabled { opacity: .55; cursor: not-allowed; }
.cei__push.is-done { background: var(--ink); }
.cei__or { margin: 14px 0 4px; font-family: var(--cei-f-body, inherit); font-size: var(--cei-s-body, 14px); line-height: 1.5; color: var(--muted); }
.cei__dismiss { align-self: center; margin-top: 6px; padding: 6px 10px; border: 0; background: none; color: var(--muted); font-weight: 500; font-size: 13px; font-family: inherit; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.cei__dismiss:hover { color: var(--ink); }

/* Gravity Forms (compacto, sin marco) */
.cei__form .gform_wrapper { margin: 0; }
.cei__form .gform_wrapper .gform_fields { display: grid; gap: 10px; }
.cei__form .gform_wrapper .gfield_label, .cei__form .gform_wrapper legend { font-size: 12px; font-weight: 600; margin-bottom: 4px; color: var(--ink); }
.cei__form .gform_wrapper .gfield_required { color: var(--a); }
.cei__form .gform_wrapper input[type=text], .cei__form .gform_wrapper input[type=email], .cei__form .gform_wrapper input[type=tel], .cei__form .gform_wrapper select {
  width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: #fff; font-size: 15px; font-family: inherit; color: var(--ink); box-shadow: none; transition: border-color .2s, box-shadow .2s;
}
.cei__form .gform_wrapper input:focus, .cei__form .gform_wrapper select:focus { outline: 0; border-color: var(--a); box-shadow: 0 0 0 3px color-mix(in srgb, var(--a) 22%, transparent); }
.cei__form .gform_wrapper .gform_footer, .cei__form .gform_wrapper .gform-footer { margin: 12px 0 0; padding: 0; }
.cei__form .gform_wrapper input[type=submit], .cei__form .gform_wrapper button[type=submit] {
  width: 100%; padding: 13px 18px; border: 0; border-radius: 12px; background: var(--a); color: #fff; font-weight: 600; font-size: var(--cei-s-button, 15px); font-family: var(--cei-f-button, inherit); cursor: pointer; transition: filter .2s, transform .15s;
}
.cei__form .gform_wrapper input[type=submit]:hover { filter: brightness(1.08); transform: translateY(-1px); }
.cei__form .gform_confirmation_message { padding: 14px 16px; border-radius: 12px; background: color-mix(in srgb, var(--a) 10%, #fff); color: var(--ink); border-left: 3px solid var(--a); font-weight: 500; }
.cei__form .gform_wrapper .gfield_validation_message, .cei__form .gform_wrapper .validation_message { font-size: 12px; color: #b3261e; }
.cei__form .gform_wrapper .gform_validation_errors { display: none; }
.cei__form .gform_wrapper .gform_title, .cei__form .gform_wrapper .gform_description { display: none; }

html.cei-lock { overflow: hidden; }

@media (max-width: 760px) {
  .cei { align-items: end; padding: 0; }
  .cei__card { grid-template-columns: 1fr; border-radius: 22px 22px 0 0; max-height: 92dvh; transform: translateY(40px); }
  .cei__story { min-height: 280px; }
  .cei__story-body { padding: 22px; gap: 8px; }
  .cei__sub { padding: 24px 22px 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .cei *, .cei { animation: none !important; transition: none !important; }
}

/* Alineación: centrado por defecto, .cei--left para izquierda */
.cei__sub { text-align: center; align-items: stretch; }
.cei__story-body { align-items: center; text-align: center; }
.cei__eyebrow { justify-content: center; }
.cei__cat { align-self: center; }
.cei__form .gform_wrapper .gfield_label, .cei__form .gform_wrapper legend { text-align: left; }
.cei--left .cei__sub { text-align: left; }
.cei--left .cei__story-body { align-items: flex-start; text-align: left; }
.cei--left .cei__eyebrow { justify-content: flex-start; }
.cei--left .cei__cat { align-self: flex-start; }

/* Colores configurables; !important porque los temas suelen forzar color en h2/h3/p */
.cei .cei__title { color: var(--cei-c-title, #fff) !important; }
.cei .cei__tagline { color: var(--cei-c-tagline, #14110f) !important; }
.cei .cei__sub-title { color: var(--cei-c-sub, #6b645d) !important; }
.cei .cei__or { color: var(--cei-c-body, #6b645d) !important; }
.cei .cei__push, .cei .cei__form .gform_wrapper input[type=submit], .cei .cei__form .gform_wrapper button[type=submit] { color: var(--cei-c-button, #fff) !important; }

/* Reset de botones: los temas (Elementor/Hello) estilan <button> con borde, fondo y hover propios */
.cei .cei__push, .cei .cei__close, .cei .cei__dismiss {
  -webkit-appearance: none; appearance: none; box-shadow: none !important; text-shadow: none !important;
  text-transform: none !important; letter-spacing: normal !important; margin: 0; min-height: 0; height: auto;
}
.cei .cei__push, .cei .cei__push:hover, .cei .cei__push:focus, .cei .cei__push:active {
  background: var(--a) !important; border: 0 !important; border-radius: 12px !important;
  color: var(--cei-c-button, #fff) !important; padding: 15px 18px !important;
}
.cei .cei__push:hover:not(:disabled), .cei .cei__push:focus-visible { background: color-mix(in srgb, var(--a) 86%, #000) !important; box-shadow: 0 10px 24px -10px var(--a) !important; }
.cei .cei__push.is-done, .cei .cei__push.is-done:hover { background: var(--ink) !important; }
.cei .cei__close, .cei .cei__close:hover, .cei .cei__close:focus, .cei .cei__close:active {
  background: rgba(255,255,255,.92) !important; color: var(--ink) !important; border: 0 !important; border-radius: 50% !important; padding: 0 !important; width: 36px; height: 36px;
}
.cei .cei__dismiss, .cei .cei__dismiss:hover, .cei .cei__dismiss:focus, .cei .cei__dismiss:active {
  background: none !important; border: 0 !important; border-radius: 0 !important; color: var(--muted) !important; padding: 6px 10px !important;
}
.cei .cei__dismiss:hover { color: var(--ink) !important; }
.cei__card:focus { outline: 0; }

.cei--nopush .cei__push { display: none !important; }
.cei--nopush .cei__or { margin-top: 6px; }