/* ============================================
   NEWSLETTER PRO — ALBERT PUIG (BEEHIIV EMBED)
   FIX:
   - El iframe rellena el recuadro (no queda centrado abajo)
   - Layout flexible (sin alturas fijas “raras”)
   - Botones unificados (.ap-btn) para toda la zona newsletter
============================================ */

:root{
  --ap-bg: #05070c;
  --ap-border: rgba(255,255,255,.10);

  --ap-text: rgba(255,255,255,.92);
  --ap-muted: rgba(255,255,255,.62);
  --ap-muted2: rgba(255,255,255,.45);

  --ap-accent: #f59e0b;
  --ap-accent2: #f97316;

  --ap-shadow: 0 20px 60px rgba(0,0,0,.55);
}

/* Reset WP/Kadence friendly */
.entry-content > .ap-newsletter{ margin: 0 !important; }
.ap-newsletter, .ap-newsletter *{ box-sizing: border-box; }

.ap-newsletter{
  position: relative;
  padding: clamp(48px, 6vw, 96px) 0;
  background:
    radial-gradient(1200px 600px at 20% 15%, rgba(245,158,11,.10), transparent 60%),
    radial-gradient(900px 520px at 85% 65%, rgba(249,115,22,.08), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.015), transparent 35%),
    var(--ap-bg);
  color: var(--ap-text);
}

.ap-newsletter__container{
  width: min(1160px, 92%);
  margin: 0 auto;
}

/* Shell */
.ap-newsletter__shell{
  position: relative;
  border: 1px solid var(--ap-border);
  border-radius: 22px;
  background: rgba(255,255,255,.02);
  box-shadow: var(--ap-shadow);
  overflow: hidden;
}

.ap-newsletter__glow{
  position: absolute;
  inset: -2px;
  pointer-events: none;
  background:
    radial-gradient(600px 240px at 15% 0%, rgba(245,158,11,.18), transparent 60%),
    radial-gradient(540px 260px at 90% 45%, rgba(249,115,22,.14), transparent 60%);
  opacity: .95;
}

/* Grid */
.ap-newsletter__grid{
  position: relative;
  display: grid;
  grid-template-columns: 1.2fr .9fr;
  gap: clamp(18px, 3vw, 36px);
  padding: clamp(22px, 3.2vw, 44px);
}

