/* ============================================================
   Talentum — estilos complementarios (navbar con estados de
   scroll, menú móvil y layout base). El resto del diseño vive
   en talentum.css (Tailwind compilado + tokens).
   ============================================================ */

/* ─── Layout base ────────────────────────────────────────── */
.site-main { flex: 1 1 auto; }

/* ─── Navbar ─────────────────────────────────────────────── */
.site-header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 50;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background .5s var(--ease-smooth), border-color .5s var(--ease-smooth), backdrop-filter .5s var(--ease-smooth);
}
.site-header.scrolled {
  background: rgba(245, 242, 239, .95);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid #e0d9d4;
}

.nav-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 5rem;
}

/* Logo swap (dark hero ↔ scrolled) */
.site-logo { display: inline-flex; align-items: center; }
.site-logo img { height: 2rem; width: auto; transition: opacity .3s; }
.site-logo:hover img { opacity: .8; }
.logo-scrolled { display: none; }
.site-header.scrolled .logo-darkhero { display: none; }
.site-header.scrolled .logo-scrolled { display: block; }

/* Desktop nav links */
.site-nav { display: none; align-items: center; gap: 2.5rem; }
.nav-link {
  position: relative;
  font-family: var(--font-sans);
  font-size: .875rem;
  font-weight: 500;
  letter-spacing: .0125em;
  text-decoration: none;
  color: rgba(255, 255, 255, .7);
  transition: color .3s;
}
.nav-link:hover, .nav-link.active { color: #fff; }
.nav-link::after {
  content: "";
  position: absolute;
  left: 0; bottom: -.25rem;
  height: 1px; width: 0;
  background: #fff;
  transition: width .3s;
}
.nav-link:hover::after, .nav-link.active::after { width: 100%; }
.site-header.scrolled .nav-link { color: #3d3d3d; }
.site-header.scrolled .nav-link:hover,
.site-header.scrolled .nav-link.active { color: #6d1034; }
.site-header.scrolled .nav-link::after { background: #6d1034; }

/* Desktop CTA */
.nav-cta {
  display: none;
  align-items: center;
  font-family: var(--font-sans);
  font-size: .75rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .75rem 1.5rem;
  text-decoration: none;
  color: #fff;
  background: transparent;
  border: 1px solid rgba(255, 255, 255, .4);
  transition: all .3s;
}
.nav-cta:hover { background: rgba(255, 255, 255, .1); border-color: #fff; }
.site-header.scrolled .nav-cta { background: #6d1034; color: #f0ebe7; border-color: #6d1034; }
.site-header.scrolled .nav-cta:hover { background: #4e0b24; }

/* Mobile toggle */
.nav-toggle {
  display: flex;
  flex-direction: column;
  gap: .375rem;
  padding: .5rem;
  background: none;
  border: none;
  cursor: pointer;
}
.nav-toggle span { display: block; width: 1.5rem; height: 1px; background: #fff; transition: transform .3s, opacity .3s; }
.site-header.scrolled .nav-toggle span { background: #1a1a1a; }
.nav-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity: 0; }
.nav-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* Mobile menu */
.mobile-menu {
  background: #fff;
  border-top: 1px solid #e0d9d4;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height .3s, opacity .3s;
}
.mobile-menu.open { max-height: 30rem; opacity: 1; }
.mobile-inner { padding-top: 1.5rem; padding-bottom: 1.5rem; display: flex; flex-direction: column; gap: 1.25rem; }
.mobile-link { font-family: var(--font-sans); font-size: 1rem; letter-spacing: .0125em; text-decoration: none; color: #3d3d3d; transition: color .3s; }
.mobile-link.active { color: #6d1034; font-weight: 600; }
.mobile-cta { align-self: flex-start; margin-top: .5rem; }

@media (min-width: 768px) {
  .site-nav { display: flex; }
  .nav-cta { display: inline-flex; }
  .nav-toggle { display: none; }
  .mobile-menu { display: none; }
}

/* ─── WP editor content (legal pages) ────────────────────── */
.entry-content > * + * { margin-top: 1.25rem; }
.entry-content h2 { font-size: 1.75rem; margin-top: 2.5rem; }
.entry-content h3 { font-size: 1.25rem; margin-top: 2rem; }
.entry-content a { color: #6d1034; text-decoration: underline; }
.entry-content ul { list-style: disc; padding-left: 1.5rem; }
