/* =========================================================================
   A. ANCHO ÚTIL EN MÓVIL  ·  APLICAR PRIMERO
   -------------------------------------------------------------------------
   Medido: a 375px de viewport el formulario ocupa 240px (el 64%).
   Causa exacta: el tema "corredo" fija .content_wrap{width:280px} en ese
   breakpoint, y section.tribe-events-pg-template añade 20px de padding por
   lado.  375 − 95 (márgenes de centrado) − 40 (padding) = 240.
   Con el arreglo: 343px. Verificado, sin scroll horizontal.
   Es el único bloque fuera del formulario; va acotado a la plantilla de
   evento individual.
   ========================================================================= */
@media (max-width: 767px) {

  .single-tribe_events .content_wrap {
    width: auto !important;      /* el tema impone width:280px */
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .single-tribe_events .tribe-events-pg-template {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}


/* =========================================================================
   B. TOKENS Y ESCALA TIPOGRÁFICA
   -------------------------------------------------------------------------
   ESCALA (base 16px). Siete niveles, cada uno con un trabajo distinto.
   El problema de hoy es que existen dos: 16px normal y 14px normal.

     nivel                        tamaño   peso  familia   color
     ───────────────────────────────────────────────────────────────────────
     Título de bloque             20px     400   Coda      #4D463D  (mayúsc.)
     Precio en USD                26px     700   Coda      #FF0013
     Equivalente en bolívares     17px     700   —         #4D463D
     Valor dentro del campo       16px     400   —         #4D463D
     Etiqueta de campo            15px     600   —         #4D463D
     Botón de envío               19px     700   Coda      #FFF   (mayúsc.)
     Número de cuenta             18px     400   mono      #4D463D
     Texto de ayuda / aviso       14px     400   —         #807666
     Error de campo               14px     600   —         #C00010
     Legal y secundario           12.5px   400   —         #807666
     Etiquetilla de sección       13px     400   Coda      #C00010  (mayúsc.)

   La regla de jerarquía: el peso visual lo dan TAMAÑO + PESO + COLOR, en
   ese orden. El color rojo NO se reparte: ver bloque I.
   ========================================================================= */
.wpcf7[data-wpcf7-id="6186"] {

  /* --- Marca --- */
  --gf-rojo:         #FF0013;   /* rojo GaleraFort: fondos y texto GRANDE */
  --gf-rojo-oscuro:  #C00010;   /* 6.5:1 sobre blanco → texto pequeño legible */
  --gf-rojo-activo:  #D9000F;
  --gf-rosa:         #FFF1F2;

  /* --- Texto (valores reales del tema) --- */
  --gf-titulo:       #4D463D;   /* rgb(77,70,61)   */
  --gf-texto:        #7A7060;   /* 4,87:1 sobre blanco (antes #807666 = 4,47:1, no pasaba AA) */
  --gf-tenue:        #A0988C;

  /* --- Superficies --- */
  --gf-borde:        #8A8272;   /* 3,80:1: cumple el mínimo 3:1 de 1.4.11 (antes #EBE9E5 = 1,21:1) */
  --gf-borde-fuerte: #767066;   /* 4,91:1, para el radio y el recuadro del adjunto */
  --gf-fondo:        #fff;
  --gf-fondo-suave:  #FAF9F7;
  --gf-fondo-inerte: #F2EFEA;   /* campos calculados / no editables */

  /* --- Escala tipográfica (ver tabla arriba) --- */
  --gf-fs-bloque:    20px;
  --gf-fs-precio:    26px;
  --gf-fs-bs:        17px;
  --gf-fs-cuenta:    18px;
  --gf-fs-boton:     19px;
  --gf-fs-valor:     16px;
  --gf-fs-etiqueta:  15px;
  --gf-fs-ayuda:     14px;
  --gf-fs-legal:     12.5px;
  --gf-fs-tag:       13px;

  /* --- Espaciado, base 4px --- */
  --gf-s1: 4px;  --gf-s2: 8px;  --gf-s3: 12px;
  --gf-s4: 16px; --gf-s6: 24px; --gf-s8: 32px; --gf-s10: 40px;

  --gf-radio: 10px;
  --gf-alto:  52px;             /* alto táctil de todo control (>44px WCAG) */
  --gf-trans: 150ms ease;
}


/* =========================================================================
/* =========================================================================
   F. CONTROLES
   -------------------------------------------------------------------------
   Medido en producción:
     · input[type=text] a font-size 14px → iOS Safari hace ZOOM al enfocar
       cualquier campo por debajo de 16px. En un formulario de 14 campos son
       14 saltos de zoom. Es el peor defecto móvil que tiene hoy.
     · alturas dispares: texto 47px, select 48px, fecha 52px
     · el campo de fecha arrastra un border:2px solid #b8960c (dorado) del
       CSS del sitio que no pega con nada; su radius 4px sí se aplica.
     · el tema añade margin-bottom:10.4px a cada input: se anula aquí.
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] input[type="text"],
.wpcf7[data-wpcf7-id="6186"] input[type="tel"],
.wpcf7[data-wpcf7-id="6186"] input[type="email"],
.wpcf7[data-wpcf7-id="6186"] input[type="number"],
.wpcf7[data-wpcf7-id="6186"] input[type="date"],
.wpcf7[data-wpcf7-id="6186"] select {
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0;                     /* anula el margin-bottom del tema */
  min-height: var(--gf-alto);    /* 52px */
  padding: var(--gf-s3) var(--gf-s4);

  font-size: var(--gf-fs-valor); /* 16px ← IMPRESCINDIBLE: corta el zoom iOS */
  line-height: 1.4;
  color: var(--gf-titulo);

  background-color: var(--gf-fondo);
  border: 2px solid var(--gf-borde);
  border-radius: var(--gf-radio);

  transition: border-color var(--gf-trans), box-shadow var(--gf-trans);
  appearance: none;
  -webkit-appearance: none;
}

/* Normaliza el campo de fecha con el resto */
.wpcf7[data-wpcf7-id="6186"] input[type="date"] {
  border-color: var(--gf-borde);
  border-radius: var(--gf-radio);
  padding: var(--gf-s3) var(--gf-s4);
}

/* El tema envuelve los <select> en div.select_container con su propia flecha */
.wpcf7[data-wpcf7-id="6186"] .select_container { display: block; width: 100%; }
.wpcf7[data-wpcf7-id="6186"] select { padding-right: 44px; }

.wpcf7[data-wpcf7-id="6186"] ::placeholder {
  color: var(--gf-tenue);
  opacity: 1;
  font-weight: 400;
}

/* Foco visible. Nunca outline:none a secas. */
.wpcf7[data-wpcf7-id="6186"] input:focus,
.wpcf7[data-wpcf7-id="6186"] select:focus {
  outline: none;
  border-color: var(--gf-rojo);
  box-shadow: 0 0 0 3px rgba(255, 0, 19, 0.15);
}
.wpcf7[data-wpcf7-id="6186"] input:focus-visible,
.wpcf7[data-wpcf7-id="6186"] select:focus-visible {
  outline: 2px solid var(--gf-rojo);
  outline-offset: 2px;
}

/* Flechitas del number: roban ancho en campos de 2-3 dígitos */
.wpcf7[data-wpcf7-id="6186"] input[type="number"] { -moz-appearance: textfield; }
.wpcf7[data-wpcf7-id="6186"] input[type="number"]::-webkit-outer-spin-button,
.wpcf7[data-wpcf7-id="6186"] input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none; margin: 0;
}

