*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
:root {
  --bg: #060A10;
  --blue: #0A83E3;
  --purple: #8A3194;
  --text: #F3F7FF;
  --muted: rgba(243, 247, 255, 0.72);
  --glass: rgba(6, 10, 16, 0.55);
  --border: rgba(255, 255, 255, 0.12);
  --primary-purple: #803599;
  --primary-blue: #3269CB;
  --dark-background: #06090C;
  --glass-card-bg: rgba(255, 255, 255, 0.05);
  --glass-card-border: rgba(255, 255, 255, 0.1);
  --text-color: #eee;
  --subtle-text-color: #aaa;
  --accent-color: #f39c12; /* رنگ نارنجی برای تأکید */
}
.cke_bottom{
    z-index: 1;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance:textfield;
}
/* ===== Scrollbar Design ===== */

/* Firefox */
@font-face {
    font-family: 'IRANSansWeb';
    src: url("../fonts/iransans/IRANSans.woff2") format('woff2'),
    url("../fonts/iransans/IRANSans.woff") format('woff');
    font-weight: 400;
    font-style: normal;
}
body {
  scrollbar-width: thin;
  scrollbar-color: #0A83E3 #060A10;
  font-family: 'IRANSansWeb', Tahoma, sans-serif;
}

#body::-webkit-scrollbar-thumb {
    background-color: rgba(7, 6, 6, 0.87);
    border-radius: 10px;
}

#body::-webkit-scrollbar {
    width: 10px;
    background: none;
}

/* فقط پس‌زمینه */
.bg-art{
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none; /* روی کلیک‌ها اثر نگذارد */
  overflow: hidden;
  background:
    radial-gradient(circle at 20% 20%, rgba(146,42,142,.16), transparent 28%),
    radial-gradient(circle at 80% 70%, rgba(31,117,213,.14), transparent 30%),
    linear-gradient(180deg, #060606, #050505 60%, #040404);
}

.orb{
  position: absolute;
  border-radius: 50%;
  filter: blur(55px) saturate(150%);
  opacity: .8;
  mix-blend-mode: screen;
  animation: swirl 24s linear infinite;
}

.orb-1{
  width: 34vw;
  height: 34vw;
  top: -8vw;
  left: -10vw;
  background: radial-gradient(circle, rgba(146,42,142,.95), rgba(146,42,142,.08) 38%, transparent 70%);
}

.orb-2{
  width: 30vw;
  height: 30vw;
  right: -8vw;
  top: 14vh;
  animation-direction: reverse;
  background: radial-gradient(circle, rgba(31,117,213,.95), rgba(31,117,213,.08) 38%, transparent 72%);
}

.orb-3{
  width: 40vw;
  height: 40vw;
  left: 25vw;
  bottom: -16vw;
  background: radial-gradient(circle, rgba(255,255,255,.10), rgba(146,42,142,.10) 25%, transparent 68%);
}

@keyframes swirl{
  0%   { transform: translate3d(0,0,0) rotate(0deg) scale(1); }
  50%  { transform: translate3d(18px,-14px,0) rotate(180deg) scale(1.06); }
  100% { transform: translate3d(0,0,0) rotate(360deg) scale(1); }
}

/* محتوای اصلی همیشه روی همه چیز */
.page-content{
  position: relative;
  z-index: 2;
  width: 100%;
}

.hero{
  padding: 48px 24px 24px;
}

.slider-wrap{
  position: relative;
  z-index: 3; /* اگر لازم شد از بقیه بالاتر باشد */
  padding: 24px;
}
body {
  margin: 0;
  background-color: #060606;
  isolation: isolate; /* این جادویی است؛ بک‌گراند را در لایه پایین نگه می‌دارد */
}

/* ۲. بک‌گراندِ آبرنگیِ ایزوله */
.background-layer {
  position: fixed;
  inset: 0;
  z-index: -1; /* همیشه زیر همه چیز می‌رود */
  overflow: hidden;
  pointer-events: none; /* اجازه می‌دهد کلیک‌ها از روی آن رد شوند */
}

/* برای اینکه اسلایدر یا متن‌ها روی آن معلوم باشند */
.content-layer {
  position: relative;
  z-index: 1; /* این از -1 بالاتر است، پس همیشه روی آن می‌ماند */
}
.slider{
  min-height: 260px;
  border-radius: 24px;
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 40px rgba(0,0,0,.35);
  position: relative;
  z-index: 3;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'IRANSansWeb', Tahoma, sans-serif;
    color: #0f131f;
    margin-bottom: 1.2em;
    font-weight: 700;
}
input{
    font-family: 'IRANSansWeb', Tahoma, sans-serif;
}
h1 { font-size: 2.5rem; }
h2 { font-size: 2rem; }
h3 { font-size: 1.75rem; }
h4 { font-size: 1.5rem; }
h5 { font-size: 1.25rem; }
h6 { font-size: 1rem; }
/* Chrome, Edge, Safari */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: linear-gradient(
    180deg,
    rgba(6, 10, 16, 0.95),
    rgba(10, 15, 24, 0.95)
  );
  border-left: 1px solid rgba(255, 255, 255, 0.06);
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(
    180deg,
    rgba(10, 131, 227, 0.95),
    rgba(138, 49, 148, 0.95)
  );
  border-radius: 999px;
  border: 2px solid rgba(6, 10, 16, 0.95);
  box-shadow: 0 0 12px rgba(10, 131, 227, 0.25);
}

::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(
    180deg,
    #0A83E3,
    #8A3194
  );
  box-shadow: 0 0 16px rgba(138, 49, 148, 0.35);
}

::-webkit-scrollbar-corner {
  background: #060A10;
}

.btn_nava{
    padding: 5px;
    width: 140px;
}