body { font-family: 'Inter', system-ui, sans-serif; background:#FEFCF8; color:#1B2B24; }
.font-display { font-family: 'Fraunces', Georgia, serif; }
html { scroll-behavior: smooth; }
::selection { background: rgba(232,166,59,0.45); color:#173A2E; }

/* ---------- Header ---------- */
header.scrolled { box-shadow: 0 10px 30px -18px rgba(23,58,46,0.35); }
.nav-link { position:relative; padding-bottom:2px; }
.nav-link::after { content:''; position:absolute; left:0; right:100%; bottom:-3px; height:2px; background:#D9573B; border-radius:2px; transition: right .25s cubic-bezier(.4,0,.2,1); }
.nav-link:hover::after { right:0; }

/* ---------- Buttons ---------- */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.55rem; font-weight:600; border-radius:9999px; transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease; white-space:nowrap; }
.btn:active { transform: scale(.97); }
.btn-gold { background:#E8A63B; color:#0F2721; box-shadow: 0 12px 28px -12px rgba(232,166,59,0.55); }
.btn-gold:hover { background:#D0912B; transform: translateY(-2px); box-shadow: 0 16px 32px -12px rgba(232,166,59,0.6); }
.btn-dark { background:#173A2E; color:#FEFCF8; box-shadow: 0 10px 24px -12px rgba(23,58,46,0.45); }
.btn-dark:hover { background:#1C4433; transform: translateY(-2px); }
.btn-outline-light { border:1.5px solid rgba(254,252,248,0.26); color:#FEFCF8; }
.btn-outline-light:hover { background: rgba(254,252,248,0.08); border-color: rgba(254,252,248,0.4); }

/* ---------- Decorative touches ---------- */
.wave-divider { display:block; width:100%; height:56px; }
.pillar-index { font-family:'Fraunces', Georgia, serif; font-size:3rem; line-height:1; color:#173A2E; opacity:.08; font-weight:600; }
.get-involved-card { transition: transform .2s ease, box-shadow .2s ease; }
.get-involved-card:hover { transform: translateY(-4px); box-shadow: 0 20px 44px -18px rgba(23,58,46,0.3); }

/* ---------- Hero: coastal dusk over Likoni ---------- */
.hero-foundation {
  background:
    radial-gradient(120% 90% at 15% -10%, rgba(232,166,59,0.20) 0%, transparent 55%),
    radial-gradient(100% 80% at 100% 110%, rgba(217,87,59,0.16) 0%, transparent 55%),
    linear-gradient(160deg, #173A2E 0%, #0F2721 68%, #0B1D18 100%);
}
.grain::after {
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- Emblem (logo) ---------- */
.emblem { display:inline-flex; align-items:center; justify-content:center; border-radius:9999px; background: radial-gradient(120% 120% at 30% 20%, #3C7458 0%, #173A2E 65%); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08); }
.logo-plate { display:inline-flex; align-items:center; justify-content:center; background:#FEFCF8; border-radius:22px; padding:14px 20px; box-shadow: 0 2px 6px rgba(23,58,46,0.06), 0 16px 40px -14px rgba(23,58,46,0.35); }
.logo-plate-sm { border-radius:14px; padding:8px 12px; }

/* ---------- Section rhythm ---------- */
.eyebrow { display:inline-flex; align-items:center; gap:.55rem; letter-spacing:.14em; }
.eyebrow::before { content:''; width:22px; height:2px; background:currentColor; display:inline-block; border-radius:2px; }

.wave-top { display:block; width:100%; height:auto; }

/* ---------- Value & pillar cards ---------- */
.value-card { background:#fff; border:1px solid rgba(23,58,46,0.08); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.value-card:hover { transform: translateY(-3px); box-shadow: 0 16px 40px -16px rgba(23,58,46,0.28); border-color: rgba(232,166,59,0.4); }

.pillar-card { position:relative; overflow:hidden; }
.pillar-card::before { content:''; position:absolute; inset:0; background: linear-gradient(160deg, rgba(232,166,59,0.10), transparent 55%); opacity:0; transition: opacity .25s ease; }
.pillar-card:hover::before { opacity:1; }

/* ---------- Motion ---------- */
.fade-up { animation: fadeUp .7s cubic-bezier(.16,1,.3,1) both; }
@keyframes fadeUp { from { opacity:0; transform: translateY(18px); } to { opacity:1; transform:none; } }
.stagger > * { opacity:0; animation: fadeUp .6s cubic-bezier(.16,1,.3,1) both; }
.stagger > *:nth-child(1) { animation-delay: .02s; } .stagger > *:nth-child(2) { animation-delay: .09s; }
.stagger > *:nth-child(3) { animation-delay: .16s; } .stagger > *:nth-child(4) { animation-delay: .23s; }
.stagger > *:nth-child(5) { animation-delay: .30s; } .stagger > *:nth-child(6) { animation-delay: .37s; }
.stagger > *:nth-child(7) { animation-delay: .44s; }

.sunray { transform-box: fill-box; transform-origin: 50% 50%; animation: spin 60s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

::-webkit-scrollbar { width: 10px; } ::-webkit-scrollbar-thumb { background:#D6E8DB; border-radius:8px; }

@media (prefers-reduced-motion: reduce) {
  .sunray { animation: none; }
  .fade-up, .stagger > * { animation: none !important; opacity:1 !important; transform:none !important; }
}