/* Anchos proporcionales al contenido esperado (solo desde 700px) */
@media (min-width: 700px) {
  .wpcf7[data-wpcf7-id="6186"] input[name="edad"],
  .wpcf7[data-wpcf7-id="6186"] input[name="participantes"],
  .wpcf7[data-wpcf7-id="6186"] select[name="franela"] { max-width: 140px; }

  .wpcf7[data-wpcf7-id="6186"] input[name="cedula"],
  .wpcf7[data-wpcf7-id="6186"] input[name="telefono"],
  .wpcf7[data-wpcf7-id="6186"] input[type="date"] { max-width: 260px; }
}


/* =========================================================================
/* =========================================================================
   H. RADIOS (SEXO) ACCESIBLES
   -------------------------------------------------------------------------
   Estado actual medido:
     · input[type=radio]{display:none} ← así los esconde el tema. Un control
       con display:none SALE del árbol de accesibilidad y NO recibe foco de
       teclado: el campo es inoperable sin ratón o dedo.
     · el control visible es un ::before de 14.5px CUADRADO (parece checkbox)
     · zona táctil real 24px de alto; el mínimo WCAG son 44px
     · "Masculino" trae checked="checked": si el usuario no toca nada, se
       registra Masculino en silencio (se corrige en el cuerpo de CF7, no aquí)

   Se cambia display:none por "visualmente oculto pero enfocable" y se
   construyen chips táctiles. El input es hermano previo del <span>, así que
   input:checked + span funciona.
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio {
  display: flex;
  gap: var(--gf-s2);
  flex-wrap: wrap;
  line-height: normal;
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item {
  display: block;
  margin: 0;                     /* el tema mete margin-left:16px */
  flex: 1 1 140px;
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item label {
  display: flex;
  align-items: center;
  min-height: var(--gf-alto);    /* 52px de zona táctil real */
  padding: 0 var(--gf-s4);
  border: 2px solid var(--gf-borde);
  border-radius: var(--gf-radio);
  background: var(--gf-fondo);
  cursor: pointer;
  transition: border-color var(--gf-trans), background-color var(--gf-trans);
}

