@font-face{
      font-family: "Vazirmatn";
      src: url("../assets/fonts/vazirmatn/Vazirmatn-VariableFont_wght.ttf") format("truetype");
      font-weight: 100 900;
      font-style: normal;
      font-display: swap;
    }
    :root{ color-scheme: light; }
    html{ scroll-behavior: smooth; }
    body{
      font-family: Vazirmatn, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Helvetica Neue", sans-serif;
    }

    .page-bg{
      background:
        radial-gradient(900px 560px at 70% 0%, rgba(6,182,212,.18), transparent 65%),
        radial-gradient(760px 520px at 18% 30%, rgba(34,211,238,.12), transparent 58%),
        radial-gradient(820px 520px at 82% 70%, rgba(165,243,252,.55), transparent 60%),
        linear-gradient(180deg,#f7fbff 0%, #ffffff 44%, #ffffff 100%);
    }
    .glass{
      background: rgba(255,255,255,.72);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      border-bottom: 1px solid rgba(15,23,42,.06);
    }
    .shadow-soft{ box-shadow: 0 16px 48px rgba(2, 10, 20, 0.10); }
    .shadow-soft2{ box-shadow: 0 26px 70px rgba(2, 10, 20, 0.14); }

    .hero-tint{
      background:
        radial-gradient(900px 520px at 70% 0%, rgba(6,182,212,.20), transparent 66%),
        radial-gradient(820px 520px at 92% 60%, rgba(34,211,238,.16), transparent 58%),
        linear-gradient(180deg, rgba(241,251,251,.0) 0%, rgba(241,251,251,.55) 46%, rgba(255,255,255,1) 100%);
    }
    .netline{
      background-image: radial-gradient(circle at 8px 8px, rgba(148,163,184,.22) 2px, transparent 2px);
      background-size: 28px 28px;
      -webkit-mask-image: linear-gradient(90deg, transparent 0%, black 18%, black 82%, transparent 100%);
      mask-image: linear-gradient(90deg, transparent 0%, black 18%, black 82%, transparent 100%);
      opacity: .55;
    }
    .pale-card{
      background:
        radial-gradient(140px 100px at 70% 28%, rgba(165,243,252,.60), transparent 60%),
        radial-gradient(120px 90px at 25% 70%, rgba(6,182,212,.12), transparent 62%),
        linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
    }
    .footer-bg{
      background:
        radial-gradient(900px 420px at 80% -10%, rgba(34,211,238,.10), transparent 60%),
        linear-gradient(180deg, #172a3a 0%, #0f1f2f 100%);
    }