/* ==========================================================================
   EUC Sanlúcar Club de Campo
   Sistema visual según el manual corporativo.
   ========================================================================== */

:root {
	/* Paleta del manual */
	--euc-turquesa: #4F8C8D;
	--euc-turquesa-osc: #3D6E6F;
	--euc-turquesa-cla: #E4EFEF;
	--euc-arena: #D6A27A;
	--euc-arena-cla: #F6EBE1;
	--euc-verde: #6F8A63;
	--euc-hueso: #F7F6F2;
	--euc-blanco: #FFFFFF;
	--euc-tinta: #2F3A40;
	--euc-tinta-sua: #61707A;
	--euc-linea: #E3E1DA;

	/* Tipografía fluida */
	--euc-display: clamp(2.6rem, 1.4rem + 4.2vw, 5.2rem);
	--euc-h2: clamp(1.9rem, 1.2rem + 2.2vw, 3rem);
	--euc-h3: clamp(1.15rem, 1rem + 0.6vw, 1.45rem);
	--euc-body: clamp(1rem, 0.96rem + 0.2vw, 1.09rem);

	/* Ritmo */
	--euc-seccion: clamp(4.5rem, 3rem + 6vw, 8.5rem);
	--euc-ancho: 1240px;
	--euc-radio: 14px;
	--euc-radio-sm: 10px;

	--euc-sombra: 0 1px 2px rgba(47, 58, 64, .04), 0 8px 28px rgba(47, 58, 64, .07);
	--euc-sombra-alta: 0 2px 4px rgba(47, 58, 64, .05), 0 18px 50px rgba(47, 58, 64, .12);
	--euc-ease: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }

body.euc {
	margin: 0;
	background: var(--euc-hueso);
	color: var(--euc-tinta);
	font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: var(--euc-body);
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}

body.euc h1, body.euc h2, body.euc h3, body.euc h4 {
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: -.02em;
	margin: 0;
	text-wrap: balance;
}

.euc-contenedor {
	width: min(100% - 2.5rem, var(--euc-ancho));
	margin-inline: auto;
}

.euc-seccion { padding-block: var(--euc-seccion); }

/* Antetítulo de sección --------------------------------------------------- */
.euc-ante {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	font-size: .74rem;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--euc-turquesa);
	margin-bottom: 1.1rem;
}
.euc-ante::before {
	content: '';
	width: 26px;
	height: 1px;
	background: var(--euc-arena);
}

.euc-entradilla {
	color: var(--euc-tinta-sua);
	max-width: 56ch;
	margin: 1.1rem 0 0;
}

/* Iconos ------------------------------------------------------------------ */
.euc-icono { width: 30px; height: 30px; display: block; }

/* Botones ----------------------------------------------------------------- */
.euc-btn {
	display: inline-flex;
	align-items: center;
	gap: .55rem;
	padding: .82rem 1.5rem;
	border-radius: 999px;
	font-size: .93rem;
	font-weight: 500;
	text-decoration: none;
	border: 1px solid transparent;
	transition: transform .35s var(--euc-ease), background-color .25s, color .25s, border-color .25s, box-shadow .35s var(--euc-ease);
}
.euc-btn:hover { transform: translateY(-2px); }
.euc-btn .euc-icono { width: 17px; height: 17px; }