/* Invisible pero enfocable y anunciado por lectores de pantalla */
.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio input[type="radio"] {
  display: inline-block;         /* revierte el display:none del tema */
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item-label {
  position: relative;
  padding-left: 30px;
  font-size: var(--gf-fs-valor); /* 16px */
  color: var(--gf-titulo);
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item-label::before {
  content: "";
  position: absolute; left: 0; top: 50%;
  transform: translateY(-50%);
  width: 20px; height: 20px;
  box-sizing: border-box;
  border: 2px solid var(--gf-borde-fuerte);
  border-radius: 50%;            /* círculo, no cuadrado */
  background: var(--gf-fondo);
  transition: border-color var(--gf-trans);
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item-label::after {
  content: "";
  position: absolute; left: 6px; top: 50%;
  transform: translateY(-50%) scale(0);
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--gf-rojo);
  transition: transform var(--gf-trans);
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio input:checked + .wpcf7-list-item-label::before { border-color: var(--gf-rojo); }
.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio input:checked + .wpcf7-list-item-label::after  { transform: translateY(-50%) scale(1); }

.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item label:has(input:checked) {
  border-color: var(--gf-rojo);
  background: var(--gf-rosa);
}
.wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item label:has(input:focus-visible) {
  outline: 2px solid var(--gf-rojo);
  outline-offset: 2px;
}


/* =========================================================================
/* =========================================================================
   K. CAMPO DE ARCHIVO (RECIBO DE PAGO)
   -------------------------------------------------------------------------
   Campo OBLIGATORIO y, medido, el elemento MENOS visible del formulario:
   input[type=file] nativo de 26px de alto, sin borde, sin fondo, sin
   relleno. En un móvil de gama baja es una línea gris que se confunde con
   el párrafo de arriba. Si no se ve, el envío falla y el usuario no
   entiende por qué.
   ::file-selector-button: Chrome 89+, Safari 14.1+, Firefox 82+.
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] input[type="file"] {
  box-sizing: border-box;
  display: block;
  width: 100%;
  margin: 0;
  padding: var(--gf-s4);
  font-size: var(--gf-fs-etiqueta);      /* 15px */
  color: var(--gf-texto);
  background: var(--gf-fondo);
  border: 2px dashed var(--gf-borde-fuerte);
  border-radius: var(--gf-radio);
  cursor: pointer;
  transition: border-color var(--gf-trans), background-color var(--gf-trans);
}

.wpcf7[data-wpcf7-id="6186"] input[type="file"]:hover {
  border-color: var(--gf-rojo);
  background: var(--gf-rosa);
}
.wpcf7[data-wpcf7-id="6186"] input[type="file"]:focus-visible {
  outline: 2px solid var(--gf-rojo);
  outline-offset: 2px;
}

.wpcf7[data-wpcf7-id="6186"] input[type="file"]::file-selector-button {
  margin-right: var(--gf-s3);
  min-height: 44px;
  padding: 0 var(--gf-s4);
  font-family: "Coda", inherit;
  font-size: var(--gf-fs-ayuda);         /* 14px */
  color: #fff;
  background: var(--gf-rojo);
  border: 0;
  border-radius: 8px;
  cursor: pointer;
}
.wpcf7[data-wpcf7-id="6186"] input[type="file"]::file-selector-button:hover {
  background: var(--gf-rojo-activo);
}
/* Alias WebKit antiguo (Safari < 14.1, WebView de Android viejo) */
.wpcf7[data-wpcf7-id="6186"] input[type="file"]::-webkit-file-upload-button {
  margin-right: var(--gf-s3);
  min-height: 44px;
  padding: 0 var(--gf-s4);
  font-size: var(--gf-fs-ayuda);
  color: #fff;
  background: var(--gf-rojo);
  border: 0;
  border-radius: 8px;
  cursor: pointer;
}


/* =========================================================================
   L. BOTÓN DE ENVÍO  ·  NIVEL 1 DE LA JERARQUÍA
   -------------------------------------------------------------------------
   Medido hoy: 237×43px con font-size 12px para la acción principal de toda
   la página.
   CONTRASTE: blanco sobre #FF0013 da 3.99:1. WCAG AA exige 4.5:1 en texto
   normal y 3:1 en texto grande (≥18.66px en negrita). A 12px INCUMPLE;
   a 19px/700 CUMPLE como texto grande sin tocar el rojo de marca.
   (La alternativa sería oscurecer el fondo a #E00012 —4.8:1—, pero eso ya
   cambia el color de marca.)

   Es el ÚNICO elemento con relleno rojo sólido en todo el formulario.
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] input[type="submit"].wpcf7-submit {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 60px;
  margin: 0;
  padding: var(--gf-s4) var(--gf-s6);

  font-family: "Coda", inherit;
  font-size: var(--gf-fs-boton);         /* 19px ← no bajar: sostiene el AA */
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #fff;

  background: var(--gf-rojo);
  border: 0;
  border-radius: var(--gf-radio);
  box-shadow: 0 2px 8px rgba(255, 0, 19, 0.25);
  cursor: pointer;
  transition: background-color var(--gf-trans), transform var(--gf-trans),
              box-shadow var(--gf-trans);
}

.wpcf7[data-wpcf7-id="6186"] input[type="submit"].wpcf7-submit:hover {
  background: var(--gf-rojo-activo);
  box-shadow: 0 4px 14px rgba(255, 0, 19, 0.32);
}
.wpcf7[data-wpcf7-id="6186"] input[type="submit"].wpcf7-submit:active {
  transform: translateY(1px);
  box-shadow: 0 1px 4px rgba(255, 0, 19, 0.3);
}
.wpcf7[data-wpcf7-id="6186"] input[type="submit"].wpcf7-submit:focus-visible {
  outline: 3px solid var(--gf-titulo);
  outline-offset: 3px;
}

/* CF7 pone .submitting en el <form> mientras envía */
.wpcf7[data-wpcf7-id="6186"] form.submitting input[type="submit"].wpcf7-submit {
  opacity: 0.65;
  cursor: progress;
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-spinner {
  display: block;
  margin: var(--gf-s3) auto 0;
}

/* Si se saca el <p> del submit fuera de .two-columns-form envuelto en
   <div class="gf-enviar"> (recomendado), ocupa el ancho completo. */
.wpcf7[data-wpcf7-id="6186"] .gf-enviar {
  max-width: 480px;
  margin: var(--gf-s6) auto 0;
}


/* =========================================================================

/* =========================================================================
   EXTRA · Correcciones de contraste añadidas al aplicar la tanda 1
   ------------------------------------------------------------------------
   Sobre los recuadros que inyectan los plugins propios de GaleraFort.
   ========================================================================= */

/* La línea de la tasa BCV iba a opacity .75, lo que la dejaba en 4,35:1
   sobre el rosa. Justo la advertencia legal era lo menos legible. */
.gf-precio .gf-precio-tasa { opacity: 1; color: #5C5648; }   /* 6,64:1 */

/* El aviso de categoría por edad hereda el color del cuerpo: se fija uno
   que pase AA. La variante de error ya pasaba (6,54:1). */
.gf-edad-aviso.gf-ok { color: #7A7060; }

/* =========================================================================
   AJUSTES verificados en producción al aplicar la tanda 1
   ========================================================================= */

/* 1. El tema gana por especificidad en el color del borde:
      `.scheme_default .wpcf7 input:not(...)` pesa (0,5,1) y deja el borde en
      #EBE9E5 (1,21:1). Se iguala el peso subiendo a (0,6,1). */
.scheme_default .wpcf7[data-wpcf7-id="6186"] input:not([type="submit"]):not([type="radio"]):not([type="checkbox"]),
.scheme_default .wpcf7[data-wpcf7-id="6186"] select,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .select_container {
  border-color: var(--gf-borde);
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] input:not([type="submit"]):not([type="radio"]):not([type="checkbox"]):focus,
.scheme_default .wpcf7[data-wpcf7-id="6186"] select:focus {
  border-color: var(--gf-rojo);
}

/* 2. Con los campos a ancho completo, las dos columnas vuelven a caber una
      al lado de la otra en el móvil y los campos quedan a 181px. Antes se
      apilaban solo por accidente (el min-width de size="40"). Se apilan
      ahora de forma explícita. */
@media (max-width: 767px) {
  .wpcf7[data-wpcf7-id="6186"] .two-columns-form { display: block; }
  .wpcf7[data-wpcf7-id="6186"] .two-columns-form .column {
    width: auto;
    margin-right: 0;
  }
}

/* =========================================================================
   TANDA 2 · Etiquetas reales, aviso inicial y textos de ayuda
   ========================================================================= */

/* Las etiquetas pasaron de texto suelto a <label for>. Se les da el peso de
   etiqueta de la escala: 15px/600, más oscuras que el texto de ayuda. */
.wpcf7[data-wpcf7-id="6186"] label {
  display: inline-block;
  margin-bottom: var(--gf-s1);
  font-size: var(--gf-fs-etiqueta);   /* 15px */
  font-weight: 600;
  color: var(--gf-titulo);
  line-height: 1.3;
}

/* "(opcional)" en Team: el único campo que se puede dejar en blanco. */
.wpcf7[data-wpcf7-id="6186"] .gf-opcional {
  font-weight: 400;
  color: var(--gf-texto);
}

/* Texto de ayuda bajo un campo (edad calculada, formatos del recibo). */
.wpcf7[data-wpcf7-id="6186"] .gf-ayuda {
  display: block;
  margin: var(--gf-s1) 0 var(--gf-s2);
  font-size: var(--gf-fs-ayuda);      /* 14px */
  color: var(--gf-texto);
  line-height: 1.4;
}

/* Aviso de la cabecera: lo que hay que tener a mano antes de empezar. */
.wpcf7[data-wpcf7-id="6186"] .gf-aviso-inicio {
  margin: 0 0 var(--gf-s6);
  padding: var(--gf-s3) var(--gf-s4);
  border-left: 5px solid var(--gf-borde-fuerte);
  background: var(--gf-fondo-suave);
  font-size: var(--gf-fs-ayuda);
  color: var(--gf-titulo);
  line-height: 1.5;
}

/* El grupo Sexo ahora es <fieldset><legend>, que traen estilos del navegador. */
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo {
  margin: 0 0 var(--gf-s4);
  padding: 0;
  border: 0;
}
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo legend {
  margin-bottom: var(--gf-s1);
  padding: 0;
  font-size: var(--gf-fs-etiqueta);
  font-weight: 600;
  color: var(--gf-titulo);
}

/* El campo de edad se rellena solo y queda de solo lectura: que se vea. */
.wpcf7[data-wpcf7-id="6186"] input[type="number"][readonly] {
  background: var(--gf-fondo-inerte);
  cursor: not-allowed;
}

/* El tema fija el fondo de los input con mayor especificidad que la regla de
   arriba, así que el campo calculado seguía blanco. Se iguala el peso. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] input[type="number"][readonly],
.scheme_default .wpcf7[data-wpcf7-id="6186"] input[readonly]:not([type="submit"]) {
  background-color: var(--gf-fondo-inerte);
  cursor: not-allowed;
}

/* Los dos botones de Sexo quedaban desalineados (68px vs 60px de alto) por
   márgenes que el tema añade a la primera opción. Se igualan. */
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo .wpcf7-radio { align-items: stretch; }
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo .wpcf7-list-item {
  margin: 0 !important;
  padding: 0 !important;
}
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo .wpcf7-list-item label { margin: 0; height: 100%; }

/* El tema pone los <legend> en cursiva: se igualan al resto de etiquetas. */
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo legend {
  font-style: normal;
  margin-bottom: var(--gf-s2);
}

/* =========================================================================
   AJUSTE · El punto del botón de Sexo no se veía al seleccionar
   -------------------------------------------------------------------------
   El tema define sus propias reglas sobre .wpcf7-list-item-label::before y
   ::after con más peso (usa .scheme_default y la fuente fontello), así que
   el círculo se quedaba gris y el punto a escala 0. Se igualan los pesos.
   ========================================================================= */

.scheme_default .wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item-label::before {
  content: "";
  font-family: inherit;           /* el tema usa un glifo de fontello */
  width: 22px;
  height: 22px;
  border: 2px solid var(--gf-borde-fuerte);
  border-radius: 50%;
  background: #fff;
}

.scheme_default .wpcf7[data-wpcf7-id="6186"] .wpcf7-radio input:checked + .wpcf7-list-item-label::before {
  border-color: var(--gf-rojo);
  background: #fff;
}

/* El punto interior: relleno sólido, sin depender de ninguna fuente. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .wpcf7-radio input:checked + .wpcf7-list-item-label::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 50%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--gf-rojo);
  transform: translateY(-50%) scale(1);
}
/* =========================================================================
   C. ESTRUCTURA POR BLOQUES
   -------------------------------------------------------------------------
   Requiere el marcado mínimo descrito en el informe:

     <div class="gf-bloque">
       <h3 class="gf-bloque-titulo"><span class="gf-num">1</span>Datos personales</h3>
       <div class="two-columns-form"> … </div>
     </div>

   Reparto de campos:
     Bloque 1 · Datos personales → nombre, apellido, cedula,
                                   fecha-nacimiento, edad, sexo,
                                   telefono, email
     Bloque 2 · Tu inscripción   → modalidad, .gf-precio, .gf-edad-aviso,
                                   categoria (cond.), participantes (cond.),
                                   franela, team
     Bloque 3 · Pago             → datos bancarios, tabla de costos,
                                   teléfono de confirmación, recibo, botón
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] .gf-bloque {
  margin: 0 0 var(--gf-s10);
}

.wpcf7[data-wpcf7-id="6186"] .gf-bloque-titulo {
  display: flex;
  align-items: center;
  gap: var(--gf-s3);
  margin: 0 0 var(--gf-s6);
  padding-bottom: var(--gf-s3);

  font-family: "Coda", inherit;
  font-size: var(--gf-fs-bloque);        /* 20px */
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gf-titulo);

  border-bottom: 2px solid var(--gf-borde);
}

/* Número del bloque: el único punto rojo permitido fuera del precio y el
   botón. Es pequeño y no compite. */
.wpcf7[data-wpcf7-id="6186"] .gf-bloque-titulo .gf-num {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  font-size: var(--gf-fs-tag);           /* 13px */
  line-height: 1;
  color: #fff;
  background: var(--gf-rojo);            /* 13px blanco sobre rojo = decorativo:
                                            el número también está en el texto
                                            del título, así que no aporta
                                            información única. */
  border-radius: 50%;
}

/* Etiquetilla de sección dentro del bloque de pago (ver J) */
.wpcf7[data-wpcf7-id="6186"] .gf-tag {
  display: block;
  margin: 0 0 var(--gf-s2);
  font-family: "Coda", inherit;
  font-size: var(--gf-fs-tag);           /* 13px */
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gf-rojo-oscuro);          /* 6.5:1 — legible a 13px */
}


/* =========================================================================
   D. LAYOUT EN REJILLA
   -------------------------------------------------------------------------
   El tema usa .two-columns-form{display:flex} + .column{flex:1;margin-right:20px}
   sin ninguna media query. En móvil las columnas NO se apilan por diseño:
   se apilan por accidente, porque el min-width:auto de los inputs size="40"
   desborda el flex. Efecto medido: columnas de 220/220/220/237px — anchos
   desiguales — y un margin-right de 20px colgando de la última columna.
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] .wpcf7-form {
  max-width: 860px;              /* medido: 1048px en desktop → inputs de
                                    504px para una cédula de 8 dígitos */
  margin-inline: auto;
}

