/* Mensual — header & navigation */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(246,247,242,.92); backdrop-filter: saturate(160%) blur(10px); -webkit-backdrop-filter: saturate(160%) blur(10px); border-bottom: 1px solid var(--line); }
.header-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; }
.logo { display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-size: 22px; color: var(--ink); text-decoration: none; font-weight: 600; }
.logo-mark { width: 32px; height: 32px; border-radius: 8px; background: var(--grad); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-family: var(--font-display); font-weight: 600; font-size: 16px; }
.logo:hover { text-decoration: none; }
.nav { display: none; gap: 28px; align-items: center; }
.nav a:not(.btn) { color: var(--ink); text-decoration: none; font-size: 15px; }
.nav a:not(.btn):hover { color: var(--teal); }
.nav .btn { padding: 10px 18px; min-height: 40px; font-size: 15px; }
.nav .btn-primary, .nav .btn-primary:hover { color: #fff; }
.burger { display: inline-flex; flex-direction: column; gap: 5px; width: 44px; height: 44px; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--line); border-radius: 12px; }
.burger span { width: 22px; height: 2px; background: var(--ink); border-radius: 2px; transition: transform .2s; }
.mobile-nav { display: none; padding: 12px 0 24px; border-top: 1px solid var(--line); }
.mobile-nav.open { display: block; }
.mobile-nav a:not(.btn) { display: block; padding: 12px 0; font-size: 17px; color: var(--ink); text-decoration: none; border-bottom: 1px solid var(--line); }
.mobile-nav .btn { margin-top: 16px; width: 100%; }
.mobile-nav .btn-primary, .mobile-nav .btn-primary:hover { color: #fff; }
@media (min-width: 1024px) {
  .nav { display: inline-flex; }
  .burger { display: none; }
  .mobile-nav { display: none !important; }
}

.breadcrumbs { padding: 16px 0; font-size: 14px; color: var(--muted); }
.breadcrumbs a { color: var(--muted); text-decoration: none; }
.breadcrumbs a:hover { color: var(--teal); text-decoration: underline; }
.breadcrumbs .sep { margin: 0 8px; opacity: .5; }