/* Hallmark · checked: 2026-11-15 · genre: editorial (inferred) · surface: absolute
 * floor: 0 FAIL · fixed: 7a, 48, 67, 24b, 3, 26b, F3, F6, nav: ítem unificado (texto + flecha), hover/abierto/actual con fondo y subrayado · franja de auspiciantes: marco común, imagen entera, estados · colores y contrastes sin cambios (pedido del dueño)
 * built: the project · redesign: polish · v2.0.0 */
/* Hallmark · waive 7b · surface: absolute · fondo blanco del sitio se mantiene porque todos los pares de color de la guía están medidos en AAA */
/* ZW Guía de Surfing — estilos. Mobile-first.
   Paleta tomada del logo: cian #00d7fa y lima #d2fa00 (solo como acentos y fondos con texto oscuro),
   azul oscuro del contorno del logo para texto y superficies. Todos los textos cumplen WCAG AAA (7:1),
   los bordes de controles y gráficos cumplen 3:1. */
:root {
	--c-cyan: #00d7fa;
	--c-lime: #d2fa00;
	--c-blue: #003db5;
	--c-navy: #00296b;
	--c-teal: #005b6e;
	--c-ink: #0b1b33;
	--c-muted: #44505f;
	--c-line: #767f8f;
	--c-soft: #cfd8e3;
	--c-white: #ffffff;
	--c-bg: var(--c-white);
	--c-alt: #eef7fa;
	--c-low: #1d6b3a;
	--c-mid: #8a5a00;
	--c-high: #a32116;
	--c-sky-1: #cfeaf5;
	--c-sky-2: #eaf6fb;
	--c-map: #dbe3ec;
	--c-foot-text: #e6edf7;
	--c-scrim-1: rgba(0, 26, 64, .94);
	--c-scrim-2: rgba(0, 26, 64, .82);
	--c-scrim-3: rgba(0, 26, 64, .15);
	--c-hero-1: rgba(0, 26, 64, .88);
	--c-hero-2: rgba(0, 26, 64, .80);
	--c-hero-3: rgba(0, 26, 64, .45);
	--logo-h: 100px;
	--dur: .2s;
	--dur-slow: .9s;
	--r: 12px;
	--shadow: 0 2px 10px rgba(0, 41, 107, .10);
	--font: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 100%; scroll-padding-top: calc(var(--logo-h) + 3rem); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body.zwg { margin: 0; font-family: var(--font); font-size: 1.0625rem; line-height: 1.6; color: var(--c-ink); background: var(--c-bg); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--c-blue); }
a:hover { color: var(--c-navy); text-decoration-thickness: 2px; }
h1, h2, h3 { line-height: 1.25; color: var(--c-navy); margin: 0 0 .5em; text-wrap: balance; }
h1 { font-size: clamp(1.9rem, 5vw, 2.8rem); font-weight: 900; }
h2 { font-size: clamp(1.35rem, 3.4vw, 1.8rem); font-weight: 900; }
h3 { font-size: 1.1rem; font-weight: 700; }
.zwg-wrap { width: min(1160px, 100% - 32px); margin-inline: auto; }
.zwg-narrow { width: min(820px, 100% - 32px); }
.zwg-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.zwg-skip { position: absolute; left: -999px; top: 0; background: var(--c-navy); color: var(--c-white); padding: 12px 16px; z-index: 100; font-weight: 700; }
.zwg-skip:focus { left: 8px; top: 8px; }
.zwg-main:focus { outline: none; }

/* Foco visible: doble anillo (azul + blanco) en fondos claros, lima en fondos oscuros */
:focus-visible { outline: 3px solid var(--c-blue); outline-offset: 3px; box-shadow: 0 0 0 3px var(--c-white); }
.zwg-hero :focus-visible, .zwg-footer :focus-visible, .zwg-dep:focus-visible { outline-color: var(--c-lime); box-shadow: 0 0 0 3px var(--c-navy); }