/* Badge */
.ap-newsletter__badge{
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
  color: rgba(255,255,255,.70);
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.ap-dot{
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: linear-gradient(180deg, var(--ap-accent), var(--ap-accent2));
  box-shadow: 0 0 0 4px rgba(245,158,11,.10);
}

.ap-newsletter__badge-sep{ opacity: .55; }

/* Title */
.ap-newsletter__title{
  margin: 14px 0 10px;
  font-weight: 850;
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-size: clamp(30px, 3.4vw, 46px);
  color: rgba(255,255,255,.92) !important;
}

.ap-accent{
  background: linear-gradient(90deg, var(--ap-accent), var(--ap-accent2));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Subcopy */
.ap-newsletter__sub{
  margin: 0 0 18px;
  color: var(--ap-muted);
  font-size: 16px;
  line-height: 1.6;
  max-width: 58ch;
}

/* Bullets */
.ap-newsletter__list{
  list-style: none;
  padding: 0;
  margin: 0 0 18px;
  display: grid;
  gap: 12px;
}

.ap-newsletter__li{
  display: grid;
  grid-template-columns: 22px 1fr;
  align-items: start;
  gap: 10px;
  padding: 12px 12px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 14px;
  background: rgba(0,0,0,.20);
}

.ap-newsletter__li strong{ color: rgba(255,255,255,.92); }

.ap-check{
  width: 22px;
  height: 22px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  color: rgba(255,255,255,.92);
  background: linear-gradient(180deg, rgba(245,158,11,.18), rgba(249,115,22,.12));
  border: 1px solid rgba(245,158,11,.22);
}

.ap-check svg{ width: 18px; height: 18px; }

/* Trust row */
.ap-newsletter__trust{
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: 10px;
  padding: 14px 14px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  background: rgba(255,255,255,.03);
}

.ap-newsletter__trust-item{ display: grid; gap: 2px; }

.ap-newsletter__trust-kpi{
  font-weight: 850;
  font-size: 18px;
  letter-spacing: -0.01em;
}

.ap-newsletter__trust-txt{
  color: var(--ap-muted2);
  font-size: 12px;
}

.ap-newsletter__trust-divider{
  width: 1px;
  height: 34px;
  background: rgba(255,255,255,.10);
}

/* =========================
   RIGHT (FIX PRINCIPAL)
========================= */

/* Panel derecho en columna */
.ap-newsletter__right{
  display: flex;
  flex-direction: column;
}

/* Card derecha: contenido en columna y “estirable” */
.ap-newsletter__formCard{
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(420px 220px at 30% 0%, rgba(245,158,11,.10), transparent 65%),
    rgba(0,0,0,.26);
  padding: 18px 18px 14px;
  box-shadow: 0 18px 48px rgba(0,0,0,.45);
}

.ap-newsletter__formTop{ margin-bottom: 12px; }

.ap-newsletter__formTitle{
  font-weight: 850;
  font-size: 16px;
  letter-spacing: -0.01em;
}

.ap-newsletter__formNote{
  margin-top: 4px;
  color: var(--ap-muted2);
  font-size: 13px;
  line-height: 1.45;
}

/* Embed wrapper: que ocupe el “cuerpo” del panel */
.ap-newsletter__embed{
  flex: 1;
  min-height: 520px; /* AJUSTA si quieres: 500–560 */
  display: flex;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  overflow: hidden;
}

/* Iframe: que rellene el wrapper (CLAVE) */
.ap-newsletter__embed .beehiiv-embed{
  flex: 1;
  width: 100% !important;
  height: 100% !important;  /* CLAVE */
  min-height: 0;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Fine print */
.ap-newsletter__fineprint{
  margin-top: 10px;
  color: var(--ap-muted2);
  font-size: 12px;
  line-height: 1.5;
}

.ap-newsletter__hint{
  margin-top: 10px;
  color: rgba(255,255,255,.60);
  font-size: 13px;
  line-height: 1.55;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.18);
}

/* =========================================
   BUTTONS (Shared) — usable in both sections
========================================= */

.ap-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding: 12px 16px;
  border-radius: 14px;
  text-decoration:none;
  font-weight: 800;
  letter-spacing: .2px;
  border: 1px solid transparent;
  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease, opacity .15s ease;
  user-select:none;
  white-space:nowrap;
}

.ap-btn:focus{ outline:none; }
.ap-btn:focus-visible{
  box-shadow: 0 0 0 4px rgba(245,158,11,.22);
  border-color: rgba(245,158,11,.45);
}

.ap-btn--primary{
  color: #0b0e14;
  background: linear-gradient(180deg, rgba(255,191,77,1), rgba(245,158,11,1));
  box-shadow: 0 14px 34px rgba(245,158,11,.20);
}
.ap-btn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 44px rgba(245,158,11,.26);
}

.ap-btn--ghost{
  color: var(--ap-text);
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.12);
}
.ap-btn--ghost:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.18);
}

/* =========================================
NEWSLETTER — SECCIÓN INFERIOR (MEGA PRO)
Clase raíz: .ap-nl-below
BLINDADO anti-theme (links azules, márgenes raros, listas)
========================================= */

.ap-nl-below{
  --surface: rgba(255,255,255,.04);
  --surface2: rgba(255,255,255,.06);
  --border: rgba(255,255,255,.10);
  --border2: rgba(255,255,255,.14);
  --text: rgba(255,255,255,.92);
  --muted: rgba(255,255,255,.68);
  --muted2: rgba(255,255,255,.50);
  --accent: #f59e0b;
  --accent2: #ffbf4d;
  --shadow2: 0 14px 40px rgba(0,0,0,.45);
  --radius: 22px;

  color: var(--text);
  padding: clamp(28px, 4vw, 56px) 0;
  position: relative;
  isolation: isolate;
}

