/* ── Envest Consultants — Shared Styles ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, sans-serif; -webkit-font-smoothing: antialiased; background: #fff; color: #2f283d; }

/* ── Glass nav ── */
.glass-nav {
  background: rgba(255,255,255,0.92) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(47,40,61,0.1) !important;
}

/* ── Animations ── */
@keyframes heroIn   { from { opacity:0; transform:translateY(38px); } to { opacity:1; transform:translateY(0); } }
@keyframes bounce   { 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }
@keyframes fadeInUp { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }

.hero-animate   { animation: heroIn 0.9s ease forwards; }
.hero-animate-2 { animation: heroIn 0.9s 0.25s ease both; }
.hero-animate-3 { animation: heroIn 0.9s 0.5s  ease both; }
.hero-animate-4 { animation: heroIn 0.9s 0.75s ease both; }
.bounce { animation: bounce 2s ease-in-out infinite; }

/* ── Scroll fade-in ── */
.fade-up { opacity:0; transform:translateY(26px); transition: opacity .65s ease, transform .65s ease; }
.fade-up.visible { opacity:1; transform:translateY(0); }
.delay-1 { transition-delay:.1s; }
.delay-2 { transition-delay:.2s; }
.delay-3 { transition-delay:.3s; }
.delay-4 { transition-delay:.4s; }

/* ── Hero grid background ── */
.grid-bg {
  background-image: linear-gradient(rgba(47,40,61,0.045) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(47,40,61,0.045) 1px, transparent 1px);
  background-size: 60px 60px;
}

/* ── Mobile menu ── */
.mobile-menu { max-height:0; overflow:hidden; transition:max-height .35s ease; }
.mobile-menu.open { max-height:500px; }

