/* ==========================================================================
   Bloque Sección Contacto – Estilos principales
   ========================================================================== */
.seccion-contacto {
    background-color: var(--seccion-contacto-fondo, var(--color-principal-fondo));
    border-radius: 12px;
    padding: 40px 40px 40px 60px;
    overflow: hidden;
    box-sizing: border-box;
}
.seccion-contacto__container {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 40px;
    max-width: var(--wp--style--global--wide-size);
    margin: 0 auto;
}
.seccion-contacto__bloque-izquierdo {
    display: flex;
    flex-direction: column;
    gap: 15px;
    max-width: 518px;
    width: 456px;
    flex-shrink: 0;
}

/* Icono – background-image en lugar de SVG inline */
.seccion-contacto__icono {
    width: 33px;
    height: 29px;
    background-color: var(--color-principal);
    flex-shrink: 0;

    -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='33' height='29' viewBox='0 0 33 29' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.69625 29C4.7025 29 3.8225 27.2208 4.93625 25.8182C5.5 25.1039 6.39375 23.7792 6.93 22.8571C2.695 20.7403 0 16.8701 0 12.6104C0 5.62338 7.3425 0 16.5 0C25.6575 0 33 5.62338 33 12.6104C33 19.7792 25.6712 25.2208 15.7575 25.1948C12.6637 27.2857 8.69 29 6.69625 29ZM8.69 25.5325C9.8725 25.0779 12.375 23.5455 13.97 22.3896C14.5612 21.9351 15.0012 21.7922 15.6062 21.7922C15.9775 21.8052 16.28 21.8052 16.5 21.8052C23.6637 21.8052 29.3837 17.6753 29.3837 12.6104C29.3837 7.53247 23.6637 3.4026 16.5 3.4026C9.33625 3.4026 3.61625 7.53247 3.61625 12.6104C3.61625 15.8831 5.98125 18.7532 9.96875 20.5455C10.8625 20.9481 11.0962 21.6234 10.6287 22.4286C10.065 23.4156 9.1025 24.5974 8.51125 25.2987C8.31875 25.5195 8.42875 25.6234 8.69 25.5325Z'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;

    mask-image: url("data:image/svg+xml,%3Csvg width='33' height='29' viewBox='0 0 33 29' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6.69625 29C4.7025 29 3.8225 27.2208 4.93625 25.8182C5.5 25.1039 6.39375 23.7792 6.93 22.8571C2.695 20.7403 0 16.8701 0 12.6104C0 5.62338 7.3425 0 16.5 0C25.6575 0 33 5.62338 33 12.6104C33 19.7792 25.6712 25.2208 15.7575 25.1948C12.6637 27.2857 8.69 29 6.69625 29ZM8.69 25.5325C9.8725 25.0779 12.375 23.5455 13.97 22.3896C14.5612 21.9351 15.0012 21.7922 15.6062 21.7922C15.9775 21.8052 16.28 21.8052 16.5 21.8052C23.6637 21.8052 29.3837 17.6753 29.3837 12.6104C29.3837 7.53247 23.6637 3.4026 16.5 3.4026C9.33625 3.4026 3.61625 7.53247 3.61625 12.6104C3.61625 15.8831 5.98125 18.7532 9.96875 20.5455C10.8625 20.9481 11.0962 21.6234 10.6287 22.4286C10.065 23.4156 9.1025 24.5974 8.51125 25.2987C8.31875 25.5195 8.42875 25.6234 8.69 25.5325Z'/%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

/* Título */
.seccion-contacto__titulo {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 36px;
    line-height: 1.2;
    letter-spacing: -0.03em;
    color: var(--color-principal);
    margin: 0;
}

/* Descripción */
.seccion-contacto__descripcion-wrapper {
    padding-top: 5px;
}
.seccion-contacto__descripcion {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 14px;
    line-height: 1.45;
    color: #555;
    margin: 0;
}

/* Items de contacto */
.seccion-contacto__items {
    display: flex;
    flex-direction: column;
    padding-top: 20px;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    line-height: 1.2;
}
.seccion-contacto__item {
    display: flex;
    align-items: center;
    gap: 20px;
    height: 42px;
    border-bottom: 1px solid rgba(228, 33, 83, 0.2);
}
.seccion-contacto__item:last-child {
    border-bottom: none;
}
.seccion-contacto__item-label {
    width: 150px;
    flex-shrink: 0;
    color: var(--color-principal);
}
.seccion-contacto__item-label a {
    color: inherit;
    text-decoration: none;
}
.seccion-contacto__item-label a:hover {
    text-decoration: underline;
}
.seccion-contacto__item-valor {
    flex: 1;
    color: #333;
}
.seccion-contacto__item-valor a {
    color: inherit;
    text-decoration: none;
}
.seccion-contacto__item-valor a:hover {
    text-decoration: underline;
}

/* Bloque derecho – Formulario */
.seccion-contacto__bloque-derecho {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 518px;
    width: 444px;
    flex-shrink: 0;
    background-color: #fff;
    border-radius: 6px;
    padding: 8px;
    overflow: hidden;
    box-sizing: border-box;
}
.seccion-contacto__formulario-contenedor {
    display: flex;
    flex-direction: column;
    gap: 30px;
    background-color: var(--color-principal);
    padding: 60px 40px;
    width: 100%;
    box-sizing: border-box;
}
.seccion-contacto__formulario-titulo {
    font-family: 'Inter', sans-serif;
    font-weight: 900;
    font-size: 24px;
    line-height: 1.2;
    letter-spacing: -0.03em;
    color: #fff;
    margin: 0;
}
.seccion-contacto__formulario-contenido {
    width: 100%;
}

/* ==========================================================================
   Estilos para formularios de Contact Form 7 y WPForms
   ========================================================================== */
.seccion-contacto__formulario-contenido .wpcf7-form,
.seccion-contacto__formulario-contenido .wpforms-form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}
.seccion-contacto__formulario-contenido label,
.seccion-contacto__formulario-contenido .wpforms-field-label {
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 12px;
    line-height: 1.2;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 5px;
    display: block;
}
.seccion-contacto__formulario-contenido input[type="text"],
.seccion-contacto__formulario-contenido input[type="email"],
.seccion-contacto__formulario-contenido input[type="tel"],
.seccion-contacto__formulario-contenido input[type="url"],
.seccion-contacto__formulario-contenido input[type="number"],
.seccion-contacto__formulario-contenido textarea,
.seccion-contacto__formulario-contenido select {
    width: 100%;
    height: 44px;
    background-color: #F4EAED !important;
    border: none;
    border-radius: 6px;
    padding: 10px 15px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    box-sizing: border-box;
}
.seccion-contacto__formulario-contenido textarea {
    height: 140px;
    resize: vertical;
}
.seccion-contacto__formulario-contenido input[type="submit"],
.seccion-contacto__formulario-contenido button[type="submit"],
.seccion-contacto__formulario-contenido .wpcf7-submit,
.seccion-contacto__formulario-contenido .wpforms-submit {
    width: 100%;
    background-color: #333;
    color: #fff;
    font-family: 'Inter', sans-serif;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    border: none;
    border-radius: 100px;
    padding: 12px 26px;
    cursor: pointer;
    margin-top: 10px;
    transition: background-color 0.3s ease;
}
.seccion-contacto__formulario-contenido input[type="submit"]:hover,
.seccion-contacto__formulario-contenido button[type="submit"]:hover,
.seccion-contacto__formulario-contenido .wpcf7-submit:hover,
.seccion-contacto__formulario-contenido .wpforms-submit:hover {
    background-color: #555;
}
.seccion-contacto__formulario-contenido .wpcf7-form p {
    margin: 0;
}
.seccion-contacto__formulario-contenido .wpcf7-not-valid-tip {
    color: #fff;
    font-size: 11px;
    margin-top: 4px;
}
.seccion-contacto__formulario-contenido .wpcf7-response-output {
    color: #fff;
    border-color: rgba(255,255,255,0.5);
    margin: 10px 0 0;
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1023px) {
    .seccion-contacto {
        padding: 30px 20px;
    }
    .seccion-contacto__container {
        flex-direction: column;
        gap: 30px;
    }
    .seccion-contacto__bloque-izquierdo {
        width: 100%;
        max-width: 100%;
        gap: 10px;
    }
    .seccion-contacto__titulo {
        font-size: 28px;
    }
    .seccion-contacto__items {
        width: 100%;
        padding-top: 5px;
    }
    .seccion-contacto__item {
        width: 100%;
        flex-wrap: wrap;
        height: auto;
        padding: 20px 0;
        gap: 10px;
    }
    .seccion-contacto__item-label {
        width: 100%;
    }
    .seccion-contacto__item-valor {
        width: 100%;
    }
    .seccion-contacto__bloque-derecho {
        width: 100%;
        max-width: 100%;
    }
    .seccion-contacto__formulario-contenedor {
        padding: 40px 25px;
    }
    .seccion-contacto__formulario-titulo {
        font-size: 20px;
    }
}

/* ==========================================================================
   Estilos del editor
   ========================================================================== */
.seccion-contacto--editor [data-rich-text-placeholder] {
    opacity: 0.6;
}
.seccion-contacto--editor .seccion-contacto__item {
    position: relative;
}
.seccion-contacto--editor .seccion-contacto__item-actions {
    position: absolute;
    right: -30px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    gap: 4px;
}
.seccion-contacto--editor .seccion-contacto__item-remove {
    background: var(--color-principal);
    color: #fff;
    border: none;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    line-height: 1;
    padding: 0;
}
.seccion-contacto--editor .seccion-contacto__item-remove:hover {
    background: #c41a47;
}
.seccion-contacto--editor .seccion-contacto__add-item {
    margin-top: 10px;
}
.seccion-contacto--editor .seccion-contacto__shortcode-placeholder {
    background: rgba(255,255,255,0.2);
    border: 2px dashed rgba(255,255,255,0.5);
    border-radius: 6px;
    padding: 20px;
    text-align: center;
    color: #fff;
    font-size: 13px;
}
.seccion-contacto--editor .seccion-contacto__shortcode-placeholder code {
    display: block;
    margin-top: 10px;
    background: rgba(0,0,0,0.2);
    padding: 8px;
    border-radius: 4px;
    font-size: 12px;
    word-break: break-all;
}
.seccion-contacto--editor .components-text-control__input,
.seccion-contacto--editor .components-textarea-control__input {
    font-size: 13px;
}
.seccion-contacto__link-indicator {
    display: inline-flex;
    align-items: center;
    margin-left: 5px;
    color: var(--color-principal);
    font-size: 12px;
}

/* ==========================================================================
   Estilos para Gravity Forms dentro de Sección de Contacto
   ========================================================================== */

/* Reset del wrapper de Gravity Forms */
.seccion-contacto__formulario-contenido .gform_wrapper {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper * {
    box-sizing: border-box !important;
}

/* Resetear variables CSS de Gravity Forms */
.seccion-contacto__formulario-contenido .gform_wrapper[data-form-index] {
    --gform-theme-color-primary: transparent !important;
    --gform-theme-color-secondary: transparent !important;
    --gform-theme-color-outside-control-light: transparent !important;
    --gform-theme-color-inside-control: var(--color-principal-fondo) !important;
    --gform-theme-control-border-color: transparent !important;
    --gform-theme-border-radius: 6px !important;
}

/* Ocultar título y descripción del formulario */
.seccion-contacto__formulario-contenido .gform_wrapper .gform_heading {
    display: none !important;
}

/* Contenedor del body del formulario */
.seccion-contacto__formulario-contenido .gform_wrapper .gform-body,
.seccion-contacto__formulario-contenido .gform_wrapper .gform_body {
    margin: 0 !important;
    padding: 0 !important;
}

/* Contenedor de campos */
.seccion-contacto__formulario-contenido .gform_wrapper .gform_fields {
    display: flex !important;
    flex-direction: column !important;
    gap: 15px !important;
    padding: 0 !important;
    margin: 0 !important;
    grid-gap: 15px !important;
    list-style: none !important;
}

/* Cada campo individual */
.seccion-contacto__formulario-contenido .gform_wrapper .gfield {
    display: flex !important;
    flex-direction: column !important;
    gap: 5px !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    grid-column: unset !important;
}

/* Labels de los campos */
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_label,
.seccion-contacto__formulario-contenido .gform_wrapper .gform-field-label {
    font-family: "Inter", sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
    color: #fff !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: start !important;
    display: flex !important;
    flex-wrap: wrap !important;
}

/* Texto de campo requerido */
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_required {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    margin-left: 4px !important;
    text-transform: none !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_required .gfield_required_asterisk,
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_required.gfield_required_asterisk {
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_required_text {
    font-size: 10px !important;
    text-transform: none !important;
}

/* Contenedores de inputs */
.seccion-contacto__formulario-contenido .gform_wrapper .ginput_container {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

/* Inputs de texto y email */
.seccion-contacto__formulario-contenido .gform_wrapper input[type="text"],
.seccion-contacto__formulario-contenido .gform_wrapper input[type="email"],
.seccion-contacto__formulario-contenido .gform_wrapper input[type="tel"],
.seccion-contacto__formulario-contenido .gform_wrapper input[type="url"],
.seccion-contacto__formulario-contenido .gform_wrapper input[type="number"],
.seccion-contacto__formulario-contenido .gform_wrapper select {
    width: 100% !important;
    height: 44px !important;
    background-color: #F4EAED !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 10px 15px !important;
    font-family: "Inter", sans-serif !important;
    font-size: 14px !important;
    color: #333 !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper input[type="text"]:focus,
.seccion-contacto__formulario-contenido .gform_wrapper input[type="email"]:focus,
.seccion-contacto__formulario-contenido .gform_wrapper input[type="tel"]:focus,
.seccion-contacto__formulario-contenido .gform_wrapper input[type="url"]:focus,
.seccion-contacto__formulario-contenido .gform_wrapper input[type="number"]:focus,
.seccion-contacto__formulario-contenido .gform_wrapper select:focus,
.seccion-contacto__formulario-contenido .gform_wrapper textarea:focus {
    outline: 2px solid rgba(255,255,255,0.5) !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
}

/* Textarea */
.seccion-contacto__formulario-contenido .gform_wrapper textarea,
.seccion-contacto__formulario-contenido .gform_wrapper .textarea {
    width: 100% !important;
    height: 140px !important;
    min-height: 140px !important;
    max-height: 140px !important;
    background-color: #F4EAED !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 12px 15px !important;
    font-family: "Inter", sans-serif !important;
    font-size: 14px !important;
    color: #333 !important;
    resize: none !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    margin: 0 !important;
}

/* Placeholder */
.seccion-contacto__formulario-contenido .gform_wrapper input::placeholder,
.seccion-contacto__formulario-contenido .gform_wrapper textarea::placeholder {
    color: #999 !important;
    opacity: 1 !important;
}

/* Footer del formulario */
.seccion-contacto__formulario-contenido .gform_wrapper .gform_footer,
.seccion-contacto__formulario-contenido .gform_wrapper .gform-footer {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 25px 0 0 0 !important;
    margin: 0 !important;
    width: 100% !important;
    justify-content: flex-start !important;
}

/* Botón de envío */
.seccion-contacto__formulario-contenido .gform_wrapper input[type="submit"],
.seccion-contacto__formulario-contenido .gform_wrapper button[type="submit"],
.seccion-contacto__formulario-contenido .gform_wrapper .gform_button,
.seccion-contacto__formulario-contenido .gform_wrapper .gform-button {
    width: 100% !important;
    height: auto !important;
    background-color: #333 !important;
    color: #fff !important;
    font-family: "Inter", sans-serif !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    text-transform: uppercase !important;
    letter-spacing: 0 !important;
    border: none !important;
    border-radius: 100px !important;
    padding: 12px 26px !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    box-shadow: none !important;
    outline: none !important;
    margin: 0 !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper input[type="submit"]:hover,
.seccion-contacto__formulario-contenido .gform_wrapper button[type="submit"]:hover,
.seccion-contacto__formulario-contenido .gform_wrapper .gform_button:hover,
.seccion-contacto__formulario-contenido .gform_wrapper .gform-button:hover {
    background-color: #555 !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper input[type="submit"]:focus,
.seccion-contacto__formulario-contenido .gform_wrapper button[type="submit"]:focus,
.seccion-contacto__formulario-contenido .gform_wrapper .gform_button:focus,
.seccion-contacto__formulario-contenido .gform_wrapper .gform-button:focus {
    outline: 2px solid rgba(255,255,255,0.5) !important;
    outline-offset: 2px !important;
}

/* Mensajes de validación */
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_validation_message,
.seccion-contacto__formulario-contenido .gform_wrapper .validation_message {
    color: #fff !important;
    font-size: 11px !important;
    font-family: "Inter", sans-serif !important;
    margin-top: 4px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper .gform_validation_errors {
    background-color: rgba(0,0,0,0.2) !important;
    border: 1px solid rgba(255,255,255,0.3) !important;
    border-radius: 6px !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper .gform_validation_errors h2,
.seccion-contacto__formulario-contenido .gform_wrapper .gform_validation_errors .gform_submission_error {
    color: #fff !important;
    font-size: 14px !important;
    font-family: "Inter", sans-serif !important;
    margin: 0 !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_error input,
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_error textarea {
    border: 2px solid rgba(255,255,255,0.5) !important;
}

/* Mensaje de confirmación */
.seccion-contacto__formulario-contenido .gform_confirmation_message {
    color: #fff !important;
    font-family: "Inter", sans-serif !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    text-align: center !important;
    padding: 20px !important;
}

/* Spinner de carga */
.seccion-contacto__formulario-contenido .gform_wrapper .gform_ajax_spinner {
    margin-left: 10px !important;
}

/* Ocultar elementos innecesarios de Gravity Forms */
.seccion-contacto__formulario-contenido .gform_wrapper .gfield_description,
.seccion-contacto__formulario-contenido .gform_wrapper .gform_required_legend,
.seccion-contacto__formulario-contenido .gform_wrapper .screen-reader-text {
    display: none !important;
}

/* Eliminar estilos inline de Gravity Forms */
.seccion-contacto__formulario-contenido .gform_wrapper style {
    display: none !important;
}

/* Resetear clases específicas de Gravity Forms orbital theme */
.seccion-contacto__formulario-contenido .gform_wrapper.gform-theme--framework .gfield,
.seccion-contacto__formulario-contenido .gform_wrapper.gform-theme--orbital .gfield {
    padding: 0 !important;
    margin: 0 !important;
}
.seccion-contacto__formulario-contenido .gform_wrapper.gform-theme--framework .gform_fields,
.seccion-contacto__formulario-contenido .gform_wrapper.gform-theme--orbital .gform_fields {
    row-gap: 15px !important;
    column-gap: 15px !important;
}

/* Responsive Gravity Forms - móvil */
@media (max-width: 1023px) {
    .seccion-contacto__formulario-contenido .gform_wrapper .gform_fields {
        gap: 12px !important;
    }
    .seccion-contacto__formulario-contenido .gform_wrapper input[type="text"],
    .seccion-contacto__formulario-contenido .gform_wrapper input[type="email"],
    .seccion-contacto__formulario-contenido .gform_wrapper input[type="tel"],
    .seccion-contacto__formulario-contenido .gform_wrapper input[type="url"],
    .seccion-contacto__formulario-contenido .gform_wrapper input[type="number"],
    .seccion-contacto__formulario-contenido .gform_wrapper select {
        height: 40px !important;
        font-size: 16px !important; /* Evita zoom en iOS */
    }
    .seccion-contacto__formulario-contenido .gform_wrapper textarea,
    .seccion-contacto__formulario-contenido .gform_wrapper .textarea {
        height: 120px !important;
        min-height: 120px !important;
        max-height: 120px !important;
        font-size: 16px !important;
    }
    .seccion-contacto__formulario-contenido .gform_wrapper input[type="submit"],
    .seccion-contacto__formulario-contenido .gform_wrapper button[type="submit"],
    .seccion-contacto__formulario-contenido .gform_wrapper .gform_button,
    .seccion-contacto__formulario-contenido .gform_wrapper .gform-button {
        padding: 14px 20px !important;
    }
}