/* =====================================================================
   EL ROSAL BEAUTY · CONTÁCTANOS
   Requiere rosal-base.css (header interior, botones, loc-btn, social).
   ===================================================================== */

/* ============================ FORM + INFO ============================ */
.r-ct { background: var(--r-ivory); }
.r-ct__grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(28px, 4vw, 64px); align-items: start; }

.r-ct__form-intro { color: var(--r-ink-soft); margin: 0 0 24px; max-width: 48ch; }

/* Estiliza el formulario (WPForms/CF7) y el fallback por igual */
.r-ct__form input[type="text"],
.r-ct__form input[type="email"],
.r-ct__form input[type="tel"],
.r-ct__form input[type="url"],
.r-ct__form input[type="number"],
.r-ct__form textarea,
.r-ct__form select {
	width: 100%; font-family: var(--r-sans); font-size: .98rem; color: var(--r-ink);
	padding: .92em 1.1em; border: 1px solid var(--r-line); border-radius: var(--r-radius);
	background: #fff; transition: border-color .3s var(--r-ease), box-shadow .3s var(--r-ease);
}
.r-ct__form input:focus,
.r-ct__form textarea:focus,
.r-ct__form select:focus { outline: none; border-color: var(--r-wine); box-shadow: 0 0 0 3px var(--r-blush); }
.r-ct__form textarea { resize: vertical; min-height: 130px; }
.r-ct__form input[type="submit"],
.r-ct__form button[type="submit"],
.r-ct__form .wpforms-submit,
.r-ct__form .wpcf7-submit {
	font-family: var(--r-sans); font-weight: 500; font-size: .95rem; letter-spacing: .03em;
	padding: 1.05em 2.2em; border: 0; border-radius: 999px;
	background: var(--r-wine); color: #fff; cursor: pointer;
	transition: background .3s var(--r-ease), transform .3s var(--r-ease), box-shadow .3s var(--r-ease);
}
.r-ct__form input[type="submit"]:hover,
.r-ct__form button[type="submit"]:hover,
.r-ct__form .wpforms-submit:hover,
.r-ct__form .wpcf7-submit:hover { background: var(--r-wine-deep); transform: translateY(-2px); box-shadow: var(--r-shadow-sm); }

/* Fallback visual */
.r-ct__fallback { display: flex; flex-direction: column; gap: 16px; }
.r-ct__fallback label { display: flex; flex-direction: column; gap: 7px; font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: var(--r-ink-soft); font-weight: 600; }
.r-ct__row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.r-ct__hint { font-size: .78rem; color: var(--r-ink-soft); margin: 4px 0 0; text-transform: none; letter-spacing: 0; font-weight: 400; }

/* ---- WPForms (formulario real) — variables modernas + overrides ---- */
.r-ct__form .wpforms-container,
.r-ct__form .wpforms-container-full {
	margin: 0 !important;
	/* Markup moderno de WPForms: se estiliza con estas variables */
	--wpforms-field-border-radius: var(--r-radius);
	--wpforms-field-border-style: solid;
	--wpforms-field-border-size: 1px;
	--wpforms-field-border-color: var(--r-line);
	--wpforms-field-background-color: #ffffff;
	--wpforms-field-text-color: var(--r-ink);
	--wpforms-field-menu-color: #ffffff;
	--wpforms-label-color: var(--r-ink);
	--wpforms-label-sublabel-color: var(--r-ink-soft);
	--wpforms-label-error-color: #c0392b;
	--wpforms-button-background-color: var(--r-wine);
	--wpforms-button-background-color-alt: var(--r-wine-deep);
	--wpforms-button-text-color: #ffffff;
	--wpforms-button-border-radius: 999px;
	--wpforms-field-size-medium-font-size: .98rem;
}
.r-ct__form .wpforms-field { padding: 0 0 18px !important; }
.r-ct__form .wpforms-field-label { font-family: var(--r-sans) !important; font-weight: 600 !important; font-size: .8rem !important; letter-spacing: .1em; text-transform: uppercase; color: var(--r-ink) !important; margin: 0 0 8px !important; }
.r-ct__form .wpforms-required-label { color: var(--r-wine) !important; }
.r-ct__form .wpforms-field-sublabel { font-family: var(--r-sans) !important; font-size: .72rem !important; text-transform: none !important; letter-spacing: 0 !important; color: var(--r-ink-soft) !important; font-weight: 400 !important; }
.r-ct__form .wpforms-container input[type="text"],
.r-ct__form .wpforms-container input[type="email"],
.r-ct__form .wpforms-container input[type="tel"],
.r-ct__form .wpforms-container input[type="url"],
.r-ct__form .wpforms-container input[type="number"],
.r-ct__form .wpforms-container textarea,
.r-ct__form .wpforms-container select {
	width: 100% !important; max-width: 100% !important;
	font-family: var(--r-sans) !important; font-size: .98rem !important; color: var(--r-ink) !important;
	padding: .92em 1.1em !important; border: 1px solid var(--r-line) !important; border-radius: var(--r-radius) !important;
	background: #fff !important; box-shadow: none !important;
	transition: border-color .3s var(--r-ease), box-shadow .3s var(--r-ease);
}
.r-ct__form .wpforms-container input:focus,
.r-ct__form .wpforms-container textarea:focus,
.r-ct__form .wpforms-container select:focus { border-color: var(--r-wine) !important; box-shadow: 0 0 0 3px var(--r-blush) !important; outline: none !important; }
.r-ct__form .wpforms-container textarea { min-height: 130px !important; resize: vertical; }
.r-ct__form .wpforms-field-row { gap: 16px; }
.r-ct__form .wpforms-submit,
.r-ct__form button[type="submit"].wpforms-submit {
	display: inline-block; width: auto !important;
	font-family: var(--r-sans) !important; font-weight: 500 !important; font-size: .95rem !important; letter-spacing: .03em;
	padding: 1.05em 2.4em !important; border: 0 !important; border-radius: 999px !important;
	background: var(--r-wine) !important; color: #fff !important; cursor: pointer;
	transition: background .3s var(--r-ease), transform .3s var(--r-ease), box-shadow .3s var(--r-ease);
}
.r-ct__form .wpforms-submit:hover { background: var(--r-wine-deep) !important; transform: translateY(-2px); box-shadow: var(--r-shadow-sm); }
.r-ct__form .wpforms-confirmation-container-full { background: var(--r-blush-soft) !important; border: 1px solid var(--r-line-gold) !important; border-radius: var(--r-radius) !important; color: var(--r-ink) !important; }

