:root {
    --agro-mint: #f3fcf6;
    --agro-sky: #f3f5fc;
    --agro-rose: #fcf3f9;
    --agro-warm: #fcfbf3;
    --agro-green: #236a52;
    --agro-blue: #315f8f;
    --agro-plum: #9f4f78;
    --agro-ink: #193529;
    --agro-muted: #607269;
    --agro-line: #dfe9e5;
}

body {
    background: var(--agro-mint) !important;
    color: var(--agro-ink) !important;
}

.glass {
    background: rgba(255, 255, 255, 0.82) !important;
    border: 1px solid rgba(223, 233, 229, 0.9) !important;
    box-shadow: 0 18px 42px rgba(25, 53, 41, 0.07) !important;
    backdrop-filter: blur(18px);
}

nav.glass {
    background: linear-gradient(90deg, rgba(243, 252, 246, 0.94), rgba(243, 245, 252, 0.94), rgba(252, 243, 249, 0.9)) !important;
    border-bottom: 1px solid var(--agro-line) !important;
    box-shadow: none !important;
}

nav .font-display,
footer .font-display {
    font-family: "DM Sans", system-ui, sans-serif !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase;
}

.text-gradient-primary,
.text-gradient-accent {
    background-image: linear-gradient(135deg, var(--agro-blue), var(--agro-plum)) !important;
}

.bg-primary {
    background-color: var(--agro-green) !important;
}

.text-primary {
    color: var(--agro-green) !important;
}

.border-primary,
.ring-primary {
    border-color: var(--agro-green) !important;
    --tw-ring-color: var(--agro-green) !important;
}

.bg-accent {
    background-color: var(--agro-plum) !important;
}

.text-accent {
    color: var(--agro-plum) !important;
}

#home {
    min-height: 94vh !important;
    background:
        linear-gradient(135deg, rgba(243, 252, 246, 0.96) 0%, rgba(243, 245, 252, 0.92) 38%, rgba(252, 243, 249, 0.9) 70%, rgba(252, 251, 243, 0.95) 100%) !important;
}

#home > .absolute,
#home .blur-2xl,
#home .blur-3xl {
    display: none !important;
}

#home > .container {
    display: grid !important;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr) !important;
    align-items: center !important;
    gap: 3rem !important;
    padding-top: 7rem !important;
    padding-bottom: 4rem !important;
}

#home .flex-1 {
    width: 100%;
}

#home h1 {
    max-width: 680px;
    font-family: "DM Sans", system-ui, sans-serif !important;
    font-size: 4.6rem !important;
    font-weight: 900 !important;
    line-height: 0.98 !important;
    letter-spacing: 0 !important;
}

#home h1 .italic {
    display: block;
    margin-top: 0.35rem;
    font-style: normal !important;
}

#home p {
    color: var(--agro-muted) !important;
}

#home .inline-flex.w-fit,
#home .rounded-full.bg-primary\/10 {
    border-radius: 0.7rem !important;
    background: rgba(255, 255, 255, 0.78) !important;
    border-color: rgba(35, 106, 82, 0.18) !important;
}

#home a[href="/signup.php"],
#home a[href="#assets"],
nav a[href="/login.php"] {
    border-radius: 0.8rem !important;
}

#home a[href="/signup.php"] {
    background: linear-gradient(135deg, var(--agro-green), var(--agro-blue)) !important;
    box-shadow: 0 18px 34px rgba(35, 106, 82, 0.18) !important;
}

#home a[href="#assets"] {
    background: #fff !important;
    border-color: var(--agro-line) !important;
    color: var(--agro-ink) !important;
}

#home .flex-1.relative.flex.justify-center > div {
    width: min(100%, 500px) !important;
    height: auto !important;
    aspect-ratio: 5 / 4 !important;
}

#home .shadow-2xl {
    border-radius: 1.4rem !important;
    animation: none !important;
    box-shadow: 0 30px 70px rgba(25, 53, 41, 0.15) !important;
    transform: rotate(-1deg);
}

#home .shadow-2xl > .absolute {
    background: linear-gradient(135deg, rgba(35, 106, 82, 0.18), rgba(159, 79, 120, 0.12)) !important;
}

#home img {
    border-radius: 1.4rem !important;
}

#home .shadow-card {
    left: auto !important;
    right: 1rem !important;
    bottom: 1rem !important;
    border-radius: 0.9rem !important;
}

section.bg-secondary\/30,
section.bg-secondary\/50 {
    background: var(--agro-sky) !important;
}

#assets {
    background: #ffffff !important;
}

#assets .rounded-2xl {
    border-radius: 0.75rem !important;
}

#assets .shadow-card,
#assets .hover\:shadow-card-hover:hover {
    box-shadow: 0 16px 32px rgba(25, 53, 41, 0.08) !important;
}

#assets img {
    border-radius: 0 !important;
}

#how-it-works {
    background: linear-gradient(135deg, var(--agro-mint), var(--agro-rose)) !important;
}

#how-it-works .rounded-full {
    border-radius: 1rem !important;
}

footer.bg-foreground {
    background: linear-gradient(135deg, var(--agro-ink), #1f4158 58%, #623653) !important;
}

@media (max-width: 1024px) {
    #home > .container {
        grid-template-columns: minmax(0, 1fr) !important;
        text-align: left !important;
    }

    #home h1 {
        font-size: 3.7rem !important;
    }
}

@media (max-width: 640px) {
    #home > .container {
        padding-top: 6rem !important;
        gap: 2rem !important;
    }

    #home h1 {
        font-size: 2.7rem !important;
    }

    #home .flex-1.relative.flex.justify-center > div {
        aspect-ratio: 1 / 1 !important;
    }
}