/* Cabecera */
.zwg-header { background: var(--c-white); border-bottom: 1px solid var(--c-soft); position: sticky; top: 0; z-index: 50; }
.zwg-header-in { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 8px; }
.zwg-brand { display: inline-block; }
.zwg-brand img, .zwg-brand .custom-logo { width: auto; height: var(--logo-h); }
.zwg-burger { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--c-white); border: 2px solid var(--c-line); border-radius: 10px; cursor: pointer; }
.zwg-burger-bars, .zwg-burger-bars::before, .zwg-burger-bars::after { display: block; width: 22px; height: 3px; background: var(--c-navy); content: ""; position: relative; border-radius: 2px; }
.zwg-burger-bars::before { position: absolute; top: -8px; }
.zwg-burger-bars::after { position: absolute; top: 8px; }
.zwg-nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--c-white); border-bottom: 1px solid var(--c-soft); box-shadow: var(--shadow); padding: 8px 16px 16px; max-height: calc(100vh - var(--logo-h) - 17px - var(--wp-admin--admin-bar--height, 0px)); max-height: calc(100dvh - var(--logo-h) - 17px - var(--wp-admin--admin-bar--height, 0px)); overflow-y: auto; overscroll-behavior: contain; }
.zwg-nav.is-open { display: block; }
.zwg-menu { list-style: none; margin: 0; padding: 0; }
.zwg-menu a { display: block; padding: 12px 8px; min-height: 48px; font-weight: 700; text-decoration: none; color: var(--c-navy); border-bottom: 1px solid var(--c-soft); }
.zwg-menu .sub-menu { list-style: none; padding-left: 16px; margin: 0; }
.zwg-menu .current-menu-item > a, .zwg-menu .is-current > a, .zwg-menu a[aria-current] { box-shadow: inset 4px 0 0 var(--c-cyan); background: var(--c-alt); }
@media (min-width: 900px) {
	.zwg-burger { display: none; }
	.zwg-nav { display: block; position: static; box-shadow: none; border: 0; padding: 0; background: none; max-height: none; overflow: visible; }
	.zwg-menu { display: flex; gap: 4px; flex-wrap: wrap; }
	.zwg-menu a { border: 0; padding: 12px 16px; border-radius: 8px; }
	.zwg-menu a:hover { background: var(--c-alt); text-decoration: underline; }
	.zwg-menu .current-menu-item > a, .zwg-menu .is-current > a, .zwg-menu a[aria-current] { box-shadow: inset 0 -4px 0 var(--c-cyan); }
}

/* Hero y buscador (el texto solo se apoya en tonos oscuros; cian y lima quedan como acento) */
.zwg-hero { background: linear-gradient(135deg, var(--c-navy) 0%, var(--c-blue) 100%); color: var(--c-white); padding: 56px 0 64px; border-bottom: 8px solid var(--c-cyan); position: relative; }
.zwg-hero::after { content: ""; position: absolute; left: 0; bottom: -8px; width: min(220px, 40%); height: 8px; background: var(--c-lime); }
.zwg-hero h1 { color: var(--c-white); max-width: 18ch; }
.zwg-lead { font-size: 1.15rem; max-width: 56ch; }
.zwg-search { display: flex; gap: 8px; max-width: 560px; margin-top: 24px; }
.zwg-search input[type="search"] { flex: 1; min-width: 0; min-height: 48px; padding: 12px 16px; font: inherit; color: var(--c-ink); background: var(--c-white); border: 2px solid var(--c-white); border-radius: 10px; }
.zwg-search input::placeholder { color: var(--c-muted); opacity: 1; }
.zwg-search button { min-height: 48px; padding: 12px 24px; font: inherit; font-weight: 900; border: 2px solid var(--c-lime); border-radius: 10px; background: var(--c-lime); color: var(--c-navy); cursor: pointer; }
.zwg-search button:hover { background: var(--c-cyan); border-color: var(--c-cyan); }
main .zwg-search input[type="search"] { border-color: var(--c-line); }

/* Secciones */
.zwg-section { padding: 44px 0; }
.zwg-section--alt { background: var(--c-alt); }
.zwg-pagehead { padding: 16px 0 8px; }
.zwg-crumbs { padding: 8px 0 0; font-size: .95rem; color: var(--c-muted); }
.zwg-crumbs ol { display: flex; flex-wrap: wrap; gap: 0 8px; list-style: none; padding: 0; margin: 0; }
.zwg-crumbs li { display: flex; align-items: center; min-height: 44px; }
.zwg-crumbs li + li::before { content: "›"; margin-right: 8px; color: var(--c-muted); }
.zwg-crumbs a { display: inline-flex; align-items: center; min-height: 44px; color: var(--c-blue); }
.zwg-kicker { display: inline-block; font-size: .9rem; font-weight: 900; color: var(--c-teal); }

