.elementor-958 .elementor-element.elementor-element-3f2d4f4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-958 .elementor-element.elementor-element-eca4bc5{width:var( --container-widget-width, 14.782% );max-width:14.782%;--container-widget-width:14.782%;--container-widget-flex-grow:0;}.elementor-958 .elementor-element.elementor-element-eca4bc5.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-958 .elementor-element.elementor-element-110c129{margin-top:-5px;margin-bottom:0px;padding:6em 1em 6em 1em;}.elementor-958 .elementor-element.elementor-element-f7075b0:not(.elementor-motion-effects-element-type-background) > .elementor-widget-wrap, .elementor-958 .elementor-element.elementor-element-f7075b0 > .elementor-widget-wrap > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-50743de );}.elementor-958 .elementor-element.elementor-element-f7075b0 > .elementor-element-populated{border-style:dashed;border-width:2px 2px 2px 2px;border-color:var( --e-global-color-507e652 );box-shadow:17px 17px 25px -10px rgba(111, 110, 110, 0.5);transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin:1em 1em 1em 1em;--e-column-margin-right:1em;--e-column-margin-left:1em;padding:2em 2em 2em 2em;}.elementor-958 .elementor-element.elementor-element-f7075b0 > .elementor-element-populated, .elementor-958 .elementor-element.elementor-element-f7075b0 > .elementor-element-populated > .elementor-background-overlay, .elementor-958 .elementor-element.elementor-element-f7075b0 > .elementor-background-slideshow{border-radius:15px 15px 15px 15px;}.elementor-958 .elementor-element.elementor-element-f7075b0 > .elementor-element-populated > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-958 .elementor-element.elementor-element-a10e388{margin:0% 0% calc(var(--kit-widget-spacing, 0px) + 0%) 0%;padding:0px 0px 20px 0px;text-align:center;}.elementor-bc-flex-widget .elementor-958 .elementor-element.elementor-element-64cf52b.elementor-column .elementor-widget-wrap{align-items:center;}.elementor-958 .elementor-element.elementor-element-64cf52b.elementor-column.elementor-element[data-element_type="column"] > .elementor-widget-wrap.elementor-element-populated{align-content:center;align-items:center;}.elementor-958 .elementor-element.elementor-element-64cf52b > .elementor-element-populated{margin:4px 2px 4px 10px;--e-column-margin-right:2px;--e-column-margin-left:10px;padding:0em 1em 0em 0em;}@media(max-width:1024px){.elementor-958 .elementor-element.elementor-element-64cf52b > .elementor-element-populated{padding:1em 1em 0em 0em;}}@media(min-width:768px){.elementor-958 .elementor-element.elementor-element-f7075b0{width:65.746%;}.elementor-958 .elementor-element.elementor-element-64cf52b{width:34.142%;}}@media(max-width:1024px) and (min-width:768px){.elementor-958 .elementor-element.elementor-element-f7075b0{width:100%;}.elementor-958 .elementor-element.elementor-element-64cf52b{width:50%;}}@media(max-width:767px){.elementor-958 .elementor-element.elementor-element-eca4bc5{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + -170px) 0px;}.elementor-958 .elementor-element.elementor-element-eca4bc5 img{width:52%;}.elementor-958 .elementor-element.elementor-element-64cf52b{width:70%;}.elementor-958 .elementor-element.elementor-element-64cf52b > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;}}/* Start custom CSS for shortcode, class: .elementor-element-9af87f9 *//* ==========================================================================================
   FORM STYLE RESET · FONDO BLANCO + TEXTO NEGRO · Contact Form 7
   Versión 1.2 – 2025-10-10  ·  Autor: ChatGPT
   ------------------------------------------------------------------------------------------
   Cambios clave respecto a v1.1:
   • Se corrige “esquina recortada” en <select> (display:block + width:100% + overflow visible)
   • Se asegura compatibilidad con fieldset / grid del tema (overflow visible)
   • Se mantiene flecha SVG mínima y estilo coherente con inputs
   ========================================================================================== */

