/* =====================================================================
   blocks.css — conecta los bloques nativos de Gutenberg (Cover, Columns,
   Group, Gallery, Quote, Buttons...) con el diseño visual ya aprobado.
   Se carga después de style.css.
   ===================================================================== */

/* Reset ligero de espaciados por defecto de los bloques dentro de las
   secciones, para que el diseño no dependa del theme.json (que no usamos) */
.wp-block-group.section { padding: 100px 0; }
.wp-block-group.section--espacios,
.wp-block-group.section--testimonios,
.wp-block-group.section--contacto { background: var(--cream); }
.wp-block-columns.container {
	max-width: var(--container);
	margin: 0 auto;
	padding: 0 32px;
}
.wp-block-group > .wp-block-columns.container,
.wp-block-group > .wp-block-group.container { max-width: var(--container); margin: 0 auto; padding: 0 32px; }

/* ---------------- HERO (Cover block) ---------------- */
.wp-block-cover.fmn-hero {
	min-height: 100vh !important;
}
.wp-block-cover.fmn-hero .wp-block-cover__image-background {
	animation: fmn-hero-zoom 18s ease-in-out infinite alternate;
}
.wp-block-cover.fmn-hero::before {
	content: "";
	position: absolute; inset: 0;
	z-index: 1;
	background: linear-gradient(180deg, rgba(10,9,6,.55) 0%, rgba(10,9,6,.35) 45%, rgba(10,9,6,.72) 100%);
	pointer-events: none;
}
.wp-block-cover.fmn-hero .wp-block-cover__inner-container {
	max-width: 780px;
	margin: 0 auto;
	text-align: center;
	color: #fff;
	position: relative;
	z-index: 2;
}
.fmn-hero-crest { max-width: 92px; margin: 0 auto 26px !important; }
.fmn-hero-crest img { opacity: .95; }
.wp-block-buttons.hero__actions { display: flex; gap: 18px; justify-content: center; flex-wrap: wrap; margin-top: 10px; }
.wp-block-buttons.hero__actions .wp-block-button { margin: 0; }
.wp-block-buttons.hero__actions .wp-block-button__link { border-radius: var(--radius); }

/* ---------------- Tarjetas de "Espacios" (Cover block) ---------------- */
.wp-block-cover.espacio-card {
	border-radius: var(--radius);
	overflow: hidden;
}
.wp-block-cover.espacio-card .wp-block-cover__image-background {
	transition: transform .6s ease;
}
.wp-block-cover.espacio-card:hover .wp-block-cover__image-background {
	transform: scale(1.07);
}
.wp-block-cover.espacio-card .wp-block-cover__inner-container {
	position: absolute; left: 0; right: 0; bottom: 0;
	margin: 0;
	padding: 26px 26px 22px;
	background: linear-gradient(0deg, rgba(10,9,6,.92) 0%, rgba(10,9,6,.55) 55%, rgba(10,9,6,0) 100%);
	color: #fff;
	text-align: left;
}
.wp-block-cover.espacio-card .wp-block-cover__inner-container h3 {
	color: #fff; font-size: 22px; margin: 0 0 8px;
}
.wp-block-cover.espacio-card .wp-block-cover__inner-container p {
	font-size: 14px; color: rgba(255,255,255,.85); margin: 0;
}
.fmn-espacios-col > .wp-block-cover.espacio-card { margin-bottom: 16px; }
.fmn-espacios-col > .wp-block-cover.espacio-card:last-child { margin-bottom: 0; }

/* ---------------- Columnas de contenido (La finca / Historia / Ubicación) ---------------- */
.wp-block-columns.intro-grid,
.wp-block-columns.historia-grid { align-items: center; gap: 72px; }
.wp-block-columns.intro-grid .wp-block-column,
.wp-block-columns.historia-grid .wp-block-column { flex-basis: 50% !important; }
.wp-block-columns.ubicacion-grid { align-items: stretch; gap: 0; }
.wp-block-columns.ubicacion-grid .wp-block-column:last-child { padding: 0 64px; align-self: center; }

.fmn-historia-img img { filter: grayscale(15%) sepia(8%); border: 8px solid var(--white); box-shadow: 0 20px 45px rgba(0,0,0,.18); }

/* ---------------- Stats ---------------- */
.wp-block-group.stats { background: var(--black); padding: 56px 0; }
.wp-block-columns.stats__grid { text-align: center; gap: 0; }
.wp-block-columns.stats__grid .wp-block-column { border-left: 1px solid rgba(255,255,255,.15); }
.wp-block-columns.stats__grid .wp-block-column:first-child { border-left: none; }
.wp-block-columns.stats__grid h3 {
	font-family: var(--font-serif); color: var(--gold);
	font-size: clamp(28px, 3.4vw, 40px); margin: 0;
}
.wp-block-columns.stats__grid p {
	color: rgba(255,255,255,.75); font-size: 13px;
	letter-spacing: .05em; text-transform: uppercase; margin: 6px 0 0;
}