/* Departamentos */
.zwg-deps { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media (min-width: 800px) { .zwg-deps { grid-template-columns: repeat(4, 1fr); } }
.zwg-dep { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 170px; border-radius: var(--r); overflow: hidden; text-decoration: none; color: var(--c-white); background: var(--c-navy); padding: 16px; box-shadow: var(--shadow); }
.zwg-dep:hover { color: var(--c-white); }
.zwg-dep-img { position: absolute; inset: 0; }
.zwg-dep-img img { width: 100%; height: 100%; object-fit: cover; }
.zwg-dep::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, var(--c-scrim-1) 0, var(--c-scrim-2) 45%, var(--c-scrim-3) 100%); }
.zwg-dep-name, .zwg-dep-count { position: relative; z-index: 1; }
.zwg-dep-name { font-size: 1.25rem; font-weight: 900; }
.zwg-dep-count { font-size: .95rem; font-variant-numeric: tabular-nums; }
.zwg-dep:hover .zwg-dep-name { text-decoration: underline; text-decoration-thickness: 2px; }
.zwg-subdeps { list-style: none; display: flex; gap: 8px; flex-wrap: wrap; padding: 0; margin: 16px 0; }
.zwg-subdeps a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 2px solid var(--c-line); border-radius: 99px; text-decoration: none; font-weight: 700; background: var(--c-white); }
.zwg-subdeps a:hover { background: var(--c-alt); }

/* Filtros */
.zwg-filters { display: flex; flex-wrap: wrap; gap: 16px 28px; margin: 8px 0 24px; align-items: flex-start; }
.zwg-filters fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.zwg-filters legend { font-weight: 900; font-size: 1rem; margin-bottom: 8px; padding: 0; color: var(--c-navy); }
.zwg-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.zwg-chip { font: inherit; font-weight: 700; padding: 8px 16px; min-height: 44px; min-width: 44px; border-radius: 99px; border: 2px solid var(--c-line); background: var(--c-white); color: var(--c-navy); cursor: pointer; }
.zwg-chip:hover { background: var(--c-alt); border-color: var(--c-navy); }
.zwg-chip[aria-pressed="true"] { background: var(--c-navy); color: var(--c-white); border-color: var(--c-navy); }
.zwg-chip[aria-pressed="true"]::before { content: "✓ "; }
.zwg-hint { font-size: .9rem; color: var(--c-muted); margin: 8px 0 0; }
.zwg-count { font-variant-numeric: tabular-nums; font-weight: 700; margin: 0; align-self: center; }
.zwg-wind-note { flex: 1 1 100%; margin: 0; padding: 12px 16px; background: var(--c-white); border: 1px solid var(--c-soft); border-radius: var(--r); }
.zwg-wind-note[hidden] { display: none; }
.zwg-wind-meta { display: block; margin-top: 4px; font-size: .85rem; color: var(--c-muted); }
.zwg-linkbtn { font: inherit; font-weight: 700; background: none; border: 0; padding: 12px 0 12px 8px; min-height: 44px; color: var(--c-blue); text-decoration: underline; cursor: pointer; }