.wpcf7[data-wpcf7-id="6186"] .two-columns-form {
  display: grid;
  grid-template-columns: 1fr;    /* móvil primero */
  gap: 0 var(--gf-s8);
}

.wpcf7[data-wpcf7-id="6186"] .two-columns-form .column {
  margin-right: 0;               /* mata el margen colgante */
  min-width: 0;                  /* evita el desborde por min-width:auto */
}

/* .clearfix es un resto del layout flotado: como hijo de grid crea una fila
   vacía. */
.wpcf7[data-wpcf7-id="6186"] .two-columns-form .clearfix {
  display: none;
}

@media (min-width: 700px) {
  .wpcf7[data-wpcf7-id="6186"] .two-columns-form {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}


/* =========================================================================

/* =========================================================================
   I. JERARQUÍA DE LOS RECUADROS  ·  .gf-precio y .gf-edad-aviso
   -------------------------------------------------------------------------
   Verificado en el DOM: son HERMANOS CONTIGUOS dentro de .column, en este
   orden exacto:
       <p>Modalidad</p>
       <p>[select modalidad]</p>
       <div class="gf-precio">          ← rosa + borde rojo 5px + 26px rojo
       <p class="gf-edad-aviso">        ← hoy vacío; en error, rosa + rojo
       <div data-id="cond-categoria">
       <div data-id="cond-familia">

   PROBLEMA: si el aviso de edad usa el MISMO fondo rosado y el MISMO rojo
   que el precio, los dos recuadros se funden en una sola mancha rosa de
   ~250px y el usuario no sabe cuál leer primero. Y con el botón rojo sólido
   al final, la página tendría tres focos rojos compitiendo.

   REGLA DE JERARQUÍA que propongo — un solo elemento por nivel:

     Nivel 1  ACCIÓN        botón de envío        ROJO SÓLIDO de fondo
     Nivel 2  DATO CLAVE    .gf-precio            rosa + borde 5px + 26px rojo
     Nivel 3  CONFIRMACIÓN  .gf-edad-aviso        NEUTRO: sin fondo rosa,
                                                  filete gris, 14px
     Nivel 4  ERROR         .gf-edad-aviso.gf-error  blanco + borde rojo
                                                  completo + texto #C00010

   Es decir: el aviso de edad en estado normal NO lleva rosa. El rosa queda
   reservado al precio. Y cuando el aviso pasa a error, en lugar de repetir
   el rosa usa fondo BLANCO con borde rojo en los cuatro lados: destaca por
   contraste con el rosa de arriba, no por competir con él.
   ========================================================================= */

/* --- Nivel 2: el precio. Gana dentro de la columna. --- */
.wpcf7[data-wpcf7-id="6186"] .gf-precio {
  display: block;
  margin: 0 0 var(--gf-s3);
  padding: var(--gf-s4);
  background: var(--gf-rosa);
  border: 1px solid rgba(255, 0, 19, 0.18);
  border-left: 5px solid var(--gf-rojo);
  border-radius: var(--gf-radio);
  color: var(--gf-titulo);
  line-height: 1.5;
}

/* 26px/700: a ese tamaño el rojo #FF0013 sobre el rosa #FFF1F2 da 3.63:1,
   que cumple AA como TEXTO GRANDE (umbral 3:1).
   NO bajar de 18.66px en negrita o deja de cumplir. */
.wpcf7[data-wpcf7-id="6186"] .gf-precio .gf-precio-usd {
  display: block;
  font-family: "Coda", inherit;
  font-size: var(--gf-fs-precio);        /* 26px */
  font-weight: 700;
  line-height: 1.15;
  color: var(--gf-rojo);
}

.wpcf7[data-wpcf7-id="6186"] .gf-precio .gf-precio-usd .gf-precio-nota {
  font-family: inherit;
  font-size: var(--gf-fs-ayuda);         /* 14px */
  font-weight: 400;
  color: var(--gf-texto);
  white-space: nowrap;
}

.wpcf7[data-wpcf7-id="6186"] .gf-precio .gf-precio-ves {
  display: block;
  margin-top: var(--gf-s1);
  font-size: var(--gf-fs-bs);            /* 17px */
  font-weight: 700;
  color: var(--gf-titulo);
}

.wpcf7[data-wpcf7-id="6186"] .gf-precio .gf-precio-tasa {
  display: block;
  margin-top: var(--gf-s2);
  font-size: var(--gf-fs-legal);         /* 12.5px */
  font-weight: 400;
  line-height: 1.45;
  color: var(--gf-texto);
  opacity: 1;                            /* el plugin usa opacity:.75 →
                                            baja el contraste por debajo de AA */
}

/* --- Nivel 3: el aviso de edad en estado normal. Deliberadamente callado. --- */
.wpcf7[data-wpcf7-id="6186"] .gf-edad-aviso {
  display: block;
  margin: 0 0 18px;
  padding: var(--gf-s2) 0 var(--gf-s2) var(--gf-s3);

  font-size: var(--gf-fs-ayuda);         /* 14px */
  font-weight: 400;
  line-height: 1.45;
  color: var(--gf-texto);

  background: none;                      /* sin rosa: no compite con el precio */
  border: 0;
  border-left: 3px solid var(--gf-borde-fuerte);
  border-radius: 0;
}

/* Cuando está vacío no debe dejar un hueco fantasma */
.wpcf7[data-wpcf7-id="6186"] .gf-edad-aviso:empty {
  display: none;
}

/* Si el plugin marca la categoría detectada, que sea lo único con peso */
.wpcf7[data-wpcf7-id="6186"] .gf-edad-aviso strong,
.wpcf7[data-wpcf7-id="6186"] .gf-edad-aviso b {
  font-weight: 600;
  color: var(--gf-titulo);
}

/* --- Nivel 4: variante de error. Destaca por CONTRASTE, no por más rosa. --- */
.wpcf7[data-wpcf7-id="6186"] .gf-edad-aviso.gf-error,
.wpcf7[data-wpcf7-id="6186"] .gf-edad-aviso.is-error,
.wpcf7[data-wpcf7-id="6186"] .gf-edad-aviso[data-estado="error"] {
  padding: var(--gf-s3) var(--gf-s4);
  font-size: var(--gf-fs-etiqueta);      /* 15px */
  font-weight: 600;
  color: var(--gf-rojo-oscuro);          /* 6.5:1 sobre blanco */
  background: var(--gf-fondo);           /* BLANCO, no rosa */
  border: 2px solid var(--gf-rojo-oscuro);
  border-radius: var(--gf-radio);
}

/* Si el plugin ya trae su propio fondo rosado en la variante de error y no
   se puede cambiar, al menos hay que separarlo del precio para que no se
   fundan. Descomentar SOLO en ese caso:

.wpcf7[data-wpcf7-id="6186"] .gf-precio + .gf-edad-aviso.gf-error {
  margin-top: var(--gf-s4);
  box-shadow: 0 0 0 1px #fff, 0 2px 10px rgba(192,0,16,.18);
}
*/


/* =========================================================================
   J. BLOQUE DE PAGO
   -------------------------------------------------------------------------
   Hoy son dos columnas de <p> con <br> sueltos, sin fondo ni jerarquía, en
   mitad del formulario. El número de cuenta —el dato que el usuario tiene
   que copiar a mano en su app bancaria— pesa visualmente exactamente igual
   que "Titular Cuenta:". Es el peor punto de jerarquía del formulario.

   Selector sin tocar el marcado: es el segundo .two-columns-form, precedido
   por el <hr>. Si se añade la clase .gf-pago, mejor.
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] .two-columns-form + hr + .two-columns-form,
.wpcf7[data-wpcf7-id="6186"] .gf-pago {
  padding: var(--gf-s6) var(--gf-s4);
  background: var(--gf-fondo-suave);
  border: 1px solid var(--gf-borde);
  border-radius: 14px;
  gap: var(--gf-s6) var(--gf-s8);
}

/* Los rótulos en mayúsculas del texto plano ("TIPO DE PAGOS:",
   "COSTO DE LA INSCRIPCIÓN:", "NÚMERO TELEFÓNICO…") son el primer <p> de su
   bloque: se convierten en etiquetilla de sección. */
.wpcf7[data-wpcf7-id="6186"] .two-columns-form + hr + .two-columns-form .column > p:first-child,
.wpcf7[data-wpcf7-id="6186"] .gf-pago .column > p:first-child {
  margin-bottom: var(--gf-s2);
  font-family: "Coda", inherit;
  font-size: var(--gf-fs-tag);           /* 13px */
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gf-rojo-oscuro);
}

