/* ─── Reset & Base ─── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { min-height: 100vh; }
img { max-width: 100%; display: block; }
a { text-decoration: none; color: inherit; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }
input, select, textarea { font-family: inherit; font-size: inherit; }

/* ─── Skip Link ─── */
.skip-link {
    position: absolute; top: -100%; left: 1rem;
    background: #064e3b; color: #fefdf8; padding: 0.75rem 1.5rem;
    border-radius: 0 0 0.5rem 0.5rem; z-index: 100; font-weight: 500;
    transition: top 0.2s;
}
.skip-link:focus { top: 0; }

/* ─── Nav Links ─── */
.nav-link { position: relative; }
.nav-link::after {
    content: ''; position: absolute; bottom: -4px; left: 0;
    width: 0; height: 1.5px; background: #059669;
    transition: width 0.3s ease;
}
.nav-link:hover::after { width: 100%; }

/* ─── Mobile Menu ─── */
.mobile-nav-link {
    border-bottom: 1px solid rgba(6, 78, 59, 0.08);
    padding-bottom: 0.75rem;
    transition: color 0.2s, padding-left 0.2s;
}
.mobile-nav-link:hover { color: #059669; padding-left: 0.5rem; }

/* ─── Buttons ─── */
.btn-primary-emerald {
    background: #059669; color: #fefdf8;
    border-radius: 9999px; font-weight: 500;
    transition: background 0.3s, transform 0.2s, box-shadow 0.3s;
    display: inline-flex; align-items: center; justify-content: center;
}
.btn-primary-emerald:hover {
    background: #047857; transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(5, 150, 105, 0.3);
}
.btn-outline-cream {
    background: transparent; color: #fefdf8;
    border: 1.5px solid rgba(253, 250, 232, 0.4);
    border-radius: 9999px; font-weight: 500;
    transition: background 0.3s, border-color 0.3s, transform 0.2s;
    display: inline-flex; align-items: center; justify-content: center;
}
.btn-outline-cream:hover {
    background: rgba(253, 250, 232, 0.1);
    border-color: rgba(253, 250, 232, 0.7);
    transform: translateY(-2px);
}
.btn-cream-emerald {
    background: #fefdf8; color: #064e3b;
    border-radius: 9999px; font-weight: 500;
    transition: background 0.3s, transform 0.2s, box-shadow 0.3s;
    display: inline-flex; align-items: center; justify-content: center;
}
.btn-cream-emerald:hover {
    background: #f5e6cc; transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

/* ─── Section Eyebrow & Title ─── */
.section-eyebrow { letter-spacing: 0.25em; }
.section-title { }

/* ─── Service Cards ─── */
.service-card { padding: 1rem 0; border-bottom: 1px solid rgba(6, 78, 59, 0.08); }
.service-card:last-child { border-bottom: none; }

/* ─── Input Fields ─── */
.input-field {
    border: 1.5px solid rgba(6, 78, 59, 0.15);
    border-radius: 0.75rem; padding: 0.875rem 1rem;
    color: #064e3b; background: #fefdf8;
    transition: border-color 0.3s, box-shadow 0.3s;
    outline: none; width: 100%;
}
.input-field::placeholder { color: rgba(6, 78, 59, 0.3); }
.input-field:focus {
    border-color: #059669;
    box-shadow: 0 0 0 3px rgba(5, 150, 105, 0.1);
}

/* ─── Scroll Reveal (progressive enhancement) ─── */
@media (prefers-reduced-motion: no-preference) {
    .reveal {
        opacity: 0;
        transform: translateY(32px);
        transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .reveal.revealed {
        opacity: 1;
        transform: translateY(0);
    }
    .reveal:nth-child(2) { transition-delay: 0.1s; }
    .reveal:nth-child(3) { transition-delay: 0.2s; }
}

/* ─── Hero Animations ─── */
@media (prefers-reduced-motion: no-preference) {
    .hero-eyebrow {
        animation: fadeSlideUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.2s both;
    }
    .hero-title {
        animation: fadeSlideUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.4s both;
    }
    .hero-subtitle {
        animation: fadeSlideUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.6s both;
    }
    .hero-ctas {
        animation: fadeSlideUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.8s both;
    }
}

@keyframes fadeSlideUp {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ─── Gallery Hover ─── */
.gallery-item { overflow: hidden; }
.gallery-item img { transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1); }
.gallery-item:hover img { transform: scale(1.05); }

/* ─── Testimonial Cards ─── */
.testimonial-card {
    transition: transform 0.3s, box-shadow 0.3s;
}
.testimonial-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(6, 78, 59, 0.1);
}