/* Tarjetas */
.zwg-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 600px) { .zwg-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 960px) { .zwg-grid { grid-template-columns: repeat(3, 1fr); } }
.zwg-card { position: relative; background: var(--c-white); border: 1px solid var(--c-soft); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.zwg-card[hidden] { display: none; }
.zwg-card:has(a:focus-visible) { outline: 3px solid var(--c-blue); outline-offset: 3px; }
.zwg-card-img { display: block; aspect-ratio: 16 / 10; background: linear-gradient(135deg, var(--c-sky-1), var(--c-sky-2)); }
.zwg-card-img img { width: 100%; height: 100%; object-fit: cover; }
.zwg-card-noimg { display: grid; place-items: center; height: 100%; font-size: 2.4rem; }
.zwg-card-body { padding: 16px 16px 16px; }
.zwg-card-title { margin: 4px 0 8px; font-size: 1.15rem; }
.zwg-card-title a { text-decoration: none; color: var(--c-navy); }
.zwg-card-title a:hover { text-decoration: underline; text-decoration-thickness: 2px; }
.zwg-card-title a::after { content: ""; position: absolute; inset: 0; }
.zwg-tags { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 12px 0 0; }
.zwg-tag { font-size: .85rem; font-weight: 700; padding: 4px 12px; background: var(--c-alt); border: 1px solid var(--c-soft); border-radius: 99px; color: var(--c-muted); }
.zwg-stars { color: var(--c-navy); letter-spacing: 2px; font-size: 1.1rem; }
.zwg-empty { color: var(--c-muted); padding: 20px 0; }

/* Ficha del spot */
.zwg-spot-head { padding-bottom: 16px; }
.zwg-spot-cover { max-height: 420px; overflow: hidden; margin-bottom: 16px; background: var(--c-alt); }
.zwg-spot-cover img { width: 100%; height: 100%; max-height: 420px; object-fit: cover; }
.zwg-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.zwg-btn { display: inline-flex; align-items: center; min-height: 48px; padding: 12px 20px; border-radius: 10px; background: var(--c-navy); color: var(--c-white); font-weight: 900; text-decoration: none; border: 2px solid var(--c-navy); }
.zwg-btn:hover { background: var(--c-blue); border-color: var(--c-blue); color: var(--c-white); text-decoration: underline; }
.zwg-btn--ghost { background: var(--c-white); color: var(--c-navy); }
.zwg-btn--ghost:hover { background: var(--c-alt); border-color: var(--c-navy); color: var(--c-navy); }
.zwg-facts { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 16px 0 8px; }
@media (min-width: 700px) { .zwg-facts { grid-template-columns: repeat(5, 1fr); } }
.zwg-fact { --fact: var(--c-teal); position: relative; background: var(--c-alt); border: 1px solid var(--c-soft); border-radius: var(--r); padding: 12px 16px; }
.zwg-fact::after { content: ""; position: absolute; top: 12px; right: 12px; width: 12px; height: 12px; border-radius: 3px; background: var(--fact); }
.zwg-fact--low { --fact: var(--c-low); }
.zwg-fact--mid { --fact: var(--c-mid); }
.zwg-fact--high { --fact: var(--c-high); }
.zwg-fact-label { display: block; padding-right: 20px; font-size: .9rem; color: var(--c-muted); font-weight: 700; }
.zwg-fact-value { font-size: 1.1rem; }
.zwg-spot-cols { display: grid; gap: 24px; margin-top: 20px; }
@media (min-width: 900px) { .zwg-spot-cols { grid-template-columns: 1.6fr 1fr; align-items: start; } }
.zwg-box { border: 1px solid var(--c-soft); border-radius: var(--r); padding: 16px; margin-bottom: 16px; background: var(--c-white); }
.zwg-box h2 { font-size: 1.15rem; }
.zwg-compass { display: block; width: 100%; max-width: 230px; height: auto; margin: 0 auto; }
.zwg-c-base { fill: var(--c-map); stroke: var(--c-white); stroke-width: 1; }
.zwg-c-wind { fill: var(--c-teal); }
.zwg-c-swell { fill: var(--c-navy); }
.zwg-c-label { font: 900 10px var(--font); fill: var(--c-ink); }
.zwg-legend { list-style: none; padding: 0; margin: 12px 0 0; font-size: 1rem; }
.zwg-dot { display: inline-block; width: 14px; height: 14px; border-radius: 3px; margin-right: 8px; vertical-align: -2px; }
.zwg-dot--wind { background: var(--c-teal); }
.zwg-dot--swell { background: var(--c-navy); }
.zwg-map { width: 100%; height: 260px; border: 1px solid var(--c-line); border-radius: 8px; }
.zwg-content { max-width: 70ch; }
.zwg-content p, .zwg-content ul, .zwg-content ol { margin: 0 0 1.5em; }
.zwg-content img { border-radius: 8px; }
.zwg-gallery-sec, .zwg-services, .zwg-near { margin-top: 32px; }
.zwg-gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 800px) { .zwg-gallery { grid-template-columns: repeat(4, 1fr); } }
.zwg-gallery img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }
.zwg-svc { border: 2px solid var(--c-line); border-radius: var(--r); margin-bottom: 12px; background: var(--c-white); }
.zwg-svc summary { padding: 16px 16px; min-height: 48px; font-weight: 900; cursor: pointer; color: var(--c-navy); }
.zwg-svc-list { margin: 0; padding: 0 16px 16px 32px; }
.zwg-svc-list li { padding: 4px 0; }
.zwg-rail { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 4px 12px; }
.zwg-rail .zwg-card { flex: 0 0 min(280px, 78%); scroll-snap-align: start; }

/* Publicidad */
.zwg-ad { margin: 24px auto; width: min(1160px, 100% - 32px); }
.zwg-ad-label { display: block; font-size: .9rem; color: var(--c-muted); margin-bottom: 8px; }
.zwg-ad-row { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: center; }
.zwg-ad-item img { max-height: 180px; width: auto; border-radius: 8px; }
.zwg-ad--home-logos .zwg-ad-item img, .zwg-ad--home-pie .zwg-ad-item img { max-height: 70px; }
.zwg-ad--home-medio .zwg-ad-item, .zwg-ad--home-medio .zwg-ad-item img { width: 100%; }
.zwg-ad--home-banners .zwg-ad-item { flex: 1 1 320px; }
.zwg-ad--home-banners .zwg-ad-item img { width: 100%; max-height: none; }
.zwg-ad--spot-servicios { margin: 12px 0 16px; width: 100%; }

