/* Force Philosopher font globally across all elements with a slightly increased base size */
* {
  font-family: 'Philosopher', Georgia, serif;
  font-size: 103%;
}
/* 1. Make standard page text solid black and sharp */
body, p, h1, h2, h3, h4, h5, h6, span {
  color: #000000 !important;
  text-shadow: none !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 2. Keep text inside dark green buttons and banners crisp white */
button[class*="bg-[#17371f]"], 
button[class*="bg-[#234b2a]"], 
a[class*="bg-[#17371f]"], 
a[class*="bg-[#234b2a]"],
[class*="bg-[#17371f]"] *, 
[class*="bg-[#234b2a]"] * {
  color: #ffffff !important;
}

/* 3. Soften background glass blur slightly for clarity */
.backdrop-blur-md, .backdrop-blur-sm {
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
}

/* Ensure FAQ items match the standard page font size and crisp black color */
#faq-container h3 {
  font-size: 1.25rem !important; /* Matches standard section headings */
  line-height: 1.75rem !important;
}

#faq-container p {
  font-size: 1.125rem !important; /* Matches standard body text size (18px / text-lg) */
  line-height: 1.75rem !important;
}
/* Full-bleed background canvas */
#sky-canopy-canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  display: block;
  pointer-events: none;
}

/* Clear, Shadow-Free Typography Wrappers with Frosted Glass Contrast Cards */
.content-card {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(28, 62, 35, 0.12);
  box-shadow: 0 10px 30px rgba(10, 30, 15, 0.08);
  border-radius: 1.5rem;
  padding: 2.5rem;
  width: 100%;
}

/* Sleek LinkedIn-Inspired Top Bar */
.linkedin-navbar {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(16, 45, 22, 0.12);
  box-shadow: 0 4px 20px rgba(10, 30, 15, 0.06);
}

/* LinkedIn-style vertical icon + text tab */
.li-nav-item {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  color: #3b5641;
  transition: color 0.2s ease, transform 0.15s ease;
  cursor: pointer;
  min-width: 58px;
}

.li-nav-item:hover {
  color: #0b2210;
}

.li-nav-item svg {
  transition: transform 0.2s ease, stroke 0.2s ease;
}

.li-nav-item:hover svg {
  transform: translateY(-1.5px);
  stroke: #0a1f0e;
}

/* Active Indicator Line */
.li-nav-item.active::after {
  content: '';
  position: absolute;
  bottom: -7px;
  left: 0;
  width: 100%;
  height: 2px;
  background: #14351b;
  border-radius: 9999px;
}

.li-nav-item.active {
  color: #081a0c;
}

/* Box-free button with organic underline highlight */
.btn-pure {
  position: relative;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.btn-pure::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 100%;
  height: 1.5px;
  background: currentColor;
  transition: transform 0.25s ease;
  transform-origin: right;
  transform: scaleX(0.4);
}
.btn-pure:hover::after {
  transform-origin: left;
  transform: scaleX(1);
}

/* Interactive Filter Chip */
.filter-chip {
  transition: all 0.2s ease;
  border-radius: 9999px;
  cursor: pointer;
  user-select: none;
}
.filter-chip.active {
  background-color: #173b20;
  color: #ffffff;
  box-shadow: 0 2px 10px rgba(10, 35, 15, 0.2);
}

/* Slow, Full-Screen Flight from Right Side to Left Side */
@keyframes flightFromRight {
  0% {
    transform: translateX(65vw) translateY(-8px) rotate(16deg) scale(0.4);
    opacity: 0;
  }
  30% {
    opacity: 0.85;
  }
  75% {
    transform: translateX(-15vw) translateY(3px) rotate(-3deg) scale(1.03);
  }
  90% {
    transform: translateX(3vw) translateY(-1px) rotate(1deg) scale(0.98);
  }
  100% {
    transform: translateX(0) translateY(0) rotate(0deg) scale(1);
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% { opacity: 0; transform: translateX(10px); }
  100% { opacity: 1; transform: translateX(0); }
}

.animate-flight-from-right {
  animation: flightFromRight 4s cubic-bezier(0.25, 0.9, 0.3, 1) forwards;
}

.animate-fade-in {
  animation: fadeIn 1.2s ease-out 1.5s forwards;
  opacity: 0;
}

/* Continuous Right-to-Left Marquee Ticker Animation */
@keyframes marquee {
  0% { transform: translateX(0%); }
  100% { transform: translateX(-25%); }
}

.animate-marquee {
  display: flex;
  width: max-content;
  animation: marquee 20s linear infinite;
}

.animate-marquee:hover {
  animation-play-state: paused;
}

html {
  scroll-behavior: smooth;
}

::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(28, 56, 33, 0.3);
  border-radius: 9999px;
}

/* Custom Cursor Bubble Styles */
body {
  /* Optional: uncomment the line below if you want to hide the default arrow pointer */
  /* cursor: none; */
}

/* Ensure links still show pointer event behavior */
a, button, [role="button"] {
  /* cursor: pointer; */
}