/*!
 * CHP-WEB-BLOG-PRO-04B - suscripcion «Recibe Sopa de letras» (indice del blog y pie del sitio).
 * Hoja propia. Todas las reglas cuelgan de .chp-sub. Usa los tokens de :root de main.css.
 * No toca main.css ni el marcado de Contact Form 7: solo lo viste.
 * Rollback = borrar este archivo.
 */

/* ---------- comun a los dos contextos ---------- */

.chp-sub {
  font-family: var(--font-ui, sans-serif);
}

.chp-sub .wpcf7 {
  margin: 0;
}

.chp-sub form.wpcf7-form {
  margin: 0;
}

.chp-sub .chp-sub__row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: .5rem;
  margin: 0;
}

.chp-sub .chp-sub__label {
  flex: 1 1 16rem;
  display: flex;
  flex-direction: column;
  gap: .3rem;
  margin: 0;
  max-width: none;
  font-family: var(--font-mono, monospace);
  font-size: .68rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-2, #6A6A66);
}

.chp-sub .wpcf7-form-control-wrap {
  display: block;
}

.chp-sub input.wpcf7-email {
  width: 100%;
  height: 44px;
  padding: 0 .8rem;
  border: 1px solid var(--ink, #141414);
  border-radius: 0;
  background: var(--paper, #fff);
  color: var(--ink, #141414);
  font-family: var(--font-ui, sans-serif);
  font-size: .92rem;
  -webkit-appearance: none;
  appearance: none;
}

.chp-sub input.wpcf7-email::placeholder {
  color: #9a978f;
  opacity: 1;
}

.chp-sub input.wpcf7-submit {
  flex: 0 0 auto;
  height: 44px;
  margin: 0;
  padding: 0 1.2rem;
  border: 1px solid var(--red, #E52521);
  border-radius: 0;
  background: var(--red, #E52521);
  color: #fff;
  font-family: var(--font-mono, monospace);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}

.chp-sub input.wpcf7-submit:hover {
  background: var(--red-2, #C21B17);
  border-color: var(--red-2, #C21B17);
}

.chp-sub input.wpcf7-email:focus-visible,
.chp-sub input.wpcf7-submit:focus-visible,
.chp-sub input[type="checkbox"]:focus-visible {
  outline: 3px solid var(--red, #E52521);
  outline-offset: 2px;
}

/* consentimiento: casilla + texto, siempre visible y nunca marcada por defecto */

.chp-sub .chp-sub__consent {
  margin: .7rem 0 0;
  max-width: none;
}

.chp-sub .chp-sub__consent .wpcf7-list-item {
  margin: 0;
}

.chp-sub .chp-sub__consent label {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  font-size: .78rem;
  line-height: 1.45;
  color: var(--ink-2, #6A6A66);
  cursor: pointer;
}

.chp-sub .chp-sub__consent input[type="checkbox"] {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin: .18rem 0 0;
  accent-color: var(--red, #E52521);
}

.chp-sub .chp-sub__consent a {
  color: var(--ink, #141414);
  text-decoration: underline;
}

.chp-sub .chp-sub__consent a:hover {
  color: var(--red, #E52521);
}

.chp-sub__note {
  margin: .55rem 0 0;
  max-width: none;
  font-size: .74rem;
  line-height: 1.4;
  color: var(--ink-2, #6A6A66);
}

/* mensajes de CF7 */

.chp-sub .wpcf7-not-valid-tip {
  margin-top: .3rem;
  font-size: .74rem;
  color: var(--red-2, #C21B17);
}

.chp-sub .wpcf7-response-output {
  margin: .7rem 0 0;
  padding: .6rem .8rem;
  border: 1px solid var(--line, rgba(20, 20, 20, .16));
  border-radius: 0;
  font-size: .8rem;
  line-height: 1.45;
  color: var(--ink, #141414);
}

.chp-sub form.sent .wpcf7-response-output {
  border-color: var(--ink, #141414);
}

.chp-sub form.invalid .wpcf7-response-output,
.chp-sub form.unaccepted .wpcf7-response-output,
.chp-sub form.failed .wpcf7-response-output,
.chp-sub form.spam .wpcf7-response-output {
  border-color: var(--red, #E52521);
  color: var(--red-2, #C21B17);
}

.chp-sub .wpcf7-spinner {
  margin: 0 0 0 .5rem;
}

/* ---------- indice de Sopa de letras ---------- */

/* Se imprime dentro de .blog-board__grid, tras el bloque de buscador y temas: fila completa. */
.blog-board__grid > .chp-sub--indice {
  grid-column: 1 / -1;
}

.chp-sub--indice {
  margin: 0 0 .5rem;
  padding: 0 0 1.4rem;
  border-bottom: 1px solid var(--line, rgba(20, 20, 20, .16));
}

.chp-sub--indice .chp-sub__eyebrow {
  margin: 0 0 .35rem;
  font-family: var(--font-mono, monospace);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-2, #6A6A66);
}

.chp-sub--indice .chp-sub__text {
  margin: 0 0 .9rem;
  max-width: 42rem;
  font-size: .95rem;
  line-height: 1.45;
  color: var(--ink, #141414);
}

.chp-sub--indice form.wpcf7-form {
  max-width: 38rem;
}

/* ---------- pie del sitio ---------- */

.chp-sub--pie {
  margin-top: 1.5rem;
  max-width: 26rem;
}

.chp-sub--pie .chp-sub__title {
  margin: 0 0 .6rem;
  max-width: none;
  font-family: var(--font-mono, monospace);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--red, #E52521);
}

.chp-sub--pie .chp-sub__label {
  flex: 1 1 11rem;
}

.chp-sub--pie input.wpcf7-email {
  height: 40px;
  font-size: .85rem;
}

.chp-sub--pie input.wpcf7-submit {
  height: 40px;
  padding: 0 1rem;
}

.chp-sub--pie .chp-sub__consent label {
  font-size: .74rem;
  line-height: 1.4;
}

.chp-sub--pie .chp-sub__note {
  font-size: .68rem;
}

/* ---------- movil ---------- */

@media (max-width: 520px) {
  .chp-sub .chp-sub__row {
    gap: .45rem;
  }
  .chp-sub .chp-sub__label,
  .chp-sub input.wpcf7-submit {
    flex: 1 1 100%;
  }
  .chp-sub input.wpcf7-submit {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .chp-sub input.wpcf7-submit { transition: none; }
}