.ap-nl-below *{ box-sizing: border-box; }

/* Reset básico para que el theme no meta “su salsa” */
.ap-nl-below .ap-nl-wrap h1,
.ap-nl-below .ap-nl-wrap h2,
.ap-nl-below .ap-nl-wrap h3,
.ap-nl-below .ap-nl-wrap p,
.ap-nl-below .ap-nl-wrap ul,
.ap-nl-below .ap-nl-wrap li{
  margin: 0;
  padding: 0;
}

.ap-nl-below .ap-nl-wrap p{ margin-top: 10px; }
.ap-nl-below .ap-nl-wrap a{ color: inherit; text-decoration: none; }

.ap-nl-below::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(900px 420px at 18% 22%, rgba(245,158,11,.18), transparent 60%),
    radial-gradient(900px 520px at 85% 75%, rgba(245,158,11,.10), transparent 60%),
    radial-gradient(700px 380px at 55% 10%, rgba(255,255,255,.06), transparent 65%);
  opacity:.95;
  pointer-events:none;
}

.ap-nl-below__container{
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
}

.ap-nl-wrap{ position: relative; }

/* Buttons */
.ap-nl-below .ap-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.55rem;
  padding: 12px 16px;
  border-radius: 14px;
  font-weight: 850;
  letter-spacing: .2px;
  border: 1px solid transparent;
  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease, opacity .15s ease;
  user-select:none;
  white-space:nowrap;
}

.ap-nl-below .ap-btn:focus{ outline:none; }
.ap-nl-below .ap-btn:focus-visible{
  box-shadow: 0 0 0 4px rgba(245,158,11,.22);
  border-color: rgba(245,158,11,.45);
}

.ap-nl-below .ap-btn--primary{
  color: #0b0e14;
  background: linear-gradient(180deg, rgba(255,191,77,1), rgba(245,158,11,1));
  box-shadow: 0 14px 34px rgba(245,158,11,.20);
}
.ap-nl-below .ap-btn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 44px rgba(245,158,11,.26);
}

.ap-nl-below .ap-btn--ghost{
  color: var(--text);
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.12);
}
.ap-nl-below .ap-btn--ghost:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.18);
}

/* Punchline */
.ap-nl-punch{
  padding: clamp(18px, 2.2vw, 26px);
  border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: var(--shadow2);
  backdrop-filter: blur(10px);
}

.ap-nl-punch__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  font-size: 12px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--muted2);
}
.ap-nl-punch__eyebrow::before{
  content:"";
  width: 7px; height: 7px;
  border-radius: 99px;
  background: var(--accent);
  box-shadow: 0 0 0 3px rgba(245,158,11,.18);
}

.ap-nl-punch__title{
  margin-top: 10px;
  font-size: clamp(26px, 3.2vw, 40px);
  line-height: 1.06;
  letter-spacing: -0.02em;
}
.ap-nl-punch__title span{ color: var(--muted); font-weight: 800; }
.ap-nl-punch__title strong{
  color: var(--accent2);
  font-weight: 900;
  text-shadow: 0 12px 32px rgba(245,158,11,.15);
}

.ap-nl-punch__sub{
  margin-top: 12px;
  color: var(--muted);
  max-width: 68ch;
}

.ap-nl-punch__cta{
  margin-top: 16px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.ap-nl-punch__meta{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
  color: var(--muted2);
  font-size: 13px;
}
.ap-nl-punch__meta span{
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);
}

/* Grid cards */
.ap-nl-grid{
  margin-top: 18px;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 16px;
}

.ap-nl-card{
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow: var(--shadow2);
  backdrop-filter: blur(10px);
  overflow: hidden;
}

.ap-nl-card--value{
  padding: clamp(18px, 2.2vw, 24px);
}

.ap-nl-card__title{
  font-size: 18px;
  letter-spacing: -0.01em;
}