.wpcf7[data-wpcf7-id="6186"] .two-columns-form + hr + .two-columns-form .column > p,
.wpcf7[data-wpcf7-id="6186"] .gf-pago .column > p {
  margin: 0 0 var(--gf-s4);
  font-size: var(--gf-fs-etiqueta);      /* 15px */
  line-height: 1.7;                      /* aire entre las líneas del <br> */
  color: var(--gf-titulo);
}

/* --- Datos bancarios como lista de definición ---
   REQUIERE marcado (ver informe):
     <dl class="gf-banco">
       <dt>Banco</dt><dd>BNC</dd>
       <dt>Cuenta</dt><dd><span class="gf-cuenta">0191-0235-14-2100090655</span></dd>
       <dt>Titular</dt><dd>Educaplus S.A.</dd>
       <dt>RIF</dt><dd>J-50762683-0</dd>
     </dl>                                                                 */
.wpcf7[data-wpcf7-id="6186"] .gf-banco {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--gf-s2) var(--gf-s4);
  align-items: baseline;
  margin: 0;
  padding: var(--gf-s4);
  background: var(--gf-fondo);
  border: 1px solid var(--gf-borde);
  border-radius: var(--gf-radio);
}

.wpcf7[data-wpcf7-id="6186"] .gf-banco dt {
  margin: 0;
  font-size: var(--gf-fs-legal);         /* 12.5px */
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gf-texto);
  white-space: nowrap;
}