/* Pie */
.zwg-footer { background: var(--c-navy); color: var(--c-foot-text); padding: 32px 0; margin-top: 56px; border-top: 8px solid var(--c-cyan); }
.zwg-footer a { color: var(--c-white); }
.zwg-footer-in { display: grid; gap: 16px; }
@media (min-width: 800px) { .zwg-footer-in { grid-template-columns: 1fr auto auto; align-items: center; } }
.zwg-menu--pie { display: flex; gap: 0 16px; flex-wrap: wrap; }
.zwg-menu--pie a { border: 0; padding: 12px 0; color: var(--c-white); text-decoration: underline; }
.zwg-menu--pie a:hover { background: none; color: var(--c-lime); }
.zwg-copy { margin: 0; font-size: .9rem; }
.zwg-pager { margin: 28px 0; }
.zwg-pager .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; }
.zwg-meta { color: var(--c-muted); }
.zwg-post-img { margin: 12px 0 16px; }

/* Menú con las playas de cada departamento (se arma solo) */
.zwg-menu--mega .zwg-has-sub { display: flex; flex-wrap: wrap; align-items: stretch; border-bottom: 1px solid var(--c-soft); }
.zwg-menu--mega .zwg-has-sub > a { flex: 1 1 auto; border-bottom: 0; }
.zwg-sub-toggle { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 48px; min-height: 48px; padding: 0; border: 0; border-radius: 8px; background: none; color: var(--c-navy); cursor: pointer; }
.zwg-sub-toggle:hover { background: var(--c-alt); }
.zwg-sub-toggle:active { transform: translateY(1px); }
.zwg-caret { width: 14px; height: 14px; stroke-width: 2.5; transition: transform var(--dur) ease; }
.is-open > .zwg-sub-toggle .zwg-caret { transform: rotate(180deg); }
.zwg-sub { display: none; flex: 1 1 100%; padding: 0 0 8px 16px; }
.is-open > .zwg-sub { display: block; }
.zwg-sub-title { margin: 0 0 4px; font-weight: 900; color: var(--c-navy); }
.zwg-sub-list { list-style: none; margin: 0; padding: 0; }
.zwg-menu .zwg-sub-list a { display: flex; align-items: center; min-height: 44px; padding: 4px 8px; border: 0; border-radius: 8px; font-weight: 700; text-decoration: none; color: var(--c-navy); }
.zwg-menu .zwg-sub-list a:hover { background: var(--c-alt); text-decoration: underline; }
.zwg-menu .zwg-sub-all { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; padding: 4px 8px; border: 0; font-weight: 900; color: var(--c-blue); text-decoration: underline; }
html:not(.js) .zwg-has-sub:hover > .zwg-sub, html:not(.js) .zwg-has-sub:focus-within > .zwg-sub { display: block; }
@media (min-width: 900px) {
	.zwg-menu--mega { align-items: center; }
	.zwg-menu--mega .zwg-has-sub { flex-wrap: nowrap; border-bottom: 0; }
	.zwg-menu--mega .zwg-has-sub > a { flex: 0 1 auto; }
	.zwg-sub-toggle { flex: 0 0 44px; min-height: 44px; }

	/* Barra superior: cada ítem (texto + flecha) es una sola pieza.
	   Reposo: sin fondo. Hover, abierto y página actual: fondo suave y texto subrayado (nada más). */
	.zwg-menu--mega > li { border-radius: 8px; }
	.zwg-menu--mega > li:hover, .zwg-menu--mega > li.is-open, .zwg-menu--mega > li.is-current, .zwg-menu--mega > li:has(> a[aria-current]) { background: var(--c-alt); }
	.zwg-menu--mega > li > a, .zwg-menu--mega > li > a[aria-current], .zwg-menu--mega > li.is-current > a { background: none; box-shadow: none; border-radius: 8px; }
	.zwg-menu--mega > li > a:hover { background: none; text-decoration: none; }
	.zwg-menu--mega > li:hover > a, .zwg-menu--mega > li.is-open > a, .zwg-menu--mega > li.is-current > a, .zwg-menu--mega > li > a[aria-current] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
	.zwg-menu--mega > li > a:active, .zwg-menu--mega > li > .zwg-sub-toggle:active { transform: translateY(1px); }
	.zwg-menu--mega > li > .zwg-sub-toggle:hover { background: none; }
	.zwg-menu--mega > li > .zwg-sub-toggle { border-radius: 8px; }
	.zwg-menu--mega > li > .zwg-sub-toggle:focus-visible { outline-offset: -4px; box-shadow: none; }
	.zwg-menu--mega .zwg-has-sub > a { padding-right: 4px; }
	.zwg-sub { position: absolute; left: 0; right: 0; top: 100%; z-index: 60; padding: 24px 0 32px; background: var(--c-white); border-top: 1px solid var(--c-soft); border-bottom: 1px solid var(--c-soft); box-shadow: var(--shadow); max-height: calc(100vh - var(--logo-h) - 17px - var(--wp-admin--admin-bar--height, 0px)); max-height: calc(100dvh - var(--logo-h) - 17px - var(--wp-admin--admin-bar--height, 0px)); overflow-y: auto; overscroll-behavior: contain; }
	.zwg-sub-in { width: min(1160px, 100% - 32px); margin-inline: auto; }
	.zwg-sub-title { margin-bottom: 8px; font-size: 1.15rem; }
	.zwg-sub-list { columns: 4 12rem; column-gap: 24px; }
	.zwg-sub-list li { break-inside: avoid; }
	.zwg-menu .zwg-sub-all { margin-top: 16px; }
}