.euc-btn--solido { background: var(--euc-turquesa); color: #fff; box-shadow: 0 4px 16px rgba(79, 140, 141, .28); }
.euc-btn--solido:hover { background: var(--euc-turquesa-osc); box-shadow: 0 10px 26px rgba(79, 140, 141, .34); }

.euc-btn--linea { background: rgba(255, 255, 255, .82); color: var(--euc-tinta); border-color: var(--euc-linea); backdrop-filter: blur(6px); }
.euc-btn--linea:hover { border-color: var(--euc-turquesa); color: var(--euc-turquesa); }

.euc-btn--claro { background: #fff; color: var(--euc-turquesa-osc); }
.euc-btn--claro:hover { background: var(--euc-hueso); }

/* Cabecera ---------------------------------------------------------------- */
.euc-cabecera {
	position: fixed;
	inset: 0 0 auto;
	z-index: 60;
	padding-block: 1.1rem;
	transition: background-color .4s var(--euc-ease), box-shadow .4s var(--euc-ease), padding .4s var(--euc-ease);
}
.euc-cabecera.esta-fija {
	background: rgba(255, 255, 255, .9);
	backdrop-filter: blur(14px);
	box-shadow: 0 1px 0 var(--euc-linea);
	padding-block: .7rem;
}
.euc-cabecera__fila { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }

.euc-marca { display: flex; align-items: center; gap: .8rem; text-decoration: none; color: inherit; }
.euc-marca__sello {
	width: 42px; height: 42px; flex: none;
	border-radius: 50%;
	background: linear-gradient(150deg, var(--euc-arena) 0%, var(--euc-arena) 42%, var(--euc-turquesa) 42%, var(--euc-turquesa) 100%);
	position: relative;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5);
}
.euc-marca__sello::after {
	content: '';
	position: absolute;
	inset: 52% 14% 16%;
	border-radius: 0 0 999px 999px / 0 0 100% 100%;
	background: var(--euc-verde);
	opacity: .85;
}
.euc-marca__texto { display: flex; flex-direction: column; line-height: 1.1; }
.euc-marca__nombre { font-weight: 700; font-size: 1.02rem; letter-spacing: -.01em; }
.euc-marca__sub { font-size: .63rem; letter-spacing: .17em; text-transform: uppercase; color: var(--euc-tinta-sua); }

.euc-nav { display: flex; align-items: center; gap: 2rem; }
.euc-nav a {
	position: relative;
	text-decoration: none;
	color: var(--euc-tinta);
	font-size: .9rem;
	font-weight: 500;
	padding-block: .3rem;
}
.euc-nav a::after {
	content: '';
	position: absolute;
	left: 0; bottom: 0;
	width: 100%; height: 1.5px;
	background: var(--euc-turquesa);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform .4s var(--euc-ease);
}
.euc-nav a:hover::after { transform: scaleX(1); transform-origin: left; }

@media (max-width: 1080px) { .euc-nav { display: none; } }

/* Hero -------------------------------------------------------------------- */
.euc-hero {
	position: relative;
	min-height: 100svh;
	display: flex;
	align-items: center;
	padding-top: 7rem;
	overflow: hidden;
	isolation: isolate;
}

/* Paisaje construido en CSS: cielo atlántico, agua del estuario y ribera.
   Sustituible por fotografía real cuando la Entidad la facilite. */
.euc-hero__fondo { position: absolute; inset: 0; z-index: -2; }
.euc-hero__cielo {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(120% 80% at 78% 8%, #FBF3E7 0%, rgba(251, 243, 231, 0) 55%),
		linear-gradient(178deg, #DCEBEC 0%, #EDF3EE 44%, var(--euc-hueso) 100%);
}
.euc-hero__sol {
	position: absolute;
	top: 14%; right: 16%;
	width: clamp(130px, 17vw, 250px);
	aspect-ratio: 1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(214, 162, 122, .5) 0%, rgba(214, 162, 122, .12) 55%, transparent 72%);
	filter: blur(2px);
}
.euc-hero__agua {
	position: absolute;
	inset: auto 0 0;
	height: 42%;
	background: linear-gradient(180deg, rgba(79, 140, 141, .16) 0%, rgba(79, 140, 141, .3) 100%);
	-webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%);
	mask-image: linear-gradient(180deg, transparent 0%, #000 22%);
}
.euc-hero__ribera {
	position: absolute;
	inset: auto 0 0;
	height: 26%;
	background: linear-gradient(180deg, rgba(111, 138, 99, .28) 0%, rgba(111, 138, 99, .06) 100%);
	clip-path: polygon(0 38%, 12% 30%, 27% 41%, 41% 26%, 58% 37%, 73% 24%, 88% 34%, 100% 27%, 100% 100%, 0 100%);
}
.euc-hero__velo { position: absolute; inset: 0; z-index: -1; background: linear-gradient(96deg, rgba(247, 246, 242, .93) 0%, rgba(247, 246, 242, .62) 38%, rgba(247, 246, 242, 0) 68%); }

.euc-hero__contenido { max-width: 44rem; }
.euc-hero h1 {
	font-size: var(--euc-display);
	font-weight: 700;
	letter-spacing: -.035em;
}
.euc-hero h1 .euc-linea { display: block; overflow: hidden; }
.euc-hero h1 .euc-linea > span { display: block; }
.euc-hero__acento { color: var(--euc-turquesa); }
.euc-hero__lema {
	font-size: clamp(1.05rem, .95rem + .5vw, 1.32rem);
	color: var(--euc-tinta-sua);
	margin: 1.5rem 0 0;
	max-width: 34ch;
}
.euc-hero__acciones { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2.4rem; }

.euc-hero__scroll {
	position: absolute;
	left: 50%; bottom: 2.2rem;
	transform: translateX(-50%);
	display: flex; flex-direction: column; align-items: center; gap: .6rem;
	font-size: .68rem; letter-spacing: .18em; text-transform: uppercase;
	color: var(--euc-tinta-sua);
}
.euc-hero__raya { width: 1px; height: 46px; background: linear-gradient(180deg, var(--euc-arena), transparent); }

/* Cifras ------------------------------------------------------------------ */
.euc-cifras { background: var(--euc-blanco); border-block: 1px solid var(--euc-linea); }
.euc-cifras__rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 1px;
	background: var(--euc-linea);
	border: 1px solid var(--euc-linea);
	border-radius: var(--euc-radio);
	overflow: hidden;
	margin-top: 2.8rem;
}
.euc-cifra {
	background: var(--euc-blanco);
	padding: 2.1rem 1.3rem;
	text-align: center;
	transition: background-color .4s var(--euc-ease);
}
.euc-cifra:hover { background: var(--euc-turquesa-cla); }
.euc-cifra .euc-icono { margin: 0 auto 1rem; color: var(--euc-turquesa); width: 27px; height: 27px; }
.euc-cifra__valor {
	font-size: clamp(1.6rem, 1.2rem + 1.3vw, 2.3rem);
	font-weight: 700;
	letter-spacing: -.03em;
	color: var(--euc-tinta);
	font-variant-numeric: tabular-nums;
}
.euc-cifra__prefijo { display: block; font-size: .72rem; font-weight: 500; color: var(--euc-tinta-sua); letter-spacing: .04em; }
.euc-cifra__label { font-size: .8rem; color: var(--euc-tinta-sua); margin-top: .3rem; }

/* Qué hacemos ------------------------------------------------------------- */
.euc-servicios__rejilla {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(238px, 1fr));
	gap: 1.4rem;
	margin-top: 3rem;
}
.euc-servicio {
	background: var(--euc-blanco);
	border: 1px solid var(--euc-linea);
	border-radius: var(--euc-radio);
	padding: 2rem 1.7rem;
	position: relative;
	overflow: hidden;
	transition: transform .5s var(--euc-ease), box-shadow .5s var(--euc-ease), border-color .5s;
}
.euc-servicio::before {
	content: '';
	position: absolute;
	inset: 0 0 auto;
	height: 3px;
	background: linear-gradient(90deg, var(--euc-turquesa), var(--euc-arena));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .55s var(--euc-ease);
}
.euc-servicio:hover { transform: translateY(-5px); box-shadow: var(--euc-sombra-alta); border-color: transparent; }
.euc-servicio:hover::before { transform: scaleX(1); }
.euc-servicio__icono {
	width: 52px; height: 52px;
	display: grid; place-items: center;
	border-radius: var(--euc-radio-sm);
	background: var(--euc-turquesa-cla);
	color: var(--euc-turquesa);
	margin-bottom: 1.3rem;
}
.euc-servicio h3 { font-size: var(--euc-h3); margin-bottom: .6rem; }
.euc-servicio p { color: var(--euc-tinta-sua); font-size: .93rem; margin: 0; }

