/* Chapter badge — animated horizontal indicator that fades in on scroll */
.chapter-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--title-font);
  font-size: 14px;
  color: var(--green);
  letter-spacing: 0.005em;
  opacity: 0;
  transform: translateY(2px);
  transition: opacity 0.5s ease, transform 0.5s ease;
  pointer-events: none;
  min-width: 0;
  overflow: hidden;
  justify-self: center;
  white-space: nowrap;
}
.chapter-badge.is-visible {
  opacity: 0.92;
  transform: translateY(0);
}
.chapter-badge__num {
  display: inline-block;
  font-style: italic;
  font-size: 13px;
  color: color-mix(in oklab, var(--green) 75%, transparent);
  white-space: nowrap;
  overflow: hidden;
  animation: chapterType 0.55s cubic-bezier(0.2, 0.8, 0.2, 1) both;
}
.chapter-badge__sep { color: var(--gold); opacity: 0.7; }
.chapter-badge__label {
  display: inline-block;
  font-size: 15px;
  font-weight: 500;
  color: var(--green);
  white-space: nowrap;
  overflow: hidden;
  animation: chapterType 0.7s cubic-bezier(0.2, 0.8, 0.2, 1) 0.18s both;
}
@keyframes chapterType {
  from { max-width: 0; opacity: 0.4; }
  to   { max-width: 28ch; opacity: 1; }
}

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

/* Topnav link icons (desktop) */
.topnav__link {
  display: inline-flex; align-items: center; gap: 6px;
}
.topnav__link-icon {
  display: inline-flex; align-items: center;
  color: color-mix(in oklab, var(--green) 70%, transparent);
  transition: transform 0.5s cubic-bezier(0.4, 0.2, 0.2, 1), color 0.18s;
}
.topnav__link:hover .topnav__link-icon,
.topnav__link.is-active .topnav__link-icon {
  transform: rotate(360deg);
  color: var(--bg);
}
.topnav__link.is-active .topnav__link-icon { color: var(--bg); }

@media (max-width: 1240px) {
  .topnav__link-text { display: none; }
  .topnav__link { width: 34px; height: 34px; padding: 0; justify-content: center; border-radius: 50%; }
}

/* Topnav drawer items — icon + label + chapter eyebrow */
.topnav__drawer-link {
  background: transparent; border: none; text-align: left;
  padding: 12px 14px; border-radius: 12px;
  font-family: var(--title-font); font-size: 22px;
  color: var(--ink); line-height: 1.1;
  display: grid; grid-template-columns: 36px 1fr auto; gap: 14px; align-items: center;
  transition: background 0.18s, color 0.18s;
}
.topnav__drawer-link.is-active { background: var(--green); color: var(--bg); }
.topnav__drawer-icon {
  display: inline-flex; justify-content: center;
  color: color-mix(in oklab, var(--green) 75%, transparent);
  transition: transform 0.55s cubic-bezier(0.4, 0.2, 0.2, 1), color 0.18s;
}
.topnav__drawer-link:hover .topnav__drawer-icon,
.topnav__drawer-link.is-active .topnav__drawer-icon {
  transform: rotate(360deg);
  color: var(--gold);
}
.topnav__drawer-link.is-active .topnav__drawer-icon { color: var(--gold); }
.topnav__drawer-chapter {
  font-family: var(--body-font);
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: color-mix(in oklab, var(--brown) 80%, transparent);
  opacity: 0.85;
}
.topnav__drawer-link.is-active .topnav__drawer-chapter {
  color: color-mix(in oklab, var(--bg) 85%, transparent);
}
.topnav__drawer-cta {
  margin-top: 14px; padding: 14px 16px;
  text-align: center; border: 1px solid var(--green);
  border-radius: 999px; color: var(--green); font-size: 14px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}

/* Toast */
.rodeo-toast {
  position: fixed; left: 50%; bottom: 28px;
  transform: translateX(-50%);
  background: var(--ink); color: var(--bg);
  padding: 12px 22px; border-radius: 999px;
  font-size: 14px; letter-spacing: 0.01em;
  z-index: 400;
  box-shadow: 0 16px 36px rgba(0,0,0,0.32);
  animation: toastIn 0.25s ease-out;
}
@keyframes toastIn {
  from { opacity: 0; transform: translate(-50%, 12px); }
  to   { opacity: 1; transform: translate(-50%, 0); }
}

/* ============================================================
   GRANJA ESCUELA EL RODEO — Naturaleza, Historia, Identidad
   Visual system inspired by the live site (verde bosque + crema
   + tipografía serif + tarjetas redondeadas + ondas).
   ============================================================ */

:root {
  --green: #1f4d3a;
  --green-2: #2f5a47;
  --green-soft: #c7d2c4;
  --brown: #6b3f24;
  --gold: #b6943f;
  --bg: #f5efe1;
  --bg-2: #ece4d0;
  --ink: #1f1a14;
  --ink-2: #4a4136;
  --ink-3: #8a7e6a;
  --line: #d8cdb4;
  --title-font: "Cormorant Garamond", Georgia, serif;
  --body-font: "Work Sans", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --hand-font: "Caveat", "Cormorant Garamond", cursive;
  --density: 1;
  --radius: 16px;
}

[data-theme="dark"] {
  --bg-2: #1c2922;
  --ink: #f1ead7;
  --ink-2: #d0c8b1;
  --ink-3: #908574;
  --line: #2c3a30;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; overflow-x: clip; }
body {
  font-family: var(--body-font);
  color: var(--ink);
  background: var(--bg);
  font-size: calc(16px * var(--density));
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
button { font-family: inherit; cursor: pointer; }
img { display: block; max-width: 100%; }
a { color: var(--green); text-decoration: none; }
a:hover { text-decoration: underline; }

.app { min-height: 100dvh; display: flex; flex-direction: column; }

/* ─── Top nav ───────────────────────────────────────────── */
.topnav {
  position: sticky; top: 0; z-index: 50;
  background: var(--green-soft);
  border-bottom: 1px solid color-mix(in oklab, var(--green) 30%, transparent);
  backdrop-filter: blur(8px);
}
.topnav__inner {
  max-width: 1280px; margin: 0 auto; padding: 10px 24px;
  display: grid; grid-template-columns: auto 1fr auto auto auto; gap: 12px; align-items: center;
}
.brand { display: flex; gap: 12px; align-items: center; color: var(--green); min-width: 0; }
.brand__seal { display: inline-flex; flex-shrink: 0; }
.brand__seal img {
  width: 44px; height: 44px;
  border-radius: 50%;
  display: block;
}
.brand__text { display: flex; flex-direction: column; line-height: 1.05; gap: 2px; white-space: nowrap; min-width: 0; }
.brand__line1 { font-family: var(--title-font); font-size: 12px; letter-spacing: 0.08em; color: var(--green-2); text-transform: uppercase; }
.brand__line2 { font-family: var(--title-font); font-size: 20px; font-weight: 600; color: var(--green); letter-spacing: 0.01em; line-height: 1; }
.topnav__links {
  display: flex; gap: 2px; justify-content: center; flex-wrap: wrap;
}
.topnav__link {
  background: transparent; border: none; padding: 8px 12px;
  font-size: 13.5px; color: var(--green); letter-spacing: 0.02em;
  border-radius: 999px; transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}
.topnav__link:hover { background: color-mix(in oklab, var(--green) 10%, transparent); }
.topnav__link.is-active { background: var(--green); color: var(--bg); }
.topnav__cta {
  font-size: 12.5px; color: var(--green); border: 1px solid var(--green);
  padding: 6px 14px; border-radius: 999px; text-decoration: none; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 6px;
  font-weight: 500;
  background: var(--green);
  color: var(--bg);
  border-color: var(--green);
  transition: transform 0.15s, background 0.15s;
}
.topnav__cta:hover { background: var(--green-2); transform: translateY(-1px); text-decoration: none; }

/* Hamburger button (hidden on desktop) */
.topnav__burger {
  display: none;
  background: transparent; border: none; padding: 8px;
  width: 40px; height: 40px;
  flex-direction: column; gap: 5px; align-items: center; justify-content: center;
  cursor: pointer;
}
.topnav__burger span {
  display: block; width: 22px; height: 2px;
  background: var(--green);
  border-radius: 2px;
  transition: transform 0.25s, opacity 0.2s;
}
.topnav.is-open .topnav__burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.topnav.is-open .topnav__burger span:nth-child(2) { opacity: 0; }
.topnav.is-open .topnav__burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile drawer */
.topnav__drawer {
  position: fixed; inset: 56px 0 0 0;
  background: color-mix(in oklab, var(--ink) 50%, transparent);
  opacity: 0; pointer-events: none;
  transition: opacity 0.25s;
  z-index: 49;
}
.topnav__drawer.is-open { opacity: 1; pointer-events: auto; }
.topnav__drawer-inner {
  background: var(--bg);
  border-bottom: 1px solid var(--line);
  padding: 18px 20px 26px;
  display: flex; flex-direction: column; gap: 4px;
  max-height: calc(100dvh - 56px);
  overflow-y: auto;
  transform: translateY(-12px);
  transition: transform 0.25s;
}
.topnav__drawer.is-open .topnav__drawer-inner { transform: translateY(0); }
.topnav__drawer-link {
  background: transparent; border: none; text-align: left;
  padding: 14px 16px; border-radius: 12px;
  font-family: var(--title-font); font-size: 22px;
  color: var(--ink); line-height: 1;
}
.topnav__drawer-link.is-active { background: var(--green); color: var(--bg); }
.topnav__drawer-cta {
  margin-top: 14px; padding: 14px 16px;
  text-align: center; border: 1px solid var(--green);
  border-radius: 999px; color: var(--green); font-size: 14px;
}

/* Responsive switches */
@media (max-width: 1080px) {
  .topnav__link { font-size: 13px; padding: 7px 10px; }
  .topnav__cta { display: none; }
  .topnav__inner { grid-template-columns: auto 1fr auto; }
}
@media (max-width: 880px) {
  .topnav__inner { grid-template-columns: 1fr auto auto; padding: 10px 18px; }
  .topnav__links { display: none; }
  .topnav__burger { display: flex; }
  .brand__line1 { font-size: 11px; }
  .brand__line2 { font-size: 18px; }
}

/* ─── Hero ──────────────────────────────────────────────── */
.hero {
  position: relative; overflow: hidden;
  padding: 80px 24px 100px;
  isolation: isolate;
}
.hero__bg { position: absolute; inset: 0; z-index: -1; }
.hero__sky {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 70% 20%, #f9e7c0 0%, transparent 55%),
    linear-gradient(180deg, #e8e0c5 0%, var(--bg) 70%);
}
.hero__hill {
  position: absolute; left: -10%; right: -10%; bottom: 0;
  height: 220px;
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  filter: blur(0.3px);
}
.hero__hill--back  { background: #c5cda3; bottom: 80px; opacity: 0.55; height: 170px; }
.hero__hill--front { background: #aab884; }

.hero__inner {
  max-width: 1100px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 56px;
}
.hero__cols {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: center;
}
@media (max-width: 880px) { .hero__cols { grid-template-columns: 1fr; } }

.hero__nav {
  display: flex; flex-direction: column; align-items: center; gap: 22px;
  text-align: center;
}
.hero__nav .hero-orbits--centered { max-width: 980px; }
@media (max-width: 880px) {
  .hero__inner { gap: 36px; }
}

.hero__eyebrow {
  display: inline-flex; align-items: center; gap: 12px;
  color: var(--green); font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase;
  margin-bottom: 18px;
}
.hero__eyebrow--centered {
  display: flex;
  justify-content: center;
  text-align: center;
  width: 100%;
  margin-bottom: 28px;
}
.hero__title {
  font-family: var(--title-font);
  font-size: clamp(56px, 8vw, 104px);
  line-height: 0.95; margin: 0 0 24px;
  color: var(--ink);
  letter-spacing: -0.01em;
}
.hero__title-em {
  display: block; color: var(--green); font-style: italic;
  font-weight: 400;
}
.hero__lead {
  font-size: clamp(16px, 1.5vw, 19px);
  color: var(--ink-2);
  max-width: 540px;
  margin: 0 0 32px;
}
.hero__actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* ─── Hero orbit buttons (icon → pill on hover) ─────────── */
.hero-orbits {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 32px;
  max-width: 760px;
}
.hero-orbit {
  /* Icon column is fixed; expand column transitions between 0fr and 1fr */
  display: inline-grid;
  grid-template-columns: 48px 0fr;
  align-items: center;
  height: 48px;
  background: var(--bg);
  color: var(--green);
  border: 1.5px solid var(--green);
  border-radius: 999px;
  overflow: hidden;
  cursor: pointer;
  font: inherit;
  font-family: inherit;
  text-decoration: none;
  padding: 0;
  box-shadow: 0 4px 10px rgba(0,0,0,0.06);
  transition:
    grid-template-columns 0.42s cubic-bezier(0.2, 0.8, 0.2, 1),
    background 0.25s, color 0.25s,
    border-color 0.25s,
    box-shadow 0.25s, transform 0.25s;
}
.hero-orbit__icon {
  width: 48px; height: 48px;
  display: grid; place-items: center;
  flex-shrink: 0;
  transition: transform 0.55s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.hero-orbit__expand {
  min-width: 0;
  overflow: hidden;
  display: inline-flex; align-items: center; gap: 8px;
  white-space: nowrap;
  padding-right: 0;
  transition: padding-right 0.42s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.hero-orbit__label {
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.005em;
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity 0.3s 0.05s, transform 0.35s;
}
.hero-orbit__arrow {
  display: inline-flex;
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 0.3s 0.1s, transform 0.35s 0.05s;
}

/* Expanded state: hover, focus or active sibling */
.hero-orbit:hover,
.hero-orbit:focus-visible {
  grid-template-columns: 48px 1fr;
  background: var(--green);
  color: var(--bg);
  border-color: var(--green);
  transform: translateY(-2px);
  box-shadow: 0 12px 22px rgba(0,0,0,0.18);
  text-decoration: none;
  outline: none;
}
.hero-orbit:hover .hero-orbit__icon,
.hero-orbit:focus-visible .hero-orbit__icon {
  transform: rotate(360deg);
}
.hero-orbit:hover .hero-orbit__expand,
.hero-orbit:focus-visible .hero-orbit__expand {
  padding-right: 20px;
}
.hero-orbit:hover .hero-orbit__label,
.hero-orbit:focus-visible .hero-orbit__label,
.hero-orbit:hover .hero-orbit__arrow,
.hero-orbit:focus-visible .hero-orbit__arrow {
  opacity: 1;
  transform: translateX(0);
}

/* Primary variant (Reservar) — solid green by default, swaps to gold on hover */
.hero-orbit--primary {
  background: var(--green);
  color: var(--bg);
  border-color: var(--green);
  box-shadow: 0 6px 14px rgba(0,0,0,0.16);
}
.hero-orbit--primary:hover,
.hero-orbit--primary:focus-visible {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--ink);
  box-shadow: 0 14px 24px rgba(0,0,0,0.22);
}

/* Static variant — never collapses (used in hero for Reservar) */
.hero-orbit--static {
  grid-template-columns: 48px 1fr;
  cursor: pointer;
}
.hero-orbit--static .hero-orbit__expand { padding-right: 22px; }
.hero-orbit--static .hero-orbit__label { opacity: 1; transform: translateX(0); }
.hero-orbit--static .hero-orbit__arrow  { opacity: 1; transform: translateX(0); }
/* Keep the icon-rotation effect on hover even when static */

.hero__reservar {
  margin-top: 24px;
  display: flex; justify-content: center;
}
.hero__reservar .hero-orbit {
  height: 56px;
  grid-template-columns: 56px 1fr;
  box-shadow: 0 10px 20px rgba(0,0,0,0.18);
  font-size: 15px;
}
.hero__reservar .hero-orbit .hero-orbit__icon { width: 56px; height: 56px; }
.hero__reservar .hero-orbit .hero-orbit__label { font-size: 15px; }

/* ─── Navegador section (between hero wave and Mapa) ─── */
.navegador {
  padding: 32px 24px 8px;
  background: transparent;
}
.navegador__inner {
  max-width: 980px; margin: 0 auto;
  display: flex; flex-direction: column; align-items: center; gap: 22px;
}
.navegador__hint {
  display: inline-flex; align-items: center; gap: 14px;
  color: var(--brown);
  font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase;
  margin: 0;
}
.navegador__hint svg { color: var(--gold); opacity: 0.8; }
.hero-orbits--centered { justify-content: center; max-width: 980px; }

/* Remove the dim-others rule on the navegador (it lives under .hero-orbits too) — keep behavior */

/* When the group is hovered, non-hovered orbits dim slightly for emphasis */
.hero-orbits:hover .hero-orbit:not(:hover):not(:focus-visible) {
  opacity: 0.7;
  transform: translateY(0);
}
.hero-orbits:hover .hero-orbit:not(:hover):not(:focus-visible) .hero-orbit__icon {
  transform: none;
}

/* On touch / small screens — keep them expanded so labels are visible */
@media (max-width: 720px) {
  .hero-orbits { max-width: none; gap: 8px; }
  .hero-orbit { grid-template-columns: 48px 1fr; }
  .hero-orbit__expand { padding-right: 18px; }
  .hero-orbit__label { opacity: 1; transform: translateX(0); }
  .hero-orbit__arrow { opacity: 1; transform: translateX(0); }
  .hero-orbits:hover .hero-orbit:not(:hover) { opacity: 1; }
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hero-orbit, .hero-orbit__icon, .hero-orbit__expand,
  .hero-orbit__label, .hero-orbit__arrow { transition: none !important; }
  .hero-orbit:hover .hero-orbit__icon { transform: none; }
}

.btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 22px; border-radius: 999px;
  font-size: 15px; letter-spacing: 0.01em; font-weight: 500;
  border: 1px solid transparent;
  transition: transform 0.15s, background 0.15s, color 0.15s;
}
.btn--solid { background: var(--green); color: var(--bg); border-color: var(--green); }
.btn--solid:hover { transform: translateY(-1px); background: var(--green-2); }
.btn--ghost { background: transparent; color: var(--green); border-color: var(--green); }
.btn--ghost:hover { background: color-mix(in oklab, var(--green) 10%, transparent); }

/* Hero team painting */
.hero__team {
  margin: 0;
  position: relative;
  filter: drop-shadow(0 18px 30px rgba(0,0,0,0.18));
}
.hero__team img {
  width: 100%;
  border-radius: 6px;
  display: block;
}
.hero__team figcaption {
  margin-top: 14px;
  font-family: var(--title-font);
  font-style: italic;
  font-size: 14px;
  color: var(--ink-3);
  text-align: center;
}
@media (max-width: 880px) {
  .hero__team { max-width: 520px; margin-inline: auto; }
}

.hero__scroll {
  position: absolute; left: 50%; bottom: 24px; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  color: var(--ink-3); font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
}
.hero__scroll-line {
  width: 1px; height: 30px; background: var(--ink-3);
  animation: scrollline 2s ease-in-out infinite;
}
@keyframes scrollline {
  0% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
  51% { transform: scaleY(1); transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

/* ─── Wave divider ──────────────────────────────────────── */
.wave { display: block; width: 100%; height: 28px; opacity: 0.4; }
.wave--flip { transform: scaleX(-1); }

/* ─── Section base ──────────────────────────────────────── */
.section {
  padding: 100px 24px;
  position: relative;
}
.section--soft { background: color-mix(in oklab, var(--bg-2) 60%, var(--bg)); }
.section__inner { max-width: 1180px; margin: 0 auto; }
.section__header {
  text-align: center; max-width: 760px; margin: 0 auto 56px;
}
.eyebrow {
  font-size: 12px; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--green); margin-bottom: 16px;
  display: inline-block; padding: 6px 14px; border: 1px solid var(--green);
  border-radius: 999px;
}
.section__title-line1 {
  display: block;
  font-size: 0.6em;
  font-style: italic;
  color: var(--green);
  letter-spacing: 0.02em;
  font-weight: 500;
  margin-bottom: 4px;
}
.section__title-line2 { display: block; }
.section__title {
  font-family: var(--title-font);
  font-size: clamp(36px, 5vw, 56px);
  line-height: 1.1; margin: 0 0 20px;
  color: var(--ink);
  font-weight: 500;
  text-wrap: balance;
}
.section__intro {
  font-size: clamp(16px, 1.3vw, 18px);
  color: var(--ink-2);
  margin: 0;
  text-wrap: pretty;
}

/* ─── Historia ──────────────────────────────────────────── */
.founder {
  display: grid; grid-template-columns: 1fr 1.2fr; gap: 32px; align-items: stretch;
  margin: 0 0 72px;
}
@media (max-width: 800px) { .founder { grid-template-columns: 1fr; } }
.founder__card {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 24px;
  display: grid; grid-template-columns: 120px 1fr; gap: 20px;
}
.founder__portrait {
  width: 130px; height: 170px; border-radius: 12px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--bg-2);
  flex-shrink: 0;
}
.founder__portrait img {
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%;
}
.founder__name { font-family: var(--title-font); font-size: 32px; color: var(--green); line-height: 1; }
.founder__role { font-size: 13px; color: var(--ink-2); margin: 2px 0 12px; }
.founder__origin {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--brown); margin-bottom: 12px;
}
.founder__formacion {
  margin: 0; padding: 0; list-style: none;
  display: flex; flex-wrap: wrap; gap: 6px;
}
.founder__formacion li {
  font-size: 12px; padding: 4px 10px; border: 1px solid var(--line);
  border-radius: 999px; color: var(--ink-2); background: var(--bg-2);
}
.founder__cita {
  margin: 0; padding: 32px 36px;
  background: var(--green); color: var(--bg);
  border-radius: var(--radius);
  display: flex; gap: 16px; align-items: flex-start;
  position: relative;
}
.founder__cita p {
  font-family: var(--title-font); font-style: italic;
  font-size: clamp(18px, 2vw, 24px); line-height: 1.35;
  margin: 0;
}
.founder__cita svg { flex-shrink: 0; opacity: 0.7; }

.timeline {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 0;
  position: relative;
}
.timeline::before {
  content: ""; position: absolute; left: 28px; top: 24px; bottom: 24px;
  width: 2px; background: repeating-linear-gradient(180deg, var(--line) 0 6px, transparent 6px 12px);
}
.timeline__item {
  display: grid; grid-template-columns: 60px 1fr; gap: 24px;
  padding: 18px 0 18px 0;
  position: relative;
}
.timeline__marker {
  width: 58px; height: 58px; border-radius: 50%;
  background: var(--bg); border: 2px solid var(--green);
  display: grid; place-items: center;
  position: relative; z-index: 1;
  font-family: var(--title-font); color: var(--green); font-size: 22px;
}
.timeline__content {
  border-left: 3px solid var(--green);
  padding: 4px 0 4px 20px;
}
.timeline__year {
  font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--brown); margin-bottom: 4px;
}
.timeline__title {
  font-family: var(--title-font); font-size: clamp(22px, 2.4vw, 30px);
  margin: 0 0 8px; color: var(--ink); font-weight: 500;
}
.timeline__text { color: var(--ink-2); margin: 0; max-width: 720px; }

.epilogo + .footer,
.section + .footer { margin-top: 0; }

/* ════════════════════════════════════════════════════════════
   EPÍLOGO — homenaje a Rosa (papel sepia, en consonancia)
   ════════════════════════════════════════════════════════════ */
.epilogo {
  position: relative;
  padding: 120px 24px 80px;
  background:
    radial-gradient(ellipse at 50% 0%, color-mix(in oklab, var(--gold) 14%, transparent) 0%, transparent 55%),
    linear-gradient(180deg, color-mix(in oklab, var(--bg) 92%, var(--gold) 8%) 0%, var(--bg) 100%);
  color: var(--ink);
  isolation: isolate;
  overflow: hidden;
}
.epilogo::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    radial-gradient(circle at 25% 30%, rgba(107, 63, 36, 0.04) 0 1px, transparent 2px),
    radial-gradient(circle at 70% 60%, rgba(107, 63, 36, 0.03) 0 1px, transparent 2px),
    radial-gradient(circle at 50% 80%, rgba(107, 63, 36, 0.03) 0 1px, transparent 2px);
  background-size: 12px 12px, 16px 16px, 20px 20px;
  opacity: 0.6;
}
.epilogo__bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.epilogo__grain { display: none; }
.epilogo__deco {
  position: absolute; width: 200px; height: 200px;
  color: var(--gold);
  opacity: 0.35;
}
.epilogo__deco--tl { top: 30px; left: 30px; }
.epilogo__deco--br { bottom: 30px; right: 30px; transform: rotate(180deg); }

.epilogo__inner {
  max-width: 920px; margin: 0 auto;
  position: relative;
}

.epilogo__head { text-align: center; margin-bottom: 72px; }
.epilogo__eyebrow {
  display: inline-flex; align-items: center; gap: 14px;
  color: var(--brown);
  font-size: 12px; letter-spacing: 0.4em; text-transform: uppercase;
  margin-bottom: 24px;
}
.epilogo__eyebrow svg { color: var(--gold); opacity: 0.8; }
.epilogo__title {
  font-family: var(--title-font);
  font-size: clamp(48px, 7vw, 88px);
  line-height: 1; margin: 0;
  font-weight: 400;
  font-style: italic;
  letter-spacing: -0.01em;
}
.epilogo__title-line1 { display: block; color: var(--ink); }
.epilogo__title-line2 {
  display: block;
  color: var(--green);
  font-style: normal;
  font-family: var(--hand-font);
  font-size: 1.15em;
  margin-top: 4px;
}
.epilogo__intro {
  max-width: 540px; margin: 28px auto 0;
  font-size: 17px; line-height: 1.65;
  color: var(--ink-2);
  font-style: italic;
  text-wrap: pretty;
}

/* Rosa portrait + cita */
.epilogo__rosa {
  display: grid; grid-template-columns: auto 1fr; gap: 48px;
  align-items: center;
  margin-bottom: 56px;
}
@media (max-width: 760px) { .epilogo__rosa { grid-template-columns: 1fr; gap: 32px; text-align: center; } }

.epilogo__portrait { margin: 0; position: relative; }
.epilogo__portrait img {
  width: 240px; height: 300px;
  object-fit: cover; object-position: 50% 20%;
  border-radius: 4px;
  border: 8px solid var(--bg);
  outline: 1px solid color-mix(in oklab, var(--gold) 60%, transparent);
  outline-offset: 4px;
  box-shadow:
    0 18px 30px rgba(60, 40, 20, 0.18),
    0 2px 4px rgba(60, 40, 20, 0.08);
  transform: rotate(-1.5deg);
  transition: transform 0.4s;
}
.epilogo__portrait:hover img { transform: rotate(0deg); }
.epilogo__portrait figcaption {
  margin-top: 24px;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.epilogo__signature {
  font-family: var(--hand-font);
  font-size: 44px;
  color: var(--green);
  line-height: 1;
}
.epilogo__role {
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink-3);
}

.epilogo__cita {
  margin: 0;
  position: relative;
  padding: 0 0 0 8px;
}
.epilogo__cita > svg {
  color: var(--gold); opacity: 0.7;
  margin-bottom: 12px;
}
.epilogo__cita p {
  font-family: var(--title-font);
  font-size: clamp(22px, 2.6vw, 30px);
  line-height: 1.4; font-style: italic;
  margin: 0 0 18px;
  color: var(--ink);
  text-wrap: balance;
}
.epilogo__cita footer {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--brown);
}

/* Formación */
.epilogo__formacion-wrap {
  text-align: center;
  margin: 0 0 80px;
  padding: 32px 0;
  border-top: 1px solid color-mix(in oklab, var(--gold) 35%, transparent);
  border-bottom: 1px solid color-mix(in oklab, var(--gold) 35%, transparent);
}
.epilogo__formacion-label {
  font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--brown); margin-bottom: 16px;
}
.epilogo__formacion {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center;
}
.epilogo__formacion li {
  font-family: var(--title-font);
  font-size: 16px; font-style: italic;
  color: var(--green);
  padding: 6px 16px;
  border-radius: 999px;
  background: var(--bg);
  border: 1px solid color-mix(in oklab, var(--gold) 35%, transparent);
}

/* Timeline */
.epilogo__timeline {
  list-style: none; padding: 0; margin: 0 0 64px;
  display: grid; gap: 28px;
  position: relative;
}
.epilogo__timeline::before {
  content: "";
  position: absolute; left: 26px; top: 30px; bottom: 30px;
  width: 1px;
  background: linear-gradient(180deg,
    transparent 0%,
    color-mix(in oklab, var(--gold) 60%, transparent) 10%,
    color-mix(in oklab, var(--gold) 60%, transparent) 90%,
    transparent 100%
  );
}
.epilogo__item {
  display: grid; grid-template-columns: 56px 1fr; gap: 24px;
  align-items: start;
}
.epilogo__marker {
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--bg);
  border: 1px solid var(--gold);
  display: grid; place-items: center;
  position: relative; z-index: 1;
  box-shadow: 0 4px 10px rgba(60, 40, 20, 0.12);
}
.epilogo__marker-num {
  font-family: var(--title-font); font-style: italic;
  font-size: 18px; color: var(--green);
}
.epilogo__content { padding-top: 4px; }
.epilogo__year {
  font-family: var(--hand-font);
  font-size: 22px;
  color: var(--brown);
  line-height: 1; margin-bottom: 4px;
}
.epilogo__heading {
  font-family: var(--title-font);
  font-size: clamp(22px, 2.6vw, 28px);
  margin: 0 0 8px;
  color: var(--ink);
  font-weight: 500;
  font-style: italic;
}
.epilogo__text {
  margin: 0;
  color: var(--ink-2);
  font-size: 15.5px; line-height: 1.6;
  max-width: 620px;
  text-wrap: pretty;
}

/* Cierre */
.epilogo__cierre {
  display: flex; align-items: center; justify-content: center; gap: 24px;
  color: var(--gold);
  padding: 24px 0;
}
.epilogo__cierre p {
  font-family: var(--title-font); font-style: italic;
  font-size: clamp(28px, 4vw, 40px);
  margin: 0;
  color: var(--green);
}

@media (max-width: 720px) {
  .epilogo { padding: 80px 18px 60px; }
  .epilogo__head { margin-bottom: 48px; }
  .epilogo__portrait img { width: 200px; height: 250px; }
  .epilogo__signature { font-size: 38px; }
  .epilogo__rosa { margin-bottom: 40px; }
  .epilogo__formacion-wrap { margin-bottom: 48px; padding: 24px 0; }
  .epilogo__deco { width: 120px; height: 120px; opacity: 0.25; }
  .epilogo__deco--tl { top: 16px; left: 16px; }
  .epilogo__deco--br { bottom: 16px; right: 16px; }
  .epilogo__timeline::before { left: 20px; }
  .epilogo__item { grid-template-columns: 42px 1fr; gap: 16px; }
  .epilogo__marker { width: 42px; height: 42px; }
  .epilogo__marker-num { font-size: 14px; }
}
.hab-zone { margin-bottom: 56px; }
.hab-zone:last-child { margin-bottom: 0; }
.hab-zone__head {
  display: flex; align-items: center; gap: 18px;
  margin-bottom: 28px;
}
.hab-zone__line {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--line) 30%, var(--line) 70%, transparent);
}
.hab-zone__title {
  font-family: var(--title-font); font-size: clamp(20px, 2.5vw, 28px);
  margin: 0; color: var(--green); font-weight: 500;
  font-style: italic; letter-spacing: 0.02em;
  text-align: center;
}

/* ─── Habitantes (chapa gallery) ─────────────────────────── */
.habitantes {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 28px;
}
@media (max-width: 600px) {
  .habitantes { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .hab-zone__head { gap: 12px; margin-bottom: 20px; }
}
.habitante {
  background: transparent; border: none; padding: 0;
  display: flex; flex-direction: column; align-items: center; gap: 14px;
  text-align: center;
  transition: transform 0.2s;
}
.habitante:hover:not(:disabled) { transform: translateY(-4px); }
.habitante:disabled { cursor: default; opacity: 0.7; }

.habitante__chapa {
  position: relative; width: clamp(130px, 22vw, 180px); aspect-ratio: 1;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,0.12));
  transition: filter 0.2s;
}
.habitante:hover:not(:disabled) .habitante__chapa {
  filter: drop-shadow(0 14px 24px rgba(0,0,0,0.2));
}
.habitante__chapa img { width: 100%; height: 100%; border-radius: 50%; }

.habitante__placeholder {
  width: 100%; height: 100%; border-radius: 50%;
  border: 3px solid var(--bg);
  outline: 2px solid var(--green);
  display: grid; place-items: center;
  color: var(--bg); font-family: var(--title-font);
  font-size: 64px;
}
.habitante__soon {
  position: absolute; left: 50%; bottom: -8px; transform: translateX(-50%);
  background: var(--ink); color: var(--bg);
  font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 999px; white-space: nowrap;
}
.habitante__name {
  font-family: var(--title-font); font-size: 24px; color: var(--ink);
  line-height: 1;
}
.habitante__tag {
  font-size: 12px; color: var(--ink-2); margin-top: 4px;
  max-width: 200px;
}

/* ─── Naturaleza ─────────────────────────────────────────── */
.botanica {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 18px;
}
.botanica__card {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 20px; text-align: left;
  position: relative;
}
:root[data-card="sello"] .botanica__card {
  border: 1px solid var(--line);
  background:
    radial-gradient(circle at top right, color-mix(in oklab, var(--gold) 12%, transparent), transparent 40%),
    var(--bg);
  box-shadow: inset 0 0 0 4px var(--bg), inset 0 0 0 5px var(--line);
}
:root[data-card="sombra"] .botanica__card {
  box-shadow: 0 6px 14px rgba(0,0,0,0.06);
}
.botanica__art { margin-bottom: 12px; }
.botanica__name {
  font-family: var(--title-font); font-size: 22px; color: var(--ink);
  line-height: 1;
}
.botanica__latin {
  font-style: italic; font-size: 12px; color: var(--green); margin-bottom: 8px;
}
.botanica__note { margin: 0; font-size: 14px; color: var(--ink-2); }
.botanica__foot {
  margin: 32px auto 0; max-width: 600px; text-align: center;
  font-size: 13px; color: var(--ink-3);
  display: flex; align-items: center; justify-content: center; gap: 8px;
}