.wpcf7[data-wpcf7-id="6186"] .gf-banco dd {
  margin: 0;
  font-size: var(--gf-fs-etiqueta);      /* 15px */
  font-weight: 600;
  color: var(--gf-titulo);
  overflow-wrap: anywhere;
}

/* En móvil, etiqueta encima del dato: 12.5px + 18px no caben en una fila */
@media (max-width: 480px) {
  .wpcf7[data-wpcf7-id="6186"] .gf-banco { grid-template-columns: 1fr; gap: var(--gf-s1); }
  .wpcf7[data-wpcf7-id="6186"] .gf-banco dd { margin-bottom: var(--gf-s3); }
}

/* Número de cuenta y RIF: los dos datos que se copian a mano.
   user-select:all → un toque largo en el móvil selecciona el valor entero,
   sin tener que arrastrar los manguitos carácter a carácter. */
.wpcf7[data-wpcf7-id="6186"] .gf-cuenta,
.wpcf7[data-wpcf7-id="6186"] .gf-rif {
  display: inline-block;
  margin: 2px 0;
  padding: var(--gf-s2) var(--gf-s3);
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: var(--gf-fs-cuenta);        /* 18px */
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.3;
  color: var(--gf-titulo);
  background: var(--gf-fondo-suave);
  border: 1px dashed var(--gf-borde-fuerte);
  border-radius: 6px;
  user-select: all;
  -webkit-user-select: all;
  overflow-wrap: anywhere;
}
.wpcf7[data-wpcf7-id="6186"] .gf-rif { font-size: var(--gf-fs-etiqueta); }

/* --- Tabla de costos ---
   REQUIERE marcado (ver informe):
     <table class="gf-precios">
       <tbody>
         <tr><th scope="row">Carrera 7K</th><td>25 $</td></tr>
         <tr><th scope="row">Caminata 4K</th><td>20 $</td></tr>
         <tr><th scope="row">Caminata Familia ÍTALO 4K <span>por grupo familiar</span></th><td>40 $</td></tr>
       </tbody>
     </table>                                                              */
.wpcf7[data-wpcf7-id="6186"] .gf-precios {
  width: 100%;
  margin: 0 0 var(--gf-s4);
  border-collapse: collapse;
  font-size: var(--gf-fs-etiqueta);      /* 15px */
}

.wpcf7[data-wpcf7-id="6186"] .gf-precios th,
.wpcf7[data-wpcf7-id="6186"] .gf-precios td {
  padding: var(--gf-s3) 0;
  border-bottom: 1px solid var(--gf-borde);
  vertical-align: baseline;
  text-align: left;
}

.wpcf7[data-wpcf7-id="6186"] .gf-precios th {
  font-weight: 400;
  color: var(--gf-titulo);
  padding-right: var(--gf-s4);
}

.wpcf7[data-wpcf7-id="6186"] .gf-precios th span {
  display: block;
  font-size: var(--gf-fs-legal);         /* 12.5px */
  color: var(--gf-texto);
}