/* ── Bento / card hovers ── */
.bento-card { transition: border-color .25s, box-shadow .25s, transform .2s; }
.bento-card:hover { border-color:rgba(0,162,121,0.4) !important; box-shadow:0 12px 40px rgba(0,162,121,0.08); transform:translateY(-2px); }
.bento-card:hover .card-icon { background:rgba(0,162,121,0.12) !important; }
.bento-card:hover .card-icon svg { stroke:#00a279 !important; }
.bento-card:hover .card-title { color:#00a279 !important; }

.case-card { transition: border-color .25s, box-shadow .25s, transform .2s; }
.case-card:hover { border-color:rgba(0,162,121,0.35) !important; box-shadow:0 16px 48px rgba(0,162,121,0.07); transform:translateY(-3px); }
.case-card:hover .card-title { color:#00a279 !important; }

.insight-card { transition: border-color .25s, box-shadow .25s, transform .2s; }
.insight-card:hover { border-color:rgba(0,162,121,0.35) !important; box-shadow:0 16px 48px rgba(0,162,121,0.07); transform:translateY(-3px); }
.insight-card:hover .card-title { color:#00a279 !important; }

/* ── Expertise panels ── */
.exp-panel { transition: border-color .25s, box-shadow .25s, opacity .25s; cursor:pointer; }
.exp-panel.active { border-color:rgba(0,162,121,0.4) !important; box-shadow:0 16px 48px rgba(0,162,121,0.08) !important; }
.exp-panel:not(.active) { opacity:0.5; }
.exp-panel .exp-items { max-height:0; overflow:hidden; transition:max-height .4s ease; }
.exp-panel.active .exp-items { max-height:400px; }
.exp-tab { transition: background .2s, color .2s, box-shadow .2s; }
.exp-tab.active { background:#00a279 !important; color:#fff !important; border-color:transparent !important; box-shadow:0 4px 12px rgba(0,162,121,0.25); }

/* ── Buttons ── */
.btn-green { transition: background .2s, transform .15s, box-shadow .2s; }
.btn-green:hover { background:#008f6b !important; transform:translateY(-1px); box-shadow:0 8px 24px rgba(0,162,121,0.28) !important; }
.btn-outline { transition: border-color .2s, background .2s; }
.btn-outline:hover { background:rgba(47,40,61,0.04) !important; }
.btn-white { transition: background .2s, transform .15s; }
.btn-white:hover { background:rgba(255,255,255,0.9) !important; transform:translateY(-1px); }

/* ── Carousel ── */
.fw-card-inner { transition: border-color .25s, box-shadow .2s, background .2s; }
.fw-card-inner:hover { border-color:rgba(0,162,121,0.4) !important; box-shadow:0 8px 28px rgba(0,162,121,0.1) !important; background:#fff !important; }
.carousel-btn { width:32px; height:32px; border-radius:4px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(47,40,61,0.18); color:#2f283d; transition: border-color .2s, background .2s, opacity .3s; }
.carousel-btn:hover { border-color:rgba(0,162,121,0.5); background:rgba(0,162,121,0.08); color:#00a279; }
.carousel-btn:disabled { opacity:0.3; pointer-events:none; }

/* ── Form ── */
.form-input { transition: border-color .2s, box-shadow .2s; outline:none; }
.form-input:focus { border-color:#00a279 !important; box-shadow:0 0 0 3px rgba(0,162,121,0.1); }

/* ── Footer logo ── */
.logo-footer { filter: brightness(0) invert(1); }

/* ── Page hero (sub-pages) ── */
.page-hero { padding: 120px 0 64px; background: #fff; position: relative; overflow: hidden; }
.page-hero::before {
  content:''; position:absolute; inset:0; pointer-events:none;
  background-image: linear-gradient(rgba(47,40,61,0.07) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(47,40,61,0.07) 1px, transparent 1px);
  background-size: 60px 60px;
}
.page-hero::after {
  content:''; position:absolute; top:-80px; right:-60px; width:420px; height:420px;
  pointer-events:none;
  background: linear-gradient(145deg, rgba(0,162,121,0.1), transparent 60%);
  filter: blur(60px);
}

/* ── Tag badge ── */
.tag { display:inline-flex; align-items:center; padding:3px 8px 3px 9px; border-radius:2px; font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; }
.tag-green { background:rgba(0,162,121,0.1); color:#00a279; border-left:2px solid rgba(0,162,121,0.55); }
.tag-dark  { background:rgba(47,40,61,0.07); color:rgba(47,40,61,0.68); border-left:2px solid rgba(47,40,61,0.22); }

/* ── Article / long-form content ── */
.article-body h2 { font-size:1.4rem; font-weight:700; color:#2f283d; margin:2.5rem 0 1rem; }
.article-body h3 { font-size:1.1rem; font-weight:600; color:#2f283d; margin:1.75rem 0 0.6rem; }
.article-body p  { color:rgba(47,40,61,0.7); line-height:1.85; margin-bottom:1.25rem; }
.article-body ul { margin:.75rem 0 1.25rem 1.5rem; list-style:disc; }
.article-body ul li { color:rgba(47,40,61,0.7); line-height:1.8; margin-bottom:.35rem; }
.article-body blockquote { border-left:3px solid #00a279; padding:.75rem 1.25rem; background:rgba(0,162,121,0.05); border-radius:0 8px 8px 0; margin:1.75rem 0; font-style:italic; color:rgba(47,40,61,0.68); }

/* ── Sidebar key-takeaways box ── */
.takeaways-box { background:rgba(0,162,121,0.06); border:1px solid rgba(0,162,121,0.2); border-radius:16px; padding:24px; }
.takeaways-box h4 { color:#00a279; font-weight:700; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:12px; }
.takeaways-box li { color:rgba(47,40,61,0.72); font-size:.875rem; line-height:1.7; margin-bottom:.5rem; padding-left:1rem; position:relative; }
.takeaways-box li::before { content:''; position:absolute; left:0; top:.65em; width:6px; height:6px; border-radius:50%; background:#00a279; }

/* ── Breadcrumb ── */
.breadcrumb a { color:rgba(47,40,61,0.55); font-size:.8rem; transition:color .2s; }
.breadcrumb a:hover { color:#00a279; }
.breadcrumb span { color:rgba(47,40,61,0.35); font-size:.8rem; margin:0 6px; }

/* ── Prevent decorative overflow from creating horizontal scroll ── */
html, body { overflow-x: hidden; }

/* ── Mobile ── */
@media (max-width: 767px) {
  /* Nav */
  #main-nav img { height: 40px !important; width: auto !important; }

  /* Hero — remove full-screen height and hide aurora blur elements.
     Chrome-based Android browsers allow will-change:transform + filter:blur()
     compositing layers to escape overflow:hidden, causing horizontal scroll. */
  #home { min-height: 0 !important; }
  #home .hero-parallax { display: none !important; }

  /* Page heroes (sub-pages) */
  .page-hero { padding: 90px 0 40px; }
  .page-hero h1 { font-size: 1.625rem !important; line-height: 1.25 !important; }

  /* Section vertical spacing */
  section.py-24 { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; }
  section.py-20 { padding-top: 3rem !important; padding-bottom: 3rem !important; }
  section.py-14 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; }
  .mb-14 { margin-bottom: 2rem !important; }
  .mb-12 { margin-bottom: 2rem !important; }

  /* Core offering cards — reduce inner padding */
  .oc-card .p-8 { padding: 1.25rem !important; }

  /* Footer */
  footer .grid { gap: 1.75rem !important; }

  /* Article body */
  .article-body h2 { font-size: 1.15rem; }
  .article-body p { font-size: .9rem; }

  /* Sidebar in article pages — stack below body on mobile */
  .lg\:grid-cols-3 { display: block !important; }
  .lg\:col-span-2 { width: 100% !important; }

  /* Utilities */
  .glass-nav { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
  .takeaways-box { padding: 16px; }
  .exp-panel .exp-items { max-height: none !important; overflow: visible !important; }

  /* Stats numbers */
  .text-4xl { font-size: 2rem !important; }
  .text-5xl { font-size: 2.25rem !important; }

  /* All headings — prevent overflow if a word is unusually long */
  h1, h2, h3 { word-break: break-word; }
}
