:root {
  --vt-forest: #174f3a;
  --vt-green: #23845e;
  --vt-mint: #e9f5ef;
  --vt-cream: #fbfaf5;
  --vt-ink: #173129;
  --vt-muted: #64736d;
  --vt-line: #dfe9e3;
  --vt-shadow: 0 16px 45px rgba(29, 72, 55, .09);
}

body { background: var(--vt-cream); color: var(--vt-ink); }
.container, .container-xl { max-width: 1240px; }
.vt-desktop-header { background: rgba(255,255,255,.96); }
.header-brand { min-height: 112px; padding-inline: 0 !important; }
.header-brand .logo { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.header-brand .logo img { max-height: 54px; width: auto; object-fit: contain; }
.vt-brand-promise { color: var(--vt-muted); font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.vt-trust-strip { background: var(--vt-forest); color: #fff; font-size: .82rem; padding: 8px 0; }
.vt-trust-points { display: flex; gap: 20px; opacity: .86; }
.vt-trust-points span::before { content: '✓'; color: #aee1c6; margin-right: 6px; }

#sticky-menu-wrapper { top: 0; }
.mega-menu-wrapper { background: rgba(255,255,255,.97) !important; border: 0 !important; box-shadow: 0 8px 30px rgba(21,65,49,.08) !important; }
.mega-menu-wrapper .navbar { min-height: 68px; }
.mega-menu-wrapper .navbar-nav { gap: 4px; }
#mega-menu-wrapper .navbar-nav > .nav-item > .nav-link {
  display: flex; align-items: center; gap: 8px; padding: 10px 12px !important;
  border-radius: 12px; color: var(--vt-ink) !important; font-size: .92rem; font-weight: 650;
}
#mega-menu-wrapper .navbar-nav > .nav-item > .nav-link:hover,
#mega-menu-wrapper .navbar-nav > .active > .nav-link { background: var(--vt-mint); color: var(--vt-forest) !important; }
#mega-menu-wrapper .navbar-nav > .active > .nav-link::after,
#mega-menu-wrapper .navbar-nav .nav-item.dropdown:hover .nav-link::after,
#mega-menu-wrapper .navbar-nav > .nav-item > .nav-link:hover::after { display: none; }
.vt-nav-icon { width: 31px; height: 31px; flex: 0 0 31px; display: inline-grid; place-items: center; border-radius: 10px; color: var(--vt-green); background: var(--vt-mint); }
.vt-nav-icon svg { width: 19px; height: 19px; }
.vt-home-icon { color: #7a6845; background: #f4efe4; }
.search-icon-btn { width: 42px; height: 42px; border-radius: 13px !important; background: var(--vt-mint) !important; color: var(--vt-forest) !important; }

main { min-height: 55vh; }
.title-index { max-width: 1240px; margin: 32px auto 20px; padding: 0 12px; font-size: clamp(2rem, 4vw, 3.7rem); letter-spacing: -.045em; color: var(--vt-forest); }
.section, .sidebar-widget { background: #fff; border: 1px solid var(--vt-line); border-radius: 20px; box-shadow: var(--vt-shadow); padding: 22px; }
.section .section-title { border: 0; margin-bottom: 20px; }
.section .section-title .title { padding: 0; font-size: 1.25rem; font-weight: 750; color: var(--vt-forest); }
.post-item, .post-item-horizontal, .post-item-mid { border-radius: 16px; overflow: hidden; }
.post-item img, .post-item-horizontal img, .post-item-mid img { transition: transform .35s ease; }
.post-item:hover img, .post-item-horizontal:hover img, .post-item-mid:hover img { transform: scale(1.025); }
.badge-category { border-radius: 999px; background: var(--vt-green) !important; text-shadow: none; }

#footer { margin-top: 64px; background: #113b2d; color: rgba(255,255,255,.78); }
#footer .widget-title, #footer a { color: #fff; }
#footer .footer-inner { padding-top: 60px; }
.newsletter-inputs { background: rgba(255,255,255,.08); border-radius: 14px; padding: 5px; }
.newsletter-button { border-radius: 10px !important; background: #9dd7b7 !important; color: #113b2d !important; }

@media (max-width: 991.98px) {
  .mobile-header { background: rgba(255,255,255,.96); border-bottom: 1px solid var(--vt-line); box-shadow: 0 8px 30px rgba(21,65,49,.08) !important; }
  .mobile-header .header-logo img { max-height: 38px; width: auto; }
  .header-btn { color: var(--vt-forest); }
  .title-index { margin-top: 22px; font-size: 2.25rem; }
  .section, .sidebar-widget { padding: 16px; border-radius: 16px; }
  .vt-nav-icon { width: 28px; height: 28px; flex-basis: 28px; }
}

@media (max-width: 575.98px) {
  .container { padding-inline: 16px; }
  .title-index { padding-inline: 16px; font-size: 1.9rem; }
  .section { margin-bottom: 22px; box-shadow: 0 10px 28px rgba(29,72,55,.07); }
}