/* فونت پشتیبان (fallback) در صورت بروز مشکل در بارگذاری فونت هیوا */
@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800&display=swap');

/* ---------------------------------------------------------
   فونت اختصاصی هیوا — تمام وزن‌ها
--------------------------------------------------------- */
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-ExtraLight.woff2') format('woff2');
  font-weight: 200;
  font-display: swap;
}
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-Light.woff2') format('woff2');
  font-weight: 300;
  font-display: swap;
}
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-Regular.woff2') format('woff2'),
       url('fonts/Hiva-Regular.woff') format('woff');
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-Medium.woff2') format('woff2');
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-Bold.woff2') format('woff2'),
       url('fonts/Hiva-Bold.woff') format('woff');
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: 'HivaFont';
  src: url('fonts/Hiva-Black.woff2') format('woff2');
  font-weight: 900;
  font-display: swap;
}


:root{
  --bg:#0a0a0d;
  --bg-panel:#131318;
  --bg-card:#17171d;
  --border:#26262e;
  --blue:#3b6bf5;
  --blue-soft:#1c2a4d;
  --text:#f4f4f6;
  --text-dim:#9a9aa5;
  --text-faint:#5c5c66;
  --font-family:'HivaFont', 'Vazirmatn', sans-serif; /* Vazirmatn به‌عنوان fallback نگه داشته شده */
}
*{box-sizing:border-box; margin:0; padding:0;}
html,body{background:var(--bg); color:var(--text); font-family:var(--font-family); min-height:100vh;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 24px;}

/* HEADER */
.site-header{
  border-bottom:1px solid var(--border);
  padding:18px 24px;
  display:flex; align-items:center; justify-content:space-between;
  max-width:1180px; margin:0 auto;
}
.site-header .logo{font-weight:800; font-size:18px; letter-spacing:.3px;}
.site-header .back-link{
  font-size:13px; color:var(--text-dim);
  display:flex; align-items:center; gap:6px;
}
.site-header .back-link:hover{color:var(--blue);}

/* MAIN NAV (desktop) */
.main-nav{display:flex; align-items:center; gap:28px;}
.main-nav a{font-size:14px; color:var(--text-dim); font-weight:600; transition:.15s;}
.main-nav a:hover{color:var(--blue);}

/* HAMBURGER TOGGLE (mobile) */
.menu-toggle{
  display:none; background:none; border:none; color:var(--text);
  cursor:pointer; padding:4px; align-items:center; justify-content:center;
}

