/* Okapi'SW — CSS para widgets V3 dentro de páginas V4: formulario (clase contact-form) y mapa de Contacto
   en las tarjetas .ok-contact-card (copia de la CSS del widget HTML de la página original) y botón «Cargar más» del Blog.
   Se carga también en el editor para que estos widgets se vean igual al editar. */

/* ---------- Rejilla: dos columnas desde 900 px, como el original (V4 pasa a una columna en tableta) ---------- */
@media (min-width: 900px) and (max-width: 1024px) {
  .ok-contact-grid { grid-template-columns: .9fr 1.1fr !important; }
}

/* ---------- Mapa ---------- */
.ok-contact-map > .elementor-element,
.ok-contact-map .elementor-widget-container,
.ok-contact-map .elementor-custom-embed { width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0 !important; }
.ok-contact-map iframe { width: 100% !important; height: 100% !important; border: 0 !important; display: block; filter: grayscale(.25) invert(.92) contrast(.9); }

/* ---------- Formulario ---------- */
.ok-contact-card .elementor-widget { margin: 0 !important; width: 100%; }
.ok-contact-card .elementor-widget-container { padding: 0 !important; margin: 0 !important; }
.ok-contact-card .contact-form { width: 100%; }
.ok-contact-card .contact-form .elementor-form-fields-wrapper { display: flex !important; flex-wrap: wrap; gap: 16px; margin: 0 !important; }
.ok-contact-card .contact-form .elementor-field-group { padding: 0 !important; margin: 0 !important; width: 100% !important; flex: 0 0 100%; max-width: 100%; }
@media (min-width: 560px) {
  .ok-contact-card .contact-form .elementor-field-group.elementor-col-50 { width: calc(50% - 8px) !important; flex: 0 0 calc(50% - 8px); max-width: calc(50% - 8px); }
}
.ok-contact-card .contact-form .elementor-field-type-honeypot { display: none !important; }
.ok-contact-card .contact-form .elementor-form-fields-wrapper > div:not(.elementor-column) { display: none !important; }
.ok-contact-card .contact-form .elementor-field-type-recaptcha_v3 { position: absolute !important; width: 0 !important; height: 0 !important; overflow: hidden !important; margin: 0 !important; padding: 0 !important; }
.ok-contact-card .contact-form .elementor-field-label { font-size: .78rem !important; font-weight: 700 !important; color: var(--ok-text-muted) !important; display: block !important; margin: 0 0 6px !important; padding: 0 !important; letter-spacing: .06em !important; text-transform: uppercase !important; line-height: 1 !important; font-family: Outfit, system-ui, sans-serif !important; }
.ok-contact-card .contact-form .elementor-field-textual,
.ok-contact-card .contact-form .elementor-field-group .elementor-select-wrapper select { width: 100% !important; padding: 13px 16px !important; border-radius: 12px !important; background: rgba(255,255,255,.05) !important; background-color: rgba(255,255,255,.05) !important; border: 1px solid var(--ok-glass-border) !important; color: var(--ok-white) !important; font-family: Outfit, system-ui, sans-serif !important; font-size: .92rem !important; line-height: 1.4 !important; min-height: 0 !important; box-shadow: none !important; }
.ok-contact-card .contact-form .elementor-select-wrapper { width: 100%; }
.ok-contact-card .contact-form .elementor-select-wrapper select option { background: #14110d; color: #fff; }
.ok-contact-card .contact-form .elementor-select-wrapper::before { display: none !important; }
.ok-contact-card .contact-form ::placeholder { color: rgba(201,195,186,.55) !important; opacity: 1; }
.ok-contact-card .contact-form .elementor-field-textual:focus,
.ok-contact-card .contact-form select:focus { outline: none !important; border-color: var(--ok-gold) !important; }
.ok-contact-card .contact-form textarea.elementor-field-textual { resize: vertical; min-height: 120px !important; }
.ok-contact-card .contact-form .elementor-field-type-acceptance .elementor-field-subgroup { display: flex; }
.ok-contact-card .contact-form .elementor-field-type-acceptance .elementor-field-option { display: flex; gap: 10px; align-items: flex-start; font-size: .82rem; color: var(--ok-text-muted); }
.ok-contact-card .contact-form .elementor-field-type-acceptance input[type=checkbox] { width: auto !important; margin-top: 3px; cursor: pointer; }
.ok-contact-card .contact-form .elementor-field-type-acceptance label { font-size: .82rem !important; color: var(--ok-text-muted) !important; text-transform: none !important; letter-spacing: normal !important; font-weight: 400 !important; margin: 0 !important; }
.ok-contact-card .contact-form .elementor-field-type-acceptance a { text-decoration: underline; color: var(--ok-gold) !important; }
.ok-contact-card .contact-form .elementor-field-type-submit { margin-top: 6px !important; justify-content: flex-start !important; }
.ok-contact-card .contact-form .elementor-field-type-submit .elementor-button { align-self: flex-start; display: inline-flex !important; align-items: center; justify-content: center; gap: .5em; font-family: Montserrat, sans-serif !important; font-weight: 700 !important; font-size: 1rem !important; line-height: 1.6 !important; border: none !important; padding: 14px 28px !important; border-radius: var(--ok-radius-pill) !important; letter-spacing: .02em !important; background: var(--ok-gold) !important; color: var(--ok-gold-ink) !important; cursor: pointer; transition: transform .25s, box-shadow .25s, background .2s; flex: 0 0 auto !important; width: auto !important; max-width: none !important; min-width: 0 !important; }
.ok-contact-card .contact-form .elementor-field-type-submit .elementor-button:hover { transform: translateY(-2px); box-shadow: 0 12px 30px var(--ok-gold-soft); }
.ok-contact-card .contact-form .elementor-message { font-size: .85rem; margin-top: 8px; }

/* ---------- Blog: botón «Cargar más» de la Cuadrícula de bucle (V3) con el estilo dorado del resto de la web ---------- */
.ok-blog-frame .elementor-widget-loop-grid .e-loop__load-more .elementor-button {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
  font-family: Montserrat, sans-serif !important; font-size: 1rem !important; font-weight: 600 !important; line-height: 1.6 !important;
  letter-spacing: .02em !important; text-transform: none !important; text-decoration: none !important;
  padding: 14px 28px !important; border: 1px solid transparent !important; border-radius: 999px !important;
  background-color: #FFAC41 !important; color: #1A1509 !important;
  transition: transform .2s, background .2s, box-shadow .2s !important;
}
.ok-blog-frame .elementor-widget-loop-grid .e-loop__load-more .elementor-button .elementor-button-text { color: #1A1509 !important; }
.ok-blog-frame .elementor-widget-loop-grid .e-loop__load-more .elementor-button svg { fill: #1A1509 !important; }
.ok-blog-frame .elementor-widget-loop-grid .e-loop__load-more .elementor-button:hover,
.ok-blog-frame .elementor-widget-loop-grid .e-loop__load-more .elementor-button:focus-visible {
  background-color: #FFAC41 !important; color: #1A1509 !important;
  box-shadow: 0 12px 30px rgba(255,172,65,.35) !important; transform: translate3d(0, -2px, 0);
}