/*
Theme Name: Neleen Core
Theme URI: https://neleen.ir
Author: KT1CO / KIEFZCO
Description: Hybrid theme for NELEEN (Elementor + WooCommerce) future-ready for KAccount/KIdentity/KAI/KCurrency.
Version: 1.0.0
Text Domain: neleen-core
*/

:root{
  --nl-bg: #f7f7fb;
  --nl-text: rgba(0,0,0,.86);
  --nl-muted: rgba(0,0,0,.60);
  --nl-border: rgba(0,0,0,.08);

  --nl-a1: #ff7a59;
  --nl-a2: #7c5cff;
  --nl-a3: #2dd4bf;
}

html{ scroll-behavior:smooth; }
body{
  margin:0;
  background: var(--nl-bg);
  color: var(--nl-text);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Vazirmatn", "IRANSans", sans-serif;
}

body:before{
  content:"";
  position: fixed;
  inset: -20%;
  background:
    radial-gradient(circle at 18% 14%, rgba(255,122,89,.16), transparent 42%),
    radial-gradient(circle at 74% 18%, rgba(124,92,255,.14), transparent 48%),
    radial-gradient(circle at 50% 84%, rgba(45,212,191,.12), transparent 52%);
  pointer-events:none;
  z-index:-1;
  filter: blur(10px);
}

a{ color:inherit; text-decoration:none; }
.nl-container{ width:min(1180px, calc(100% - 32px)); margin:0 auto; }

/* ===== HEADER (NO BLACK OVERLAY) ===== */
.nl-header{
  position: sticky;
  top: 0;
  z-index: 9999;
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--nl-border);
}

.nl-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  padding: 14px 0;
}

.nl-brand{
  display:flex;
  align-items:center;
  gap: 12px;
  min-width: 260px;
}

.nl-brand-link{ display:inline-flex; align-items:center; line-height:0; }
.nl-logo{
  display:block;
  height: 54px;
  width:auto;
  max-width: 220px;
  object-fit: contain;
}
@media (max-width:600px){
  .nl-logo{ height: 44px; max-width: 190px; }
}

.nl-tagline{
  font-size: 12.5px;
  font-weight: 800;
  color: var(--nl-muted);
  line-height: 1.3;
  white-space: nowrap;
}

/* NAV */
.nl-nav{ flex:1; display:flex; justify-content:center; }
.nl-menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
  align-items:center;
}
.nl-menu a{
  display:inline-block;
  font-size: 15px;
  font-weight: 800;
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(0,0,0,.06);
}
.nl-menu a:hover{ background: rgba(255,255,255,.86); }

/* ACTIONS */
.nl-actions{ display:flex; align-items:center; gap:10px; white-space:nowrap; }
.nl-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 9px 12px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 900;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.60);
}
.nl-btn:hover{ background: rgba(255,255,255,.90); }
.nl-btn-primary{
  background: rgba(45,212,191,.22);
  border-color: rgba(45,212,191,.35);
}
.nl-btn-primary:hover{ background: rgba(45,212,191,.30); }

/* RTL */
body.rtl .nl-header,
body.rtl .nl-bar,
body.rtl .nl-nav{ direction: rtl; }
body.rtl .nl-menu{ justify-content:flex-start; }
body.rtl .nl-actions{ direction: rtl; }

/* ===== HERO (Chevron animation ready) ===== */



/* ===== HERO (full image visible) ===== */
.nl-hero{
  position: relative;
  min-height: 88vh;        /* hero takes almost full screen */
  display: flex;
  align-items: center;
  overflow: hidden;
}

/* Full hero image layer (NOT clipped) */
.nl-hero-bg{
  position: absolute;
  inset: 0;
  background: url("https://neleen.ir/wp-content/uploads/2025/12/Hero-Image.png") center/cover no-repeat;
  transform: scale(1.03);
}

/* Soft readability overlay */
.nl-hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,122,89,.10), transparent 45%),
    radial-gradient(circle at 72% 20%, rgba(124,92,255,.08), transparent 48%),
    radial-gradient(circle at 50% 82%, rgba(45,212,191,.08), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.38));
  pointer-events:none;
}

/* Bottom chevron edge ONLY (decorative) */
.nl-hero-chevron{
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 160px;
  background: var(--nl-bg);
  clip-path: polygon(0 0, 100% 0, 100% 55%, 50% 100%, 0 55%);
  opacity: 1;
}

/* Optional subtle motion (parallax-ish) */
@media (prefers-reduced-motion: no-preference){
  .nl-hero-bg{
    animation: nlHeroFloat 10s ease-in-out infinite;
  }
  @keyframes nlHeroFloat{
    0%,100%{ transform: translateY(0) scale(1.03); }
    50%    { transform: translateY(10px) scale(1.03); }
  }
}









/* optional: subtle “glass” overlay on hero image to boost readability */
.nl-hero:after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.35));
  pointer-events:none;
}





.nl-hero-inner{ position:relative; padding: 44px 0; }
.nl-hero-copy{ text-align:center; max-width: 860px; margin:0 auto; }
.nl-hero-copy h1{
  margin:0 0 12px;
  font-size: clamp(28px, 4vw, 44px);
  line-height:1.25;
}
.nl-hero-copy p{
  margin:0 auto 18px;
  max-width: 680px;
  color: var(--nl-muted);
  font-size: 16px;
  line-height: 1.9;
}

