/* =========================================================
   CLUB CELTIX · ESTILOS DEL SITIO
   ========================================================= */
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { font-family: var(--cx-font-body); color: var(--cx-text); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, .font-heading { font-family: var(--cx-font-heading); color: var(--cx-ink); font-weight: 700; letter-spacing: .01em; line-height: 1.05; }
a { transition: color var(--cx-transition); }
img { max-width: 100%; }
.text-lime { color: var(--cx-lime) !important; }
.text-olive { color: var(--cx-olive) !important; }
.bg-soft { background: var(--cx-bg-soft); }
.bg-ink { background: var(--cx-ink); color: rgba(255,255,255,.78); }
.bg-ink h1, .bg-ink h2, .bg-ink h3, .bg-ink h4 { color: #fff; }
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Botones ---------- */
.btn { font-weight: 600; border-radius: 999px; padding: .7rem 1.4rem; display: inline-flex; align-items: center; gap: .45rem; justify-content: center; transition: all var(--cx-transition); }
.btn-sm { padding: .45rem 1rem; }
.btn-lg { padding: .9rem 1.8rem; font-size: 1.05rem; }
.btn-lime { --bs-btn-color: var(--cx-ink); --bs-btn-bg: var(--cx-lime); --bs-btn-border-color: var(--cx-lime); --bs-btn-hover-color: var(--cx-ink); --bs-btn-hover-bg: #c7da2c; --bs-btn-hover-border-color: #c7da2c; --bs-btn-active-bg: var(--cx-lime-dark); --bs-btn-active-border-color: var(--cx-lime-dark); --bs-btn-active-color: var(--cx-ink); box-shadow: 0 8px 20px -10px rgba(var(--cx-lime-rgb), .9); }
.btn-lime:hover { transform: translateY(-2px); }
.btn-ink { --bs-btn-color: #fff; --bs-btn-bg: var(--cx-ink); --bs-btn-border-color: var(--cx-ink); --bs-btn-hover-color: #fff; --bs-btn-hover-bg: var(--cx-ink-2); --bs-btn-hover-border-color: var(--cx-ink-2); --bs-btn-active-bg: #000; }
.btn-ink:hover { transform: translateY(-2px); }
.btn-ghost { --bs-btn-color: var(--cx-ink); --bs-btn-border-color: var(--cx-border); --bs-btn-hover-bg: var(--cx-bg-soft); --bs-btn-hover-border-color: var(--cx-ink); --bs-btn-hover-color: var(--cx-ink); background: #fff; }
.btn-ghost-light { --bs-btn-color: #fff; --bs-btn-border-color: rgba(255,255,255,.35); --bs-btn-hover-bg: rgba(255,255,255,.1); --bs-btn-hover-border-color: #fff; --bs-btn-hover-color: #fff; }
.btn-wa { --bs-btn-color: #fff; --bs-btn-bg: #25d366; --bs-btn-border-color: #25d366; --bs-btn-hover-bg: #1ebe5b; --bs-btn-hover-border-color: #1ebe5b; --bs-btn-hover-color: #fff; }
.link-arrow { font-weight: 600; color: var(--cx-ink); text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.link-arrow i { transition: transform var(--cx-transition); color: var(--cx-olive); }
.link-arrow:hover i { transform: translateX(4px); }

/* ---------- Barra superior ---------- */
.topbar { background: var(--cx-ink); font-size: .85rem; color: rgba(255,255,255,.7); }
.topbar a { color: rgba(255,255,255,.75); text-decoration: none; }
.topbar a:hover { color: var(--cx-lime); }
.topbar .social a { width: 30px; height: 30px; display: inline-grid; place-items: center; border-radius: 50%; font-size: 1rem; }
.topbar .social a:hover { background: rgba(255,255,255,.08); }

/* ---------- Navegación ---------- */
/* El desenfoque va en ::before: si se pone backdrop-filter en la barra misma, el offcanvas (position:fixed)
   queda atrapado dentro de ella y el menú móvil no se ve. */
.navbar-cx { background: transparent; border-bottom: 1px solid transparent; padding: .3rem 0; transition: box-shadow var(--cx-transition), border-color var(--cx-transition); }
.navbar-cx::before { content: ''; position: absolute; inset: 0; z-index: -1; background: rgba(255,255,255,.96); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.navbar-cx.scrolled { box-shadow: var(--cx-shadow-sm); border-color: var(--cx-border); }
.navbar-cx .navbar-brand { margin-right: 1.5rem; }
.navbar-cx .navbar-brand img { height: 72px; width: auto; display: block; transition: height var(--cx-transition); filter: drop-shadow(0 2px 3px rgba(0,0,0,.18)); }
.navbar-cx.scrolled .navbar-brand img { height: 58px; }
.navbar-cx .nav-link { font-family: var(--cx-font-heading); text-transform: uppercase; font-weight: 600; letter-spacing: .04em; font-size: 1.08rem; color: var(--cx-ink); padding: .5rem .9rem !important; position: relative; }
.navbar-cx .nav-link::after { content: ''; position: absolute; left: .9rem; right: .9rem; bottom: .2rem; height: 3px; border-radius: 3px; background: var(--cx-lime); transform: scaleX(0); transform-origin: left; transition: transform var(--cx-transition); }
.navbar-cx .nav-link:hover::after, .navbar-cx .nav-link.active::after { transform: scaleX(1); }
.navbar-cx .dropdown-toggle::after { border: 0; content: ''; }
.navbar-cx .dropdown-menu { border: 1px solid var(--cx-border); border-radius: var(--cx-radius); box-shadow: var(--cx-shadow); padding: .5rem; min-width: 250px; }
.navbar-cx .dropdown-item { border-radius: .55rem; padding: .55rem .8rem; font-weight: 500; display: flex; gap: .6rem; align-items: center; }
.navbar-cx .dropdown-item i { color: var(--cx-olive); font-size: 1.15rem; }
.navbar-cx .dropdown-item:hover, .navbar-cx .dropdown-item:focus { background: var(--cx-lime-soft); color: var(--cx-ink); }
.navbar-toggler { border: 0; font-size: 1.8rem; color: var(--cx-ink); padding: .2rem .4rem; }
.navbar-toggler:focus { box-shadow: none; }
@media (min-width: 992px) {
  .navbar-cx .dropdown:hover > .dropdown-menu { display: block; margin-top: 0; }
  .navbar-cx .offcanvas { background: transparent; }
}
@media (max-width: 991.98px) {
  .navbar-cx .navbar-brand img { height: 58px; }
  .navbar-cx.scrolled .navbar-brand img { height: 50px; }
  .navbar-cx .offcanvas { max-width: 330px; background: #fff; }
  .navbar-cx .offcanvas-header { border-bottom: 1px solid var(--cx-border); }
  .navbar-cx .offcanvas-body { display: flex; flex-direction: column; }
  .navbar-cx .navbar-nav { margin: 0 !important; }
  .navbar-cx .dropdown-menu { position: static !important; transform: none !important; }
  .navbar-cx .dropdown-item { white-space: normal; }
  .navbar-cx .nav-link { font-size: 1.25rem; padding: .7rem 0 !important; border-bottom: 1px solid var(--cx-border); }
  .navbar-cx .nav-link::after { display: none; }
  .navbar-cx .dropdown-menu { border: 0; box-shadow: none; padding: .2rem 0 .6rem; }
}

/* ---------- Encabezados de sección ---------- */
.section { padding: 5.5rem 0; }
.section-sm { padding: 3.5rem 0; }
@media (max-width: 767.98px) { .section { padding: 3.8rem 0; } }
.kicker { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--cx-font-heading); text-transform: uppercase; font-weight: 700; letter-spacing: .14em; font-size: .95rem; color: var(--cx-olive); margin-bottom: .7rem; }
.kicker::before { content: ''; width: 28px; height: 3px; border-radius: 3px; background: var(--cx-lime); }
.bg-ink .kicker { color: var(--cx-lime); }
.section-title { font-size: clamp(2.2rem, 4.6vw, 3.4rem); text-transform: uppercase; margin-bottom: 1rem; }
.section-lead { font-size: 1.1rem; color: var(--cx-muted); max-width: 640px; }
.bg-ink .section-lead { color: rgba(255,255,255,.65); }

/* ---------- Hero / slider ---------- */
.hero-slider { background: var(--cx-ink); }
.hero-slider .swiper-slide img { width: 100%; display: block; object-fit: cover; }
.hero-slider .swiper-button-next, .hero-slider .swiper-button-prev { width: 48px; height: 48px; border-radius: 50%; background: rgba(255,255,255,.18); backdrop-filter: blur(6px); color: #fff; transition: background var(--cx-transition); }
.hero-slider .swiper-button-next:hover, .hero-slider .swiper-button-prev:hover { background: var(--cx-lime); color: var(--cx-ink); }
.hero-slider .swiper-button-next::after, .hero-slider .swiper-button-prev::after { font-size: 1.1rem; font-weight: 800; }
.hero-slider .swiper-pagination-bullet { background: #fff; opacity: .5; width: 10px; height: 10px; }
.hero-slider .swiper-pagination-bullet-active { background: var(--cx-lime); opacity: 1; width: 28px; border-radius: 6px; }

/* ---------- Cabecera de páginas internas ---------- */
.page-hero { position: relative; background: var(--cx-ink) center/cover no-repeat; color: #fff; padding: 6.5rem 0 4.5rem; overflow: hidden; }
.page-hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(21,24,28,.92) 15%, rgba(21,24,28,.55) 70%, rgba(21,24,28,.35)); }
.page-hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: linear-gradient(90deg, var(--cx-lime), #d3ca45); }
.page-hero .container { position: relative; }
.page-hero h1 { color: #fff; font-size: clamp(2.6rem, 6vw, 4.4rem); text-transform: uppercase; margin: .3rem 0 .6rem; }
.page-hero .lead { color: rgba(255,255,255,.75); max-width: 640px; }
.page-hero .breadcrumb { --bs-breadcrumb-divider-color: rgba(255,255,255,.4); --bs-breadcrumb-item-active-color: var(--cx-lime); font-size: .88rem; margin: 0; }
.page-hero .breadcrumb a { color: rgba(255,255,255,.7); text-decoration: none; }
.page-hero .breadcrumb a:hover { color: #fff; }

/* ---------- Presentación del inicio ---------- */
.intro-media { position: relative; }
.intro-media img { position: relative; z-index: 1; max-height: 560px; width: auto; margin: 0 auto; display: block; }
.intro-media::before { content: ''; position: absolute; inset: 12% 8% 4%; border-radius: 50%; background: radial-gradient(circle, rgba(var(--cx-lime-rgb), .45), rgba(var(--cx-lime-rgb), 0) 70%); }
.display-title { font-size: clamp(2.8rem, 6vw, 4.8rem); text-transform: uppercase; line-height: .95; }
.display-title span { color: var(--cx-lime); -webkit-text-stroke: 0; }

/* ---------- Tarjetas de beneficios ---------- */
.feature { display: flex; gap: 1rem; padding: 1.25rem; border-radius: var(--cx-radius); transition: background var(--cx-transition), transform var(--cx-transition); color: inherit; text-decoration: none; height: 100%; }
a.feature:hover { background: var(--cx-bg-soft); transform: translateY(-3px); color: inherit; }
.feature .ic { flex: 0 0 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; font-size: 1.7rem; background: var(--cx-lime-soft); color: var(--cx-olive); transition: all var(--cx-transition); }
a.feature:hover .ic { background: var(--cx-lime); color: var(--cx-ink); }
.feature h3 { font-size: 1.45rem; text-transform: uppercase; margin-bottom: .3rem; }
.feature p { color: var(--cx-muted); margin: 0; font-size: .95rem; }

/* ---------- Tarjetas genéricas ---------- */
.card-cx { background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius-lg); overflow: hidden; transition: transform var(--cx-transition), box-shadow var(--cx-transition), border-color var(--cx-transition); height: 100%; display: flex; flex-direction: column; }
.card-cx:hover { transform: translateY(-4px); box-shadow: var(--cx-shadow); border-color: transparent; }
.card-cx .media { aspect-ratio: 16/10; overflow: hidden; background: var(--cx-bg-soft); position: relative; }
.card-cx .media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.card-cx:hover .media img { transform: scale(1.05); }
.card-cx .body { padding: 1.4rem 1.5rem 1.6rem; flex: 1; display: flex; flex-direction: column; }
.card-cx h3 { font-size: 1.6rem; text-transform: uppercase; margin-bottom: .5rem; }
.card-cx h3 a { color: inherit; text-decoration: none; }
.card-cx h3 a:hover { color: var(--cx-olive); }
.card-cx .meta { font-size: .82rem; color: var(--cx-muted); display: flex; gap: .9rem; flex-wrap: wrap; margin-bottom: .6rem; }
.card-cx .meta i { color: var(--cx-olive); }
.card-cx .tag { position: absolute; top: 1rem; left: 1rem; background: var(--cx-lime); color: var(--cx-ink); font-weight: 700; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; padding: .3rem .7rem; border-radius: 99px; }

/* ---------- Programas ---------- */
.program { border-radius: var(--cx-radius-lg); background: #fff; border: 1px solid var(--cx-border); overflow: hidden; }
.program + .program { margin-top: 1.75rem; }
.program .media { height: 100%; min-height: 260px; background: var(--cx-bg-soft) center/cover; }
.program .body { padding: 2rem 2.2rem; }
.program .ic { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; font-size: 1.6rem; background: var(--cx-ink); color: var(--cx-lime); margin-bottom: 1rem; }
.program h3 { font-size: 2rem; text-transform: uppercase; }
.schedule { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .45rem; }
.schedule li { display: flex; gap: .55rem; align-items: center; background: var(--cx-bg-soft); border-radius: .6rem; padding: .55rem .8rem; font-size: .93rem; }
.schedule li i { color: var(--cx-olive); font-size: 1.1rem; }

/* ---------- Tabla de valores ---------- */
.price-card { background: var(--cx-ink); color: rgba(255,255,255,.8); border-radius: var(--cx-radius-lg); padding: 2rem; position: relative; overflow: hidden; }
.price-card::after { content: ''; position: absolute; width: 220px; height: 220px; right: -70px; top: -70px; border-radius: 50%; background: rgba(var(--cx-lime-rgb), .14); }
.price-card h3 { color: #fff; text-transform: uppercase; font-size: 1.9rem; }
.price-row { display: flex; justify-content: space-between; gap: 1rem; padding: .85rem 0; border-bottom: 1px dashed rgba(255,255,255,.14); position: relative; z-index: 1; }
.price-row:last-child { border-bottom: 0; }
.price-row strong { color: var(--cx-lime); font-family: var(--cx-font-heading); font-size: 1.35rem; white-space: nowrap; }
.price-row small { display: block; color: rgba(255,255,255,.5); }

/* ---------- Contenido enriquecido ---------- */
.prose { font-size: 1.05rem; line-height: 1.75; }
.prose h2, .prose h3, .prose h4 { text-transform: uppercase; margin: 2rem 0 .8rem; }
.prose h2 { font-size: 2rem; } .prose h3 { font-size: 1.6rem; } .prose h4 { font-size: 1.3rem; }
.prose img { border-radius: var(--cx-radius); height: auto; margin: .8rem 0; }
.prose ul, .prose ol { padding-left: 1.3rem; }
.prose ul { list-style: none; padding-left: 0; }
.prose ul li { position: relative; padding-left: 1.7rem; margin-bottom: .55rem; }
.prose ul li::before { content: ''; position: absolute; left: .2rem; top: .62em; width: 9px; height: 9px; border-radius: 50%; background: var(--cx-lime); box-shadow: 0 0 0 4px var(--cx-lime-soft); }
.prose ol li { margin-bottom: .7rem; padding-left: .3rem; }
.prose ol li::marker { font-weight: 700; color: var(--cx-olive); }
.prose blockquote { border-left: 4px solid var(--cx-lime); background: var(--cx-bg-soft); padding: 1rem 1.4rem; border-radius: 0 var(--cx-radius) var(--cx-radius) 0; font-weight: 600; color: var(--cx-ink); }
.prose a { font-weight: 600; }
.prose > :last-child { margin-bottom: 0; }

/* ---------- Misión / visión ---------- */
.mv-card { border-radius: var(--cx-radius-lg); padding: 2.2rem; height: 100%; position: relative; overflow: hidden; }
.mv-card.light { background: var(--cx-lime-soft); }
.mv-card.dark { background: var(--cx-ink); color: rgba(255,255,255,.78); }
.mv-card.dark h3 { color: #fff; }
.mv-card .ic { font-size: 2.4rem; color: var(--cx-olive); margin-bottom: .8rem; display: block; }
.mv-card.dark .ic { color: var(--cx-lime); }
.mv-card h3 { font-size: 2rem; text-transform: uppercase; }
.legal-box { border: 1px solid var(--cx-border); border-radius: var(--cx-radius); padding: 1.3rem 1.5rem; background: #fff; }
.legal-box dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; color: var(--cx-muted); font-weight: 600; }
.legal-box dd { font-weight: 600; color: var(--cx-ink); margin-bottom: .8rem; }
.legal-box dd:last-child { margin-bottom: 0; }

/* ---------- Personas ---------- */
.person { display: flex; align-items: center; gap: .9rem; background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius); padding: .9rem 1rem; height: 100%; transition: border-color var(--cx-transition), box-shadow var(--cx-transition); }
.person:hover { border-color: var(--cx-lime); box-shadow: var(--cx-shadow-sm); }
.person .avatar { flex: 0 0 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--cx-ink); color: var(--cx-lime); font-family: var(--cx-font-heading); font-weight: 700; font-size: 1.25rem; overflow: hidden; }
.person .avatar img { width: 100%; height: 100%; object-fit: cover; }
.person strong { display: block; color: var(--cx-ink); line-height: 1.25; text-transform: capitalize; }
.person .role { font-size: .8rem; font-weight: 700; color: var(--cx-olive); text-transform: uppercase; letter-spacing: .05em; }
.person small { color: var(--cx-muted); font-size: .8rem; }
.group-title { font-size: 1.5rem; text-transform: uppercase; display: flex; align-items: center; gap: .6rem; margin-bottom: 1.1rem; }
.group-title i { color: var(--cx-olive); }

/* ---------- Documentos ---------- */
.doc { display: flex; align-items: center; gap: 1rem; padding: 1.1rem 1.2rem; background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius); text-decoration: none; color: var(--cx-ink); height: 100%; transition: all var(--cx-transition); }
.doc:hover { border-color: var(--cx-ink); box-shadow: var(--cx-shadow-sm); transform: translateY(-2px); color: var(--cx-ink); }
.doc .ic { flex: 0 0 48px; height: 48px; border-radius: 12px; background: #fdecea; color: #c0392b; display: grid; place-items: center; font-size: 1.6rem; }
.doc strong { display: block; line-height: 1.25; font-weight: 600; }
.doc small { color: var(--cx-muted); }
.doc .go { margin-left: auto; color: var(--cx-muted); font-size: 1.2rem; transition: transform var(--cx-transition); }
.doc:hover .go { color: var(--cx-olive); transform: translateX(3px); }

/* ---------- FAQ ---------- */
.faq .accordion-item { border: 1px solid var(--cx-border); border-radius: var(--cx-radius) !important; overflow: hidden; margin-bottom: .8rem; }
.faq .accordion-button { font-weight: 600; color: var(--cx-ink); padding: 1.15rem 1.3rem; font-size: 1.05rem; gap: .8rem; }
.faq .accordion-button:not(.collapsed) { background: var(--cx-lime-soft); box-shadow: none; }
.faq .accordion-button:focus { box-shadow: none; }
.faq .accordion-button::after { background-image: none; content: '\002B'; font-size: 1.5rem; line-height: 1; width: auto; height: auto; transform: none; color: var(--cx-olive); }
.faq .accordion-button:not(.collapsed)::after { content: '\2212'; }
.faq .accordion-body { padding: .3rem 1.3rem 1.3rem; color: var(--cx-text); background: var(--cx-lime-soft); }

/* ---------- Testimonios ---------- */
.testimonial { background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: var(--cx-radius-lg); padding: 2rem; height: 100%; display: flex; flex-direction: column; }
.testimonial .quote { font-size: 2.6rem; color: var(--cx-lime); line-height: 1; }
.testimonial p { color: rgba(255,255,255,.82); font-size: 1.02rem; flex: 1; }
.testimonial .who { display: flex; align-items: center; gap: .8rem; margin-top: 1rem; }
.testimonial .who .avatar { width: 46px; height: 46px; border-radius: 50%; background: var(--cx-lime); color: var(--cx-ink); display: grid; place-items: center; font-family: var(--cx-font-heading); font-weight: 700; font-size: 1.2rem; overflow: hidden; }
.testimonial .who .avatar img { width: 100%; height: 100%; object-fit: cover; }
.testimonial .who strong { color: #fff; display: block; }
.testimonial .who small { color: rgba(255,255,255,.5); }

/* ---------- Banda CTA ---------- */
.cta-band { background: var(--cx-lime); border-radius: var(--cx-radius-lg); padding: 3rem; position: relative; overflow: hidden; }
.cta-band::before { content: ''; position: absolute; right: -60px; bottom: -120px; width: 340px; height: 340px; border-radius: 50%; border: 50px solid rgba(255,255,255,.18); }
.cta-band h2 { font-size: clamp(2.2rem, 4.5vw, 3.2rem); text-transform: uppercase; }
.cta-band p { color: rgba(21,24,28,.75); font-size: 1.08rem; }
.cta-band > * { position: relative; }
.cta-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: .6rem; max-width: 420px; margin-left: auto; }
.cta-actions .main { grid-column: 1 / -1; }
.cta-actions .btn { width: 100%; white-space: nowrap; }
.cta-actions .btn-ghost { border-color: transparent; }
@media (max-width: 991.98px) { .cta-actions { margin-left: 0; max-width: none; } }
@media (max-width: 575.98px) { .cta-actions .btn { padding-left: .6rem; padding-right: .6rem; font-size: 1rem; } }
@media (max-width: 767.98px) { .cta-band { padding: 2rem 1.5rem; } }

/* ---------- Banner con imagen ---------- */
.banner-img { position: relative; border-radius: var(--cx-radius-lg); overflow: hidden; background: var(--cx-ink) center/cover; padding: 4rem 3rem; color: #fff; }
.banner-img::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(21,24,28,.92), rgba(21,24,28,.4)); }
.banner-img > * { position: relative; }
.banner-img h2 { color: #fff; text-transform: uppercase; font-size: clamp(2rem, 4vw, 3rem); }
.banner-img p { color: rgba(255,255,255,.78); max-width: 560px; }
@media (max-width: 767.98px) { .banner-img { padding: 2.5rem 1.5rem; } }

/* ---------- Logos de aliados ---------- */
.partner { display: grid; place-items: center; background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius); padding: 1.2rem; height: 110px; transition: all var(--cx-transition); }
.partner img { max-height: 70px; width: auto; object-fit: contain; filter: grayscale(1); opacity: .8; transition: all var(--cx-transition); }
.partner:hover { border-color: var(--cx-lime); box-shadow: var(--cx-shadow-sm); }
.partner:hover img { filter: none; opacity: 1; }

/* ---------- Tablas ---------- */
.table-cx { --bs-table-bg: transparent; margin: 0; }
.table-cx thead th { font-family: var(--cx-font-heading); text-transform: uppercase; letter-spacing: .05em; font-size: 1rem; color: var(--cx-ink); background: var(--cx-lime-soft); border-bottom: 0; padding: .9rem 1.1rem; }
.table-cx td { padding: .8rem 1.1rem; border-color: var(--cx-border); }
.table-cx tbody tr:hover { background: var(--cx-bg-soft); }
.table-wrap { border: 1px solid var(--cx-border); border-radius: var(--cx-radius-lg); overflow: hidden; background: #fff; }

/* ---------- Línea de tiempo (Navidad en patines) ---------- */
.timeline { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1rem; }
.timeline .ed { background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius); padding: 1.1rem; position: relative; }
.timeline .ed .yr { font-family: var(--cx-font-heading); font-size: 1.9rem; font-weight: 700; color: var(--cx-ink); line-height: 1; }
.timeline .ed .nm { font-weight: 600; font-size: .92rem; margin: .3rem 0; }
.timeline .ed .pp { font-size: .82rem; color: var(--cx-olive); font-weight: 700; }
.reasons { list-style: none; padding: 0; margin: 0; display: grid; gap: .8rem; }
.reasons li { display: flex; gap: .8rem; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); padding: 1rem 1.2rem; border-radius: var(--cx-radius); }
.reasons li i { color: var(--cx-lime); font-size: 1.4rem; flex: 0 0 auto; }

/* ---------- Formularios ---------- */
.form-card { background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius-lg); padding: 2rem; box-shadow: var(--cx-shadow-sm); }
@media (max-width: 575.98px) { .form-card { padding: 1.3rem; } }
.form-label { font-weight: 600; font-size: .9rem; color: var(--cx-ink); }
.form-control, .form-select { border-radius: .65rem; border-color: var(--cx-border); padding: .7rem .95rem; }
.form-control:focus, .form-select:focus { border-color: var(--cx-lime-dark); box-shadow: 0 0 0 .22rem rgba(var(--cx-lime-rgb), .25); }
.form-check-input:checked { background-color: var(--cx-ink); border-color: var(--cx-ink); }
.form-section { font-family: var(--cx-font-heading); text-transform: uppercase; font-size: 1.35rem; display: flex; align-items: center; gap: .55rem; margin: 1.6rem 0 1rem; padding-bottom: .5rem; border-bottom: 1px solid var(--cx-border); }
.form-section:first-child { margin-top: 0; }
.form-section i { color: var(--cx-olive); }
.info-item { display: flex; gap: 1rem; align-items: flex-start; }
.info-item .ic { flex: 0 0 48px; height: 48px; border-radius: 14px; background: var(--cx-ink); color: var(--cx-lime); display: grid; place-items: center; font-size: 1.4rem; }
.info-item small { display: block; color: var(--cx-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
.info-item a, .info-item span { color: var(--cx-ink); font-weight: 600; text-decoration: none; }
.map-wrap { border-radius: var(--cx-radius-lg); overflow: hidden; border: 1px solid var(--cx-border); }
.map-wrap iframe { width: 100%; height: 420px; border: 0; display: block; }

/* ---------- Paginación ---------- */
.pagination { --bs-pagination-color: var(--cx-ink); --bs-pagination-active-bg: var(--cx-ink); --bs-pagination-active-border-color: var(--cx-ink); --bs-pagination-hover-bg: var(--cx-lime-soft); --bs-pagination-border-radius: .6rem; gap: .3rem; }
.pagination .page-link { border-radius: .6rem !important; }
.chip-link { display: inline-block; padding: .4rem .9rem; border-radius: 99px; border: 1px solid var(--cx-border); color: var(--cx-ink); text-decoration: none; font-weight: 500; font-size: .9rem; margin: 0 .3rem .5rem 0; transition: all var(--cx-transition); }
.chip-link:hover, .chip-link.active { background: var(--cx-ink); color: #fff; border-color: var(--cx-ink); }

/* ---------- Entrada del blog ---------- */
.post-cover { border-radius: var(--cx-radius-lg); overflow: hidden; margin-top: -3rem; position: relative; z-index: 2; box-shadow: var(--cx-shadow); background: var(--cx-bg-soft); }
.post-cover img { width: 100%; max-height: 520px; object-fit: cover; display: block; }
.share a { width: 40px; height: 40px; border-radius: 50%; display: inline-grid; place-items: center; border: 1px solid var(--cx-border); color: var(--cx-ink); font-size: 1.15rem; text-decoration: none; transition: all var(--cx-transition); }
.share a:hover { background: var(--cx-ink); color: var(--cx-lime); border-color: var(--cx-ink); }

/* =========================================================
   BLOG · lectura y bloques visuales (clases b-*)
   Se usan dentro de .post-body. Insertables desde Admin → Blog.
   ========================================================= */
.read-progress { position: fixed; top: 0; left: 0; height: 4px; width: 0; z-index: 1040; background: linear-gradient(90deg, var(--cx-lime), #d3ca45); transition: width .1s linear; }
.post-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; color: rgba(255,255,255,.75); font-size: .92rem; }
.post-meta i { color: var(--cx-lime); }
.post-wrap { max-width: 760px; margin: 0 auto; }
.post-body { font-size: 1.1rem; line-height: 1.85; color: #2c3137; }
.post-body > p { margin-bottom: 1.3rem; }
.post-body h2 { font-size: 2.1rem; margin: 2.8rem 0 1.2rem; }
.post-body a { color: var(--cx-olive); text-decoration: underline; text-decoration-color: var(--cx-lime); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.post-body a:hover { color: var(--cx-ink); text-decoration-color: var(--cx-ink); }
.post-body strong { color: var(--cx-ink); }

.b-byline { font-size: .95rem; color: var(--cx-muted); margin-bottom: 1.5rem !important; }
.b-lead { font-size: 1.28rem; line-height: 1.7; color: var(--cx-ink); }
.b-mark { background: var(--cx-lime); color: var(--cx-ink); padding: .05rem .45rem; border-radius: .3rem; font-weight: 700; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
.b-pill { display: inline-block; background: var(--cx-olive); color: #fff; padding: .05rem .75rem; border-radius: 99px; font-weight: 700; font-size: .95em; margin: .1rem; }
.b-divider { border: 0; border-top: 2px dashed var(--cx-lime); opacity: 1; margin: 2.6rem 0; }

.b-question { position: relative; border-left: 5px solid var(--cx-lime); background: var(--cx-lime-soft); padding: 1.3rem 1.5rem 1.3rem 4rem; margin: 1.8rem 0; border-radius: 0 var(--cx-radius) var(--cx-radius) 0; font-size: 1.3rem; font-weight: 700; line-height: 1.45; color: var(--cx-ink); }
.b-question::before { content: '?'; position: absolute; left: 1.1rem; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; background: var(--cx-ink); color: var(--cx-lime); display: grid; place-items: center; font-family: var(--cx-font-heading); font-size: 1.3rem; }
.b-question p { margin: 0; }

.b-tip { display: flex; gap: 1rem; background: #fbfaf0; border: 1px solid #d3ca45; border-radius: var(--cx-radius); padding: 1.2rem 1.4rem; margin: 1.8rem 0; }
.b-tip > i { flex: 0 0 auto; font-size: 1.6rem; color: var(--cx-olive); line-height: 1.6; }
.b-tip p { margin: 0; }
.b-tip p + p { margin-top: .7rem; }

.b-dark { background: linear-gradient(135deg, #1f2610 0%, #3f4c12 55%, #64761c 100%); color: rgba(255,255,255,.9); border-radius: var(--cx-radius-lg); padding: 1.8rem 2rem; margin: 2rem 0; position: relative; overflow: hidden; }
.b-dark::after { content: ''; position: absolute; right: -50px; top: -50px; width: 170px; height: 170px; border-radius: 50%; border: 28px solid rgba(255,255,255,.06); }
.b-dark p { margin: 0 0 1rem; position: relative; z-index: 1; }
.b-dark p:last-child { margin: 0; }
.b-dark strong { color: #fff; }
.b-dark a { color: #e3ea8a; text-decoration-color: #e3ea8a; }
.b-dark a:hover { color: #fff; }
.b-dark .b-mark { color: var(--cx-ink); }

.b-features { display: grid; gap: .9rem; margin: 1.5rem 0 2rem; }
.b-feature { display: flex; gap: 1rem; align-items: flex-start; background: var(--cx-bg-soft); border-left: 4px solid var(--cx-lime); border-radius: 0 var(--cx-radius) var(--cx-radius) 0; padding: 1rem 1.2rem; transition: transform var(--cx-transition), box-shadow var(--cx-transition); }
.b-feature:hover { transform: translateX(4px); box-shadow: var(--cx-shadow-sm); }
.b-feature > i { flex: 0 0 42px; height: 42px; border-radius: 12px; background: var(--cx-ink); color: var(--cx-lime); display: grid; place-items: center; font-size: 1.3rem; margin-top: .15rem; }
.b-feature p { margin: 0; line-height: 1.7; }
.b-feature p > strong:first-child { color: var(--cx-olive); }

.b-checks { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .7rem; margin: 1.5rem 0 2rem; }
.b-check { display: flex; gap: .7rem; align-items: center; background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius); padding: .85rem 1rem; font-weight: 600; color: var(--cx-ink); line-height: 1.4; }
.b-check > i { flex: 0 0 34px; height: 34px; border-radius: 50%; background: var(--cx-lime-soft); color: var(--cx-olive); display: grid; place-items: center; font-size: 1.15rem; }

.b-list { display: grid; gap: .6rem; margin: 1.3rem 0 2rem; counter-reset: bl; }
.b-list-item { display: flex; gap: .9rem; align-items: flex-start; background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius); padding: .9rem 1.1rem; line-height: 1.65; }
.b-list-item > i { flex: 0 0 auto; color: var(--cx-olive); font-size: 1.35rem; margin-top: .1rem; }

.b-steps { display: grid; gap: 1rem; margin: 1.5rem 0 2rem; counter-reset: st; }
.b-step { display: flex; gap: 1.1rem; align-items: flex-start; counter-increment: st; }
.b-step::before { content: counter(st); flex: 0 0 46px; height: 46px; border-radius: 50%; background: var(--cx-lime); color: var(--cx-ink); display: grid; place-items: center; font-family: var(--cx-font-heading); font-weight: 800; font-size: 1.5rem; box-shadow: 0 6px 16px -8px rgba(var(--cx-lime-rgb), .9); }
.b-step > div { flex: 1; background: var(--cx-bg-soft); border-radius: var(--cx-radius); padding: .9rem 1.2rem; }
.b-step p { margin: 0; }

.b-timeline { position: relative; margin: 1.5rem 0 2rem; padding-left: 2.2rem; }
.b-timeline::before { content: ''; position: absolute; left: .65rem; top: .4rem; bottom: .4rem; width: 3px; border-radius: 3px; background: linear-gradient(var(--cx-lime), rgba(var(--cx-lime-rgb), .15)); }
.b-tl-item { position: relative; margin-bottom: 1.3rem; }
.b-tl-item::before { content: ''; position: absolute; left: -2.05rem; top: .45rem; width: 17px; height: 17px; border-radius: 50%; background: #fff; border: 4px solid var(--cx-lime); }
.b-tl-item p { margin: 0 0 .5rem; }
.b-tl-item p:last-child { margin: 0; }

.b-compare { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; margin: 1.5rem 0 2rem; }
@media (min-width: 576px) { .b-compare > .b-card:last-child:nth-child(odd):not(:first-child) { grid-column: 1 / -1; } }
.b-card { background: #fff; border: 1px solid var(--cx-border); border-radius: var(--cx-radius-lg); padding: 1.4rem 1.5rem; box-shadow: var(--cx-shadow-sm); }
.b-card > i { display: inline-grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: var(--cx-ink); color: var(--cx-lime); font-size: 1.5rem; margin-bottom: .8rem; }
.b-card-title { font-family: var(--cx-font-heading); font-weight: 800; text-transform: uppercase; font-size: 1.45rem; color: var(--cx-ink); letter-spacing: .02em; display: block; margin-bottom: .35rem; line-height: 1.1; }
.b-card p { margin: 0; line-height: 1.7; font-size: 1rem; }

.b-schedule { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: .8rem; margin: 1.3rem 0 2rem; }
.b-slot { background: var(--cx-ink); color: rgba(255,255,255,.8); border-radius: var(--cx-radius); padding: 1rem 1.2rem; display: flex; gap: .8rem; align-items: center; }
.b-slot > i { font-size: 1.6rem; color: var(--cx-lime); }
.b-slot strong { display: block; color: #fff; font-family: var(--cx-font-heading); font-size: 1.3rem; letter-spacing: .03em; line-height: 1.1; }
.b-slot span { font-size: .92rem; }

.b-h { display: flex; align-items: center; gap: .8rem; font-size: 2rem !important; }
.b-h .num { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px; background: var(--cx-ink); color: var(--cx-lime); display: grid; place-items: center; font-size: 1.4rem; }

.b-figure { margin: 2rem auto; text-align: center; }
.b-figure img { border-radius: var(--cx-radius-lg); box-shadow: var(--cx-shadow); max-width: 100%; height: auto; margin: 0; }
.b-figure.sm img { max-width: 420px; width: 100%; }
.b-duo { display: grid; grid-template-columns: 1.4fr 1fr; gap: 1.5rem; align-items: center; margin: 1.5rem 0 2rem; }
.b-duo p { margin: 0; }
.b-duo img { border-radius: var(--cx-radius-lg); box-shadow: var(--cx-shadow); width: 100%; height: auto; margin: 0; }
@media (max-width: 575.98px) { .b-duo { grid-template-columns: 1fr; } }

.b-letter { background: #fff; border: 1px solid var(--cx-border); border-top: 6px solid var(--cx-lime); border-radius: var(--cx-radius-lg); padding: 2.2rem 2.4rem; box-shadow: var(--cx-shadow); margin: 1rem 0 2rem; }
@media (max-width: 575.98px) { .b-letter { padding: 1.5rem 1.3rem; } }
.b-letter-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; padding-bottom: 1.2rem; margin-bottom: 1.5rem; border-bottom: 1px dashed var(--cx-border); }
.b-letter-head p { margin: 0; color: var(--cx-muted); font-size: .98rem; }
.b-letter-head p i { color: var(--cx-olive); }
.b-letter-title { display: inline-block; background: var(--cx-ink); color: var(--cx-lime); font-family: var(--cx-font-heading); font-weight: 800; letter-spacing: .12em; font-size: 1.15rem; padding: .35rem 1rem; border-radius: .5rem; margin: 0 !important; }
.b-letter p { margin-bottom: 1.1rem; }
.b-signature { text-align: right; margin: 1.8rem 0 0 !important; font-family: var(--cx-font-heading); font-weight: 700; font-size: 1.35rem; color: var(--cx-ink); }
.b-signature::before { content: ''; display: block; width: 160px; height: 2px; background: var(--cx-lime); margin: 0 0 .5rem auto; }

.b-contact { display: flex; flex-wrap: wrap; gap: .6rem; margin: .5rem 0 0; }
.b-contact a { display: inline-flex; align-items: center; gap: .45rem; background: var(--cx-bg-soft); border: 1px solid var(--cx-border); border-radius: 99px; padding: .4rem 1rem; font-weight: 600; text-decoration: none !important; color: var(--cx-ink) !important; font-size: .98rem; }
.b-contact a:hover { border-color: var(--cx-lime-dark); background: var(--cx-lime-soft); }
.b-contact a i { color: var(--cx-olive); }

.b-closing { background: var(--cx-lime-soft); border: 1px solid #90a830; border-radius: var(--cx-radius-lg); padding: 2rem 2rem 1.8rem; margin: 2.6rem 0 1.5rem; text-align: center; }
.b-closing p { margin: 0 0 1rem; }
.b-closing p:last-child { margin: 0; }
.b-closing-line { font-family: var(--cx-font-heading); font-size: 2rem !important; font-weight: 800; color: var(--cx-olive); line-height: 1.15; text-transform: uppercase; }
.b-closing-line a { color: var(--cx-olive); text-decoration: none; }
.b-closing-line a:hover { color: var(--cx-ink); }

/* ---------- Footer ---------- */
.site-footer { background: var(--cx-ink); color: rgba(255,255,255,.62); padding-top: 4.5rem; font-size: .95rem; position: relative; }
.site-footer::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 5px; background: linear-gradient(90deg, var(--cx-lime), #d3ca45); }
.site-footer h5 { color: #fff; text-transform: uppercase; font-size: 1.25rem; letter-spacing: .04em; margin-bottom: 1.1rem; }
.site-footer a { color: rgba(255,255,255,.7); text-decoration: none; }
.site-footer a:hover { color: var(--cx-lime); }
.site-footer .links li { margin-bottom: .55rem; }
.site-footer .social a { width: 42px; height: 42px; border-radius: 50%; display: inline-grid; place-items: center; background: rgba(255,255,255,.07); color: #fff; font-size: 1.2rem; transition: all var(--cx-transition); }
.site-footer .social a:hover { background: var(--cx-lime); color: var(--cx-ink); }
.site-footer .contact li { display: flex; gap: .7rem; margin-bottom: .8rem; }
.site-footer .contact i { color: var(--cx-lime); font-size: 1.2rem; flex: 0 0 auto; margin-top: .1rem; }
.site-footer .sponsor img { background: #fff; border-radius: var(--cx-radius); padding: .6rem 1rem; max-height: 70px; }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.08); margin-top: 3rem; padding: 1.4rem 0; font-size: .85rem; color: rgba(255,255,255,.45); }

/* ---------- WhatsApp flotante ---------- */
.wa-float { position: fixed; right: 1.2rem; bottom: 1.2rem; z-index: 1030; width: 60px; height: 60px; border-radius: 50%; background: #25d366; color: #fff; display: grid; place-items: center; font-size: 2rem; box-shadow: 0 10px 25px -8px rgba(37,211,102,.7); text-decoration: none; transition: transform var(--cx-transition); }
.wa-float:hover { transform: scale(1.08); color: #fff; }
body:has(.offcanvas.show, .offcanvas.showing) .wa-float { opacity: 0; pointer-events: none; } /* no tapar el menú móvil */
.wa-float::before { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid #25d366; animation: wa-pulse 2.2s infinite; }
@keyframes wa-pulse { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.6); opacity: 0; } }

/* ---------- Animación de aparición ---------- */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .reveal { opacity: 1; transform: none; } .wa-float::before { animation: none; } }
