:root {
  /* Brand Colors */
  --v2-navy: #0A192F;
  --v2-navy-light: #1E293B;
  --v2-slate-dark: #0F172A;
  --v2-slate-body: #0F172A;
  --v2-slate-muted: #334155;
  
  --v2-brown: #8B4513;
  --v2-brown-dark: #6B3310;
  --v2-brown-bg: #FAF4F0;
  --v2-brown-border: #F5E8DD;

  --v2-teal: #0A192F;
  --v2-teal-light: #F8FAFC;
  
  --v2-bg-canvas: #FAFAFA;
  --v2-bg-surface: #FFFFFF;
  --v2-bg-alt: #F8FAFC;
  
  --v2-border: #E2E8F0;
  --v2-border-dark: #CBD5E1;

  /* Typography */
  --v2-font-serif: 'Lora', Georgia, serif;
  --v2-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --v2-font-display: 'Plus Jakarta Sans', sans-serif;

  /* Harmonize legacy CSS variables */
  --primary-color: #8B4513;
  --primary-rgb: 139, 69, 19;
  --theme: #8B4513;
  --theme-color: #8B4513;
  --theme-2: #0A192F;
  --header-color: #0A192F;
  --base: #8B4513;
}

body {
  font-family: var(--v2-font-sans);
  color: var(--v2-slate-body);
  background-color: var(--v2-bg-canvas);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

p {
  color: #0F172A;
}

.text-secondary {
  color: #334155 !important;
}

.text-muted {
  color: #334155 !important;
}

.hero-section {
  padding: 3.5rem 0 3.5rem !important;
}

/* Inner hero and dark hero styling */
.inner-hero-section {
  padding: 3rem 0 !important;
}

.inner-hero-texture {
  background-image: radial-gradient(circle, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
  background-size: 24px 24px;
  pointer-events: none;
}

.hero-section::before,
.hero-section::after,
.inner-hero-section::before,
.inner-hero-section::after {
  display: none !important;
  background: none !important;
  content: none !important;
}

/* Force white text inside dark hero sections */
.hero-section h1,
.hero-section .font-serif-heading,
.inner-hero-section h1,
.inner-hero-section h2,
.inner-hero-section h3,
.inner-hero-section .h1,
.inner-hero-section .h2,
.inner-hero-section .h3,
.inner-hero-section .font-serif-heading {
  color: #FFFFFF !important;
}

.hero-section .editorial-lead,
.inner-hero-section p,
.inner-hero-section .editorial-lead {
  color: #E8B96A !important;
}

h1, h2, h3, .h1, .h2, .h3, .font-serif-heading {
  font-family: var(--v2-font-serif);
  color: var(--v2-slate-dark);
  font-weight: 600;
  letter-spacing: -0.015em;
}

h4, h5, h6, .h4, .h5, .h6 {
  font-family: var(--v2-font-display);
  color: var(--v2-slate-dark);
  font-weight: 700;
}

.editorial-eyebrow {
  display: inline-block;
  font-family: var(--v2-font-display);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--v2-brown);
  margin-bottom: 0.5rem;
}

.editorial-eyebrow.teal {
  color: var(--v2-navy);
}

.editorial-eyebrow.navy {
  color: var(--v2-navy);
}

.editorial-lead {
  font-size: 1.125rem;
  line-height: 1.7;
  color: var(--v2-slate-dark);
  font-weight: 400;
}

.editorial-stat-num {
  font-family: var(--v2-font-serif);
  font-size: 2.25rem;
  font-weight: 700;
  line-height: 1;
  color: var(--v2-brown);
}

.editorial-stat-label {
  font-family: var(--v2-font-display);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--v2-slate-muted);
  margin-top: 0.25rem;
}

