/*
 * Colegio Yaxkin · Sitio 1.0.0 · Sistema visual «Amanecer»: papel recortado con sombras duras, el sol del logo
 * saliendo detrás de las colinas (yax = lo verde, lo nuevo) y los colores de la marca.
 * Un sistema desarrollado por CISTI.
 */

/* ------------------------------------------------------------------ Tipografías (locales) */
@font-face { font-family: 'Lilita One'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/lilita-one-latin-400-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Lilita One'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/lilita-one-latin-ext-400-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200 1000; font-display: swap; src: url('../fonts/nunito-latin-wght-normal.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Nunito'; font-style: normal; font-weight: 200 1000; font-display: swap; src: url('../fonts/nunito-latin-ext-wght-normal.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* ------------------------------------------------------------------ Tokens */
:root {
	--tinta: #1F2150;
	--tinta-2: #55587A;
	--linea: #D3DEEE;
	--magenta: #D6007A;
	--magenta-texto: #B8006A;
	--cian: #009FE0;
	--cian-texto: #00669A;
	--rojo: #E30613;
	--amarillo: #FFE600;
	--sol: #FFC81E;
	--verde: #2BA84A;
	--verde-texto: #1B7A36;
	--cielo: #E6F5FF;
	--alba: #FFF3C4;
	--papel: #FFFFFF;
	--sombra: 6px 7px 0 rgba(31, 33, 80, .16);
	--sombra-g: 10px 12px 0 rgba(31, 33, 80, .14);
	--f-display: 'Lilita One', 'Nunito', system-ui, sans-serif;
	--f-texto: 'Nunito', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* ------------------------------------------------------------------ Base */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; }
body { margin: 0; font-family: var(--f-texto); font-size: 17px; line-height: 1.6; color: var(--tinta); background: var(--papel); -webkit-font-smoothing: antialiased; }
@media (min-width: 768px) { body { font-size: 18px; } }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--cian-texto); text-underline-offset: .15em; }
a:hover { color: var(--magenta-texto); }
p { margin: 0 0 1em; max-width: 68ch; }
:focus-visible { outline: 3px solid var(--magenta); outline-offset: 3px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
}

