/* ==========================================================================
   Agriauto · capa visual del tema hijo
   Colores y tipografías: Elementor > Ajustes del sitio. Aquí solo va lo que Elementor no hace por
   sí solo: el pico curvo entre secciones, los anillos de los iconos, las animaciones, los efectos al
   pasar el ratón y el menú del móvil. Las medidas salen del diseño a 1920 px y escalan con la pantalla.
   ========================================================================== */

.agr {
	--agr-verde: var(--e-global-color-primary, #0CB64C);
	--agr-tierra: var(--e-global-color-secondary, #C88663);
	--agr-crema: var(--e-global-color-accent, #EDF8EE);
	--agr-r: clamp(48px, 9.792vw, 188px); /* radio grande del diseño: 188 px a 1920 */
	--agr-ease: cubic-bezier(.16, 1, .3, 1);
}
html { scroll-behavior: smooth; }
html, body { overflow-x: clip; }
html.agr-bloq, html.agr-bloq body { overflow: hidden; }
body.agr {
	margin: 0;
	background: var(--agr-crema);
	color: var(--agr-tierra);
	font-family: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.agr a { color: inherit; }
.agr :focus-visible { outline: 2px solid var(--agr-tierra); outline-offset: 4px; }
#agr-sitio { position: relative; }
.agr .screen-reader-text { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); white-space: nowrap; }
.agr .skip-link:focus { clip: auto; clip-path: none; width: auto; height: auto; top: 12px; left: 12px; z-index: 200; padding: 12px 20px; border-radius: 999px; background: var(--agr-crema); color: var(--agr-verde); font-weight: 600; text-decoration: none; }
.agr .agr-lead strong { font-weight: 700; }
.agr .elementor-element.elementor-widget-text-editor p:last-child { margin-block-end: 0; }
/* Iconos, imágenes y botones sin el hueco de la línea de texto debajo (medidas exactas del diseño) */
.agr .elementor-widget-icon .elementor-icon-wrapper, .agr .elementor-widget-image, .agr .elementor-widget-button { line-height: 0; }
.agr .elementor-widget-icon .elementor-icon, .agr .elementor-widget-image img { vertical-align: top; }
.agr .agr-negrita6 strong, .agr .agr-desc strong { font-weight: 600; }

/* ---------- Cabecera (plantilla «Agriauto · Cabecera») ---------- */
.agr .agr-cab {
	position: absolute;
	top: 0; left: 0; right: 0;
	z-index: 90;
	transition: transform .5s var(--agr-ease), background-color .35s ease, box-shadow .35s ease;
}
.agr.agr-sin-hero .agr-cab { position: relative; background: var(--agr-verde); }
.agr.agr-sin-hero .agr-cab.e-con { --padding-bottom: clamp(18px, 2.2vw, 40px); }
.agr .agr-cab > .agr-nav { --flex-basis: 0px; flex-basis: 0px; min-width: 0; } /* dos mitades iguales: el logo queda en el centro exacto */
.agr .agr-nav .elementor-icon-list-items { gap: 0 clamp(26px, 4.224vw, 81.1px); margin: 0 !important; flex-wrap: nowrap; }
.agr .agr-nav .elementor-icon-list-item { margin: 0 !important; }
.agr .agr-nav .elementor-icon-list-text { white-space: nowrap; transition: color .35s var(--agr-ease); }
.agr .agr-nav .elementor-icon-list-item.agr-activo .elementor-icon-list-text { color: var(--agr-verde); }

.agr .agr-nav .elementor-icon-list-item a:focus-visible .elementor-icon-list-text { color: var(--agr-verde); }
/* Menú y enlaces del pie sin iconos (Elementor pone un ✓ a cada elemento nuevo de la lista) */
.agr .agr-nav .elementor-icon-list-icon, .agr .agr-pie-enl .elementor-icon-list-icon { display: none; }
.agr .agr-nav .elementor-icon-list-icon + .elementor-icon-list-text,
.agr .agr-pie-enl .elementor-icon-list-icon + .elementor-icon-list-text { padding-inline-start: 0; }

/* Fija al bajar: verde, más compacta; se esconde al bajar y vuelve al subir */
.agr .agr-cab.agr-fija {
	position: fixed;
	background: var(--agr-verde);
	box-shadow: 0 14px 34px -22px rgba(0, 0, 0, .55);
	animation: agrCabEntra .6s var(--agr-ease); /* sin «both»: si no, su estado final anula el esconderse al bajar */
}
/* Verde al 95 % donde hay color-mix (la condición no puede llevar var(): con var() siempre sería verdadera) */
@supports (background: color-mix(in srgb, red 95%, transparent)) {
	.agr .agr-cab.agr-fija { background: color-mix(in srgb, var(--agr-verde) 95%, transparent); }
}
/* Compacta y centrada (.e-con para ganar a las variables que escribe Elementor, que carga después) */
.agr .agr-cab.agr-fija.e-con { --padding-top: 14px; --padding-bottom: 14px; --align-items: center; }
/* Escondida del todo (también la sombra) y sin la animación de entrada; vuelve si se llega a ella con el teclado */
.agr .agr-cab.agr-fija.agr-oculta { transform: translateY(calc(-100% - 40px)); animation: none; }
.agr .agr-cab.agr-fija.agr-oculta:focus-within { transform: none; }
.agr .agr-cab.agr-fija .agr-nav { margin-top: 0 !important; }
.agr .agr-cab.agr-fija .agr-logo img { width: clamp(120px, 9.5vw, 182px); transition: width .35s var(--agr-ease); }
/* Sobre fondo verde (barra fija y páginas sin foto de cabecera): texto crema y subrayado para el activo, al pasar y con el teclado */
body.agr .agr-cab.agr-fija .agr-nav .elementor-icon-list-item .elementor-icon-list-text,
body.agr .agr-cab.agr-fija .agr-nav .elementor-icon-list-item:hover .elementor-icon-list-text,
body.agr.agr-sin-hero .agr-cab .agr-nav .elementor-icon-list-item .elementor-icon-list-text,
body.agr.agr-sin-hero .agr-cab .agr-nav .elementor-icon-list-item:hover .elementor-icon-list-text { color: var(--agr-crema); }
.agr .agr-cab.agr-fija .agr-nav .elementor-icon-list-text,
.agr.agr-sin-hero .agr-cab .agr-nav .elementor-icon-list-text {
	background: linear-gradient(currentColor, currentColor) 0 calc(50% + .5em) / 0 2px no-repeat;
	transition: background-size .45s var(--agr-ease);
}
.agr .agr-cab.agr-fija .agr-nav .elementor-icon-list-item:hover .elementor-icon-list-text,
.agr .agr-cab.agr-fija .agr-nav .elementor-icon-list-item.agr-activo .elementor-icon-list-text,
.agr .agr-cab.agr-fija .agr-nav a:focus-visible .elementor-icon-list-text,
.agr.agr-sin-hero .agr-cab .agr-nav .elementor-icon-list-item:hover .elementor-icon-list-text,
.agr.agr-sin-hero .agr-cab .agr-nav .elementor-icon-list-item.agr-activo .elementor-icon-list-text,
.agr.agr-sin-hero .agr-cab .agr-nav a:focus-visible .elementor-icon-list-text { background-size: 100% 2px; }
@keyframes agrCabEntra { from { transform: translateY(-100%); } to { transform: none; } }

/* Botón hamburguesa (móvil y tableta) */
.agr .agr-burger {
	display: inline-flex; flex-direction: column; justify-content: center; gap: 6px;
	width: 48px; height: 48px; padding: 0 12px;
	border: 0; border-radius: 50%;
	background: rgba(12, 182, 76, .9);
	box-shadow: 0 0 0 1.5px rgba(237, 248, 238, .55);
	cursor: pointer;
}
.agr .agr-burger:hover, .agr .agr-burger:focus { background: var(--agr-verde); }
.agr .agr-burger span { display: block; height: 2px; border-radius: 2px; background: var(--agr-crema); transition: transform .45s var(--agr-ease), opacity .3s ease; }
.agr.agr-menu-abierto .agr-burger span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.agr.agr-menu-abierto .agr-burger span:nth-child(2) { opacity: 0; }
.agr.agr-menu-abierto .agr-burger span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

/* Menú del móvil (lo monta agriauto.js con los enlaces de la cabecera) */
.agr-movil {
	position: fixed; inset: 0; z-index: 85;
	display: flex; flex-direction: column; justify-content: flex-start; /* la lista se centra con margin:auto y, si no cabe (móvil en horizontal), se desplaza */
	overflow-y: auto; overscroll-behavior: contain;
	padding: 110px 32px 48px;
	background: var(--agr-verde);
	visibility: hidden; opacity: 0;
	transition: opacity .45s var(--agr-ease), visibility 0s linear .45s;
}
.agr.agr-menu-abierto .agr-movil { visibility: visible; opacity: 1; transition: opacity .45s var(--agr-ease); }
.agr.agr-menu-abierto .agr-cab { position: fixed; background: var(--agr-verde); box-shadow: none; transform: none; } /* verde como el menú: si la lista se desplaza, pasa por debajo sin verse */
.agr-movil ul { list-style: none; margin: auto 0; padding: 0; }
.agr-movil li { overflow: hidden; }
.agr-movil a {
	display: inline-block; padding: 6px 0 10px;
	font-family: "Fjalla One", sans-serif; font-size: clamp(34px, min(10vw, 9vh), 54px); line-height: 1.15; text-transform: uppercase;
	color: var(--agr-crema); text-decoration: none;
	transform: translateY(105%);
	transition: transform .7s var(--agr-ease), color .3s ease;
	transition-delay: calc(var(--i, 0) * 60ms);
}
.agr.agr-menu-abierto .agr-movil a { transform: none; transition-delay: calc(120ms + var(--i, 0) * 60ms); }
/* Activo y al tocar o pasar: crema con subrayado (el marrón sobre verde no se distinguía) */
.agr-movil a { text-decoration: underline; text-decoration-color: transparent; text-decoration-thickness: 3px; text-underline-offset: .16em; }
.agr-movil a[aria-current="page"], .agr-movil a:hover, .agr-movil a:active, .agr-movil a:focus-visible { color: var(--agr-crema); text-decoration-color: currentColor; }

/* ---------- Portada: hero con zoom out progresivo ---------- */
.agr .agr-hero { position: relative; isolation: isolate; }
.agr .agr-hero-foto { position: absolute; inset: 0; z-index: 0; width: 100%; max-width: none; margin: 0; }
.agr .agr-hero-foto img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; transform-origin: 50% 50%; }
body.agr:not(.elementor-editor-active) .agr-hero-foto img { animation: agrAleja 7s cubic-bezier(.2, .65, .25, 1) both; will-change: transform; }
@keyframes agrAleja { from { transform: scale(1.22); } to { transform: none; } }
/* Móviles antiguos sin svh: la altura de Elementor (min(80svh, 640px)) no valdría y el hero quedaría a 0 */
@supports not (height: 1svh) {
	@media (max-width: 767px) { .agr .agr-hero { min-height: min(80vh, 640px); } }
}

/* Insignia con la hoja: disco claro con anillo verde interior */
.agr .agr-insignia { position: relative; z-index: 2; }
.agr .agr-insignia .elementor-icon { box-shadow: inset 0 0 0 .0481em var(--agr-crema), inset 0 0 0 .065em var(--agr-verde); }

/* ---------- Pico curvo entre secciones (radio 188 px a 1920) ---------- */
.agr .agr-pico { position: relative; }
.agr .agr-pico::after {
	content: "";
	position: absolute; z-index: 1;
	top: -1px; left: 50%;
	width: calc(var(--agr-r) * 2); height: calc(var(--agr-r) + 1px);
	transform: translateX(-50%);
	pointer-events: none;
	background:
		radial-gradient(circle at 0 100%, transparent calc(var(--agr-r) - .75px), var(--agr-pico-c) var(--agr-r)) 0 0 / 50% 100% no-repeat,
		radial-gradient(circle at 100% 100%, transparent calc(var(--agr-r) - .75px), var(--agr-pico-c) var(--agr-r)) 100% 0 / 50% 100% no-repeat;
}
.agr .agr-pico-verde { --agr-pico-c: var(--agr-verde); }
.agr .agr-pico-claro { --agr-pico-c: var(--agr-crema); }

/* ---------- Servicios ---------- */
.agr .agr-ico .elementor-icon {
	box-shadow: 0 0 0 .0534em var(--agr-crema), 0 0 0 .0653em var(--agr-verde);
	transition: box-shadow .7s var(--agr-ease), transform .7s var(--agr-ease);
}
.agr .agr-ico .elementor-icon svg { transition: transform .7s var(--agr-ease); }
.agr .agr-serv:hover .agr-ico .elementor-icon { box-shadow: 0 0 0 .085em var(--agr-crema), 0 0 0 .097em var(--agr-verde); transform: translateY(-4px); }
.agr .agr-serv:hover .agr-ico .elementor-icon svg { transform: scale(1.07); }

/* Botones «+» (Saber más, Conoce más): cambia el tono y el + gira */
.agr .agr-mas .elementor-button { background: transparent; padding: 0; border: 0; border-radius: 0; }
.agr .agr-mas .elementor-button-icon { display: inline-flex; }
.agr .agr-mas .elementor-button-icon svg { width: 1.387em; height: 1.387em; transition: transform .8s var(--agr-ease); }
.agr .agr-mas .elementor-button:hover .elementor-button-icon svg,
.agr .agr-mas .elementor-button:focus-visible .elementor-button-icon svg,
.agr .agr-mas .elementor-button:active .elementor-button-icon svg { transform: rotate(180deg); }
.agr .agr-mas-sub .elementor-button-text {
	background: linear-gradient(currentColor, currentColor) 0 calc(50% + .48em) / 0 2px no-repeat;
	transition: background-size .55s var(--agr-ease);
}
.agr .agr-mas-sub .elementor-button:hover .elementor-button-text,
.agr .agr-mas-sub .elementor-button:focus-visible .elementor-button-text { background-size: 100% 2px; }

/* ---------- Llamada a la acción: el texto aparece al bajar ---------- */
.agr .agr-w { opacity: .16; transition: opacity .35s linear; }
.agr .agr-w.agr-w-on { opacity: 1; }
.agr .elementor-animation-grow { transition: transform .45s var(--agr-ease); }

/* ---------- Pie ---------- */
.agr .agr-pie-enl .elementor-icon-list-text {
	background: linear-gradient(currentColor, currentColor) 0 calc(50% + .5em) / 0 1.5px no-repeat;
	transition: background-size .45s var(--agr-ease);
}
.agr .agr-pie-enl .elementor-icon-list-item:hover .elementor-icon-list-text,
.agr .agr-pie-enl a:focus-visible .elementor-icon-list-text { background-size: 100% 1.5px; }
.agr .agr-pie-enl .elementor-icon-list-item, .agr .agr-pie-enl .elementor-icon-list-item a { justify-content: center; }
.agr .agr-pie-enl .elementor-icon-list-text { white-space: nowrap; }
.agr .agr-pie-legal a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1.5px no-repeat; transition: background-size .45s var(--agr-ease); }
.agr .agr-pie-legal a:hover { background-size: 100% 1.5px; }

/* ---------- Animaciones de entrada (las de Elementor, más suaves) ---------- */
.agr .elementor-element.animated { animation-duration: 1.15s; animation-timing-function: var(--agr-ease); }
.agr .elementor-element.animated.animated-slow { animation-duration: 1.6s; }
.agr .elementor-element.animated.animated-fast { animation-duration: .8s; }
.agr .elementor-element.animated.fadeInUp { animation-name: agrSube; }
.agr .elementor-element.animated.fadeInLeft { animation-name: agrDesdeIzq; }
.agr .elementor-element.animated.fadeInRight { animation-name: agrDesdeDer; }
.agr .elementor-element.animated.zoomIn { animation-name: agrAparece; animation-timing-function: cubic-bezier(.34, 1.5, .64, 1); }
@keyframes agrSube { from { opacity: 0; transform: translate3d(0, 56px, 0); } to { opacity: 1; transform: none; } }
@keyframes agrDesdeIzq { from { opacity: 0; transform: translate3d(-16vw, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes agrDesdeDer { from { opacity: 0; transform: translate3d(28vw, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes agrAparece { from { opacity: 0; transform: scale(.45); } 55% { opacity: 1; } to { opacity: 1; transform: none; } }

/* Entrada de la cabecera al cargar (los retrasos pesan más que la regla de la animación: si no, el escalonado no se aplicaba) */
@keyframes agrBaja { from { opacity: 0; transform: translate3d(0, -20px, 0); } to { opacity: 1; transform: none; } }
body.agr:not(.elementor-editor-active) .agr-cab .agr-logo,
body.agr:not(.elementor-editor-active) .agr-cab .agr-burger-w { animation: agrBaja 1s var(--agr-ease) .15s both; }
body.agr:not(.elementor-editor-active) .agr-cab .agr-nav .elementor-icon-list-item { animation: agrBaja .9s var(--agr-ease) both; }
body.agr:not(.elementor-editor-active) .agr-cab .agr-nav-izq .elementor-icon-list-item:nth-child(1) { animation-delay: .25s; }
body.agr:not(.elementor-editor-active) .agr-cab .agr-nav-izq .elementor-icon-list-item:nth-child(2) { animation-delay: .32s; }
body.agr:not(.elementor-editor-active) .agr-cab .agr-nav-izq .elementor-icon-list-item:nth-child(3) { animation-delay: .39s; }
body.agr:not(.elementor-editor-active) .agr-cab .agr-nav-der .elementor-icon-list-item:nth-child(1) { animation-delay: .46s; }
body.agr:not(.elementor-editor-active) .agr-cab .agr-nav-der .elementor-icon-list-item:nth-child(2) { animation-delay: .53s; }
body.agr:not(.elementor-editor-active) .agr-cab .agr-nav-der .elementor-icon-list-item:nth-child(3) { animation-delay: .6s; }

/* Lo que entra animado parte de opacidad 0 y no de visibility:hidden: así sus enlaces se alcanzan con el teclado
   y los lectores de pantalla lo leen antes de que aparezca (al enfocarlo, se desplaza y entra con su animación) */
.agr .elementor-invisible { visibility: visible; opacity: 0; }

/* ---------- Accesibilidad y táctil ---------- */
.agr .agr-cab :focus-visible, .agr .agr-portada :focus-visible, .agr .agr-nosotros :focus-visible,
.agr .agr-cta :focus-visible, .agr-movil :focus-visible, .agr .agr-404 :focus-visible { outline-color: var(--agr-crema); }
/* En pantallas táctiles el «crece» se ve al pulsar y no se queda pegado después (solo táctiles de verdad: en ordenador, intacto) */
@media (hover: none) and (pointer: coarse) {
	.agr .elementor-animation-grow:hover, .agr .elementor-animation-grow:focus { transform: none; }
	.agr .elementor-animation-grow:active { transform: scale(1.1); }
}
/* Tableta y móvil (el PDF no tiene diseño para ellos): sin palabras sueltas al final de títulos y párrafos.
   El H1 en tableta no entra: ya corta como el PDF. Desde 1025 px nada cambia. */
@media (max-width: 1024px) {
	.agr .agr-h2 .elementor-heading-title { text-wrap: balance; }
	.agr .elementor-widget-text-editor p { text-wrap: pretty; }
}
@media (max-width: 767px) {
	.agr .elementor-heading-title { text-wrap: balance; }
}

/* ---------- Página sin diseño todavía (404) ---------- */
.agr-404 { display: flex; flex-direction: column; align-items: center; gap: 18px; padding: clamp(80px, 9vw, 160px) 24px; text-align: center; background: var(--agr-verde); color: var(--agr-crema); }
.agr-404 h1 { margin: 0; font-family: "Fjalla One", sans-serif; font-weight: 400; font-size: clamp(34px, 3.562vw, 68px); line-height: 1.2; text-transform: uppercase; color: var(--agr-crema); }
.agr-404 p { margin: 0; font-size: clamp(16px, 1.25vw, 22px); }
.agr-404 a { display: inline-block; margin-top: 10px; padding: 10px 26px; border-radius: 999px; background: var(--agr-crema); color: var(--agr-tierra); font-weight: 500; text-decoration: none; transition: transform .45s var(--agr-ease); }
.agr-404 a:hover { transform: scale(1.08); }

/* ---------- Páginas y entradas hechas sin Elementor (aviso legal, privacidad…) ---------- */
body.agr:not([class*="elementor-page-"]) .site-main { max-width: 900px; margin-inline: auto; padding: clamp(40px, 6vw, 80px) 20px; }
body.agr .site-main :is(h1, h2, h3) { font-family: "Fjalla One", sans-serif; font-weight: 400; line-height: 1.2; text-transform: uppercase; color: var(--agr-verde); }
body.agr .site-main a { color: var(--agr-verde); text-decoration: underline; text-underline-offset: .15em; }

/* ---------- En el editor de Elementor ---------- */
body.elementor-editor-active:not(.single-elementor_library) .agr-cab { pointer-events: none; }
.single-elementor_library .agr-cab { position: relative !important; background: var(--agr-verde); }

/* ---------- Menos movimiento si el usuario lo pide ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.agr *, .agr *::before, .agr *::after { animation-duration: .01ms !important; animation-delay: 0s !important; transition-duration: .01ms !important; }
	.agr .agr-w { opacity: 1 !important; }
}