/* ─── Botánica · clickable card ─────────────────────────── */
.botanica__card--btn {
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
  width: 100%;
}
.botanica__card--btn:hover {
  transform: translateY(-3px);
  border-color: var(--accent);
  box-shadow: 0 12px 24px rgba(0,0,0,0.08);
}
.botanica__go {
  display: inline-flex; margin-top: 12px;
  font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--accent);
  opacity: 0.85;
}

/* ─── Videos tab (used by tema / taller / animal / botánica) ── */
.videos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 22px;
  max-width: 1000px;
  margin: 0 auto;
}
@media (max-width: 600px) {
  .videos { grid-template-columns: 1fr; }
}
.video-block { margin: 0; }
.video-block__frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius);
  overflow: hidden;
  background: #000;
  border: 1px solid var(--line);
  box-shadow: 0 10px 24px rgba(0,0,0,0.12);
}
.video-block__frame iframe {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border: 0;
}
.video-block figcaption {
  margin-top: 12px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  font-size: 14px; color: var(--ink-2);
}
.video-block figcaption a {
  font-size: 13px; color: var(--green);
  margin-left: auto;
}

.video-card {
  display: grid; grid-template-columns: 72px 1fr; gap: 18px; align-items: center;
  text-decoration: none; color: inherit;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 20px 22px;
  transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
}
.video-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  box-shadow: 0 10px 20px rgba(0,0,0,0.08);
  text-decoration: none;
}
.video-card__icon {
  width: 72px; height: 72px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--bg);
  display: grid; place-items: center;
}
.video-card__t {
  font-family: var(--title-font); font-size: 20px; color: var(--ink);
  margin-bottom: 4px;
}
.video-card__host {
  font-size: 13px; color: var(--ink-3);
}
.video-card__desc {
  font-size: 13px;
  color: color-mix(in oklab, var(--ink) 65%, transparent);
  margin: 4px 0;
  line-height: 1.4;
}
.video-block__desc {
  font-size: 13px;
  color: color-mix(in oklab, var(--ink) 65%, transparent);
  margin: 6px 0 0;
  line-height: 1.45;
}

/* Admin inline: añadir vídeo desde la pestaña Vídeos */
.videos-admin-add {
  margin-top: 14px;
  display: inline-flex; align-items: center; gap: 6px;
}
.videos-admin-add--inline { display: flex; justify-content: center; margin: 14px auto 0; }
.videos-admin-form {
  background: color-mix(in oklab, var(--accent, #1f4d3a) 6%, var(--cream));
  border: 1px solid color-mix(in oklab, var(--accent, #1f4d3a) 18%, var(--cream-2));
  border-radius: 10px;
  padding: 18px 20px;
  margin: 16px auto 0;
  max-width: 540px;
  text-align: left;
}
.videos-admin-form h4 {
  margin: 0 0 12px;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent, var(--ink));
}
.videos-admin-form label {
  display: block; margin-bottom: 10px;
}
.videos-admin-form label > span {
  display: block;
  font-size: 11px;
  margin-bottom: 4px;
  color: var(--ink-3, #5a4f3f);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.videos-admin-form input, .videos-admin-form textarea {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--cream-2);
  border-radius: 6px;
  font: inherit;
  background: white;
}
.videos-admin-form__actions {
  display: flex; gap: 8px; justify-content: flex-end; margin-top: 8px;
}

/* ── Subida de vídeo propio en el form admin ─────────────────── */
.videos-admin-upload {
  margin: 12px 0;
  padding: 12px;
  background: #faf8ef;
  border: 1px dashed #d8d2bd;
  border-radius: 8px;
  transition: background 0.15s, border-color 0.15s;
}
.videos-admin-upload.is-dragover {
  background: #eef5e8;
  border-color: #1f4d3a;
  border-style: solid;
}
.videos-admin-upload__or {
  text-align: center;
  font-size: 12px;
  color: #9a8f7a;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.videos-admin-upload__hint {
  font-size: 11px;
  color: #9a8f7a;
  margin: 8px 0 0;
  line-height: 1.4;
}
.videos-admin-upload__progress {
  display: flex; flex-direction: column; gap: 6px;
}
.videos-admin-upload__bar {
  height: 8px;
  background: #e7dfc9;
  border-radius: 4px;
  overflow: hidden;
}
.videos-admin-upload__bar > div {
  height: 100%;
  background: #1f4d3a;
  border-radius: 4px;
  transition: width 0.2s;
}
.videos-admin-upload__progress span {
  font-size: 12px;
  color: #5a4f3f;
  text-align: center;
}

/* Player nativo (vídeo autoalojado) — encaja en el mismo frame 16:9 */
.video-block__native {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: contain;
}
.video-block__processing {
  font-size: 12px;
  color: #a17f2c;
  font-style: italic;
  margin-left: 4px;
}
.videos__item-wrap { position: relative; }
.videos__del-btn {
  position: absolute; top: 6px; right: 6px;
  background: rgba(177,74,58,0.92); color: white;
  border: 2px solid var(--cream);
  border-radius: 50%;
  width: 32px; height: 32px;
  cursor: pointer; font-size: 14px;
  z-index: 5;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
/* Free content tab — markdown ligero */
.free-content {
  position: relative;
  padding: 24px 32px;
  background: var(--cream);
  border-radius: 12px;
  border: 1px solid var(--cream-2);
}
.free-content__body { line-height: 1.65; color: var(--ink); }
.free-content__body h1 { font-family: var(--title-font, inherit); font-size: 28px; margin: 16px 0 10px; }
.free-content__body h2 { font-size: 22px; margin: 14px 0 8px; }
.free-content__body h3 { font-size: 18px; margin: 12px 0 6px; }
.free-content__body p { margin: 0 0 12px; }
.free-content__body ul { padding-left: 22px; margin: 0 0 12px; }
.free-content__body li { margin-bottom: 4px; }
.free-content__body a { color: var(--accent, var(--brown, #6b3f24)); text-decoration: underline; }

.free-content__edit-btn {
  position: absolute; top: 12px; right: 12px;
  background: rgba(217,199,121,0.95); color: #1f4d3a;
  border: 2px solid var(--cream-2);
  border-radius: 999px; padding: 6px 14px;
  font: 600 12px/1 inherit; cursor: pointer;
  z-index: 2;
}
.free-content__edit-btn:hover { background: #d9c779; }

.free-content--edit { background: white; padding: 18px 20px; }
.free-content__bar { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.free-content__hint { font-size: 11px; color: color-mix(in oklab, var(--ink) 60%, transparent); }
.free-content__hint code { background: var(--cream); padding: 1px 4px; border-radius: 3px; }
.free-content__editor {
  width: 100%; padding: 12px 14px;
  border: 1px solid var(--cream-2); border-radius: 8px;
  font-family: ui-monospace, "SFMono-Regular", Menlo, monospace;
  font-size: 14px; line-height: 1.5;
  resize: vertical; min-height: 200px;
}
.free-content__actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 12px; }

.videos-empty {
  text-align: center; padding: 56px 24px;
  max-width: 540px; margin: 0 auto;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
}
.videos-empty h3 {
  font-family: var(--title-font); font-size: 28px; margin: 0;
  color: var(--ink); font-weight: 500;
}
.videos-empty p {
  margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.6;
}

/* ─── Botánica detail body ──────────────────────────────── */
.detail__hero-botanica {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  color: var(--accent);
}
.detail__hero-botanica svg {
  filter: drop-shadow(0 10px 18px rgba(0,0,0,0.1));
}
.detail__hero-botanica-tag {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--brown);
}
.bot-ficha__head {
  text-align: center; margin-bottom: 24px;
}
.bot-ficha__latin {
  font-family: var(--title-font); font-style: italic; font-size: 24px;
  margin-bottom: 4px;
}
.bot-ficha__familia {
  font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--ink-3);
}
.bot-ficha__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
  max-width: 720px; margin: 0 auto;
}
.bot-ficha__cell {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 16px 18px;
}
.bot-ficha__cell--full { grid-column: 1 / -1; }
.bot-ficha__k {
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink-3); margin-bottom: 6px;
}
.bot-datos { max-width: 720px; margin: 0 auto; }
.bot-datos h3 {
  font-family: var(--title-font); font-size: clamp(22px, 2.4vw, 28px);
  color: var(--ink); margin: 0 0 14px;
  font-weight: 500;
}
.bot-datos p {
  font-size: 16px; color: var(--ink-2); line-height: 1.65;
  margin: 0 0 24px;
}
.bot-sabias {
  background: var(--bg-2); border-left: 4px solid var(--accent);
  padding: 20px 24px; border-radius: 8px;
}
.bot-sabias__tag {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 8px;
}
.bot-sabias p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.bot-anecdota { max-width: 720px; margin: 0 auto; }
.bot-anecdota__tag {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--brown); margin-bottom: 12px; text-align: center;
}
.bot-anecdota blockquote {
  margin: 0; padding: 32px 36px;
  background: var(--green); color: var(--bg);
  border-radius: var(--radius);
  display: flex; gap: 16px; align-items: flex-start;
}
.bot-anecdota blockquote svg { flex-shrink: 0; opacity: 0.6; color: var(--bg); }
.bot-anecdota p {
  font-family: var(--title-font); font-style: italic;
  font-size: clamp(18px, 2vw, 24px); line-height: 1.4;
  margin: 0 0 12px;
}
.bot-anecdota footer {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  opacity: 0.8;
}
@media (max-width: 600px) {
  .bot-ficha__grid { grid-template-columns: 1fr; }
}

/* ─── Campamento (Capítulo IV) ──────────────────────────── */
.campamento-grid {
  display: grid; gap: 24px;
  max-width: 820px; margin: 0 auto;
}
.campamento-card {
  display: grid; grid-template-columns: 140px 1fr; gap: 28px; align-items: center;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 28px 32px;
  text-align: left; cursor: pointer;
  transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
}
.campamento-card:hover {
  transform: translateY(-3px);
  border-color: var(--accent);
  box-shadow: 0 14px 28px rgba(0,0,0,0.10);
}
.campamento-card__art {
  width: 140px; height: 140px;
  border-radius: 50%;
  background: color-mix(in oklab, var(--accent) 12%, var(--bg-2));
  color: var(--accent);
  display: grid; place-items: center;
}
.campamento-card__eyebrow {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 8px;
}
.campamento-card h3 {
  font-family: var(--title-font); font-size: clamp(24px, 3vw, 32px);
  color: var(--ink); margin: 0 0 10px; font-weight: 500;
}
.campamento-card p {
  margin: 0 0 14px; color: var(--ink-2); font-size: 15px; line-height: 1.55;
}
.campamento-card__go {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; letter-spacing: 0.06em;
  color: var(--accent);
}
@media (max-width: 600px) {
  .campamento-card { grid-template-columns: 1fr; padding: 22px; }
  .campamento-card__art { width: 96px; height: 96px; }
}

/* ─── Cumpleaños (Capítulo V · Lúdico) ──────────────────── */
.cumple-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
}
.cumple-card {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 22px;
  text-align: left; cursor: pointer; position: relative;
  display: flex; flex-direction: column; gap: 12px;
  transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
}
.cumple-card:hover {
  transform: translateY(-3px);
  border-color: var(--accent);
  box-shadow: 0 14px 26px rgba(0,0,0,0.10);
}
.cumple-card__art {
  color: var(--accent);
  display: flex; justify-content: flex-start;
}
.cumple-card__eyebrow {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--accent);
}
.cumple-card h3 {
  font-family: var(--title-font); font-size: 26px;
  color: var(--ink); margin: 0; font-weight: 500;
}
.cumple-card p {
  margin: 0; color: var(--ink-2); font-size: 14px; line-height: 1.55;
}
.cumple-card__go {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--accent);
  margin-top: 4px;
}
.cumple-card__ribbon {
  position: absolute; top: 16px; right: 16px;
  background: var(--accent); color: var(--bg);
  font-size: 11px; letter-spacing: 0.06em; padding: 4px 10px;
  border-radius: 999px;
  max-width: 60%; text-align: right;
  font-family: var(--title-font);
}

/* ─── Principios standalone + Todos nosotros (book) ─────── */
.principios--standalone { margin-top: 0; }
.principios--standalone .principios__grid { margin-bottom: 64px; }

.nosotros {
  margin-top: 56px;
  padding-top: 56px;
  border-top: 1px solid var(--line);
}
.nosotros__head {
  display: flex; align-items: center; gap: 18px;
  margin-bottom: 16px;
}
.nosotros__line {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--line) 30%, var(--line) 70%, transparent);
}
.nosotros__title {
  font-family: var(--title-font); font-size: clamp(24px, 3vw, 34px);
  margin: 0; color: var(--green); font-weight: 500; font-style: italic;
}
.nosotros__intro {
  text-align: center; color: var(--ink-2);
  max-width: 640px; margin: 0 auto 48px;
  font-size: 15px; line-height: 1.65;
}

.book {
  position: relative;
  max-width: 920px;
  margin: 0 auto;
  display: grid; grid-template-columns: 56px 1fr 56px;
  gap: 24px; align-items: center;
}
.book__spread {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0;
  background:
    linear-gradient(to right, color-mix(in oklab, var(--brown) 8%, var(--bg)) 0%, var(--bg) 8%, var(--bg) 92%, color-mix(in oklab, var(--brown) 8%, var(--bg)) 100%);
  border: 1px solid color-mix(in oklab, var(--brown) 30%, var(--line));
  border-radius: 6px;
  box-shadow:
    0 18px 40px rgba(60, 40, 20, 0.20),
    inset 0 0 0 1px color-mix(in oklab, var(--gold) 30%, transparent);
  min-height: 340px;
  position: relative;
}
.book__spread::before {
  content: "";
  position: absolute; left: 50%; top: 8%; bottom: 8%; width: 12px;
  transform: translateX(-50%);
  background: linear-gradient(to right,
    transparent 0%,
    rgba(60, 40, 20, 0.14) 30%,
    rgba(60, 40, 20, 0.20) 50%,
    rgba(60, 40, 20, 0.14) 70%,
    transparent 100%);
  pointer-events: none;
}
.book__page { padding: 32px 36px; }
.book__nav {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--bg);
  border: 1px solid var(--line);
  display: grid; place-items: center;
  color: var(--green);
  cursor: pointer;
  transition: background 0.15s, color 0.15s, transform 0.15s;
}
.book__nav:hover:not(:disabled) {
  background: var(--green); color: var(--bg); border-color: var(--green);
  transform: translateY(-1px);
}
.book__nav:disabled { opacity: 0.35; cursor: default; }
.book__nav--prev svg { transform: rotate(180deg); }
.book__page-num {
  position: absolute;
  left: 0; right: 0; bottom: -28px;
  text-align: center;
  font-family: var(--hand-font);
  font-size: 18px;
  color: var(--brown);
}

.dedicatoria {
  position: relative;
  height: 100%;
  display: flex; flex-direction: column; gap: 10px;
  padding: 16px 18px;
  border: 1px dashed color-mix(in oklab, var(--gold) 60%, transparent);
  border-radius: 8px;
  background: color-mix(in oklab, var(--bg) 92%, var(--gold) 8%);
}
.dedicatoria--blank {
  align-items: center; justify-content: center;
  color: var(--ink-3); font-style: italic;
  border-style: dotted;
}
.dedicatoria__corner {
  position: absolute; width: 18px; height: 18px;
  border: 1px solid color-mix(in oklab, var(--gold) 70%, transparent);
}
.dedicatoria__corner--tl { top: -4px; left: -4px; border-right: none; border-bottom: none; }
.dedicatoria__corner--br { bottom: -4px; right: -4px; border-left: none; border-top: none; }
.dedicatoria__red {
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--accent);
  font-weight: 600;
}
.dedicatoria__t {
  font-family: var(--title-font);
  font-size: 22px; margin: 0;
  color: var(--ink); font-weight: 500;
  line-height: 1.15;
}
.dedicatoria__d {
  margin: 0; font-size: 14px;
  color: var(--ink-2);
  font-style: italic;
  font-family: var(--title-font);
}
.dedicatoria__link {
  font-size: 13px; color: var(--accent);
  margin-top: auto;
}
.dedicatoria__pending {
  margin-top: auto;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ink-3);
}
.dedicatoria__sig {
  font-family: var(--hand-font);
  font-size: 16px; color: var(--brown);
  opacity: 0.7;
}

@media (max-width: 720px) {
  .book { grid-template-columns: 40px 1fr 40px; gap: 12px; }
  .book__nav { width: 40px; height: 40px; }
  .book__spread { grid-template-columns: 1fr; min-height: auto; }
  .book__spread::before { display: none; }
  .book__page { padding: 22px; }
  .book__page:nth-child(2) {
    border-top: 1px dashed var(--line);
  }
}

/* ─── Mapa ───────────────────────────────────────────────── */
.mapa {
  position: relative;
  border-radius: 6px;
  overflow: hidden;
  background: var(--bg-2);
  line-height: 0;
}
.mapa__img {
  width: 100%;
  height: auto;
  display: block;
}
.mapa__pin {
  position: absolute;
  transform: translate(-50%, -50%);
  background: transparent;
  border: none;
  padding: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
}
.mapa__pin:focus { outline: none; }
.mapa__pin-dot {
  display: block;
  width: 18px;
  height: 18px;
  margin: 5px;
  border-radius: 50%;
  background: var(--cat);
  border: 3px solid #fff;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.18),
    0 3px 8px rgba(0,0,0,0.28);
  transition: transform 0.18s, box-shadow 0.18s;
  position: relative;
  z-index: 1;
}
.mapa__pin::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  background: var(--cat);
  opacity: 0;
  z-index: 0;
  transform: scale(0.6);
  transition: opacity 0.3s, transform 0.3s;
}
.mapa__pin:hover .mapa__pin-dot,
.mapa__pin:focus-visible .mapa__pin-dot,
.mapa__pin.is-active .mapa__pin-dot {
  transform: scale(1.18);
}
.mapa__pin.is-active::before,
.mapa__pin:hover::before {
  opacity: 0.22;
  transform: scale(1);
  animation: pinPulse 1.6s ease-out infinite;
}
@keyframes pinPulse {
  0%   { transform: scale(0.9); opacity: 0.4; }
  100% { transform: scale(1.8); opacity: 0; }
}

/* Tooltip bubble */
.mapa__pin-tip {
  position: absolute;
  bottom: calc(100% + 14px);
  left: 50%;
  transform: translateX(-50%) translateY(6px) scale(0.96);
  background: var(--bg);
  color: var(--ink);
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid var(--line);
  box-shadow:
    0 10px 24px rgba(0,0,0,0.18),
    0 2px 6px rgba(0,0,0,0.08);
  min-width: 160px; max-width: 240px;
  display: flex; flex-direction: column; gap: 2px;
  text-align: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.18s, transform 0.18s;
  z-index: 10;
}
.mapa__pin-tip::after {
  content: "";
  position: absolute;
  top: 100%; left: 50%;
  transform: translateX(-50%) translateY(-1px);
  width: 12px; height: 7px;
  background: var(--bg);
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.mapa__pin:hover .mapa__pin-tip,
.mapa__pin:focus-visible .mapa__pin-tip,
.mapa__pin.is-active .mapa__pin-tip {
  opacity: 1;
  transform: translateX(-50%) translateY(0) scale(1);
}
.mapa__pin-tip-cat {
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--cat);
  font-weight: 600;
}
.mapa__pin-tip-label {
  font-family: var(--title-font);
  font-size: 17px;
  color: var(--ink);
  line-height: 1.15;
}
.mapa__pin-tip-go {
  font-size: 11px;
  color: var(--ink-3);
  letter-spacing: 0.06em;
  margin-top: 2px;
}
.mapa__pin.is-info { cursor: default; }
.mapa__pin.is-info .mapa__pin-tip-go { display: none; }

/* Auto-flip tooltip near right edge */
.mapa__pin[style*="left: 7"] .mapa__pin-tip,
.mapa__pin[style*="left: 8"] .mapa__pin-tip,
.mapa__pin[style*="left: 9"] .mapa__pin-tip {
  /* No-op; keeping in case future overrides needed */
}

/* ─── Leyenda del mapa (sellos de categoría) ────────────── */
.leyenda {
  margin-top: 40px;
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 22px 24px;
}
.leyenda__head {
  font-size: 11px;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--brown);
  text-align: center;
  margin-bottom: 18px;
  position: relative;
}
.leyenda__head::before,
.leyenda__head::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 60px; height: 1px;
  background: var(--line);
}
.leyenda__head::before { right: calc(50% + 60px); }
.leyenda__head::after  { left:  calc(50% + 60px); }

.leyenda__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 18px;
}
.leyenda__item {
  display: flex;
  gap: 14px;
  align-items: center;
}
.leyenda__amuleto {
  flex-shrink: 0;
  position: relative;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid var(--cat);
  box-shadow: 0 4px 10px rgba(0,0,0,0.12);
  background: var(--bg-2);
}
.leyenda__amuleto img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.leyenda__dot {
  position: absolute;
  bottom: -2px; right: -2px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: var(--cat);
  border: 2px solid var(--bg);
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}
.leyenda__name {
  font-family: var(--title-font);
  font-size: 17px;
  color: var(--ink);
  line-height: 1.15;
  margin-bottom: 2px;
}
.leyenda__desc {
  font-size: 12px;
  color: var(--ink-2);
  line-height: 1.4;
}

@media (max-width: 720px) {
  .mapa__pin { width: 36px; height: 36px; }
  .mapa__pin-dot { width: 14px; height: 14px; margin: 8px; }
  .mapa__pin-tip { min-width: 140px; max-width: 200px; padding: 8px 12px; }
  .mapa__pin-tip-label { font-size: 15px; }
  .leyenda { padding: 18px 16px; margin-top: 28px; }
  .leyenda__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .leyenda__amuleto { width: 56px; height: 56px; }
}

/* ─── Equipo + Valores ───────────────────────────────────── */
.equipo {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 18px; margin-bottom: 72px;
}
.equipo__card {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 22px;
  position: relative;
}
.equipo__num {
  font-family: var(--title-font); font-size: 36px; color: var(--green);
  line-height: 1; margin-bottom: 6px; opacity: 0.6;
}
.equipo__rol {
  font-family: var(--title-font); font-size: 22px; color: var(--ink);
  margin-bottom: 6px;
}
.equipo__desc { margin: 0; font-size: 14px; color: var(--ink-2); }

.valores__title {
  font-family: var(--title-font); font-size: 28px;
  margin: 0 0 24px; color: var(--ink); font-weight: 500;
  text-align: center;
}
.valores__grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 20px;
}
.valores__card {
  background: var(--green); color: var(--bg);
  border-radius: var(--radius); padding: 24px;
  position: relative;
}
.valores__leaf { color: var(--bg); opacity: 0.8; margin-bottom: 10px; }
.valores__t {
  font-family: var(--title-font); font-size: 22px; margin-bottom: 6px;
}
.valores__card p { margin: 0; font-size: 14px; opacity: 0.9; }

/* ─── Temáticas (chapter III) ────────────────────────────── */
.tema-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 22px;
}
.tema-card {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px;
  text-align: left;
  display: flex; flex-direction: column; gap: 14px;
  cursor: pointer;
  position: relative;
  transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
}
.tema-card:hover {
  transform: translateY(-3px);
  border-color: var(--accent);
  box-shadow: 0 14px 28px rgba(0,0,0,0.10);
}
.tema-card--soon { opacity: 0.6; }
.tema-card--soon:hover { opacity: 0.85; }
.tema-card__insignia {
  width: 100%; aspect-ratio: 16 / 9;
  border-radius: 8px;
  overflow: hidden;
  background: var(--bg-2);
  border: 1px solid var(--line);
  position: relative;
}
.tema-card__insignia img {
  width: 100%; height: 100%; object-fit: cover;
}
.tema-card__placeholder {
  width: 100%; height: 100%;
  display: grid; place-items: center;
  background: var(--accent); color: var(--bg);
  font-family: var(--title-font); font-size: 56px;
}
.tema-card__soon {
  position: absolute; top: 8px; right: 8px;
  background: var(--ink); color: var(--bg);
  font-size: 10px; letter-spacing: 0.15em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 999px;
}
.tema-card__body { display: flex; flex-direction: column; gap: 4px; }
.tema-card__name {
  font-family: var(--title-font);
  font-size: 21px; color: var(--ink); line-height: 1.1;
}
.tema-card__sub {
  font-size: 13px; color: var(--ink-2);
  text-wrap: pretty;
}

@media (max-width: 600px) {
  .tema-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  .tema-card { padding: 12px; }
  .tema-card__name { font-size: 17px; }
  .tema-card__sub { font-size: 11px; }
}

/* Tema detail body styles */
.tema-meto h3, .tema-meto h4,
.taller-ficha h3, .taller-materiales h3, .taller-aprendizajes h3 {
  font-family: var(--title-font);
  font-size: clamp(22px, 2.4vw, 28px);
  margin: 0 0 14px; color: var(--ink);
  font-weight: 500;
}
.tema-meto h4 { font-size: 18px; margin-top: 32px; }
.tema-meto p, .taller-ficha p {
  font-size: 16px; color: var(--ink-2); line-height: 1.65;
  margin: 0 0 18px;
  max-width: 720px;
}
.tema-horarios table {
  width: 100%; max-width: 540px;
  border-collapse: collapse;
  background: var(--bg);
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--line);
}
.tema-horarios th, .tema-horarios td {
  padding: 10px 16px; text-align: left;
  font-size: 14px;
  border-bottom: 1px solid var(--line);
}
.tema-horarios th {
  background: var(--bg-2); color: var(--green);
  font-family: var(--title-font); font-weight: 500;
}
.tema-horarios tr:last-child td { border-bottom: none; }
.tema-recursos__grid {
  display: flex; flex-wrap: wrap; gap: 10px;
  margin-top: 8px;
}
.tema-recurso {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: 999px; color: var(--green);
  font-size: 14px; text-decoration: none;
}
.tema-recurso:hover {
  background: var(--green); color: var(--bg); border-color: var(--green);
  text-decoration: none;
}

.tema-talleres {
  display: grid; gap: 16px;
  max-width: 820px; margin-inline: auto;
}
.tema-taller {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 18px;
  display: grid; grid-template-columns: 100px 1fr; gap: 18px;
  align-items: center;
}
.tema-taller--btn {
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  width: 100%;
  transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
}
.tema-taller--btn:hover {
  transform: translateY(-2px);
  border-color: var(--accent, var(--green));
  box-shadow: 0 14px 26px rgba(0,0,0,0.10);
}
.tema-taller__go {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 8px;
  font-size: 12px; letter-spacing: 0.06em;
  color: var(--accent, var(--green));
  opacity: 0.85;
}
.tema-taller__insignia {
  width: 100px; aspect-ratio: 4 / 3;
  border-radius: 8px; overflow: hidden;
  border: 1px solid var(--line);
}
.tema-taller__insignia img {
  width: 100%; height: 100%; object-fit: cover;
}
.tema-taller__tema {
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  margin-bottom: 4px;
}
.tema-taller h4 {
  font-family: var(--title-font); font-size: 20px; margin: 0 0 6px;
  color: var(--ink); font-weight: 500;
}
.tema-taller p { margin: 0; font-size: 14px; color: var(--ink-2); }

@media (max-width: 600px) {
  .tema-taller { grid-template-columns: 1fr; }
  .tema-taller__insignia { width: 100%; }
}

/* Square hero chapa variant for temas/talleres */
.detail__hero-chapa--square img {
  border-radius: 12px !important;
  aspect-ratio: 16 / 11;
  width: clamp(220px, 30vw, 360px) !important;
  height: auto !important;
  object-fit: cover;
}

/* ─── Talleres grid ──────────────────────────────────────── */
.taller-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 18px;
  margin-bottom: 80px;
}
.taller-card {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 20px;
  display: flex; flex-direction: column; gap: 14px;
  text-align: left; cursor: pointer; position: relative;
  transition: transform 0.18s, border-color 0.18s, box-shadow 0.18s;
}
.taller-card:hover {
  transform: translateY(-3px);
  border-color: var(--accent);
  box-shadow: 0 14px 26px rgba(0,0,0,0.10);
}
.taller-card__num {
  font-family: var(--title-font); font-size: 36px;
  color: var(--accent); line-height: 1; opacity: 0.85;
}
.taller-card__insignia {
  width: 100%; aspect-ratio: 4 / 3;
  border-radius: 8px; overflow: hidden;
  border: 1px solid var(--line);
  background: var(--bg-2);
}
.taller-card__insignia img {
  width: 100%; height: 100%; object-fit: cover;
}
.taller-card__tema {
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 4px;
}
.taller-card__name {
  font-family: var(--title-font); font-size: 20px;
  color: var(--ink); line-height: 1.15;
}

/* Taller detail */
.taller-materiales ul {
  list-style: none; padding: 0; margin: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.taller-materiales li {
  display: flex; align-items: center; gap: 10px;
  background: var(--bg); border: 1px solid var(--line);
  padding: 12px 16px; border-radius: 12px;
  font-size: 14px; color: var(--ink-2);
}
.taller-aprendizajes ol {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 12px;
  max-width: 720px;
}
.taller-aprendizajes li {
  display: grid; grid-template-columns: 50px 1fr; gap: 16px;
  align-items: center;
  background: var(--bg); border: 1px solid var(--line);
  padding: 14px 18px; border-radius: 12px;
}
.taller-aprend__num {
  font-family: var(--title-font); font-size: 24px;
  color: var(--accent); line-height: 1; opacity: 0.85;
}

/* ─── Principios (flip cards) ────────────────────────────── */
.principios { margin-top: 32px; }
.principios__head {
  display: flex; align-items: center; gap: 18px;
  margin-bottom: 12px;
}
.principios__line {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--line) 30%, var(--line) 70%, transparent);
}
.principios__title {
  font-family: var(--title-font); font-size: clamp(22px, 2.6vw, 30px);
  margin: 0; color: var(--green); font-weight: 500; font-style: italic;
}
.principios__intro {
  text-align: center; color: var(--ink-3);
  font-size: 14px; margin: 0 auto 32px; max-width: 580px;
}
.principios__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 18px;
}
.principio {
  perspective: 1200px;
  height: 280px;
  cursor: pointer;
  outline: none;
}
.principio__inner {
  position: relative; width: 100%; height: 100%;
  transition: transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1);
  transform-style: preserve-3d;
}
.principio.is-flipped .principio__inner { transform: rotateY(180deg); }
.principio__face {
  position: absolute; inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  border-radius: var(--radius);
  padding: 22px;
  display: flex; flex-direction: column; gap: 6px;
}
.principio__face--front {
  background: var(--green); color: var(--bg);
  border: 1px solid var(--green);
}
.principio__face--back {
  transform: rotateY(180deg);
  color: #f3e8c8;
  border: 1px solid color-mix(in oklab, var(--gold) 50%, transparent);
  overflow: hidden;
}
.principio__leaf { opacity: 0.85; margin-bottom: 4px; }
.principio__num {
  font-family: var(--title-font); font-size: 32px; line-height: 1; opacity: 0.65;
}
.principio__t {
  font-family: var(--title-font); font-size: 22px; line-height: 1.15;
  font-weight: 500;
}
.principio__d {
  font-size: 14px; line-height: 1.5; opacity: 0.92;
  margin: 0;
}
.principio__flip-hint {
  margin-top: auto;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  opacity: 0.7;
}
.principio__back-num {
  font-family: var(--title-font); font-size: 22px; line-height: 1; opacity: 0.85;
}
.principio__back-t {
  font-family: var(--title-font); font-size: 22px; font-style: italic;
  font-weight: 500;
}
.principio__back-placeholder {
  flex: 1;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px;
  border: 1px dashed color-mix(in oklab, var(--gold) 60%, transparent);
  border-radius: 12px;
  margin: 8px 0;
  font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase;
  opacity: 0.85;
  background: rgba(255,255,255,0.04);
}

@media (max-width: 600px) {
  .taller-grid { grid-template-columns: 1fr; }
  .principios__grid { grid-template-columns: 1fr 1fr; }
  .principio { height: 240px; }
  .principio__face { padding: 16px; }
  .principio__t, .principio__back-t { font-size: 18px; }
}

/* ─── Epílogo legado section ─────────────────────────────── */
.epilogo__legado {
  margin: 0 0 64px;
  padding: 36px 40px;
  border-radius: var(--radius);
  background:
    linear-gradient(180deg,
      color-mix(in oklab, var(--gold) 8%, var(--bg)) 0%,
      var(--bg) 100%);
  border: 1px solid color-mix(in oklab, var(--gold) 40%, transparent);
  position: relative;
  overflow: hidden;
}
.epilogo__legado::before {
  content: "";
  position: absolute; top: -20px; right: -20px;
  width: 120px; height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in oklab, var(--gold) 25%, transparent) 0%, transparent 60%);
}
.epilogo__legado-tag {
  font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--brown); margin-bottom: 12px;
}
.epilogo__legado-title {
  font-family: var(--title-font); font-style: italic;
  font-size: clamp(28px, 4vw, 40px);
  margin: 0 0 18px; color: var(--green);
  font-weight: 500;
  line-height: 1.1;
  text-wrap: balance;
}
.epilogo__legado-text {
  font-size: 16px; line-height: 1.7;
  color: var(--ink-2);
  margin: 0;
  text-wrap: pretty;
  max-width: 720px;
}
.epilogo__legado-text em {
  font-style: italic; color: var(--ink);
  font-family: var(--title-font); font-size: 1.05em;
}
@media (max-width: 720px) {
  .epilogo__legado { padding: 24px 22px; margin-bottom: 48px; }
  .epilogo__legado-text { font-size: 15px; }
}

/* ─── Footer base ─────────────────────────────────────── */
.footer {
  background: var(--green); color: var(--bg);
  padding: 56px 24px 32px;
}

