:root {
  color-scheme: light;
  --blue-950: #06233d;
  --blue-900: #0a3b66;
  --blue-800: #0e527f;
  --blue-700: #126a98;
  --blue-600: #1483b2;
  --blue-500: #20a7cf;
  --blue-300: #8ed8eb;
  --blue-100: #dff4f9;
  --blue-50: #f1fafc;
  --paper: #fbfaf5;
  --sand: #f0ede3;
  --white: #fff;
  --ink: #102a3a;
  --muted: #557080;
  --border: #cbdde4;
  --accent: #c55236;
  --accent-dark: #983b28;
  --success: #1c7454;
  --shadow-sm: 0 8px 24px rgba(6, 35, 61, .08);
  --shadow-lg: 0 26px 80px rgba(6, 35, 61, .16);
  --radius-sm: 14px;
  --radius-md: 24px;
  --radius-lg: 34px;
  --container: 1220px;
  --font-body: 'DM Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-display: 'Newsreader', Georgia, serif;
  --header-height: 78px;
  --season-a: var(--blue-600);
  --season-b: var(--blue-300);
}

html[data-season='patrio'] { --header-height: 84px; --season-a: #176b3a; --season-b: #b32234; }
html[data-season='muertos'] { --season-a: #7b3db8; --season-b: #e87822; }
html[data-season='navidad'] { --season-a: #ad2938; --season-b: #176b4b; }
html[data-season='patrio'] .seasonal-ribbon { background: linear-gradient(90deg, #176b3a 0 33.333%, #f6f1df 33.333% 66.666%, #b32234 66.666%); }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--paper); color: var(--ink); font-family: var(--font-body); font-size: 16px; line-height: 1.55; text-rendering: optimizeLegibility; }
body.menu-open { overflow: hidden; }
img, video, iframe { display: block; max-width: 100%; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
button, input, textarea, select { font: inherit; }
button, a { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
h1, h2, h3, p { overflow-wrap: break-word; }
h1, h2, h3 { text-wrap: balance; }
.container { width: min(var(--container), calc(100% - 32px)); margin-inline: auto; }
.narrow { width: min(820px, calc(100% - 32px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 999; top: 8px; left: 8px; padding: 12px 16px; background: var(--white); color: var(--ink); border-radius: 10px; transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid var(--blue-500); outline-offset: 4px; }

.seasonal-ribbon { position: fixed; z-index: 100; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, var(--season-a), var(--season-b), var(--season-a)); background-size: 200% 100%; }
.site-header { position: sticky; z-index: 90; top: 0; background: rgba(251, 250, 245, .95); border-bottom: 1px solid rgba(10, 59, 102, .12); backdrop-filter: blur(18px); transition: box-shadow .2s ease; }
.site-header.is-scrolled { box-shadow: var(--shadow-sm); }
.patriotic-header-art { position: absolute; z-index: 1; inset: 0; overflow: hidden; pointer-events: none; background: #00483c; }
.patriotic-header-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,43,36,.58), rgba(0,43,36,.84) 31%, rgba(0,43,36,.86) 69%, rgba(0,43,36,.58)), linear-gradient(180deg, rgba(0,24,20,.06), rgba(0,24,20,.34)); }
.patriotic-header-art img { width: 100%; max-width: none; height: 100%; object-fit: cover; object-position: center top; opacity: .9; }
html[data-season='patrio'] .site-header { background: #00483c; border-bottom-color: rgba(255,255,255,.24); -webkit-backdrop-filter: none; backdrop-filter: none; }
html[data-season='patrio'] .nav-shell { min-height: 84px; }
html[data-season='patrio'] .brand { color: #fffdf4; text-shadow: 0 2px 10px rgba(0,25,20,.72); }
html[data-season='patrio'] .brand img { filter: brightness(0) invert(1); }
html[data-season='patrio'] .patriotic-kicker { display: block; margin-top: 5px; color: #ffd54a; font-size: 9px; font-weight: 800; letter-spacing: .11em; line-height: 1; text-transform: uppercase; }
html[data-season='patrio'] .menu-toggle { border-color: rgba(255,255,255,.68); background: rgba(255,255,255,.94); box-shadow: 0 7px 20px rgba(0,31,25,.24); }
.nav-shell { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.nav-shell { position: relative; z-index: 4; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--blue-950); line-height: .98; }
.brand img { width: 49px; height: 49px; }
.brand span { font-size: 13px; font-weight: 500; letter-spacing: .02em; }
.brand b { font-size: 15px; }
.menu-toggle { width: 50px; height: 50px; display: grid; align-content: center; justify-items: center; gap: 5px; border: 1px solid var(--border); border-radius: 50%; background: var(--white); color: var(--blue-950); cursor: pointer; }
.menu-toggle > span:not(.sr-only) { width: 21px; height: 2px; background: currentColor; transition: transform .2s ease, opacity .2s ease; }
.menu-toggle[aria-expanded='true'] > span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded='true'] > span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded='true'] > span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.site-nav { position: absolute; z-index: 91; top: 100%; left: 0; right: 0; height: calc(100vh - var(--header-height)); height: calc(100dvh - var(--header-height)); display: none; align-content: start; gap: 7px; padding: 18px 16px calc(28px + env(safe-area-inset-bottom)); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; background: var(--paper); }
.site-nav[data-open] { display: grid; }
.site-nav a { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 16px; border-radius: 13px; text-decoration: none; font-weight: 650; }
.site-nav a:hover, .site-nav a[aria-current='page'] { background: var(--blue-100); color: var(--blue-900); }
.site-nav .external-link { margin-top: 10px; background: var(--blue-950); color: var(--white); }
.site-nav .icon { width: 17px; }
.icon { width: 24px; height: 24px; flex: 0 0 auto; }

.eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--accent-dark); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.eyebrow::before { content: ''; width: 28px; height: 1px; background: currentColor; }
.display-title { margin: 14px 0 18px; font-family: var(--font-display); font-size: clamp(3.3rem, 14vw, 7.8rem); font-weight: 500; line-height: .86; letter-spacing: -.045em; }
.section-title { margin: 12px 0 16px; font-family: var(--font-display); font-size: clamp(2.7rem, 10vw, 5.5rem); font-weight: 500; line-height: .92; letter-spacing: -.035em; }
.section-copy { max-width: 650px; color: var(--muted); font-size: 1.05rem; line-height: 1.7; }
.section-head { display: grid; gap: 14px; margin-bottom: 34px; }
.section-pad { padding: 76px 0; }
.section-blue { background: var(--blue-950); color: var(--white); }
.section-blue .section-copy { color: #c8e0eb; }
.section-soft { background: var(--blue-50); }
.section-sand { background: var(--sand); }
.btn { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 19px; border: 1px solid var(--blue-900); border-radius: 999px; background: transparent; color: var(--blue-900); text-decoration: none; font-weight: 700; cursor: pointer; transition: transform .2s ease, background .2s ease, color .2s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: var(--blue-900); color: var(--white); }
.btn-light { border-color: rgba(255,255,255,.7); color: var(--white); }
.btn-light.btn-primary { background: var(--white); color: var(--blue-950); }
.btn .icon { width: 18px; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.text-link { min-height: 44px; display: inline-flex; align-items: center; gap: 7px; color: var(--blue-800); font-weight: 700; }
.text-link .icon { width: 18px; transition: transform .2s ease; }
.text-link:hover .icon { transform: translateX(4px); }

.home-media { position: fixed; z-index: -3; inset: 0; background: url('../img/hero-deportivo.jpg') center / cover no-repeat, var(--blue-950); }
.home-media video, .home-media img { width: 100%; height: 100%; object-fit: cover; }
.home-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5, 31, 53, .84), rgba(5, 31, 53, .2) 70%), linear-gradient(0deg, rgba(5, 31, 53, .64), transparent 55%); }
.hero-home { min-height: calc(100svh - var(--header-height)); display: grid; align-items: end; padding: 110px 0 38px; color: var(--white); }
.hero-home .eyebrow { color: #c6ecf6; }
.hero-home .display-title { max-width: 900px; }
.hero-home .display-title em { display: block; color: var(--blue-300); font-weight: 400; }
.hero-home p { max-width: 620px; margin: 0; color: #d9eaf1; font-size: clamp(1.05rem, 3vw, 1.3rem); line-height: 1.65; }
.hero-lower { display: grid; gap: 22px; margin-top: 38px; }
.temperature-card { width: min(100%, 390px); padding: 20px; background: rgba(251,250,245,.92); color: var(--ink); border: 1px solid rgba(255,255,255,.55); border-radius: var(--radius-md); backdrop-filter: blur(18px); box-shadow: var(--shadow-lg); }
.temperature-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.temperature-card-top span { color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.demo-badge { padding: 5px 8px; background: var(--sand); border-radius: 999px; color: var(--muted); font-size: 10px; font-weight: 700; }
.temperature-reading { display: grid; gap: 7px; margin: 14px 0 14px; }
.temperature-reading strong { max-width: 100%; font-family: var(--font-display); font-size: clamp(3.75rem, 14vw, 4.75rem); font-weight: 500; line-height: .95; letter-spacing: -.035em; color: var(--blue-900); white-space: nowrap; }
.temperature-reading span { color: var(--success); font-weight: 700; line-height: 1.35; }
.temperature-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; padding-top: 13px; border-top: 1px solid var(--border); color: var(--muted); font-size: 12px; }

.home-intro { position: relative; background: var(--paper); }
.fact-strip { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin-top: 38px; overflow: hidden; background: var(--border); border: 1px solid var(--border); border-radius: var(--radius-md); }
.fact { padding: 22px 16px; background: var(--white); }
.fact strong { display: block; font-family: var(--font-display); font-size: 2.5rem; font-weight: 500; line-height: 1; color: var(--blue-900); }
.fact span { color: var(--muted); font-size: 13px; }
.story-panel { min-height: 90svh; display: grid; align-items: center; padding: 80px 0; color: var(--white); }
.story-card { max-width: 630px; padding: 27px; background: rgba(6,35,61,.88); border: 1px solid rgba(255,255,255,.18); border-radius: var(--radius-lg); backdrop-filter: blur(18px); box-shadow: var(--shadow-lg); }
.story-panel:nth-child(even) .story-card { margin-left: auto; }
.story-number { color: var(--blue-300); font-size: 12px; font-weight: 700; letter-spacing: .12em; }
.story-card h2 { margin: 16px 0 14px; font-family: var(--font-display); font-size: clamp(3.2rem, 12vw, 6.5rem); font-weight: 500; line-height: .86; }
.story-card p { color: #d3e5ed; line-height: 1.7; }
.story-list { display: grid; gap: 0; margin: 24px 0; border-top: 1px solid rgba(255,255,255,.18); }
.story-list div { display: flex; justify-content: space-between; gap: 18px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.18); }
.story-list span { color: #b7d2de; }
.card-grid { display: grid; gap: 14px; }
.feature-card { padding: 23px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.feature-card .icon-wrap { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 28px; background: var(--blue-100); color: var(--blue-900); border-radius: 50%; }
.feature-card h3 { margin: 0 0 8px; font-family: var(--font-display); font-size: 2rem; font-weight: 500; line-height: 1; }
.feature-card p { color: var(--muted); }
.feature-card.featured { background: var(--blue-900); color: var(--white); }
.feature-card.featured .icon-wrap { background: rgba(255,255,255,.14); color: var(--white); }
.feature-card.featured p, .feature-card.featured .text-link { color: #d5e7ef; }

/* Inicio: el video permanece visible bajo secciones y tarjetas translúcidas. */
.page-inicio .home-intro { background: rgba(251, 250, 245, .76); border-block: 1px solid rgba(255,255,255,.36); }
.page-inicio .section-soft { background: rgba(241, 250, 252, .72); border-block: 1px solid rgba(255,255,255,.34); }
.page-inicio .section-sand { background: rgba(240, 237, 227, .72); border-top: 1px solid rgba(255,255,255,.34); }
.page-inicio .home-intro .section-copy, .page-inicio .section-soft .section-copy, .page-inicio .section-sand .section-copy { color: #294b5a; }
.page-inicio .temperature-card { background: rgba(251,250,245,.8); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.page-inicio .fact-strip { background: rgba(203,221,228,.58); border-color: rgba(255,255,255,.58); box-shadow: 0 18px 38px rgba(5,31,53,.12); }
.page-inicio .fact { background: rgba(255,255,255,.76); -webkit-backdrop-filter: blur(11px); backdrop-filter: blur(11px); }
.page-inicio .story-card { background: rgba(6,35,61,.76); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.page-inicio .story-panel:nth-of-type(-n + 2) .story-card { background: rgba(6,35,61,.62); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.page-inicio .feature-card { background: rgba(255,255,255,.76); border-color: rgba(255,255,255,.62); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 18px 38px rgba(5,31,53,.13); }
.page-inicio .feature-card.featured { background: rgba(10,59,102,.82); border-color: rgba(255,255,255,.28); }

.home-announcements { background: rgba(6,35,61,.48); border-block: 1px solid rgba(255,255,255,.2); }
.announcement-section-head { margin-bottom: 28px; }
.announcement-section-head .eyebrow { color: #a8eed3; }
.announcement-section-head .section-title { margin-bottom: 0; color: var(--white); text-shadow: 0 3px 20px rgba(0,18,33,.64); }
.announcement-list { display: grid; gap: 14px; }
.announcement-card { display: grid; gap: 18px; padding: 24px; border: 1px solid rgba(255,255,255,.66); border-left: 5px solid #279b70; border-radius: var(--radius-lg); background: rgba(251,250,245,.84); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: 0 20px 42px rgba(5,31,53,.2); }
.announcement-icon { width: 54px; height: 54px; display: grid; place-items: center; border-radius: 50%; background: #dff5e9; color: #176b4b; }
.announcement-type { color: #17704f; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.announcement-copy h3 { margin: 8px 0 9px; color: var(--blue-950); font-family: var(--font-display); font-size: clamp(2rem, 8vw, 3.3rem); font-weight: 500; line-height: .95; }
.announcement-copy p { max-width: 760px; margin: 0; color: #365766; line-height: 1.65; }
.announcement-meta { display: block; margin-top: 13px; color: #17704f; font-size: 13px; font-weight: 700; }
.announcement-card .btn { align-self: start; justify-self: start; }
.image-card { min-height: 380px; position: relative; overflow: hidden; border-radius: var(--radius-lg); }
.image-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.image-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6,35,61,.78), transparent 62%); }
.image-card-copy { position: absolute; z-index: 1; left: 23px; right: 23px; bottom: 23px; color: var(--white); }
.image-card-copy h3 { margin: 0; font-family: var(--font-display); font-size: 2.5rem; font-weight: 500; }

.page-hero { padding: 74px 0 58px; background: linear-gradient(145deg, var(--blue-50), var(--sand)); }
.page-hero-grid { display: grid; gap: 30px; align-items: end; }
.page-hero .display-title { max-width: 960px; }
.page-hero p { max-width: 680px; color: var(--muted); font-size: 1.1rem; line-height: 1.7; }
.page-hero--video { position: relative; isolation: isolate; min-height: max(520px, calc(100svh - var(--header-height))); display: grid; align-items: end; overflow: hidden; background: var(--blue-950); color: var(--white); }
.page-hero-media { position: absolute; z-index: -2; inset: 0; }
.page-hero-media video { width: 100%; height: 100%; object-fit: cover; }
.page-hero--video::after { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, rgba(4, 28, 48, .9), rgba(4, 28, 48, .42) 72%), linear-gradient(0deg, rgba(4, 28, 48, .74), transparent 58%); pointer-events: none; }
.page-hero--video .breadcrumbs { color: #d7eaf1; }
.page-hero--video .breadcrumbs a { color: var(--white); }
.page-hero--video .breadcrumbs li:not(:last-child)::after { color: #99c3d2; }
.page-hero--video .eyebrow { color: var(--blue-300); }
.page-hero--video p { color: #e2f0f4; text-shadow: 0 2px 14px rgba(0, 18, 33, .72); }
.breadcrumbs { margin-bottom: 28px; color: var(--muted); font-size: 13px; }
.breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.breadcrumbs li:not(:last-child)::after { content: '/'; margin-left: 8px; color: #8aa1ad; }
.hero-image { min-height: 320px; overflow: hidden; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.hero-image img { width: 100%; height: 100%; object-fit: cover; }
.page-natacion .hero-image,
.page-triatlon .hero-image { min-height: 0; }
.page-natacion .hero-image { aspect-ratio: 2200 / 1228; }
.page-triatlon .hero-image { aspect-ratio: 4 / 3; }
.page-natacion .hero-image img,
.page-triatlon .hero-image img { display: block; object-fit: contain; }

.filters { display: flex; gap: 8px; margin-bottom: 28px; padding-bottom: 4px; overflow-x: auto; scrollbar-width: thin; }
.filter-button { min-height: 44px; flex: 0 0 auto; padding: 0 15px; border: 1px solid var(--border); border-radius: 999px; background: var(--white); color: var(--ink); font-weight: 650; cursor: pointer; }
.filter-button[aria-pressed='true'] { background: var(--blue-900); color: var(--white); border-color: var(--blue-900); }
.plan-grid { display: grid; gap: 14px; }
.plan-card { display: flex; flex-direction: column; padding: 23px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.plan-card[hidden] { display: none; }
.plan-category { align-self: flex-start; padding: 6px 9px; background: var(--blue-100); color: var(--blue-900); border-radius: 999px; font-size: 11px; font-weight: 700; }
.plan-card h2, .plan-card h3 { margin: 22px 0 7px; font-family: var(--font-display); font-size: 2rem; font-weight: 500; line-height: 1; }
.plan-card p { color: var(--muted); }
.plan-price { margin: auto 0 18px; padding-top: 24px; color: var(--blue-900); font-weight: 700; }
.plan-detail { display: grid; gap: 18px; }
.plan-summary { padding: 26px; background: var(--blue-950); color: var(--white); border-radius: var(--radius-lg); }
.plan-summary h2 { margin: 0 0 8px; font-family: var(--font-display); font-size: 2.5rem; font-weight: 500; }
.plan-summary p { color: #cce1ea; }
.price-panels { display: grid; gap: 12px; margin-top: 24px; }
.price-panel { padding: 18px; background: rgba(255,255,255,.09); border-radius: var(--radius-sm); }
.price-panel h3 { margin: 0 0 10px; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
.price-panel ul { margin: 0; padding-left: 18px; }

/* Planes: cada alternativa tiene un acento y una silueta deportiva propios. */
.page-planes .plan-grid { gap: 18px; }
.page-planes .plan-card { --plan-accent: #188bb7; --plan-tint: #e8f6fa; position: relative; isolation: isolate; min-height: 318px; padding: 25px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--plan-accent) 30%, white); border-radius: var(--radius-lg); background: linear-gradient(145deg, var(--white), var(--plan-tint)); box-shadow: 0 12px 28px rgba(8, 55, 76, .09); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; }
.page-planes .plan-card::before { content: ''; position: absolute; z-index: -1; width: 165px; height: 165px; top: -88px; right: -70px; border-radius: 50%; background: var(--plan-accent); opacity: .13; }
.page-planes .plan-card::after { content: ''; position: absolute; z-index: -1; width: 68px; height: 4px; left: 25px; bottom: 0; border-radius: 999px 999px 0 0; background: var(--plan-accent); }
.page-planes .plan-card:hover { transform: translateY(-6px); border-color: color-mix(in srgb, var(--plan-accent) 58%, white); box-shadow: 0 22px 38px rgba(8, 55, 76, .16); }
.page-planes .plan-card:focus-within { border-color: var(--plan-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--plan-accent) 25%, transparent), 0 22px 38px rgba(8, 55, 76, .16); }
.plan-card-content { min-height: 155px; padding-right: 62px; }
.page-planes .plan-category { position: relative; padding: 6px 10px; background: color-mix(in srgb, var(--plan-accent) 14%, white); color: color-mix(in srgb, var(--plan-accent) 78%, var(--blue-950)); font-size: 11px; letter-spacing: .045em; }
.page-planes .plan-card h2 { margin: 20px 0 9px; color: var(--blue-950); font-size: clamp(1.85rem, 7vw, 2.28rem); line-height: .95; }
.page-planes .plan-card p { margin: 0; color: #416271; line-height: 1.52; }
.plan-price { display: grid; gap: 4px; margin: auto 0 19px; padding: 13px 0 0; border-top: 1px solid color-mix(in srgb, var(--plan-accent) 23%, white); }
.plan-price span { color: #55707c; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.plan-price strong { color: var(--blue-950); font-family: var(--font-display); font-size: 1.26rem; font-weight: 600; line-height: 1.18; }
.page-planes .plan-card .btn { align-self: flex-start; border-color: color-mix(in srgb, var(--plan-accent) 56%, white); color: color-mix(in srgb, var(--plan-accent) 79%, var(--blue-950)); }
.page-planes .plan-card .btn:hover { background: var(--plan-accent); border-color: var(--plan-accent); color: var(--white); }
.plan-visual { position: absolute; top: 20px; right: 20px; width: 76px; height: 76px; background-color: var(--plan-accent); opacity: .5; transform: rotate(-6deg); transition: transform .26s ease, opacity .26s ease; mask: var(--plan-icon) center / contain no-repeat; -webkit-mask: var(--plan-icon) center / contain no-repeat; }
.plan-card:hover .plan-visual { opacity: .72; transform: rotate(4deg) scale(1.06); }
.plan-visual--familiar { --plan-icon: url('../img/plans/familiar.svg'); }
.plan-visual--familiar-3a-edad { --plan-icon: url('../img/plans/familiar-3a-edad.svg'); }
.plan-visual--sindicato { --plan-icon: url('../img/plans/sindicato.svg'); }
.plan-visual--poder-judicial { --plan-icon: url('../img/plans/poder-judicial.svg'); }
.plan-visual--discapacidad { --plan-icon: url('../img/plans/discapacidad.svg'); }
.plan-visual--individual { --plan-icon: url('../img/plans/individual.svg'); }
.plan-visual--3a-edad { --plan-icon: url('../img/plans/3a-edad.svg'); }
.plan-visual--kids { --plan-icon: url('../img/plans/kids.svg'); }
.plan-visual--sabatino { --plan-icon: url('../img/plans/sabatino.svg'); }
.plan-visual--nocturno { --plan-icon: url('../img/plans/nocturno.svg'); }
.plan-visual--voleibol { --plan-icon: url('../img/activities/voleibol.svg'); }
.plan-visual--basquetbol { --plan-icon: url('../img/activities/basquetbol.svg'); }
.plan-visual--karate { --plan-icon: url('../img/activities/karate.svg'); }
.page-planes .plan-card[data-plan-category='Familiar'] { --plan-accent: #22a67a; --plan-tint: #eaf8f1; }
.page-planes .plan-card[data-plan-category='Individual'] { --plan-accent: #168cb9; --plan-tint: #e9f6fa; }
.page-planes .plan-card[data-plan-category='SUTGCDMX'] { --plan-accent: #bf8c1c; --plan-tint: #fcf6e6; }
.page-planes .plan-card[data-plan-category='Poder Judicial'] { --plan-accent: #5666b7; --plan-tint: #eef0fc; }
.page-planes .plan-card[data-plan-category='Especial'] { --plan-accent: #bc5c82; --plan-tint: #fceff4; }
.page-planes .plan-card[data-plan-category='Actividad adicional'] { --plan-accent: #2d9d70; --plan-tint: #e9f7ef; }
.page-planes .section-soft .content-card { position: relative; overflow: hidden; border: 1px solid #cae3e2; border-left: 5px solid #22a67a; background: linear-gradient(135deg, #ffffff, #ecf8f4); box-shadow: 0 16px 30px rgba(8, 55, 76, .08); }
.page-planes .section-soft .content-card::after { content: ''; position: absolute; width: 150px; height: 150px; top: -92px; right: -72px; border-radius: 50%; background: #28ae80; opacity: .12; pointer-events: none; }
.content-card { padding: 24px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); }
.content-card h2 { margin: 0 0 15px; font-family: var(--font-display); font-size: 2.35rem; font-weight: 500; line-height: 1; }
.content-card h3 { margin-top: 28px; color: var(--blue-900); }
.content-card p, .content-card li { color: var(--muted); line-height: 1.7; }
.notice { padding: 17px 18px; background: #fff3e8; border-left: 4px solid var(--accent); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; color: #653124; }

.activity-grid { display: grid; gap: 12px; }
.activity-card { min-height: 210px; display: flex; flex-direction: column; justify-content: space-between; padding: 21px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); }
.activity-icon { width: 48px; height: 48px; display: block; background-color: var(--blue-800); -webkit-mask: var(--activity-icon) center / contain no-repeat; mask: var(--activity-icon) center / contain no-repeat; }
.activity-icon--natacion { --activity-icon: url('../img/activities/natacion.svg'); }
.activity-icon--aquaerobics { --activity-icon: url('../img/activities/aquaerobics.svg'); }
.activity-icon--yoga { --activity-icon: url('../img/activities/yoga.svg'); }
.activity-icon--acondicionamiento { --activity-icon: url('../img/activities/acondicionamiento.svg'); }
.activity-icon--zumba { --activity-icon: url('../img/activities/zumba.svg'); }
.activity-icon--pilates { --activity-icon: url('../img/activities/pilates.svg'); }
.activity-icon--aerobics { --activity-icon: url('../img/activities/aerobics.svg'); }
.activity-icon--karate { --activity-icon: url('../img/activities/karate.svg'); }
.activity-icon--basquetbol { --activity-icon: url('../img/activities/basquetbol.svg'); }
.activity-icon--voleibol { --activity-icon: url('../img/activities/voleibol.svg'); }
.activity-icon--vapor { --activity-icon: url('../img/activities/vapor.svg'); }
.activity-card h3 { margin: 35px 0 5px; font-family: var(--font-display); font-size: 1.8rem; font-weight: 500; }
.activity-card p { margin: 0; color: var(--muted); font-size: 14px; }
.schedule-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--white); }
.schedule-table { width: 100%; min-width: 650px; border-collapse: collapse; }
.schedule-table th, .schedule-table td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--border); }
.schedule-table th { background: var(--blue-50); color: var(--blue-900); font-size: 12px; letter-spacing: .06em; text-transform: uppercase; }
.schedule-table td { color: var(--muted); }
.schedule-table tr:last-child td { border-bottom: 0; }
.schedule-tabs { display: flex; gap: 8px; margin-bottom: 18px; overflow-x: auto; }
.schedule-tab { min-height: 44px; flex: 0 0 auto; padding: 0 15px; border: 1px solid var(--border); border-radius: 999px; background: var(--white); cursor: pointer; font-weight: 700; }
.schedule-tab[aria-selected='true'] { background: var(--blue-900); color: var(--white); }
.schedule-panel[hidden] { display: none; }

/* Horarios de alberca: bloques claros para comparar turnos de un vistazo. */
body.page-horarios-alberca { background: #f3f8fa; }
.page-horarios-alberca .schedule-hero { position: relative; overflow: hidden; background: linear-gradient(135deg, #e6f5fb 0%, #f8fbf2 58%, #dff3e9 100%); }
.page-horarios-alberca .schedule-hero::after { content: ''; position: absolute; width: min(52vw, 590px); aspect-ratio: 1; right: -16vw; bottom: -38%; border-radius: 50%; background: radial-gradient(circle, rgba(45, 183, 126, .24), rgba(45, 183, 126, 0) 68%); pointer-events: none; }
.page-horarios-alberca .schedule-hero .container { position: relative; z-index: 1; }
.pool-schedule-section { position: relative; background: linear-gradient(180deg, #fff 0%, #f3f8fa 100%); }
.schedule-intro { max-width: 690px; margin-bottom: 26px; }
.schedule-intro .section-title { margin: 8px 0 12px; }
.schedule-intro p { margin: 0; color: var(--muted); line-height: 1.65; }
.page-horarios-alberca .schedule-tabs { gap: 9px; margin-bottom: 18px; padding: 6px; border: 1px solid #d9e8ee; border-radius: calc(var(--radius-md) + 4px); background: rgba(255, 255, 255, .78); box-shadow: 0 12px 30px rgba(13, 59, 83, .06); }
.page-horarios-alberca .schedule-tab { border-color: transparent; background: transparent; color: var(--blue-800); transition: background .2s ease, color .2s ease, box-shadow .2s ease; }
.page-horarios-alberca .schedule-tab:hover { background: #e8f4f7; }
.page-horarios-alberca .schedule-tab:focus-visible { outline: 3px solid #56cda1; outline-offset: 2px; }
.page-horarios-alberca .schedule-tab[aria-selected='true'] { background: var(--blue-900); box-shadow: 0 5px 12px rgba(8, 53, 84, .24); color: var(--white); }
.page-horarios-alberca .schedule-panel { padding: 20px; border: 1px solid #d8e8ee; border-top: 4px solid #32b982; border-radius: var(--radius-lg); background: var(--white); box-shadow: 0 18px 40px rgba(10, 56, 79, .09); }
.schedule-panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 0 2px 18px; }
.schedule-panel-heading span { color: #288c6d; font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.schedule-panel-heading h3 { margin: 4px 0 0; color: var(--blue-950); font-family: var(--font-display); font-size: clamp(1.8rem, 7vw, 2.25rem); font-weight: 500; line-height: 1; }
.page-horarios-alberca .pool-schedule-table, .page-horarios-alberca .class-schedule-table { overflow: hidden; border-color: #d9e7eb; box-shadow: none; }
.page-horarios-alberca .pool-schedule-table .schedule-table { min-width: 0; }
.page-horarios-alberca .pool-schedule-table th { background: #e8f6f0; color: #166b53; }
.page-horarios-alberca .pool-schedule-table td:first-child { width: 34%; color: var(--blue-950); font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; }
.page-horarios-alberca .pool-schedule-table tr:nth-child(even), .page-horarios-alberca .class-schedule-table tr:nth-child(even) { background: #f8fbfc; }
.page-horarios-alberca .pool-schedule-table tr:hover, .page-horarios-alberca .class-schedule-table tr:hover { background: #eef8f4; }
.page-horarios-alberca .class-schedule-table th { background: var(--blue-900); color: var(--white); }
.complementary-schedules { display: grid; gap: 20px; margin-top: 26px; padding: 26px; border: 1px solid #cee4de; border-radius: var(--radius-lg); background: linear-gradient(135deg, #eff9f5, #e8f3f7); }
.complementary-schedules h3 { margin: 5px 0 0; color: var(--blue-950); font-family: var(--font-display); font-size: 2rem; font-weight: 500; }
.complementary-schedule-grid { display: grid; gap: 12px; }
.complementary-schedule-grid article { padding: 18px; border-left: 4px solid #33b982; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: rgba(255, 255, 255, .88); box-shadow: 0 8px 20px rgba(9, 64, 80, .07); }
.complementary-schedule-grid article:last-child { border-left-color: #218eb6; }
.complementary-schedule-grid strong { color: var(--blue-950); font-family: var(--font-display); font-size: 1.45rem; font-weight: 600; }
.complementary-schedule-grid p { margin: 6px 0 0; color: var(--muted); line-height: 1.55; }

.temperature-hero { position: relative; overflow: hidden; padding: 72px 0; background: var(--blue-950); color: var(--white); }
.temperature-hero::after { content: ''; position: absolute; inset: 0; background: url('../img/agua-textura.jpg') center/cover; opacity: .18; }
.temperature-hero .container { position: relative; z-index: 1; }
.temperature-dashboard { display: grid; gap: 14px; margin-top: 35px; }
.temp-primary, .temp-secondary { min-width: 0; padding: 24px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.18); border-radius: var(--radius-md); backdrop-filter: blur(10px); }
.temp-primary strong { display: block; margin: 13px 0 18px; max-width: 100%; font-family: var(--font-display); font-size: clamp(4.5rem, 18vw, 8rem); font-weight: 500; line-height: .9; letter-spacing: -.04em; white-space: nowrap; }
.temp-secondary strong { display: block; margin: 12px 0 16px; max-width: 100%; font-family: var(--font-display); font-size: clamp(3rem, 11vw, 4.5rem); font-weight: 500; line-height: .95; letter-spacing: -.03em; white-space: nowrap; }
.temp-primary p, .temp-secondary p { margin: 0; line-height: 1.5; }
.temp-label { color: #b9d8e5; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.demo-note { margin-top: 20px; padding: 14px 17px; background: rgba(255,255,255,.1); border-radius: var(--radius-sm); color: #d5e8ef; font-size: 13px; }
.temperature-chart-card { padding: 20px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.temperature-chart-card--unavailable { min-height: 190px; display: grid; align-items: center; }
.temperature-chart-card--unavailable h3 { margin: 8px 0 0; color: var(--blue-900); font-family: var(--font-display); font-size: clamp(2rem, 7vw, 3rem); font-weight: 500; line-height: 1; }
.chart-card-top { display: grid; gap: 18px; }
.chart-card-top .temp-label { color: var(--blue-800); }
.chart-card-top p { max-width: 660px; margin: 8px 0 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.chart-stat { padding: 14px 16px; background: var(--blue-50); border-radius: var(--radius-sm); }
.chart-stat span { display: block; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.chart-stat strong { display: block; margin-top: 3px; color: var(--blue-900); font-family: var(--font-display); font-size: 2rem; font-weight: 500; line-height: 1; white-space: nowrap; }
.temperature-chart { height: clamp(220px, 52vw, 310px); margin-top: 25px; }
.temperature-chart svg { width: 100%; height: 100%; display: block; overflow: visible; }
.chart-grid line { stroke: var(--border); stroke-dasharray: 3 6; }
.chart-grid text, .chart-marker text { fill: var(--muted); font-family: var(--font-body); font-size: 12px; font-weight: 600; }
.chart-area { fill: url(#temperature-area); }
.chart-line { fill: none; stroke: var(--blue-700); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.chart-marker circle { fill: var(--blue-700); stroke: var(--white); stroke-width: 2; vector-effect: non-scaling-stroke; }
.chart-marker.is-estimated circle { fill: var(--white); stroke: var(--blue-700); stroke-dasharray: 2 2; }
.chart-reading { fill: #159b76; stroke: var(--white); stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.chart-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 7px; color: var(--muted); font-size: 12px; }
.chart-legend span { display: inline-flex; align-items: center; gap: 7px; }
.legend-line { width: 24px; height: 3px; background: var(--blue-700); border-radius: 999px; }
.legend-reading { width: 11px; height: 11px; border: 2px solid var(--white); border-radius: 50%; background: #159b76; box-shadow: 0 0 0 1px var(--blue-700); }
.legend-dot { width: 11px; height: 11px; border: 2px dashed var(--blue-700); border-radius: 50%; }
.chart-details { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--border); }
.chart-details summary { min-height: 44px; display: flex; align-items: center; color: var(--blue-800); cursor: pointer; font-weight: 700; }
.chart-table-wrap { max-height: 360px; margin-top: 12px; overflow: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); }
.chart-table-wrap table { width: 100%; min-width: 440px; border-collapse: collapse; }
.chart-table-wrap th, .chart-table-wrap td { padding: 11px 14px; text-align: left; border-bottom: 1px solid var(--border); font-size: 13px; }
.chart-table-wrap th { position: sticky; top: 0; background: var(--blue-50); color: var(--blue-900); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; }
.chart-table-wrap tr:last-child td { border-bottom: 0; }

/* Página de temperatura: la fotografía permanece fija mientras el contenido avanza. */
body.page-temperatura { background: var(--blue-950); }
.temperature-page-media { position: fixed; z-index: -2; inset: 0; pointer-events: none; background: url('../img/temperature-backdrop.jpg') 54% center / cover no-repeat; }
.temperature-page-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5, 27, 48, .78) 0%, rgba(7, 47, 76, .7) 42%, rgba(5, 28, 48, .86) 100%), linear-gradient(90deg, rgba(5, 28, 48, .36), rgba(5, 28, 48, .12) 70%); }
.page-temperatura main { position: relative; color: var(--white); }
.page-temperatura .temperature-hero { min-height: max(610px, calc(100svh - 78px)); display: grid; align-items: end; padding: 82px 0 70px; background: transparent; }
.page-temperatura .temperature-hero::after { display: none; }
.page-temperatura .breadcrumbs { color: #c7e6f0; }
.page-temperatura .breadcrumbs li:not(:last-child)::after { color: #9cc9d8; }
.page-temperatura .eyebrow { color: #c4f0f8; }
.page-temperatura .display-title, .page-temperatura .section-title { color: var(--white); }
.page-temperatura .section-copy { color: #d5eaf1; }
.page-temperatura .section-soft { background: transparent; }
.page-temperatura .temp-primary, .page-temperatura .temp-secondary, .page-temperatura .temperature-chart-card, .page-temperatura .content-card { position: relative; z-index: 0; isolation: isolate; padding: 26px 18px; background: transparent; border-color: transparent; box-shadow: none; color: var(--white); }
.page-temperatura .temp-primary, .page-temperatura .temp-secondary { backdrop-filter: none; }
.page-temperatura .temperature-chart-card::before, .page-temperatura .content-card::before { content: ''; position: absolute; z-index: -1; inset: -32px -24px; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(3, 25, 46, .88) 0%, rgba(5, 34, 58, .66) 48%, rgba(5, 34, 58, 0) 76%); filter: blur(13px); pointer-events: none; }
.page-temperatura .temp-primary { padding: 26px 18px 30px; }
.page-temperatura .temp-primary strong { margin: 11px 0 17px; font-size: clamp(5rem, 22vw, 9rem); line-height: .84; }
.page-temperatura .temp-secondary { align-self: end; padding: 18px; }
.page-temperatura .temp-secondary strong { margin: 8px 0 10px; font-size: clamp(2.25rem, 9vw, 3.5rem); line-height: .92; }
.page-temperatura .temp-secondary p { max-width: 26rem; font-size: .875rem; }
.page-temperatura .temp-primary strong, .page-temperatura .temp-secondary strong { color: #e8fbff; text-shadow: 0 3px 18px rgba(0, 16, 29, .88); }
.page-temperatura .temp-primary p, .page-temperatura .temp-secondary p { color: #d8eff5; text-shadow: 0 2px 12px rgba(0, 16, 29, .88); }
.page-temperatura .temp-label, .page-temperatura .chart-card-top .temp-label { color: #9ae7f5; text-shadow: 0 2px 12px rgba(0, 16, 29, .88); }
.page-temperatura .chart-card-top p, .page-temperatura .content-card p, .page-temperatura .content-card li { color: #e1f3f7; text-shadow: 0 2px 12px rgba(0, 16, 29, .88); }
.page-temperatura .temperature-chart-card--unavailable h3 { color: #eafcff; text-shadow: 0 3px 18px rgba(0, 16, 29, .88); }
.page-temperatura .chart-stat { padding: 6px 0; background: transparent; }
.page-temperatura .chart-stat span { color: #b9e7f0; text-shadow: 0 2px 12px rgba(0, 16, 29, .88); }
.page-temperatura .chart-stat strong { color: #e8fbff; text-shadow: 0 3px 18px rgba(0, 16, 29, .88); }
.page-temperatura .chart-grid line { stroke: rgba(223, 247, 251, .34); }
.page-temperatura .chart-grid text, .page-temperatura .chart-marker text { fill: #e1f3f7; }
.page-temperatura .chart-area { fill: url(#temperature-area); opacity: .96; }
.page-temperatura .chart-line { stroke: url(#temperature-line); }
.page-temperatura .chart-marker circle { fill: #87e58b; stroke: var(--blue-950); }
.page-temperatura .chart-marker.is-estimated circle { fill: var(--blue-950); stroke: #8ae5f3; }
.page-temperatura .chart-reading { fill: #87e58b; stroke: var(--blue-950); }
.page-temperatura .chart-legend { color: #d9eef4; text-shadow: 0 2px 12px rgba(0, 16, 29, .88); }
.page-temperatura .legend-line { background: linear-gradient(90deg, #8ae5f3, #37d2b1 52%, #87e58b); }
.page-temperatura .legend-reading { border-color: var(--blue-950); background: #87e58b; box-shadow: 0 0 0 1px #87e58b; }
.page-temperatura .legend-dot { border-color: #8ae5f3; }
.page-temperatura .chart-details { border-color: rgba(223, 247, 251, .26); }
.page-temperatura .chart-details summary { color: #b8edf6; text-shadow: 0 2px 12px rgba(0, 16, 29, .88); }
.page-temperatura .chart-table-wrap { border-color: transparent; background: transparent; }
.page-temperatura .chart-table-wrap th { background: transparent; color: #bcecf5; }
.page-temperatura .chart-table-wrap td { border-color: rgba(223, 247, 251, .18); color: #e4f5f8; }
.page-temperatura .btn { border-color: rgba(231, 251, 255, .76); background: rgba(4, 28, 49, .5); color: var(--white); backdrop-filter: blur(6px); }
.page-temperatura .btn-primary { background: #dff8fc; border-color: #dff8fc; color: var(--blue-950); }
.page-temperatura .content-card h2, .page-temperatura .content-card h3 { color: #eafcff; text-shadow: 0 3px 18px rgba(0, 16, 29, .88); }

.pass-grid { display: grid; gap: 12px; }
.pass-card { display: grid; grid-template-columns: 1fr auto; gap: 8px 18px; padding: 21px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); }
.pass-card h2 { margin: 0; font-family: var(--font-display); font-size: 1.8rem; font-weight: 500; }
.pass-card strong { color: var(--blue-900); font-size: 1.2rem; }
.pass-card p { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 13px; }

.split-grid { display: grid; gap: 18px; }
.media-block { overflow: hidden; min-height: 340px; border-radius: var(--radius-lg); }
.media-block img { width: 100%; height: 100%; object-fit: cover; }
.map-frame { width: 100%; min-height: 430px; border: 0; border-radius: var(--radius-lg); }
.contact-cards { display: grid; gap: 12px; }
.contact-card { padding: 22px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); }
.contact-card .icon { color: var(--blue-800); }
.contact-card h2 { margin: 24px 0 8px; font-family: var(--font-display); font-size: 2rem; font-weight: 500; }
.contact-card p { color: var(--muted); }
.placeholder-note { padding: 20px; border: 1px dashed var(--blue-600); border-radius: var(--radius-md); background: var(--blue-50); color: var(--blue-900); }

.site-footer { padding: 58px 0 20px; background: var(--blue-950); color: var(--white); }
.footer-grid { display: grid; gap: 34px; }
.footer-brand { display: flex; align-items: center; gap: 15px; }
.footer-brand img { width: 62px; filter: invert(1); }
.footer-brand strong { font-family: var(--font-display); font-size: 1.6rem; font-weight: 500; }
.footer-brand p, .site-footer p { margin: 5px 0 0; color: #bcd4df; font-size: 13px; }
.footer-heading { margin: 0 0 13px; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.footer-links, .social-links { display: grid; gap: 9px; }
.site-footer a { color: #d8e7ed; }
.footer-bottom { display: grid; gap: 8px; margin-top: 42px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.14); }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (min-width: 700px) {
  .tennis-price-grid { grid-template-columns: repeat(2, 1fr); }
  .announcement-card { grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; padding: 30px; }
  .announcement-card .btn { align-self: center; justify-self: end; }
  .container { width: min(var(--container), calc(100% - 56px)); }
  .narrow { width: min(820px, calc(100% - 56px)); }
  .hero-lower { grid-template-columns: 1fr auto; align-items: end; }
  .fact-strip { grid-template-columns: repeat(4, 1fr); }
  .card-grid, .activity-grid, .plan-grid, .pass-grid, .contact-cards { grid-template-columns: repeat(2, 1fr); }
  .price-panels { grid-template-columns: repeat(2, 1fr); }
  .temperature-dashboard { grid-template-columns: 1.4fr .8fr; }
  .page-temperatura .temperature-hero { min-height: max(660px, calc(100svh - var(--header-height))); }
  .temperature-chart-card { padding: 30px; }
  .chart-card-top { grid-template-columns: 1fr auto; align-items: start; }
  .chart-stat { min-width: 180px; }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-bottom { grid-template-columns: 1fr auto; }
}

@media (max-width: 699px) {
  .patriotic-header-art img { width: 100%; margin-left: 0; object-position: center 16%; }
  .patriotic-header-art::after { background: linear-gradient(90deg, rgba(0,43,36,.46), rgba(0,43,36,.8) 31%, rgba(0,43,36,.8) 69%, rgba(0,43,36,.46)), linear-gradient(180deg, rgba(0,24,20,.03), rgba(0,24,20,.26)); }
  .chart-table-wrap { max-height: none; overflow: visible; border: 0; }
  .chart-table-wrap table, .chart-table-wrap thead, .chart-table-wrap tbody, .chart-table-wrap tr, .chart-table-wrap th, .chart-table-wrap td { display: block; width: 100%; min-width: 0; }
  .chart-table-wrap thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .chart-table-wrap tr { padding: 11px 0; border-bottom: 1px solid var(--border); }
  .chart-table-wrap tr:last-child { border-bottom: 0; }
  .chart-table-wrap td { display: grid; grid-template-columns: minmax(105px, .78fr) minmax(0, 1.22fr); gap: 12px; padding: 5px 0; border: 0; text-align: right; }
  .chart-table-wrap td::before { content: attr(data-label); color: var(--blue-900); font-size: 11px; font-weight: 700; letter-spacing: .07em; text-align: left; text-transform: uppercase; }
  .page-temperatura .chart-table-wrap tr { border-color: rgba(223, 247, 251, .18); }
  .page-temperatura .chart-table-wrap td::before { color: #bcecf5; }
}

@media (min-width: 1020px) {
  :root { --header-height: 88px; }
  html[data-season='patrio'] { --header-height: 92px; }
  .nav-shell { min-height: 88px; }
  html[data-season='patrio'] .nav-shell { min-height: 92px; }
  .brand img { width: 56px; height: 56px; }
  .menu-toggle { display: none; }
  .site-nav { position: static; height: auto; display: flex; align-items: center; gap: 1px; padding: 0; overflow: visible; background: transparent; }
  .site-nav a { min-height: 46px; padding: 0 10px; font-size: 13px; }
  html[data-season='patrio'] .site-nav a { color: #fffdf4; text-shadow: 0 2px 8px rgba(0,22,18,.84); }
  html[data-season='patrio'] .site-nav a:hover,
  html[data-season='patrio'] .site-nav a[aria-current='page'] { background: rgba(255,255,255,.15); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.16); }
  .site-nav .external-link { margin: 0 0 0 5px; padding-inline: 14px; }
  .hero-home { min-height: calc(100svh - var(--header-height)); padding-top: 120px; }
  .section-pad { padding: 104px 0; }
  .section-head { grid-template-columns: 1.25fr .75fr; align-items: end; margin-bottom: 48px; }
  .story-card { padding: 42px; }
  .card-grid { grid-template-columns: repeat(4, 1fr); }
  .feature-card.featured { grid-column: span 2; }
  .page-hero { padding: 92px 0 74px; }
  .page-hero-grid { grid-template-columns: 1.2fr .8fr; }
  .hero-image { min-height: 470px; }
  .plan-grid { grid-template-columns: repeat(3, 1fr); }
  .plan-detail { grid-template-columns: .86fr 1.14fr; align-items: start; }
  .plan-summary { position: sticky; top: 108px; padding: 34px; }
  .activity-grid { grid-template-columns: repeat(4, 1fr); }
  .activity-card:first-child { grid-column: span 2; background: var(--blue-900); color: var(--white); }
  .activity-card:first-child p { color: #d8e9f0; }
  .activity-card:first-child .activity-icon { background-color: var(--white); }
  .pass-grid { grid-template-columns: repeat(3, 1fr); }
  .split-grid { grid-template-columns: repeat(2, 1fr); align-items: center; }
  .contact-cards { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { grid-template-columns: 1.2fr .75fr 1fr .75fr; }
}

@media (min-width: 1280px) {
  .site-nav a { padding-inline: 13px; font-size: 14px; }
}

@media (max-width: 420px) {
  .temperature-card { padding: 18px; }
  .temperature-card-top { align-items: flex-start; }
  .temperature-card-top span { max-width: 150px; }
  .demo-badge { flex: 0 0 auto; }
  .temperature-reading strong { font-size: clamp(3.5rem, 18vw, 4.25rem); }
  .temp-primary, .temp-secondary { padding: 20px; }
  .temp-primary strong { font-size: clamp(4rem, 20vw, 5rem); }
  .temp-secondary strong { font-size: clamp(2.75rem, 14vw, 3.5rem); }
  .actions .btn { width: 100%; }
}

/* Las tablas conservan su estructura semántica, pero se leen como fichas en teléfono. */
@media (max-width: 720px) {
  .schedule-table-wrap, .chart-table-wrap { overflow: hidden; }
  .schedule-table, .chart-table-wrap table { display: block; width: 100%; min-width: 0; }
  .schedule-table thead, .chart-table-wrap thead { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .schedule-table tbody, .chart-table-wrap tbody { display: grid; gap: 12px; }
  .schedule-table tr, .chart-table-wrap tr { display: block; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-sm); }
  .schedule-table td, .chart-table-wrap td { display: grid; grid-template-columns: minmax(92px, 40%) minmax(0, 1fr); gap: 12px; align-items: start; padding: 12px 14px; border-bottom: 1px solid var(--border); overflow-wrap: anywhere; }
  .schedule-table td::before, .chart-table-wrap td::before { content: attr(data-label); color: var(--blue-900); font-size: 11px; font-weight: 800; letter-spacing: .06em; line-height: 1.35; text-transform: uppercase; }
  .chart-table-wrap td:nth-child(1)::before { content: 'Fecha'; }
  .chart-table-wrap td:nth-child(2)::before { content: 'Temperatura'; }
  .chart-table-wrap td:nth-child(3)::before { content: 'Origen'; }
  .schedule-table tr td:last-child, .chart-table-wrap tr td:last-child { border-bottom: 0; }
  .page-temperatura .chart-table-wrap tr { border-color: rgba(223, 247, 251, .3); }
  .page-temperatura .chart-table-wrap td { border-bottom-color: rgba(223, 247, 251, .18); }
  .page-temperatura .chart-table-wrap td::before { color: #bcecf5; }
  .page-horarios-alberca .schedule-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
  .page-horarios-alberca .schedule-tab { width: 100%; min-height: 48px; padding: 8px 10px; line-height: 1.15; }
  .page-horarios-alberca .schedule-panel { padding: 16px 12px 12px; }
  .page-horarios-alberca .schedule-panel-heading { display: block; margin: 3px 7px 16px; }
  .page-horarios-alberca .schedule-panel-heading h3 { font-size: 2rem; }
  .page-horarios-alberca .pool-schedule-table, .page-horarios-alberca .class-schedule-table { border: 0; background: transparent; }
  .page-horarios-alberca .schedule-table tbody { gap: 10px; }
  .page-horarios-alberca .pool-schedule-table tr, .page-horarios-alberca .class-schedule-table tr { border: 1px solid #d4e4e9; border-left: 4px solid #33b982; border-radius: var(--radius-sm); background: var(--white); box-shadow: 0 7px 17px rgba(10, 57, 78, .08); }
  .page-horarios-alberca .class-schedule-table tr { border-left-color: #218eb6; }
  .page-horarios-alberca .schedule-table td { padding: 13px 12px; background: transparent; }
  .page-horarios-alberca .pool-schedule-table td:first-child { width: auto; font-size: 1.1rem; }
  .page-horarios-alberca .pool-schedule-table td::before, .page-horarios-alberca .class-schedule-table td::before { color: #236a7d; }
  .complementary-schedules { padding: 20px 16px; }
  .complementary-schedule-grid article { padding: 16px; }
}

/* Actividades: color e iconografía para reconocer cada disciplina al instante. */
.page-actividades .activity-grid { gap: 16px; }
.page-actividades .activity-card { --activity-accent: #168eb8; --activity-tint: #e8f6fa; position: relative; isolation: isolate; min-height: 232px; padding: 24px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--activity-accent) 28%, white); border-radius: var(--radius-lg); background: linear-gradient(145deg, var(--white), var(--activity-tint)); box-shadow: 0 11px 26px rgba(10, 57, 78, .08); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; }
.page-actividades .activity-card::before { content: ''; position: absolute; z-index: -1; width: 152px; height: 152px; top: -84px; right: -66px; border-radius: 50%; background: var(--activity-accent); opacity: .13; }
.page-actividades .activity-card::after { content: ''; position: absolute; z-index: -1; width: 58px; height: 4px; left: 24px; bottom: 0; border-radius: 999px 999px 0 0; background: var(--activity-accent); }
.page-actividades .activity-icon { width: 58px; height: 58px; background-color: var(--activity-accent); filter: drop-shadow(0 7px 8px color-mix(in srgb, var(--activity-accent) 30%, transparent)); transition: transform .24s ease, filter .24s ease; }
.page-actividades .activity-card h3 { margin: 30px 0 6px; color: var(--blue-950); font-size: 2rem; line-height: .98; }
.page-actividades .activity-card p { color: #406471; font-size: 14px; line-height: 1.45; }
.page-actividades .activity-card--natacion, .page-actividades .activity-card--aquaerobics { --activity-accent: #109ac2; --activity-tint: #e8f7fb; }
.page-actividades .activity-card--yoga, .page-actividades .activity-card--pilates { --activity-accent: #8c69ba; --activity-tint: #f4eefb; }
.page-actividades .activity-card--acondicionamiento, .page-actividades .activity-card--aerobics { --activity-accent: #d87547; --activity-tint: #fdf0e8; }
.page-actividades .activity-card--zumba { --activity-accent: #d25985; --activity-tint: #fcedf3; }
.page-actividades .activity-card--karate { --activity-accent: #bf5c43; --activity-tint: #fceee9; }
.page-actividades .activity-card--basquetbol { --activity-accent: #d08c25; --activity-tint: #fcf5e6; }
.page-actividades .activity-card--voleibol { --activity-accent: #2d9d70; --activity-tint: #e9f7ef; }
.page-actividades .activity-card--vapor { --activity-accent: #527da9; --activity-tint: #eef3f9; }
@media (hover: hover) and (pointer: fine) {
  .page-actividades .activity-card:hover { transform: translateY(-6px); border-color: color-mix(in srgb, var(--activity-accent) 56%, white); box-shadow: 0 21px 36px rgba(10, 57, 78, .15); }
  .page-actividades .activity-card:hover .activity-icon { transform: rotate(-7deg) scale(1.1); filter: drop-shadow(0 10px 10px color-mix(in srgb, var(--activity-accent) 44%, transparent)); }
}
.additional-activities-section { background: linear-gradient(145deg, #eef8f4, #edf6fa); }
.additional-activity-grid { display: grid; gap: 16px; }
.additional-activity-card { --activity-accent: #2d9d70; --activity-tint: #e9f7ef; position: relative; isolation: isolate; min-height: 340px; display: flex; flex-direction: column; overflow: hidden; padding: 27px; border: 1px solid color-mix(in srgb, var(--activity-accent) 32%, white); border-top: 5px solid var(--activity-accent); border-radius: var(--radius-lg); background: linear-gradient(145deg, var(--white), var(--activity-tint)); box-shadow: 0 14px 30px rgba(10,57,78,.1); transition: transform .24s ease, box-shadow .24s ease; }
.additional-activity-card::after { content: ''; position: absolute; z-index: -1; width: 170px; height: 170px; top: -98px; right: -82px; border-radius: 50%; background: var(--activity-accent); opacity: .14; }
.additional-activity-card--basquetbol { --activity-accent: #d08c25; --activity-tint: #fcf5e6; }
.additional-activity-card--karate { --activity-accent: #bf5c43; --activity-tint: #fceee9; }
.additional-activity-label { align-self: flex-start; margin-top: 22px; padding: 6px 10px; border-radius: 999px; background: color-mix(in srgb, var(--activity-accent) 14%, white); color: color-mix(in srgb, var(--activity-accent) 78%, var(--blue-950)); font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.additional-activity-card h3 { margin: 15px 0 7px; color: var(--blue-950); font-family: var(--font-display); font-size: clamp(2.25rem, 9vw, 3.25rem); font-weight: 500; line-height: .94; }
.additional-activity-schedule { margin: 0; color: #426371; line-height: 1.55; }
.additional-activity-prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: auto 0 0; padding-top: 24px; }
.additional-activity-prices div { padding: 14px 12px; border: 1px solid color-mix(in srgb, var(--activity-accent) 22%, white); border-radius: var(--radius-sm); background: rgba(255,255,255,.7); }
.additional-activity-prices dt { color: #55707c; font-size: 10px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.additional-activity-prices dd { margin: 5px 0 0; color: var(--activity-accent); font-family: var(--font-display); font-size: 1.7rem; font-weight: 600; line-height: 1; }
.additional-activity-card .text-link { align-self: flex-start; margin-top: 17px; color: color-mix(in srgb, var(--activity-accent) 82%, var(--blue-950)); }
.additional-activity-requirements { margin-top: 22px; }
@media (min-width: 700px) { .additional-activity-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (hover: hover) and (pointer: fine) {
  .additional-activity-card:hover { transform: translateY(-6px); box-shadow: 0 23px 40px rgba(10,57,78,.16); }
  .additional-activity-card:hover .activity-icon { transform: rotate(-7deg) scale(1.08); }
}
.activity-feature-card { --feature-accent: #139cc3; position: relative; overflow: hidden; border: 1px solid color-mix(in srgb, var(--feature-accent) 26%, white); border-left: 5px solid var(--feature-accent); background: linear-gradient(135deg, var(--white), color-mix(in srgb, var(--feature-accent) 11%, white)); box-shadow: 0 14px 30px rgba(10, 57, 78, .08); }
.activity-feature-card::after { content: ''; position: absolute; width: 138px; height: 138px; right: -76px; top: -75px; border-radius: 50%; background: var(--feature-accent); opacity: .12; pointer-events: none; }
.activity-feature-card--vapor { --feature-accent: #527da9; }
.activity-feature-card h2 { color: var(--blue-950); }
.activity-feature-card .eyebrow { color: color-mix(in srgb, var(--feature-accent) 74%, var(--blue-950)); }
@media (max-width: 720px) {
  .page-actividades .activity-card { align-items: center; justify-content: center; min-height: 218px; text-align: center; }
  .page-actividades .activity-card::after { left: 50%; transform: translateX(-50%); }
  .page-actividades .activity-card h3 { margin: 22px 0 7px; }
  .additional-activity-card { min-height: 330px; align-items: center; padding: 24px 20px; text-align: center; }
  .additional-activity-label { align-self: center; }
  .additional-activity-prices { width: 100%; }
  .additional-activity-card .text-link { align-self: center; }
  .activity-feature-card { text-align: center; }
  .activity-feature-card .eyebrow { display: block; }
}

/* Horario al aire libre: prioridad visual para día, clase y docente. */
.page-actividades .outdoor-schedule-table { overflow: hidden; border: 1px solid #cce3e8; border-radius: var(--radius-lg); box-shadow: 0 16px 30px rgba(10, 57, 78, .09); }
.page-actividades .outdoor-schedule-table .schedule-table { min-width: 0; }
.page-actividades .outdoor-schedule-table th { padding-block: 17px; background: linear-gradient(100deg, var(--blue-950), #176e91); color: var(--white); }
.page-actividades .outdoor-schedule-table td { padding-block: 17px; color: #365c6a; }
.page-actividades .outdoor-schedule-table td:first-child { width: 19%; color: #0d6681; font-family: var(--font-display); font-size: 1.22rem; font-weight: 600; }
.page-actividades .outdoor-schedule-table td:nth-child(3) { color: var(--blue-950); font-weight: 700; }
.page-actividades .outdoor-schedule-table tr:nth-child(even) { background: #f1f9fa; }
.page-actividades .outdoor-schedule-table tr { transition: background .2s ease; }
@media (hover: hover) and (pointer: fine) {
  .page-actividades .outdoor-schedule-table tr:hover { background: #e1f4ef; }
}
@media (max-width: 720px) {
  .page-actividades .outdoor-schedule-table { border: 0; background: transparent; box-shadow: none; }
  .page-actividades .outdoor-schedule-table tbody { gap: 12px; }
  .page-actividades .outdoor-schedule-table tr { border: 1px solid #cae2e7; border-left: 5px solid #159dc0; border-radius: var(--radius-md); background: linear-gradient(135deg, #ffffff, #edf9f8); box-shadow: 0 9px 19px rgba(10, 57, 78, .09); }
  .page-actividades .outdoor-schedule-table tr:nth-child(even) { border-left-color: #36aa78; background: linear-gradient(135deg, #ffffff, #eef9f4); }
  .page-actividades .outdoor-schedule-table td { padding: 13px 14px; background: transparent; }
  .page-actividades .outdoor-schedule-table td:first-child { width: auto; color: #184e63; font-family: var(--font-body); font-size: inherit; font-weight: 600; }
  .page-actividades .outdoor-schedule-table td::before { color: #1b718c; }
}

/* Sistema de tarjetas para páginas internas. El inicio y Temperatura conservan su lenguaje propio. */
body:not(.page-inicio):not(.page-temperatura) .content-card:not(.activity-feature-card) { --card-accent: #168eb8; position: relative; isolation: isolate; overflow: hidden; border: 1px solid color-mix(in srgb, var(--card-accent) 28%, white); border-left: 5px solid var(--card-accent); border-radius: var(--radius-lg); background: linear-gradient(135deg, var(--white), color-mix(in srgb, var(--card-accent) 9%, white)); box-shadow: 0 13px 28px rgba(10, 57, 78, .08); transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; }
body:not(.page-inicio):not(.page-temperatura) .content-card:not(.activity-feature-card)::after { content: ''; position: absolute; z-index: 0; width: 158px; height: 158px; right: -80px; top: -84px; border-radius: 50%; background: var(--card-accent); opacity: .12; pointer-events: none; }
body:not(.page-inicio):not(.page-temperatura) .content-card:not(.activity-feature-card) > * { position: relative; z-index: 1; }
body.page-triatlon .content-card { --card-accent: #2d9d70; }
body.page-planes .plan-detail .content-card { --card-accent: #5666b7; }
body.page-natacion .content-card { --card-accent: #109ac2; }
@media (hover: hover) and (pointer: fine) {
  body:not(.page-inicio):not(.page-temperatura) .content-card:not(.activity-feature-card):hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--card-accent) 54%, white); box-shadow: 0 20px 36px rgba(10, 57, 78, .14); }
}

.page-natacion .feature-card { --feature-accent: #168eb8; position: relative; isolation: isolate; overflow: hidden; border: 1px solid color-mix(in srgb, var(--feature-accent) 26%, white); border-radius: var(--radius-lg); background: linear-gradient(145deg, var(--white), color-mix(in srgb, var(--feature-accent) 10%, white)); box-shadow: 0 12px 27px rgba(10, 57, 78, .08); transition: transform .24s ease, box-shadow .24s ease; }
.page-natacion .feature-card::after { content: ''; position: absolute; z-index: 0; width: 140px; height: 140px; right: -66px; top: -70px; border-radius: 50%; background: var(--feature-accent); opacity: .13; }
.page-natacion .feature-card > * { position: relative; z-index: 1; }
.page-natacion .feature-card .icon-wrap { background: color-mix(in srgb, var(--feature-accent) 15%, white); color: var(--feature-accent); transition: transform .24s ease; }
.page-natacion .feature-card h2, .page-natacion .feature-card h3 { color: var(--blue-950); }
.page-natacion .feature-card p { color: #406471; }
.page-natacion .feature-card.featured { --feature-accent: #1eac81; background: linear-gradient(145deg, #0b536a, #0c765f); border-color: transparent; }
.page-natacion .feature-card.featured h2, .page-natacion .feature-card.featured h3 { color: var(--white); }
.page-natacion .feature-card.featured p, .page-natacion .feature-card.featured .text-link { color: #e1f4ef; }
.page-natacion .feature-card.featured .icon-wrap { background: rgba(255,255,255,.15); color: var(--white); }
.page-natacion .feature-card:nth-child(2) { --feature-accent: #d28a26; }
.page-natacion .feature-card:nth-child(3) { --feature-accent: #8a69bc; }
@media (hover: hover) and (pointer: fine) {
  .page-natacion .feature-card:hover { transform: translateY(-5px); box-shadow: 0 21px 36px rgba(10, 57, 78, .15); }
  .page-natacion .feature-card:hover .icon-wrap { transform: rotate(-7deg) scale(1.08); }
}

.page-pases .pass-card { --pass-accent: #1696bd; position: relative; isolation: isolate; overflow: hidden; border: 1px solid color-mix(in srgb, var(--pass-accent) 28%, white); border-left: 5px solid var(--pass-accent); border-radius: var(--radius-lg); background: linear-gradient(135deg, var(--white), color-mix(in srgb, var(--pass-accent) 9%, white)); box-shadow: 0 11px 25px rgba(10, 57, 78, .08); transition: transform .24s ease, box-shadow .24s ease; }
.page-pases .pass-card::after { content: ''; position: absolute; z-index: 0; width: 92px; height: 92px; right: -48px; top: -48px; border-radius: 50%; background: var(--pass-accent); opacity: .15; }
.page-pases .pass-card > * { position: relative; z-index: 1; }
.page-pases .pass-card h2 { color: var(--blue-950); }
.page-pases .pass-card strong { color: var(--pass-accent); font-family: var(--font-display); font-size: 1.55rem; }
.page-pases .pass-card p { color: #416371; }
.page-pases .pass-card:nth-child(3n + 2) { --pass-accent: #2b9b71; }
.page-pases .pass-card:nth-child(3n) { --pass-accent: #c27a2d; }
@media (hover: hover) and (pointer: fine) {
  .page-pases .pass-card:hover { transform: translateY(-5px); box-shadow: 0 20px 35px rgba(10, 57, 78, .14); }
}

/* Club de Tenis: precios legibles y reserva visible sin inventar horarios. */
.tennis-price-grid { display: grid; gap: 16px; }
.tennis-price-card { --tennis-accent: #168eb8; position: relative; isolation: isolate; min-height: 280px; display: flex; flex-direction: column; overflow: hidden; padding: 28px; border: 1px solid color-mix(in srgb, var(--tennis-accent) 32%, white); border-radius: var(--radius-lg); background: linear-gradient(145deg, var(--white), color-mix(in srgb, var(--tennis-accent) 10%, white)); box-shadow: 0 14px 30px rgba(10, 57, 78, .1); }
.tennis-price-card:nth-child(2) { --tennis-accent: #2b9b71; }
.tennis-price-card::after { content: ''; position: absolute; z-index: -1; width: 190px; height: 190px; top: -105px; right: -88px; border-radius: 50%; background: var(--tennis-accent); opacity: .16; }
.tennis-price-card .tennis-audience { align-self: flex-start; padding: 6px 11px; border-radius: 999px; background: color-mix(in srgb, var(--tennis-accent) 14%, white); color: color-mix(in srgb, var(--tennis-accent) 78%, var(--blue-950)); font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.tennis-price-card h2 { margin: 34px 0 6px; font-family: var(--font-display); font-size: clamp(2.1rem, 8vw, 3.5rem); font-weight: 500; line-height: .95; }
.tennis-price-card p { margin: 0; color: var(--muted); }
.tennis-price-card strong { margin-top: auto; padding-top: 24px; color: var(--tennis-accent); font-family: var(--font-display); font-size: clamp(3.5rem, 15vw, 5.6rem); font-weight: 500; line-height: .8; letter-spacing: -.04em; white-space: nowrap; }
.tennis-price-card strong span { font-family: var(--font-body); font-size: 1rem; font-weight: 700; letter-spacing: 0; }
.tennis-reserve { display: grid; gap: 18px; }
.tennis-facts { display: grid; gap: 0; margin: 28px 0 0; padding: 0; border-top: 1px solid var(--border); list-style: none; }
.tennis-facts li { display: flex; justify-content: space-between; gap: 18px; padding: 14px 0; border-bottom: 1px solid var(--border); color: var(--muted); }
.tennis-facts strong { color: var(--blue-950); text-align: right; }
.tennis-photo { position: relative; min-height: 560px; }
.tennis-photo img { position: absolute; inset: 0; }

.tennis-promo-section { background: linear-gradient(145deg, #edf8f3, #edf6fa); }
.tennis-promo { position: relative; isolation: isolate; overflow: hidden; padding: 25px; border: 1px solid #8dcdb8; border-radius: var(--radius-lg); background: linear-gradient(145deg, #075142, var(--blue-950)); color: var(--white); box-shadow: 0 26px 60px rgba(5, 42, 58, .22); }
.tennis-promo::before { content: ''; position: absolute; z-index: -1; width: 330px; height: 330px; top: -210px; right: -145px; border-radius: 50%; background: #40c592; opacity: .34; }
.tennis-promo::after { content: ''; position: absolute; z-index: -1; width: 230px; height: 230px; left: -130px; bottom: -155px; border-radius: 50%; background: var(--blue-500); opacity: .24; }
.tennis-promo-head { display: grid; gap: 18px; }
.promo-kicker, .promo-shift { color: #9eefd0; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.tennis-promo-head h2 { max-width: 760px; margin: 10px 0 0; font-family: var(--font-display); font-size: clamp(3rem, 12vw, 6.5rem); font-weight: 500; line-height: .88; letter-spacing: -.035em; }
.promo-validity { align-self: start; justify-self: start; padding: 8px 12px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; background: rgba(255,255,255,.11); color: #e9fff7; font-size: 13px; font-weight: 700; white-space: nowrap; }
.promo-benefits { display: grid; gap: 12px; margin: 30px 0; }
.promo-benefit { display: grid; grid-template-columns: auto 1fr; gap: 14px; padding: 18px; border: 1px solid rgba(255,255,255,.16); border-radius: var(--radius-md); background: rgba(255,255,255,.1); }
.promo-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; background: #dff8ed; color: #096149; }
.promo-benefit strong { display: block; font-family: var(--font-display); font-size: 1.75rem; font-weight: 500; line-height: 1; }
.promo-benefit p { margin: 7px 0 0; color: #d9eee8; }
.promo-schedule-grid { display: grid; gap: 12px; }
.promo-schedule-card { padding: 20px; border-radius: var(--radius-md); background: rgba(251,250,245,.95); color: var(--ink); }
.promo-schedule-card:nth-child(2) { background: rgba(241,250,252,.95); }
.promo-schedule-card .promo-shift { color: #187a5d; }
.promo-schedule-card h3 { margin: 8px 0 20px; font-family: var(--font-display); font-size: 2rem; font-weight: 500; line-height: 1; }
.promo-schedule-card ul { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.promo-schedule-card li { display: grid; gap: 4px; padding: 13px 0; border-top: 1px solid var(--border); }
.promo-schedule-card li strong { color: var(--blue-950); font-size: 14px; }
.promo-schedule-card li span { color: #466675; }
.promo-footer { display: grid; gap: 18px; margin-top: 24px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.2); }
.promo-footer p { margin: 0; color: #d8ece6; line-height: 1.65; }
.promo-footer .btn { justify-self: start; }

@media (hover: hover) and (pointer: fine) {
  .tennis-price-card { transition: transform .24s ease, box-shadow .24s ease; }
  .tennis-price-card:hover { transform: translateY(-5px); box-shadow: 0 22px 38px rgba(10, 57, 78, .16); }
}

@media (min-width: 700px) {
  .tennis-promo { padding: 38px; }
  .tennis-promo-head { grid-template-columns: 1fr auto; align-items: start; }
  .promo-validity { justify-self: end; }
  .promo-benefits, .promo-schedule-grid { grid-template-columns: repeat(2, 1fr); }
  .promo-footer { grid-template-columns: 1fr auto; align-items: center; }
}

.page-contacto .contact-card { --contact-accent: #168eb8; position: relative; isolation: isolate; overflow: hidden; border: 1px solid color-mix(in srgb, var(--contact-accent) 28%, white); border-top: 5px solid var(--contact-accent); border-radius: var(--radius-lg); background: linear-gradient(145deg, var(--white), color-mix(in srgb, var(--contact-accent) 9%, white)); box-shadow: 0 12px 27px rgba(10, 57, 78, .08); transition: transform .24s ease, box-shadow .24s ease; }
.page-contacto .contact-card::after { content: ''; position: absolute; z-index: 0; width: 128px; height: 128px; right: -62px; top: -68px; border-radius: 50%; background: var(--contact-accent); opacity: .13; }
.page-contacto .contact-card > * { position: relative; z-index: 1; }
.page-contacto .contact-card .icon { color: var(--contact-accent); transition: transform .24s ease; }
.page-contacto .contact-card h2 { color: var(--blue-950); }
.page-contacto .contact-card p { color: #406471; }
.page-contacto .contact-card:nth-child(2) { --contact-accent: #2b9b71; }
.page-contacto .contact-card:nth-child(3) { --contact-accent: #8a69bc; }
@media (hover: hover) and (pointer: fine) {
  .page-contacto .contact-card:hover { transform: translateY(-5px); box-shadow: 0 21px 36px rgba(10, 57, 78, .14); }
  .page-contacto .contact-card:hover .icon { transform: rotate(-7deg) scale(1.1); }
}

.page-planes .plan-summary { position: relative; isolation: isolate; overflow: hidden; border: 1px solid #1f7793; background: linear-gradient(145deg, var(--blue-950), #0d6e78); box-shadow: 0 18px 35px rgba(5, 42, 64, .2); }
.page-planes .plan-summary::after { content: ''; position: absolute; z-index: 0; width: 220px; height: 220px; right: -112px; top: -120px; border-radius: 50%; background: #36c996; opacity: .22; }
.page-planes .plan-summary > * { position: relative; z-index: 1; }
.page-planes .price-panel { border: 1px solid rgba(218, 250, 242, .2); background: rgba(255,255,255,.12); transition: transform .22s ease, background .22s ease; }
@media (hover: hover) and (pointer: fine) { .page-planes .price-panel:hover { transform: translateY(-3px); background: rgba(255,255,255,.18); } }

body:not(.page-inicio):not(.page-temperatura) .notice, .page-contacto .placeholder-note { position: relative; overflow: hidden; border: 1px solid #f1ca97; border-left: 5px solid #cf7940; border-radius: var(--radius-md); background: linear-gradient(135deg, #fff8ef, #fff1e2); box-shadow: 0 8px 18px rgba(124, 73, 27, .08); }
.page-contacto .placeholder-note { border-color: #badde7; border-left-color: #168eb8; background: linear-gradient(135deg, #effaff, #e7f5fa); color: var(--blue-900); }
body:not(.page-inicio):not(.page-temperatura) .media-block, .page-contacto .map-frame { box-shadow: 0 18px 35px rgba(10, 57, 78, .14); }

/* Páginas inmersivas: video fijo y contenido translúcido, siguiendo el lenguaje del inicio. */
.page-natacion,
.page-triatlon,
.page-404 { background: transparent; }
.immersive-page-media { position: fixed; z-index: -3; inset: 0; overflow: hidden; background: var(--blue-950) center / cover no-repeat; pointer-events: none; }
.immersive-page-media video { width: 100%; height: 100%; object-fit: cover; }
.immersive-page-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(3,27,47,.88), rgba(3,27,47,.25) 72%), linear-gradient(0deg, rgba(3,27,47,.72), rgba(3,27,47,.06) 64%); }
.immersive-page-media--natacion { background-image: url('../img/alberca-video-poster.jpg'); }
.immersive-page-media--triatlon { background-image: url('../img/triatlon-video-poster.jpg'); }
.immersive-page-media--triatlon::after { background: linear-gradient(90deg, rgba(3,29,50,.9), rgba(3,29,50,.2) 72%), linear-gradient(0deg, rgba(4,32,50,.72), rgba(4,32,50,.06) 66%); }
.immersive-page-media--error { background-image: url('../img/oso-404-poster.jpg'); }
.immersive-page-media--error::after { background: linear-gradient(90deg, rgba(3,27,47,.92), rgba(3,27,47,.28) 76%), linear-gradient(0deg, rgba(3,27,47,.64), rgba(3,27,47,.08) 70%); }
.immersive-hero { min-height: max(610px, calc(100svh - var(--header-height))); display: grid; align-items: end; padding: 108px 0 62px; background: transparent; color: var(--white); }
.immersive-hero-copy { max-width: 820px; }
.immersive-hero .breadcrumbs { color: #cfe5ed; }
.immersive-hero .breadcrumbs a { color: var(--white); }
.immersive-hero .breadcrumbs li:not(:last-child)::after { color: #9bc2d0; }
.immersive-hero .eyebrow { color: #a9e9f5; }
.immersive-hero .display-title { max-width: 820px; text-shadow: 0 4px 28px rgba(0,18,33,.5); }
.immersive-hero p { max-width: 680px; margin-bottom: 0; color: #e2f0f4; font-size: clamp(1.05rem, 2.4vw, 1.28rem); text-shadow: 0 2px 16px rgba(0,18,33,.72); }
.immersive-hero .btn-primary { border-color: var(--white); background: var(--white); color: var(--blue-950); }
.immersive-hero .btn:not(.btn-primary) { border-color: rgba(255,255,255,.78); color: var(--white); background: rgba(6,35,61,.24); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.immersive-section { background: rgba(246,250,249,.72); border-block: 1px solid rgba(255,255,255,.38); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
.immersive-section--light { background: rgba(251,250,245,.8); }
.immersive-section + .immersive-section { border-top: 0; }
.immersive-section .section-copy { color: #294b5a; }
.page-natacion .immersive-section .feature-card { background: rgba(255,255,255,.78); border-color: rgba(255,255,255,.66); -webkit-backdrop-filter: blur(13px); backdrop-filter: blur(13px); box-shadow: 0 18px 38px rgba(5,31,53,.14); }
.page-natacion .immersive-section .feature-card.featured { background: rgba(7,72,92,.84); border-color: rgba(255,255,255,.28); }
.page-natacion .immersive-section .media-block { border: 1px solid rgba(255,255,255,.68); box-shadow: 0 22px 46px rgba(5,31,53,.2); }
body.page-triatlon .immersive-section .content-card:not(.activity-feature-card) { background: rgba(255,255,255,.82); border-color: rgba(255,255,255,.65); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 20px 42px rgba(5,31,53,.16); }
.immersive-section--dark { background: rgba(5,35,59,.7); color: var(--white); border-color: rgba(255,255,255,.2); }
.immersive-section--dark .eyebrow { color: #a8eed3; }
.immersive-section--dark .section-copy { color: #d9eaf0; text-shadow: 0 2px 14px rgba(0,18,33,.56); }
.error-hero { min-height: max(620px, calc(100svh - var(--header-height))); display: grid; align-items: end; padding: 96px 0 54px; color: var(--white); }
.error-card { width: min(100%, 720px); padding: clamp(24px, 5vw, 44px); border: 1px solid rgba(255,255,255,.3); border-radius: var(--radius-lg); background: rgba(5,35,59,.68); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); box-shadow: 0 28px 70px rgba(0,18,33,.38); }
.error-card .eyebrow { color: #a8eed3; }
.error-card .display-title { margin-bottom: 4px; color: var(--white); font-size: clamp(6.5rem, 28vw, 12rem); line-height: .7; text-shadow: 0 5px 28px rgba(0,18,33,.5); }
.error-card h2 { margin: 20px 0 10px; font-family: var(--font-display); font-size: clamp(2.2rem, 8vw, 4rem); font-weight: 500; line-height: .94; }
.error-card p { max-width: 590px; color: #e0eef2; font-size: 1.05rem; line-height: 1.65; }
.error-card .btn-primary { border-color: var(--white); background: var(--white); color: var(--blue-950); }
.error-card .btn:not(.btn-primary) { border-color: rgba(255,255,255,.75); color: var(--white); }
@media (max-width: 720px) {
  .immersive-hero { min-height: max(580px, calc(100svh - var(--header-height))); padding: 82px 0 38px; }
  .immersive-page-media--natacion video { object-position: 52% center; }
  .immersive-page-media--triatlon video { object-position: 55% center; }
  .error-hero { min-height: max(590px, calc(100svh - var(--header-height))); padding: 72px 0 28px; }
  .error-card { padding: 25px 21px; }
}

/* Preguntas frecuentes: acordeón semántico, claro y cómodo para tocar en móvil. */
.faq-layout { display: grid; gap: 18px; }
.faq-help-card { position: relative; isolation: isolate; overflow: hidden; padding: 27px; border: 1px solid #b9e2df; border-top: 5px solid #2baf82; border-radius: var(--radius-lg); background: linear-gradient(145deg, #effaf6, #e8f4f8); box-shadow: 0 15px 31px rgba(10, 57, 78, .09); }
.faq-help-card::after { content: ''; position: absolute; z-index: -1; width: 174px; height: 174px; top: -102px; right: -80px; border-radius: 50%; background: #36b98c; opacity: .16; }
.faq-help-icon { width: 51px; height: 51px; display: grid; place-items: center; border-radius: 50%; background: #d7f2e7; color: #14775a; }
.faq-help-card h3 { margin: 25px 0 9px; color: var(--blue-950); font-family: var(--font-display); font-size: 2.05rem; font-weight: 500; line-height: .98; }
.faq-help-card p { margin: 0 0 22px; color: #406371; line-height: 1.62; }
.faq-list { display: grid; gap: 12px; }
.faq-item { --faq-accent: #168eb8; overflow: hidden; border: 1px solid #cce3e9; border-left: 4px solid var(--faq-accent); border-radius: var(--radius-md); background: linear-gradient(135deg, var(--white), #f2f9fb); box-shadow: 0 8px 19px rgba(10, 57, 78, .06); transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.faq-item:nth-child(3n + 2) { --faq-accent: #2b9d70; background: linear-gradient(135deg, var(--white), #f0faf4); }
.faq-item:nth-child(3n) { --faq-accent: #8a69bc; background: linear-gradient(135deg, var(--white), #f5f1fb); }
.faq-item summary { position: relative; min-height: 76px; display: grid; align-content: center; gap: 5px; padding: 15px 54px 15px 18px; color: var(--blue-950); cursor: pointer; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; position: absolute; right: 18px; top: 50%; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: color-mix(in srgb, var(--faq-accent) 14%, white); color: var(--faq-accent); font-size: 1.35rem; font-weight: 500; line-height: 1; transform: translateY(-50%); transition: transform .2s ease, background .2s ease, color .2s ease; }
.faq-topic { color: var(--faq-accent); font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.faq-question { font-size: 1rem; font-weight: 750; line-height: 1.34; }
.faq-item[open] { border-color: color-mix(in srgb, var(--faq-accent) 45%, white); box-shadow: 0 14px 26px rgba(10, 57, 78, .11); }
.faq-item[open] summary::after { background: var(--faq-accent); color: var(--white); transform: translateY(-50%) rotate(45deg); }
.faq-answer { display: grid; gap: 12px; padding: 0 18px 20px; border-top: 1px solid color-mix(in srgb, var(--faq-accent) 18%, white); }
.faq-answer p { margin: 16px 0 0; color: #426371; line-height: 1.65; }
.faq-link { color: color-mix(in srgb, var(--faq-accent) 78%, var(--blue-950)); }
.faq-item summary:focus-visible { outline: 3px solid var(--faq-accent); outline-offset: -3px; }
@media (hover: hover) and (pointer: fine) { .faq-item:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--faq-accent) 42%, white); box-shadow: 0 12px 24px rgba(10, 57, 78, .1); } }
@media (min-width: 850px) { .faq-layout { grid-template-columns: minmax(250px, .66fr) minmax(0, 1.34fr); align-items: start; } .faq-help-card { position: sticky; top: 132px; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
  .immersive-page-media video { display: none; }
}

@media print {
  .site-header, .site-footer, .seasonal-ribbon { display: none !important; }
  body { background: #fff; color: #000; }
  .page-hero, .section-pad { padding-block: 24px; }
  a { text-decoration: none; }
}