/* MOBILE FULLSCREEN NAV OVERLAY */
.mobile-nav-overlay{
  position:fixed; inset:0; z-index:1000;
  background:var(--blue);
  transform:translateX(-100%);
  transition:transform .35s ease;
  display:flex; flex-direction:column;
  padding:24px;
  overflow-y:auto;
}
.mobile-nav-overlay.open{transform:translateX(0);}
.mobile-nav-close{
  align-self:flex-start;
  background:none; border:none; color:#fff; cursor:pointer; padding:6px;
  margin-bottom:40px;
}
.mobile-nav-links{display:flex; flex-direction:column; gap:28px; align-items:flex-end;}
.mobile-nav-links a{font-size:20px; font-weight:700; color:#fff;}

@media (max-width:767px){
  .main-nav{display:none;}
  .menu-toggle{display:flex;}
  .site-header .back-link{display:none;}
}
@media (min-width:768px){
  .menu-toggle{display:none;}
  .mobile-nav-overlay{display:none;}
}

/* STICKY SEARCH + CATEGORIES BAR */
.sticky-bar{
  position:fixed; top:0; left:0; right:0; z-index:600;
  background:rgba(10,10,13,.92); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
  padding:14px 24px;
  transform:translateY(-100%); opacity:0;
  transition:transform .25s ease, opacity .25s ease;
}
.sticky-bar.show{transform:translateY(0); opacity:1;}
.sticky-bar-inner{max-width:1180px; margin:0 auto; display:flex; flex-direction:column; gap:12px;}
.sticky-search-box{max-width:640px; margin:0 auto; width:100%;}
.sticky-search-box input{padding:13px 50px 13px 18px; font-size:14px; border-radius:12px;}
.sticky-search-box .search-icon{right:18px;}
.sticky-cat-row{
  display:flex; flex-wrap:nowrap; overflow-x:auto; justify-content:flex-start;
  gap:8px; padding:0; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.sticky-cat-row::-webkit-scrollbar{display:none;}
.sticky-cat-row .chip{flex-shrink:0; padding:7px 15px; font-size:12.5px;}
@media (min-width:768px){
  .sticky-cat-row{justify-content:center; flex-wrap:wrap; overflow:visible;}
}

/* PAGINATION */
.pagination-wrap{
  display:flex; align-items:center; justify-content:center; gap:8px;
  flex-wrap:wrap; padding:10px 24px 70px;
}
.page-btn{
  min-width:40px; height:40px; padding:0 12px; border-radius:10px;
  background:var(--bg-panel); border:1px solid var(--border);
  color:var(--text-dim); font-family:inherit; font-size:14px; font-weight:600;
  cursor:pointer; transition:.15s; display:flex; align-items:center; justify-content:center;
}
.page-btn:hover:not(:disabled){border-color:var(--blue); color:var(--text);}
.page-btn.active{background:var(--blue); border-color:var(--blue); color:#fff;}
.page-btn.page-nav{color:var(--text);}
.page-btn:disabled{opacity:.35; cursor:not-allowed;}
.page-ellipsis{color:var(--text-faint); font-size:14px; padding:0 4px; user-select:none;}

/* SCROLL TO TOP BUTTON */
.scroll-top-btn{
  position:fixed; bottom:26px; right:26px; z-index:700;
  width:46px; height:46px; border-radius:50%;
  background:var(--blue); color:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 20px rgba(59,107,245,.35);
  opacity:0; visibility:hidden; transform:translateY(12px);
  transition:opacity .25s ease, transform .25s ease, visibility .25s;
}
.scroll-top-btn.show{opacity:1; visibility:visible; transform:translateY(0);}
.scroll-top-btn:hover{opacity:.9;}

/* HERO */
.hero{position:relative; padding:80px 24px 60px; text-align:center; overflow:hidden; border-bottom:1px solid var(--border);}
.hero::before{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(circle at 18% 20%, rgba(59,107,245,.20), transparent 45%),
    radial-gradient(circle at 82% 75%, rgba(59,107,245,.14), transparent 40%);
  pointer-events:none;
}
.eyebrow{
  position:relative; display:inline-flex; align-items:center; gap:8px;
  font-size:13px; color:var(--blue); letter-spacing:.3px;
  background:var(--blue-soft); border:1px solid rgba(59,107,245,.35);
  padding:6px 16px; border-radius:100px; margin-bottom:22px;
}
.hero h1{position:relative; font-size:40px; font-weight:800; line-height:1.35; margin-bottom:16px;}
.hero h1 span{color:var(--blue);}
.hero p{position:relative; color:var(--text-dim); font-size:16px; max-width:560px; margin:0 auto 36px; line-height:1.9;}

.search-box{position:relative; max-width:640px; margin:0 auto;}
.search-box input{
  width:100%; background:var(--bg-panel); border:1px solid var(--border); border-radius:14px;
  padding:20px 60px 20px 24px; font-family:inherit; font-size:16px; color:var(--text);
  outline:none; transition:border-color .2s;
}
.search-box input:focus{border-color:var(--blue);}
.search-box input::placeholder{color:var(--text-faint);}
.search-icon{position:absolute; right:22px; top:50%; transform:translateY(-50%); color:var(--text-faint); pointer-events:none;}
.search-count{margin-top:14px; font-size:13px; color:var(--text-faint);}
.search-count b{color:var(--blue); font-weight:600;}

.letters-wrap{
  max-width:820px; margin:22px auto 0; padding:0 24px;
  overflow-x:auto; overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:var(--border) transparent;
}
.letters-wrap::-webkit-scrollbar{height:5px;}
.letters-wrap::-webkit-scrollbar-thumb{background:var(--border); border-radius:10px;}
.letters-wrap::-webkit-scrollbar-track{background:transparent;}
.letters{display:flex; flex-wrap:nowrap; gap:8px; width:max-content; margin:0 auto; padding-bottom:6px;}
.letter-btn{
  width:38px; height:38px; border-radius:10px; background:var(--bg-panel); border:1px solid var(--border);
  color:var(--text-dim); font-family:inherit; font-size:14px; font-weight:600; cursor:pointer; transition:.15s;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.letter-btn:hover{border-color:var(--blue); color:var(--text);}
.letter-btn.active{background:var(--blue); border-color:var(--blue); color:#fff;}

.popular-row{max-width:1180px; margin:0 auto; padding:30px 24px 0;}
.popular-title{
  display:flex; align-items:center; gap:8px; font-size:20px; color:var(--text);
  margin-bottom:14px; font-weight:700;
}
.popular-title svg{color:var(--blue); width:17px; height:17px;}
.popular-list{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px;}
.popular-item{
  background:var(--bg-card); border:1px solid var(--border); border-radius:12px;
  padding:14px 16px; font-size:14px; font-weight:600; transition:.15s;
  display:flex; align-items:center; justify-content:space-between; gap:8px;
}
.popular-item:hover{border-color:var(--blue); transform:translateY(-2px);}
.popular-en{font-size:11px; color:var(--text-faint); font-family:sans-serif; direction:ltr;}

.cat-row{display:flex; flex-wrap:wrap; justify-content:center; gap:10px; padding:34px 24px 0;}
.chip{
  padding:9px 18px; border-radius:100px; background:var(--bg-panel); border:1px solid var(--border);
  color:var(--text-dim); font-size:13.5px; font-family:inherit; cursor:pointer; transition:.15s;
}
.chip:hover{color:var(--text); border-color:#3a3a44;}
.chip.active{background:var(--blue); border-color:var(--blue); color:#fff;}

.section-title{display:flex; align-items:baseline; justify-content:space-between; padding:44px 24px 20px; max-width:1180px; margin:0 auto; scroll-margin-top:24px;}
.section-title h2{font-size:20px; font-weight:700;}
.section-title span{font-size:13px; color:var(--text-faint);}
@media(max-width:1024px){
  .section-title{scroll-margin-top:150px;}
}

.grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:16px; padding:0 24px 20px; max-width:1180px; margin:0 auto;}
.term-card{
  background:var(--bg-card); border:1px solid var(--border); border-radius:16px; padding:22px;
  cursor:pointer; transition:.18s ease; position:relative; overflow:hidden;
}
.term-card::after{content:""; position:absolute; inset:0; background:linear-gradient(135deg, rgba(59,107,245,.10), transparent 60%); opacity:0; transition:.18s;}
.term-card:hover{border-color:var(--blue); transform:translateY(-3px);}
.term-card:hover::after{opacity:1;}
.term-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; position:relative;}
.term-letter{width:34px; height:34px; border-radius:9px; background:var(--blue-soft); color:var(--blue); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; flex-shrink:0;}
.term-cat{font-size:11px; color:var(--text-faint); background:#1c1c22; border:1px solid var(--border); padding:4px 10px; border-radius:100px;}
.term-title{font-size:17px; font-weight:700; margin-bottom:8px; position:relative;}
.term-en{font-size:12px; color:var(--text-faint); font-family:sans-serif; letter-spacing:.3px; margin-bottom:10px; display:block; direction:ltr; text-align:right;}
.term-desc{font-size:13.5px; color:var(--text-dim); line-height:1.85; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; position:relative;}
.term-more{margin-top:14px; font-size:12.5px; color:var(--blue); display:flex; align-items:center; gap:5px; position:relative;}

.no-result{text-align:center; padding:80px 24px; color:var(--text-faint); grid-column:1/-1;}
.no-result b{color:var(--text); display:block; font-size:16px; margin-bottom:8px;}

/* SINGLE TERM PAGE */
.single-wrap{height:80vh; max-width:720px; margin:0 auto; padding:60px 24px 100px;}
.single-cat{display:inline-block; margin-bottom:18px;}
.single-title{font-size:32px; font-weight:800; margin-bottom:8px;}
.single-en{font-size:14px; color:var(--text-faint); font-family:sans-serif; direction:ltr; display:block; text-align:right; margin-bottom:28px;}
.single-body{color:var(--text-dim); font-size:15.5px; line-height:2.15;}

/* استایل محتوای غنی (خروجی ادیتور کلاسیک) */
.rich-content p{margin-bottom:14px;}
.rich-content p:last-child{margin-bottom:0;}
.rich-content a{color:var(--blue); text-decoration:underline;}
.rich-content ul, .rich-content ol{margin:0 0 14px; padding-inline-start:22px;}
.rich-content li{margin-bottom:6px;}
.rich-content h1, .rich-content h2, .rich-content h3, .rich-content h4{color:var(--text); font-weight:700; margin:20px 0 10px; line-height:1.6;}
.rich-content h1:first-child, .rich-content h2:first-child, .rich-content h3:first-child, .rich-content h4:first-child{margin-top:0;}
.rich-content blockquote{border-inline-start:3px solid var(--blue); padding-inline-start:14px; color:var(--text-faint); margin:14px 0;}
.rich-content strong, .rich-content b{color:var(--text); font-weight:700;}
.term-desc a{color:var(--blue); text-decoration:underline; position:relative; z-index:2;}
.single-foot{margin-top:34px; padding-top:26px; border-top:1px solid var(--border);}
.single-foot h4{font-size:14px; color:var(--text-faint); margin-bottom:14px; font-weight:600;}
.related-tag{
  display:inline-block; font-size:12.5px; color:var(--blue); background:var(--blue-soft);
  padding:7px 16px; border-radius:100px; margin:0 8px 8px 0; border:1px solid rgba(59,107,245,.3);
}
.related-tag:hover{background:var(--blue); color:#fff;}
.back-to-list{display:inline-flex; align-items:center; gap:6px; color:var(--text-dim); font-size:13.5px; margin-bottom:30px;}
.back-to-list:hover{color:var(--blue);}

/* FOOTER */
.site-footer{border-top:1px solid var(--border); padding:26px 24px; text-align:center; color:var(--text-faint); font-size:12.5px;}

@media(max-width:640px){
  .hero h1{font-size:28px;}
  .hero{padding:50px 18px 40px;}
  .single-title{font-size:26px;}
}