.ap-nl-card__lead{
  margin-top: 10px;
  color: var(--muted);
  max-width: 70ch;
}

/* list */
.ap-nl-list{
  margin-top: 14px;
  list-style: none;
  display:grid;
  gap: 10px;
}

.ap-nl-list li{
  display:flex;
  gap: 10px;
  align-items:flex-start;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.86);
}

.ap-nl-check{
  width: 22px;
  height: 22px;
  min-width: 22px;
  display:grid;
  place-items:center;
  border-radius: 999px;
  background: rgba(245,158,11,.16);
  border: 1px solid rgba(245,158,11,.30);
  color: var(--accent2);
  font-weight: 900;
  margin-top: 1px;
}

/* resource teaser */
.ap-nl-mini{
  margin-top: 14px;
  display:flex;
  gap: 12px;
  align-items:center;
  padding: 12px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(260px 160px at 12% 20%, rgba(245,158,11,.16), transparent 60%),
    rgba(255,255,255,.03);
}

.ap-nl-mini__box{
  position: relative;
  width: 92px;
  height: 62px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  overflow:hidden;
  flex: 0 0 auto;
}

.ap-nl-mini__lines{
  position:absolute;
  inset: 10px 10px 14px 10px;
  display:grid;
  gap: 7px;
}
.ap-nl-mini__lines span{
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
}
.ap-nl-mini__lines span:nth-child(2){ width: 78%; }
.ap-nl-mini__lines span:nth-child(3){ width: 62%; }
.ap-nl-mini__lines span:nth-child(4){ width: 86%; }

.ap-nl-mini__tag{
  position:absolute;
  right: 8px;
  bottom: 8px;
  font-size: 11px;
  color: rgba(255,255,255,.75);
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(0,0,0,.30);
  border: 1px solid rgba(255,255,255,.12);
}

.ap-nl-mini__text{
  color: var(--muted);
  max-width: 70ch;
}
.ap-nl-mini__text strong{ color: rgba(255,255,255,.92); }

/* Author */
.ap-nl-author{
  display:grid;
  grid-template-columns: 1fr;
}

.ap-nl-author__photo{
  position: relative;
  height: 180px;
  overflow:hidden;
}
.ap-nl-author__photo img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.05) saturate(1.05);
  transform: scale(1.03);
  display:block;
}
.ap-nl-author__photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(500px 220px at 30% 20%, rgba(245,158,11,.14), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.62));
  pointer-events:none;
}

.ap-nl-author__body{
  padding: 16px 18px 18px;
}

.ap-nl-author__kicker{
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted2);
}

.ap-nl-author__title{
  margin-top: 6px;
  font-size: 18px;
  letter-spacing: -0.01em;
}

.ap-nl-author__text{
  margin-top: 10px;
  color: var(--muted);
}

.ap-nl-badges{
  margin-top: 12px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  list-style: none;
}

.ap-nl-badge{
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.82);
  font-size: 13px;
}

.ap-nl-author__cta{
  margin-top: 14px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.ap-nl-author__hint{
  color: var(--muted2);
  font-size: 13px;
}

/* Final strip */
.ap-nl-final{
  margin-top: 16px;
  border-radius: var(--radius);
  border: 1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(700px 240px at 18% 30%, rgba(245,158,11,.16), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow: var(--shadow2);
  backdrop-filter: blur(10px);
  padding: 16px 18px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.ap-nl-final__copy{
  min-width: min(680px, 100%);
}

.ap-nl-final__title{
  font-size: 18px;
  letter-spacing: -0.01em;
}

.ap-nl-final__text{
  margin-top: 8px;
  color: var(--muted);
  max-width: 70ch;
}

.ap-nl-final__cta{
  display:flex;
  align-items:center;
  gap: 12px;
}

/* Responsive */
@media (max-width: 920px){
  .ap-nl-grid{ grid-template-columns: 1fr; }
  .ap-nl-author__photo{ height: 220px; }
  .ap-nl-final__copy{ min-width: 100%; }
}