/* ---------------- Galería (bloque nativo Gallery) ---------------- */
.wp-block-gallery.gallery-grid { gap: 4px !important; }
.wp-block-gallery.gallery-grid figure.wp-block-image {
	margin: 0; aspect-ratio: 1/1; overflow: hidden;
}
.wp-block-gallery.gallery-grid figure.wp-block-image img {
	width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease;
}
.wp-block-gallery.gallery-grid figure.wp-block-image:hover img { transform: scale(1.08); }

/* ---------------- Testimonios (Quote blocks) ---------------- */
.testimonios { max-width: 720px; margin: 0 auto; position: relative; min-height: 160px; }
.wp-block-quote.testimonio {
	margin: 0; text-align: center; border: none; padding: 0;
	position: absolute; inset: 0;
	opacity: 0; visibility: hidden;
	transition: opacity .5s ease;
}
.wp-block-quote.testimonio.is-active { opacity: 1; visibility: visible; position: relative; }
.wp-block-quote.testimonio p {
	font-family: var(--font-serif); font-style: italic; font-size: 22px;
	color: var(--black); line-height: 1.5;
}
.wp-block-quote.testimonio cite {
	display: block; margin-top: 18px; font-style: normal; font-size: 13px;
	letter-spacing: .08em; text-transform: uppercase; color: var(--gold-ink);
}

/* ---------------- Contacto ---------------- */
.wp-block-columns.contacto-grid { gap: 64px; }
.fmn-contacto-form-wrap .contacto-form {
	background: var(--white); padding: 44px; border-radius: var(--radius);
	box-shadow: 0 20px 50px rgba(30,25,10,.08);
}