/* ---------- 1. Variables (ajústalas si lo deseas) ---------- */
:root {
  --ee-bg: #ffffff;                             /* Fondo campos */
  --ee-text: #000000;                           /* Texto principal */
  --ee-placeholder: #6b7280;                    /* Placeholder gris */
  --ee-border: #d1d5db;                         /* Borde gris claro */
  --ee-border-focus: rgba(27, 100, 174, .35);   /* Sombra focus azul corporativo */
  --ee-submit-grad-from: #4EA1DA;               /* Botón degradado: inicio */
  --ee-submit-grad-to:   #1B64AE;               /* Botón degradado: fin   */
}

/* ---------- 2. Reset base ---------- */
.wpcf7-form *,
input,
select,
textarea {
  box-sizing: border-box;
  font: 400 1rem/1.45 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* ---------- 3. Campos (input, textarea, select) ---------- */
.wpcf7-form-control,
input:not([type="submit"]),
textarea,
select {
  background-color: var(--ee-bg) !important;
  color: var(--ee-text) !important;
  border: 1px solid var(--ee-border) !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
  transition: border-color .2s, box-shadow .2s;
}

.wpcf7-form-control:focus,
input:not([type="submit"]):focus,
textarea:focus,
select:focus {
  border-color: var(--ee-border-focus) !important;
  box-shadow: 0 0 0 3px var(--ee-border-focus) !important;
  outline: none !important;
}

/* ---------- 4. Placeholder ---------- */
input::placeholder,
textarea::placeholder {
  color: var(--ee-placeholder) !important;
  opacity: 1 !important; /* Firefox */
}

/* ---------- 5. Select específico (flecha + fix esquina) ---------- */
select {
  /* Normalización + espacio para flecha */
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;                  /* <- evita recorte en radius */
  width: 100%;                     /* ocupa todo el contenedor */
  height: auto;                    /* deja crecer con padding */
  padding-right: 44px !important;  /* sitio para la flecha */
  line-height: 1.25 !important;

  /* Flecha SVG mini (negra) */
  background-image: url('data:image/svg+xml;utf8,<svg fill="%23000000" height="16" viewBox="0 0 24 24" width="16" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px 16px;
}

select option[disabled][selected],
select option[disabled] {
  color: var(--ee-placeholder);
}

/* Safari “blank” */
select:invalid { color: var(--ee-placeholder); }

/* ---------- 6. Fieldset / wrappers con overflow ---------- */
fieldset,
.wpcf7-form-control-wrap,
.ee-grid select {   /* ajusta a la clase de tu grid si aplica */
  overflow: visible !important; /* libera radius cortado */
}

/* ---------- 7. Botón submit ---------- */
input[type="submit"],
button[type="submit"],
.wpcf7-submit {
  background: linear-gradient(135deg, var(--ee-submit-grad-from) 0%, var(--ee-submit-grad-to) 100%) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  padding: 14px 32px !important;
  cursor: pointer !important;
  transition: transform .2s, box-shadow .2s;
}

input[type="submit"]:hover,
button[type="submit"]:hover,
.wpcf7-submit:hover {
  transform: translateY(-2px) scale(1.03);
  box-shadow: 0 10px 26px rgba(27, 100, 174, .25);
}

/* ---------- 8. Labels ---------- */
.wpcf7-form label {
  display: block;
  margin-bottom: 12px;
  font-weight: 600;
  color: var(--ee-text);
}

/* ---------- 9. Mensajes de validación ---------- */
.wpcf7-not-valid-tip {
  color: #dc2626 !important;  /* rojo-600 */
  font-size: .875rem;
  margin-top: 4px;
}

div.wpcf7-response-output {
  border: 2px solid #22c55e;  /* verde-500 */
  color: #0f5132;
  background: #d1e7dd;
  padding: 12px 20px;
  border-radius: 8px;
  margin-top: 1rem;
}

/* ---------- 10. Checkbox / radio ---------- */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--ee-submit-grad-to);
}

