/* ==============================================
   ANNU FLOUR — Complete CSS
   ============================================== */

/* ===== RESET ===== */
* { margin:0; padding:0; box-sizing:border-box; }

/* ===== BASE ===== */
body { font-family: 'Inter', system-ui, sans-serif; background: #faf8f4; color: #2e241f; line-height: 1.6; }

/* ===== VARIABLES ===== */
:root {
    --af-cream: #f6f1e2;
    --af-cream-dark: #ede5d8;
    --af-green: #2a5c34;
    --af-green-light: #3a7a48;
    --af-gold: #b8ad86;
    --af-brown: #7a4a1f;
    --af-text: #2e241f;
    --af-text-muted: #6a5a4a;
    --af-white: #ffffff;
    --af-shadow: 0 12px 30px -10px rgba(0,0,0,0.06);
    --af-radius: 1.2rem;
    --af-radius-lg: 2rem;
    --af-transition: 0.3s cubic-bezier(0.4,0,0.2,1);
}

/* ===== UTILITY ===== */
.bg-cream { background: var(--af-cream); }
.bg-cream-dark { background: var(--af-cream-dark); }
.text-brand { color: var(--af-green); }
.section-py { padding: 4.5rem 0; }

/* ===== BUTTONS ===== */
.btn-brand {
    background: var(--af-green);
    color: #fff;
    border: none;
    padding: 0.8rem 2.2rem;
    border-radius: 60px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: var(--af-transition);
    text-decoration: none;
    cursor: pointer;
}
.btn-brand:hover {
    background: var(--af-green-light);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(42,92,52,0.3);
}

/* ===== REVEAL ANIMATION ===== */
.reveal {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.in {
    opacity: 1;
    transform: translateY(0);
}