/* Portada con fotos que pasan solas (se editan en Portada, en el panel) */
.zwg-hero--photo { isolation: isolate; display: flex; align-items: center; min-height: clamp(26rem, 62svh, 40rem); background: var(--c-navy); color: var(--c-white); }
.zwg-slides { position: absolute; inset: 0; z-index: 0; overflow: hidden; background: var(--c-navy); }
.zwg-slide { position: absolute; inset: 0; transition: opacity var(--dur-slow) ease; }
html:not(.js) .zwg-slide:not(.is-active) { display: none; }
.js .zwg-slide { opacity: 0; }
.js .zwg-slide.is-active { opacity: 1; }
.zwg-slide::after { content: ""; position: absolute; inset: 0; background: var(--c-hero-1); pointer-events: none; }
.zwg-slide-img { width: 100%; height: 100%; object-fit: cover; }
.zwg-slide-cap { position: absolute; top: 16px; right: 16px; z-index: 2; max-width: calc(100% - 32px); margin: 0; padding: 4px 12px; border-radius: 8px; background: var(--c-navy); color: var(--c-white); font-size: .9rem; font-weight: 700; }
.zwg-slide-cap a { color: var(--c-white); }
.zwg-hero--photo .zwg-hero-in { position: relative; z-index: 2; pointer-events: none; }
.zwg-hero--photo .zwg-hero-in > * { pointer-events: auto; }
.zwg-slides-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 24px; }
.zwg-sl-btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 2px solid var(--c-white); border-radius: 50%; background: var(--c-navy); color: var(--c-white); cursor: pointer; }
.zwg-sl-btn:hover { background: var(--c-blue); }
.zwg-sl-btn:active, .zwg-sl-dot:active { transform: translateY(1px); }
.zwg-ico-play { display: none; }
.zwg-slides-ctl.is-paused .zwg-ico-pause { display: none; }
.zwg-slides-ctl.is-paused .zwg-ico-play { display: block; }
.zwg-sl-dots { display: flex; list-style: none; margin: 0 0 0 8px; padding: 0; }
.zwg-sl-dot { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer; }
.zwg-sl-dot span { width: 12px; height: 12px; border: 2px solid var(--c-white); border-radius: 99px; background: var(--c-navy); }
.zwg-sl-dot[aria-current="true"] span { width: 24px; background: var(--c-lime); }
@media (min-width: 900px) {
	.zwg-slide::after { background: linear-gradient(90deg, var(--c-hero-1) 0, var(--c-hero-2) 70%, var(--c-hero-3) 100%); }
}
@media (prefers-reduced-motion: reduce) {
	.zwg-slide, .zwg-caret { transition: none; }
}