.wpcf7[data-wpcf7-id="6186"] .gf-precios td {
  width: 1%;
  white-space: nowrap;
  text-align: right;
  font-family: "Coda", inherit;
  font-size: var(--gf-fs-bs);            /* 17px */
  font-weight: 700;
  color: var(--gf-titulo);
}

.wpcf7[data-wpcf7-id="6186"] .gf-precios tr:last-child th,
.wpcf7[data-wpcf7-id="6186"] .gf-precios tr:last-child td { border-bottom: 0; }

/* Teléfono de confirmación como enlace tocable.
   REQUIERE marcado: <a class="gf-tel" href="tel:+584148230666">0414 8230666</a> */
.wpcf7[data-wpcf7-id="6186"] .gf-tel {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 var(--gf-s4);
  font-size: var(--gf-fs-bs);            /* 17px */
  font-weight: 600;
  color: var(--gf-rojo-oscuro);
  text-decoration: none;
  background: var(--gf-fondo);
  border: 2px solid var(--gf-borde);
  border-radius: var(--gf-radio);
}
.wpcf7[data-wpcf7-id="6186"] .gf-tel:hover,
.wpcf7[data-wpcf7-id="6186"] .gf-tel:focus-visible { border-color: var(--gf-rojo); }


/* =========================================================================

/* =========================================================================
   M. ERRORES Y MENSAJES
   -------------------------------------------------------------------------
   CF7 marca el campo con .wpcf7-not-valid y añade un
   <span class="wpcf7-not-valid-tip">. Sin estilos propios el aviso es un
   texto diminuto casi invisible. En un formulario largo, si el usuario no
   ve el error, abandona.
   ========================================================================= */

.wpcf7[data-wpcf7-id="6186"] .wpcf7-not-valid {
  border-color: var(--gf-rojo-oscuro) !important;
  background-color: #FFF7F7;
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-not-valid-tip {
  display: block;
  position: relative;
  margin-top: var(--gf-s2);
  padding-left: 22px;
  font-size: var(--gf-fs-ayuda);         /* 14px */
  font-weight: 600;
  line-height: 1.4;
  color: var(--gf-rojo-oscuro);          /* 6.5:1 sobre blanco: cumple AA */
}

/* Icono decorativo: el texto ya comunica el error por sí solo */
.wpcf7[data-wpcf7-id="6186"] .wpcf7-not-valid-tip::before {
  content: "!";
  position: absolute; left: 0; top: 1px;
  width: 16px; height: 16px;
  font-size: 12px; line-height: 16px; text-align: center;
  color: #fff;
  background: var(--gf-rojo-oscuro);
  border-radius: 50%;
}

.wpcf7[data-wpcf7-id="6186"] .wpcf7-response-output {
  margin: var(--gf-s6) 0 0;
  padding: var(--gf-s4);
  font-size: var(--gf-fs-etiqueta);      /* 15px */
  line-height: 1.5;
  border-width: 2px;
  border-style: solid;
  border-radius: var(--gf-radio);
}

.wpcf7[data-wpcf7-id="6186"] form.invalid .wpcf7-response-output,
.wpcf7[data-wpcf7-id="6186"] form.unaccepted .wpcf7-response-output,
.wpcf7[data-wpcf7-id="6186"] form.payment-required .wpcf7-response-output {
  color: var(--gf-rojo-oscuro);
  background: #FFF7F7;
  border-color: var(--gf-rojo-oscuro);
}

.wpcf7[data-wpcf7-id="6186"] form.sent .wpcf7-response-output {
  color: #14532D;
  background: #F0FDF4;
  border-color: #1E7A4B;
  font-weight: 600;
}

.wpcf7[data-wpcf7-id="6186"] form.failed .wpcf7-response-output,
.wpcf7[data-wpcf7-id="6186"] form.aborted .wpcf7-response-output {
  color: #7C2D12;
  background: #FFF7ED;
  border-color: #C2410C;
}


/* =========================================================================
   N. VARIOS
   ========================================================================= */

/* El primer <hr> lleva style="margin:20px" inline: de ahí el !important.
   Si se adopta la estructura por bloques (C), los <hr> sobran. */
.wpcf7[data-wpcf7-id="6186"] hr {
  margin: var(--gf-s8) 0 !important;
  height: 0;
  border: 0;
  border-top: 1px solid var(--gf-borde);
}

.wpcf7[data-wpcf7-id="6186"] .gscf7-frontend-gdpr-notice p {
  margin: var(--gf-s4) 0 0;
  font-size: var(--gf-fs-legal);         /* 12.5px */
  line-height: 1.5;
  color: var(--gf-texto);
  text-align: center;
}

/* El badge de reCAPTCHA v3 flota abajo a la derecha y a 375px tapa campos.
   NO se oculta (Google exige mostrar el texto legal si se oculta): se sube. */
@media (max-width: 767px) {
  .single-tribe_events .grecaptcha-badge { bottom: 90px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .wpcf7[data-wpcf7-id="6186"] *,
  .wpcf7[data-wpcf7-id="6186"] *::before,
  .wpcf7[data-wpcf7-id="6186"] *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

@media (forced-colors: active) {
  .wpcf7[data-wpcf7-id="6186"] input,
  .wpcf7[data-wpcf7-id="6186"] select,
  .wpcf7[data-wpcf7-id="6186"] .wpcf7-radio label {
    border: 2px solid ButtonBorder;
  }
}

/* =========================================================================
   TANDA 3 · Etiquetas encajadas en el borde del campo
   -------------------------------------------------------------------------
   El cliente pidió el mismo tratamiento que ya tenía el grupo "Sexo": el
   rótulo montado sobre la línea del recuadro, con un hueco blanco detrás.
   Se apoya en que cada campo vive en un <p> con su <label> justo delante.
   ========================================================================= */

/* El <p> del campo pasa a ser el marco de referencia del rótulo. */
.wpcf7[data-wpcf7-id="6186"] .gf-campo {
  position: relative;
  margin: 0 0 22px;
  padding-top: 0;
}

/* El <br> entre etiqueta y campo sobra cuando la etiqueta va superpuesta. */
.wpcf7[data-wpcf7-id="6186"] .gf-campo br {
  display: none;
}

/* El rótulo: sobre la línea del borde, con fondo propio para abrir el hueco. */
.wpcf7[data-wpcf7-id="6186"] .gf-campo > label,
.wpcf7[data-wpcf7-id="6186"] .gf-campo > p > label {
  position: absolute;
  top: -9px;
  left: 12px;
  z-index: 1;
  max-width: calc(100% - 24px);
  margin: 0;
  padding: 0 6px;

  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--gf-titulo);
  background: #fff;      /* abre el hueco en la línea del recuadro */
}

/* El texto de ayuda va debajo del campo, nunca superpuesto. */
.wpcf7[data-wpcf7-id="6186"] .gf-campo .gf-ayuda {
  position: static;
  margin-top: var(--gf-s2);
}

/* El grupo "Sexo" ya tenía este aspecto: se le da el mismo recuadro para
   que no sea el único distinto. */
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo {
  position: relative;
  margin: 0 0 22px;
  padding: 14px 12px 12px;
  border: 2px solid var(--gf-borde);
  border-radius: var(--gf-radio);
}
.wpcf7[data-wpcf7-id="6186"] fieldset.gf-sexo legend {
  margin: 0;
  padding: 0 6px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--gf-titulo);
  background: #fff;
}

/* WordPress puede envolver el contenido del contenedor en un <p> propio:
   se le quitan los márgenes para que no descoloque el rótulo superpuesto. */
.wpcf7[data-wpcf7-id="6186"] .gf-campo > p { margin: 0; position: static; }

/* =========================================================================
   AJUSTES verificados al aplicar la tanda 3
   ========================================================================= */

/* El tema pinta los <th> de las tablas con fondo oscuro (#272420), lo que
   dejaba las filas de precios en negro sobre negro. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios th,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios td,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios tr {
  background: transparent;
  color: var(--gf-titulo);
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios th span {
  color: var(--gf-texto);
}

/* =========================================================================
   AJUSTE FINAL · El punto de selección del campo Sexo
   -------------------------------------------------------------------------
   El punto iba en un ::after aparte y, aunque los estilos se aplicaban, no
   llegaba a verse sobre el aro. Se pinta ahora con el propio círculo:
   relleno rojo con un aro blanco interior mediante box-shadow, así no
   dependemos de dos pseudo-elementos superpuestos ni de fuentes de iconos.
   ========================================================================= */

.scheme_default .wpcf7[data-wpcf7-id="6186"] .wpcf7-radio input:checked + .wpcf7-list-item-label::before {
  border-color: var(--gf-rojo);
  background-color: var(--gf-rojo);
  box-shadow: inset 0 0 0 3px #fff;
}

/* El ::after ya no hace falta. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .wpcf7-radio .wpcf7-list-item-label::after,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .wpcf7-radio input:checked + .wpcf7-list-item-label::after {
  content: none;
}

/* =========================================================================
   BLOQUE DE PAGO · rehecho tras ver el render real
   -------------------------------------------------------------------------
   Problemas medidos en producción:
     · el tema añade border-right a th y td: aparecían líneas verticales
       sueltas entre el concepto y el importe;
     · el th salía en Coda 11px mayúsculas (demasiado pequeño para leerse);
     · la columna del importe quedaba en 36px y el "25 $" se cortaba;
     · la ficha del banco y la tabla no compartían el mismo lenguaje: una
       en tarjeta blanca y la otra suelta sobre el fondo.
   ========================================================================= */

/* Las dos mitades como tarjetas iguales. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios-caja {
  box-sizing: border-box;
  margin: 0 0 16px;
  padding: 18px;
  background: #fff;
  border: 1px solid var(--gf-borde);
  border-radius: 12px;
}

/* --- Ficha bancaria --- */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco dt {
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--gf-texto);
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco dd {
  font-size: 16px;
  font-weight: 700;
  color: var(--gf-titulo);
}

/* Cuenta y RIF: bloque copiable, sin borde discontinuo. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-cuenta,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-rif {
  display: inline-block;
  margin: 0;
  padding: 6px 10px;
  font-size: 16px;
  letter-spacing: 0.06em;
  background: #F7F5F2;
  border: 1px solid var(--gf-borde);
  border-radius: 8px;
}

/* --- Tabla de costos --- */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios th,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios td {
  border-right: 0;                 /* el tema metía líneas verticales */
  border-left: 0;
  border-top: 0;
  border-bottom: 1px solid var(--gf-borde);
  padding: 12px 0;
  vertical-align: middle;
}

.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios th {
  font-family: inherit;            /* Coda a 11px no se leía */
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--gf-titulo);
  padding-right: 16px;
}

