@font-face{font-family:"Inter";src:url("vendor/fonts/inter-var.woff2") format("woff2");font-weight:400 700;font-display:block}
@font-face{font-family:"Vazirmatn";src:url("vendor/fonts/vazirmatn-var.woff2") format("woff2");font-weight:300 700;font-display:swap;unicode-range:U+0600-06FF,U+200C-200F,U+FB50-FDFF,U+FE70-FEFF}
*{box-sizing:border-box;margin:0}
html{background:#050507}
body{font-family:Inter,Vazirmatn,system-ui,sans-serif;color:rgba(255,255,255,.62);-webkit-font-smoothing:antialiased;line-height:1.6}
a{color:#e6e6ea}
[lang=fa],.fa,.fa-inline,.fa-name{font-family:Vazirmatn,Inter,Tahoma,sans-serif}
.mut{color:rgba(255,255,255,.45)}.small{font-size:.85em}
#gl,#text,#static-bg,#back{display:none}

/* ---------- static / noscript / reduced-motion page ---------- */
#hero{max-width:1100px;margin:24px auto;padding:0 20px}
#hero .nav{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 22px;border-radius:18px;background:linear-gradient(160deg,#1d1d22,#121215);border:1px solid rgba(255,255,255,.12)}
#hero .nav a{text-decoration:none;color:rgba(255,255,255,.75)}
#hero .brand{display:flex;align-items:center;gap:10px;font-weight:600;color:#fff!important}
#hero .brand img{width:34px;height:34px;border-radius:50%;object-fit:cover}
#hero>p,#hero h1{padding:0 22px}
#hero .eyebrow{margin-top:56px;font-size:12px;letter-spacing:.2em;color:rgba(255,255,255,.38)}
#hero h1{font-weight:500;font-size:clamp(48px,8vw,104px);letter-spacing:-.045em;line-height:.97;margin:18px 0;padding-bottom:.1em!important;background:linear-gradient(#dcdce0,#bdbdc3);-webkit-background-clip:text;background-clip:text;color:transparent}
#hero .sub{color:rgba(255,255,255,.55);font-size:clamp(14px,1.4vw,18px)}
#hero .cta{margin:26px 0;display:flex;gap:22px;align-items:center}
#hero .cta a{text-decoration:none}
#hero .pill{background:#e9e9ee;color:#0b0b0d;border-radius:6px;padding:9px 22px;font-weight:550}
#hero .pill:hover{background:#36d67e}
#hero .foot{display:flex;justify-content:space-between;font-size:12px;color:rgba(255,255,255,.34)}
#view2{max-width:1100px;margin:0 auto 60px;padding:0 42px;font-size:15px}
#view2 h2{color:#fff;font-weight:650;letter-spacing:-.022em;font-size:26px;margin:48px 0 14px}
#view2 h3{color:#fff;font-weight:600;font-size:18px;margin:34px 0 12px}
#view2 p{margin-bottom:12px}
#view2 b{color:#fff;font-weight:600}
.fa{font-size:1.04em;line-height:1.9}
.fa-name{font-size:22px;color:#fff;margin-bottom:10px}
.g{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.c{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:14px 16px;font-size:.92em}
.c p{margin:6px 0 0!important}.c small{color:rgba(255,255,255,.35)}
.c img{display:block;width:100%;height:96px;object-fit:contain;background:#0b0b0e;border-radius:10px;margin-bottom:10px}
.c img.cover{object-fit:cover}
.contacts a{display:inline-block;margin:4px 16px 4px 0}

/* ---------- glass (WebGL) mode ---------- */
body.gl{height:100vh;overflow:hidden}
body.gl #gl{display:block;position:fixed;inset:0;width:100vw;height:100vh}
body.gl #hero{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);margin:-1px;padding:0}
body.gl #text{display:block;position:fixed;left:0;top:0;transform-origin:0 0;color:transparent;user-select:text;z-index:2}
#text .it{position:absolute;white-space:pre;line-height:1;cursor:text}
#text a.it{cursor:pointer;text-decoration:none;color:transparent}
#text.hidden{visibility:hidden}
#text ::selection{background:rgba(64,128,255,.5);color:transparent}
body.gl #view2{position:fixed;left:32.4vw;width:min(56vw,860px);top:13vh;bottom:0;max-width:none;margin:0;padding:0 18px 60px 0;overflow-y:auto;font-size:clamp(13px,.86vw,16px);opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s .25s;z-index:3;scrollbar-width:thin;scrollbar-color:#333 transparent}
body.gl #view2.on{opacity:1;visibility:visible;transition:opacity .4s .28s}
body.gl #view2 h2:first-child{margin-top:0}
body.gl #back{display:block;position:fixed;left:21.9vw;top:23.8vh;transform:translate(-50%,-50%);font:500 max(.66vw,12px) Inter,sans-serif;color:#fff;background:none;border:0;cursor:pointer;opacity:0;pointer-events:none;z-index:4;transition:color .15s}
#back.on{pointer-events:auto}
#back.hov,#back:hover{color:#b9abff}
@media (orientation:portrait){
  body.gl #view2{left:5vw;width:90vw;top:19vh;padding-right:4px}
  body.gl #back{left:30vw;top:9vh;font-size:13px}
  #view2{padding:0 20px}
}
.c .fa-inline{display:block;text-align:right;margin-top:2px}
.who{display:flex;gap:18px;align-items:center;margin:6px 0 18px}
.who img{width:96px;height:96px;border-radius:50%;object-fit:cover;border:1px solid rgba(255,255,255,.2)}
.who .fa-name{text-align:left}
.facts{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px 10px;font-size:.92em}
.facts li{padding:3px 10px;border:1px solid rgba(255,255,255,.14);border-radius:99px}
.switch{display:none}
body.gl .switch{display:inline-block;float:right;font-size:.95em;color:#cfcfd6;text-decoration:none;margin-top:6px}
body.gl .switch:hover{color:#b9abff}
body.gl #view2{position:static;opacity:1;visibility:visible;overflow:visible;padding:0;width:auto}
body.gl .v{position:fixed;left:32.4vw;width:min(56vw,860px);top:13vh;bottom:0;padding:0 18px 60px 0;overflow-y:auto;font-size:clamp(13px,.86vw,16px);opacity:0;visibility:hidden;transition:opacity .25s,visibility 0s .25s;z-index:3;scrollbar-width:thin;scrollbar-color:#333 transparent}
body.gl .v.on{opacity:1;visibility:visible;transition:opacity .4s .28s}
body.gl .v.on.quick{transition:opacity .3s .1s}
body.gl .v h2{margin-top:0}
@media (orientation:portrait){body.gl .v{left:5vw;width:90vw;top:19vh;padding-right:4px}}
#hero .fa-hero{font-family:Vazirmatn,Tahoma,sans-serif;font-size:clamp(20px,2vw,30px);color:rgba(255,255,255,.78);text-align:left;margin:-6px 0 14px}