.yx-wrap { width: 100%; max-width: 1180px; margin: 0 auto; padding: 0 20px; }
@media (min-width: 768px) { .yx-wrap { padding: 0 32px; } }
.yx-oculto { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.yx-saltar { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--tinta); color: #fff; padding: 10px 16px; border-radius: 10px; font-weight: 800; }
.yx-saltar:focus { top: 12px; color: #fff; }
.yx-i { width: 1.25em; height: 1.25em; flex: none; }

/* ------------------------------------------------------------------ Tipografía */
.yx-h1 { font-family: var(--f-display); font-weight: 400; font-size: clamp(2.55rem, 6.4vw, 4.75rem); line-height: 1.02; letter-spacing: .004em; color: var(--magenta); margin: 0 0 .32em; text-wrap: balance; }
.yx-h2 { font-family: var(--f-display); font-weight: 400; font-size: clamp(2.1rem, 4.6vw, 3.3rem); line-height: 1.04; color: var(--tinta); margin: 0 0 .5em; text-wrap: balance; }
.yx-h3 { font-family: var(--f-display); font-weight: 400; font-size: 1.6rem; line-height: 1.12; margin: 0 0 .55em; }
.yx-lead { font-size: 1.14em; line-height: 1.55; color: var(--tinta-2); max-width: 38em; }
.yx-recorte {
	--g: .05em;
	text-shadow:
		calc(var(--g) * -1) calc(var(--g) * -1) 0 #fff, 0 calc(var(--g) * -1) 0 #fff, var(--g) calc(var(--g) * -1) 0 #fff,
		calc(var(--g) * -1) 0 0 #fff, var(--g) 0 0 #fff,
		calc(var(--g) * -1) var(--g) 0 #fff, 0 var(--g) 0 #fff, var(--g) var(--g) 0 #fff,
		calc(var(--g) + .035em) calc(var(--g) + .045em) 0 var(--tinta);
}

/* ------------------------------------------------------------------ Botones */
.yx-btn { display: inline-flex; align-items: center; gap: .55em; padding: .78em 1.25em; border-radius: 999px; border: 2px solid transparent; font: inherit; font-weight: 800; font-size: 1rem; line-height: 1.2; text-decoration: none; cursor: pointer; box-shadow: 4px 5px 0 rgba(31, 33, 80, .2); transition: transform .14s ease, box-shadow .14s ease; }
.yx-btn:hover { transform: translate(-1px, -1px); box-shadow: 5px 6px 0 rgba(31, 33, 80, .22); }
.yx-btn:active { transform: translate(2px, 2px); box-shadow: 2px 2px 0 rgba(31, 33, 80, .2); }
.yx-btn[disabled] { opacity: .65; cursor: progress; transform: none; }
.yx-btn--primario { background: var(--magenta); color: #fff; }
.yx-btn--primario:hover { color: #fff; }
.yx-btn--wa { background: var(--verde-texto); color: #fff; }
.yx-btn--wa:hover { color: #fff; }
.yx-btn--claro { background: #fff; color: var(--tinta); border-color: var(--linea); }
.yx-btn--claro:hover { color: var(--tinta); }
.yx-btn--grande { font-size: 1.06rem; padding: .92em 1.4em; }
.yx-btn--bloque { width: 100%; justify-content: center; }

/* ------------------------------------------------------------------ Encabezado */
.yx-top { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--linea); }
.yx-top__in { display: flex; align-items: center; gap: 14px; min-height: 70px; }
.yx-top__logo { display: block; flex: none; }
.yx-top__logo img { height: 48px; width: auto; }
.yx-top__nombre { font-family: var(--f-display); font-size: 1.6rem; color: var(--magenta); }
.yx-top__acciones { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.yx-top__wa { padding: .62em 1em; }
.yx-menu { width: 46px; height: 46px; display: grid; place-items: center; border: 2px solid var(--linea); border-radius: 14px; background: #fff; color: var(--tinta); cursor: pointer; }
.yx-menu .yx-i { width: 26px; height: 26px; }
.yx-menu__cerrar, .yx-menu[aria-expanded="true"] .yx-menu__abrir { display: none; }
.yx-menu[aria-expanded="true"] .yx-menu__cerrar { display: block; }
.yx-nav { display: none; }
.yx-nav.is-abierto { display: block; position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--linea); padding: 8px 20px 20px; box-shadow: 0 14px 0 rgba(31, 33, 80, .06); }
.yx-nav ul { list-style: none; margin: 0; padding: 0; }
.yx-nav li a { display: block; padding: 14px 6px; color: var(--tinta); font-weight: 800; text-decoration: none; border-bottom: 1px dashed var(--linea); }
.yx-nav__cta { margin-top: 16px; width: 100%; justify-content: center; }
@media (max-width: 420px) {
	.yx-top__logo img { height: 42px; }
	.yx-top__wa span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.yx-top__wa { padding: .62em; }
}
@media (min-width: 1080px) {
	.yx-top__in { min-height: 78px; }
	.yx-top__logo img { height: 54px; }
	.yx-menu { display: none; }
	.yx-nav, .yx-nav.is-abierto { display: flex; align-items: center; gap: 6px; position: static; padding: 0; border: 0; box-shadow: none; margin-left: auto; }
	.yx-nav ul { display: flex; gap: 2px; }
	.yx-nav li a { padding: .5em .8em; border: 0; border-radius: 999px; }
	.yx-nav li a:hover { background: var(--cielo); }
	.yx-nav__cta { margin: 0 0 0 6px; width: auto; }
	.yx-top__acciones { margin-left: 0; }
}

/* ------------------------------------------------------------------ Portada (el amanecer) */
.yx-hero { position: relative; overflow: hidden; background: linear-gradient(180deg, #BFE6FF 0%, #D9F1FF 44%, #FFF3C4 80%, #FFE7A1 100%); padding: 44px 0 190px; }
.yx-hero__cielo { position: absolute; inset: 0; pointer-events: none; }
.yx-hero__colinas { position: absolute; left: 0; bottom: 0; width: 100%; height: 150px; }
.yx-hero__sol { position: absolute; width: 330px; right: -60px; bottom: 10px; animation: yx-amanecer 1.9s cubic-bezier(.2, .75, .2, 1) .1s both; }
.yx-nube { position: absolute; height: auto; }
.yx-nube--1 { width: 130px; top: 6%; right: 8%; }
.yx-nube--2 { width: 92px; top: 30%; right: 42%; display: none; }
.yx-nube--3 { width: 110px; bottom: 150px; left: -24px; }
@keyframes yx-amanecer { from { transform: translateY(26%) rotate(-14deg); } to { transform: translateY(0) rotate(0); } }
.yx-hero__in { position: relative; z-index: 2; display: grid; gap: 28px; align-items: center; }
.yx-promo { margin: 0 0 18px; }
.yx-promo a { display: inline-flex; align-items: center; gap: .5em; background: #fff; color: var(--magenta-texto); font-weight: 900; font-size: .95rem; line-height: 1.3; padding: .5em 1.05em .5em .75em; border-radius: 999px; text-decoration: none; box-shadow: var(--sombra); }
.yx-promo .yx-i { color: var(--sol); width: 1.4em; height: 1.4em; }
.yx-hero .yx-lead { color: var(--tinta); }
.yx-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 1.5em 0 1.4em; }
.yx-hero__datos { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font-weight: 800; }
.yx-hero__datos li { display: flex; align-items: center; gap: .45em; }
.yx-hero__datos .yx-i { color: var(--magenta-texto); }
.yx-hero__fotos { display: none; }
.yx-polaroid { position: absolute; margin: 0; background: #fff; padding: 10px 10px 4px; border-radius: 8px; box-shadow: 9px 11px 0 rgba(31, 33, 80, .18); }
.yx-polaroid img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; }
.yx-polaroid figcaption { text-align: center; font-weight: 800; font-size: .92rem; padding: 6px 0 4px; }
.yx-polaroid--a { width: 70%; top: 0; right: 0; transform: rotate(3deg); }
.yx-polaroid--b { width: 56%; top: 60%; left: 0; transform: rotate(-4deg); }
@media (min-width: 640px) {
	.yx-hero__sol { width: 420px; right: -40px; bottom: 20px; }
	.yx-nube--2 { display: block; }
}
@media (min-width: 960px) {
	.yx-hero { padding: 64px 0 210px; }
	.yx-hero__in { grid-template-columns: 1.1fr .9fr; gap: 48px; }
	.yx-hero__fotos { display: block; position: relative; min-height: 470px; }
	.yx-hero__sol { width: 560px; right: auto; left: 52%; bottom: -10px; }
	.yx-hero__colinas { height: 190px; }
	.yx-nube--1 { top: 9%; right: 3%; width: 150px; }
	.yx-nube--2 { top: 6%; right: auto; left: 44%; width: 100px; }
	.yx-nube--3 { bottom: 200px; left: 2%; }
}

/* ------------------------------------------------------------------ Secciones */
.yx-sec { padding: 72px 0; }
@media (min-width: 960px) { .yx-sec { padding: 96px 0; } }

/* Niveles */
.yx-niveles { padding-top: 64px; }
.yx-niveles__grid { display: grid; gap: 28px; }
@media (min-width: 820px) { .yx-niveles__grid { grid-template-columns: 1fr 1fr; gap: 36px; } }
.yx-nivel { position: relative; overflow: hidden; border-radius: 30px; padding: 30px 30px 30px; color: var(--tinta); box-shadow: 11px 13px 0 rgba(31, 33, 80, .17); }
.yx-nivel--cian { background: var(--cian); }
.yx-nivel--verde { background: var(--verde); }
.yx-nivel::after { content: ''; position: absolute; width: 260px; height: 260px; right: -70px; bottom: -110px; border-radius: 50%; background: rgba(255, 255, 255, .16); }
.yx-nivel__t { font-family: var(--f-display); font-weight: 400; font-size: clamp(2.6rem, 6vw, 3.6rem); line-height: 1; margin: 0 0 .18em; color: #fff; text-shadow: 3px 4px 0 var(--tinta); }
.yx-nivel__edad { font-weight: 900; font-size: 1.16rem; margin-bottom: .6em; }
.yx-nivel__txt { font-weight: 700; }
.yx-nivel__link { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .45em; background: #fff; color: var(--tinta); font-weight: 900; text-decoration: none; padding: .62em 1.05em; border-radius: 999px; box-shadow: 4px 5px 0 rgba(31, 33, 80, .22); }
.yx-nivel__link .yx-i { color: var(--verde-texto); }
.yx-nivel__link:hover { color: var(--magenta-texto); }

/* Un día en Yaxkin */
.yx-dia { background: linear-gradient(180deg, #FFFFFF 0%, var(--cielo) 100%); overflow: hidden; }
.yx-dia__escena { display: none; }
.yx-dia__lista { list-style: none; margin: 8px 0 0; padding: 0 0 0 30px; position: relative; display: grid; gap: 18px; }
.yx-dia__lista::before { content: ''; position: absolute; left: 10px; top: 12px; bottom: 12px; border-left: 4px dotted var(--sol); }
.yx-dia__lista li { position: relative; display: grid; gap: 0; }
.yx-dia__lista li::before { content: ''; position: absolute; left: -31px; top: 6px; width: 22px; height: 22px; border-radius: 50%; background: var(--sol); border: 4px solid #fff; box-shadow: 3px 4px 0 rgba(31, 33, 80, .16); }
.yx-dia__hora { font-family: var(--f-display); font-size: 1.55rem; line-height: 1.2; }
.yx-dia__que { font-weight: 800; color: var(--tinta-2); }
@media (min-width: 900px) {
	.yx-dia__escena { display: block; position: relative; margin: 10px auto 0; max-width: 1000px; }
	.yx-arco { display: block; width: 100%; height: auto; overflow: visible; }
	.yx-arco__hora { font-family: var(--f-display); font-size: 31px; fill: var(--tinta); }
	.yx-arco__que { font-family: var(--f-texto); font-weight: 800; font-size: 21px; fill: var(--tinta-2); }
	.yx-dia__sol { position: absolute; width: 23%; left: 38.5%; bottom: -21%; }
	.yx-dia__lista { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.yx-dia__lead { margin-bottom: 0; }
}

/* Servicios */
.yx-servicios__lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 30px 34px; }
@media (min-width: 680px) { .yx-servicios__lista { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1000px) { .yx-servicios__lista { grid-template-columns: repeat(3, 1fr); } }
.yx-servicio { display: grid; grid-template-columns: 66px 1fr; column-gap: 18px; align-items: start; }
.yx-servicio__ic { grid-row: span 2; width: 66px; height: 66px; border-radius: 20px; background: var(--alba); display: grid; place-items: center; color: var(--tinta); box-shadow: 5px 6px 0 rgba(31, 33, 80, .12); transform: rotate(-3deg); }
.yx-servicio:nth-child(even) .yx-servicio__ic { transform: rotate(3deg); background: var(--cielo); }
.yx-servicio__ic .yx-i { width: 34px; height: 34px; }
.yx-servicio__t { font-family: var(--f-texto); font-weight: 900; font-size: 1.16rem; line-height: 1.25; margin: 6px 0 4px; }
.yx-servicio p { margin: 0; color: var(--tinta-2); }

/* Nosotros */
.yx-acerca { background: var(--cielo); }
.yx-acerca__in { display: grid; gap: 36px; align-items: center; }
@media (min-width: 900px) { .yx-acerca__in { grid-template-columns: 1.1fr .9fr; gap: 56px; } }
.yx-acerca__texto p { color: var(--tinta-2); }
.yx-desde { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; width: 136px; height: 136px; border-radius: 50%; background: var(--amarillo); text-align: center; box-shadow: 6px 7px 0 rgba(31, 33, 80, .2); transform: rotate(-8deg); margin: 0 0 22px; padding: 14px; }
.yx-desde span { font-weight: 900; font-size: .8rem; line-height: 1.12; max-width: 96px; }
.yx-desde strong { font-family: var(--f-display); font-weight: 400; font-size: 2.3rem; line-height: 1; color: var(--magenta-texto); }
.yx-papel { background: #fff; border-radius: 28px; padding: 28px; box-shadow: var(--sombra-g); }
@media (min-width: 768px) { .yx-papel { padding: 36px; } }
.yx-check { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.yx-check li { display: flex; gap: 12px; align-items: flex-start; font-weight: 800; line-height: 1.4; }
.yx-check .yx-i { color: var(--verde-texto); width: 27px; height: 27px; margin-top: -1px; }

/* Galería */
.yx-galeria__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
/* La rejilla siempre queda completa, sin huecos al final, tenga las fotos que tenga (consultas por cantidad). */
@media (max-width: 759px) {
	.yx-galeria__grid li:first-child:nth-last-child(2n+1) { grid-column: 1 / -1; }
	.yx-galeria__grid li:first-child:nth-last-child(2n+1) img { aspect-ratio: 16 / 9; }
}
@media (min-width: 760px) and (max-width: 1039px) {
	.yx-galeria__grid { grid-template-columns: repeat(3, 1fr); gap: 18px; }
	.yx-galeria__grid li:first-child:nth-last-child(3n+1) { grid-column: 1 / -1; }
	.yx-galeria__grid li:first-child:nth-last-child(3n+1) img { aspect-ratio: 21 / 9; }
	.yx-galeria__grid li:last-child:nth-child(3n+2) { grid-column: span 2; }
	.yx-galeria__grid li:last-child:nth-child(3n+2) img { aspect-ratio: 8 / 3; }
}
@media (min-width: 1040px) {
	.yx-galeria__grid { grid-template-columns: repeat(4, 1fr); gap: 18px; }
	.yx-galeria__grid li:first-child { grid-column: span 2; grid-row: span 2; }
	.yx-galeria__grid li:first-child:nth-last-child(4n+2) { grid-column: auto; grid-row: auto; }
	.yx-galeria__grid li:nth-last-child(2):nth-child(4n+2), .yx-galeria__grid li:last-child:nth-child(4n+3), .yx-galeria__grid li:last-child:nth-child(4n+4), .yx-galeria__grid li:first-child:nth-last-child(4n+2) ~ li:nth-last-child(-n+2) { grid-column: span 2; }
	.yx-galeria__grid li:nth-last-child(2):nth-child(4n+2) img, .yx-galeria__grid li:last-child:nth-child(4n+3) img, .yx-galeria__grid li:last-child:nth-child(4n+4) img, .yx-galeria__grid li:first-child:nth-last-child(4n+2) ~ li:nth-last-child(-n+2) img { aspect-ratio: 8 / 3; }
}
.yx-galeria__item { display: block; height: 100%; background: #fff; padding: 6px; border-radius: 18px; box-shadow: 6px 7px 0 rgba(31, 33, 80, .14); overflow: hidden; }
.yx-galeria__item img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 13px; transition: transform .35s ease; }
.yx-galeria__item:hover img { transform: scale(1.035); }
.yx-visor { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100%; height: 100%; }
.yx-visor::backdrop { background: rgba(14, 15, 40, .9); }
.yx-visor__fig { margin: 0; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 64px 16px 24px; }
.yx-visor__fig img { max-width: min(1100px, 100%); max-height: calc(100vh - 140px); width: auto; border-radius: 12px; background: #fff; padding: 6px; }
.yx-visor__fig figcaption { color: #fff; font-weight: 800; margin-top: 12px; text-align: center; }
.yx-visor__btn { position: fixed; width: 52px; height: 52px; border-radius: 50%; border: 0; background: #fff; color: var(--tinta); display: grid; place-items: center; cursor: pointer; box-shadow: 4px 5px 0 rgba(0, 0, 0, .3); }
.yx-visor__btn svg { width: 28px; height: 28px; }
.yx-visor__cerrar { top: 14px; right: 14px; }
.yx-visor__ant { left: 14px; top: 50%; transform: translateY(-50%); }
.yx-visor__sig { right: 14px; top: 50%; transform: translateY(-50%); }

/* Informes */
.yx-informes { background: linear-gradient(180deg, var(--alba) 0%, #FFF9E6 100%); }
.yx-informes__in { display: grid; gap: 34px; align-items: start; }
@media (min-width: 960px) { .yx-informes__in { grid-template-columns: .85fr 1.15fr; gap: 56px; } .yx-informes__texto { position: sticky; top: 110px; } }
.yx-informes__botones { display: flex; flex-wrap: wrap; gap: 12px; margin: 6px 0 18px; }
.yx-nota { display: flex; gap: .5em; align-items: center; font-weight: 800; color: var(--tinta-2); }
.yx-nota .yx-i { color: var(--magenta-texto); }
.yx-form { display: grid; grid-template-columns: 1fr; gap: 16px 18px; }
@media (min-width: 620px) { .yx-form { grid-template-columns: 1fr 1fr; } }
.yx-form > *, .yx-campo { grid-column: 1 / -1; min-width: 0; }
@media (min-width: 620px) { .yx-campo--mitad { grid-column: auto; } }
.yx-form .yx-h3 { margin-bottom: 0; }
.yx-form__nota { margin: 0; font-size: .9rem; color: var(--tinta-2); }
.yx-campo label, .yx-opciones legend { display: block; font-weight: 800; font-size: .96rem; margin-bottom: 6px; }
.yx-campo input[type="text"], .yx-campo input[type="tel"], .yx-campo input[type="email"], .yx-campo select, .yx-campo textarea { width: 100%; min-height: 50px; font: inherit; font-size: 1rem; color: var(--tinta); background: #fff; border: 2px solid #C5D3E8; border-radius: 14px; padding: .7em .9em; }
.yx-campo textarea { min-height: 96px; resize: vertical; }
.yx-campo input:focus, .yx-campo select:focus, .yx-campo textarea:focus { outline: 3px solid rgba(0, 159, 224, .28); outline-offset: 0; border-color: var(--cian); }
.yx-campo [aria-invalid="true"] { border-color: var(--rojo); }
.yx-campo__error { margin: 6px 0 0; color: #B4000F; font-weight: 800; font-size: .92rem; }
.yx-campo__error:empty { display: none; }
.yx-campo--trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.yx-opciones { border: 0; padding: 0; margin: 0; }
.yx-opciones .yx-opcion { display: inline-flex; align-items: center; gap: 8px; border: 2px solid #C5D3E8; border-radius: 999px; padding: .5em 1.05em .5em .8em; margin: 0 8px 8px 0; font-weight: 800; cursor: pointer; background: #fff; }
.yx-opcion input { width: 20px; height: 20px; accent-color: var(--magenta); margin: 0; }
.yx-opcion:has(input:checked) { border-color: var(--magenta); background: #FFF0F7; color: var(--magenta-texto); }
.yx-campo .yx-acepto { display: flex; gap: 10px; align-items: flex-start; font-weight: 700 !important; }
.yx-acepto input { width: 22px; height: 22px; margin-top: 2px; accent-color: var(--magenta); flex: none; }
.yx-error-general { background: #FFE9EC; color: #8A0010; border-radius: 14px; padding: 12px 16px; font-weight: 800; }
.yx-gracias { text-align: center; padding: 10px 0; }
.yx-gracias:focus { outline: none; }
.yx-gracias__ic { width: 68px; height: 68px; color: var(--verde-texto); margin: 0 auto 10px; }
.yx-gracias p { margin-left: auto; margin-right: auto; }

/* Preguntas */
.yx-faq__in { display: grid; gap: 20px; }
@media (min-width: 900px) { .yx-faq__in { grid-template-columns: .75fr 1.25fr; gap: 56px; } }
.yx-faq__item { border-bottom: 2px dashed #C5D3E8; }
.yx-faq__item summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 4px; font-weight: 900; font-size: 1.08rem; line-height: 1.35; }
.yx-faq__item summary::-webkit-details-marker { display: none; }
.yx-faq__item summary .yx-i { color: var(--magenta-texto); transition: transform .2s ease; }
.yx-faq__item[open] summary .yx-i { transform: rotate(180deg); }
.yx-faq__r { padding: 0 4px 16px; color: var(--tinta-2); }

/* Contacto */
.yx-contacto { background: var(--cielo); }
.yx-contacto__in { display: grid; gap: 36px; }
@media (min-width: 900px) { .yx-contacto__in { grid-template-columns: 1fr 1fr; gap: 56px; align-items: stretch; } }
.yx-datos { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
.yx-datos li { display: flex; gap: 14px; align-items: flex-start; }
.yx-datos strong { display: block; font-weight: 900; }
.yx-datos span:not(.yx-datos__ic) { display: block; color: var(--tinta-2); }
.yx-datos a { display: inline-flex; align-items: center; gap: .3em; font-weight: 800; }
.yx-datos a .yx-i { width: 1em; height: 1em; }
.yx-datos__ic { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; color: #fff; flex: none; box-shadow: 3px 4px 0 rgba(31, 33, 80, .15); }
.yx-datos__ic .yx-i { width: 24px; height: 24px; }
.yx-datos__ic--magenta { background: var(--magenta); }
.yx-datos__ic--sol { background: var(--sol); color: var(--tinta); }
.yx-datos__ic--wa { background: var(--verde-texto); }
.yx-datos__ic--cian { background: var(--cian-texto); }
.yx-datos__ic--tinta { background: var(--tinta); }
.yx-mapa { position: relative; border-radius: 28px; overflow: hidden; box-shadow: var(--sombra-g); min-height: 380px; background: repeating-linear-gradient(32deg, rgba(31, 33, 80, .05) 0 2px, transparent 2px 46px), repeating-linear-gradient(-58deg, rgba(31, 33, 80, .05) 0 2px, transparent 2px 64px), linear-gradient(160deg, #DDF0E0 0%, #D6E6F4 100%); }
.yx-mapa__portada { position: absolute; inset: 0; display: grid; align-content: center; justify-items: center; gap: 12px; padding: 28px; text-align: center; }
.yx-mapa__pin { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--magenta); color: #fff; box-shadow: var(--sombra); }
.yx-mapa__pin .yx-i { width: 32px; height: 32px; }
.yx-mapa__dir { margin: 0; font-weight: 800; max-width: 30ch; }
.yx-mapa__abrir { font-weight: 800; }
.yx-mapa__nota { margin: 0; font-size: .86rem; color: var(--tinta-2); }
.yx-mapa iframe { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; background: #fff; }
.yx-mapa.is-cargado .yx-mapa__portada { visibility: hidden; }

/* ------------------------------------------------------------------ Pie */
.yx-pie { background: var(--tinta); color: #E8E9F7; padding: 60px 0 96px; }
@media (min-width: 1080px) { .yx-pie { padding-bottom: 28px; } }
.yx-pie__in { display: grid; gap: 32px; }
@media (min-width: 900px) { .yx-pie__in { grid-template-columns: 1.3fr 1fr 1fr; gap: 48px; } }
.yx-pie__marca img { width: 250px; height: auto; margin-bottom: 14px; }
.yx-pie__lema { font-weight: 800; color: #fff; }
.yx-pie__filial { color: #C9CBE8; font-size: .95rem; }
.yx-pie__t { font-family: var(--f-display); font-weight: 400; font-size: 1.35rem; color: var(--amarillo); margin: 0 0 .35em; }
.yx-pie__col p { color: #E8E9F7; }
.yx-pie__lista { list-style: none; margin: 0 0 18px; padding: 0; display: grid; gap: 10px; }
.yx-pie__lista a { display: inline-flex; align-items: center; gap: .5em; color: #fff; font-weight: 700; text-decoration: none; word-break: break-word; }
.yx-pie__lista a:hover, .yx-pie__legal a:hover { text-decoration: underline; color: #fff; }
.yx-redes { list-style: none; margin: 0; padding: 0; display: flex; gap: 10px; }
.yx-redes a { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .1); color: #fff; }
.yx-redes a:hover { background: var(--magenta); color: #fff; }
.yx-pie__legal { border-top: 1px solid rgba(255, 255, 255, .16); margin-top: 40px; padding-top: 18px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 24px; font-size: .9rem; color: #C9CBE8; }
.yx-pie__legal p { margin: 0; max-width: none; }
.yx-pie__legal a { color: #fff; }

.yx-flotante { position: fixed; right: 16px; bottom: 16px; z-index: 60; width: 60px; height: 60px; border-radius: 50%; display: grid; place-items: center; background: var(--verde-texto); color: #fff; box-shadow: 5px 6px 0 rgba(31, 33, 80, .3); }
.yx-flotante:hover { color: #fff; }
.yx-flotante .yx-i { width: 32px; height: 32px; }
@media (min-width: 1080px) { .yx-flotante { display: none; } }

/* ------------------------------------------------------------------ Páginas legales y errores */
.yx-legal { background: var(--cielo); padding: 56px 0 80px; }
.yx-legal__in { max-width: 820px; }
.yx-legal__t { font-size: clamp(2.3rem, 5vw, 3.4rem); }
.yx-legal__sub { font-weight: 900; color: var(--tinta-2); margin-top: -6px; }
.yx-legal .yx-h3 { margin-top: 1.5em; }
.yx-legal__volver { margin-top: 2em; }
.yx-lista-errores { font-weight: 800; color: #8A0010; }
.yx-404 { padding: 96px 0 120px; text-align: center; background: var(--cielo); }
.yx-404 p { margin-left: auto; margin-right: auto; }