/* Formulario de Contacto (Contact Form 7) */
.wpcf7 form p { margin: 0 0 16px; }
.wpcf7 label { display: block; margin-bottom: 4px; font-weight: 700; color: var(--c-navy); }
.wpcf7-form-control-wrap { display: block; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 textarea { width: 100%; min-height: 48px; padding: 12px 16px; font: inherit; color: var(--c-ink); background: var(--c-white); border: 2px solid var(--c-line); border-radius: 10px; }
.wpcf7 textarea { min-height: 160px; resize: vertical; }
.wpcf7 [aria-invalid="true"] { border-color: var(--c-high); }
.wpcf7-not-valid-tip { display: block; margin-top: 4px; font-weight: 700; color: var(--c-high); }
.wpcf7 input[type="submit"] { min-height: 48px; padding: 12px 24px; font: inherit; font-weight: 900; color: var(--c-white); background: var(--c-navy); border: 2px solid var(--c-navy); border-radius: 10px; cursor: pointer; }
.wpcf7 input[type="submit"]:hover { background: var(--c-blue); border-color: var(--c-blue); }
.wpcf7 input[type="submit"]:active { transform: translateY(1px); }
.wpcf7-spinner { margin-left: 12px; }
.wpcf7 form .wpcf7-response-output { margin: 16px 0 0; padding: 12px 16px; font-weight: 700; color: var(--c-ink); border: 2px solid var(--c-line); border-left-width: 8px; border-radius: 10px; }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--c-low); }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output { border-color: var(--c-high); }
.zwg-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.zwg-form-note { font-size: .95rem; color: var(--c-muted); }

/* Estado presionado: baja 1px, sin cambiar colores */
.zwg-btn:active, .zwg-search button:active, .zwg-chip:active, .zwg-burger:active, .zwg-linkbtn:active, .zwg-subdeps a:active, .zwg-svc summary:active { transform: translateY(1px); }

@media (forced-colors: active) {
	.zwg-chip[aria-pressed="true"] { outline: 2px solid CanvasText; }
	.zwg-fact, .zwg-wind-note { border: 1px solid CanvasText; }
	.zwg-sl-dot[aria-current="true"] span { background: Highlight; }
	.zwg-c-wind, .zwg-c-swell { forced-color-adjust: none; }
}