/* ═══════════════════════════════════════════════════════════
   INFOGRAPHIC — imagen responsive + descargar + lightbox
   ═══════════════════════════════════════════════════════════ */
.infographic {
  position: relative;
  display: block;
  border-radius: var(--radius);
  overflow: hidden;
}
.infographic__img {
  display: block;
  width: 100%;
  height: auto;
  transition: filter 0.2s, transform 0.3s;
}
.infographic__img:hover { filter: brightness(1.02); }
.infographic__overlay {
  position: absolute;
  top: 12px; right: 12px;
  z-index: 2;
  display: flex; gap: 8px; align-items: flex-start;
  pointer-events: none;
}
.infographic__overlay > * { pointer-events: auto; }

/* Reuse footer-orbit styling but slightly different colors for overlays */
.infographic__btn {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: color-mix(in oklab, var(--ink) 18%, transparent) !important;
  color: var(--ink) !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.18);
  backdrop-filter: blur(4px);
}
.infographic__btn .footer-orbit__icon { color: var(--green); }
.infographic__btn .footer-orbit__arrow { color: var(--green); }
.infographic__btn:hover {
  background: var(--green) !important;
  border-color: var(--green) !important;
  color: var(--bg) !important;
}
.infographic__btn:hover .footer-orbit__icon,
.infographic__btn:hover .footer-orbit__arrow {
  color: var(--gold);
}

/* Mapa-specific download — same orbit pattern, pinned to the corner */
.mapa { position: relative; }
.mapa__download {
  position: absolute !important;
  top: 14px; right: 14px;
  z-index: 5;
  background: rgba(255,255,255,0.96) !important;
  color: var(--ink) !important;
  border-color: color-mix(in oklab, var(--ink) 18%, transparent) !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.18);
  backdrop-filter: blur(4px);
}
.mapa__download .footer-orbit__icon { color: var(--green); }
.mapa__download .footer-orbit__arrow { color: var(--green); }
.mapa__download:hover {
  background: var(--green) !important;
  color: var(--bg) !important;
  border-color: var(--green) !important;
}
.mapa__download:hover .footer-orbit__icon,
.mapa__download:hover .footer-orbit__arrow { color: var(--gold); }

/* Hero infographic — preserve the existing painting card aesthetic */
.hero__team-img {
  border-radius: 6px;
  overflow: hidden;
}

/* ─── Lightbox (full-screen ampliar) ───────────────────── */
.lightbox {
  position: fixed; inset: 0;
  z-index: 300;
  background: rgba(15, 13, 8, 0.94);
  display: flex; align-items: center; justify-content: center;
  padding: 64px 24px 56px;
  animation: lbIn 0.25s ease-out;
}
@keyframes lbIn { from { opacity: 0; } to { opacity: 1; } }
.lightbox__close {
  position: fixed; top: 18px; right: 22px; z-index: 5;
  background: var(--bg); border: 1px solid var(--line);
  width: 42px; height: 42px;
  border-radius: 999px;
  display: grid; place-items: center;
  color: var(--ink);
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(0,0,0,0.4);
}
.lightbox__close:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.lightbox__download {
  position: fixed; top: 22px; left: 22px; z-index: 5;
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--bg); color: var(--ink);
  padding: 8px 16px; border-radius: 999px;
  border: 1px solid var(--line);
  font-size: 13px; text-decoration: none;
  box-shadow: 0 6px 16px rgba(0,0,0,0.4);
}
.lightbox__download:hover { background: var(--green); color: var(--bg); border-color: var(--green); text-decoration: none; }
.lightbox__scroll {
  width: 100%; height: 100%;
  overflow: auto;
  display: flex; align-items: flex-start; justify-content: flex-start;
  touch-action: pinch-zoom;
  -webkit-overflow-scrolling: touch;
  cursor: zoom-in;
}
.lightbox__scroll img {
  display: block;
  max-width: none;
  margin: auto;
}

/* Lightbox loader — anillo SVG con % o spinner indeterminado */
.lightbox-loader {
  position: relative;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px;
  color: rgba(245,239,225,0.92);
  user-select: none;
}
.lightbox-loader .lb-ring { display: block; }
.lightbox-loader .lb-ring--spin {
  animation: lbRingSpin 1.1s linear infinite;
}
@keyframes lbRingSpin { to { transform: rotate(360deg); } }
.lightbox-loader__pct {
  position: absolute;
  top: 48px; left: 0; right: 0;
  text-align: center;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 18px;
  letter-spacing: 0.02em;
  transform: translateY(-50%);
  color: #f5efe1;
}
.lightbox-loader__label {
  margin-top: 6px;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(245,239,225,0.72);
}
.lb-dots {
  display: inline-flex; gap: 4px; align-items: center; justify-content: center;
}
.lb-dots i {
  width: 5px; height: 5px; border-radius: 50%;
  background: #d9c779;
  display: inline-block;
  animation: lbDots 1s ease-in-out infinite;
}
.lb-dots i:nth-child(2) { animation-delay: 0.15s; }
.lb-dots i:nth-child(3) { animation-delay: 0.3s; }
@keyframes lbDots {
  0%, 80%, 100% { opacity: 0.25; transform: translateY(0); }
  40% { opacity: 1; transform: translateY(-3px); }
}

/* New zoom stage — full pan + zoom, no scrollbars */
.zoom-stage {
  position: relative;
  width: 100%; height: 100%;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
}
.zoom-stage img {
  position: absolute;
  top: 50%; left: 50%;
  max-width: none; max-height: none;
  width: auto; height: auto;
  pointer-events: none;
  will-change: transform;
  -webkit-user-drag: none;
  -webkit-user-select: none;
}
.lightbox__hint-touch { display: none; }
@media (hover: none) and (pointer: coarse) {
  .lightbox__hint-desktop { display: none; }
  .lightbox__hint-touch { display: inline; }
}
.lightbox__hint {
  position: fixed; bottom: 14px; left: 50%; transform: translateX(-50%);
  color: rgba(255,255,255,0.7);
  font-size: 12px; letter-spacing: 0.02em;
  background: rgba(0,0,0,0.4);
  padding: 6px 14px; border-radius: 999px;
  white-space: nowrap;
  pointer-events: none;
}
@media (max-width: 600px) {
  .lightbox__hint { font-size: 11px; padding: 5px 10px; max-width: calc(100% - 24px); }
  .lightbox__download span { display: none; }
  .lightbox__download { padding: 8px 12px; }
}

/* Map overlay buttons (over the embedded iframe) */
.visita-map__overlay {
  position: absolute;
  left: 14px; bottom: 14px;
  z-index: 2;
  display: flex; gap: 8px; flex-wrap: wrap;
}
.visita-map__btn {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--bg);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 16px;
  font-size: 13px; font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  box-shadow: 0 6px 14px rgba(0,0,0,0.18);
  transition: transform 0.15s, background 0.15s, color 0.15s;
}
.visita-map__btn:hover {
  transform: translateY(-1px);
  background: var(--ink); color: var(--bg);
  border-color: var(--ink);
}
.visita-map__btn--solid {
  background: var(--green); color: var(--bg); border-color: var(--green);
}
.visita-map__btn--solid:hover { background: var(--green-2); border-color: var(--green-2); color: var(--bg); }

@media (max-width: 600px) {
  .visita-map__overlay { left: 10px; right: 10px; bottom: 10px; }
  .visita-map__btn { padding: 8px 12px; font-size: 12.5px; }
}
/* ═══════════════════════════════════════════════════════════
   FOOTER — rediseñado, 3 filas (Hero · Meta · Copy)
   ═══════════════════════════════════════════════════════════ */
.footer__inner {
  max-width: 1180px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 0;
}

/* Headings comunes a las filas */
.footer__heading {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 12px;
  opacity: 0.95;
}

/* ─── Fila 1 · Hero · 3 cards ─── */
.footer__hero {
  display: grid;
  grid-template-columns: 1fr 1.2fr 1fr;
  gap: 22px;
  align-items: stretch;
  padding-bottom: 32px;
}
@media (max-width: 960px) {
  .footer__hero { grid-template-columns: 1fr 1fr; }
  .footer__brand-block { grid-column: 1 / -1; }
}
@media (max-width: 640px) { .footer__hero { grid-template-columns: 1fr; } }

/* Brand block */
.footer__brand-block {
  display: flex; flex-direction: column; justify-content: center;
  padding: 4px 0;
}
.footer__brand-eyebrow {
  font-size: 11px; letter-spacing: 0.32em; text-transform: uppercase;
  opacity: 0.7;
  font-family: var(--title-font);
  margin-bottom: 4px;
}
.footer__brand {
  font-family: var(--title-font);
  font-size: clamp(36px, 4vw, 48px);
  line-height: 1;
  margin: 0 0 6px;
  font-weight: 500;
  letter-spacing: 0.005em;
}
.footer__brand-sub {
  font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase;
  opacity: 0.65;
  margin-bottom: 22px;
}
.footer__address {
  display: inline-flex; align-items: flex-start; gap: 12px;
  color: var(--bg);
  text-decoration: none;
  font-size: 14px;
  line-height: 1.5;
  padding: 8px 0 !important;
  border: none !important;
  max-width: 32ch;
  opacity: 0.92;
  transition: opacity 0.15s, transform 0.15s;
}
.footer__address:hover { opacity: 1; transform: translateY(-1px); text-decoration: none; }
.footer__address-icon {
  flex-shrink: 0;
  display: inline-flex; padding-top: 2px;
  color: var(--gold);
}
.footer__address-line { display: block; }
.footer__address-go {
  display: block;
  margin-top: 6px;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold);
  opacity: 0.9;
}

/* Reservar card · destacado */
.footer__reservar-card {
  background: color-mix(in oklab, var(--bg) 6%, var(--green-2));
  border: 1px solid color-mix(in oklab, var(--gold) 45%, transparent);
  border-radius: var(--radius);
  padding: 24px 26px;
  display: flex; flex-direction: column;
  gap: 12px;
  box-shadow: 0 18px 32px rgba(0,0,0,0.22);
  position: relative;
}
.footer__reservar-card::before {
  content: "";
  position: absolute; top: -1px; right: -1px;
  width: 90px; height: 90px;
  border-radius: 0 var(--radius) 0 90px;
  background: radial-gradient(circle at top right, color-mix(in oklab, var(--gold) 30%, transparent) 0%, transparent 70%);
  pointer-events: none;
}
.footer__reservar-eyebrow {
  font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--gold);
  font-weight: 600;
}
.footer__reservar-title {
  font-family: var(--title-font);
  font-size: 26px;
  line-height: 1.1;
  margin: 0;
  font-weight: 500;
  color: var(--bg);
}
.footer__reservar-text {
  margin: 0; font-size: 13.5px; line-height: 1.5;
  opacity: 0.88;
  max-width: 44ch;
}
.footer__reservar-btn {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
  background: var(--gold) !important;
  color: var(--ink) !important;
  border: 1px solid var(--gold);
  border-radius: 999px;
  padding: 12px 20px !important;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  margin-top: 4px;
  transition: transform 0.15s, background 0.15s;
}
.footer__reservar-btn:hover {
  transform: translateY(-1px);
  background: color-mix(in oklab, var(--gold) 78%, #fff) !important;
  text-decoration: none;
}

/* Mini contact list dentro del card de Reservar */
.footer__contacts {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid color-mix(in oklab, var(--bg) 18%, transparent);
  display: grid; gap: 4px;
}
.footer__contacts a {
  display: grid !important;
  grid-template-columns: 16px 1fr auto;
  gap: 10px; align-items: center;
  padding: 6px 0 !important;
  font-size: 14px;
  color: var(--bg) !important;
  border: none !important;
  text-decoration: none;
  opacity: 0.92;
  transition: opacity 0.15s, transform 0.15s;
}
.footer__contacts a:hover { opacity: 1; transform: translateX(2px); text-decoration: none; }
.footer__contacts a svg { color: var(--gold); }
.footer__contacts a span { font-family: var(--title-font); font-size: 17px; letter-spacing: 0.005em; }
.footer__contacts a em {
  font-style: normal;
  font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase;
  opacity: 0.6;
}

/* Visítanos card (chapa) */
.footer__map {
  background: color-mix(in oklab, var(--bg) 12%, var(--green-2));
  color: var(--bg);
  border: 1px solid color-mix(in oklab, var(--gold) 28%, var(--green));
  border-radius: var(--radius);
  padding: 22px 24px;
  cursor: pointer;
  display: flex; flex-direction: column; align-items: flex-start;
  gap: 16px;
  text-align: left;
  font: inherit;
  transition: transform 0.18s, background 0.18s, box-shadow 0.18s;
  box-shadow: 0 16px 30px rgba(0,0,0,0.22);
}
.footer__map:hover {
  transform: translateY(-3px);
  background: color-mix(in oklab, var(--bg) 18%, var(--green-2));
  box-shadow: 0 20px 36px rgba(0,0,0,0.28);
}
.footer__map-chapa {
  width: 96px; height: 96px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--bg);
  border: 3px solid color-mix(in oklab, var(--gold) 55%, transparent);
  flex-shrink: 0;
  box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}
.footer__map-chapa img { width: 100%; height: 100%; object-fit: cover; display: block; }
.footer__map-eyebrow {
  font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--gold);
}
.footer__map-name {
  font-family: var(--title-font);
  font-size: 30px;
  line-height: 1;
  margin: 4px 0 6px;
  font-weight: 500;
}
.footer__map-go {
  font-size: 12px;
  opacity: 0.85;
  letter-spacing: 0.02em;
}

/* Address chip dentro de la tarjeta Visítanos (parte inferior) */
.footer__map-address {
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px dashed color-mix(in oklab, var(--gold) 35%, transparent);
  display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: start;
  color: var(--bg);
  font-size: 13px; line-height: 1.45;
  cursor: pointer;
  transition: transform 0.18s, opacity 0.18s;
  width: 100%;
}
.footer__map-address:hover { transform: translateX(2px); opacity: 0.95; }
.footer__map-address-icon {
  display: inline-flex; padding-top: 2px;
  color: var(--gold);
}
.footer__map-address-lines { display: flex; flex-direction: column; gap: 1px; }
.footer__map-address-line { display: block; }
.footer__map-address-go {
  display: block;
  margin-top: 6px;
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--gold);
}

/* Make the Visítanos card stretch so the address pins to the bottom */
.footer__map { justify-content: flex-start; }
.footer__map-tag { width: 100%; }

/* ─── Legal · orbit buttons ─────────────────────────────── */
.footer__legal-orbits {
  display: flex; flex-wrap: wrap; gap: 8px;
  align-items: center;
}
.footer-orbit {
  display: inline-grid;
  grid-template-columns: 36px 0fr;
  align-items: center;
  height: 36px;
  background: color-mix(in oklab, var(--bg) 8%, transparent);
  border: 1px solid color-mix(in oklab, var(--bg) 22%, transparent);
  color: var(--bg) !important;
  border-radius: 999px;
  overflow: hidden;
  cursor: pointer;
  font: inherit;
  font-family: inherit;
  text-decoration: none !important;
  padding: 0 !important;
  transition:
    grid-template-columns 0.4s cubic-bezier(0.2, 0.8, 0.2, 1),
    background 0.25s, border-color 0.25s,
    transform 0.2s;
}
.footer-orbit__icon {
  width: 36px; height: 36px;
  display: grid; place-items: center;
  flex-shrink: 0;
  color: var(--gold);
  transition: transform 0.5s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.footer-orbit__expand {
  min-width: 0; overflow: hidden;
  display: inline-flex; align-items: center; gap: 6px;
  white-space: nowrap;
  padding-right: 0;
  transition: padding-right 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.footer-orbit__label {
  font-size: 12.5px; letter-spacing: 0.01em; font-weight: 500;
  opacity: 0; transform: translateX(-3px);
  transition: opacity 0.28s 0.05s, transform 0.32s;
}
.footer-orbit__arrow {
  display: inline-flex;
  opacity: 0; transform: translateX(-5px);
  transition: opacity 0.28s 0.1s, transform 0.32s 0.05s;
  color: var(--gold);
}
.footer-orbit:hover, .footer-orbit:focus-visible {
  grid-template-columns: 36px 1fr;
  background: color-mix(in oklab, var(--gold) 22%, transparent);
  border-color: color-mix(in oklab, var(--gold) 65%, transparent);
  transform: translateY(-1px);
  text-decoration: none !important;
  outline: none;
}
.footer-orbit:hover .footer-orbit__icon,
.footer-orbit:focus-visible .footer-orbit__icon {
  transform: rotate(360deg);
}
.footer-orbit:hover .footer-orbit__expand,
.footer-orbit:focus-visible .footer-orbit__expand {
  padding-right: 14px;
}
.footer-orbit:hover .footer-orbit__label,
.footer-orbit:focus-visible .footer-orbit__label,
.footer-orbit:hover .footer-orbit__arrow,
.footer-orbit:focus-visible .footer-orbit__arrow {
  opacity: 1; transform: translateX(0);
}
.footer__legal-orbits:hover .footer-orbit:not(:hover):not(:focus-visible) { opacity: 0.7; }

/* Icon-only orbit modifier — never expands. Used for «Ampliar» buttons. */
.footer-orbit--icon-only,
.footer-orbit--icon-only:hover,
.footer-orbit--icon-only:focus-visible {
  grid-template-columns: 36px 0fr;
}
.footer-orbit--icon-only .footer-orbit__expand,
.footer-orbit--icon-only .footer-orbit__label,
.footer-orbit--icon-only .footer-orbit__arrow {
  display: none;
}

@media (max-width: 720px) {
  .footer-orbit { grid-template-columns: 36px 1fr; }
  .footer-orbit__expand { padding-right: 14px; }
  .footer-orbit__label { opacity: 1; transform: translateX(0); }
  .footer-orbit__arrow { opacity: 1; transform: translateX(0); }
  .footer__legal-orbits:hover .footer-orbit:not(:hover) { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .footer-orbit, .footer-orbit__icon, .footer-orbit__expand,
  .footer-orbit__label, .footer-orbit__arrow { transition: none !important; }
  .footer-orbit:hover .footer-orbit__icon { transform: none; }
}

/* ─── Fila 2 · Meta · enlaces + legal ─── */
.footer__meta {
  display: grid; grid-template-columns: 1fr 1.4fr; gap: 32px;
  padding: 28px 0;
  border-top: 1px solid color-mix(in oklab, var(--bg) 18%, transparent);
}
@media (max-width: 760px) { .footer__meta { grid-template-columns: 1fr; gap: 18px; } }
.footer__meta-col { min-width: 0; }
.footer__link-row {
  display: flex; flex-wrap: wrap; gap: 6px 8px;
}
.footer__link-row a {
  display: inline-flex !important; align-items: center; gap: 8px;
  background: color-mix(in oklab, var(--bg) 8%, transparent);
  color: var(--bg) !important;
  border: 1px solid color-mix(in oklab, var(--bg) 20%, transparent) !important;
  padding: 7px 14px !important;
  border-radius: 999px;
  font-size: 13px;
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s, transform 0.15s;
}
.footer__link-row a:hover {
  background: color-mix(in oklab, var(--bg) 18%, transparent);
  border-color: color-mix(in oklab, var(--gold) 60%, transparent) !important;
  transform: translateY(-1px);
  text-decoration: none;
}
.footer__link-row a svg { color: var(--gold); }

/* ─── Fila 3 · Copyright ─── */
.footer__copy {
  display: flex; flex-wrap: wrap; gap: 6px 16px;
  justify-content: space-between; align-items: center;
  padding-top: 22px;
  border-top: 1px solid color-mix(in oklab, var(--bg) 18%, transparent);
  font-size: 12.5px;
  opacity: 0.7;
}
.footer__copy-sep { opacity: 0.5; }
@media (max-width: 640px) {
  .footer__copy { justify-content: flex-start; flex-direction: column; align-items: flex-start; gap: 4px; }
  .footer__copy-sep { display: none; }
}

/* ─── Footer base ─────────────────────────────────────── */

/* ─── VISITA DETAIL ─────────────────────────────────────── */
.visita-llegar { display: grid; gap: 28px; max-width: 980px; margin: 0 auto; }
.visita-map {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--bg-2);
}
.visita-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.visita-map__facade {
  position: absolute; inset: 0;
  display: grid; grid-template-rows: 1fr auto;
  background: var(--bg-2);
}
.visita-map__art { position: relative; }
.visita-map__art svg { width: 100%; height: 100%; display: block; }
.visita-map__body {
  background: linear-gradient(0deg, var(--bg) 0%, color-mix(in oklab, var(--bg) 92%, transparent) 100%);
  padding: 18px 22px 20px;
  display: flex; flex-direction: column; gap: 8px;
}
.visita-map__lock {
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--green); display: inline-flex; align-items: center; gap: 6px;
}
.visita-map__body p { margin: 0; font-size: 14px; color: var(--ink-2); line-height: 1.55; }
.visita-map__actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 4px; }

.visita-direccion { display: grid; grid-template-columns: 1.2fr 1fr; gap: 22px; }
@media (max-width: 720px) { .visita-direccion { grid-template-columns: 1fr; } }
.visita-direccion__card {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 22px 24px;
}
.visita-direccion__tag {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--green); margin-bottom: 6px;
}
.visita-direccion__card h3 {
  font-family: var(--title-font); font-size: 28px; margin: 0 0 4px;
  font-weight: 500; color: var(--ink);
}
.visita-direccion__card p { margin: 0 0 16px; color: var(--ink-2); font-size: 15px; }
.visita-direccion__cta { display: flex; gap: 10px; flex-wrap: wrap; }

.visita-cuadro {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 0;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); overflow: hidden;
}
.visita-cuadro li {
  display: grid; grid-template-columns: 130px 1fr;
  padding: 12px 18px;
  border-bottom: 1px solid var(--line);
  font-size: 14px; color: var(--ink-2);
  align-items: baseline;
}
.visita-cuadro li:last-child { border-bottom: none; }
.visita-cuadro li > span:first-child {
  font-family: var(--title-font); font-size: 15px; color: var(--green);
}

.visita-horarios { max-width: 820px; margin: 0 auto; }
.visita-horarios h3 {
  font-family: var(--title-font); font-size: 28px; margin: 0 0 10px;
  color: var(--ink); font-weight: 500;
}
.visita-horarios > p { margin: 0 0 20px; color: var(--ink-2); font-size: 15px; line-height: 1.6; }
.visita-horarios__table {
  width: 100%; background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); border-collapse: separate; border-spacing: 0;
  overflow: hidden; font-size: 14px;
}
.visita-horarios__table th, .visita-horarios__table td {
  text-align: left; padding: 12px 16px; border-bottom: 1px solid var(--line);
}
.visita-horarios__table th {
  background: var(--bg-2); color: var(--green);
  font-family: var(--title-font); font-weight: 500; font-size: 15px;
}
.visita-horarios__table tr:last-child td { border-bottom: none; }
.visita-horarios__nota { margin: 16px 0 0; font-size: 13px; color: var(--ink-3); font-style: italic; }

.visita-contacto { max-width: 820px; margin: 0 auto; }
.visita-contacto__grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 14px;
}
@media (max-width: 600px) { .visita-contacto__grid { grid-template-columns: 1fr; } }
.visita-tel {
  display: grid; grid-template-columns: 44px 1fr; gap: 14px; align-items: center;
  background: var(--bg); border: 1px solid var(--line);
  padding: 16px 20px; border-radius: var(--radius);
  color: var(--ink); text-decoration: none;
  transition: transform 0.15s, border-color 0.15s, box-shadow 0.15s;
}
.visita-tel:hover {
  transform: translateY(-2px); border-color: var(--green);
  box-shadow: 0 10px 20px rgba(0,0,0,0.08); text-decoration: none;
}
.visita-tel__k {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--green); margin-bottom: 2px;
}
.visita-tel__v { font-family: var(--title-font); font-size: 22px; color: var(--ink); }
.visita-contacto__legal {
  margin-top: 22px; padding: 18px 22px;
  background: var(--bg-2); border-radius: var(--radius);
}
.visita-contacto__legal-k {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--brown); margin-bottom: 6px;
}
.visita-contacto__legal p { margin: 0; font-size: 13px; color: var(--ink-2); line-height: 1.55; }

/* ═════════ Legacy footer block below — superseded by the rules above ═════════ */
.__footer_legacy_block_marker {}

/* ─── Chip ───────────────────────────────────────────────── */
.chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 12px; border-radius: 999px;
  border: 1px solid var(--ink-3);
  font-size: 12px; color: var(--ink-2);
  background: color-mix(in oklab, var(--bg) 80%, transparent);
}

/* ─── ANIMAL DETAIL (full-screen overlay) ────────────────── */
.detail {
  position: fixed; inset: 0; z-index: 100;
  background: var(--bg);
  overflow-y: auto;
  animation: detailIn 0.3s ease-out;
}
@keyframes detailIn {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}
.detail__close {
  position: fixed; top: 18px; right: 22px; z-index: 5;
  background: var(--bg); border: 1px solid var(--line);
  padding: 8px 14px; border-radius: 999px;
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 13px; color: var(--ink);
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.detail__close:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }

/* Share button — paired to the left of the close button on every detail modal */
.detail__share {
  position: fixed; top: 18px; right: 116px; z-index: 5;
  width: 38px; height: 38px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--ink-2);
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: background 0.18s, color 0.18s, border-color 0.18s, transform 0.18s;
}
.detail__share:hover {
  background: var(--green); color: var(--bg); border-color: var(--green);
  transform: translateY(-1px);
}
.detail__share-icon {
  display: inline-flex;
  transition: transform 0.5s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.detail__share:hover .detail__share-icon { transform: rotate(360deg); }

@media (max-width: 600px) {
  .detail__share { right: 84px; width: 34px; height: 34px; top: 16px; }
  .detail__close { top: 16px; right: 16px; padding: 6px 12px; font-size: 12px; }
  .detail__close span { display: none; }
}

.detail__hero {
  background: linear-gradient(180deg,
    color-mix(in oklab, var(--accent) 18%, var(--bg-2)) 0%,
    var(--bg) 100%);
  padding: 64px 24px 32px;
  position: relative;
  overflow: hidden;
}
.detail__hero-inner {
  max-width: 1100px; margin: 0 auto;
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px;
  align-items: center;
}
@media (max-width: 800px) { .detail__hero-inner { grid-template-columns: 1fr; } }

.detail__eyebrow {
  font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--accent); margin-bottom: 12px;
}
.detail__title {
  font-family: var(--title-font);
  font-size: clamp(48px, 7vw, 88px);
  line-height: 1; margin: 0 0 12px;
  color: var(--ink);
}
.detail__tag {
  font-family: var(--title-font); font-style: italic;
  font-size: clamp(20px, 2.2vw, 28px);
  color: var(--accent); margin: 0 0 18px;
}
.detail__intro {
  color: var(--ink-2); margin: 0 0 18px;
  max-width: 540px; font-size: 16px;
}
.detail__meta { display: flex; gap: 8px; flex-wrap: wrap; }
.detail__hero-chapa {
  display: grid; place-items: center; position: relative;
}
.detail__hero-chapa img {
  width: clamp(220px, 28vw, 320px); height: clamp(220px, 28vw, 320px);
  border-radius: 50%;
  filter: drop-shadow(4px 10px 24px rgba(0,0,0,0.22));
  animation: bob 8s ease-in-out infinite;
}

.detail__cartel {
  max-width: 1100px; margin: 32px auto 0;
  border: 1px solid var(--line); border-radius: 16px; overflow: hidden;
  background: var(--bg); position: relative;
}
.detail__cartel img,
.detail__cartel-img { width: 100%; display: block; }
.detail__cartel-actions {
  position: absolute;
  top: 12px; right: 12px;
  z-index: 2;
  display: flex; gap: 8px;
}
.detail__cartel-actions .infographic__btn {
  background: rgba(255,255,255,0.96) !important;
  border-color: color-mix(in oklab, var(--ink) 18%, transparent) !important;
  color: var(--ink) !important;
  box-shadow: 0 6px 14px rgba(0,0,0,0.2);
  backdrop-filter: blur(4px);
}
.detail__cartel-actions .infographic__btn:hover {
  background: var(--green) !important;
  color: var(--bg) !important;
  border-color: var(--green) !important;
}
.detail__cartel-actions .infographic__btn:hover .footer-orbit__icon,
.detail__cartel-actions .infographic__btn:hover .footer-orbit__arrow {
  color: var(--gold) !important;
}

/* ─── Cartel hint (leaf badge, auto-expands once on mount) ── */
.cartel-hint {
  position: absolute; left: 12px; bottom: 12px;
  z-index: 2;
  display: inline-grid;
  grid-template-columns: 28px 0fr;
  align-items: center;
  height: 28px;
  background: rgba(20, 26, 18, 0.86);
  color: var(--bg);
  border: 1px solid color-mix(in oklab, var(--gold) 65%, transparent);
  border-radius: 999px;
  overflow: hidden;
  font-size: 11px;
  letter-spacing: 0.06em;
  cursor: default;
  backdrop-filter: blur(6px);
  box-shadow: 0 6px 14px rgba(0,0,0,0.22);
  transition: grid-template-columns 0.42s cubic-bezier(0.2, 0.8, 0.2, 1);
  /* One-shot attention animation: grow then shrink. */
  animation: cartelHintAttention 5.8s cubic-bezier(0.4, 0.2, 0.2, 1) 0.8s both;
}
.cartel-hint__icon {
  width: 28px; height: 28px;
  display: grid; place-items: center;
  color: var(--gold);
  flex-shrink: 0;
  transition: transform 0.5s cubic-bezier(0.4, 0.2, 0.2, 1);
}
.cartel-hint__expand {
  min-width: 0; overflow: hidden;
  white-space: nowrap;
  padding-right: 0;
  transition: padding-right 0.4s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.cartel-hint__label {
  opacity: 0;
  transform: translateX(-4px);
  font-family: var(--title-font);
  font-style: italic;
  font-size: 12px;
  letter-spacing: 0.02em;
  color: #f3ead4;
  transition: opacity 0.32s 0.05s, transform 0.36s;
}
.cartel-hint:hover,
.cartel-hint:focus-within {
  grid-template-columns: 28px 1fr;
  animation: none;
}
.cartel-hint:hover .cartel-hint__icon { transform: rotate(360deg); }
.cartel-hint:hover .cartel-hint__expand { padding-right: 14px; }
.cartel-hint:hover .cartel-hint__label { opacity: 1; transform: translateX(0); }

/* The single auto-expand cycle: icon-only → expand → linger → contract */
@keyframes cartelHintAttention {
  0%   { grid-template-columns: 28px 0fr; }
  5%   { grid-template-columns: 28px 1fr; }
  60%  { grid-template-columns: 28px 1fr; }
  75%  { grid-template-columns: 28px 0fr; }
  100% { grid-template-columns: 28px 0fr; }
}
/* Animate the label inside the same keyframe lifecycle */
.cartel-hint__expand {
  animation: cartelHintExpand 5.8s cubic-bezier(0.4, 0.2, 0.2, 1) 0.8s both;
}
.cartel-hint__label {
  animation: cartelHintLabel 5.8s cubic-bezier(0.4, 0.2, 0.2, 1) 0.8s both;
}
@keyframes cartelHintExpand {
  0%   { padding-right: 0; }
  5%   { padding-right: 14px; }
  60%  { padding-right: 14px; }
  75%  { padding-right: 0; }
  100% { padding-right: 0; }
}
@keyframes cartelHintLabel {
  0%   { opacity: 0; transform: translateX(-4px); }
  8%   { opacity: 1; transform: translateX(0); }
  62%  { opacity: 1; transform: translateX(0); }
  72%  { opacity: 0; transform: translateX(-4px); }
  100% { opacity: 0; transform: translateX(-4px); }
}
.cartel-hint:hover .cartel-hint__expand,
.cartel-hint:hover .cartel-hint__label { animation: none; }

@media (prefers-reduced-motion: reduce) {
  .cartel-hint, .cartel-hint__expand, .cartel-hint__label,
  .cartel-hint__icon { animation: none !important; transition: none !important; }
}

/* Placeholder cartel — when no infografía has been uploaded yet */
.detail__cartel--placeholder {
  background:
    repeating-linear-gradient(135deg,
      color-mix(in oklab, var(--bg-2) 75%, transparent) 0 12px,
      var(--bg-2) 12px 24px);
}
.cartel-placeholder {
  display: grid; grid-template-columns: 88px 1fr; gap: 22px;
  align-items: center;
  padding: 36px 36px;
  color: var(--ink-2);
}
@media (max-width: 600px) {
  .cartel-placeholder { grid-template-columns: 64px 1fr; gap: 16px; padding: 24px; }
}
.cartel-placeholder__art {
  width: 88px; height: 88px;
  border-radius: 50%;
  background: var(--bg);
  border: 2px dashed color-mix(in oklab, var(--gold) 55%, transparent);
  color: color-mix(in oklab, var(--gold) 70%, var(--ink-3));
  display: grid; place-items: center;
}
.cartel-placeholder__tag {
  font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--brown);
  margin-bottom: 4px;
}
.cartel-placeholder__t {
  font-family: var(--title-font);
  font-size: clamp(20px, 2.4vw, 26px);
  color: var(--ink);
  font-weight: 500;
  margin-bottom: 6px;
}
.cartel-placeholder__d {
  font-size: 13.5px; line-height: 1.5;
  color: var(--ink-2);
  max-width: 56ch;
}

