/* ===== RESET & BASE ===== */
*, *::before, *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --terracotta: #b55538;
    --terracotta-light: #f5e6e0;
    --sand: #fdf9f0;
    --cream: #faf6f0;
    --warm-gray-950: #25211c;
    --warm-gray-900: #453d34;
    --warm-gray-600: #847462;
    --warm-gray-400: #b8aa98;
    --warm-gray-200: #e8e2d9;
    --warm-gray-100: #f5f2ee;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

/* ===== HERO CLIP ===== */
.clip-diagonal {
    clip-path: polygon(30% 0, 100% 0, 100% 100%, 0% 100%);
}

/* ===== NAVBAR ===== */
.navbar-scrolled {
    background: rgba(250, 246, 240, 0.97) !important;
    backdrop-filter: blur(10px);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
}

.navbar-scrolled .nav-logo-color {
    color: #b55538 !important;
}

.navbar-scrolled .nav-text-color {
    color: #25211c !important;
}

.navbar-scrolled .nav-subtext-color {
    color: #847462 !important;
}

.navbar-scrolled .nav-link-color {
    color: #847462 !important;
}

.navbar-scrolled .nav-link-color:hover {
    color: #b55538 !important;
}

.navbar-scrolled .nav-cta-color {
    color: #faf6f0 !important;
}

.navbar-transparent .nav-logo-color {
    color: #25211c !important;
}

.navbar-transparent .nav-text-color {
    color: #25211c !important;
}

.navbar-transparent .nav-subtext-color {
    color: #9e8e7a !important;
}

.navbar-transparent .nav-link-color {
    color: #6b5d4e !important;
}

.navbar-transparent .nav-link-color:hover {
    color: #b55538 !important;
}

.navbar-transparent .nav-cta-color {
    color: #faf6f0 !important;
}

/* ===== HERO ANIMATIONS ===== */
.hero-eyebrow {
    animation: fadeSlideUp 0.8s ease forwards;
}

.hero-title {
    animation: fadeSlideUp 0.8s ease 0.15s forwards;
    opacity: 0;
}

.hero-description {
    animation: fadeSlideUp 0.8s ease 0.3s forwards;
    opacity: 0;
}

.hero-ctas {
    animation: fadeSlideUp 0.8s ease 0.45s forwards;
    opacity: 0;
}

.hero-trust {
    animation: fadeSlideUp 0.8s ease 0.6s forwards;
    opacity: 0;
}

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

/* ===== SECTION ANIMATIONS (below fold only) ===== */
.section-eyebrow,
.section-title,
.section-divider,
.about-eyebrow,
.about-title,
.about-divider,
.about-text,
.about-values,
.service-card,
.tech-card,
.testimonial-card {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: no-preference) {
    .section-eyebrow.reveal { animation: fadeSlideUp 0.7s ease forwards; }
    .section-title.reveal { animation: fadeSlideUp 0.7s ease 0.1s forwards; }
    .section-divider.reveal { animation: fadeSlideUp 0.7s ease 0.2s forwards; }
    .about-eyebrow.reveal { animation: fadeSlideUp 0.7s ease forwards; }
    .about-title.reveal { animation: fadeSlideUp 0.7s ease 0.1s forwards; }
    .about-divider.reveal { animation: fadeSlideUp 0.7s ease 0.2s forwards; }
    .about-text.reveal { animation: fadeSlideUp 0.7s ease 0.3s forwards; }
    .about-values.reveal { animation: fadeSlideUp 0.7s ease 0.4s forwards; }
    
    .service-card.reveal { animation: fadeSlideUp 0.7s ease forwards; }
    .service-card:nth-child(2).reveal { animation-delay: 0.1s; }
    .service-card:nth-child(3).reveal { animation-delay: 0.2s; }
    .service-card:nth-child(4).reveal { animation-delay: 0.3s; }
    .service-card:nth-child(5).reveal { animation-delay: 0.4s; }
    .service-card:nth-child(6).reveal { animation-delay: 0.5s; }
    
    .tech-card.reveal { animation: fadeSlideUp 0.7s ease forwards; }
    .tech-card:nth-child(2).reveal { animation-delay: 0.1s; }
    .tech-card:nth-child(3).reveal { animation-delay: 0.2s; }
    .tech-card:nth-child(4).reveal { animation-delay: 0.3s; }
    
    .testimonial-card.reveal { animation: fadeSlideUp 0.7s ease forwards; }
    .testimonial-card:nth-child(2).reveal { animation-delay: 0.1s; }
    .testimonial-card:nth-child(3).reveal { animation-delay: 0.2s; }
}

/* ===== MOBILE MENU ===== */
.mobile-link {
    opacity: 1;
}

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: var(--cream);
}

::-webkit-scrollbar-thumb {
    background: var(--warm-gray-300);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--warm-gray-400);
}

/* ===== FOCUS STYLES ===== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--terracotta);
    outline-offset: 2px;
}

/* ===== SELECTION ===== */
::selection {
    background: var(--terracotta-light);
    color: var(--warm-gray-950);
}