/* Actualidad + Transparencia ---------------------------------------------- */
.euc-doble {
	display: grid;
	grid-template-columns: 1.55fr 1fr;
	gap: clamp(2rem, 4vw, 4rem);
	align-items: start;
}
@media (max-width: 940px) { .euc-doble { grid-template-columns: 1fr; } }

.euc-noticias { display: grid; gap: 1.2rem; margin-top: 2.2rem; }
.euc-noticia {
	display: grid;
	grid-template-columns: 116px 1fr;
	gap: 1.4rem;
	align-items: center;
	background: var(--euc-blanco);
	border: 1px solid var(--euc-linea);
	border-radius: var(--euc-radio);
	padding: 1rem;
	text-decoration: none;
	color: inherit;
	transition: transform .45s var(--euc-ease), box-shadow .45s var(--euc-ease);
}
.euc-noticia:hover { transform: translateX(5px); box-shadow: var(--euc-sombra); }
.euc-noticia__foto {
	aspect-ratio: 4 / 3;
	border-radius: var(--euc-radio-sm);
	overflow: hidden;
	background: var(--euc-turquesa-cla);
}
.euc-noticia__foto img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s var(--euc-ease); }
.euc-noticia:hover .euc-noticia__foto img { transform: scale(1.06); }
.euc-noticia__fecha { font-size: .68rem; letter-spacing: .13em; text-transform: uppercase; color: var(--euc-arena); font-weight: 600; }
.euc-noticia h3 { font-size: 1.03rem; margin: .35rem 0 .3rem; }
.euc-noticia p { font-size: .87rem; color: var(--euc-tinta-sua); margin: 0; }
@media (max-width: 520px) { .euc-noticia { grid-template-columns: 1fr; } .euc-noticia__foto { aspect-ratio: 16/9; } }