/* ─── Download / copyright modal ────────────────────────── */
.dl-modal {
  position: fixed; inset: 0; z-index: 320;
  display: grid; place-items: center;
  padding: 20px;
}
.dl-modal__backdrop {
  position: absolute; inset: 0;
  background: color-mix(in oklab, var(--ink) 70%, transparent);
  backdrop-filter: blur(2px);
}
.dl-modal__panel {
  position: relative;
  background: var(--bg);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  max-width: 560px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 24px 60px rgba(0,0,0,0.36);
  padding: 28px 32px 24px;
}
.dl-modal__close {
  position: absolute; top: 14px; right: 16px;
  width: 36px; height: 36px;
  background: transparent; border: 1px solid var(--line);
  border-radius: 999px;
  display: grid; place-items: center;
  color: var(--ink-2);
  cursor: pointer;
}
.dl-modal__close:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.dl-modal__head { margin-bottom: 12px; }
.dl-modal__eyebrow {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--brown);
  margin-bottom: 6px;
}
.dl-modal__head h2 {
  font-family: var(--title-font);
  font-size: clamp(22px, 2.6vw, 28px);
  margin: 0;
  font-weight: 500;
}
.dl-modal__lead {
  margin: 0 0 16px;
  font-size: 14.5px; line-height: 1.55;
  color: var(--ink-2);
}
.dl-modal__rights {
  list-style: none; padding: 0; margin: 0 0 18px;
  display: grid; gap: 10px;
}
.dl-modal__rights li {
  display: grid; grid-template-columns: 20px 1fr; gap: 10px;
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink-2);
  align-items: start;
  padding-top: 1px;
}
.dl-modal__rights li svg { color: var(--green); margin-top: 2px; }
.dl-modal__rights li a { color: var(--green); }
.dl-modal__file {
  display: flex; align-items: center; gap: 10px;
  background: var(--bg-2);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13px;
  color: var(--ink-2);
  margin-bottom: 18px;
  border: 1px solid var(--line);
}
.dl-modal__file svg { color: var(--brown); flex-shrink: 0; }
.dl-modal__file-label {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  word-break: break-all;
}
.dl-modal__actions {
  display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap;
}
.dl-modal__legal-row {
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid var(--line);
  display: flex; align-items: center; gap: 12px;
  font-size: 11px; color: var(--ink-3);
  flex-wrap: wrap;
}
.dl-modal__legal-row a {
  display: inline-flex; padding: 4px;
  color: var(--brown);
  border-radius: 50%;
  transition: background 0.15s, color 0.15s;
  text-decoration: none;
}
.dl-modal__legal-row a:hover { background: var(--green); color: var(--bg); }
.dl-modal__legal-tag {
  margin-left: auto;
  letter-spacing: 0.02em;
}

@media (max-width: 600px) {
  .dl-modal__panel { padding: 22px 22px 20px; }
  .dl-modal__actions { justify-content: stretch; }
  .dl-modal__actions .consent-btn { flex: 1; }
}

.detail__tabs {
  position: sticky; top: 0; z-index: 4;
  background: color-mix(in oklab, var(--bg) 92%, transparent);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--line);
  padding: 12px 24px;
  display: flex; gap: 6px; flex-wrap: wrap; justify-content: center;
}
.detail__tab {
  background: transparent; border: 1px solid transparent;
  padding: 8px 16px; border-radius: 999px;
  font-size: 14px; color: var(--ink-2);
}
.detail__tab:hover { background: color-mix(in oklab, var(--ink) 6%, transparent); }
.detail__tab.is-active {
  background: var(--accent); color: var(--bg); border-color: var(--accent);
}
/* ── Niveles de acceso (7-jul): tinte sutil por tier ─────────────────
   Equipo 🔒 = granate suave · Interno 🔑 = plateado/gris metálico suave.
   Se distinguen de un vistazo del resto de pestañas públicas. */
