/* =========================================================
   WHYNOTcoins FRONT PAGE — OFFICIAL NEON THEME
   AI • Crypto • Web3 • Ecosystem
   ========================================================= */

/* =========================================================
   ROOT COLORS
   ========================================================= */

:root{

    --wnc-primary:#C8FF1A;
    --wnc-secondary:#A6E600;

    --wnc-glow:#D9FF3F;

    --wnc-black:#050505;
    --wnc-dark:#111111;
    --wnc-card:#151515;

    --wnc-white:#EDEDED;
    --wnc-muted:#9CA3AF;

}

/* =========================================================
   FRONT PAGE ONLY
   ========================================================= */

.homepage,
.home-page,
.landing-page{

    background:var(--wnc-black);

    color:var(--wnc-white);

    font-family:
      Inter,
      system-ui,
      sans-serif;

}

/* =========================================================
   LOGO FIX
   ========================================================= */

.logo img,
.navbar-brand img,
img{

    max-width:100%;

    height:auto;

    filter:none !important;

    opacity:1 !important;

}

/* =========================================================
   HEADINGS
   ========================================================= */

.homepage h1,
.homepage h2,
.homepage h3,
.homepage h4,
.homepage h5,
.homepage h6,

.home-page h1,
.home-page h2,
.home-page h3,
.home-page h4,
.home-page h5,
.home-page h6,

.landing-page h1,
.landing-page h2,
.landing-page h3,
.landing-page h4,
.landing-page h5,
.landing-page h6{

    color:var(--wnc-white) !important;

    font-weight:700;

    letter-spacing:-0.02em;

}

/* =========================================================
   HERO TITLE
   ========================================================= */

.homepage .hero-section h1,
.home-page .hero-section h1,
.landing-page .hero-section h1{

    color:#FFFFFF !important;

    text-shadow:
      0 0 15px rgba(200,255,26,0.15),
      0 0 30px rgba(200,255,26,0.08);

}

/* =========================================================
   PARAGRAPHS
   ========================================================= */

.homepage p,
.homepage span,
.homepage .description,
.homepage .small-text,

.home-page p,
.home-page span,
.home-page .description,
.home-page .small-text,

.landing-page p,
.landing-page span,
.landing-page .description,
.landing-page .small-text{

    color:var(--wnc-muted) !important;

    line-height:1.7;

}

/* =========================================================
   ACCENT TEXT
   ========================================================= */

.text-primary,
.highlight,
.green,
.accent{

    color:var(--wnc-primary) !important;

}

/* =========================================================
   NAVIGATION
   ========================================================= */

.homepage .navbar,
.home-page .navbar,
.landing-page .navbar{

    background:rgba(5,5,5,0.88);

    backdrop-filter:blur(12px);

    border-bottom:
      1px solid rgba(200,255,26,0.08);

}

.homepage .navbar a,
.homepage header a,
.homepage .menu a,

.home-page .navbar a,
.home-page header a,
.home-page .menu a,

.landing-page .navbar a,
.landing-page header a,
.landing-page .menu a{

    color:var(--wnc-muted) !important;

    transition:0.25s ease;

}

.homepage .navbar a:hover,
.homepage header a:hover,
.homepage .menu a:hover,

.home-page .navbar a:hover,
.home-page header a:hover,
.home-page .menu a:hover,

.landing-page .navbar a:hover,
.landing-page header a:hover,
.landing-page .menu a:hover{

    color:var(--wnc-primary) !important;

    text-shadow:
      0 0 8px rgba(200,255,26,0.35);

}

/* =========================================================
   BUTTONS
   ========================================================= */

.homepage button,
.homepage .btn,

.home-page button,
.home-page .btn,

.landing-page button,
.landing-page .btn{

    background:var(--wnc-primary);

    color:#000000 !important;

    font-weight:700;

    border:none;

    border-radius:14px;

    transition:0.25s ease;

    box-shadow:
      0 0 18px rgba(200,255,26,0.18);

}

.homepage button:hover,
.homepage .btn:hover,

.home-page button:hover,
.home-page .btn:hover,

.landing-page button:hover,
.landing-page .btn:hover{

    background:var(--wnc-glow);

    transform:translateY(-2px);

    box-shadow:
      0 0 24px rgba(217,255,63,0.28);

}

/* =========================================================
   CARDS
   ========================================================= */

.homepage .card,
.home-page .card,
.landing-page .card{

    background:var(--wnc-card);

    border:
      1px solid rgba(200,255,26,0.08);

    border-radius:22px;

    box-shadow:
      0 0 25px rgba(0,0,0,0.35);

}

.homepage .card h1,
.homepage .card h2,
.homepage .card h3,

.home-page .card h1,
.home-page .card h2,
.home-page .card h3,

.landing-page .card h1,
.landing-page .card h2,
.landing-page .card h3{

    color:var(--wnc-white) !important;

}

/* =========================================================
   INPUTS
   ========================================================= */

input,
textarea,
select{

    background:#0E0E0E !important;

    border:
      1px solid rgba(200,255,26,0.08) !important;

    color:var(--wnc-white) !important;

    border-radius:14px;

}

input:focus,
textarea:focus,
select:focus{

    border-color:var(--wnc-primary) !important;

    box-shadow:
      0 0 12px rgba(200,255,26,0.15);

    outline:none;

}

/* =========================================================
   LINKS
   ========================================================= */

a{

    color:var(--wnc-primary);

}

a:hover{

    color:var(--wnc-glow);

}

/* =========================================================
   FOOTER
   ========================================================= */

footer{

    border-top:
      1px solid rgba(200,255,26,0.08);

}

footer p,
footer a{

    color:var(--wnc-muted) !important;

}

footer a:hover{

    color:var(--wnc-primary) !important;

}

/* =========================================================
   GLOW EFFECTS
   ========================================================= */

.glow,
.hero-glow,
.logo-glow{

    box-shadow:
      0 0 25px rgba(200,255,26,0.15);

}

/* =========================================================
   MOBILE SAFE
   ========================================================= */

.dropdown-menu,
.navbar-collapse{

    z-index:99999 !important;

    background:#0B0B0B;

}