/* ============================================
   HCS Wildlife Management — Shared Styles
   ============================================ */

/* === Base === */
html { scroll-behavior: smooth; }
body { font-family: 'Manrope', sans-serif; }
::selection { background: #4A7C3F; color: #F8FAF7; }

/* === Reveal Animations === */
.reveal {
    opacity: 0; transform: translateY(28px);
    transition: opacity 0.7s cubic-bezier(.16,1,.3,1), transform 0.7s cubic-bezier(.16,1,.3,1);
}
.reveal.visible { opacity: 1; transform: translateY(0); }
.rd1 { transition-delay: .1s }
.rd2 { transition-delay: .2s }
.rd3 { transition-delay: .3s }
.rd4 { transition-delay: .4s }

/* === Navigation — Transparent (homepage hero) === */
.nav-solid {
    background: rgba(248,250,247,0.96) !important;
    backdrop-filter: blur(14px);
    box-shadow: 0 1px 15px rgba(26,36,16,0.06);
}
.nav-solid .nav-logo,
.nav-solid .nav-link { color: #1C2B1A !important; }
.nav-solid .nav-cta { background: #4A7C3F !important; color: white !important; }
.nav-solid .nav-dropdown-btn { color: #1C2B1A !important; }
.nav-solid .nav-icon { color: #1C2B1A !important; }

/* === Navigation — Always solid (subpages) === */
.page-nav {
    background: rgba(248,250,247,0.96);
    backdrop-filter: blur(14px);
    box-shadow: 0 1px 15px rgba(26,36,16,0.06);
}
.page-nav .nav-logo,
.page-nav .nav-link { color: #1C2B1A; }
.page-nav .nav-cta { background: #4A7C3F; color: white; }
.page-nav .nav-dropdown-btn { color: #1C2B1A; }
.page-nav .nav-icon { color: #1C2B1A; }

/* === Nav Dropdown === */
.nav-dropdown {
    opacity: 0; visibility: hidden; transform: translateY(8px);
    transition: opacity .2s, visibility .2s, transform .2s;
}
.nav-dropdown-trigger:hover .nav-dropdown,
.nav-dropdown-trigger:focus-within .nav-dropdown {
    opacity: 1; visibility: visible; transform: translateY(0);
}

/* Active nav link */
.nav-link[aria-current="page"] { color: #4A7C3F !important; }
.nav-solid .nav-link[aria-current="page"] { color: #4A7C3F !important; }
.page-nav .nav-link[aria-current="page"] { color: #4A7C3F !important; }

/* === Buttons === */
.btn-forest { transition: background .3s, box-shadow .3s, transform .2s; }
.btn-forest:hover { background: #3A6230; box-shadow: 0 6px 20px rgba(74,124,63,.3); transform: translateY(-1px); }
.btn-midnight { transition: background .3s, box-shadow .3s, transform .2s; }
.btn-midnight:hover { background: #243318; box-shadow: 0 6px 20px rgba(26,36,16,.2); transform: translateY(-1px); }

/* === Mobile Menu === */
.mob-menu {
    transform: translateX(100%);
    transition: transform .4s cubic-bezier(.16,1,.3,1);
}
.mob-menu.open { transform: translateX(0); }

/* === Service Card === */
.service-card { transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
.service-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(26,36,16,.10); }

/* === Immersive Band === */
.immersive-band {
    min-height: 50vh; background-size: cover;
    background-position: center; background-attachment: fixed;
}
@media (max-width: 768px) {
    .immersive-band { background-attachment: scroll; min-height: 40vh; }
}

/* === Page Hero (subpages) === */
.page-hero {
    padding-top: 140px; padding-bottom: 80px;
    background-size: cover; background-position: center;
    position: relative;
}

/* === Feature Card === */
.feature-card {
    transition: transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s;
}
.feature-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(26,36,16,.08);
}

/* === Form Inputs === */
.form-input {
    width: 100%; padding: 0.75rem 1rem; border-radius: 0.75rem;
    border: 1px solid #DDE5DA; background: #F8FAF7; color: #1C2B1A;
    transition: border-color .2s, box-shadow .2s;
    font-family: 'Manrope', sans-serif;
}
.form-input:focus {
    outline: none; border-color: #4A7C3F;
    box-shadow: 0 0 0 3px rgba(74,124,63,0.1);
}

/* === Scroll Progress Bar (homepage) === */
#scrollProgress {
    position: fixed; top: 0; left: 0; height: 3px; z-index: 100;
    background: linear-gradient(90deg, #4A7C3F, #8B6914);
    width: 0%; transition: width 0.05s linear;
}