/* Galería de la playa: las fotos se abren en un visor (lightbox) sin salir de la página */
.zwg-gallery a { display: block; border-radius: 8px; }
.js .zwg-gallery a { cursor: zoom-in; }
html.zwg-lb-open { overflow-y: hidden; }
.zwg-lb { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--c-scrim-1); color: var(--c-white); }
.zwg-lb::backdrop { background: var(--c-scrim-1); }
.zwg-lb-stage { box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto; grid-template-areas: "nav" "fig" "cap"; gap: 12px; width: 100%; height: 100%; padding: 12px; }
.zwg-lb-nav { grid-area: nav; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.zwg-lb-arrows { display: flex; gap: 12px; }
.zwg-lb-arrows[hidden] { display: none; }
.zwg-lb-fig { grid-area: fig; position: relative; overflow: hidden; margin: 0; min-width: 0; min-height: 0; }
.zwg-lb-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: scale-down; }
.zwg-lb-foot { grid-area: cap; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.zwg-lb-cap { margin: 0; min-width: 0; display: grid; gap: 2px; }
.zwg-lb-orig { display: inline-flex; align-items: center; min-height: 44px; color: var(--c-white); font-weight: 700; text-decoration: underline; text-underline-offset: 4px; }
.zwg-lb-orig:hover { text-decoration-thickness: 3px; }
.zwg-lb-orig:focus-visible { outline: 3px solid var(--c-lime); outline-offset: 3px; box-shadow: 0 0 0 3px var(--c-navy); }
.zwg-lb-lensbtn { gap: 8px; padding: 0 16px; }
.zwg-lb-btn[aria-pressed="true"] { background: var(--c-white); color: var(--c-navy); }
.zwg-lb-hint { display: none; margin: 0; font-size: .95rem; color: var(--c-foot-text); }
.zwg-lb-hint[hidden] { display: none; }
.zwg-lb-lens { position: absolute; box-sizing: border-box; border: 3px solid var(--c-white); border-radius: 50%; background-color: var(--c-navy); background-repeat: no-repeat; box-shadow: 0 0 0 2px var(--c-navy), 0 8px 24px var(--c-scrim-2); pointer-events: none; }
.zwg-lb-lens[hidden] { display: none; }
.zwg-lb[data-lens="on"] .zwg-lb-fig { cursor: crosshair; }
.zwg-lb-count { font-weight: 700; }
.zwg-lb-alt { font-size: .95rem; color: var(--c-foot-text); }
.zwg-lb-btn { box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; min-width: 48px; min-height: 48px; border: 2px solid var(--c-white); border-radius: var(--r); background: transparent; color: var(--c-white); font: inherit; font-weight: 700; cursor: pointer; transition: background-color var(--dur), color var(--dur); }
.zwg-lb-btn:hover { background: var(--c-white); color: var(--c-navy); }
.zwg-lb-btn:focus-visible { outline: 3px solid var(--c-lime); outline-offset: 3px; box-shadow: 0 0 0 3px var(--c-navy); }
.zwg-lb-btn[hidden] { display: none; }
.zwg-lb-close { gap: 8px; padding: 0 16px; }
@media (min-width: 900px) {
	.zwg-lb-stage { grid-template-columns: minmax(0, 1fr) 220px; grid-template-rows: minmax(0, 1fr) auto; grid-template-areas: "fig nav" "cap nav"; gap: 16px 24px; padding: 24px; }
	.zwg-lb-nav { flex-direction: column; align-items: stretch; justify-content: flex-start; }
	.zwg-lb-arrows .zwg-lb-btn { flex: 1; }
	.zwg-lb-hint { display: block; }
}
@media (prefers-reduced-motion: reduce) { .zwg-lb-btn { transition: none; } }
@media (forced-colors: active) { .zwg-lb { border: 1px solid CanvasText; } }

/* Ficha de playa: dos lugares de publicidad arriba; si están vacíos, el aviso "Publicite aquí" */
/* Franja de auspiciantes de la ficha: los dos lugares comparten el mismo marco (proporción de banner),
   con publicidad o con el aviso "Publicite aquí". La imagen se ve entera (contain), nunca recortada. */
.zwg-ad--spot-principal { margin: 32px auto 8px; }
.zwg-ad-slots { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 700px) { .zwg-ad-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.zwg-ad-slot { display: grid; min-width: 0; min-height: 88px; aspect-ratio: 4.2 / 1; }
.zwg-ad--spot-principal .zwg-ad-item { display: grid; min-width: 0; }
.zwg-ad--spot-principal .zwg-ad-item > a { display: grid; place-items: center; min-width: 0; min-height: 44px; border: 1px solid var(--c-soft); border-radius: var(--r); background: var(--c-white); box-shadow: var(--shadow); transition: border-color var(--dur) ease-out, transform var(--dur) ease-out; }
.zwg-ad--spot-principal .zwg-ad-item > a:hover { border-color: var(--c-navy); }
.zwg-ad--spot-principal .zwg-ad-item > a:active { transform: translateY(1px); }
.zwg-ad--spot-principal .zwg-ad-item img { display: block; width: 100%; height: 100%; max-height: none; object-fit: contain; border-radius: var(--r); }
.zwg-ad-empty { box-sizing: border-box; display: grid; place-items: center; min-width: 0; min-height: 44px; padding: 12px 16px; border: 3px solid transparent; border-radius: var(--r); background: linear-gradient(var(--c-alt), var(--c-alt)) padding-box, linear-gradient(135deg, var(--c-cyan), var(--c-lime)) border-box; color: var(--c-navy); font-size: 1.15rem; font-weight: 700; line-height: 1.3; text-align: center; text-decoration: none; }
a.zwg-ad-empty { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 6px; }
a.zwg-ad-empty:hover { background: linear-gradient(var(--c-white), var(--c-white)) padding-box, linear-gradient(135deg, var(--c-cyan), var(--c-lime)) border-box; text-decoration-thickness: 4px; }
a.zwg-ad-empty:active { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) { .zwg-ad--spot-principal .zwg-ad-item > a { transition: none; } .zwg-ad--spot-principal .zwg-ad-item > a:active, a.zwg-ad-empty:active { transform: none; } }

/* Mapa de viento y olas (Windy): se pide a Windy recién al tocar el botón. */
.zwg-windy-sec { margin-top: 32px; }
.zwg-windy { display: grid; gap: 12px; }
.zwg-windy-tabs[hidden] { display: none; }
.zwg-windy-frame { position: relative; display: grid; place-items: center; min-height: 360px; padding: 16px; border: 1px solid var(--c-soft); border-radius: var(--r); background: linear-gradient(135deg, var(--c-sky-1), var(--c-sky-2)); text-align: center; }
@media (min-width: 700px) { .zwg-windy-frame { aspect-ratio: 16 / 9; min-height: 420px; } }
.zwg-windy-ask { display: grid; gap: 16px; justify-items: center; max-width: 44ch; }
.zwg-windy-ask p { margin: 0; color: var(--c-navy); font-weight: 700; }
.zwg-windy-iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: var(--r); background: var(--c-white); }
.zwg-windy-frame.is-loaded .zwg-windy-ask { display: none; }
.zwg-windy-note { margin: 0; font-size: .95rem; }
.zwg-windy-note a { display: inline-flex; align-items: center; min-height: 44px; color: var(--c-blue); }
.zwg-windy-ask button.zwg-btn { font: inherit; font-weight: 900; cursor: pointer; }
.zwg-windy-ask button[hidden] { display: none; }