.nl-hero-cta{ display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }

/* Scroll button (NELEEN icon) */

.nl-scroll{
  bottom: 26px;  /* sits above the chevron edge */
}


.nl-scroll{
  position:absolute;
  left:50%;
  bottom: 208px;
  transform: translateX(-50%);
  display:grid;
  place-items:center;
  gap: 6px;
  animation: nl_bounce 1.35s infinite;
}
.nl-scroll img{
  height: 44px;
  width:auto;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,.12));
}
.nl-scroll span{
  font-size: 12px;
  font-weight: 900;
  color: var(--nl-muted);
}
@keyframes nl_bounce{
  0%,100%{ transform: translateX(-50%) translateY(0); }
  50%    { transform: translateX(-50%) translateY(8px); }
}

/* ===== SERVICES ===== */
.nl-services{
  padding: 42px 0;
  background: rgba(255,255,255,.78);
  border-top: 1px solid var(--nl-border);
}
.nl-services h2{ margin:0 0 10px; text-align:center; }
.nl-muted{ margin:0 0 18px; text-align:center; color: var(--nl-muted); }

.nl-latest{ display:flex; justify-content:center; }
.nl-card{
  width: min(760px, 100%);
  background: rgba(255,255,255,.72);
  border: 1px solid var(--nl-border);
  border-radius: 18px;
  padding: 18px;
}
.nl-card h3{ margin:0 0 10px; }
.nl-excerpt{ color: var(--nl-muted); line-height:1.9; }
.nl-meta{ margin-top:10px; font-size:12px; color: var(--nl-muted); }

/* ===== FOOTER (disciplined) ===== */
.nl-footer{
  padding: 34px 0 0;
  background: rgba(255,255,255,.80);
  border-top: 1px solid var(--nl-border);
  color: var(--nl-muted);
}
.nl-footer-grid{
  display:grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 18px;
  padding-bottom: 22px;
}
@media (max-width:900px){ .nl-footer-grid{ grid-template-columns:1fr; } }

.nl-footer-title{ font-weight: 900; color: var(--nl-text); margin-bottom:10px; }
.nl-footer-brand{ font-weight: 900; color: var(--nl-text); font-size:18px; margin-bottom:8px; }
.nl-footer-text{ line-height:1.9; }

.nl-footer-menu{ list-style:none; margin:0; padding:0; }
.nl-footer-menu li{ margin:8px 0; }

.nl-footer-bottom{
  padding: 14px 0;
  background: rgba(0,0,0,.03);
  border-top: 1px solid rgba(0,0,0,.06);
  text-align:center;
  font-size: 13px;
}
/* =========================
   MOBILE / RESPONSIVE FIXES
========================= */

/* Make images never overflow */
img{ max-width:100%; height:auto; }

/* Small tablets & phones */
@media (max-width: 900px){
  .nl-container{ width: min(1180px, calc(100% - 24px)); }

  /* Header: allow wrapping */
  .nl-bar{
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 0;
  }

  /* Brand: smaller + tagline hidden on mobile */
  .nl-brand{
    min-width: unset;
    gap: 10px;
  }
  .nl-logo{ height: 44px; max-width: 170px; }
  .nl-tagline{ display:none; }

  /* Actions move to the left/right neatly */
  .nl-actions{
    gap: 8px;
  }
  .nl-btn{
    padding: 8px 10px;
    font-size: 13px;
    border-radius: 12px;
  }

  /* Nav: horizontal scroll instead of wrapping into multiple lines */
  .nl-nav{
    order: 3;
    width: 100%;
    justify-content: flex-start;
  }
  .nl-menu{
    width: 100%;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    gap: 8px;
    padding-bottom: 6px;
    scrollbar-width: none; /* Firefox */
  }
  .nl-menu::-webkit-scrollbar{ display:none; } /* Chrome */
  .nl-menu a{
    white-space: nowrap;
    font-size: 14px;
    padding: 8px 10px;
    border-radius: 12px;
  }
}

/* Phones */
@media (max-width: 600px){
  /* Hero */
  .nl-hero{ min-height: 78vh; }
  .nl-hero-inner{ padding: 26px 0; }
  .nl-hero-copy h1{
    font-size: 28px;
    line-height: 1.35;
    margin-bottom: 10px;
  }
  .nl-hero-copy p{
    font-size: 14px;
    line-height: 1.9;
    margin-bottom: 14px;
  }
  .nl-hero-cta{
    gap: 8px;
  }
  .nl-btn, .nl-btn-primary{
    font-size: 13px;
    padding: 9px 10px;
  }

  /* Chevron edge shorter on mobile */
  .nl-hero-chevron{ height: 110px; }

  /* Scroll button smaller */
  .nl-scroll img{ height: 40px; }
  .nl-scroll span{ font-size: 11px; }

  /* Services */
  .nl-services{ padding: 28px 0; }
  .nl-card{
    padding: 14px;
    border-radius: 16px;
  }
}

/* Very small phones */
@media (max-width: 380px){
  .nl-actions{ width:100%; justify-content: space-between; }
  .nl-btn{ width:auto; }
}
