/* ==========================================================================
   Contacto page (template-contacto.php) — Grupo Acción prototype design
   Two-column contact page (intro + lead-card). The .contact-page layout
   rules live in style.css (copied from the prototype); this file scopes the
   real Gravity Form (#1) inside the lead card and handles the form fields.
   ========================================================================== */

/* Full-width content area so the section controls its own width */
body.gai-contacto-page .site-content > .ast-container {
	max-width: 100% !important;
	padding-inline: 0 !important;
}

/* Inner wrapper keeps the form aligned with the prototype's heading copy */
.gai-contacto-page .contact-page .lead-card .contact-form-wrap {
	width: 100%;
	max-width: 610px;
	margin: auto;
}
.gai-contacto-page .contact-page .lead-card .contact-form-wrap h2 {
	margin-bottom: 8px;
}

/* Neutralize the prototype demo-form grid for the real Gravity Form */
.gai-contacto-page .contact-page .lead-card .gform_wrapper form {
	display: block !important;
	width: 100%;
}
.gai-contacto-page .contact-page .lead-card .gform_wrapper {
	max-width: none;
	margin: 0;
}
.gai-contacto-page .contact-page .lead-card .gform_heading {
	margin-bottom: 4px;
}
.gai-contacto-page .contact-page .lead-card .gform_required_legend {
	margin: 0 0 20px;
	color: var(--muted);
	font-size: 0.74rem;
	line-height: 1.5;
}

/* Field rows spacing */
.gai-contacto-page .contact-page .lead-card .gform_fields {
	row-gap: 16px;
}

/* Field labels */
.gai-contacto-page .contact-page .lead-card .gfield_label {
	margin-bottom: 7px;
	color: #414043;
	font-family: "Manrope", Arial, sans-serif;
	font-size: 0.78rem;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: 0;
	text-transform: none;
}

/* Inputs / selects / textareas: design field */
.gai-contacto-page .contact-page .lead-card .gfield input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.gai-contacto-page .contact-page .lead-card .gfield select,
.gai-contacto-page .contact-page .lead-card .gfield textarea,
.gai-contacto-page .contact-page .lead-card input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.gai-contacto-page .contact-page .lead-card select,
.gai-contacto-page .contact-page .lead-card textarea {
	width: 100%;
	min-height: 50px;
	padding: 12px 14px;
	border: 1px solid #cbc7c1;
	border-radius: 0;
	background: #fff;
	color: var(--ink);
	font-family: "Manrope", Arial, sans-serif;
	font-size: 1rem;
	line-height: 1.4;
}
.gai-contacto-page .contact-page .lead-card .gfield textarea {
	min-height: 120px;
	resize: vertical;
}
.gai-contacto-page .contact-page .lead-card .gfield input::placeholder,
.gai-contacto-page .contact-page .lead-card .gfield textarea::placeholder {
	color: #a5a2a6;
}
.gai-contacto-page .contact-page .lead-card .gfield input:focus,
.gai-contacto-page .contact-page .lead-card .gfield select:focus,
.gai-contacto-page .contact-page .lead-card .gfield textarea:focus {
	border-color: var(--berry);
	box-shadow: 0 0 0 3px rgba(177, 0, 57, 0.1);
	outline: 0;
}

/* Consent rows: one line each with the checkbox */
.gai-contacto-page .contact-page .lead-card .gfield--type-consent .gfield_label {
	display: none;
}
.gai-contacto-page .contact-page .lead-card .gfield--type-consent .ginput_container_consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	color: var(--muted);
	font-size: 0.72rem;
	font-weight: 500;
	line-height: 1.5;
}
.gai-contacto-page .contact-page .lead-card .gfield--type-consent .ginput_container_consent label {
	display: block; /* neutralize the design-system `label{display:grid}` */
	margin: 0;
	line-height: inherit;
}
.gai-contacto-page .contact-page .lead-card .gfield--type-consent input[type="checkbox"] {
	flex: 0 0 auto;
	width: 18px;
	min-width: 18px;
	min-height: 18px;
	margin: 3px 0 0;
	padding: 0;
	accent-color: var(--berry);
}
.gai-contacto-page .contact-page .lead-card .gfield--type-consent a {
	color: var(--berry);
	font-weight: 700;
}

/* Submit button */
.gai-contacto-page .contact-page .lead-card .gform_footer {
	margin: 22px 0 0;
}
.gai-contacto-page .contact-page .lead-card .gform_button,
.gai-contacto-page .contact-page .lead-card .gform_footer input[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 50px;
	padding: 0 26px;
	border: 1px solid var(--berry);
	border-radius: 0;
	background: var(--berry);
	color: #fff;
	font-family: "Manrope", Arial, sans-serif;
	font-size: 0.83rem;
	font-weight: 800;
	letter-spacing: 0;
	line-height: 1;
	text-transform: none;
	cursor: pointer;
	transition: transform 0.2s, background 0.2s, border 0.2s;
}
.gai-contacto-page .contact-page .lead-card .gform_button:hover,
.gai-contacto-page .contact-page .lead-card .gform_footer input[type="submit"]:hover {
	transform: translateY(-2px);
	background: var(--berry-dark);
	border-color: var(--berry-dark);
	color: #fff;
}

/* --- Responsive tweaks (grid collapse is already in style.css) --- */
@media (max-width: 600px) {
	.gai-contacto-page .contact-page .lead-card .contact-form-wrap h2 {
		font-size: clamp(1.7rem, 8vw, 2.2rem);
	}
}

/* Intro paragraph under the H1 gets a little breathing room */
.gai-contacto-page .contact-intro > p:not(.eyebrow) {
	margin-top: 20px;
}

/* Form intro under the card heading gets a little breathing room */
.gai-contacto-page .lead-card .form-intro {
	margin-top: 10px;
}

/* Keep the two half-width fields (Nombre + Teléfono) perfectly aligned:
   Gravity renders the Name label as a <legend> and the Phone label as an
   inline <label>, so the simple field's label/input sat a few px lower.
   Make both labels block-level with identical margins/line-height. */
.gai-contacto-page .contact-page .lead-card .gfield--width-half {
	align-self: start;
}
.gai-contacto-page .contact-page .lead-card .gfield--width-half .gfield_label,
.gai-contacto-page .contact-page .lead-card .gfield--width-half legend.gfield_label {
	display: block;
	width: 100%;
	margin: 0 0 7px;
	line-height: 1.2;
}
.gai-contacto-page .contact-page .lead-card .gfield--type-name .ginput_complex {
	margin: 0;
}

/* Office section + free map embed (below the "Oficina" option) */
.gai-contacto-page .contact-options #oficina {
	scroll-margin-top: 110px;
}
.gai-contacto-page .contact-map {
	margin-top: 38px;
}
.gai-contacto-page .contact-map iframe {
	display: block;
	width: 100%;
	height: 360px;
	border: 0;
	background: var(--soft);
	box-shadow: 0 14px 40px rgba(20, 16, 18, 0.08);
}
@media (max-width: 600px) {
	.gai-contacto-page .contact-map iframe {
		height: 300px;
	}
}