.v2-editorial-card {
  background-color: var(--v2-bg-surface);
  border: 1px solid var(--v2-border);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.v2-editorial-card:hover {
  border-color: var(--v2-border-dark);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.editorial-quote {
  border: 1px solid var(--v2-brown-border);
  background-color: var(--v2-brown-bg);
  padding: 1.5rem;
  border-radius: 6px;
  font-family: var(--v2-font-serif);
  font-style: italic;
  color: var(--v2-slate-dark);
}

.editorial-rule {
  border: none;
  height: 3px;
  background-color: var(--v2-brown);
  width: 64px;
  margin: 1rem 0 1.5rem 0;
  opacity: 1;
}

.btn-v2-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--v2-brown);
  color: #FFFFFF !important;
  font-family: var(--v2-font-display);
  font-weight: 600;
  font-size: 0.875rem;
  padding: 0.625rem 1.5rem;
  border-radius: 4px;
  border: 1px solid var(--v2-brown);
  text-decoration: none;
  transition: all 0.15s ease-in-out;
}

.btn-v2-primary:hover {
  background-color: var(--v2-brown-dark);
  border-color: var(--v2-brown-dark);
  color: #FFFFFF !important;
}

.btn-v2-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  color: var(--v2-navy) !important;
  font-family: var(--v2-font-display);
  font-weight: 600;
  font-size: 0.875rem;
  padding: 0.625rem 1.5rem;
  border-radius: 4px;
  border: 1px solid var(--v2-border-dark);
  text-decoration: none;
  transition: all 0.15s ease-in-out;
}

.btn-v2-outline:hover {
  background-color: var(--v2-bg-alt);
  border-color: var(--v2-navy);
  color: var(--v2-navy) !important;
}

.v2-header {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid var(--v2-border) !important;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.04) !important;
}

.header-main .main-menu ul li a,
.v2-header .nav-link {
  background-color: transparent !important;
  background: transparent !important;
}

.header-main .main-menu ul li a:hover,
.header-main .main-menu ul li:hover > a,
.v2-header .nav-link:hover,
.v2-header .nav-link.active {
  color: var(--v2-brown) !important;
  background-color: transparent !important;
  background: transparent !important;
}

.header-main .main-menu ul li .submenu,
.v2-header .submenu {
  background-color: #FFFFFF !important;
  border: 1px solid var(--v2-border) !important;
  border-radius: 6px !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.1) !important;
  padding: 4px 0 !important;
}

.header-main .main-menu ul li .submenu li a,
.v2-header .submenu li a {
  color: var(--v2-slate-dark) !important;
  font-size: 0.875rem !important;
  padding: 10px 18px !important;
  font-family: var(--v2-font-sans) !important;
  border-bottom: 1px solid #F1F5F9 !important;
  transition: all 0.15s ease-in-out !important;
}

.form-select {
  background-color: #FFFFFF !important;
  border: 1px solid var(--v2-border-dark) !important;
  border-radius: 4px !important;
  color: var(--v2-slate-dark) !important;
  font-family: var(--v2-font-sans) !important;
  font-size: 0.9375rem !important;
  padding: 0.75rem 2.5rem 0.75rem 1rem !important;
  cursor: pointer !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%230A192F' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 1rem center !important;
  background-size: 14px 10px !important;
}

.form-select:focus {
  border-color: var(--v2-brown) !important;
  box-shadow: 0 0 0 3px rgba(139, 69, 19, 0.12) !important;
  outline: none !important;
}

/* Universal Anchor Link Hover Styling */
a {
  color: var(--v2-brown);
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
}

a:hover {
  color: var(--v2-brown-dark);
}

.hover-brown:hover,
a.hover-brown:hover {
  color: var(--v2-brown) !important;
}

.v2-editorial-card a:not(.btn-v2-primary):not(.btn-v2-outline):hover {
  color: var(--v2-brown) !important;
}

.header-main .main-menu ul li .submenu li a:hover,
.v2-header .submenu li a:hover {
  background-color: var(--v2-brown-bg) !important;
  color: var(--v2-brown) !important;
}

/* Header & Logo Responsive Sizing */
.sticky-logo img {
  height: 40px;
  width: auto;
  max-height: 40px;
  object-fit: contain;
  transition: all 0.2s ease-in-out;
}

.offcanvas__logo img {
  height: 32px;
  width: auto;
  max-height: 32px;
  object-fit: contain;
}