/* ---------------- Responsive ---------------- */
@media (max-width: 1024px) {
	.wp-block-columns.intro-grid,
	.wp-block-columns.historia-grid,
	.wp-block-columns.ubicacion-grid,
	.wp-block-columns.contacto-grid,
	.wp-block-columns.fmn-espacios-row { flex-wrap: wrap !important; }
	.wp-block-columns.intro-grid .wp-block-column,
	.wp-block-columns.historia-grid .wp-block-column { flex-basis: 100% !important; }
	.wp-block-columns.stats__grid { flex-wrap: wrap !important; }
	.wp-block-columns.stats__grid .wp-block-column { flex-basis: 33.33% !important; margin-bottom: 24px; }
}
@media (max-width: 782px) {
	.wp-block-group.section { padding: 60px 0; }
	.wp-block-cover.fmn-hero .wp-block-cover__inner-container h1 { font-size: 34px; }
	.wp-block-columns.stats__grid .wp-block-column { flex-basis: 50% !important; border-left: none; }
	.wp-block-gallery.gallery-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* =====================================================================
   Clases de utilidad para ajustar espaciados SIN usar el panel lateral.
   Escríbelas (una o varias, separadas por espacio) en el campo
   "Clases CSS adicionales" de cualquier bloque (Ajustes del bloque →
   Avanzado). Ejemplo: "u-mt-0 u-mb-l" quita el margen superior y deja
   un margen inferior "grande" (32px).
   ===================================================================== */
.u-mt-0  { margin-top: 0 !important; }
.u-mt-xs { margin-top: 8px !important; }
.u-mt-s  { margin-top: 16px !important; }
.u-mt-m  { margin-top: 24px !important; }
.u-mt-l  { margin-top: 32px !important; }
.u-mt-xl { margin-top: 48px !important; }
.u-mt-2xl{ margin-top: 64px !important; }

.u-mb-0  { margin-bottom: 0 !important; }
.u-mb-xs { margin-bottom: 8px !important; }
.u-mb-s  { margin-bottom: 16px !important; }
.u-mb-m  { margin-bottom: 24px !important; }
.u-mb-l  { margin-bottom: 32px !important; }
.u-mb-xl { margin-bottom: 48px !important; }
.u-mb-2xl{ margin-bottom: 64px !important; }

.u-pt-0  { padding-top: 0 !important; }
.u-pt-s  { padding-top: 16px !important; }
.u-pt-m  { padding-top: 24px !important; }
.u-pt-l  { padding-top: 32px !important; }
.u-pt-xl { padding-top: 48px !important; }
.u-pt-2xl{ padding-top: 64px !important; }
.u-pt-3xl{ padding-top: 96px !important; }

.u-pb-0  { padding-bottom: 0 !important; }
.u-pb-s  { padding-bottom: 16px !important; }
.u-pb-m  { padding-bottom: 24px !important; }
.u-pb-l  { padding-bottom: 32px !important; }
.u-pb-xl { padding-bottom: 48px !important; }
.u-pb-2xl{ padding-bottom: 64px !important; }
.u-pb-3xl{ padding-bottom: 96px !important; }

.u-gap-0  > * { margin-right: 0 !important; }
.u-center { margin-left: auto !important; margin-right: auto !important; float: none !important; }
.u-hide-mobile { }
@media (max-width: 782px) { .u-hide-mobile { display: none !important; } }
.u-hide-desktop { display: none !important; }
@media (max-width: 782px) { .u-hide-desktop { display: block !important; } }

/* =====================================================================
   v1.1 — Secciones añadidas (Tipos de evento, Visita virtual, Confianza)
   y pie de página con CTA
   ===================================================================== */
.wp-block-group.section--eventos,
.wp-block-group.section--visita { background: var(--white); }
.wp-block-group.section--confianza { background: var(--cream); }

/* Tarjetas "Tipos de evento": misma estética que Espacios */
.wp-block-columns.fmn-eventos-row { gap: 16px; }
@media (max-width: 1024px) {
	.wp-block-columns.fmn-eventos-row { flex-wrap: wrap !important; }
	.wp-block-columns.fmn-eventos-row .wp-block-column { flex-basis: calc(50% - 8px) !important; }
}
@media (max-width: 600px) {
	.wp-block-columns.fmn-eventos-row .wp-block-column { flex-basis: 100% !important; }
}

/* "Todo en regla": encabezados de cada punto en dorado */
.section--confianza .wp-block-column h3 {
	font-size: 19px; color: var(--gold-dark, #9c8419); margin: 0 0 6px;
}
.section--confianza .wp-block-columns { margin-bottom: 8px; }

/* Pie: columna de llamada a la acción */
.footer-col--cta p { color: rgba(255,255,255,.75); font-size: 14px; margin: 0 0 16px; }
.footer-col--cta .btn { display: inline-block; }

/* =====================================================================
   Pie v1.1.1 — franja CTA, iconos sociales y de contacto, barra legal
   ===================================================================== */
.site-footer__cta{display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;justify-content:center;text-align:center;padding:30px 32px;border-bottom:1px solid rgba(255,255,255,.12)}
.site-footer__cta p{font-family:var(--font-serif);font-size:21px;color:#fff;margin:0}
.footer-social{display:flex;gap:12px;margin-top:14px}
.footer-social a{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.28);border-radius:50%;color:#fff;transition:background .2s,color .2s,border-color .2s}
.footer-social a:hover{background:var(--gold);border-color:var(--gold);color:var(--black)}
.footer-social svg{width:18px;height:18px;fill:currentColor}
.footer-contact{list-style:none;margin:0;padding:0}
.footer-contact li{display:flex;gap:11px;align-items:flex-start;margin-bottom:12px;line-height:1.5}
.footer-contact svg{width:16px;height:16px;fill:var(--gold);flex:0 0 auto;margin-top:3px}
.footer-contact a{color:inherit;text-decoration:none}
.footer-contact a:hover{color:var(--gold)}
.site-footer__bottom{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;justify-content:space-between}
.footer-legal{display:flex;gap:16px;flex-wrap:wrap}
.footer-legal a{color:rgba(255,255,255,.7);text-decoration:none;font-size:13px}
.footer-legal a:hover{color:var(--gold)}
@media(max-width:600px){.site-footer__bottom{justify-content:center;text-align:center}}

/* =====================================================================
   Pie v1.1.3 — marca (logo + eslogan), CTA como columna, 4 columnas
   ===================================================================== */
.site-footer__top{ align-items: flex-start; }
.footer-col--brand{ flex: 1.5 1 260px; }
.footer-col--nav,
.footer-col--contact,
.footer-col--cta{ flex: 1 1 175px; }
.footer-col--brand .footer-logo{ width: 158px; height: auto; margin-bottom: 2px; }
.footer-slogan{
  font-family: var(--font-serif); font-style: italic;
  font-size: 20px; color: var(--gold); line-height: 1.3; margin: 12px 0 8px;
}
.footer-place{
  font-size: 12.5px; line-height: 1.6; color: rgba(255,255,255,.58); margin: 0;
}
.footer-col--brand .footer-social{ margin-top: 20px; }
.footer-col--cta p{ color: rgba(255,255,255,.72); font-size: 14px; margin: 0 0 16px; }
.footer-col--cta .btn{ display: inline-block; }