.detail__tab--equipo {
  background: linear-gradient(180deg, color-mix(in oklab, #8a2f3d 11%, var(--bg)), color-mix(in oklab, #8a2f3d 17%, var(--bg)));
  color: color-mix(in oklab, #6e2431 78%, var(--ink));
  border-color: color-mix(in oklab, #8a2f3d 22%, transparent);
}
.detail__tab--equipo:hover {
  background: linear-gradient(180deg, color-mix(in oklab, #8a2f3d 19%, var(--bg)), color-mix(in oklab, #8a2f3d 25%, var(--bg)));
}
.detail__tab--equipo.is-active {
  background: #8a2f3d; color: #fff; border-color: #8a2f3d;
}
.detail__tab--interno {
  background: linear-gradient(180deg, color-mix(in oklab, #6b7683 9%, var(--bg)), color-mix(in oklab, #6b7683 17%, var(--bg)));
  color: color-mix(in oklab, #3f4854 80%, var(--ink));
  border-color: color-mix(in oklab, #6b7683 24%, transparent);
}
.detail__tab--interno:hover {
  background: linear-gradient(180deg, color-mix(in oklab, #6b7683 17%, var(--bg)), color-mix(in oklab, #6b7683 25%, var(--bg)));
}
.detail__tab--interno.is-active {
  background: linear-gradient(180deg, #7c8794, #5c6672); color: #fff; border-color: #5c6672;
}

.detail__body { max-width: 1100px; margin: 0 auto; padding: 48px 24px 64px; }

/* Ficha grid of 14 cards */
.ficha__hint {
  text-align: center; color: var(--ink-3); margin: 0 0 24px;
  font-size: 14px;
}
.ficha__grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px;
}
.ficha__card {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 18px;
  text-align: left;
  display: flex; flex-direction: column; gap: 6px;
  position: relative;
  transition: transform 0.15s, box-shadow 0.15s, border-color 0.15s;
}
.ficha__card:hover {
  transform: translateY(-2px);
  border-color: var(--accent);
  box-shadow: 0 8px 16px rgba(0,0,0,0.08);
}
.ficha__card.is-open {
  border-color: var(--accent);
  background: color-mix(in oklab, var(--accent) 8%, var(--bg));
}
.ficha__num {
  font-family: var(--title-font); font-size: 28px; color: var(--accent);
  line-height: 1; opacity: 0.8;
}
.ficha__icon { margin: 4px 0; }
.ficha__t {
  font-family: var(--title-font); font-size: 19px; color: var(--ink);
  line-height: 1.1;
}
.ficha__d { font-size: 13px; color: var(--ink-2); }

/* Curiosidades */
.curio__list {
  list-style: none; padding: 0; margin: 0;
  display: grid; gap: 16px; max-width: 720px; margin-inline: auto;
}
.curio__item {
  display: grid; grid-template-columns: 60px 1fr; gap: 18px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 18px 22px;
}
.curio__num {
  font-family: var(--title-font); font-size: 36px; color: var(--green);
  line-height: 1; opacity: 0.6;
}
.curio__item p { margin: 0; align-self: center; font-size: 16px; color: var(--ink-2); }

/* Stars / protagonistas */
.stars__nav {
  display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-bottom: 32px;
}
.stars__btn {
  background: var(--bg); border: 1px solid var(--line);
  padding: 8px 16px; border-radius: 999px;
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--ink-2); font-size: 14px;
}
.stars__btn.is-active {
  background: var(--accent); color: var(--bg); border-color: var(--accent);
}
.star {
  display: grid; grid-template-columns: 1fr 1.3fr; gap: 32px;
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 32px;
}
@media (max-width: 800px) { .star { grid-template-columns: 1fr; } }
.star__left img { width: 100%; border-radius: 12px; border: 1px solid var(--line); }
.star__placeholder {
  aspect-ratio: 3/4; background: var(--bg-2); border: 1px dashed var(--line);
  display: grid; place-items: center; color: var(--ink-3); font-size: 13px;
}
.star__greet {
  font-family: var(--hand-font); font-size: 26px; color: var(--brown);
}
.star__name {
  font-family: var(--title-font); font-size: clamp(36px, 5vw, 56px);
  margin: 0 0 6px; color: var(--ink); line-height: 1;
}
.star__title { font-size: 14px; color: var(--ink-3); margin-bottom: 16px; }
.star__story { font-size: 16px; color: var(--ink-2); margin: 0 0 24px; }
.anecdotas { display: grid; gap: 14px; }
.anecdota {
  border-left: 3px solid var(--accent);
  padding: 8px 0 8px 16px;
}
.anecdota__t {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--title-font); font-size: 18px; color: var(--accent);
  margin-bottom: 4px;
}
.anecdota p { margin: 0; font-size: 14px; color: var(--ink-2); }

/* Cuidados */
.cuidados { display: grid; gap: 24px; max-width: 820px; margin-inline: auto; }
.cuidados__protocolo {
  background: var(--green); color: var(--bg);
  padding: 28px 32px; border-radius: var(--radius);
}
.cuidados__protocolo h3 {
  font-family: var(--title-font); font-size: 26px; margin: 0 0 10px; font-weight: 500;
}
.cuidados__protocolo p { margin: 0; opacity: 0.92; }
.cuidados__destacados {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px;
}
.cuidados__chip {
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--radius); padding: 14px 18px;
  display: flex; flex-direction: column; gap: 4px;
}
.cuidados__chip-num {
  font-family: var(--title-font); font-size: 20px; color: var(--accent);
}
.cuidados__cta {
  display: flex; align-items: center; gap: 12px;
  background: var(--bg-2); border-radius: var(--radius);
  padding: 18px 22px; font-size: 14px; color: var(--ink-2);
}

/* Reservar CTA — shared by tema, taller, animal detail tabs */
.cuidados__reservar {
  display: grid; grid-template-columns: 1fr auto; gap: 20px;
  align-items: center;
  background:
    linear-gradient(180deg,
      color-mix(in oklab, var(--accent, var(--green)) 14%, var(--bg)) 0%,
      var(--bg) 100%);
  border: 1px solid color-mix(in oklab, var(--accent, var(--green)) 40%, var(--line));
  border-radius: var(--radius);
  padding: 24px 28px;
}
@media (max-width: 600px) { .cuidados__reservar { grid-template-columns: 1fr; } }
.cuidados__reservar-eyebrow {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--accent, var(--green)); margin-bottom: 4px;
}
.cuidados__reservar h4 {
  font-family: var(--title-font);
  font-size: clamp(22px, 2.4vw, 28px);
  margin: 0 0 8px;
  color: var(--ink);
  font-weight: 500;
}
.cuidados__reservar p { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; max-width: 52ch; }
.cuidados__reservar .btn { white-space: nowrap; }

/* Visita Detail · Reservar block at the bottom of Contacto */
.visita-contacto__reservar {
  margin-top: 24px;
  display: grid; grid-template-columns: 1fr auto; gap: 20px;
  align-items: center;
  background:
    linear-gradient(180deg, color-mix(in oklab, var(--green) 14%, var(--bg)) 0%, var(--bg) 100%);
  border: 1px solid color-mix(in oklab, var(--green) 40%, var(--line));
  border-radius: var(--radius);
  padding: 26px 30px;
}
@media (max-width: 600px) { .visita-contacto__reservar { grid-template-columns: 1fr; } }
.visita-contacto__reservar-tag {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--green); margin-bottom: 6px;
}
.visita-contacto__reservar h3 {
  font-family: var(--title-font);
  font-size: clamp(24px, 2.6vw, 30px);
  margin: 0 0 8px; color: var(--ink); font-weight: 500;
}
.visita-contacto__reservar p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.55; max-width: 48ch; }
.btn--lg {
  padding: 14px 26px; font-size: 16px; white-space: nowrap;
}

.detail__foot {
  border-top: 1px solid var(--line);
  padding: 24px;
  text-align: center;
}
.detail__close-bottom {
  background: transparent; border: 1px solid var(--ink-3);
  color: var(--ink-2); padding: 10px 22px;
  border-radius: 999px; font-size: 14px;
}
/* ─── Consent banner (RGPD / AEPD May 2024) ──────────────── */
.consent-banner {
  position: fixed;
  left: 16px; right: 16px; bottom: 16px;
  z-index: 200;
  background: var(--bg);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: 0 20px 50px rgba(0,0,0,0.22), 0 4px 10px rgba(0,0,0,0.08);
  animation: consentSlide 0.35s ease-out;
}
@keyframes consentSlide {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
.consent-banner__inner {
  max-width: 1180px;
  margin: 0 auto;
  padding: 24px 28px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 28px;
  align-items: center;
}
.consent-banner__body { min-width: 0; }
.consent-banner__eyebrow {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--green); margin-bottom: 6px;
}
.consent-banner__title {
  font-family: var(--title-font);
  font-size: clamp(22px, 2.6vw, 28px);
  margin: 0 0 8px; font-weight: 500;
  color: var(--ink);
}
.consent-banner__text {
  margin: 0; color: var(--ink-2);
  font-size: 14.5px; line-height: 1.55;
  max-width: 720px;
}
.consent-banner__text strong { color: var(--ink); font-weight: 600; }
.consent-banner__links {
  display: flex; flex-wrap: wrap; gap: 14px;
  margin-top: 10px;
}
.consent-banner__links a {
  font-size: 13px; color: var(--green);
}
.consent-banner__actions {
  display: flex; gap: 8px; align-items: stretch;
}

/* AEPD May 2024: Aceptar y Rechazar con idéntico formato, tamaño, color y posición. */
.consent-btn {
  border: 1px solid var(--green);
  background: var(--green);
  color: var(--bg);
  border-radius: 999px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  padding: 12px 22px;
  min-width: 144px;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  transition: transform 0.15s, background 0.15s, border-color 0.15s, color 0.15s;
}
.consent-btn:hover { transform: translateY(-1px); background: var(--green-2); border-color: var(--green-2); }
.consent-btn--equal { /* same look — Accept/Reject sin patrón oscuro */ }
.consent-btn--prefs {
  background: transparent;
  color: var(--green);
  border-color: var(--green);
}
.consent-btn--prefs:hover {
  background: color-mix(in oklab, var(--green) 10%, transparent);
  color: var(--green);
}

@media (max-width: 880px) {
  .consent-banner__inner { grid-template-columns: 1fr; gap: 16px; padding: 20px 22px; }
  .consent-banner__actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .consent-btn { min-width: 0; padding: 12px 16px; font-size: 13px; }
  .consent-btn--prefs { grid-column: 1 / -1; }
}

/* ─── Preferences modal ─────────────────────────────────── */
.consent-modal {
  position: fixed; inset: 0;
  z-index: 210;
  display: grid; place-items: center;
  padding: 20px;
}
.consent-modal__backdrop {
  position: absolute; inset: 0;
  background: color-mix(in oklab, var(--ink) 60%, transparent);
  backdrop-filter: blur(2px);
}
.consent-modal__panel {
  position: relative;
  background: var(--bg);
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  max-width: 680px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 24px 60px rgba(0,0,0,0.32);
  padding: 32px 36px 28px;
}
.consent-modal__close {
  position: absolute; top: 14px; right: 16px;
  width: 36px; height: 36px;
  background: transparent; border: 1px solid var(--line);
  border-radius: 999px;
  display: grid; place-items: center;
  color: var(--ink-2);
  cursor: pointer;
}
.consent-modal__close:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.consent-modal__eyebrow {
  font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--green); margin-bottom: 6px;
}
.consent-modal__head h2 {
  font-family: var(--title-font);
  font-size: clamp(24px, 3vw, 32px);
  margin: 0 0 10px;
  font-weight: 500;
}
.consent-modal__head p {
  margin: 0 0 24px;
  color: var(--ink-2); font-size: 14px; line-height: 1.55;
}

.consent-row {
  display: grid; grid-template-columns: 1fr auto;
  gap: 20px;
  padding: 18px 0;
  border-top: 1px solid var(--line);
}
.consent-row__title {
  font-family: var(--title-font);
  font-size: 19px; color: var(--ink);
  margin-bottom: 6px;
  display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.consent-row__pill {
  font-family: var(--body-font);
  font-size: 11px; letter-spacing: 0.15em; text-transform: uppercase;
  background: color-mix(in oklab, var(--green) 14%, var(--bg-2));
  color: var(--green);
  padding: 3px 10px; border-radius: 999px;
}
.consent-row p {
  margin: 0 0 8px; color: var(--ink-2); font-size: 14px; line-height: 1.55;
}
.consent-row ul {
  margin: 8px 0 0; padding-left: 18px;
  font-size: 13px; color: var(--ink-3); line-height: 1.6;
}
.consent-row code {
  background: var(--bg-2);
  padding: 1px 6px; border-radius: 4px;
  font-size: 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.consent-toggle {
  width: 48px; height: 28px;
  border-radius: 999px;
  background: var(--ink-3);
  border: 1px solid var(--ink-3);
  position: relative;
  cursor: pointer;
  transition: background 0.18s, border-color 0.18s;
  padding: 0;
}
.consent-toggle__dot {
  position: absolute;
  top: 2px; left: 2px;
  width: 22px; height: 22px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0,0,0,0.25);
  transition: transform 0.18s;
}
.consent-toggle.is-on { background: var(--green); border-color: var(--green); }
.consent-toggle.is-on .consent-toggle__dot { transform: translateX(20px); }
.consent-toggle.is-locked {
  background: var(--green-soft);
  border-color: var(--green-soft);
  cursor: not-allowed;
  opacity: 0.85;
}
.consent-toggle.is-locked.is-on { background: var(--green); border-color: var(--green); opacity: 0.7; }

.consent-modal__foot {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line);
  flex-wrap: wrap;
}
.consent-modal__foot > a { font-size: 13px; color: var(--green); }
.consent-modal__actions { display: flex; gap: 8px; }

/* ─── YouTube facade (cuando no hay consentimiento) ─────── */
.video-facade {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--line);
  background: var(--ink);
  isolation: isolate;
  display: grid;
  place-items: end stretch;
}
.video-facade__bg {
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
  filter: blur(2px) brightness(0.45) saturate(0.9);
  transform: scale(1.05);
  z-index: 0;
}
/* Fondo propio de la fachada de vídeo: ni una petición a terceros antes de que el visitante
   acepte. Usa el color de acento de la ficha, así que cada tema se ve distinto igualmente. */
.video-facade__bg--propio {
  background:
    radial-gradient(120% 90% at 30% 20%, color-mix(in srgb, var(--accent, #1f4d3a) 55%, #000) 0%, transparent 60%),
    radial-gradient(100% 80% at 80% 80%, color-mix(in srgb, var(--accent, #1f4d3a) 35%, #000) 0%, transparent 55%),
    linear-gradient(160deg, #1a1a17 0%, #23241f 100%);
  filter: none;
  transform: none;
}
.video-facade__body {
  position: relative; z-index: 1;
  padding: 18px 22px;
  background: linear-gradient(180deg, transparent 0%, rgba(20, 15, 8, 0.92) 60%);
  color: #f3ead4;
  display: flex; flex-direction: column; gap: 10px;
}
.video-facade__lock {
  font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--accent);
  display: inline-flex; align-items: center; gap: 6px;
}
.video-facade__body p {
  margin: 0; font-size: 13.5px; line-height: 1.5;
  color: #e8dcc0;
  max-width: 640px;
}
.video-facade__actions {
  display: flex; gap: 12px; align-items: center; flex-wrap: wrap;
  margin-top: 4px;
}
.video-facade__link {
  color: #f3ead4; font-size: 13px; opacity: 0.85;
  border-bottom: 1px solid color-mix(in oklab, #f3ead4 35%, transparent);
}
.video-facade__inline {
  background: none; border: none; padding: 0;
  font: inherit;
  color: #ffd692;
  text-decoration: underline;
  cursor: pointer;
}
.video-facade .consent-btn {
  background: var(--accent);
  border-color: var(--accent);
  min-width: 0;
}
.video-facade .consent-btn:hover { background: color-mix(in oklab, var(--accent) 80%, #fff); border-color: color-mix(in oklab, var(--accent) 80%, #fff); }

/* ─── Mobile / responsive global tweaks ──────────────────── */
@media (max-width: 720px) {
  .section { padding: 64px 18px; }
  .section__header { margin-bottom: 36px; }
  .hero { padding: 56px 18px 80px; }
  .hero__inner { gap: 24px; }
  .hero__col { text-align: center; }
  .hero__eyebrow { justify-content: center; }
  .hero__title { font-size: clamp(44px, 12vw, 64px); }
  .hero__lead { margin-inline: auto; }
  .hero__actions { justify-content: center; }
  .hero__team { max-width: 92%; }
  .hero__scroll { display: none; }

  .founder__card { grid-template-columns: 100px 1fr; padding: 18px; gap: 16px; }
  .founder__portrait { width: 100px; height: 130px; }
  .founder__name { font-size: 26px; }
  .founder__cita { padding: 22px 24px; }

  .timeline::before { left: 18px; }
  .timeline__item { grid-template-columns: 40px 1fr; gap: 14px; }
  .timeline__marker { width: 40px; height: 40px; font-size: 16px; }
  .timeline__content { padding-left: 14px; }

  .detail__hero { padding: 56px 18px 24px; }
  .detail__title { font-size: clamp(36px, 11vw, 56px); }
  .detail__tag { font-size: 18px; }
  .detail__close { top: 12px; right: 14px; padding: 6px 12px; font-size: 12px; }
  .detail__tabs { padding: 10px 14px; }
  .detail__tab { padding: 7px 12px; font-size: 13px; }
  .detail__body { padding: 32px 18px 48px; }

  .ficha__grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .ficha__card { padding: 14px; }
  .ficha__t { font-size: 16px; }
  .ficha__d { font-size: 12px; }

  .star { padding: 20px; gap: 20px; }
  .star__name { font-size: clamp(28px, 8vw, 44px); }

  .cuidados__protocolo { padding: 22px; }
  .cuidados__protocolo h3 { font-size: 22px; }
}

@media (max-width: 480px) {
  .ficha__grid { grid-template-columns: 1fr; }
  .topnav__inner { padding: 8px 14px; }
  .brand__seal img { width: 36px; height: 36px; }
}

/* Admin map states */
.mapa__pin--hidden { opacity: 0.35; outline: 2px dashed #b14a3a; outline-offset: 4px; }
.mapa__pin.is-dragging { cursor: grabbing !important; z-index: 100; }

/* Tooltip always above other pins */
.mapa__pin:hover, .mapa__pin.is-active { z-index: 50; }
.mapa__pin-tip { z-index: 60; }

/* Visitantes admin + Principios admin */
.dedicatoria { position: relative; }
.dedicatoria__admin {
  position: absolute; top: 8px; right: 8px;
  display: flex; gap: 4px; z-index: 5;
  opacity: 0; transition: opacity 0.15s;
}
.dedicatoria:hover .dedicatoria__admin { opacity: 1; }
.dedicatoria__admin button {
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 50%;
  width: 28px; height: 28px;
  cursor: pointer;
}
.dedicatoria--hidden { opacity: 0.4; outline: 2px dashed #b14a3a; outline-offset: -4px; }
.dedicatoria__thumb {
  width: 100%; max-height: 180px; object-fit: cover;
  border-radius: 6px; margin-bottom: 10px;
}
/* Media más pequeña y bajo el título (libro «Todos nosotros») — más inmersivo */
.dedicatoria__media { width: 56%; max-width: 232px; margin: 8px 0 14px; }
.dedicatoria__media .dedicatoria__thumb { margin-bottom: 0; }
@media (max-width: 720px){ .dedicatoria__media{ width: 70%; max-width: 260px; } }
.visitante-add-btn {
  background: #d9c779; color: #1f4d3a;
  border: 2px dashed rgba(31,77,58,0.3);
  padding: 8px 16px; border-radius: 999px;
  cursor: pointer; margin-top: 10px;
  font: 600 12px/1 inherit;
}
.visitante-add-btn:hover { background: #c4b366; }

.principio__upload-btn {
  position: absolute; bottom: 8px; right: 8px;
  background: rgba(217,199,121,0.95); color: #1f4d3a;
  border: none; border-radius: 16px;
  padding: 5px 11px;
  font: 600 11px/1 inherit;
  cursor: pointer; z-index: 5;
}
.principio__upload-btn:hover { background: #d9c779; }
.principio__back-d {
  color: rgba(255,255,255,0.92);
  font-size: 13px; line-height: 1.4;
  margin: 8px 12px;
  text-align: center;
}
.pd-inline-editable.dedicatoria__link {
  display: inline-block; min-width: 120px;
  background: rgba(0,0,0,0.04); padding: 4px 8px; border-radius: 4px;
}

.dedicatoria__date {
  font-size: 11px; color: var(--ink-3, #5a4f3f);
  letter-spacing: 0.08em; text-transform: uppercase;
  margin: 4px 0 8px;
}

/* ─── Favorito star (rotación lenta) ─── */
.pd-fav {
  position: absolute;
  left: 6px;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,0.9);
  border: none;
  border-radius: 50%;
  width: 34px; height: 34px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  z-index: 4;
  padding: 0;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.pd-fav--on svg { animation: pdFavSpin 8s linear infinite; }
.pd-fav--off {
  opacity: 0;
  transition: opacity 0.2s;
  background: rgba(255,255,255,0.7);
}
.pd-fav--off:hover { opacity: 1; }
[data-pd-entity-type]:hover .pd-fav--off { opacity: 0.8; }
.pd-fav--admin { pointer-events: auto; }
@keyframes pdFavSpin { to { transform: translateY(-50%) rotate(360deg); } }

.habitante--fav, .tema-card--fav, .taller-card--fav {
  outline: 2px solid rgba(217,199,121,0.8);
  outline-offset: 2px;
}

/* Bulk add modal para visitantes */
.visitantes-bulk-overlay {
  position: fixed; inset: 0;
  background: rgba(20,53,39,0.7);
  z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.visitantes-bulk-modal {
  background: #fff;
  border-radius: 14px;
  padding: 28px 32px;
  width: 100%; max-width: 720px;
  max-height: 90vh;
  position: relative;
  overflow: auto;
  box-shadow: 0 30px 80px -20px rgba(20,53,39,0.5);
  font-family: -apple-system, system-ui, sans-serif;
}
.visitantes-bulk-close {
  position: absolute; top: 14px; right: 18px;
  background: transparent; border: none;
  font-size: 28px; cursor: pointer; color: #5a4f3f;
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
}
.visitantes-bulk-modal h3 { margin: 0 0 8px; font-size: 22px; color: #1f4d3a; }
.visitantes-bulk-modal p { font-size: 13px; color: #5a4f3f; margin: 0 0 14px; }
.visitantes-bulk-modal textarea {
  width: 100%; padding: 12px 14px;
  border: 1px solid #ede4ce; border-radius: 8px;
  font-family: ui-monospace, monospace; font-size: 12px;
  resize: vertical; min-height: 220px;
}
.visitantes-bulk-actions {
  display: flex; gap: 8px; justify-content: flex-end;
  margin-top: 14px;
}
.visitantes-bulk-actions button {
  padding: 10px 22px;
  border-radius: 8px;
  font: 500 14px inherit; cursor: pointer;
  border: 1px solid transparent;
}
.visitantes-bulk-cancel { background: transparent; color: #1f4d3a; border-color: #ede4ce; }
.visitantes-bulk-submit { background: #1f4d3a; color: #f5efe1; border: none; }
.visitantes-bulk-submit:disabled { opacity: 0.5; cursor: not-allowed; }
.visitantes-bulk-progress { margin-top: 14px; }
.visitantes-bulk-bar { height: 6px; background: #ede4ce; border-radius: 3px; overflow: hidden; }
.visitantes-bulk-fill { height: 100%; width: 0; background: #1f4d3a; transition: width 0.2s; }
.visitantes-bulk-status { font-size: 12px; color: #5a4f3f; margin-top: 6px; }

/* Limitar líneas de título/descripción en dedicatorias para que no desborden */
.dedicatoria__t {
  font-size: clamp(15px, 1.6vw, 22px);
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 4px 0 6px;
}
.dedicatoria__d {
  font-size: clamp(12px, 1.05vw, 14px);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0 0 8px;
  font-style: italic;
}

/* ─── Smooth scroll + sticky-header offset ─────────────────────
   Sin esto, hacer click en "Capítulo IX · Todos nosotros" desde el
   menú aterriza con el título debajo del topnav pegado. */
html { scroll-behavior: smooth; }
.section, .hero, .epilogo {
  scroll-margin-top: 72px;
}
@media (max-width: 880px) {
  .section, .hero, .epilogo { scroll-margin-top: 60px; }
}

/* ─── Visitante: estrella destacada (bottom-right, animada) ─── */
.dedicatoria { padding-bottom: 56px; } /* hueco para la estrella */
.dedicatoria__fav {
  position: absolute;
  right: 14px;
  bottom: 14px;
  width: 44px; height: 44px;
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  z-index: 4;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.18));
  transition: transform 0.2s ease, filter 0.2s ease;
}
.dedicatoria__fav:not(:disabled):hover { transform: scale(1.12) rotate(-6deg); filter: drop-shadow(0 3px 8px rgba(0,0,0,0.28)); }
.dedicatoria__fav--on {
  animation: dedFavPulse 2.6s ease-in-out infinite;
}
.dedicatoria__fav--on svg {
  animation: dedFavTwinkle 3.4s ease-in-out infinite;
  filter: drop-shadow(0 0 6px rgba(241,200,75,0.55));
}
.dedicatoria__fav--off {
  opacity: 0.45;
}
.dedicatoria__fav--off:hover { opacity: 1; }
.dedicatoria--fav {
  outline: 2px solid rgba(241,200,75,0.7);
  outline-offset: 3px;
  background: linear-gradient(180deg, rgba(255,251,235,0.7) 0%, transparent 40%);
}
.dedicatoria--fav .dedicatoria__corner { color: #b08c2a; }

@keyframes dedFavPulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}
@keyframes dedFavTwinkle {
  0%, 100% { transform: rotate(0deg); }
  35%      { transform: rotate(8deg); }
  65%      { transform: rotate(-6deg); }
}

/* ─── Visitante: editor de fecha (admin) ─── */
.dedicatoria__date-edit {
  margin: 4px 0 10px;
  padding: 8px 10px;
  background: rgba(255,255,255,0.6);
  border: 1px dashed color-mix(in oklab, var(--accent, #1f4d3a) 40%, transparent);
  border-radius: 8px;
}
.dedicatoria__date-edit label {
  display: block;
  font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-3, #5a4f3f);
  margin-bottom: 4px;
}
.dedicatoria__date-edit input[type="date"] {
  width: 100%;
  padding: 6px 8px;
  font: 500 13px var(--body-font, inherit);
  border: 1px solid var(--line, #ede4ce);
  border-radius: 6px;
  background: #fff;
  color: var(--ink, #1f1a14);
}
.dedicatoria__date-edit input[type="date"]:focus {
  outline: none;
  border-color: color-mix(in oklab, var(--accent, #1f4d3a) 70%, transparent);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent, #1f4d3a) 15%, transparent);
}
.dedicatoria__date-edit-hint {
  font-size: 10px; color: var(--ink-3, #8a7e6a);
  margin-top: 4px;
  font-style: italic;
}
.dedicatoria__date-add {
  background: transparent;
  border: 1px dashed color-mix(in oklab, var(--ink, #1f1a14) 25%, transparent);
  color: var(--ink-3, #5a4f3f);
  font: 500 11px var(--body-font, inherit);
  letter-spacing: 0.04em;
  padding: 4px 10px;
  border-radius: 999px;
  cursor: pointer;
  margin: 4px 0 8px;
  align-self: flex-start;
}
.dedicatoria__date-add:hover {
  background: rgba(255,255,255,0.7);
  color: var(--ink, #1f1a14);
}

/* Botón fecha en la barra admin de la dedicatoria */
.dedicatoria__admin button[title="Editar fecha"] {
  font-size: 14px;
}

/* Mapa pin durante drag — feedback visual */
.mapa__pin.is-dragging {
  z-index: 30;
  cursor: grabbing !important;
}
.mapa__pin.is-dragging .mapa__pin-dot {
  transform: scale(1.4);
  box-shadow: 0 4px 14px rgba(0,0,0,0.35);
}



/* ─────────────────────────────────────────────
   Admin · Category / Zone chrome
   Solo visible cuando window.__pdIsAdmin == true
   ───────────────────────────────────────────── */
.admin-zone-head { position: relative; }
.admin-zone-head__btns {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  gap: 4px;
  background: rgba(245, 239, 225, 0.95);
  border: 1px solid rgba(31, 77, 58, 0.2);
  border-radius: 20px;
  padding: 3px 4px;
  z-index: 2;
}
.admin-zone-head__btn {
  width: 28px; height: 28px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--green, #1f4d3a);
  cursor: pointer;
  font-size: 14px;
  line-height: 1;
  display: inline-flex; align-items: center; justify-content: center;
}
.admin-zone-head__btn:hover { background: rgba(217, 199, 121, 0.4); }
.admin-zone-head__btn--del:hover { background: rgba(177, 74, 58, 0.18); color: #b14a3a; }
.admin-zone-head__input {
  font-family: var(--title-font, Georgia, serif);
  font-size: clamp(20px, 2.5vw, 28px);
  color: var(--green, #1f4d3a);
  font-weight: 500;
  background: rgba(255, 255, 255, 0.8);
  border: 1px dashed var(--green, #1f4d3a);
  border-radius: 4px;
  padding: 2px 8px;
  text-align: center;
  min-width: 200px;
}

/* "+" add tile that sits inside a card grid */
.admin-add-tile {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px;
  min-height: 160px;
  padding: 24px 16px;
  background: rgba(217, 199, 121, 0.10);
  border: 2px dashed rgba(31, 77, 58, 0.35);
  border-radius: 12px;
  color: var(--green, #1f4d3a);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: background 0.15s, border-color 0.15s, transform 0.15s;
}
.admin-add-tile:hover {
  background: rgba(217, 199, 121, 0.25);
  border-color: var(--green, #1f4d3a);
  transform: translateY(-2px);
}
.admin-add-tile__plus {
  font-size: 36px;
  font-weight: 300;
  line-height: 1;
  width: 56px; height: 56px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.6);
  border: 1px solid rgba(31, 77, 58, 0.35);
  display: flex; align-items: center; justify-content: center;
}
.admin-add-tile--card { min-height: 220px; }
.admin-add-tile--book { min-height: 280px; }

/* "+ Nueva categoría" CTA at the end of a section */
.admin-add-category {
  display: flex; align-items: center; gap: 18px;
  margin: 24px 0 8px;
}
.admin-add-category__line {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(31, 77, 58, 0.25) 30%, rgba(31, 77, 58, 0.25) 70%, transparent);
}
.admin-add-category__btn {
  font-family: inherit;
  background: rgba(217, 199, 121, 0.9);
  color: var(--green, #1f4d3a);
  border: 2px dashed rgba(31, 77, 58, 0.4);
  border-radius: 999px;
  padding: 8px 22px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: all 0.15s;
}
.admin-add-category__btn:hover {
  background: #d9c779;
  border-color: var(--green, #1f4d3a);
  transform: translateY(-1px);
}

/* Delete button overlay on individual cards */
.admin-card-del {
  position: absolute;
  top: 8px; left: 8px;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: rgba(177, 74, 58, 0.92);
  color: white;
  border: 2px solid rgba(245, 239, 225, 0.95);
  font-size: 13px; line-height: 1;
  cursor: pointer;
  z-index: 6;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
  opacity: 0;
  transition: opacity 0.15s, transform 0.15s;
}
*:hover > .admin-card-del,
.habitante:hover .admin-card-del,
.botanica__card:hover .admin-card-del,
.tema-card:hover .admin-card-del,
.taller-card:hover .admin-card-del,
.campamento-card:hover .admin-card-del,
.cumple-card:hover .admin-card-del,
.principio:hover .admin-card-del { opacity: 1; }
.admin-card-del:hover { background: #b14a3a; transform: scale(1.08); }

/* Admin Add modal */
.admin-modal-overlay {
  position: fixed; inset: 0;
  background: rgba(20, 30, 25, 0.6);
  backdrop-filter: blur(4px);
  z-index: 10000;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.admin-modal {
  background: #fff;
  width: 100%; max-width: 480px;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 30px 80px -20px rgba(20, 50, 30, 0.5);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #2a2218;
  display: flex; flex-direction: column;
  max-height: 90vh;
}
.admin-modal__head {
  background: var(--green, #1f4d3a);
  color: #f5efe1;
  padding: 18px 24px;
  display: flex; align-items: center; justify-content: space-between;
}
.admin-modal__head h3 { margin: 0; font-size: 16px; font-weight: 600; }
.admin-modal__close {
  background: transparent;
  border: none;
  color: #f5efe1;
  font-size: 24px;
  width: 32px; height: 32px;
  border-radius: 50%;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.admin-modal__close:hover { background: rgba(255,255,255,0.15); }
.admin-modal__body {
  padding: 20px 24px;
  overflow-y: auto;
  display: flex; flex-direction: column; gap: 14px;
}
.admin-modal__field { display: flex; flex-direction: column; gap: 6px; }
.admin-modal__field > span {
  font-size: 12px; font-weight: 500;
  color: #5a4f3f;
  letter-spacing: 0.04em;
}
.admin-modal__field input,
.admin-modal__field select {
  font: 14px inherit;
  padding: 10px 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  background: #fff;
  color: inherit;
}
.admin-modal__field input:focus,
.admin-modal__field select:focus {
  outline: none;
  border-color: var(--green, #1f4d3a);
  box-shadow: 0 0 0 3px rgba(31, 77, 58, 0.12);
}
.admin-modal__field small { color: #888; font-size: 11px; }
.admin-modal__drop {
  padding: 18px;
  background: #f5efe1;
  border: 2px dashed #c7d2c4;
  border-radius: 8px;
  text-align: center;
  font-size: 13px;
  color: #5a4f3f;
  cursor: pointer;
}
.admin-modal__drop:hover { border-color: var(--green, #1f4d3a); background: #ede4ce; }
.admin-modal__err {
  background: rgba(177, 74, 58, 0.12);
  color: #b14a3a;
  font-size: 13px;
  padding: 10px 12px;
  border-radius: 6px;
}
.admin-modal__foot {
  padding: 14px 24px;
  background: #f5efe1;
  border-top: 1px solid #ede4ce;
  display: flex; justify-content: flex-end; gap: 8px;
}
.admin-modal__btn {
  font: 500 14px/1 inherit;
  padding: 10px 18px;
  border-radius: 8px;
  border: 1px solid #c7d2c4;
  background: #fff;
  color: var(--green, #1f4d3a);
  cursor: pointer;
}
.admin-modal__btn:hover { background: #f5efe1; }
.admin-modal__btn--primary {
  background: var(--green, #1f4d3a);
  color: #f5efe1;
  border-color: transparent;
}
.admin-modal__btn--primary:hover:not(:disabled) { background: #2f5a47; }
.admin-modal__btn--danger {
  background: #b14a3a;
  color: #f5efe1;
  border-color: transparent;
}
.admin-modal__btn--danger:hover:not(:disabled) { background: #9c3e2f; }
.admin-modal__btn:disabled { opacity: 0.5; cursor: not-allowed; }


/* ═══════════════════════════════════════════════════════════════
   Por Dentro · Forms + Entries (público)
   ═══════════════════════════════════════════════════════════════ */

/* ─── Modal del formulario (full-screen) ─────────────────── */
.pdform-modal {
  position: fixed; inset: 0;
  background: var(--bg, #f5efe1);
  z-index: 9000;
  overflow-y: auto;
  display: flex; flex-direction: column;
  padding: 60px 20px 40px;
}
.pdform-modal__close {
  position: fixed; top: 16px; right: 20px;
  background: var(--green, #1f4d3a); color: #f5efe1;
  border: none; padding: 8px 18px;
  border-radius: 999px;
  font: inherit; font-size: 13px; font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 12px -4px rgba(0,0,0,0.2);
  z-index: 10;
}
.pdform-modal__close:hover { background: var(--green-2, #2f5a47); }
.pdform-modal__inner {
  max-width: 720px;
  width: 100%;
  margin: 0 auto;
}

/* ─── Tarjeta del formulario ─────────────────────────────── */
.pdform {
  background: #fff;
  border: 1px solid #e5e1d4;
  border-radius: 14px;
  padding: 32px 36px;
  box-shadow: 0 12px 40px -16px rgba(31, 77, 58, 0.15);
}
.pdform--compact { padding: 24px 26px; border-radius: 12px; }
.pdform--closed { padding: 50px 26px; text-align: center; }
.pdform--success { padding: 60px 26px; text-align: center; }

.pdform__head {
  margin-bottom: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid #ede4ce;
}
.pdform__title {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: 30px; font-weight: 500;
  color: var(--green, #1f4d3a);
  margin: 0 0 8px;
  line-height: 1.15;
}
.pdform__desc {
  color: #5a6856; font-size: 15px; line-height: 1.55;
  margin: 0;
}
.pdform__closed-msg {
  color: #5a6856; font-size: 16px;
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
}
.pdform__top-err {
  background: rgba(177, 74, 58, 0.1);
  color: #8e3a2d;
  padding: 11px 14px;
  border-radius: 8px;
  margin-bottom: 18px;
  font-size: 13px;
}
.pdform__success-icon {
  font-size: 56px; color: var(--green, #1f4d3a);
  width: 88px; height: 88px;
  margin: 0 auto 14px;
  border-radius: 50%;
  background: rgba(31, 77, 58, 0.08);
  display: flex; align-items: center; justify-content: center;
}
.pdform__success-msg {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: 22px; color: var(--green, #1f4d3a);
  margin: 0;
}

/* ─── Campos ─────────────────────────────────────────────── */
.pdform__fields { display: flex; flex-direction: column; gap: 18px; }
.pdform__field { display: flex; flex-direction: column; gap: 6px; }
.pdform__label {
  font-size: 14px; font-weight: 600;
  color: var(--ink, #1f1a14);
}
.pdform__req { color: #b14a3a; font-weight: 700; }
.pdform__heading {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: 22px;
  color: var(--green, #1f4d3a);
  margin: 18px 0 4px;
  font-weight: 500;
}
.pdform__field-err {
  color: #b14a3a; font-size: 12px;
  margin-top: 2px;
}
.pdform__field.has-error .pdform-input,
.pdform__field.has-error .pdform-textarea,
.pdform__field.has-error .pdform-select { border-color: #b14a3a; }

.pdform-input,
.pdform-textarea,
.pdform-select {
  font: inherit; font-size: 15px;
  padding: 11px 14px;
  border: 1.5px solid #e5e1d4;
  border-radius: 8px;
  background: #fff;
  color: var(--ink, #1f1a14);
  transition: border-color 0.12s, box-shadow 0.12s;
  width: 100%;
  font-family: 'Work Sans', sans-serif;
}
.pdform-input:focus,
.pdform-textarea:focus,
.pdform-select:focus {
  outline: none;
  border-color: var(--green, #1f4d3a);
  box-shadow: 0 0 0 3px rgba(31, 77, 58, 0.12);
}
.pdform-textarea { resize: vertical; min-height: 80px; line-height: 1.5; }
.pdform-other { margin-top: 8px; }

/* Opciones radio / checkbox */
.pdform-options { display: flex; flex-direction: column; gap: 8px; }
.pdform-option {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 11px 16px;
  background: #faf8ef;
  border: 1.5px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.1s;
}
.pdform-option:hover { background: #f5efe1; }
.pdform-option.is-checked {
  background: rgba(31, 77, 58, 0.06);
  border-color: var(--green, #1f4d3a);
}
.pdform-option input { margin-top: 2px; accent-color: var(--green, #1f4d3a); }
.pdform-option span {
  font-size: 14px; color: var(--ink, #1f1a14);
  line-height: 1.4;
}

/* Slider */
.pdform-slider {
  display: flex; align-items: center; gap: 16px;
  padding: 6px 0;
}
.pdform-slider input[type="range"] {
  flex: 1; accent-color: var(--green, #1f4d3a); height: 6px;
}
.pdform-slider output {
  min-width: 36px; text-align: center;
  background: var(--green, #1f4d3a); color: #f5efe1;
  padding: 4px 10px; border-radius: 999px;
  font-weight: 600; font-size: 14px;
}

/* Consent checkbox */
.pdform-consent {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 14px 16px;
  background: #faf8ef;
  border: 1.5px solid #e5e1d4;
  border-radius: 10px;
  cursor: pointer;
  margin-top: 4px;
}
.pdform-consent.is-checked {
  background: rgba(31, 77, 58, 0.06);
  border-color: var(--green, #1f4d3a);
}
.pdform-consent.has-error { border-color: #b14a3a; }
.pdform-consent input { margin-top: 2px; accent-color: var(--green, #1f4d3a); }
.pdform-consent span { font-size: 13px; line-height: 1.5; color: var(--ink, #1f1a14); }
.pdform-consent a { color: var(--green, #1f4d3a); }
.pdform__rgpd { margin-top: 22px; }

.pdform-file {
  font: inherit; padding: 8px 0;
}

/* Submit */
.pdform__submit {
  display: flex; justify-content: flex-end;
  margin-top: 26px;
  padding-top: 20px;
  border-top: 1px solid #ede4ce;
}
.pdform__btn {
  background: var(--green, #1f4d3a); color: #f5efe1;
  border: none; padding: 12px 36px;
  border-radius: 999px;
  font: inherit; font-size: 15px; font-weight: 600;
  cursor: pointer;
  transition: background 0.12s, transform 0.12s;
}
.pdform__btn:hover { background: var(--green-2, #2f5a47); transform: translateY(-1px); }
.pdform__btn:disabled { opacity: 0.6; cursor: wait; transform: none; }

.pdform-loading, .pdform-error {
  padding: 30px; text-align: center; color: #5a6856; font-size: 14px;
}
.pdform-error { color: #b14a3a; }

/* ─── Resultados de encuesta ─────────────────────────────── */
.pdform-results {
  margin-top: 28px;
  padding: 20px 22px;
  background: #faf8ef;
  border-radius: 12px;
  border: 1px solid #ede4ce;
}
.pdform-results__head {
  display: flex; justify-content: space-between; align-items: baseline;
  margin-bottom: 14px;
}
.pdform-results__head h4 {
  margin: 0;
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: 18px; color: var(--green, #1f4d3a); font-weight: 500;
}
.pdform-results__total {
  font-size: 13px; color: #5a6856; font-weight: 500;
}
.pdform-results__group + .pdform-results__group { margin-top: 18px; padding-top: 18px; border-top: 1px solid #e5e1d4; }
.pdform-results__label { font-size: 12px; color: #888; margin-bottom: 8px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; }
.pdform-results__bars { display: flex; flex-direction: column; gap: 8px; }
.pdform-bar {
  display: flex; flex-direction: column; gap: 4px;
}
.pdform-bar__label {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 13px; color: var(--ink, #1f1a14);
}
.pdform-bar__count {
  font-size: 12px; color: #5a6856; font-weight: 500;
}
.pdform-bar__track {
  height: 8px;
  background: #ede4ce;
  border-radius: 999px;
  overflow: hidden;
}
.pdform-bar__fill {
  height: 100%;
  background: var(--accent, var(--green, #1f4d3a));
  border-radius: 999px;
  transition: width 0.4s ease-out;
}
.pdform-bar.is-winner .pdform-bar__label strong,
.pdform-bar.is-winner .pdform-bar__label > span:first-child {
  color: var(--green, #1f4d3a); font-weight: 600;
}
.pdform-bar.is-winner .pdform-bar__fill {
  box-shadow: 0 0 8px rgba(31, 77, 58, 0.4);
}
.pdform-bar--other { opacity: 0.7; font-style: italic; }
.pdform-results--empty, .pdform-results--loading, .pdform-results--err {
  text-align: center; color: #5a6856; padding: 16px; font-size: 13px;
}
.pdform-results--err { color: #b14a3a; }

/* ─── Forget-me button ──────────────────────────────────── */
.pdform-forget {
  background: transparent; border: 1.5px solid #b14a3a;
  color: #b14a3a;
  padding: 6px 14px; border-radius: 999px;
  font: inherit; font-size: 12px; font-weight: 500;
  cursor: pointer; transition: all 0.12s;
}
.pdform-forget:hover { background: rgba(177, 74, 58, 0.08); }
.pdform-forget--done { color: var(--green, #1f4d3a); font-size: 12px; }

/* ─── Entry tabs (Noticias / Especial) ──────────────────── */
.entry-tab { padding: 14px 0; }
.entry-tab__loading { padding: 30px; text-align: center; color: #888; }
.entry-tab__empty {
  text-align: center; padding: 40px 20px;
  color: #5a6856; font-size: 14px;
}
.entry-tab__empty p { margin: 0 0 10px; }
.entry-tab__empty strong { color: var(--green, #1f4d3a); }
.entry-tab__head {
  display: flex; justify-content: flex-end;
  margin-bottom: 16px;
}

.entry-list { display: flex; flex-direction: column; gap: 18px; }
.entry-list--special { gap: 24px; }

.entry-card {
  background: #fff;
  border: 1px solid #e5e1d4;
  border-radius: 12px;
  padding: 22px 26px;
  position: relative;
  transition: transform 0.15s, box-shadow 0.15s;
}
.entry-card--special {
  border-left: 4px solid var(--accent, var(--green, #1f4d3a));
  background: linear-gradient(to right, rgba(31,77,58,0.02), #fff 12%);
}
.entry-card--hidden {
  opacity: 0.55;
  background: repeating-linear-gradient(45deg, #fff, #fff 10px, #faf8ef 10px, #faf8ef 20px);
}
.entry-card:hover { box-shadow: 0 6px 18px -8px rgba(31, 77, 58, 0.12); }

.entry-card__head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px;
  gap: 8px;
}
.entry-card__date {
  font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em;
  color: #888; font-weight: 600;
}
.entry-card__hidden-badge {
  font-size: 10px; background: #c98f3f; color: #fff;
  padding: 2px 8px; border-radius: 999px; text-transform: uppercase; letter-spacing: 0.05em;
  font-weight: 600;
}
.entry-card__admin {
  display: flex; gap: 4px; flex-wrap: wrap;
  opacity: 0; transition: opacity 0.12s;
}
.entry-card:hover .entry-card__admin { opacity: 1; }
.entry-card__admin button {
  width: 28px; height: 28px;
  border-radius: 50%;
  border: none; background: rgba(31, 77, 58, 0.06);
  color: var(--green, #1f4d3a);
  cursor: pointer; font-size: 13px;
  display: flex; align-items: center; justify-content: center;
  line-height: 1;
  transition: background 0.12s, transform 0.06s;
}
.entry-card__admin button:hover { background: rgba(31, 77, 58, 0.15); }
.entry-card__admin button:active { transform: scale(0.92); }
.entry-card__del:hover { background: rgba(177, 74, 58, 0.18) !important; color: #b14a3a !important; }

.entry-card__title {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: 24px;
  font-weight: 500;
  color: var(--green, #1f4d3a);
  margin: 0 0 12px;
  line-height: 1.2;
}
.entry-card__body {
  color: var(--ink, #1f1a14);
  font-size: 15px;
  line-height: 1.65;
}
.entry-card__body p { margin: 0 0 12px; }
.entry-card__body p:last-child { margin-bottom: 0; }
.entry-card__body h2 {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  color: var(--green, #1f4d3a);
  font-size: 20px; margin: 18px 0 8px; font-weight: 500;
}
.entry-card__body a { color: var(--green, #1f4d3a); }
.entry-card__body ul { padding-left: 22px; margin: 0 0 12px; }
.entry-card__body strong { color: var(--green, #1f4d3a); }

.entry-card__form { margin-top: 24px; }

/* ── Foto de portada de entrada ──────────────────────────────────
   Imagen apaisada que aparece encima del título de la card. Hace que
   los posts con foto se destaquen visualmente y aporta una vibra más
   editorial (estilo blog) que el card minimalista. */
.entry-card--with-cover { padding: 0; overflow: hidden; }
.entry-card--with-cover > .entry-card__head,
.entry-card--with-cover > .entry-card__title,
.entry-card--with-cover > .entry-card__body,
.entry-card--with-cover > .entry-card__form { padding-left: 18px; padding-right: 18px; }
.entry-card--with-cover > .entry-card__head    { padding-top: 14px; }
.entry-card--with-cover > .entry-card__form,
.entry-card--with-cover > .entry-card__body:last-child { padding-bottom: 18px; }
.entry-card__cover {
  position: relative; /* para el botón ampliar */
  display: block;
  aspect-ratio: 16/9;
  background: #f0ece2;
  overflow: hidden;
  margin: 0 0 4px;
  border-bottom: 1px solid #ede4ce;
}
.entry-card__cover img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}
.entry-card--with-cover:hover .entry-card__cover img { transform: scale(1.02); }

/* Botón "ampliar imagen" arriba a la derecha — mismo patrón que el de
   CartelInfografia para mantener consistencia visual a lo largo del sitio.
   Pequeño, semi-translúcido, se intensifica al hover. */
.entry-card__cover-zoom {
  position: absolute;
  top: 10px; right: 10px;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  border: none; border-radius: 50%;
  background: rgba(255,255,255,0.85);
  color: var(--green, #1f4d3a);
  cursor: pointer;
  backdrop-filter: blur(4px);
  box-shadow: 0 2px 6px rgba(0,0,0,0.12);
  transition: background 0.15s, transform 0.15s;
}
.entry-card__cover-zoom:hover {
  background: #fff;
  transform: scale(1.06);
}
.entry-card__cover-zoom:active { transform: scale(0.95); }

/* ── Animación pulsar/atención del botón ampliar imagen ──────────
   Mismo patrón se aplica a CartelInfografia y EntryCover. Triple
   capa para llamar la atención sin marear:
     1. Halo expansivo: pseudo-elemento detrás que se infla y desvanece.
     2. Latido sutil: el botón hace un breath 1.0→1.08→1.0.
     3. Lupa que oscila: el icono SVG dentro hace un wobble pequeño.
   La animación pausa en hover/focus — cuando el usuario lo mira ya no
   necesita que le grite. También respeta prefers-reduced-motion.   */
@keyframes pd-zoom-pulse-halo {
  0%   { box-shadow: 0 0 0 0 rgba(31, 77, 58, 0.45); }
  70%  { box-shadow: 0 0 0 14px rgba(31, 77, 58, 0); }
  100% { box-shadow: 0 0 0 0 rgba(31, 77, 58, 0); }
}
@keyframes pd-zoom-pulse-breath {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.08); }
}
@keyframes pd-zoom-pulse-wobble {
  0%, 100% { transform: rotate(0deg); }
  25%      { transform: rotate(-8deg); }
  75%      { transform: rotate(8deg); }
}
.entry-card__cover-zoom--pulse,
.infographic__btn--pulse {
  animation: pd-zoom-pulse-breath 2.4s ease-in-out infinite,
             pd-zoom-pulse-halo   2.4s ease-out      infinite;
}
.entry-card__cover-zoom--pulse svg,
.infographic__btn--pulse svg {
  animation: pd-zoom-pulse-wobble 2.4s ease-in-out infinite;
  transform-origin: center;
}
.entry-card__cover-zoom--pulse:hover,
.entry-card__cover-zoom--pulse:focus,
.infographic__btn--pulse:hover,
.infographic__btn--pulse:focus,
.entry-card__cover-zoom--pulse:hover svg,
.entry-card__cover-zoom--pulse:focus svg,
.infographic__btn--pulse:hover svg,
.infographic__btn--pulse:focus svg {
  animation: none;
}
@media (prefers-reduced-motion: reduce) {
  .entry-card__cover-zoom--pulse,
  .entry-card__cover-zoom--pulse svg,
  .infographic__btn--pulse,
  .infographic__btn--pulse svg { animation: none; }
}

/* ── Editor: bloque de cover_image ───────────────────────────── */
.entry-cover-preview {
  position: relative;
  display: block;
  aspect-ratio: 16/9;
  background:
    linear-gradient(45deg, #f0ece2 25%, transparent 25%),
    linear-gradient(-45deg, #f0ece2 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #f0ece2 75%),
    linear-gradient(-45deg, transparent 75%, #f0ece2 75%);
  background-size: 16px 16px;
  background-position: 0 0, 0 8px, 8px -8px, -8px 0;
  background-color: #fff;
  border: 1px solid #e5e1d4;
  border-radius: 8px;
  overflow: hidden;
}
.entry-cover-preview img {
  width: 100%; height: 100%; object-fit: cover; display: block;
}
.entry-cover-preview__actions {
  position: absolute;
  bottom: 8px; right: 8px;
  display: flex; gap: 6px;
  background: rgba(255,255,255,0.9);
  padding: 4px;
  border-radius: 6px;
  backdrop-filter: blur(4px);
}
.entry-cover-add {
  width: 100%;
  padding: 28px;
  border: 1.5px dashed #d8d2bd;
  background: #faf8ef;
  font-size: 14px;
  color: var(--ink-soft, #5a4f3f);
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}
.entry-cover-add:hover { background: #f5f1e1; border-color: #c4bca2; }

/* ─── Editor de entrada (admin) ─────────────────────────── */
.entry-editor {
  background: #faf8ef;
  border: 2px solid var(--accent, var(--green, #1f4d3a));
  border-radius: 12px;
  padding: 22px 24px;
  margin-bottom: 18px;
}
.entry-editor__bar {
  display: flex; justify-content: space-between; align-items: baseline;
  padding-bottom: 12px; margin-bottom: 14px;
  border-bottom: 1px solid #ede4ce;
}
.entry-editor__bar strong {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: 17px;
  color: var(--green, #1f4d3a);
}
.entry-editor .field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.entry-editor__input,
.entry-editor__textarea {
  font: inherit; font-family: 'Work Sans', sans-serif; font-size: 14px;
  padding: 9px 12px;
  border: 1px solid #d4cdb5;
  border-radius: 6px;
  background: #fff;
  width: 100%;
}
.entry-editor__input:focus,
.entry-editor__textarea:focus {
  outline: none;
  border-color: var(--green, #1f4d3a);
  box-shadow: 0 0 0 2px rgba(31, 77, 58, 0.12);
}
.entry-editor__textarea {
  font-family: ui-monospace, 'JetBrains Mono', monospace;
  font-size: 13px;
  line-height: 1.55;
  resize: vertical; min-height: 140px;
}
.entry-editor__toolbar {
  display: flex; gap: 4px;
  margin-bottom: 4px;
}
.entry-editor__toolbar button {
  background: #fff;
  border: 1px solid #d4cdb5;
  padding: 4px 10px;
  border-radius: 4px;
  cursor: pointer;
  font: inherit; font-size: 12px;
  min-width: 30px;
  color: var(--green, #1f4d3a);
}
.entry-editor__toolbar button:hover {
  background: var(--green, #1f4d3a); color: #f5efe1;
}
.entry-editor__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
.entry-editor__err {
  background: rgba(177, 74, 58, 0.1);
  color: #8e3a2d;
  padding: 10px 12px; border-radius: 6px;
  margin-bottom: 12px; font-size: 13px;
}
.entry-editor__actions {
  display: flex; justify-content: flex-end; gap: 8px;
  padding-top: 12px; border-top: 1px solid #ede4ce;
}

/* ─── Consent modal: bloque "Mis datos" ─────────────────── */
.consent-modal__persona {
  margin-top: 18px;
  padding: 18px 20px;
  background: #faf8ef;
  border: 1px solid rgba(177, 74, 58, 0.25);
  border-radius: 10px;
}
.consent-modal__persona h3 {
  margin: 0 0 8px;
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: 18px;
  color: var(--ink, #1f1a14);
}
.consent-modal__persona p { margin: 0 0 10px; font-size: 13px; color: #5a6856; }
.consent-persona__list {
  list-style: none; padding: 0; margin: 0 0 14px;
  display: flex; flex-direction: column; gap: 4px;
  font-size: 13px;
}
.consent-persona__list strong { color: var(--ink, #1f1a14); margin-right: 6px; }
.consent-persona__forget {
  background: #b14a3a; color: #fff;
  border: none; padding: 9px 18px;
  border-radius: 999px;
  font: inherit; font-size: 13px; font-weight: 600;
  cursor: pointer;
  transition: all 0.12s;
}
.consent-persona__forget:hover { background: #8e3a2d; transform: translateY(-1px); }
.consent-persona__done {
  color: var(--green, #1f4d3a); font-weight: 600;
  font-size: 14px; margin: 0;
}


/* ═══════════════════════════════════════════════════════════════
   Editor enriquecido (entry-editor)
   ═══════════════════════════════════════════════════════════════ */

/* Rich toolbar */
.entry-editor__rich-toolbar {
  display: flex; flex-wrap: wrap; gap: 3px;
  margin-bottom: 6px;
  padding: 6px;
  background: #f5efe1;
  border-radius: 8px;
  align-items: center;
}
.entry-editor__rich-toolbar button {
  background: #fff;
  border: 1px solid #d4cdb5;
  padding: 5px 10px;
  border-radius: 5px;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  min-width: 30px;
  color: var(--green, #1f4d3a);
  line-height: 1.2;
  transition: all 0.1s;
}
.entry-editor__rich-toolbar button:hover {
  background: var(--green, #1f4d3a); color: #f5efe1;
  border-color: var(--green, #1f4d3a);
  transform: translateY(-1px);
}
.entry-editor__sep {
  width: 1px; height: 22px;
  background: #d4cdb5;
  margin: 0 4px;
}

/* Vista previa */
.entry-editor__preview {
  min-height: 200px;
  background: #fff;
  border: 1px solid #d4cdb5;
  border-radius: 8px;
  padding: 18px 22px;
}

/* ═══════════════════════════════════════════════════════════════
   Modales del editor
   ═══════════════════════════════════════════════════════════════ */

.pdedit-modal-overlay {
  position: fixed; inset: 0;
  background: rgba(20, 30, 25, 0.7);
  backdrop-filter: blur(6px);
  z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  animation: pdedit-fade 0.15s ease-out;
}
@keyframes pdedit-fade { from { opacity: 0; } to { opacity: 1; } }
.pdedit-modal {
  background: #fff;
  width: 100%;
  max-width: 480px;
  max-height: 90vh;
  border-radius: 14px;
  overflow: hidden;
  display: flex; flex-direction: column;
  animation: pdedit-pop 0.18s cubic-bezier(0.16, 1, 0.3, 1);
  font-family: 'Work Sans', sans-serif;
}
@keyframes pdedit-pop {
  from { opacity: 0; transform: scale(0.97); }
  to   { opacity: 1; transform: scale(1); }
}
.pdedit-modal__head {
  background: #1f4d3a; color: #f5efe1;
  padding: 18px 24px;
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 16px;
}
.pdedit-modal__head h3 {
  margin: 0; font-size: 17px; font-weight: 600;
  font-family: 'Cormorant Garamond', Georgia, serif;
}
.pdedit-modal__head p {
  margin: 4px 0 0; font-size: 12px; opacity: 0.85;
}
.pdedit-modal__close {
  background: transparent; border: none;
  color: #f5efe1; font-size: 24px;
  width: 30px; height: 30px;
  border-radius: 50%;
  cursor: pointer;
}
.pdedit-modal__close:hover { background: rgba(255,255,255,0.15); }
.pdedit-modal__body {
  padding: 20px 24px;
  overflow-y: auto;
  display: flex; flex-direction: column;
  gap: 14px;
}
.pdedit-modal__body .field {
  display: flex; flex-direction: column; gap: 6px;
}
.pdedit-modal__body .field__label {
  font-size: 12px; font-weight: 600;
  color: #5a4f3f; letter-spacing: 0.03em;
}
.pdedit-modal__body input,
.pdedit-modal__body textarea,
.pdedit-modal__body select {
  font: inherit; font-family: 'Work Sans', sans-serif; font-size: 14px;
  padding: 10px 12px;
  border: 1.5px solid #ddd;
  border-radius: 8px;
  background: #fff;
  width: 100%;
}
.pdedit-modal__body input:focus,
.pdedit-modal__body textarea:focus,
.pdedit-modal__body select:focus {
  outline: none;
  border-color: var(--green, #1f4d3a);
  box-shadow: 0 0 0 3px rgba(31, 77, 58, 0.12);
}
.pdedit-modal__foot {
  padding: 14px 24px;
  background: #f5efe1;
  border-top: 1px solid #ede4ce;
  display: flex; justify-content: flex-end; gap: 8px;
}
.pdedit-modal__foot .btn-ghost {
  background: #fff;
  border: 1px solid #c7d2c4;
  color: var(--green, #1f4d3a);
  padding: 9px 18px;
  border-radius: 8px;
  font: inherit; font-size: 14px;
  cursor: pointer;
}
.pdedit-modal__foot .btn--solid {
  background: var(--green, #1f4d3a);
  color: #f5efe1;
  border: none;
  padding: 9px 18px;
  border-radius: 8px;
  font: inherit; font-size: 14px; font-weight: 500;
  cursor: pointer;
}
.pdedit-modal__foot .btn--solid:hover:not(:disabled) {
  background: #2f5a47;
}
.pdedit-modal__foot .btn--solid:disabled {
  opacity: 0.5; cursor: not-allowed;
}

.pdedit-detected {
  font-size: 13px;
  padding: 8px 12px;
  background: rgba(31, 77, 58, 0.06);
  color: var(--green, #1f4d3a);
  border-radius: 6px;
}
.pdedit-help {
  font-size: 12px;
  padding: 12px 14px;
  background: #f5efe1;
  border-radius: 8px;
  color: #5a4f3f;
  line-height: 1.55;
}
.pdedit-help strong { color: var(--green, #1f4d3a); }
.pdedit-help ul { padding-left: 18px; margin: 6px 0 0; }
.pdedit-help code { background: #fff; padding: 1px 5px; border-radius: 3px; font-family: ui-monospace, monospace; }
.pdedit-help a { color: var(--green, #1f4d3a); }

.pdedit-preview {
  margin-top: 10px;
  padding: 10px;
  background: #f5efe1;
  border-radius: 8px;
}
.pdedit-preview img, .pdedit-preview audio, .pdedit-preview video {
  max-width: 100%;
  border-radius: 6px;
}

/* GIF grid */
.pdedit-gif-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 8px;
  max-height: 380px;
  overflow-y: auto;
  padding: 4px;
}
.pdedit-gif-tile {
  background: #f5efe1;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 0;
  cursor: pointer;
  overflow: hidden;
  height: 130px;
  transition: all 0.1s;
}
.pdedit-gif-tile:hover {
  border-color: var(--green, #1f4d3a);
  transform: scale(1.03);
}
.pdedit-gif-tile img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}

/* Emoji picker */
.pdedit-emoji-cats {
  display: flex; gap: 4px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.pdedit-emoji-cats button {
  background: #f5efe1;
  border: 1px solid #d4cdb5;
  padding: 5px 12px;
  border-radius: 999px;
  font: inherit; font-size: 12px;
  cursor: pointer;
  color: var(--green, #1f4d3a);
}
.pdedit-emoji-cats button.is-active {
  background: var(--green, #1f4d3a);
  color: #f5efe1;
  border-color: var(--green, #1f4d3a);
}
.pdedit-emoji-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(40px, 1fr));
  gap: 4px;
  max-height: 280px;
  overflow-y: auto;
}
.pdedit-emoji-grid button {
  background: transparent;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 6px;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}
.pdedit-emoji-grid button:hover {
  background: #f5efe1;
  border-color: #d4cdb5;
  transform: scale(1.2);
}

.pdedit-token-preview {
  background: #f5efe1;
  padding: 10px 14px;
  border-radius: 6px;
  font-size: 13px;
}
.pdedit-token-preview code {
  background: #fff;
  padding: 2px 8px;
  border-radius: 3px;
  font-family: ui-monospace, monospace;
  color: var(--green, #1f4d3a);
  font-weight: 600;
  margin-left: 6px;
}

/* ═══════════════════════════════════════════════════════════════
   Embeds renderizados en EntryCard
   ═══════════════════════════════════════════════════════════════ */

.pd-embed { margin: 18px 0; }
.pd-embed--video,
.pd-embed--page {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  background: #1a1a1a;
  border-radius: 10px;
  overflow: hidden;
}
.pd-embed--video iframe,
.pd-embed--video video,
.pd-embed--page iframe {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  border: none;
}
.pd-embed--tiktok {
  max-width: 325px;
  margin: 18px auto;
  aspect-ratio: 9/16;
  border-radius: 10px;
  overflow: hidden;
}
.pd-embed--tiktok iframe {
  width: 100%; height: 100%;
  border: none;
}
.pd-embed--instagram {
  max-width: 540px;
  margin: 18px auto;
  border-radius: 10px;
  overflow: hidden;
}
.pd-embed--instagram iframe {
  width: 100%;
  min-height: 600px;
  border: none;
}
.pd-embed--audio {
  margin: 18px 0;
  padding: 12px 16px;
  background: var(--bg, #f5efe1);
  border-radius: 10px;
  border: 1px solid #ede4ce;
}
.pd-embed--audio audio {
  width: 100%;
}
.pd-embed--audio figcaption {
  font-size: 13px; color: #5a6856;
  margin-top: 6px;
  font-style: italic;
}
.pd-embed--image {
  margin: 18px 0;
  text-align: center;
}
.pd-embed--image img {
  max-width: 100%;
  border-radius: 10px;
  box-shadow: 0 8px 24px -8px rgba(31, 77, 58, 0.18);
}
.pd-embed--image figcaption {
  font-size: 12px; color: #888;
  margin-top: 6px;
  font-style: italic;
}
.pd-embed__src {
  margin-top: 8px;
  font-size: 12px; text-align: right;
}
.pd-embed__src a { color: var(--green, #1f4d3a); }

/* Form display-only blocks (vídeo, imagen, código embebidos como campo) */
.pdform__display-block { margin: 22px 0; }
.pdform__display-block .pd-embed { margin: 0; }
.pdform__display { width: 100%; }
.pdform__caption {
  font-size: 13px; color: #5a6856;
  margin-top: 6px; font-style: italic; text-align: center;
}
.pdform__display--code {
  background: #1f1a14;
  color: #f5efe1;
  padding: 14px 18px;
  border-radius: 8px;
  font-family: ui-monospace, 'JetBrains Mono', 'Cascadia Code', monospace;
  font-size: 13px;
  overflow-x: auto;
  line-height: 1.5;
  white-space: pre-wrap;
}
.pdform__display--code code {
  background: transparent;
  color: inherit;
  padding: 0;
}
.pdform__display--code::before {
  content: attr(data-lang);
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: rgba(245, 239, 225, 0.5);
  margin-bottom: 8px;
}
.pdform__display--code:not([data-lang])::before,
.pdform__display--code[data-lang=""]::before {
  display: none;
}


/* Rating stars (público) */
.pdform-rating { display: flex; gap: 6px; align-items: center; }
.pdform-rating__star {
  background: transparent;
  border: none;
  font-size: 28px;
  color: #d4cdb5;
  cursor: pointer;
  padding: 4px;
  line-height: 1;
  transition: transform 0.1s, color 0.1s;
}
.pdform-rating__star:hover { transform: scale(1.2); color: #c98f3f; }
.pdform-rating__star.is-filled { color: #c98f3f; }
.pdform-rating__value {
  margin-left: 12px;
  font-size: 13px;
  color: #5a6856;
  font-weight: 500;
}


/* ── Cartel sin imagen: placeholder estilo card de portada ──────── */
/* Cuando un cartel está roto o no se ha subido, mostramos la inicial
   del título tipo "tarjeta" con fondo de color accent — consistencia
   visual con las insignias rotas en la portada. */
.detail__cartel--initial {
  position: relative;
  aspect-ratio: 16/9;
  border-radius: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #f5efe1;
  overflow: hidden;
  box-shadow: 0 12px 32px -16px rgba(20,53,39,0.4);
}
.cartel-initial__label {
  position: absolute;
  top: 16px;
  right: 16px;
  background: rgba(0,0,0,0.18);
  color: rgba(255,255,255,0.85);
  padding: 4px 12px;
  border-radius: 14px;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  backdrop-filter: blur(2px);
}
.cartel-initial__letter {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: clamp(80px, 16vw, 180px);
  font-weight: 500;
  line-height: 1;
  color: rgba(255,255,255,0.92);
  letter-spacing: 0.02em;
}
.cartel-initial__hint {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.7);
  font-weight: 500;
}

/* ───── Fallback de imagen rota / sin imagen ───── */
.responsive-img-fallback {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 80px;
  border-radius: inherit;
  position: relative;
  gap: 4px;
}
.responsive-img-fallback__initial {
  font-family: var(--title-font, 'Cormorant Garamond', Georgia, serif);
  font-size: clamp(36px, 8vw, 72px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.02em;
}
.responsive-img-fallback__label {
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.85;
  font-weight: 600;
  position: absolute;
  bottom: 6px;
  background: rgba(0, 0, 0, 0.2);
  padding: 2px 8px;
  border-radius: 999px;
}

/* Admin: indicador rojo discreto sobre imágenes rotas */
[data-pd-image-broken] {
  outline: 2px dashed rgba(177, 74, 58, 0.7);
  outline-offset: -2px;
}
[data-pd-image-broken]::before {
  content: "⚠";
  position: absolute;
  top: 6px;
  right: 6px;
  background: #b14a3a;
  color: #fff;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  z-index: 5;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
}

/* ───── Mover papelera admin de top-left → top-right ───── */
.admin-card-del {
  left: auto !important;
  right: 8px !important;
}

/* ═══════════════════════════════════════════════════════════════
   Mapa inteligente — leyenda interactiva, zonas y panel admin
   ═══════════════════════════════════════════════════════════════ */

/* Barra admin sobre el mapa */
.mapa-adminbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.mapa-adminbar__seg{display:inline-flex;background:var(--bg-2);border:1px solid var(--line);border-radius:999px;padding:3px}
.mapa-adminbar__seg button{border:none;background:transparent;color:var(--ink-2);padding:7px 16px;border-radius:999px;font-size:13px;font-weight:500;font-family:var(--body);cursor:pointer;transition:.15s}
.mapa-adminbar__seg button.is-on{background:var(--green);color:var(--bg)}
.mapa-adminbar__explain{font-size:13px;color:var(--ink-2);font-style:italic;font-family:var(--title);font-size:16px}

/* Zona de aparición (solo admin) */
.mapa__zone{position:absolute;width:20%;height:13%;transform:translate(-50%,0);border:1.5px dashed var(--cat,#888);border-radius:8px;background:color-mix(in oklab,var(--cat,#888) 9%,transparent);pointer-events:none;z-index:1}
.mapa__zone-lbl{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--cat,#888);color:#fff;font-size:9px;letter-spacing:.03em;padding:2px 7px;border-radius:999px;white-space:nowrap;line-height:1.4}

/* Pin sin colocar */
.mapa__pin--unplaced .mapa__pin-dot{border-style:dashed;box-shadow:0 0 0 2px var(--cat),0 2px 6px rgba(0,0,0,.35)}
.mapa--editing .mapa__pin{cursor:grab}
.mapa--editing .mapa__pin:active{cursor:grabbing}

/* Leyenda interactiva (toggles) */
.leyenda__hint{font-size:12px;color:var(--ink-3);font-style:italic;text-align:center;margin:-6px 0 14px}
.leyenda__toggle{cursor:pointer;border:1.5px solid var(--line);background:var(--bg);border-radius:12px;padding:10px 12px;transition:border-color .16s,background .16s,box-shadow .16s;text-align:left;width:100%;font-family:inherit}
.leyenda__toggle:hover{border-color:var(--cat)}
.leyenda__toggle.is-on{border-color:var(--cat);background:color-mix(in oklab,var(--cat) 9%,var(--bg));box-shadow:0 0 0 1px var(--cat)}
.leyenda__toggle .leyenda__check{margin-left:auto;align-self:center;color:var(--cat);font-weight:700;font-size:15px;width:14px;flex-shrink:0}
.leyenda__toggle,.leyenda__body{min-width:0}
.leyenda__amuleto-ph{display:block;width:100%;height:100%;background:repeating-linear-gradient(45deg,var(--bg-2),var(--bg-2) 5px,#e3d9c2 5px,#e3d9c2 10px)}
.leyenda__clear{display:block;margin:16px auto 0;border:1px solid var(--line);background:transparent;color:var(--ink-2);padding:7px 16px;border-radius:8px;font-size:13px;font-family:var(--body);cursor:pointer;transition:.15s}
.leyenda__clear:hover{background:#fff;border-color:var(--ink-3)}

/* ── Panel admin del mapa (inline) ── */
.mapadm{margin-top:26px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 10px 30px rgba(31,26,20,.10);overflow:hidden}
.mapadm__head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.mapadm__eyebrow{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:600}
.mapadm__title{font-family:var(--title);font-weight:500;font-size:24px;margin:2px 0 0;color:var(--ink)}
.mapadm__hint-top{font-size:12px;color:var(--ink-3);font-style:italic}
.mapadm-tabs{display:flex;gap:4px;padding:10px 14px;border-bottom:1px solid var(--line);overflow-x:auto}
.mapadm-tab{border:none;background:transparent;color:var(--ink-2);padding:8px 14px;border-radius:8px;font-size:13.5px;font-weight:500;font-family:var(--body);white-space:nowrap;cursor:pointer;transition:.14s}
.mapadm-tab:hover{background:var(--bg)}
.mapadm-tab.is-on{background:var(--green);color:var(--bg)}
.mapadm__body{padding:20px}
.mapadm-stack{display:flex;flex-direction:column;gap:18px}
.mapadm-note{font-size:13px;color:var(--ink-2);line-height:1.55;margin:0;padding:11px 14px;background:var(--bg);border-radius:9px;border-left:3px solid var(--gold)}
.mapadm-note strong{color:var(--green)}
.mapadm-field{display:flex;flex-direction:column;gap:7px}
.mapadm-field__label{font-size:12.5px;font-weight:600;color:var(--ink)}
.mapadm-field__hint{font-size:11.5px;color:var(--ink-3);line-height:1.4}
.mapadm-field input[type=range]{width:100%;accent-color:var(--green)}
.mapadm-modegrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:9px}
.mapadm-modebtn{text-align:left;border:1.5px solid var(--line);background:#fff;border-radius:10px;padding:10px 12px;cursor:pointer;font-family:var(--body);transition:.14s}
.mapadm-modebtn:hover{border-color:var(--ink-3)}
.mapadm-modebtn.is-on{border-color:var(--green);background:color-mix(in oklab,var(--green) 7%,#fff);box-shadow:0 0 0 1px var(--green)}
.mapadm-modebtn__label{display:block;font-size:14.5px;font-weight:600;color:var(--ink)}
.mapadm-modebtn__hint{display:block;font-size:11.5px;color:var(--ink-3);line-height:1.35;margin-top:2px}
.mapadm select,.mapadm input[type=time]{font-family:inherit;font-size:13px;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}
.mapadm-catgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.mapadm-catrow{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:11px;padding:11px}
.mapadm-catrow__badge{position:relative;flex-shrink:0;width:56px;height:56px;border-radius:50%;border:2px solid var(--c);overflow:hidden;background:var(--bg-2);padding:0;cursor:pointer}
.mapadm-catrow__badge img{width:100%;height:100%;object-fit:cover;display:block}
.mapadm-catrow__ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:9px;line-height:1.1;color:var(--ink-3);text-align:center;background:repeating-linear-gradient(45deg,var(--bg-2),var(--bg-2) 4px,#e3d9c2 4px,#e3d9c2 8px)}
.mapadm-catrow__badge-dot{position:absolute;bottom:0;right:0;width:16px;height:16px;border-radius:50%;background:var(--c);border:2px solid #fff}
.mapadm-catrow__body{flex:1;min-width:0}
.mapadm-catrow__name{width:100%;border:none;background:transparent;font-family:var(--title);font-size:18px;color:var(--ink);padding:0;border-bottom:1px solid transparent}
.mapadm-catrow__name:focus{outline:none;border-bottom-color:var(--line)}
.mapadm-catrow__meta{display:flex;align-items:center;gap:9px;margin-top:6px;flex-wrap:wrap}
.mapadm-catrow__meta input[type=color]{width:28px;height:28px;border:1px solid var(--line);border-radius:6px;background:none;padding:2px;cursor:pointer}
.mapadm-catrow__count{font-size:11px;color:var(--ink-3)}
.mapadm-tag{font-size:9.5px;letter-spacing:.05em;text-transform:uppercase;background:var(--bg-2);color:var(--ink-2);padding:2px 7px;border-radius:999px;font-weight:600}
.mapadm-tag--warn{background:#f3e2c2;color:#8a6a1f}
.mapadm-sched{display:flex;flex-direction:column;gap:12px}
.mapadm-sched__rule{border:1px solid var(--line);border-radius:11px;padding:12px;display:flex;flex-direction:column;gap:10px}
.mapadm-sched__time{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-3)}
.mapadm-sched__nota{border:none;border-bottom:1px solid var(--line);font-size:13px;padding:3px 0;background:transparent;color:var(--ink);font-family:inherit}
.mapadm-sched__nota:focus{outline:none;border-bottom-color:var(--green)}
.mapadm-x{margin-left:auto;border:none;background:var(--bg-2);width:26px;height:26px;border-radius:7px;color:var(--ink-2);font-size:16px;line-height:1;cursor:pointer}
.mapadm-x:hover{background:#f0d5cd;color:#b14a3a}
.mapadm-chiprow{display:flex;flex-wrap:wrap;gap:6px}
.mapadm-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;color:var(--ink-2);font-size:11.5px;padding:5px 11px;border-radius:999px;cursor:pointer;font-family:var(--body);transition:.14s}
.mapadm-chip__dot{width:9px;height:9px;border-radius:50%;background:var(--c)}
.mapadm-chip.is-on{border-color:var(--c);background:color-mix(in oklab,var(--c) 12%,#fff);color:var(--ink)}
.mapadm-btn{border:1px solid var(--green);background:var(--green);color:var(--bg);padding:9px 16px;border-radius:8px;font-size:13px;font-weight:500;font-family:var(--body);cursor:pointer;transition:.15s}
.mapadm-btn--ghost{background:transparent;color:var(--ink-2);border-color:var(--line)}
.mapadm-btn--ghost:hover{background:var(--bg);border-color:var(--ink-3)}
.mapadm-affinity{display:flex;flex-direction:column;gap:8px}
.mapadm-affinity__lbl{font-size:12.5px;font-weight:600;color:var(--ink)}
.mapadm-featgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px}
.mapadm-featrow{display:flex;align-items:center;gap:10px;width:100%;border:1px solid var(--line);background:#fff;border-radius:9px;padding:9px 12px;text-align:left;cursor:pointer;font-family:var(--body);transition:.14s}
.mapadm-featrow.is-on{border-color:var(--c);background:color-mix(in oklab,var(--c) 8%,#fff)}
.mapadm-featrow__dot{width:11px;height:11px;border-radius:50%;background:var(--c);flex-shrink:0}
.mapadm-featrow__name{flex:1;font-size:13.5px;color:var(--ink)}
.mapadm-featrow__star{font-size:17px;color:var(--c)}

/* ── Leyenda compacta en móvil / tablet vertical (una columna) ── */
@media (max-width: 720px){
  .leyenda{padding:14px 12px}
  .leyenda__hint{font-size:11px;margin:-3px 0 10px}
  .leyenda__grid{grid-template-columns:minmax(0,1fr);gap:7px}
  .leyenda__toggle{padding:7px 10px;gap:10px;border-radius:10px;align-items:center}
  .leyenda__amuleto{width:38px;height:38px}
  .leyenda__dot{width:11px;height:11px}
  .leyenda__name{font-size:15px;line-height:1.1}
  .leyenda__desc{font-size:11px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .leyenda__check{font-size:13px;width:12px}
}
@media (max-width: 380px){
  .leyenda__amuleto{width:34px;height:34px}
  .leyenda__toggle{padding:6px 8px;gap:8px}
  .leyenda__name{font-size:14px}
  .leyenda__desc{font-size:10.5px}
}

/* ───────────────────────────────────────────────────────────
 * Subvención · página de publicidad de la ayuda (NextGenerationEU)
 * ─────────────────────────────────────────────────────────── */
.subv__hero{--accent:#0a5cab}
.subv__emblem{display:flex;flex-direction:column;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;box-shadow:0 10px 30px rgba(31,26,20,.12);flex-shrink:0}
.subv__emblem svg{display:block}
.subv__emblem-txt{font-size:11.5px;line-height:1.25;color:var(--ink-2);text-align:center;max-width:150px}
.subv__emblem-txt strong{color:#0a5cab}

.subv__body{padding-bottom:24px}
.subv__lead{font-size:15px;line-height:1.6;color:var(--ink-2);max-width:760px;margin:0 0 26px}
.subv__lead strong{color:var(--ink)}
.subv__hashtag{display:inline-block;margin-left:6px;color:#0a5cab;font-weight:600}

.subv__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:28px}
.subv__block{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;padding:18px}
.subv__h{font-family:var(--title,"Cormorant Garamond",serif);font-weight:500;font-size:22px;color:var(--green);margin:0 0 10px}
.subv__block p{margin:0;font-size:14px;line-height:1.55;color:var(--ink-2)}
.subv__list{margin:0;padding-left:18px;font-size:14px;line-height:1.6;color:var(--ink-2)}
.subv__list li{margin-bottom:5px}

.subv__data{margin-bottom:28px}
.subv__dl{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:0}
.subv__dl-row{display:flex;flex-direction:column;gap:3px;padding:12px 16px;border-bottom:1px solid var(--line);background:#fff}
.subv__dl-row:nth-child(odd){border-right:1px solid var(--line)}
.subv__dl-row dt{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.subv__dl-row dd{margin:0;font-size:14.5px;color:var(--ink)}

.subv__cartel{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:center;background:var(--bg-2);border:1px solid var(--line);border-radius:14px;padding:22px;margin-bottom:26px}
.subv__cartel-text p{font-size:14px;line-height:1.55;color:var(--ink-2);margin:0 0 16px}
.subv__cartel-actions{display:flex;gap:10px;flex-wrap:wrap}
.subv__btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;color:var(--ink-2);padding:10px 16px;border-radius:9px;font-size:13.5px;font-weight:500;cursor:pointer;transition:.15s;text-decoration:none}
.subv__btn:hover{border-color:#0a5cab;color:#0a5cab}
.subv__btn--solid{background:#0a5cab;border-color:#0a5cab;color:#fff}
.subv__btn--solid:hover{background:#094f93;color:#fff}

/* Vista previa del cartel (reconstrucción fiel, clic → PDF) */
.subv-preview{display:flex;flex-direction:column;gap:0;border:none;background:none;padding:0;cursor:pointer;width:100%;text-align:left;border-radius:10px;overflow:hidden;box-shadow:0 12px 34px rgba(31,26,20,.18);transition:transform .18s,box-shadow .18s}
.subv-preview:hover{transform:translateY(-3px);box-shadow:0 18px 44px rgba(31,26,20,.24)}
.subv-preview__paper{background:#fff;padding:16px 16px 14px;aspect-ratio:1.414/1;display:flex;flex-direction:column}
.subv-preview__logos{display:flex;align-items:center;gap:8px;border-bottom:1px solid #eee;padding-bottom:9px;margin-bottom:10px}
.subv-preview__eu{flex-shrink:0}
.subv-preview__eu-txt{font-size:7.5px;line-height:1.2;color:#003399;font-weight:600}
.subv-preview__eu-txt em{font-style:normal;color:#444;font-weight:400}
.subv-preview__prtr{margin-left:auto;font-size:7.5px;line-height:1.2;color:#c00;font-weight:600;text-align:right}
.subv-preview__title{font-size:12px;font-weight:700;line-height:1.2;color:#1a1a1a;margin-bottom:3px}
.subv-preview__sub{font-size:9px;color:#666;margin-bottom:10px}
.subv-preview__rows{display:flex;flex-direction:column;gap:3px;font-size:9.5px;color:#222;margin-bottom:auto}
.subv-preview__rows b{font-weight:600}
.subv-preview__foot{display:flex;justify-content:space-between;gap:8px;font-size:7.5px;color:#888;font-style:italic;border-top:1px solid #eee;padding-top:8px;margin-top:10px}
.subv-preview__open{display:flex;align-items:center;justify-content:center;gap:7px;background:#0a5cab;color:#fff;font-size:12.5px;font-weight:500;padding:10px}

.subv__orgs{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;padding:18px 20px;border:1px dashed var(--line);border-radius:12px;background:#fff}
.subv__org{display:flex;align-items:center;gap:8px;font-size:10.5px;line-height:1.25;color:var(--ink-3);font-weight:600;text-transform:uppercase;letter-spacing:.04em}
.subv__org svg{flex-shrink:0}
.subv__org--txt{padding-left:0}

@media (max-width: 760px){
  .subv__grid{grid-template-columns:1fr}
  .subv__cartel{grid-template-columns:1fr}
  .subv-preview{max-width:340px;margin:0 auto;width:100%}
  .subv__dl{grid-template-columns:1fr}
  .subv__dl-row:nth-child(odd){border-right:none}
  .subv__emblem{flex-direction:row;max-width:none}
  .subv__emblem-txt{text-align:left;max-width:none}
}

/* ───────────────────────────────────────────────────────────
 * Gestor de visitas («Todos nosotros») — panel admin
 * ─────────────────────────────────────────────────────────── */
.nosotros__admin-tools{display:flex;justify-content:center;gap:10px;margin:0 0 16px;flex-wrap:wrap}
.nosotros__gear{border:1px solid var(--line);background:#fff;color:var(--ink-2);padding:7px 14px;border-radius:999px;font-size:13px;font-weight:500;cursor:pointer;transition:.15s}
.nosotros__gear:hover{border-color:var(--green);color:var(--green)}

.vmgr-overlay{position:fixed;inset:0;background:rgba(31,26,20,.55);z-index:1200;display:flex;align-items:center;justify-content:center;padding:18px}
.vmgr{background:var(--bg,#f5efe1);border-radius:14px;box-shadow:0 24px 70px rgba(0,0,0,.35);width:min(1060px,100%);max-height:92vh;display:flex;flex-direction:column;overflow:hidden}
.vmgr__head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:18px 20px 12px;border-bottom:1px solid var(--line)}
.vmgr__title{font-family:var(--title,"Cormorant Garamond",serif);font-weight:500;font-size:26px;margin:0;color:var(--ink)}
.vmgr__sub{font-size:12.5px;color:var(--ink-3);margin-top:2px}
.vmgr__busy{color:var(--green);font-weight:600;margin-left:8px}
.vmgr__head-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.vmgr__btn{border:1px solid var(--line);background:#fff;color:var(--ink-2);padding:8px 13px;border-radius:8px;font-size:12.5px;font-weight:500;cursor:pointer;transition:.14s;white-space:nowrap}
.vmgr__btn:hover{border-color:var(--green);color:var(--green)}
.vmgr__close{border:none;background:var(--bg-2,#ece4d0);width:34px;height:34px;border-radius:8px;font-size:20px;color:var(--ink-2);cursor:pointer;line-height:1}
.vmgr__close:hover{background:#e3cfc3;color:#a14a32}

.vmgr__tools{display:flex;gap:10px;padding:12px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.vmgr__search{flex:1;min-width:200px;border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink)}
.vmgr__sort{border:1px solid var(--line);border-radius:8px;padding:9px 10px;font-size:13px;font-family:inherit;background:#fff;color:var(--ink-2)}

.vmgr__bulk{display:flex;align-items:center;gap:7px;padding:10px 20px;background:var(--green,#1f4d3a);flex-wrap:wrap}
.vmgr__bulk-count{color:#fff;font-size:12.5px;font-weight:600;margin-right:6px}
.vmgr__bulk button{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:#fff;padding:6px 11px;border-radius:7px;font-size:12px;cursor:pointer;transition:.14s}
.vmgr__bulk button:hover{background:rgba(255,255,255,.25)}
.vmgr__bulk .vmgr__danger{border-color:#e8a18f;background:rgba(190,60,40,.45)}
.vmgr__bulk .vmgr__danger:hover{background:rgba(190,60,40,.7)}

.vmgr__tablewrap{overflow:auto;flex:1}
.vmgr__table{width:100%;border-collapse:collapse;font-size:13px}
.vmgr__table thead th{position:sticky;top:0;background:var(--bg-2,#ece4d0);text-align:left;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:600;padding:9px 10px;z-index:1}
.vmgr__table td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:middle;background:#fff}
.vmgr__table tr.is-sel td{background:#eef3e9}
.vmgr__table tr.is-hidden td{opacity:.45}
.vmgr__thumb{display:block;width:52px;height:38px;object-fit:cover;border-radius:6px;background:var(--bg-2)}
.vmgr__thumb--ph{background:repeating-linear-gradient(45deg,var(--bg-2),var(--bg-2) 5px,#e3d9c2 5px,#e3d9c2 10px)}
.vmgr__cell-title{min-width:230px}
.vmgr__input{width:100%;border:1px solid transparent;background:transparent;font-family:inherit;font-size:13.5px;color:var(--ink);padding:4px 6px;border-radius:6px}
.vmgr__input:hover{border-color:var(--line)}
.vmgr__input:focus{outline:none;border-color:var(--green);background:#fff}
.vmgr__input--sm{width:110px}
.vmgr__url{display:block;font-size:11px;color:var(--ink-3);text-decoration:none;padding:0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:300px}
.vmgr__url:hover{color:var(--green);text-decoration:underline}
.vmgr__url--missing{color:#b14a3a;font-style:italic}
.vmgr__date{border:1px solid var(--line);border-radius:7px;padding:5px 7px;font-family:inherit;font-size:12.5px;color:var(--ink);background:#fff}
.vmgr__state{white-space:nowrap}
.vmgr__flag{border:none;background:transparent;font-size:15px;cursor:pointer;opacity:.35;padding:3px 5px;transition:.14s}
.vmgr__flag.is-on{opacity:1}
.vmgr__flag:hover{opacity:.8}
.vmgr__del{border:none;background:transparent;font-size:14px;cursor:pointer;opacity:.5;padding:3px 5px}
.vmgr__del:hover{opacity:1}
.vmgr__empty{text-align:center;color:var(--ink-3);padding:26px;font-style:italic}
.vmgr__foot{padding:11px 20px;border-top:1px solid var(--line);font-size:11.5px;color:var(--ink-3);line-height:1.45}

/* RGPD: placeholder de miniatura externa hasta aceptar cookies */
.dedicatoria__thumb--consent{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1.5px dashed var(--line);background:var(--bg-2,#ece4d0);color:var(--ink-3);cursor:pointer;font-family:inherit;text-align:center;padding:10px}
.dedicatoria__thumb--consent span:first-child{font-size:12px;font-weight:600;color:var(--ink-2)}
.dedicatoria__thumb-consent-sub{font-size:10.5px}
.dedicatoria__thumb--consent:hover{border-color:var(--green);color:var(--green)}

/* ── Reproductor embebido (▶ Ver aquí) ── */
.dedicatoria__actions{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.dedicatoria__play{border:1px solid var(--accent,#1f4d3a);background:var(--accent,#1f4d3a);color:#fff;padding:6px 14px;border-radius:999px;font-size:12.5px;font-weight:600;cursor:pointer;transition:.15s;font-family:inherit}
.dedicatoria__play:hover{filter:brightness(1.15)}
.visit-embed{position:fixed;inset:0;background:rgba(31,26,20,.72);z-index:1300;display:flex;align-items:center;justify-content:center;padding:16px}
.visit-embed__box{background:#fff;border-radius:12px;overflow:hidden;width:min(560px,100%);max-height:92vh;display:flex;flex-direction:column;box-shadow:0 24px 70px rgba(0,0,0,.4)}
.visit-embed__bar{display:flex;align-items:center;gap:12px;padding:10px 14px;border-bottom:1px solid #eee}
.visit-embed__net{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--green,#1f4d3a)}
.visit-embed__ext{margin-left:auto;font-size:12px;color:var(--ink-3,#8a7e6a);text-decoration:none}
.visit-embed__ext:hover{color:var(--green,#1f4d3a);text-decoration:underline}
.visit-embed__close{border:none;background:#f1ece0;width:30px;height:30px;border-radius:7px;font-size:18px;line-height:1;color:#4a4136;cursor:pointer}
.visit-embed__close:hover{background:#e3cfc3;color:#a14a32}
.visit-embed__frame{position:relative;width:100%;overflow:hidden;background:#000;max-height:72vh}
.visit-embed__frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.visit-embed__note{padding:8px 14px;font-size:10.5px;color:#9a8f7a;text-align:center}

/* ── Gestor: editar imagen + enlaces rotos ── */
.vmgr__thumbbtn{position:relative;border:none;background:none;padding:0;cursor:pointer;display:block;border-radius:6px}
.vmgr__thumbbtn:hover .vmgr__thumb{outline:2px solid var(--green,#1f4d3a)}
.vmgr__thumb-edit{position:absolute;right:-5px;bottom:-5px;width:18px;height:18px;border-radius:50%;background:var(--green,#1f4d3a);color:#fff;font-size:10px;display:flex;align-items:center;justify-content:center;opacity:0;transition:.14s}
.vmgr__thumbbtn:hover .vmgr__thumb-edit{opacity:1}
/* Miniatura con herramientas inline (🔄 regenerar / ✎ cambiar) */
.vmgr__thumbwrap{position:relative;width:52px;height:38px;border-radius:6px}
.vmgr__thumb--ph{display:flex;align-items:center;justify-content:center;color:#b3501f;font-size:15px}
.vmgr__thumbwrap.is-broken .vmgr__thumb--ph{background:#f7ece2;outline:1px dashed #d9a888}
.vmgr__thumb-tools{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:4px;opacity:0;transition:.14s;background:rgba(20,28,22,.34);border-radius:6px}
.vmgr__thumbwrap:hover .vmgr__thumb-tools,.vmgr__thumbwrap.is-broken .vmgr__thumb-tools{opacity:1}
.vmgr__thumb-tool{width:21px;height:21px;border:none;border-radius:50%;background:#fff;color:var(--green,#1f4d3a);font-size:11px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.vmgr__thumb-tool:hover{background:var(--green,#1f4d3a);color:#fff}
.vmgr__broken{color:#b3501f;font-size:13px;margin-right:4px;cursor:help}
.vmgr__clicks{text-align:center;white-space:nowrap}
.vmgr__clicks-n{display:inline-block;min-width:30px;background:var(--green,#1f4d3a);color:#fff;font-size:12px;font-weight:700;padding:3px 9px;border-radius:999px}
.vmgr__clicks-zero{color:var(--ink-3);font-size:12px}

/* Fila expandida del gestor: enlace + descripción + regenerar */
.vmgr__exprow td{background:var(--bg,#f5efe1) !important;padding:14px 16px}
.vmgr__exp{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
.vmgr__exp-field{display:flex;flex-direction:column;gap:5px}
.vmgr__exp-field>span{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.vmgr__exp-input{border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-family:inherit;font-size:13px;color:var(--ink);background:#fff;width:100%;resize:vertical}
.vmgr__exp-input:focus{outline:none;border-color:var(--green)}
.vmgr__exp-warn{font-size:11.5px;color:#b3501f;font-style:normal}
.vmgr__exp-actions{display:flex;gap:8px;flex-wrap:wrap;grid-column:1 / -1}
@media (max-width:700px){ .vmgr__exp{grid-template-columns:1fr} }

/* Botón ✎ de editar enlace en la tarjeta (modo admin) */
.dedicatoria__editurl{border:1px dashed var(--line);background:transparent;color:var(--ink-3);width:26px;height:26px;border-radius:50%;font-size:12px;cursor:pointer;transition:.14s;line-height:1}
.dedicatoria__editurl:hover{border-color:var(--green);color:var(--green)}

/* ── Modo embed (?embed=mapa): editor enfocado para el panel admin ── */
body.pd-embed--mapa .topnav,
body.pd-embed--mapa footer,
body.pd-embed--mapa main > *:not(#mapa){display:none !important}
body.pd-embed--mapa #mapa{padding-top:18px;min-height:auto}
body.pd-embed--mapa #mapa .chapter-badge{opacity:1 !important;transform:none !important}
body.pd-embed{background:var(--bg)}

/* ── Modo «estás aquí» (QR físicos → ?aqui=<punto>) ───────── */
.mapa__aqui{position:absolute;transform:translate(-50%,-50%);z-index:6;pointer-events:none}
.mapa__aqui-ring{display:block;width:46px;height:46px;border-radius:50%;border:3px solid #1f4d3a;box-shadow:0 0 0 3px rgba(245,239,225,.85), inset 0 0 0 2px rgba(245,239,225,.85);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
@media (prefers-reduced-motion: no-preference){
  .mapa__aqui-ring{animation:aquiPulse 2s ease-out infinite}
  @keyframes aquiPulse{0%{box-shadow:0 0 0 3px rgba(245,239,225,.85),0 0 0 0 rgba(31,77,58,.45)}70%{box-shadow:0 0 0 3px rgba(245,239,225,.85),0 0 0 16px rgba(31,77,58,0)}100%{box-shadow:0 0 0 3px rgba(245,239,225,.85),0 0 0 0 rgba(31,77,58,0)}}
}
.mapa__aqui-lbl{position:absolute;left:50%;top:-34px;transform:translateX(-50%);background:#1f4d3a;color:#f5efe1;font-size:12px;font-weight:700;letter-spacing:.04em;padding:4px 11px;border-radius:999px;white-space:nowrap;box-shadow:0 3px 10px rgba(0,0,0,.25)}
.mapa__aqui-lbl::after{content:"";position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);border:5px solid transparent;border-top-color:#1f4d3a;border-bottom:none}
.mapa-cerca{margin:14px auto 0;max-width:760px;background:#fff;border:1.5px solid #1f4d3a;border-radius:14px;padding:13px 16px;box-shadow:0 6px 24px rgba(31,77,58,.12)}
.mapa-cerca__head{display:flex;align-items:center;gap:10px;font-size:14.5px;color:var(--ink)}
.mapa-cerca__head strong{color:#1f4d3a}
.mapa-cerca__beacon{width:11px;height:11px;border-radius:50%;background:#1f4d3a;flex:0 0 auto;box-shadow:0 0 0 3px rgba(31,77,58,.2)}
.mapa-cerca__ver{margin-left:auto;border:1px solid #1f4d3a;background:transparent;color:#1f4d3a;border-radius:999px;padding:4px 12px;font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.mapa-cerca__ver:hover{background:#1f4d3a;color:#f5efe1}
.mapa-cerca__x{flex:0 0 auto;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink-3);font-size:16px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.mapa-cerca__ver + .mapa-cerca__x{margin-left:0}
.mapa-cerca__head > span:first-of-type + span{min-width:0}
.mapa-cerca__x:hover{border-color:#7a3e2a;color:#7a3e2a}
.mapa-cerca__hint{font-size:12px;color:var(--ink-3);margin:10px 0 6px;font-style:italic}
.mapa-cerca__chips{display:flex;flex-wrap:wrap;gap:8px}
.mapa-cerca__chip{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--cat,#888);background:#fff;color:var(--ink);border-radius:999px;padding:6px 13px;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;transition:.13s}
.mapa-cerca__chip:hover{background:var(--cat,#888);color:#fff}
.mapa-cerca__chip-dot{width:9px;height:9px;border-radius:50%;background:var(--cat,#888);flex:0 0 auto}
.mapa-cerca__chip:hover .mapa-cerca__chip-dot{background:#fff}
@media (max-width:720px){
  .mapa-cerca{margin-left:4px;margin-right:4px;padding:11px 12px}
  .mapa-cerca__head{flex-wrap:wrap;font-size:13.5px}
}

/* ── Accesibilidad ───────────────────────────────────── */
:focus-visible{outline:3px solid #1f4d3a;outline-offset:2px;border-radius:4px}
.skip-link{position:fixed;top:-60px;left:14px;z-index:9000;background:#1f4d3a;color:#f5efe1;padding:9px 16px;border-radius:0 0 10px 10px;font-weight:700;font-size:14px;text-decoration:none;transition:top .15s}
.skip-link:focus{top:0}
.pd-empty-hint{font-style:italic;color:var(--ink-3);border:1.5px dashed var(--line);border-radius:10px;padding:12px 14px;font-size:14px}

/* Barra admin de las fichas: mover de categoría / añadir talleres */
.pdadm-grupobar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:rgba(31,77,58,.06);border:1.5px dashed rgba(31,77,58,.35);border-radius:11px;padding:9px 13px;margin:0 0 16px}
.pdadm-grupobar__lbl{font-size:12.5px;font-weight:700;color:#1f4d3a}
.pdadm-grupobar select{border:1px solid var(--line);border-radius:8px;padding:6px 9px;font-family:inherit;font-size:13px;color:var(--ink);background:#fff;max-width:260px}
.pdadm-grupobar__hint{font-size:11.5px;color:var(--ink-3);font-style:italic}
.tema-taller-wrap{display:flex;flex-direction:column;gap:0}
.tema-taller__adminrow{display:flex;gap:7px;justify-content:flex-end;padding:6px 4px 0}
.tema-taller__adminrow button{border:1px solid var(--line);background:#fff;color:var(--ink-2,var(--ink));border-radius:7px;padding:3px 10px;font-family:inherit;font-size:12px;cursor:pointer}
.tema-taller__adminrow button:hover:not(:disabled){border-color:var(--green);color:var(--green)}
.tema-taller__adminrow button:disabled{opacity:.4;cursor:default}
.tema-taller__adminrow button.is-danger:hover{border-color:#a33;color:#a33}

/* ── Capítulo VII · Espacios ─────────────────────────────── */
.esp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:6px}
.esp-card{position:relative;display:flex;flex-direction:column;text-align:left;border:1.5px solid var(--line);border-radius:14px;background:#fff;cursor:pointer;padding:0;overflow:hidden;font-family:inherit;transition:transform .15s, box-shadow .15s, border-color .15s}
.esp-card:hover{transform:translateY(-3px);box-shadow:0 10px 28px rgba(31,26,20,.13);border-color:var(--accent,#888)}
.esp-card__media{height:110px;background:linear-gradient(150deg, color-mix(in srgb, var(--accent,#3d6b4a) 22%, #fff), color-mix(in srgb, var(--accent,#3d6b4a) 8%, #fff));display:flex;align-items:center;justify-content:center;overflow:hidden}
.esp-card__media img{width:100%;height:100%;object-fit:cover}
.esp-card__initial{font-family:var(--title-font);font-size:44px;color:var(--accent,#3d6b4a);opacity:.65}
.esp-card__body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:4px}
.esp-card__body h3{margin:0;font-family:var(--title-font);font-size:19px;color:var(--ink)}
.esp-card__body p{margin:0;font-size:13px;color:var(--ink-3);line-height:1.4}
.esp-card__vinc{font-size:11px;color:var(--accent,#3d6b4a);font-weight:600}
.esp-card__go{margin-top:4px;font-size:12.5px;font-weight:600;color:var(--accent,#3d6b4a);display:inline-flex;align-items:center;gap:5px}
.admin-add-tile--esp{min-height:180px;border-radius:14px}

/* Chips de espacios vinculados (en ficha de espacio y de evento) */
.esp-vinc-grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.esp-vinc-wrap{display:inline-flex;align-items:center;gap:5px}
.esp-vinc-chip{display:inline-flex;align-items:center;gap:9px;border:1.5px solid var(--accent,#888);background:#fff;color:var(--ink);border-radius:999px;padding:8px 16px;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer;transition:.13s}
.esp-vinc-chip:hover{background:var(--accent,#888);color:#fff}
.esp-vinc-chip__dot{width:10px;height:10px;border-radius:50%;background:var(--accent,#888);flex:0 0 auto}
.esp-vinc-chip:hover .esp-vinc-chip__dot{background:#fff}
.esp-vinc-chip__go{opacity:.6}
.esp-vinc-quitar{width:26px;height:26px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink-3);cursor:pointer;font-size:15px;line-height:1;display:inline-flex;align-items:center;justify-content:center;padding:0}
.esp-vinc-quitar:hover{border-color:#a33;color:#a33}

/* ── Capítulo XI · Diario ────────────────────────────────── */
.diario-timeline{max-width:780px;margin:0 auto}
.diario-mes__head{display:flex;align-items:center;gap:14px;margin:34px 0 18px}
.diario-mes__line{flex:1;height:1px;background:var(--line)}
.diario-mes__title{margin:0;font-family:var(--title-font);font-size:21px;color:var(--ink-2,var(--ink));font-style:italic}
.diario-mes__items{display:flex;flex-direction:column;gap:16px}
.diario-card{position:relative;background:#fff;border:1.5px solid var(--line);border-left:4px solid var(--accent,#888);border-radius:12px;padding:14px 18px 20px;transition:box-shadow .15s}
.diario-card:hover{box-shadow:0 8px 24px rgba(31,26,20,.10)}
.diario-card--pendiente{border-style:dashed;background:rgba(138,90,24,.05)}
.diario-card--oculta{opacity:.55}
.diario-card__meta{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:7px}
.diario-card__fecha{font-size:12px;color:var(--ink-3);font-style:italic}
.diario-card__badge{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent,#888);border:1px solid color-mix(in srgb, var(--accent,#888) 45%, transparent);border-radius:999px;padding:2px 9px;background:color-mix(in srgb, var(--accent,#888) 7%, #fff)}
.diario-card__tab{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8a5a18;border:1px solid rgba(138,90,24,.4);border-radius:999px;padding:2px 9px}
.diario-card__estado{font-size:11.5px;color:#8a5a18;font-weight:600}
.diario-card__main{display:flex;gap:16px;align-items:flex-start}
.diario-card__thumb{flex:0 0 132px;width:132px;height:132px;border-radius:10px;overflow:hidden;border:1px solid var(--line);padding:0;background:none;cursor:pointer}
.diario-card__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.diario-card__texts{flex:1;min-width:0}
.diario-card__title{margin:0 0 5px;font-family:var(--title-font);font-size:20px;line-height:1.25}
.diario-card__title button{all:unset;cursor:pointer;color:var(--ink)}
.diario-card__title button:hover{color:var(--accent,#888)}
.diario-card__excerpt{margin:0;font-size:14px;line-height:1.55;color:var(--ink-2,var(--ink));text-wrap:pretty}
.diario-card__foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:9px}
.diario-card__go{all:unset;cursor:pointer;font-size:13px;font-weight:600;color:var(--accent,#888)}
.diario-card__go:hover{text-decoration:underline}
.diario-card__adminrow{display:inline-flex;gap:7px;margin-left:auto}
.diario-card__full{margin-top:8px}
.diario-admbtn{border:1px solid var(--line);background:#fff;color:var(--ink-2,var(--ink));border-radius:7px;padding:4px 11px;font-family:inherit;font-size:12px;cursor:pointer}
.diario-admbtn:hover{border-color:var(--green);color:var(--green)}
.diario-admbtn.is-on{background:var(--green);border-color:var(--green);color:#f5efe1}
.diario-admbtn--ok{border-color:var(--green);color:var(--green);font-weight:700}
.diario-vacio{text-align:center;color:var(--ink-3);font-style:italic;font-size:15px;margin:30px 0}
.diario-mas{text-align:center;margin-top:26px}
.diario-adm__pendbadge{margin-left:auto;background:#8a5a18;color:#fff;font-size:11.5px;font-weight:700;border-radius:999px;padding:3px 11px}
.diario-adm__fuente{display:flex;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px dashed var(--line)}
.diario-adm__fuente-dot{width:10px;height:10px;border-radius:50%;background:var(--accent,#888);flex:0 0 auto}
.diario-adm__fuente-name{font-size:13.5px;font-weight:600;flex:1}
.diario-adm__fuente-modos{display:flex;gap:6px}
.diario-adm__input,.diario-adm__textarea{width:100%;border:1px solid var(--line);border-radius:9px;padding:9px 12px;font-family:inherit;font-size:14px;color:var(--ink);background:#fff;box-sizing:border-box}
.diario-adm__textarea{resize:vertical}
.diario-ia__row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.diario-ia__form{display:flex;flex-direction:column;gap:8px;border:1.5px dashed var(--line);border-radius:11px;padding:12px}
.diario-ia__lbl{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.diario-ia__det summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--ink-2,var(--ink));padding:4px 0}
.diario-ia__borrador{display:flex;flex-direction:column;gap:8px;border:1.5px solid var(--green);border-radius:11px;padding:12px;background:rgba(31,77,58,.04)}
.diario-redes__estado{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.diario-redes__conectar{display:flex;flex-direction:column;gap:8px}
.diario-redes__guia{font-size:13px;line-height:1.6;padding-left:18px;margin:8px 0}
.diario-redes__guia code{background:rgba(31,26,20,.07);border-radius:4px;padding:0 4px;font-size:12px}
.diario-redes__pub{display:flex;flex-direction:column;gap:8px;border-top:1px dashed var(--line);padding-top:14px;margin-top:6px}
.diario-redes__preview{max-width:200px;max-height:140px;border-radius:8px;border:1px solid var(--line);object-fit:cover}
.diario-redes__dest{display:inline-flex;align-items:center;gap:6px;font-size:13.5px}
@media (max-width:640px){
  /* Móvil: como un post de Instagram — foto arriba a sangre, texto debajo */
  .diario-card{padding:0 0 22px}
  .diario-card__main{flex-direction:column;gap:0}
  .diario-card__thumb{order:-1;width:100%;height:210px;flex-basis:auto;border-radius:8px 8px 0 0;border:none;border-bottom:1px solid var(--line)}
  .diario-card__meta{padding:12px 16px 0}
  .diario-card__texts{padding:0 16px}
  .diario-card__pins{right:12px}
}

/* Pines del borde inferior: redes publicadas + compartir */
.diario-card__pins{position:absolute;bottom:-15px;right:16px;display:flex;gap:7px;align-items:center;z-index:2}
.diario-pin{position:relative;display:inline-flex}
.diario-pin__btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#fff;border:1.5px solid var(--accent,#888);color:var(--accent,#888);box-shadow:0 2px 8px rgba(31,26,20,.14);cursor:pointer;padding:0;transition:.13s}
a.diario-pin{text-decoration:none}
.diario-pin__btn:hover{background:var(--accent,#888);color:#fff}
.diario-pin__btn--share{border-color:#1f4d3a;color:#1f4d3a;width:32px;height:32px}
.diario-pin__btn--share:hover{background:#1f4d3a;color:#f5efe1}
button.diario-pin__btn{font-family:inherit}
.diario-share__pop{position:absolute;bottom:38px;right:0;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(31,26,20,.2);display:flex;flex-direction:column;min-width:150px;overflow:hidden;z-index:5}
.diario-share__pop a,.diario-share__pop button{all:unset;cursor:pointer;padding:9px 14px;font-size:13.5px;color:var(--ink);font-family:inherit;text-align:left;box-sizing:border-box;width:100%}
.diario-share__pop a:hover,.diario-share__pop button:hover{background:rgba(31,77,58,.08)}

/* Editor admin de pines de redes (añadir/editar/quitar enlaces) */
.diario-pin__btn--add{border-style:dashed;font-size:17px;line-height:1;color:#1f4d3a;border-color:#1f4d3a}
.diario-pin__btn--add:hover{background:#1f4d3a;color:#f5efe1}
.diario-redpop{min-width:240px;padding:10px;gap:7px}
.diario-redpop__title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-3);padding:0 2px}
.diario-redpop__field{border:1px solid var(--line);border-radius:8px;padding:7px 9px;font-family:inherit;font-size:13px;color:var(--ink);background:#fff;width:100%;box-sizing:border-box}
.diario-redpop__row{display:flex;gap:6px;flex-wrap:wrap}
/* El pop de compartir resetea a/button (all:unset); aquí lo restauramos con
   más especificidad para que los botones del editor se vean como botones. */
.diario-redpop .diario-redpop__row button.diario-admbtn{all:revert;border:1px solid var(--line);background:#fff;color:var(--ink-2,var(--ink));border-radius:7px;padding:5px 10px;font-family:inherit;font-size:12px;cursor:pointer;width:auto}
.diario-redpop .diario-redpop__row button.diario-admbtn:hover{border-color:var(--green);color:var(--green)}
.diario-redpop .diario-redpop__row button.diario-admbtn--ok{border-color:var(--green);color:var(--green);font-weight:700}
.diario-redpop .diario-redpop__row button.diario-admbtn--no{border-color:#a33;color:#a33}
.diario-redpop .diario-redpop__row button.diario-admbtn--no:hover{background:#a33;color:#fff}
.diario-redpop__test{font-size:12.5px;color:#1f4d3a;text-decoration:underline;padding:0 2px}
.diario-redpop a.diario-redpop__test{all:revert;font-family:inherit;font-size:12.5px;color:#1f4d3a;padding:0 2px}
.diario-admbtn--no{border-color:#a33;color:#a33}
.diario-admbtn--no:hover{background:#a33;color:#fff}

/* «+N más» por mes y botón del muro */
.diario-mes__mas{all:unset;cursor:pointer;display:block;margin:14px auto 0;font-size:13.5px;font-weight:600;color:var(--green);font-style:italic;font-family:inherit}
.diario-mes__mas:hover{text-decoration:underline}
.diario-abrir{display:flex;justify-content:center;margin-top:34px}
.diario-abrir__btn{display:inline-flex;align-items:center;gap:14px;border:2px solid var(--green);background:#fff;border-radius:14px;padding:14px 22px;cursor:pointer;font-family:inherit;transition:.15s;box-shadow:0 6px 20px rgba(31,77,58,.10)}
.diario-abrir__btn:hover{background:var(--green);color:#f5efe1;transform:translateY(-2px)}
.diario-abrir__btn:hover small{color:rgba(245,239,225,.8)}
.diario-abrir__btn:hover strong{color:#f5efe1}
.diario-abrir__icon{font-size:24px}
.diario-abrir__btn span:nth-child(2){display:flex;flex-direction:column;text-align:left;gap:1px}
.diario-abrir__btn strong{font-family:var(--title-font);font-size:18px;color:var(--ink)}
.diario-abrir__btn small{font-size:12px;color:var(--ink-3)}
.diario-abrir__arrow{font-size:18px}

/* Muro completo (overlay) */
.diario-muro{position:fixed;inset:0;z-index:5000;background:var(--bg,#f5efe1);display:flex;flex-direction:column}
.diario-muro__head{display:flex;align-items:center;gap:16px;padding:16px 26px;border-bottom:1px solid var(--line);background:#fff}
.diario-muro__eyebrow{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.diario-muro__title h2{margin:0;font-family:var(--title-font);font-size:26px;color:var(--ink)}
.diario-muro__close{margin-left:auto;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);background:#fff;color:var(--ink-2,var(--ink));font-size:22px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;flex:0 0 auto}
.diario-muro__close:hover{border-color:#7a3e2a;color:#7a3e2a}
.diario-muro__meses{display:flex;gap:8px;flex-wrap:wrap;padding:12px 26px;border-bottom:1px solid var(--line);background:#fff}
.diario-muro__mes-chip{border:1px solid var(--line);background:transparent;border-radius:999px;padding:5px 13px;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2,var(--ink));cursor:pointer}
.diario-muro__mes-chip:hover{border-color:var(--green);color:var(--green)}
.diario-muro__mes-chip small{color:var(--ink-3);font-weight:400}
.diario-muro__body{flex:1;overflow-y:auto;padding:10px 26px 50px}
.diario-muro__body .diario-mes{max-width:780px;margin:0 auto}
.diario-card-destacada .diario-card{border-color:var(--green);box-shadow:0 0 0 3px rgba(31,77,58,.18)}
@media (max-width:640px){
  .diario-muro__head{padding:12px 14px}
  .diario-muro__meses{padding:10px 14px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .diario-muro__meses::-webkit-scrollbar{display:none}
  .diario-muro__mes-chip{flex:0 0 auto;white-space:nowrap}
  .diario-muro__body{padding:8px 12px 40px}
}

/* Capítulo Lúdico: notas de zona (debajo de las tarjetas, editables) */
.ludico-zone__notarow{display:flex;align-items:flex-start;justify-content:center;gap:9px;max-width:700px;margin:16px auto 4px}
.ludico-zone__nota{margin:0;text-align:center;font-style:italic;color:var(--ink-2,var(--ink));font-size:15px;line-height:1.55;text-wrap:pretty}
.ludico-zone__nota-edit{flex:0 0 auto;width:28px;height:28px;border-radius:50%;border:1.5px dashed rgba(31,77,58,.5);background:transparent;color:#1f4d3a;cursor:pointer;font-size:13px;line-height:1;display:inline-flex;align-items:center;justify-content:center;padding:0}
.ludico-zone__nota-edit:hover{background:rgba(31,77,58,.08)}

/* Tarjetas de Eventos — glamurosas: degradado por color propio + destello */
.cumple-card--evento{position:relative;overflow:hidden;border:1.5px solid color-mix(in srgb, var(--accent) 50%, #fff);background:linear-gradient(150deg, color-mix(in srgb, var(--accent) 17%, #fff) 0%, #fffdf8 44%, color-mix(in srgb, var(--accent) 10%, #fff) 100%)}
.cumple-card--evento::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg, transparent 32%, rgba(255,255,255,.6) 46%, transparent 58%);transform:translateX(-110%)}
.cumple-card--evento::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.75;background:
  radial-gradient(3px 3px at 16% 24%, color-mix(in srgb, var(--accent) 75%, #fff), transparent 65%),
  radial-gradient(2.5px 2.5px at 80% 18%, color-mix(in srgb, var(--accent) 60%, #fff), transparent 65%),
  radial-gradient(2px 2px at 64% 64%, color-mix(in srgb, var(--accent) 70%, #fff), transparent 65%),
  radial-gradient(2.5px 2.5px at 28% 78%, color-mix(in srgb, var(--accent) 55%, #fff), transparent 65%),
  radial-gradient(2px 2px at 88% 82%, color-mix(in srgb, var(--accent) 65%, #fff), transparent 65%)}
@media (prefers-reduced-motion: no-preference){
  .cumple-card--evento::before{animation:eventoSheen 6s ease-in-out infinite}
  .cumple-card--evento::after{animation:eventoFloat 6.5s ease-in-out infinite alternate}
  @keyframes eventoSheen{0%,58%{transform:translateX(-110%)}88%,100%{transform:translateX(110%)}}
  @keyframes eventoFloat{from{transform:translateY(2px)}to{transform:translateY(-5px)}}
}
.cumple-card--evento .cumple-card__eyebrow{color:var(--accent);font-weight:700;letter-spacing:.14em}

/* Tarjetas de cumpleaños/eventos: imagen de portada subible (fase H) */
.cumple-card__art img{width:84px;height:84px;border-radius:50%;object-fit:cover;box-shadow:0 4px 14px rgba(31,26,20,.18);border:2.5px solid #fff}

/* Decoraciones animadas de tarjetas — sutiles, detrás del contenido */
.cumple-card{position:relative;overflow:hidden}
.cumple-card > *:not(.evento-hojas):not(.cumple-globos){position:relative;z-index:1}
.evento-hojas,.cumple-globos{position:absolute;inset:0;pointer-events:none;z-index:0}

/* Eventos: hojas que caen meciéndose, del color de cada tarjeta */
.evento-hojas i{position:absolute;top:-8%;width:10px;height:10px;background:color-mix(in srgb, var(--accent) 55%, #fff);border-radius:0 65% 0 65%;opacity:.4}
.evento-hojas i:nth-child(1){left:12%}
.evento-hojas i:nth-child(2){left:32%;width:8px;height:8px;opacity:.3}
.evento-hojas i:nth-child(3){left:55%}
.evento-hojas i:nth-child(4){left:72%;width:7px;height:7px;opacity:.32}
.evento-hojas i:nth-child(5){left:88%;width:9px;height:9px}
@media (prefers-reduced-motion: no-preference){
  .evento-hojas i{animation:hojaCae 11s linear infinite}
  .evento-hojas i:nth-child(2){animation-duration:14s;animation-delay:-4s}
  .evento-hojas i:nth-child(3){animation-duration:9.5s;animation-delay:-7s}
  .evento-hojas i:nth-child(4){animation-duration:13s;animation-delay:-2s}
  .evento-hojas i:nth-child(5){animation-duration:10.5s;animation-delay:-9s}
  @keyframes hojaCae{
    0%{transform:translateY(-20px) translateX(0) rotate(0deg)}
    25%{transform:translateY(85px) translateX(14px) rotate(95deg)}
    50%{transform:translateY(190px) translateX(-10px) rotate(185deg)}
    75%{transform:translateY(295px) translateX(12px) rotate(275deg)}
    100%{transform:translateY(420px) translateX(-6px) rotate(360deg)}
  }
}
@media (prefers-reduced-motion: reduce){
  .evento-hojas i:nth-child(1){top:22%}.evento-hojas i:nth-child(2){top:58%}.evento-hojas i:nth-child(3){top:38%}.evento-hojas i:nth-child(4){top:74%}.evento-hojas i:nth-child(5){top:50%}
}

/* Cumpleaños: globos de colores que suben y, al llegar arriba, ¡pum! */
.cumple-globos i{position:absolute;bottom:-14%;width:11px;height:13px;border-radius:50% 50% 50% 50%/56% 56% 44% 44%;opacity:.38}
.cumple-globos i::after{content:"";position:absolute;left:50%;top:100%;width:1px;height:7px;background:rgba(0,0,0,.18)}
.cumple-globos i:nth-child(1){left:14%;background:#e2756b}
.cumple-globos i:nth-child(2){left:34%;background:#6ba3e2;width:9px;height:11px}
.cumple-globos i:nth-child(3){left:54%;background:#e2c46b}
.cumple-globos i:nth-child(4){left:71%;background:#7bc47f;width:8px;height:10px}
.cumple-globos i:nth-child(5){left:87%;background:#b07be2}
@media (prefers-reduced-motion: no-preference){
  .cumple-globos i{animation:globoSube 9s ease-in infinite}
  .cumple-globos i:nth-child(2){animation-duration:12s;animation-delay:-5s}
  .cumple-globos i:nth-child(3){animation-duration:8s;animation-delay:-2.5s}
  .cumple-globos i:nth-child(4){animation-duration:11s;animation-delay:-8s}
  .cumple-globos i:nth-child(5){animation-duration:10s;animation-delay:-4s}
  @keyframes globoSube{
    0%{transform:translateY(20px) translateX(0) scale(1);opacity:.38}
    60%{transform:translateY(-230px) translateX(8px) scale(1);opacity:.38}
    88%{transform:translateY(-345px) translateX(-5px) scale(1);opacity:.34}
    93%{transform:translateY(-370px) translateX(-5px) scale(1.45);opacity:.5}
    100%{transform:translateY(-375px) translateX(-5px) scale(1.7);opacity:0}
  }
}
@media (prefers-reduced-motion: reduce){
  .cumple-globos i:nth-child(1){bottom:18%}.cumple-globos i:nth-child(2){bottom:52%}.cumple-globos i:nth-child(3){bottom:30%}.cumple-globos i:nth-child(4){bottom:66%}.cumple-globos i:nth-child(5){bottom:42%}
}

/* Ficha de evento: marco con halo «neón» del color del evento */
.detail--evento::after{content:"";position:fixed;inset:9px;border-radius:16px;border:2px solid color-mix(in srgb, var(--accent) 72%, #fff);box-shadow:0 0 12px color-mix(in srgb, var(--accent) 55%, transparent), inset 0 0 12px color-mix(in srgb, var(--accent) 32%, transparent);pointer-events:none;z-index:60;opacity:.8}
@media (prefers-reduced-motion: no-preference){
  .detail--evento::after{animation:neonMarco 3.2s ease-in-out infinite alternate}
  @keyframes neonMarco{
    from{opacity:.55;box-shadow:0 0 8px color-mix(in srgb, var(--accent) 45%, transparent), inset 0 0 8px color-mix(in srgb, var(--accent) 22%, transparent)}
    to{opacity:.95;box-shadow:0 0 18px color-mix(in srgb, var(--accent) 70%, transparent), inset 0 0 16px color-mix(in srgb, var(--accent) 40%, transparent)}
  }
}

/* ── Buscador global ─────────────────────────────────────── */
.topnav__search{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--ink-2,var(--ink));cursor:pointer;flex:0 0 auto;transition:.15s;padding:0}
.topnav__search:hover{border-color:var(--green);color:var(--green)}
.topnav__drawer-link--search{border-bottom:1px dashed var(--line)}
.bsc-overlay{position:fixed;inset:0;z-index:6000;background:rgba(31,26,20,.45);backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;padding:11vh 16px 16px}
.bsc-panel{width:min(620px,100%);background:var(--bg,#f5efe1);border:1px solid var(--line);border-radius:16px;box-shadow:0 28px 90px rgba(0,0,0,.4);overflow:hidden;display:flex;flex-direction:column}
.bsc-inputrow{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line)}
.bsc-lupa{color:var(--ink-3);display:inline-flex;flex:0 0 auto}
.bsc-input{flex:1;border:none;background:transparent;font-family:inherit;font-size:16.5px;color:var(--ink);outline:none;min-width:0}
.bsc-input::placeholder{color:var(--ink-3);opacity:.75}
.bsc-close{flex:0 0 auto;width:28px;height:28px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink-3);font-size:17px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0}
.bsc-close:hover{border-color:var(--green);color:var(--green)}
.bsc-results{max-height:min(52vh,430px);overflow-y:auto;padding:6px 0}
.bsc-grouplabel{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);padding:8px 16px 4px}
.bsc-item{display:flex;align-items:center;gap:11px;padding:9px 16px;cursor:pointer}
.bsc-item.is-sel{background:rgba(31,77,58,.09)}
.bsc-item__main{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.bsc-item__title{font-size:14.5px;color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bsc-item__title mark{background:rgba(31,77,58,.18);color:inherit;border-radius:3px;padding:0 1px}
.bsc-item__snippet{font-size:12px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bsc-item__go{color:var(--ink-3);font-size:12px;opacity:0;flex:0 0 auto}
.bsc-item.is-sel .bsc-item__go{opacity:.7}
.bsc-badge{flex:0 0 auto;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:999px;border:1px solid var(--line);color:var(--ink-3);background:#fff;min-width:72px;text-align:center}
.bsc-badge--habitante{color:#1f4d3a;border-color:rgba(31,77,58,.35)}
.bsc-badge--tematica{color:#7a3e2a;border-color:rgba(122,62,42,.35)}
.bsc-badge--taller{color:#8a5a18;border-color:rgba(138,90,24,.35)}
.bsc-badge--botanica{color:#a64d6d;border-color:rgba(166,77,109,.35)}
.bsc-badge--mapa{color:#2a5f8a;border-color:rgba(42,95,138,.35)}
.bsc-empty{padding:26px 16px;text-align:center;color:var(--ink-3);font-size:14px}
.bsc-hints{display:flex;gap:16px;justify-content:center;padding:9px 14px;border-top:1px solid var(--line);font-size:11.5px;color:var(--ink-3)}
.bsc-hints kbd{display:inline-block;border:1px solid var(--line);border-bottom-width:2px;border-radius:4px;background:#fff;padding:0 5px;font-family:inherit;font-size:10.5px;margin-right:3px}
@media (max-width:720px){
  .bsc-overlay{padding:7vh 10px 10px}
  .bsc-hints{display:none}
  .bsc-badge{min-width:0}
}

/* Franjas: días de la semana + rango de fechas */
.mapadm-sched__dias{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.mapadm-dia{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--line);background:#fff;color:var(--ink-3);font-size:12px;font-weight:600;cursor:pointer;transition:.13s;padding:0;font-family:inherit}
.mapadm-dia:hover{border-color:var(--green)}
.mapadm-dia.is-on{background:var(--green);border-color:var(--green);color:var(--bg,#f5efe1)}
.mapadm-sched__dias-hint{font-size:11px;color:var(--ink-3);font-style:italic;margin-left:4px}
.mapadm-sched__fechas{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mapadm-sched__fechas label{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-3)}
.mapadm-sched__fechas input[type=date]{border:1px solid var(--line);border-radius:7px;padding:5px 7px;font-family:inherit;font-size:12.5px;color:var(--ink);background:#fff}

/* ── Muro de visitas (#visitas) ── */
.nosotros__vertodas{text-align:center;margin-top:52px}
.nosotros__vertodas-btn{display:inline-block;border:1px solid var(--line);background:#fff;color:var(--ink-2);padding:10px 22px;border-radius:999px;font-size:14px;font-weight:500;text-decoration:none;transition:.16s}
.nosotros__vertodas-btn:hover{border-color:var(--green);color:var(--green);transform:translateY(-1px)}

.muro__hero{--accent:#1f4d3a}
.muro__body{padding-bottom:30px}
.muro__filters{display:flex;flex-direction:column;gap:10px;margin-bottom:18px}
.muro__chips{display:flex;flex-wrap:wrap;gap:8px}
.muro__chip{border:1.5px solid var(--line);background:#fff;color:var(--ink-2);padding:7px 15px;border-radius:999px;font-size:13px;font-weight:500;cursor:pointer;transition:.15s;font-family:inherit}
.muro__chip:hover{border-color:var(--green)}
.muro__chip.is-on{background:var(--green);border-color:var(--green);color:var(--bg,#f5efe1)}
.muro__chip--sm{padding:5px 12px;font-size:12px}
.muro__consent-note{display:block;width:100%;border:1.5px dashed var(--line);background:var(--bg-2,#ece4d0);color:var(--ink-2);padding:11px 16px;border-radius:10px;font-size:12.5px;cursor:pointer;font-family:inherit;text-align:center;margin-bottom:18px;transition:.15s}
.muro__consent-note:hover{border-color:var(--green);color:var(--green)}

.muro__grid{columns:3 280px;column-gap:16px}
.muro__card{break-inside:avoid;margin-bottom:16px;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 4px 14px rgba(31,26,20,.06);transition:.18s}
.muro__card:hover{box-shadow:0 10px 26px rgba(31,26,20,.13);transform:translateY(-2px)}
.muro__card--fav{border-color:#e3c66b;box-shadow:0 4px 14px rgba(190,150,40,.14)}
.muro__img-wrap{position:relative;line-height:0}
.muro__img{width:100%;height:auto;display:block}
.muro__play{position:absolute;inset:0;margin:auto;width:54px;height:54px;border-radius:50%;border:none;background:rgba(31,26,20,.62);color:#fff;font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding-left:4px;transition:.16s;backdrop-filter:blur(2px)}
.muro__play:hover{background:var(--accent,#1f4d3a);transform:scale(1.08)}
.muro__card-body{padding:13px 15px 15px}
.muro__meta{display:flex;align-items:center;gap:9px;margin-bottom:6px}
.muro__red{font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--accent,#1f4d3a)}
.muro__fecha{font-size:11px;color:var(--ink-3)}
.muro__star{margin-left:auto;color:#d9b13b;font-size:14px}
.muro__t{font-family:var(--title,"Cormorant Garamond",serif);font-weight:500;font-size:18px;line-height:1.15;color:var(--ink);margin:0 0 4px;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.muro__author{font-size:11.5px;color:var(--ink-3);font-style:italic;margin-bottom:8px}
.muro__actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.muro__btn{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:#fff;color:var(--ink-2);padding:6px 12px;border-radius:999px;font-size:12px;font-weight:500;cursor:pointer;text-decoration:none;font-family:inherit;transition:.14s}
.muro__btn:hover{border-color:var(--accent,#1f4d3a);color:var(--accent,#1f4d3a)}
.muro__btn--play{background:var(--accent,#1f4d3a);border-color:var(--accent,#1f4d3a);color:#fff}
.muro__btn--play:hover{filter:brightness(1.15);color:#fff}
.muro__empty{text-align:center;color:var(--ink-3);font-style:italic;padding:40px 0;column-span:all}
.muro__legal{text-align:center;font-size:11px;color:var(--ink-3);margin-top:26px}

@media (max-width:640px){
  .muro__grid{columns:2 160px;column-gap:10px}
  .muro__card{margin-bottom:10px}
  .muro__card-body{padding:10px 11px 12px}
  .muro__t{font-size:15px}
}

@media (max-width:700px){
  .vmgr-overlay{padding:0}
  .vmgr{max-height:100vh;height:100%;border-radius:0}
  .vmgr__cell-title{min-width:170px}
}


/* ─── MODO EQUIPO · acceso C1 (.eqa-) ─────────────────────────
   Cuando hay sesión de trabajador, body lleva .eqa-on: la barra
   superior pasa a azul pizarra claro (se distingue del verde
   público al instante sin perder legibilidad) y aparece la
   insignia fija arriba a la izquierda. */
:root {
  --eq-slate: #33526e;        /* azul pizarra — acento del modo equipo */
  --eq-slate-soft: #dde6ee;   /* fondo claro análogo a --green-soft */
  --eq-slate-ink: #20354a;
}
body.eqa-on .topnav {
  background: var(--eq-slate-soft);
  border-bottom: 3px solid var(--eq-slate);
}
.eqa-badge {
  position: fixed; bottom: 14px; left: 12px; z-index: 49;
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--eq-slate); color: #eef3f8;
  border: none; border-radius: 999px;
  padding: 6px 14px 6px 6px; cursor: pointer;
  box-shadow: 0 6px 18px rgba(32, 53, 74, 0.35);
  font: inherit; text-align: left;
}
.eqa-badge:hover { filter: brightness(1.12); }
.eqa-badge__avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: #eef3f8; color: var(--eq-slate-ink);
  display: grid; place-items: center;
  font-size: 12.5px; font-weight: 700; letter-spacing: 0.02em;
}
.eqa-badge__text { display: flex; flex-direction: column; line-height: 1.15; }
.eqa-badge__name { font-size: 13px; font-weight: 600; }
.eqa-badge__roles { font-size: 10.5px; opacity: 0.85; letter-spacing: 0.03em; }
.eqa-badge__dot {
  width: 10px; height: 10px; border-radius: 50%;
  background: #e8b23a; border: 2px solid var(--eq-slate);
  margin-left: 2px;
}
@media (max-width: 720px) {
  .eqa-badge__roles { display: none; }
}

.eqa-overlay {
  position: fixed; inset: 0; z-index: 6500;
  background: rgba(32, 53, 74, 0.55); backdrop-filter: blur(3px);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 9vh 16px 16px;
}
.eqa-panel {
  width: min(520px, 100%);
  background: var(--bg, #f5efe1);
  border-top: 4px solid var(--eq-slate);
  border-radius: 14px;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.4);
  max-height: 84vh; overflow-y: auto;
  padding: 18px 22px 22px;
}
.eqa-head { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; }
.eqa-head__seal {
  flex: none; width: 40px; height: 40px; border-radius: 50%;
  background: var(--eq-slate); color: #eef3f8;
  display: grid; place-items: center;
}
.eqa-title { margin: 0; font-size: 20px; color: var(--eq-slate-ink); }
.eqa-sub { margin: 4px 0 0; font-size: 13px; color: var(--ink-3, #6b675c); }
.eqa-close {
  margin-left: auto; flex: none;
  background: none; border: 1px solid var(--line, #ddd5c2); border-radius: 50%;
  width: 32px; height: 32px; font-size: 17px; cursor: pointer; color: var(--ink-3, #6b675c);
}
.eqa-close:hover { border-color: var(--eq-slate); color: var(--eq-slate); }
.eqa-form { display: flex; flex-direction: column; gap: 11px; }
.eqa-field { display: flex; flex-direction: column; gap: 4px; }
.eqa-field span { font-size: 12px; font-weight: 600; letter-spacing: 0.04em; color: var(--ink-2, #4b463c); }
.eqa-field input {
  font: inherit; font-size: 14.5px;
  border: 1px solid var(--line, #ddd5c2); border-radius: 9px;
  padding: 9px 12px; background: #fff;
}
.eqa-field input:focus { outline: 2px solid var(--eq-slate); outline-offset: 1px; }
.eqa-actions { display: flex; gap: 9px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
.eqa-actions--col { flex-direction: column; align-items: stretch; }
.eqa-btn {
  font: inherit; font-size: 13.5px; font-weight: 600;
  border: 1px solid var(--line, #ddd5c2); border-radius: 999px;
  background: #fff; color: var(--ink, #1f1a14);
  padding: 9px 18px; cursor: pointer;
}
.eqa-btn:hover { border-color: var(--eq-slate); color: var(--eq-slate); }
.eqa-btn--primary { background: var(--eq-slate); border-color: var(--eq-slate); color: #eef3f8; }
.eqa-btn--primary:hover { filter: brightness(1.12); color: #fff; }
.eqa-btn--link { border: none; background: none; text-decoration: underline; color: var(--ink-3, #6b675c); padding: 9px 4px; }
.eqa-btn--danger { border-color: #b3402e; color: #b3402e; }
.eqa-btn--danger:hover { background: #b3402e; color: #fff; }
.eqa-btn[disabled] { opacity: 0.6; cursor: default; }
.eqa-msg { margin: 0; font-size: 13px; border-radius: 8px; padding: 8px 11px; }
.eqa-msg--ok { background: #e6f0e9; color: #2e5d44; }
.eqa-msg--err { background: #fbe9e2; color: #a13a28; }
.eqa-conf {
  white-space: pre-wrap; font-size: 13px; line-height: 1.55;
  background: #fff; border: 1px solid var(--line, #ddd5c2); border-radius: 10px;
  padding: 14px 16px; max-height: 38vh; overflow-y: auto;
}
.eqa-accept { display: flex; gap: 9px; align-items: flex-start; font-size: 13.5px; cursor: pointer; }
.eqa-accept input { margin-top: 3px; width: 17px; height: 17px; }
.eqa-perfil { display: flex; gap: 14px; align-items: center; }
.eqa-perfil__avatar {
  flex: none; width: 52px; height: 52px; border-radius: 50%;
  background: var(--eq-slate); color: #eef3f8;
  display: grid; place-items: center; font-size: 19px; font-weight: 700;
}
.eqa-perfil__nombre { font-size: 17px; font-weight: 700; color: var(--eq-slate-ink); }
.eqa-perfil__roles { font-size: 13px; color: var(--eq-slate); font-weight: 600; }
.eqa-perfil__meta { font-size: 12.5px; color: var(--ink-3, #6b675c); margin-top: 2px; }
.eqa-nota { font-size: 12.5px; color: var(--ink-3, #6b675c); background: var(--eq-slate-soft); border-radius: 9px; padding: 10px 12px; margin: 2px 0 0; }


/* C2 · Modo Equipo: badge de entrada solo-equipo en Noticias/Especial */
/* Entrada COMÚN a una categoría (4-sep-2026). El pin va el primero y es un BOTÓN, no un
   adorno: quien la ve en una ficha tiene que poder enterarse de que no es de esa ficha —
   si no, el primero que la edite creerá que cambia lo que tiene delante y cambiará trece. */
.entry-card__comun-pin{
  font-size:11px; font-weight:700; letter-spacing:.02em; cursor:help;
  background:#eef6f0; color:#2f6b47; border:1px solid #cfe6d8;
  padding:2px 9px; border-radius:999px; line-height:1.5;
}
.entry-card__comun-pin:hover{ background:#e2f0e8; border-color:#b9dcc8; }

.entry-card__equipo-badge {
  display: inline-block;
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.04em;
  background: var(--eq-slate-soft, #dde6ee); color: var(--eq-slate, #33526e);
  border: 1px solid color-mix(in oklab, var(--eq-slate, #33526e) 35%, transparent);
  border-radius: 999px; padding: 2px 9px; margin-left: 8px;
  vertical-align: middle; white-space: nowrap;
}


/* C3 · Modo Equipo: foto de perfil + autoría de notas internas */
.eqa-badge__avatar--photo, .eqa-perfil__avatar--photo { overflow: hidden; padding: 0; }
.eqa-badge__avatar--photo img, .eqa-perfil__avatar--photo img {
  width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block;
}
.entry-card__author {
  font-size: 11.5px; font-style: italic;
  color: var(--eq-slate, #33526e); opacity: 0.85;
  margin-left: 6px; white-space: nowrap;
}
.entry-editor__staffnote {
  margin: 0; align-self: flex-end; padding-bottom: 8px;
  font-size: 12.5px; color: var(--eq-slate, #33526e);
  background: var(--eq-slate-soft, #dde6ee);
  border-radius: 8px; padding: 8px 11px;
}


/* ─── C4 · Capa operativa del equipo (.eqc-) ──────────────────── */
.eqc-fab {
  position: fixed; right: 14px; bottom: 14px; z-index: 6400;
  display: inline-flex; align-items: center; gap: 7px;
  background: var(--eq-slate, #33526e); color: #eef3f8;
  border: none; border-radius: 999px; padding: 11px 18px;
  font: 600 14px/1 inherit; font-family: inherit; cursor: pointer;
  box-shadow: 0 8px 24px rgba(32, 53, 74, 0.4);
}
.eqc-fab:hover { filter: brightness(1.12); }
.eqc-fab__badge {
  background: #e8b23a; color: #20354a;
  border-radius: 999px; font-size: 11.5px; font-weight: 700;
  padding: 2px 7px;
}
.eqc-panel {
  position: fixed; right: 14px; bottom: 66px; z-index: 6400;
  width: min(420px, calc(100vw - 28px));
  max-height: min(70vh, 640px);
  display: flex; flex-direction: column;
  background: var(--bg, #f5efe1);
  border: 1px solid var(--line, #ddd5c2); border-top: 4px solid var(--eq-slate, #33526e);
  border-radius: 14px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35);
  overflow: visible;
}
@media (max-width: 600px) {
  .eqc-panel { right: 8px; left: 8px; width: auto; bottom: 64px; max-height: 72vh; }
}
.eqc-head { display: flex; align-items: center; gap: 8px; padding: 10px 12px 0; justify-content: flex-end; }
.eqc-tabs {
  display: flex; gap: 6px; flex-wrap: wrap-reverse; justify-content: flex-end;
  padding: 8px 12px; border-top: 1px solid var(--line, #ddd5c2);
  background: color-mix(in oklab, var(--bg, #f5efe1) 90%, #fff);
  border-radius: 0 0 14px 14px;
}
.eqc-tab {
  font: 600 12.5px/1 inherit; font-family: inherit;
  border: 1px solid var(--line, #ddd5c2); border-radius: 999px;
  background: #fff; color: var(--ink-2, #4b463c);
  padding: 7px 13px; cursor: pointer;
}
.eqc-tab.is-active { background: var(--eq-slate, #33526e); border-color: var(--eq-slate, #33526e); color: #eef3f8; }
.eqc-close {
  position: absolute; top: -13px; right: -6px; z-index: 5;
  background: var(--bg, #f5efe1);
  border: 1px solid var(--line, #ddd5c2); border-radius: 50%;
  width: 30px; height: 30px; font-size: 16px; line-height: 1; cursor: pointer; color: var(--ink-2, #4a4136);
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.22);
}
.eqc-close:hover { background: color-mix(in oklab, var(--bg, #f5efe1) 88%, var(--ink)); }
.eqc-entity { margin: 0 0 8px; font-size: 12px; color: var(--ink-3, #6b675c); }
.eqc-body {
  padding: 14px 14px 16px; overflow-y: auto; flex: 1 1 auto; min-height: 0;
  scrollbar-width: thin; scrollbar-color: color-mix(in oklab, var(--ink, #1f1a14) 22%, transparent) transparent;
}
.eqc-body::-webkit-scrollbar { width: 6px; }
.eqc-body::-webkit-scrollbar-thumb { background: color-mix(in oklab, var(--ink, #1f1a14) 20%, transparent); border-radius: 999px; }
.eqc-body::-webkit-scrollbar-track { background: transparent; }
.eqc-fecha { margin: 0 0 8px; font-size: 13px; font-weight: 700; color: var(--eq-slate, #33526e); text-transform: capitalize; }
.eqc-texto { white-space: pre-wrap; font-size: 13.5px; line-height: 1.55; }
.eqc-muted { font-size: 13px; color: var(--ink-3, #6b675c); }
.eqc-h4 { margin: 12px 0 4px; font-size: 13px; color: var(--eq-slate, #33526e); }
.eqc-label { font-size: 12px; font-weight: 700; color: var(--eq-slate, #33526e); }
.eqc-form { display: flex; flex-direction: column; gap: 8px; margin-bottom: 10px; }
.eqc-form input[type="text"], .eqc-form textarea, .eqc-row input[type="text"] {
  font: inherit; font-size: 13.5px;
  border: 1px solid var(--line, #ddd5c2); border-radius: 8px;
  padding: 8px 10px; background: #fff; width: 100%; box-sizing: border-box;
}
.eqc-row { display: flex; gap: 8px; align-items: center; margin-top: 6px; }
.eqc-btn {
  font: 600 13px/1 inherit; font-family: inherit;
  border: 1px solid var(--line, #ddd5c2); border-radius: 999px;
  background: #fff; color: var(--ink, #1f1a14);
  padding: 9px 15px; cursor: pointer; white-space: nowrap;
}
.eqc-btn:hover { border-color: var(--eq-slate, #33526e); color: var(--eq-slate, #33526e); }
.eqc-btn--primary { background: var(--eq-slate, #33526e); border-color: var(--eq-slate, #33526e); color: #eef3f8; }
.eqc-btn--primary:hover { filter: brightness(1.12); color: #fff; }
.eqc-btn[disabled] { opacity: 0.55; cursor: default; }
.eqc-msg { margin: 8px 14px 0; font-size: 12.5px; border-radius: 8px; padding: 7px 10px; }
.eqc-msg--ok { background: #e6f0e9; color: #2e5d44; }
.eqc-msg--err { background: #fbe9e2; color: #a13a28; }
.eqc-tasks { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.eqc-tasks li {
  display: flex; align-items: center; gap: 8px;
  background: #fff; border: 1px solid var(--line, #ddd5c2); border-radius: 9px;
  padding: 8px 10px;
}
.eqc-tasks li.is-done { opacity: 0.72; }
.eqc-tasks li.is-done .eqc-task__label { text-decoration: line-through; }
.eqc-tasks label { display: flex; align-items: center; gap: 9px; flex: 1; cursor: pointer; font-size: 13.5px; }
.eqc-tasks input[type="checkbox"] { width: 19px; height: 19px; accent-color: var(--eq-slate, #33526e); }
.eqc-task__by { font-size: 11px; color: var(--eq-slate, #33526e); font-style: italic; white-space: nowrap; }
.eqc-task__del { background: none; border: none; color: #b3402e; font-size: 16px; cursor: pointer; padding: 2px 6px; }
.eqc-file { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }
.eqc-incidents { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.eqc-incidents li { background: #fff; border: 1px solid var(--line, #ddd5c2); border-radius: 10px; padding: 10px 12px; }
.eqc-incidents li.is-resolved { opacity: 0.7; }
.eqc-inc__head { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; font-size: 13.5px; }
.eqc-chip { font-size: 10.5px; font-weight: 700; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.eqc-chip--abierta { background: #fbe9e2; color: #b3402e; }
.eqc-chip--resuelta { background: #e6f0e9; color: #2e7d4f; }
.eqc-inc__photo { max-width: 100%; border-radius: 8px; margin-top: 6px; }
.eqc-inc__meta { font-size: 11.5px; color: var(--ink-3, #6b675c); font-style: italic; margin-top: 4px; }


/* C5 · mensajería simple del equipo */
.eqc-fab__badge--msg { background: #eef3f8; color: var(--eq-slate, #33526e); }
.eqc-msgs {
  display: flex; flex-direction: column; gap: 8px;
  max-height: 38vh; overflow-y: auto; margin-bottom: 10px;
  padding: 2px;
}
.eqc-burbuja {
  align-self: flex-start; max-width: 88%;
  background: #fff; border: 1px solid var(--line, #ddd5c2);
  border-radius: 12px 12px 12px 4px; padding: 8px 12px;
}
.eqc-burbuja--mia {
  align-self: flex-end;
  background: var(--eq-slate-soft, #dde6ee);
  border-color: color-mix(in oklab, var(--eq-slate, #33526e) 30%, transparent);
  border-radius: 12px 12px 4px 12px;
}
.eqc-burbuja__kind {
  display: block; font-size: 11px; font-weight: 700;
  color: var(--eq-slate, #33526e); margin-bottom: 3px;
}
.eqc-burbuja__meta {
  display: block; font-size: 10.5px; color: var(--ink-3, #6b675c);
  margin-top: 3px; text-align: right;
}


/* ─── Chatbot IA · widget multi-modo (sugerencia 10 · personas) ── */
.cbot-avatar {
  flex: none; border-radius: 50%; display: grid; place-items: center;
  font-size: 15px; color: #fff; overflow: hidden; line-height: 1;
}
.cbot-avatar--img { padding: 0; }
.cbot-avatar--img img { width: 100%; height: 100%; object-fit: cover; }

.cbot-fab {
  position: fixed; right: 16px; bottom: 16px; z-index: 6200;
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--cbot-accent, #1f4d3a); color: #f8f5ec;
  border: none; border-radius: 999px; padding: 9px 16px 9px 9px;
  font: 600 14px/1 inherit; font-family: inherit; cursor: pointer;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}
.cbot-fab:hover { filter: brightness(1.08); }
.cbot-fab .cbot-avatar { background: rgba(255,255,255,0.18); }
@media (max-width: 560px) { .cbot-fab__label { display: none; } .cbot-fab { padding: 8px; } }

/* Animaciones de entrada (al estilo de la web) */
.cbot-anim--pop { animation: cbotPop .5s cubic-bezier(.34,1.56,.64,1) both; }
.cbot-anim--wave .cbot-avatar { animation: cbotWave 1.8s ease-in-out 1s 2; transform-origin: 70% 70%; }
.cbot-anim--pulse { animation: cbotPulse 2.4s ease-in-out infinite; }
@keyframes cbotPop { from { transform: scale(0) translateY(20px); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes cbotWave { 0%,60%,100% { transform: rotate(0); } 20% { transform: rotate(-18deg); } 40% { transform: rotate(14deg); } }
@keyframes cbotPulse { 0%,100% { box-shadow: 0 8px 24px rgba(0,0,0,.28); } 50% { box-shadow: 0 8px 10px rgba(0,0,0,.2), 0 0 0 8px color-mix(in oklab, var(--cbot-accent,#1f4d3a) 18%, transparent); } }
@media (prefers-reduced-motion: reduce) { .cbot-fab[class*="cbot-anim"] { animation: none; } .cbot-anim--wave .cbot-avatar { animation: none; } }

.cbot-panel {
  position: fixed; right: 16px; bottom: 16px; z-index: 6200;
  width: min(380px, calc(100vw - 24px));
  height: min(560px, calc(100vh - 32px));
  display: flex; flex-direction: column;
  background: var(--bg, #f5efe1);
  border: 1px solid var(--line, #ddd5c2); border-top: 4px solid var(--cbot-accent, #1f4d3a);
  border-radius: 16px; overflow: hidden;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35);
  animation: cbotPanelIn .28s ease both;
}
@keyframes cbotPanelIn { from { transform: translateY(16px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
.cbot-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 11px 14px; background: var(--cbot-accent, #1f4d3a); color: #f8f5ec;
}
.cbot-head__id { display: inline-flex; align-items: center; gap: 9px; }
.cbot-head__id .cbot-avatar { background: rgba(255,255,255,0.2); }
.cbot-head__title { font-weight: 600; font-size: 14.5px; }
.cbot-close { background: none; border: none; color: #f8f5ec; font-size: 22px; cursor: pointer; line-height: 1; opacity: 0.85; }
.cbot-close:hover { opacity: 1; }
.cbot-body { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 9px; }
.cbot-msg { max-width: 85%; padding: 9px 13px; border-radius: 14px; font-size: 13.5px; line-height: 1.5; white-space: pre-wrap; }
.cbot-msg--bot { align-self: flex-start; background: #fff; border: 1px solid var(--line, #ddd5c2); border-bottom-left-radius: 4px; color: var(--ink, #1f1a14); }
.cbot-msg--me { align-self: flex-end; background: color-mix(in oklab, var(--cbot-accent, #1f4d3a) 18%, #fff); border-bottom-right-radius: 4px; color: var(--ink, #1f1a14); }
.cbot-msg--typing { display: inline-flex; gap: 4px; align-items: center; }
.cbot-msg--typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--ink-3, #8a7e6a); animation: cbotBlink 1.2s infinite both; }
.cbot-msg--typing span:nth-child(2) { animation-delay: 0.2s; }
.cbot-msg--typing span:nth-child(3) { animation-delay: 0.4s; }
@keyframes cbotBlink { 0%, 80%, 100% { opacity: 0.25; } 40% { opacity: 1; } }
.cbot-input { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--line, #ddd5c2); }
.cbot-input input { flex: 1; font: inherit; font-size: 14px; border: 1px solid var(--line, #ddd5c2); border-radius: 999px; padding: 9px 14px; background: #fff; }
.cbot-input input:focus { outline: 2px solid var(--cbot-accent, #1f4d3a); outline-offset: 1px; }
.cbot-input button { flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--cbot-accent, #1f4d3a); color: #f8f5ec; border: none; cursor: pointer; display: grid; place-items: center; }
.cbot-input button[disabled] { opacity: 0.5; cursor: default; }
.cbot-foot { margin: 0; padding: 0 14px 10px; font-size: 10.5px; color: var(--ink-3, #8a7e6a); text-align: center; }
/* Modo equipo: el chatbot interno NO se oculta con body.eqa-on */

/* Modo equipo: el FAB y panel del chatbot suben para no tapar el FAB 🔒 Equipo */
body.eqa-on .cbot-fab--equipo { bottom: 70px; }
body.eqa-on .cbot-panel--equipo { bottom: 70px; }

/* Chatbot · panel de conversaciones y estadísticas (admin) */
.cbstat-card { flex:1; min-width:90px; background:#fff; border:1px solid var(--line,#ddd5c2); border-radius:10px; padding:10px 12px; display:flex; flex-direction:column; }
.cbstat-n { font-size:24px; font-weight:700; color:var(--green,#1f4d3a); line-height:1; }
.cbstat-l { font-size:11.5px; color:var(--ink-3,#8a7e6a); margin-top:3px; }
.cbbars { display:flex; gap:4px; align-items:flex-end; height:78px; padding-top:6px; }
.cbbars--hours { gap:2px; height:60px; }
.cbbar { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:3px; }
.cbbar__fill { width:70%; min-height:2px; background:var(--green,#1f4d3a); border-radius:3px 3px 0 0; }
.cbbar__lbl { font-size:9.5px; color:var(--ink-3,#8a7e6a); }
.cbwords { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:baseline; padding:4px 0; }
.cbword { color:var(--green,#1f4d3a); line-height:1.1; }
.cbword i { font-size:10px; color:var(--ink-3,#8a7e6a); margin-left:2px; font-style:normal; vertical-align:super; }
.cbconv { background:#fff; border:1px solid var(--line,#ddd5c2); border-radius:10px; padding:9px 12px; }
.cbconv__head { display:flex; align-items:center; gap:8px; margin-bottom:5px; }
.cbconv__q { font-size:13px; }
.cbconv__a { font-size:13px; color:var(--ink-2,#4a4136); margin-top:3px; white-space:pre-wrap; }

/* ─── Shimmer de carga de imágenes (ResponsiveImg .ri-loading) ────
   Mientras la imagen no ha cargado, su fondo muestra un degradado
   con el tono de marca que se desliza suavemente. Al cargar (onLoad)
   se quita la clase y aparece la foto. Sin envoltorio: no altera el
   layout de ninguna imagen del sitio. */
.ri-loading {
  background-image: linear-gradient(100deg,
    var(--green-soft, #c7d2c4) 30%,
    rgba(245, 239, 225, 0.65) 50%,
    var(--green-soft, #c7d2c4) 70%);
  background-size: 200% 100%;
  background-repeat: no-repeat;
  background-position: 180% 0;
  animation: riShimmer 1.25s ease-in-out infinite;
  color: transparent;
}
@keyframes riShimmer {
  to { background-position: -20% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ri-loading { animation: none; background-position: 50% 0; }
}

/* Placeholder de imagen externa caducada (CDN Meta/Instagram → 403) */
.img--fallback { object-fit: contain !important; background: #e7ece4; opacity: 0.9; }

/* ── Fachada para incrustados de terceros (2-sep-2026) ─────────────────────────────────────
   Ningún iframe de YouTube/TikTok/Instagram/Facebook/Vimeo se carga hasta que el visitante
   pulsa. Antes se inyectaban directos: con solo abrir la ficha, su IP llegaba a esas empresas
   sin haber aceptado nada. */
.pd-embed-facade {
  position: relative; display: grid; place-items: center;
  min-height: 190px; margin: 1rem 0; padding: 1.25rem;
  border: 1px solid rgba(255,255,255,.14); border-radius: 12px;
  background: linear-gradient(160deg, #1a1a17 0%, #23241f 100%);
  color: #f3efe4; text-align: center;
}
.pd-embed-facade__lock { font-weight: 600; margin-bottom: .4rem; }
.pd-embed-facade p { margin: 0 0 .9rem; font-size: .92rem; opacity: .82; max-width: 46ch; }
.pd-embed-facade__actions { display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; }
.pd-embed-facade__link { color: #cdbb8a; text-decoration: underline; align-self: center; font-size: .9rem; }

/* ==== PASE DE FOTOS · copia de KitEventos · NO EDITAR AQUÍ ==== */
/* Traído de https://www.granjaescuelaelrodeo.com/eventoselrodeo/assets/css/muestra.css (CONTRATO v1).
   Se edita EN SU ORIGEN, no aquí: vuelve a correr tools/traer-muestra-css.py */
/* ── El pase de fotos ─────────────────────────────────────────────────────
   CONTRATO v1 · 8-sep-2026 · https://www.granjaescuelaelrodeo.com/eventoselrodeo/assets/css/muestra.css

   Este fichero es de Eventos El Rodeo y lo usan también KitWeb y Por Dentro,
   así que sus nombres de clase son API pública: no se renombran ni se quitan
   sin avisar a los tres, y hacerlo sube la versión de aquí arriba. Lo que sí
   puede cambiar sin avisar es lo de dentro de cada regla —un color, una
   duración—, que es justo el motivo de que esto viva en un solo sitio.

   CÓPIALO, NO LO ENLACES. Y no es por rendimiento: si lo enlazas, el día que
   toquemos este fichero te cambia la página en caliente y sin avisarte. Con
   una hoja de estilos suena inofensivo —«se verá algo distinto»— y no lo es:
   sin estas reglas las diapositivas **no se ocultan ni se posicionan**, así
   que las fotos de un pase salen TODAS a la vez, apiladas y sin telón. No es
   feo, es otra página, y una que parece rota sin decir por qué. Copiar deja
   un solo sitio donde se edita —este— y te deja elegir cuándo entra. La idea
   es de KitWeb, y es mejor que la que habíamos recomendado nosotros.

   LAS CLASES DEL CONTRATO, para quien verifique una copia. Están todas o la
   copia no vale:
     .muestra            .muestra__galeria   .muestra__pista
     .muestra__diapo     .es-actual          .muestra__flecha
     .muestra__flecha--iz  .muestra__flecha--de
     .muestra__puntos    .muestra__punto     .muestra__cuerpo
     .muestra__cerrar    .muestra__texto     .muestra__pie
     .muestra__enlace
   Y la propiedad `--telon`, que la pone el JS por foto.

   Qué resuelve, y por qué se comparte: fotos de proporciones distintas
   —verticales de móvil y horizontales de cámara— conviven sin recortar
   ninguna. El truco es el telón: una copia de la propia foto, desenfocada y
   oscurecida, rellena el hueco, y la foto real va encima con `contain`.

   El marcado que espera:

     <dialog class="muestra">
       <div class="muestra__galeria">
         <div class="muestra__pista">
           <figure class="muestra__diapo es-actual" style="--telon:url(FOTO)">
             <img src="FOTO" alt="…"><figcaption>«pie»</figcaption>
           </figure>
         </div>
         <button class="muestra__flecha muestra__flecha--iz">‹</button>
         <button class="muestra__flecha muestra__flecha--de">›</button>
         <div class="muestra__puntos"><button class="muestra__punto es-actual"></button></div>
       </div>
       <div class="muestra__cuerpo">…</div>
     </dialog>

   Dos cosas que hay que respetar al portarlo, y que no son decoración:

   1. `--telon` se pone con URL ABSOLUTA. Una url() dentro de una custom
      property se resuelve contra la HOJA DE ESTILOS, no contra el documento:
      con ruta relativa el telón busca assets/css/assets/img/… y no pinta
      nada, en silencio.
   2. El pase automático DEBE pararse en cuanto alguien toca una flecha o un
      punto, y no arrancar con `prefers-reduced-motion: reduce`. Un carrusel
      sin forma de pararlo incumple WCAG 2.2.2.

   Cada var() lleva su valor de reserva, así que el fichero se vale por sí
   solo. Quien defina esos tokens, manda: el pase se viste de su marca. */

dialog.muestra {
  border: 1px solid rgb(217 184 119 / 0.3); border-radius: var(--radio, 2px);
  background: var(--carbon, #1f1f1c); color: var(--sobre-foto, #eef0ea);
  padding: 0; max-width: min(92vw, 520px); margin: auto;
}
dialog.muestra::backdrop { background: rgb(10 10 9 / 0.7); backdrop-filter: blur(6px); }
@media (prefers-reduced-motion: no-preference) {
  dialog.muestra[open] { animation: ke-muestra 380ms var(--curva, cubic-bezier(0.16, 1, 0.3, 1)); }
  @keyframes ke-muestra {
    from { opacity: 0; transform: translateY(22px) scale(0.97); }
    to   { opacity: 1; transform: none; }
  }
}
.muestra__cerrar {
  position: absolute; top: 0.6rem; right: 0.6rem; z-index: 2;
  width: 38px; height: 38px; border: 0; border-radius: 50%;
  background: rgb(20 20 18 / 0.65); color: var(--sobre-foto, #eef0ea);
  font-size: 1rem; cursor: pointer;
}
.muestra__cerrar:hover { color: var(--champan, #d9b877); }
.muestra__foto img { width: 100%; max-height: 300px; object-fit: cover; display: block; }

/* La ficha con varias fotos se pasa sola, como una presentación de la casa.
   Cada foto lleva su pie entrecomillado con el nombre del plato tal y como
   aparece en la carta. Fondo oscuro y «contain»: un plato no se recorta —
   se enseña entero, que para eso se ha emplatado. */
.muestra__galeria {
  position: relative; background: var(--noche, #141412); overflow: hidden;
  aspect-ratio: 4 / 3;   /* altura estable, mezclando fotos altas y anchas */
  border-bottom: 1px solid rgb(217 184 119 / 0.18);
}
.muestra__pista { position: absolute; inset: 0; }
.muestra__diapo {
  position: absolute; inset: 0; margin: 0;
  opacity: 0; visibility: hidden;
  transition: opacity 900ms var(--curva, cubic-bezier(0.16, 1, 0.3, 1)), visibility 900ms;
}
.muestra__diapo.es-actual { opacity: 1; visibility: visible; }
/* Detrás de cada foto, ella misma ampliada y desenfocada: las verticales ya no
   dejan dos bandas negras planas, sino un telón del color del propio plato. */
.muestra__diapo::before {
  content: ''; position: absolute; inset: -10%;
  background: var(--telon) center / cover no-repeat;
  filter: blur(28px) brightness(0.4) saturate(0.75);
}
.muestra__diapo img,
.muestra__diapo video { position: relative; width: 100%; height: 100%;
                       object-fit: contain; display: block;
                       /* Hueco para el pie: en una foto vertical y larga —una tira de
                          fotomatón, sin ir más lejos— el degradado del pie se comía la parte
                          de abajo, que es donde van los nombres. */
                       padding-bottom: 42px; box-sizing: border-box; }
/* El vídeo no lleva telón: no hay de dónde sacarlo y se ve bien sobre el negro. */
.muestra__diapo:has(video)::before { display: none; }
.muestra__diapo figcaption {
  z-index: 2; position: absolute; left: 0; right: 0; bottom: 0;
  padding: 2.6rem 1.1rem 1.9rem;
  background: linear-gradient(to top, rgb(10 10 9 / 0.94) 38%, transparent);
  /* Prata sin cursiva: no tiene itálica real y la sintética afea la letra. */
  font-family: var(--display, 'Prata', 'Didot', Georgia, serif); color: var(--champan, #d9b877);
  font-size: 1rem; line-height: 1.35; text-align: center;
}
.muestra__flecha {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 40px; height: 40px; border: 0; border-radius: 50%;
  background: rgb(20 20 18 / 0.5); color: var(--sobre-foto, #eef0ea);
  font-size: 1.6rem; line-height: 1; cursor: pointer;
  transition: background 240ms, color 240ms;
}
.muestra__flecha:hover { background: rgb(20 20 18 / 0.85); color: var(--champan, #d9b877); }
.muestra__flecha--iz { left: 0.5rem; }
.muestra__flecha--de { right: 0.5rem; }
.muestra__puntos {
  position: absolute; left: 0; right: 0; bottom: 0.6rem; z-index: 2;
  display: flex; justify-content: center; gap: 0.45rem;
}
.muestra__punto {
  width: 7px; height: 7px; padding: 0; border: 0; border-radius: 50%;
  background: rgb(240 236 228 / 0.45); cursor: pointer;
  transition: background 240ms, transform 240ms;
}
.muestra__punto.es-actual { background: var(--champan, #d9b877); transform: scale(1.4); }
.muestra__cuerpo { padding: 1.5rem 1.7rem 1.7rem; }
.muestra__cuerpo h3 { font-size: 1.5rem; color: var(--sobre-foto, #eef0ea); }
.muestra__texto { color: var(--sobre-foto-suave, #dce4dd); margin-top: 0.9rem; }
.muestra__pie { color: var(--salvia, #8fae98); font-size: 0.82rem; margin-top: 1rem;
                letter-spacing: 0.04em; }
/* El enlace de una ficha: para ver la cosa de verdad, no para leer sobre ella. */
.muestra__enlace { margin: 0.9rem 0 0; }
.muestra__enlace a {
  display: inline-block; padding: 0.55rem 1.1rem; border-radius: var(--radio, 2px);
  border: 1px solid var(--champan, #d9b877); color: var(--champan, #d9b877); text-decoration: none;
  font-size: 0.82rem; letter-spacing: 0.14em; text-transform: uppercase;
  transition: background var(--rapido, 180ms) var(--curva, cubic-bezier(0.16, 1, 0.3, 1)), color var(--rapido, 180ms) var(--curva, cubic-bezier(0.16, 1, 0.3, 1));
}
.muestra__enlace a:hover { background: var(--champan, #d9b877); color: #191813; }
/* ==== fin del pase de fotos ==== */