.euc-transparencia { background: var(--euc-arena-cla); border-radius: var(--euc-radio); padding: 2rem 1.8rem; }
.euc-transparencia__lista { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin-top: 1.6rem; }
.euc-doc {
	display: flex; align-items: center; gap: .7rem;
	background: rgba(255, 255, 255, .74);
	border-radius: var(--euc-radio-sm);
	padding: .85rem .9rem;
	font-size: .84rem;
	font-weight: 500;
	text-decoration: none;
	color: var(--euc-tinta);
	transition: background-color .3s, transform .4s var(--euc-ease);
}
.euc-doc:hover { background: #fff; transform: translateY(-2px); }
.euc-doc .euc-icono { width: 19px; height: 19px; color: var(--euc-arena); flex: none; }
@media (max-width: 400px) { .euc-transparencia__lista { grid-template-columns: 1fr; } }

/* Portal del propietario -------------------------------------------------- */
.euc-portal {
	background: linear-gradient(140deg, var(--euc-turquesa-osc) 0%, var(--euc-turquesa) 62%, #5E9B94 100%);
	border-radius: var(--euc-radio);
	color: #fff;
	padding: clamp(2.4rem, 4vw, 3.6rem);
	position: relative;
	overflow: hidden;
}
.euc-portal::after {
	content: '';
	position: absolute;
	right: -8%; bottom: -42%;
	width: 46%; aspect-ratio: 1;
	border-radius: 50%;
	background: rgba(255, 255, 255, .07);
}
.euc-portal__cuerpo { position: relative; display: grid; grid-template-columns: 1.1fr 1fr; gap: 2.6rem; align-items: center; }
@media (max-width: 880px) { .euc-portal__cuerpo { grid-template-columns: 1fr; } }
.euc-portal h2 { font-size: var(--euc-h2); color: #fff; }
.euc-portal p { color: rgba(255, 255, 255, .84); margin: 1rem 0 0; }
.euc-portal .euc-ante { color: rgba(255, 255, 255, .78); }
.euc-portal .euc-ante::before { background: rgba(255, 255, 255, .55); }
.euc-portal__ventajas { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem 1.4rem; margin: 1.8rem 0 0; padding: 0; list-style: none; }
.euc-portal__ventajas li { display: flex; align-items: center; gap: .55rem; font-size: .88rem; color: rgba(255, 255, 255, .92); }
.euc-portal__ventajas li::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--euc-arena); flex: none; }
@media (max-width: 520px) { .euc-portal__ventajas { grid-template-columns: 1fr; } }
.euc-portal__tarjeta {
	background: rgba(255, 255, 255, .12);
	border: 1px solid rgba(255, 255, 255, .2);
	border-radius: var(--euc-radio);
	padding: 1.8rem;
	backdrop-filter: blur(8px);
}
.euc-portal__tarjeta .euc-icono { width: 34px; height: 34px; color: #fff; margin-bottom: 1rem; }
.euc-portal__tarjeta h3 { color: #fff; font-size: 1.15rem; }
.euc-portal__tarjeta p { font-size: .88rem; margin-bottom: 1.5rem; }

/* Entorno: galería horizontal --------------------------------------------- */
.euc-entorno { overflow: hidden; }
.euc-galeria {
	display: flex;
	gap: 1.1rem;
	margin-top: 3rem;
	padding-inline: max(1.25rem, calc((100vw - var(--euc-ancho)) / 2));
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding-bottom: .5rem;
}
.euc-galeria::-webkit-scrollbar { display: none; }
.euc-galeria__pieza {
	flex: 0 0 clamp(230px, 27vw, 340px);
	aspect-ratio: 4 / 3;
	border-radius: var(--euc-radio);
	overflow: hidden;
	scroll-snap-align: center;
	background: var(--euc-turquesa-cla);
	position: relative;
}
.euc-galeria__pieza img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s var(--euc-ease); }
.euc-galeria__pieza:hover img { transform: scale(1.05); }
.euc-entorno__pie { text-align: center; color: var(--euc-tinta-sua); font-size: .9rem; margin-top: 2rem; }

/* Pie --------------------------------------------------------------------- */
.euc-pie { background: var(--euc-turquesa-osc); color: rgba(255, 255, 255, .82); padding-block: clamp(3rem, 5vw, 4.5rem) 2rem; }
.euc-pie__rejilla { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 2.6rem; }
@media (max-width: 820px) { .euc-pie__rejilla { grid-template-columns: 1fr; } }
.euc-pie h4 { color: #fff; font-size: .78rem; letter-spacing: .15em; text-transform: uppercase; margin-bottom: 1.1rem; }
.euc-pie a { color: rgba(255, 255, 255, .82); text-decoration: none; transition: color .25s; }
.euc-pie a:hover { color: #fff; }
.euc-pie ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; font-size: .89rem; }
.euc-pie__dato { display: flex; gap: .6rem; align-items: flex-start; font-size: .89rem; margin-bottom: .55rem; }
.euc-pie__dato .euc-icono { width: 17px; height: 17px; flex: none; margin-top: .22rem; color: var(--euc-arena); }
.euc-pie .euc-marca__nombre, .euc-pie .euc-marca__sub { color: #fff; }
.euc-pie__legal {
	margin-top: 3rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, .16);
	display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem;
	font-size: .8rem;
	color: rgba(255, 255, 255, .6);
}

/* Animación --------------------------------------------------------------- */
.euc-anim { opacity: 0; transform: translateY(26px); }

/* El manual pide accesibilidad: sin movimiento si el sistema lo desaconseja. */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
	.euc-anim { opacity: 1 !important; transform: none !important; }
	html { scroll-behavior: auto; }
}

/* Foco visible en todo lo interactivo */
body.euc :is(a, button):focus-visible {
	outline: 2px solid var(--euc-turquesa);
	outline-offset: 3px;
	border-radius: 4px;
}