.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios th span {
  display: block;
  margin-top: 2px;
  font-size: 12.5px;
  text-transform: none;
  color: var(--gf-texto);
}

.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios td {
  width: auto;
  min-width: 72px;                 /* el importe se cortaba a 36px */
  white-space: nowrap;
  text-align: right;
  font-family: "Coda", inherit;
  font-size: 17px;
  font-weight: 700;
  color: var(--gf-titulo);
}

.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios tr:last-child th,
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-precios tr:last-child td {
  border-bottom: 0;
}

/* Rótulos de sección del bloque de pago: menos grito, más orden. */
.wpcf7[data-wpcf7-id="6186"] .gf-tag {
  font-size: 12px;
  letter-spacing: 0.1em;
  color: var(--gf-texto);
}

/* Teléfono de confirmación: mismo alto que el botón de WhatsApp. */
.wpcf7[data-wpcf7-id="6186"] .gf-tel {
  min-height: 48px;
  font-size: 16px;
  border-width: 1px;
  border-color: var(--gf-borde);
  color: var(--gf-titulo);
}

/* Retoques finales tras ver el render: la cuenta se partía en dos líneas y
   el botón de WhatsApp quedaba indentado bajo el teléfono. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco {
  grid-template-columns: 86px 1fr;
  gap: 12px 14px;
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco dt { font-size: 11.5px; }
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-cuenta {
  font-size: 14.5px;
  letter-spacing: 0.02em;
  white-space: nowrap;
  padding: 7px 10px;
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-rif { font-size: 14px; }

.wpcf7[data-wpcf7-id="6186"] .gf-tel { margin-right: 10px; }
.wpcf7[data-wpcf7-id="6186"] .gf-wa-boton { margin-left: 0; margin-top: 8px; }

/* La ficha bancaria pasa a una sola columna: el número de cuenta no cabía
   al lado de su rótulo y se partía en dos líneas. */
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco {
  grid-template-columns: 1fr;
  gap: 0;
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco dt {
  margin-top: 12px;
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco dt:first-child {
  margin-top: 0;
}
.scheme_default .wpcf7[data-wpcf7-id="6186"] .gf-banco dd {
  margin-top: 3px;
}