/* Museo de la Abeja Huasca · APIS · 20260629-museo-abeja-huasca-v1 */
:root[data-theme="default"]:not([data-a11y-contrast="high"]),
:root:not([data-theme]):not([data-a11y-contrast="high"]) {
  --bg-main: #f9f8f5;
  --bg-card: #ffffff;
  --bg-muted: #f1efea;
  --text-primary: #1e1b18;
  --text-secondary: #4a443f;
  --text-muted: #79716b;
  --text-inverse: #ffffff;
  --color-primary: #b89047;
  --color-primary-hover: #9c7532;
  --color-secondary: #2c3e2b;
  --color-dark: #121212;
  --color-accent: #e7b93d;
  --border-default: #e6e2db;
  --border-strong: #ccc5b9;
  --shadow-sm: 0 1px 3px rgba(44, 34, 15, 0.05);
  --shadow-md: 0 12px 30px rgba(44, 34, 15, 0.12);
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --focus-ring: 0 0 0 .25rem rgba(184,144,71,.35);
}

html { scroll-padding-top: 96px; }
body {
  color: var(--text-primary);
  background:
    radial-gradient(circle at 10% 8%, color-mix(in srgb, var(--color-accent), transparent 78%), transparent 24rem),
    radial-gradient(circle at 90% 14%, color-mix(in srgb, var(--color-secondary), transparent 88%), transparent 26rem),
    var(--bg-main);
}
a { color: var(--color-secondary); }
a:hover { color: var(--color-primary-hover); }
.site-header.museo-header {
  backdrop-filter: blur(18px);
  background: var(--bg-card);
  background: color-mix(in srgb, var(--bg-card), transparent 6%);
  border-bottom: 1px solid color-mix(in srgb, var(--color-primary), transparent 78%);
  box-shadow: var(--shadow-sm);
}
.navbar,
.navbar-brand,
.nav-link,
.dropdown-toggle,
.nav-control,
.language-switcher,
.theme-switcher,
.a11y-switcher {
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
}
.site-header .container-shell { max-width: min(1500px, calc(100vw - 28px)); }
.museo-brand { gap: .72rem; min-width: 0; }
.museo-brand img,
.footer-brand img {
  display: block;
  width: 56px;
  max-width: 56px;
  height: 56px;
  max-height: 56px;
  object-fit: contain;
}
.museo-brand span { display: grid; line-height: 1.05; }
.museo-brand strong { font-size: clamp(.84rem, 1.1vw, 1rem); letter-spacing: -.02em; color: var(--text-primary); }
.museo-brand small { font-size: .72rem; color: var(--color-primary-hover); font-weight: 700; }
.navbar-nav .nav-link {
  font-size: .9rem;
  font-weight: 800;
  border-radius: 999px;
  padding-inline: .72rem !important;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active { background: color-mix(in srgb, var(--color-primary), transparent 88%); color: var(--color-primary-hover); }
.honey-dropdown {
  border: 1px solid color-mix(in srgb, var(--color-primary), transparent 72%);
  border-radius: 18px;
  box-shadow: var(--shadow-md);
  padding: .7rem;
  min-width: 18rem;
}
.dropdown-item { border-radius: 12px; padding: .58rem .75rem; }
.dropdown-item:hover { background: color-mix(in srgb, var(--color-primary), transparent 88%); color: var(--color-secondary); }
.ajustes-menu { min-width: min(22rem, calc(100vw - 2rem)); border-radius: 20px; box-shadow: var(--shadow-md); background: var(--bg-card); color: var(--text-primary); border: 1px solid var(--border-default); }
.btn-brand {
  --bs-btn-bg: var(--color-primary);
  --bs-btn-border-color: var(--color-primary);
  --bs-btn-hover-bg: var(--color-primary-hover);
  --bs-btn-hover-border-color: var(--color-primary-hover);
  --bs-btn-color: #fff;
  --bs-btn-hover-color: #fff;
  border-radius: 999px;
  font-weight: 800;
}
.btn-outline-brand {
  --bs-btn-color: var(--color-secondary);
  --bs-btn-border-color: rgba(44,62,43,.3);
  --bs-btn-hover-bg: var(--color-secondary);
  --bs-btn-hover-border-color: var(--color-secondary);
  --bs-btn-hover-color: #fff;
  border-radius: 999px;
  font-weight: 800;
}
.hero, .page-hero { position: relative; overflow: clip; padding-top: clamp(7rem, 12vw, 10rem); }
.page-hero.compact-hero { padding-bottom: clamp(3.5rem, 7vw, 6rem); }
.museo-home-hero { min-height: 92svh; display: flex; align-items: center; }
.hero::before, .page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(30deg, rgba(184,144,71,.12) 12%, transparent 12.5%, transparent 87%, rgba(184,144,71,.12) 87.5%, rgba(184,144,71,.12)),
    linear-gradient(150deg, rgba(184,144,71,.12) 12%, transparent 12.5%, transparent 87%, rgba(184,144,71,.12) 87.5%, rgba(184,144,71,.12)),
    linear-gradient(30deg, rgba(184,144,71,.12) 12%, transparent 12.5%, transparent 87%, rgba(184,144,71,.12) 87.5%, rgba(184,144,71,.12)),
    linear-gradient(150deg, rgba(184,144,71,.12) 12%, transparent 12.5%, transparent 87%, rgba(184,144,71,.12) 87.5%, rgba(184,144,71,.12));
  background-size: 70px 122px;
  background-position: 0 0, 0 0, 35px 61px, 35px 61px;
  opacity: .36;
  mask-image: linear-gradient(to bottom, black, transparent 76%);
}
.hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .42rem .75rem;
  border-radius: 999px;
  background: rgba(184,144,71,.12);
  color: var(--color-primary-hover);
  font-weight: 900;
  margin-bottom: 1.1rem;
}
.hero-title {
  font-size: clamp(2.7rem, 7vw, 6.4rem);
  line-height: .92;
  letter-spacing: -.07em;
  color: var(--text-primary);
}
.compact-hero .hero-title { font-size: clamp(2.35rem, 5vw, 4.7rem); }
.hero-copy { font-size: clamp(1rem, 1.25vw, 1.22rem); color: var(--text-secondary); max-width: 64ch; }
.hero-lead { font-weight: 750; color: var(--color-secondary); }
.hero-actions { display: flex; gap: .8rem; flex-wrap: wrap; margin-top: 1.6rem; }
.honey-stage {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(360px, 44vw, 560px);
  border-radius: 46px;
  background:
    radial-gradient(circle at 70% 20%, rgba(255,255,255,.62), transparent 12rem),
    linear-gradient(135deg, rgba(255,246,206,.95), rgba(184,144,71,.22)),
    var(--bg-card);
  border: 1px solid rgba(184,144,71,.28);
  box-shadow: 0 38px 88px rgba(71,50,10,.18);
}
.honey-stage::before {
  content: '';
  position: absolute;
  inset: 1.25rem;
  border-radius: 36px;
  background: repeating-linear-gradient(60deg, rgba(44,62,43,.08) 0 2px, transparent 2px 28px);
  opacity: .8;
}
.hero-logo { position: relative; width: min(70%, 420px); height: auto; filter: drop-shadow(0 28px 34px rgba(61,39,4,.25)); }
.floating-badge {
  position: absolute;
  z-index: 2;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(184,144,71,.28);
  box-shadow: var(--shadow-md);
  border-radius: 999px;
  padding: .65rem .9rem;
  font-weight: 900;
  color: var(--color-secondary);
}
.badge-one { left: 6%; top: 12%; } .badge-two { right: 6%; bottom: 16%; } .badge-three { left: 10%; bottom: 9%; }
.visit-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: .8rem;
  margin-top: clamp(2rem, 4vw, 4rem);
}
.visit-strip div {
  background: rgba(255,255,255,.86);
  border: 1px solid color-mix(in srgb, var(--color-primary), transparent 72%);
  border-radius: 20px;
  padding: 1rem;
  box-shadow: var(--shadow-sm);
}
.visit-strip span { display:block; color: var(--text-muted); font-size:.84rem; font-weight:800; }
.visit-strip strong { display:block; color: var(--color-secondary); font-size: clamp(1rem,1.4vw,1.25rem); }
.section-pad { padding-block: clamp(3.5rem, 8vw, 7rem); }
.bg-honey-soft { background: linear-gradient(180deg, rgba(241,239,234,.8), rgba(255,255,255,.45)); }
.section-kicker { text-transform: uppercase; letter-spacing: .12em; color: var(--color-primary-hover); font-weight: 900; font-size: .82rem; }
.section-title { font-size: clamp(2rem, 4vw, 4rem); line-height: .98; letter-spacing: -.05em; }
.section-copy { color: var(--text-secondary); font-size: 1.1rem; max-width: 70ch; margin-inline: auto; }
.section-heading { text-align: center; max-width: 900px; margin-inline: auto; }
.honey-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1rem; }
.honey-card {
  position: relative;
  background: rgba(255,255,255,.88);
  border: 1px solid rgba(184,144,71,.22);
  border-radius: 28px;
  padding: 1.45rem;
  box-shadow: var(--shadow-sm);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.honey-card::after {
  content:'';
  position:absolute;
  right: 1rem;
  top: 1rem;
  width: 42px;
  aspect-ratio: 1;
  background: rgba(184,144,71,.1);
  clip-path: polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%);
}
.honey-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-md); border-color: rgba(184,144,71,.45); }
.honey-card-icon { display:inline-grid; place-items:center; width: 2.6rem; height: 2.6rem; background: rgba(184,144,71,.14); border-radius: 16px; margin-bottom: .85rem; }
.honey-card h2, .honey-card h3 { font-size: 1.25rem; letter-spacing: -.02em; }
.honey-card p { color: var(--text-secondary); margin-bottom: 0; }
.honey-card a { display: inline-flex; margin-top: .9rem; font-weight: 900; text-decoration: none; }
.museo-photo-frame { margin:0; padding: .72rem; border-radius: 32px; background: #fff; border: 1px solid rgba(184,144,71,.28); box-shadow: var(--shadow-md); }
.museo-photo-frame img { width:100%; height:auto; display:block; border-radius: 24px; object-fit: cover; }
.museo-photo-frame figcaption { color: var(--text-muted); font-size: .85rem; padding: .65rem .4rem .2rem; }
.bee-orb {
  width: min(360px, 78vw); aspect-ratio: 1; display:grid; place-items:center; margin-inline:auto;
  border-radius: 50%;
  background: radial-gradient(circle, #fff 0 48%, rgba(184,144,71,.2) 49% 100%);
  box-shadow: var(--shadow-md);
}
.bee-orb img { width: 70%; height: auto; filter: drop-shadow(0 18px 22px rgba(61,39,4,.22)); }
.stat-honey { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap:.8rem; margin-top: 1.4rem; }
.stat-honey div { background: #fff; border:1px solid rgba(184,144,71,.22); border-radius: 20px; padding: 1rem; }
.stat-honey strong { display:block; font-size: 1.8rem; color: var(--color-primary-hover); }
.stat-honey span { display:block; color: var(--text-secondary); font-size: .92rem; }
.big-info-card { height: 100%; border-radius: 30px; padding: clamp(1.5rem, 4vw, 3rem); background: #fff; border: 1px solid color-mix(in srgb, var(--color-primary), transparent 72%); box-shadow: var(--shadow-sm); }
.big-info-card.dark { background: linear-gradient(135deg, #2c3e2b, #121212); color:#fff; }
.big-info-card.dark p { color: rgba(255,255,255,.78); }
.cta-panel.honey-cta { background: linear-gradient(135deg, var(--color-secondary), #121212); border-radius: 34px; }
.cta-panel.honey-cta .section-kicker, .cta-panel.honey-cta .section-title, .cta-panel.honey-cta p { color:#fff; }
.soft-alert { margin-top: 1.5rem; padding: 1rem 1.2rem; border-radius: 18px; background: #fff8e1; border: 1px solid #ffe082; color: #5d3f00; }
.contact-chip-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.contact-chip {
  display:grid; gap: .35rem; text-decoration:none; padding:1.15rem; border-radius: 24px; background:#fff; border:1px solid rgba(184,144,71,.24); box-shadow:var(--shadow-sm);
}
.contact-chip span { font-size:1.55rem; } .contact-chip strong { color:var(--text-primary); } .contact-chip em { color:var(--color-secondary); font-style:normal; font-weight:800; }
.social-honeycomb { display:grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: .8rem; }
.social-cell { display:grid; place-items:center; text-align:center; min-height: 150px; text-decoration:none; padding:1rem; color:var(--text-primary); background:#fff; border:1px solid rgba(184,144,71,.24); clip-path: polygon(25% 5%,75% 5%,100% 50%,75% 95%,25% 95%,0 50%); transition: transform .2s ease; }
.social-cell:hover { transform: translateY(-5px) rotate(-1deg); color:var(--color-secondary); }
.social-cell span { font-size:1.8rem; font-weight:900; color:var(--color-primary-hover); }
.social-cell strong { font-size:.95rem; }
.museo-footer { background: #15130f; color: rgba(255,255,255,.78); }
.museo-footer h2, .museo-footer strong, .museo-footer a { color: #fff; }
.footer-micro { color: #f7d978; font-weight: 800; }
.redirect-page { padding: 3rem; font-family: system-ui, sans-serif; }
.text-balance { text-wrap: balance; }

@media (max-width: 1199.98px) {
  .navbar-nav { padding-block: 1rem; }
  .navbar-nav .nav-link { border-radius: 14px; padding-block: .65rem !important; }
  .honey-dropdown { box-shadow: none; border-radius: 16px; }
}
@media (max-width: 991.98px) {
  .visit-strip, .honey-grid, .contact-chip-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .social-honeycomb { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .museo-home-hero { min-height: auto; }
}
@media (max-width: 575.98px) {
  .museo-brand span { display:none; }
  .museo-brand img { width: 50px; height: 50px; }
  .visit-strip, .honey-grid, .contact-chip-grid, .stat-honey { grid-template-columns: 1fr; }
  .social-honeycomb { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .social-cell { min-height: 125px; }
  .hero, .page-hero { padding-top: 6.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .honey-card, .social-cell { transition: none; }
}


/* Ajuste 20260630-v9: los temas visuales deben verse en el encabezado y menús APIS. */
.site-header.museo-header,
.honey-dropdown,
.site-header .dropdown-menu {
  background-color: var(--bg-card);
  color: var(--text-primary);
}

.site-header .dropdown-menu {
  border-color: var(--border-default);
}

.site-header .nav-link:hover,
.site-header .nav-link.active,
.dropdown-item:hover {
  background: color-mix(in srgb, var(--color-primary), transparent 88%);
}

html:not([data-theme="default"]) .hero::before,
html:not([data-theme="default"]) .page-hero::before {
  background-image:
    linear-gradient(30deg, color-mix(in srgb, var(--color-primary), transparent 86%) 12%, transparent 12.5%, transparent 87%, color-mix(in srgb, var(--color-primary), transparent 86%) 87.5%, color-mix(in srgb, var(--color-primary), transparent 86%)),
    linear-gradient(150deg, color-mix(in srgb, var(--color-primary), transparent 86%) 12%, transparent 12.5%, transparent 87%, color-mix(in srgb, var(--color-primary), transparent 86%) 87.5%, color-mix(in srgb, var(--color-primary), transparent 86%)),
    linear-gradient(30deg, color-mix(in srgb, var(--color-primary), transparent 86%) 12%, transparent 12.5%, transparent 87%, color-mix(in srgb, var(--color-primary), transparent 86%) 87.5%, color-mix(in srgb, var(--color-primary), transparent 86%)),
    linear-gradient(150deg, color-mix(in srgb, var(--color-primary), transparent 86%) 12%, transparent 12.5%, transparent 87%, color-mix(in srgb, var(--color-primary), transparent 86%) 87.5%, color-mix(in srgb, var(--color-primary), transparent 86%));
}