/* ---------- 11. Campos deshabilitados ---------- */
.wpcf7-form-control[disabled],
input[disabled],
select[disabled],
textarea[disabled] {
  background-color: #f3f4f6 !important; /* gray-100 */
  color: #9ca3af !important;           /* gray-400 */
  cursor: not-allowed;
}/* End custom CSS */
/* Start custom CSS for column, class: .elementor-element-64cf52b *//* =========================
   CTA principal + botón redondo
   (aplica al contenedor con clase ee-cta-group)
   ========================= */

.ee-cta-group{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: clamp(8px, 2vw, 20px);        /* espacio fluido entre botones */
  flex-wrap: nowrap;
}

/* === Botón pill (Elementor Button) === */
.ee-cta-group .elementor-button{
  /* que nunca desborde y escale suave */
  inline-size: auto;
  max-inline-size: 100%;
  white-space: nowrap;               /* si prefieres que pueda partir, cámbialo a normal */
  padding-block: clamp(10px, 1.2vw, 16px);
  padding-inline: clamp(16px, 3vw, 36px);
  font-size: clamp(15px, 1.3vw, 18px);
  line-height: 1.2;
  border-radius: 9999px;             /* mantiene forma pill */
  box-sizing: border-box;
}

/* === Botón redondo (icono/play) ===
   Si tu botón redondo es otro Elementor Button, un Icon, o un Image Box,
   dale la clase extra "ee-cta-play". Así controlamos solo tamaño/centrado. */
.ee-cta-group .ee-cta-play{
  display: grid;
  place-items: center;
  inline-size: clamp(44px, 6vw, 64px);
  block-size: clamp(44px, 6vw, 64px);
  min-inline-size: 44px;
  min-block-size: 44px;
  border-radius: 50%;
  box-sizing: border-box;
  /* no tocamos colores ni bordes que ya tengas */
}

/* Si el icono dentro es un <i>, <svg> o pseudo, que escale también */
.ee-cta-group .ee-cta-play i,
.ee-cta-group .ee-cta-play svg{
  width: clamp(16px, 2.2vw, 22px);
  height: clamp(16px, 2.2vw, 22px);
}

/* =========================
   Breakpoints responsivos
   ========================= */

/* <= 900px: un poco más compacto */
@media (max-width: 900px){
  .ee-cta-group{ gap: clamp(8px, 2vw, 16px); }
  .ee-cta-group .elementor-button{
    padding-block: clamp(10px, 1.1vw, 14px);
    padding-inline: clamp(16px, 2.4vw, 30px);
  }
}

/* <= 640px: apila verticalmente y ocupa ancho completo con límites agradables */
@media (max-width: 640px){
  .ee-cta-group{
    flex-direction: column;
    align-items: stretch;            /* que el pill ocupe ancho */
    gap: 10px;
  }
  .ee-cta-group .elementor-button{
    inline-size: 100%;
    max-inline-size: 100%;
    text-align: center;
    white-space: normal;             /* permite partir el texto si es largo */
    word-break: keep-all;
  }
  .ee-cta-group .ee-cta-play{
    inline-size: clamp(42px, 12vw, 56px);
    block-size: clamp(42px, 12vw, 56px);
    margin-inline: auto;             /* centrar el botón redondo debajo */
  }
}

/* <= 380px: aún más compacto */
@media (max-width: 380px){
  .ee-cta-group .elementor-button{
    font-size: 15px;
    padding-block: 10px;
    padding-inline: 18px;
  }
  .ee-cta-group .ee-cta-play{
    inline-size: 44px;
    block-size: 44px;
  }
}

/* Respeta usuarios con reduce motion */
@media (prefers-reduced-motion: reduce){
  .ee-cta-group .elementor-button{ transition: none; }
}/* End custom CSS */