/* Tarjeta de info */
.r-ct__info-card {
	background: linear-gradient(165deg, var(--r-blush-soft), #fff);
	border: 1px solid var(--r-line-gold); border-radius: var(--r-radius-lg);
	padding: clamp(24px, 3vw, 38px);
}
.r-ct__info-title { font-family: var(--r-serif); font-weight: 600; font-size: 1.6rem; color: var(--r-ink); margin: 0 0 20px; }
.r-ct__item {
	display: flex; align-items: center; gap: 14px; padding: 14px 0;
	border-top: 1px solid var(--r-line); color: var(--r-ink);
}
.r-ct__item:first-of-type { border-top: 0; }
.r-ct__item-icon {
	flex: none; display: grid; place-items: center; width: 46px; height: 46px;
	border-radius: 50%; background: #fff; border: 1px solid var(--r-line); color: var(--r-wine);
	transition: all .3s var(--r-ease);
}
.r-ct__item-icon svg { width: 20px; height: 20px; }
a.r-ct__item:hover .r-ct__item-icon { background: var(--r-wine); border-color: var(--r-wine); color: #fff; }
.r-ct__item-body { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.r-ct__item-label { font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; color: var(--r-rose-deep); }
.r-ct__item-value { font-size: .96rem; color: var(--r-ink); word-break: break-word; }
.r-ct__item--wa .r-ct__item-icon { background: #25d366; border-color: #25d366; color: #fff; }
a.r-ct__item--wa:hover .r-ct__item-icon { background: #1f8a4d; border-color: #1f8a4d; }

.r-ct__social { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--r-line); }
.r-ct__social-label { display: block; font-size: .64rem; letter-spacing: .26em; text-transform: uppercase; color: var(--r-rose-deep); margin-bottom: 12px; }

/* ============================ VISÍTANOS ============================ */
.r-ct-visit { background: linear-gradient(var(--r-blush-soft), var(--r-ivory)); border-top: 1px solid var(--r-line-gold); }
.r-ct-visit__inner { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 64px); align-items: center; }
.r-ct-visit__text p { color: var(--r-ink-soft); max-width: 50ch; }
.r-ct-visit__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.r-ct-visit__map .r-img-ph { aspect-ratio: 4 / 3; border-radius: var(--r-radius-lg); box-shadow: var(--r-shadow-md); }

/* ============================ RESPONSIVE ============================ */
@media (max-width: 900px) {
	.r-ct__grid { grid-template-columns: 1fr; }
	.r-ct-visit__inner { grid-template-columns: 1fr; }
	.r-ct-visit__map { max-width: 520px; }
}
@media (max-width: 480px) {
	.r-ct__row { grid-template-columns: 1fr; }
}