/* Hide desktop menu on screens below 1200px and style mobile hamburger */
@media (max-width: 1199.98px) {
  .header-left,
  .mean__menu-wrapper,
  .main-menu,
  #mobile-menu {
    display: none !important;
  }
  
  .sticky-logo img {
    height: 34px !important;
    max-height: 34px !important;
  }
  
  .header__hamburger .sidebar__toggle {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background-color: #F8FAFC;
    border: 1px solid var(--v2-border);
    border-radius: 6px;
    color: var(--v2-navy) !important;
    transition: all 0.2s ease-in-out;
  }
  
  .header__hamburger .sidebar__toggle:hover {
    background-color: var(--v2-brown-bg);
    color: var(--v2-brown) !important;
    border-color: var(--v2-brown-border);
  }
}

@media (max-width: 575.98px) {
  .sticky-logo img {
    height: 30px !important;
    max-height: 30px !important;
  }

  .offcanvas__logo img {
    height: 28px !important;
    max-height: 28px !important;
  }
}

/* Offcanvas Drawer Palette Harmonization (Eliminate Legacy Teal/Greenish Accents) */
@media (min-width: 0px) {
  .offcanvas__info {
    background: #FFFFFF !important;
    border-left: 3px solid var(--v2-brown) !important;
    box-shadow: -10px 0 30px rgba(10, 25, 47, 0.15) !important;
  }
}

.offcanvas__wrapper .offcanvas__content .offcanvas__close {
  background-color: transparent !important;
  border: none !important;
  width: auto !important;
  height: auto !important;
  line-height: normal !important;
}

.offcanvas__wrapper .offcanvas__content .offcanvas__close button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 6px;
  background-color: #F8FAFC;
  border: 1px solid var(--v2-border);
  color: var(--v2-navy) !important;
  transition: all 0.15s ease-in-out;
}

.offcanvas__wrapper .offcanvas__content .offcanvas__close button:hover {
  background-color: var(--v2-brown-bg);
  border-color: var(--v2-brown-border);
  color: var(--v2-brown) !important;
}

.offcanvas__wrapper .offcanvas__content .offcanvas__close i {
  color: inherit !important;
}

.offcanvas__overlay {
  background-color: rgba(10, 25, 47, 0.6) !important;
  backdrop-filter: blur(2px);
}

/* Comprehensive Front-End Responsive & Touch Utilities */
.table-responsive {
  border-radius: 4px;
  -webkit-overflow-scrolling: touch;
}

.table-responsive::-webkit-scrollbar {
  height: 6px;
}

.table-responsive::-webkit-scrollbar-thumb {
  background: var(--v2-border-dark);
  border-radius: 3px;
}

