/* ===============================
   KRISHI LENS BRAND THEME
   =============================== */

:root {
    --kl-yellow: #F4C430; /* Sarson */
    --kl-saffron: #F28C28; /* Sunrise */
    --kl-green: #2E7D32; /* Plant Green */
    --kl-light-green: #E8F5E9;
    --kl-brown: #5D4037;
    --kl-white: #FFFDF7;
}

/* ---------- Base ---------- */
body {
    font-family: "Philosopher", "Segoe UI", sans-serif;
    background-color: var(--kl-white);
    color: var(--kl-brown);
}

/* ---------- Buttons ---------- */
.btn-kl-primary {
    background: linear-gradient(135deg, var(--kl-yellow), var(--kl-saffron));
    border: none;
    color: #fff;
    font-weight: 600;
    padding: 12px 26px;
    border-radius: 8px;
}

    .btn-kl-primary:hover {
        opacity: 0.95;
        transform: translateY(-1px);
    }

.btn-kl-outline {
    border: 2px solid var(--kl-green);
    color: var(--kl-green);
    background: transparent;
    font-weight: 600;
}

    .btn-kl-outline:hover {
        background: var(--kl-green);
        color: #fff;
    }

/* ---------- Hero Section ---------- */
.hero {
    min-height: 100vh;
    background-size: cover;
    background-position: center;
    position: relative;
}

    .hero::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient( 90deg, rgba(255,253,247,0.95) 0%, rgba(255,253,247,0.85) 50%, rgba(255,253,247,0.3) 100% );
    }

.hero-content {
    position: relative;
    z-index: 2;
}

/* ---------- Typography ---------- */
.brand-title {
    font-family: "Harabara Mais", "Philosopher", sans-serif;
    font-size: 3rem;
    font-weight: 700;
}

.brand-highlight {
    color: var(--kl-yellow);
}

.coming-soon {
    font-size: 2.4rem;
    font-weight: 700;
    color: var(--kl-saffron);
}

.tagline {
    font-size: 1.2rem;
    color: var(--kl-green);
}

/* ---------- Notify Box ---------- */
.notify-box {
    background: #ffffff;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

.notify-input {
    border-radius: 6px;
    border: 1px solid #ddd;
}

/* ---------- Footer ---------- */
.footer {
    font-size: 0.9rem;
    color: #6b6b6b;
}