.v2-editorial-card {
  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

@media (hover: hover) {
  .v2-editorial-card:hover {
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
  }
}

@media (max-width: 991.98px) {
  .hero-section,
  .inner-hero-section {
    padding: 2.25rem 0 !important;
  }

  .display-4 {
    font-size: 2.125rem !important;
    line-height: 1.2 !important;
  }

  .display-5 {
    font-size: 1.875rem !important;
    line-height: 1.25 !important;
  }

  .display-6 {
    font-size: 1.625rem !important;
    line-height: 1.3 !important;
  }

  .editorial-lead {
    font-size: 1rem !important;
    line-height: 1.65 !important;
  }

  .v2-editorial-card {
    padding: 1.25rem !important;
  }

  .offcanvas__info {
    width: 320px !important;
    max-width: 85vw !important;
  }
}

@media (max-width: 575.98px) {
  .hero-section,
  .inner-hero-section {
    padding: 1.75rem 0 !important;
  }

  .display-4 {
    font-size: 1.75rem !important;
    line-height: 1.25 !important;
  }

  .display-5 {
    font-size: 1.5rem !important;
    line-height: 1.3 !important;
  }

  .display-6 {
    font-size: 1.375rem !important;
    line-height: 1.35 !important;
  }

  .h1, h1 { font-size: 1.75rem !important; }
  .h2, h2 { font-size: 1.5rem !important; }
  .h3, h3 { font-size: 1.25rem !important; }
  .h4, h4 { font-size: 1.125rem !important; }

  .btn-v2-primary,
  .btn-v2-outline {
    width: 100% !important;
    margin-bottom: 0.5rem;
    padding: 0.625rem 1rem !important;
    text-align: center;
    justify-content: center;
  }

  /* Active Touch Feedback for Touch Devices */
  .v2-editorial-card:active,
  .btn-v2-primary:active,
  .btn-v2-outline:active {
    transform: scale(0.99);
    transition: transform 0.08s ease-in-out;
  }

  .h5, h5 { font-size: 1.15rem !important; }
  .h6, h6 { font-size: 0.95rem !important; }

  /* Touch Target Minimum Heights */
  .btn, button, input[type="text"], input[type="email"], select {
    min-height: 44px;
  }
}

/* Mobile & Tablet Specific Responsive Enhancements */
@media (max-width: 767.98px) {
  .hero-section,
  .inner-hero-section {
    padding: 2.25rem 0 !important;
  }

  .hero-section h1,
  .inner-hero-section h1 {
    font-size: 1.85rem !important;
    line-height: 1.22 !important;
  }

  .hero-section .editorial-lead,
  .inner-hero-section p,
  .inner-hero-section .editorial-lead {
    font-size: 1rem !important;
    line-height: 1.6 !important;
  }

  .scroll-up {
    right: 16px !important;
    bottom: 20px !important;
    width: 44px !important;
    height: 44px !important;
  }

  .scroll-up::after {
    line-height: 44px !important;
    font-size: 16px !important;
  }
}

@media (max-width: 575.98px) {
  .hero-section .d-flex.flex-wrap.gap-3,
  .inner-hero-section .d-flex.flex-wrap.gap-3 {
    flex-direction: column !important;
    width: 100% !important;
  }

  .hero-section .btn,
  .inner-hero-section .btn {
    width: 100% !important;
    justify-content: center !important;
  }

  .v2-editorial-card {
    padding: 1.25rem !important;
  }
}

/* ==========================================================================
   Subtle & Professional Micro-Animations (Institutional Minimalist)
   ========================================================================== */

/* Page Load Smooth Entry Fade-Up */
@keyframes v2FadeUp {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero-section,
.inner-hero-section {
  animation: v2FadeUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* Subtle Card & Item Hover Elevation */
.v2-editorial-card,
.border.rounded-1,
.p-4.border {
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.25s ease;
}

@media (hover: hover) {
  .v2-editorial-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06) !important;
    border-color: #CBD5E1 !important;
  }

  .btn-v2-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(124, 58, 24, 0.25);
  }

  .btn-v2-outline:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.08);
  }
}

/* Smooth Icon Micro-Interactions on Button Hover */
.btn-v2-primary i,
.btn-v2-outline i {
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-v2-primary:hover i.fa-arrow-right,
.btn-v2-outline:hover i.fa-arrow-right {
  transform: translateX(3px);
}

.btn-v2-primary:hover i.fa-arrow-left,
.btn-v2-outline:hover i.fa-arrow-left {
  transform: translateX(-3px);
}

/* Institutional Soft Heartbeat Pulse Animation */
@keyframes v2LogoHeartbeat {
  0% {
    transform: scale(1);
  }
  15% {
    transform: scale(1.08);
  }
  30% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.04);
  }
  60% {
    transform: scale(1);
  }
  100% {
    transform: scale(1);
  }
}

.logo-heartbeat {
  animation: v2LogoHeartbeat 2.8s ease-in-out infinite;
  transform-origin: center center;
  will-change: transform;
}

/* Brand-Aligned Scrollbar & Back-to-Top Indicator Overrides */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: #F1F5F9 !important;
  box-shadow: none !important;
}

::-webkit-scrollbar-thumb {
  background: #8B4513 !important;
  border-radius: 10px !important;
}

::-webkit-scrollbar-thumb:hover {
  background: #7A3010 !important;
}

/* Floating Back-to-Top Button (.scroll-up) */
.scroll-up {
  background: #FFFFFF !important;
  border: 1px solid #E2E8F0 !important;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.12) !important;
}

.scroll-up::after {
  color: #8B4513 !important;
}

.scroll-up svg.scroll-circle path {
  stroke: #8B4513 !important;
  stroke-width: 4px !important;
}