:root{
  --navy:#16191D; --navy2:#1E232A; --text:#1E2228; --muted:#5C6169; --faint:#98999C;
  --soft:#F8F6F3; --line:#ECE7E1; --line2:#DAD3CA; --white:#fff;
  --accent:#B9713C; --accent-d:#94582B; --accent-btn:#A5622F; --accent2:#E09A63; --tint:#FAEFE6;
  --steel:#4A5B6B; --steel-tint:#EEF2F5;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
section[id], header[id]{scroll-margin-top:74px;}
body{font-family:'Vazirmatn',system-ui,sans-serif; color:var(--text); background:var(--white); line-height:1.85;}
html[lang=en] body{line-height:1.7;}
a{color:inherit; text-decoration:none;}
.wrap{max-width:1080px; margin:0 auto; padding:0 24px;}
p{text-align:justify; hyphens:auto;}
.ltr{direction:ltr; unicode-bidi:isolate;}

/* nav */
nav{position:sticky; top:0; z-index:60; background:rgba(22,25,29,0.94); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,255,255,0.08);}
nav .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 24px;}
.brand{display:flex; align-items:center; gap:10px; color:#fff; font-weight:800; font-size:15.5px; white-space:nowrap;}
.brand .mk{width:34px; height:34px; border-radius:50%; display:block; flex-shrink:0;}
.menu{display:flex; gap:4px; align-items:center;}
.menu a{color:#C9CDD2; font-size:14px; padding:7px 12px; border-radius:9px; transition:.2s; font-weight:500; white-space:nowrap;}
.menu a:hover{color:#fff; background:rgba(255,255,255,0.08);}
.menu a.active:not(.nav-cta){color:var(--accent2); background:rgba(185,113,60,0.18);}
.nav-cta{background:var(--accent-btn); color:#fff!important; font-weight:700;}
.nav-cta:hover{background:var(--accent)!important;}
.tools{display:flex; gap:8px; align-items:center;}
.lang{display:flex; align-items:center; gap:6px; background:transparent; color:#fff; border:1px solid rgba(255,255,255,0.22); border-radius:20px; padding:6px 12px; font:600 13px 'Vazirmatn',sans-serif; cursor:pointer; transition:.2s;}
.lang:hover{background:var(--accent-btn); border-color:var(--accent-btn);}
.nav-phone{display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:50%; border:1px solid rgba(255,255,255,0.22); color:#fff;}
.nav-phone:hover{background:var(--accent-btn); border-color:var(--accent-btn);}

/* hero */
.hero{background:var(--navy); color:#fff; position:relative; overflow:hidden;}
.hero .cover{position:relative; aspect-ratio:2172/724; max-width:1920px; margin:0 auto; overflow:hidden;}
.hero .cover img{width:100%; height:100%; object-fit:cover; object-position:center; display:block;}
.hero .cover::after{content:''; position:absolute; inset:0; background:linear-gradient(to bottom,rgba(22,25,29,0) 55%,rgba(22,25,29,0.85) 88%,var(--navy) 100%);}
@media(min-width:1921px){ .hero .cover{-webkit-mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent); mask-image:linear-gradient(to right,transparent,#000 7%,#000 93%,transparent);} }
.hero .profile{display:grid; grid-template-columns:1fr auto; gap:56px; align-items:center; padding:36px 24px 80px; position:relative; z-index:2;}
.eyebrow{display:inline-block; background:rgba(185,113,60,0.18); color:var(--accent2); padding:6px 16px; border-radius:30px; font-size:13px; font-weight:600; margin-bottom:18px;}
.hero-logo{display:block; width:128px; height:128px; border-radius:50%; margin-bottom:22px; box-shadow:0 0 0 6px rgba(255,255,255,0.07),0 26px 50px -22px rgba(0,0,0,0.8);}
.hero h1{font-size:clamp(32px,5vw,50px); font-weight:800; line-height:1.25; letter-spacing:-1px; margin-bottom:10px;}
html[lang=en] .hero h1{letter-spacing:-1.5px;}
.hero .headline{font-size:clamp(18px,2.2vw,22px); font-weight:600; margin-bottom:18px; line-height:1.6; text-align:start;}
.hero .headline b{color:var(--accent2); font-weight:700;}
.hero .lead{font-size:16.5px; color:#B9BEC4; max-width:560px; margin-bottom:30px;}
.btns{display:flex; gap:10px; flex-wrap:wrap;}
.btn-ghost{font-size:13.5px;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:12px 20px; border-radius:12px; font-weight:700; font-size:14.5px; transition:.2s;}
.btn-gold{background:var(--accent-btn); color:#fff;}
.btn-gold:hover{background:var(--accent); transform:translateY(-2px);}
.btn-ghost{background:rgba(255,255,255,0.08); color:#fff; border:1px solid rgba(255,255,255,0.2);}
.btn-ghost:hover{background:rgba(255,255,255,0.16); transform:translateY(-2px);}
.trio{display:flex; align-items:center; justify-content:center; position:relative; padding:12px;}
.trio::before{content:''; position:absolute; inset:0; border-radius:200px; border:1.5px solid rgba(185,113,60,0.5);}
.trio img{width:150px; height:150px; border-radius:50%; object-fit:cover; border:5px solid var(--navy); box-shadow:0 26px 50px -24px rgba(0,0,0,0.8); position:relative; background:var(--navy2);}
.trio img + img{margin-inline-start:-34px;}
.trio img:nth-child(1){z-index:3;} .trio img:nth-child(2){z-index:2;} .trio img:nth-child(3){z-index:1;}

/* sections */
section.block{padding:64px 0;}
.head{text-align:center; max-width:660px; margin:0 auto 44px;}
.head .kk{color:var(--accent-d); font-weight:700; font-size:14px; letter-spacing:1px; margin-bottom:10px;}
html[lang=en] .head .kk{text-transform:uppercase; font-size:12.5px; letter-spacing:2px;}
.head h2{font-size:32px; font-weight:800; letter-spacing:-0.5px;}
.head p{color:var(--muted); margin-top:12px; text-align:justify; text-align-last:center;}
.reveal{opacity:0; transform:translateY(26px); transition:.7s cubic-bezier(.2,.7,.3,1);}
.reveal.in{opacity:1; transform:none;}
.alt{background:var(--soft);}

/* avatars */
.who{display:inline-flex; align-items:center; flex-shrink:0;}
.who .av{width:28px; height:28px; border-radius:50%; object-fit:cover; border:2px solid #fff; box-shadow:0 2px 6px -2px rgba(0,0,0,0.35); background:var(--soft);}
.who .av + .av{margin-inline-start:-9px;}
.who.lg .av{width:34px; height:34px;}

/* about */
.about{display:grid; grid-template-columns:1.15fr 1fr; gap:44px; align-items:center;}
.about p{color:#3F454C; margin-bottom:16px;}
.facts{background:var(--soft); border-radius:18px; padding:26px 28px; border:1px solid var(--line);}
.fact{display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid var(--line); font-size:15px;}
.fact:last-child{border:none;}
.fact .k{color:var(--muted); white-space:nowrap;} .fact .v{font-weight:600; text-align:end;}

/* team */
.t-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.member{background:#fff; border:1px solid var(--line); border-radius:20px; padding:26px 24px; text-align:center; transition:.25s; display:flex; flex-direction:column;}
.member:hover{transform:translateY(-5px); box-shadow:0 22px 48px -22px rgba(22,25,29,0.28); border-color:var(--accent);}
.member .ph{width:124px; height:124px; border-radius:50%; object-fit:cover; margin:0 auto 16px; display:block; box-shadow:0 0 0 4px #fff,0 0 0 5.5px var(--line2);}
.member h3{font-size:18px; font-weight:800; line-height:1.4;}
.member .role{display:inline-block; margin:8px auto 12px; background:var(--tint); color:var(--accent-d); font-size:13px; font-weight:700; padding:4px 13px; border-radius:20px;}
.member .edu{font-size:13px; color:var(--muted); margin-bottom:12px; line-height:1.75; text-align:center;}
.member .bio{font-size:14px; color:#3F454C; flex:1;}
.member .li{display:inline-flex; align-items:center; gap:7px; margin-top:16px; align-self:center; font-size:13.5px; font-weight:600; color:var(--steel); border:1px solid var(--line2); padding:7px 15px; border-radius:10px; transition:.2s;}
.member .li:hover{background:var(--navy); color:#fff; border-color:var(--navy);}

/* services & honors cards */
.h-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.card{background:#fff; border-radius:18px; padding:24px; border:1px solid var(--line); transition:.25s; position:relative;}
.card:hover{transform:translateY(-5px); box-shadow:0 22px 48px -22px rgba(22,25,29,0.28); border-color:var(--accent);}
.card .ico{width:46px; height:46px; border-radius:13px; background:var(--tint); color:var(--accent-d); display:flex; align-items:center; justify-content:center; margin-bottom:15px;}
.card .ico svg{width:23px; height:23px;}
.card h3{font-size:16.5px; font-weight:700; margin-bottom:7px; line-height:1.5;}
.card p{color:var(--muted); font-size:14px;}
.card .who{position:absolute; top:22px; inset-inline-end:22px;}
.card.top{background:linear-gradient(160deg,#fff 0%,var(--tint) 100%); border:1.5px solid rgba(185,113,60,0.45); box-shadow:0 18px 40px -26px rgba(185,113,60,0.6);}
.card.top .ico{background:var(--accent-btn); color:#fff;}
.card.top::after{content:''; position:absolute; top:0; right:24px; left:24px; height:3px; border-radius:0 0 3px 3px; background:var(--accent-btn);}

/* services (three pillars) */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:stretch;}
.svc{background:#fff; border:1px solid var(--line); border-radius:20px; padding:28px 26px; display:flex; flex-direction:column; transition:.25s; position:relative; overflow:hidden;}
.svc::before{content:''; position:absolute; top:0; inset-inline:0; height:4px; background:linear-gradient(90deg,var(--accent),var(--accent2));}
.svc:hover{transform:translateY(-5px); box-shadow:0 22px 48px -22px rgba(22,25,29,0.28); border-color:var(--accent);}
.svc .ico{width:54px; height:54px; border-radius:15px; background:var(--tint); color:var(--accent-d); display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
.svc h3{font-size:19px; font-weight:800; line-height:1.45; margin-bottom:10px;}
.svc .sd{color:var(--muted); font-size:14.5px; margin-bottom:14px;}
.svc ul{list-style:none; margin-bottom:16px;}
.svc li{position:relative; padding-inline-start:18px; font-size:14px; margin-bottom:7px; line-height:1.6;}
.svc li::before{content:''; position:absolute; inset-inline-start:2px; top:9px; width:7px; height:7px; border-radius:2px; background:var(--accent); transform:rotate(45deg);}
.exs{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:auto; padding-top:14px; border-top:1px dashed var(--line2);}
.exl{font-size:12.5px; color:var(--muted); font-weight:600;}
.exb{font:500 12.5px 'Vazirmatn',sans-serif; background:var(--soft); border:1px solid var(--line); color:var(--text); padding:4px 10px; border-radius:8px; cursor:pointer; transition:.2s;}
.exb:hover{background:var(--navy); color:#fff; border-color:var(--navy);}
.svc-links{display:flex; flex-wrap:wrap; gap:6px 18px; margin-top:14px;}
.svc-more{font-weight:700; font-size:14px; color:var(--text); border-bottom:1px solid var(--line2);}
.svc-more:hover{color:var(--accent-d); border-color:var(--accent);}
.svc-cta{font-weight:700; font-size:14px; color:var(--accent-d);}
.svc-cta:hover{color:var(--accent);}

/* publications */
.pub{max-width:780px; margin:0 auto; background:#fff; border:1px solid var(--line); border-radius:18px; padding:30px 32px; position:relative; overflow:hidden;}
.pub::before{content:''; position:absolute; top:0; inset-inline-start:0; width:6px; height:100%; background:linear-gradient(var(--accent),var(--accent2));}
.pub .top{display:flex; justify-content:space-between; align-items:center; gap:12px;}
.jbadge{display:inline-flex; align-items:center; gap:8px; background:var(--navy); color:#fff; padding:7px 14px; border-radius:9px; font-size:13px; font-weight:600; direction:ltr;}
.jbadge b{color:var(--accent2);}
.ptitle{font-size:19px; font-weight:700; margin:16px 0 8px; line-height:1.55; direction:ltr; text-align:left;}
.pub .psum{color:#3F454C; margin-bottom:14px;}
.authors{font-size:13.5px; color:var(--muted); direction:ltr; text-align:left;}
.authors b{color:var(--navy);}
.prole{font-size:14px; background:var(--soft); border-radius:10px; padding:12px 16px; margin:16px 0;}
.pmeta{display:flex; gap:18px; flex-wrap:wrap; font-size:13px; color:var(--muted); margin-bottom:20px;}
.pmeta b{color:var(--accent-d);}
.plink{display:inline-block; background:var(--navy); color:#fff; padding:11px 22px; border-radius:11px; font-weight:600; font-size:14px; transition:.2s;}
.plink:hover{background:var(--navy2); transform:translateY(-2px);}
.plist{max-width:780px; margin:18px auto 0; list-style:none;}
.plist li{display:flex; gap:14px; align-items:flex-start; background:#fff; border:1px solid var(--line); border-radius:14px; padding:15px 18px; margin-bottom:10px;}
.plist .pt{font-size:14.5px; font-weight:600; direction:ltr; text-align:left; line-height:1.55;}
.plist .pv{font-size:13px; color:var(--muted); direction:ltr; text-align:left; margin-top:3px;}
.plist .pv a{color:var(--accent-d); font-weight:600;}
.plist .body{flex:1; min-width:0;}

/* skills */
.skill-cat{margin-bottom:26px; text-align:center;}
.skill-cat h3{font-size:16px; color:var(--navy); margin-bottom:13px; display:flex; align-items:center; justify-content:center; gap:9px;}
.skill-cat h3::before{content:''; width:8px; height:8px; border-radius:50%; background:var(--accent);}
.chips{display:flex; flex-wrap:wrap; gap:9px; justify-content:center;}
.chip{background:var(--soft); border:1px solid var(--line); padding:8px 15px; border-radius:11px; font-size:14px; font-weight:500; transition:.2s;}
.chip:hover{background:var(--navy); color:#fff; border-color:var(--navy); transform:translateY(-2px);}

/* experience */
.timeline{max-width:760px; margin:0 auto; position:relative; padding-inline-start:30px;}
.timeline::before{content:''; position:absolute; inset-inline-start:7px; top:8px; bottom:8px; width:2px; background:var(--line);}
.tl{position:relative; padding-bottom:30px;}
.tl::before{content:''; position:absolute; inset-inline-start:-30px; top:7px; width:15px; height:15px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px #fff,0 0 0 6px var(--line);}
.tl.team::before{background:var(--navy);}
.tl .row{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.tl .when{color:var(--accent-d); font-weight:700; font-size:14px;}
.tl h3{font-size:17.5px; font-weight:700; margin:5px 0 2px; line-height:1.5;}
.tl .org{color:var(--muted); font-size:14px;}
.tl .d{color:var(--muted); font-size:14.5px; margin-top:6px;}

/* project list */
li.pli{list-style:none;}
a.prow{color:inherit;}
.p-list{max-width:780px; margin:0 auto; list-style:none;}
.prow{display:flex; align-items:center; gap:16px; background:#fff; border:1px solid var(--line); border-radius:14px; padding:14px 18px; margin-bottom:12px; cursor:pointer; transition:.2s;}
html[dir=rtl] .prow:hover{transform:translateX(-5px);} html[dir=ltr] .prow:hover{transform:translateX(5px);}
.prow:hover{border-color:var(--accent); box-shadow:0 16px 36px -20px rgba(22,25,29,0.3);}
.prow .pn{font-weight:800; color:var(--accent-d); font-size:18px; min-width:30px;}
.prow .pthumb{width:70px; height:54px; object-fit:contain; background:#fff; border:1px solid var(--line); border-radius:9px; flex-shrink:0;}
.prow .pinfo{flex:1; min-width:0;}
.prow .pt-title{font-weight:700; font-size:16px; line-height:1.5;}
.prow .pt-sub{color:var(--muted); font-size:13px;}
.prow .pchev{color:var(--accent-d); font-weight:700; font-size:14px; white-space:nowrap;}

/* modal */

/* contact */
.contact{background:radial-gradient(120% 140% at 80% 0%,#262B31 0%,var(--navy) 100%); color:#fff; text-align:center;}
.contact h2{font-size:34px; font-weight:800; margin-bottom:14px;}
.contact > .wrap > p{color:#B9BEC4; max-width:500px; margin:0 auto 30px; text-align:justify; text-align-last:center;}
.cform{max-width:520px; margin:6px auto 30px; text-align:start;}
.cf-row{display:flex; gap:12px; margin-bottom:12px;}
.cform input,.cform textarea{width:100%; padding:13px 16px; border-radius:11px; border:1px solid rgba(255,255,255,0.18); background:rgba(255,255,255,0.08); color:#fff; font-family:inherit; font-size:15px; outline:none; transition:.2s;}
.cform input::placeholder,.cform textarea::placeholder{color:#A9AEB5;}
.cform input:focus,.cform textarea:focus{border-color:var(--accent); background:rgba(255,255,255,0.13);}
.cform textarea{resize:vertical; margin-bottom:12px;}
.cf-btn{width:100%; padding:14px; border:none; border-radius:11px; background:var(--accent); color:#fff; font-weight:700; font-size:15px; cursor:pointer; transition:.2s; font-family:inherit;}
.cf-btn:hover{background:var(--accent2); color:var(--navy); transform:translateY(-2px);}
.cf-btn:disabled{opacity:.6; cursor:default; transform:none;}
.cf-status{margin-top:12px; font-size:14px; min-height:20px;}
.cf-status.ok{color:#7ee0a8;} .cf-status.err{color:#ff9b8a;}
.c-other{color:#A9AEB5; font-size:14px; margin-bottom:6px; text-align:center!important;}
.c-links{display:flex; justify-content:center; gap:14px; flex-wrap:wrap; margin-top:14px;}
.c-links a{display:flex; align-items:center; gap:8px; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.16); padding:13px 22px; border-radius:12px; font-size:14px; font-weight:500; transition:.2s;}
.c-links a:hover{background:rgba(255,255,255,0.16); transform:translateY(-2px);}
.c-links a span{direction:ltr; unicode-bidi:isolate;}
footer{background:var(--navy); color:#8F959C; text-align:center; padding:26px; font-size:13px; border-top:1px solid rgba(255,255,255,0.08);}
.fab-phone{display:none;}

/* clips */
section.clips{padding-top:0;}
.m-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:22px; align-items:start; justify-content:center;}
.m-grid:has(> .m-card:only-child){grid-template-columns:minmax(0,380px);}
.m-card{background:var(--white); border:1px solid var(--line); border-radius:14px; overflow:hidden; display:flex; flex-direction:column;}
.m-vid{position:relative; aspect-ratio:16/9; background:var(--navy);}
.m-vid.v{aspect-ratio:9/16;}
.m-vid video{position:absolute; inset:0; width:100%; height:100%; background:#000;}
.m-play{position:absolute; inset:0; width:100%; height:100%; padding:0; border:0; cursor:pointer; background:var(--navy); display:block;}
.m-play img{width:100%; height:100%; object-fit:cover; transition:.25s;}
.m-play:hover img{filter:brightness(.85);}
.m-pbtn{position:absolute; top:50%; left:50%; width:62px; height:62px; margin:-31px 0 0 -31px; border-radius:50%; background:var(--accent-btn); box-shadow:0 8px 24px -6px rgba(0,0,0,.55);}
.m-pbtn::after{content:""; position:absolute; top:50%; left:54%; transform:translate(-50%,-50%); border-style:solid; border-width:10px 0 10px 16px; border-color:transparent transparent transparent #fff;}
.m-bd{padding:16px 20px 20px;}
.m-bd h3{font-size:17px; line-height:1.7; margin-bottom:2px;}
.m-meta{font-size:13px; color:var(--faint);}
.m-desc{font-size:14.5px; color:var(--muted); line-height:1.9; margin-top:8px;}
@media(max-width:980px){ .menu a:not(.nav-cta){padding:7px 8px; font-size:13px;} .svc-grid{grid-template-columns:1fr;} }
@media(max-width:860px){
  nav .wrap{flex-wrap:wrap; padding:10px 16px; gap:10px;}
  .menu{order:3; width:100%; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch;}
  .menu::-webkit-scrollbar{display:none;}
  .nav-phone{display:none;}
  .hero .profile{grid-template-columns:1fr; gap:22px; padding:24px 20px 56px; text-align:center; justify-items:center;}
  .hero-logo{margin-inline:auto; width:112px; height:112px;}
  .hero .trio{order:-1;} .trio img{width:104px; height:104px;} .trio img + img{margin-inline-start:-24px;}
  .hero .headline{text-align:center;} .hero .lead{text-align:justify; text-align-last:center; margin-inline:auto;}
  .btns{justify-content:center;}
  .about,.t-grid,.h-grid,.svc-grid{grid-template-columns:1fr;}
  .fab-phone{display:flex; align-items:center; justify-content:center; position:fixed; bottom:18px; inset-inline-end:18px; width:54px; height:54px; border-radius:50%; background:var(--accent-btn); color:#fff; box-shadow:0 10px 24px -8px rgba(0,0,0,0.55); z-index:90;}
}
@media(max-width:560px){ .cf-row{flex-direction:column;} .prow{gap:11px; padding:12px 13px;} .prow .pn{display:none;} .pub{padding:24px 20px;} }
@media(prefers-reduced-motion:reduce){ *{transition:none!important; animation:none!important;} .reveal{opacity:1; transform:none;} }

/* ---------------------------------------------------------------- multi-page additions */
.lang{text-decoration:none;}
.center{text-align:center;}
.more-link{display:inline-block; margin-top:26px; font-weight:700; color:var(--accent-d); border-bottom:2px solid rgba(185,113,60,.35); padding-bottom:2px;}
.more-link:hover{color:var(--accent);}
.exb{text-decoration:none; display:inline-block;}
.svc h3 a:hover{color:var(--accent-d);}
.btn-link{color:#C9CDD2; font-size:13.5px; font-weight:600; align-self:center; border-bottom:1px solid rgba(255,255,255,.25);}
.btn-link:hover{color:#fff;}
footer .f-links{display:flex; flex-wrap:wrap; justify-content:center; gap:6px 18px; margin-bottom:10px;}
footer .f-links a{color:#C9CDD2;} footer .f-links a:hover{color:#fff;}

/* page header of inner pages */
.page-hero{background:radial-gradient(120% 140% at 80% 0%,#2A2F35 0%,#1E232A 45%,#16191D 100%); color:#fff; padding:44px 0 50px;}
.page-hero .kk{color:var(--accent2); font-weight:700; font-size:14px; margin-bottom:8px;}
html[lang=en] .page-hero .kk{text-transform:uppercase; font-size:12.5px; letter-spacing:2px;}
.page-hero h1{font-size:clamp(28px,4.4vw,42px); font-weight:800; line-height:1.35; margin-bottom:12px; max-width:860px;}
.page-hero p.lead{color:#C2C6CB; font-size:16.5px; max-width:820px; margin-bottom:10px;}
.page-hero .btns{margin-top:22px;}
.crumbs{font-size:13px; color:#8F959C; margin-bottom:18px;}
.crumbs a{color:#C9CDD2;} .crumbs a:hover{color:#fff;}
.crumbs .sep{margin:0 8px; opacity:.6;}
.ph-meta{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px;}
.ph-meta span{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); color:#E3E6E9; font-size:13px; padding:5px 12px; border-radius:9px;}
.ph-meta span.yr{background:rgba(185,113,60,.2); border-color:rgba(185,113,60,.45); color:var(--accent2); font-weight:700;}

/* process steps and FAQ (services page) */
.steps{display:grid; grid-template-columns:repeat(5,1fr); gap:14px; counter-reset:st;}
.step{background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px 18px; position:relative;}
.step::before{counter-increment:st; content:counter(st); display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:var(--accent-btn); color:#fff; font-weight:800; margin-bottom:10px;}
html[lang=fa] .step::before{content:counter(st, persian);}
.step h3{font-size:15.5px; margin-bottom:6px;} .step p{font-size:13.5px; color:var(--muted); text-align:start;}
.faq{max-width:820px; margin:0 auto;}
.faq details{background:#fff; border:1px solid var(--line); border-radius:14px; margin-bottom:10px; transition:.2s;}
.faq details[open]{border-color:var(--accent);}
.faq summary{cursor:pointer; list-style:none; padding:16px 20px; font-weight:700; font-size:15.5px; display:flex; justify-content:space-between; gap:12px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:'+'; color:var(--accent); font-size:22px; line-height:1;}
.faq details[open] summary::after{content:'−';}
.faq details p{padding:0 20px 18px; color:#3F454C;}
.why-list{list-style:none; max-width:820px; margin:0 auto;}
.why-list li{padding:0 0 14px; margin-bottom:14px; border-bottom:1px solid var(--line); color:var(--muted);}
.why-list li:last-child{border-bottom:0;}
.why-list strong{color:var(--text);}
.inds{list-style:none; display:flex; flex-wrap:wrap; gap:8px; justify-content:center;}
.inds li{background:var(--tint); color:var(--accent-d); font-weight:600; font-size:14px; padding:6px 14px; border-radius:99px;}

/* project page */
.pp{display:grid; grid-template-columns:1.1fr 1fr; gap:40px; align-items:start;}
.pp-gal .main{background:#fff; border:1px solid var(--line); border-radius:18px; overflow:hidden; aspect-ratio:4/3; padding:0; width:100%; cursor:zoom-in; display:block;}
.pp-gal .main img{width:100%; height:100%; object-fit:contain; display:block;}
.pp-gal .thumbs{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px;}
.pp-gal .thumbs button{width:86px; height:66px; padding:3px; background:#fff; border:1.5px solid var(--line); border-radius:10px; cursor:pointer;}
.pp-gal .thumbs button:hover{border-color:var(--accent);}
.pp-gal .thumbs img{width:100%; height:100%; object-fit:contain; display:block;}
.pp-gal .cap{font-size:13px; color:var(--muted); margin-top:8px;}
.pp-txt p{color:#3F454C; margin-bottom:14px;}
.pp-box{background:var(--soft); border:1px solid var(--line); border-radius:16px; padding:18px 20px; margin:18px 0;}
.pp-box h2{font-size:16px; font-weight:800; margin-bottom:8px; color:var(--navy);}
.pp-facts{width:100%; border-collapse:collapse; font-size:14.5px;}
.pp-facts th,.pp-facts td{padding:9px 0; border-bottom:1px solid var(--line); vertical-align:top; text-align:start;}
.pp-facts tr:last-child th,.pp-facts tr:last-child td{border-bottom:none;}
.pp-facts th{color:var(--muted); font-weight:500; width:34%; padding-inline-end:12px;}
.pp-facts td{font-weight:600;}
.pp-facts td a{color:var(--accent-d);} .pp-facts td a:hover{color:var(--accent);}
.pp-who{display:flex; flex-direction:column; gap:8px;}
.pp-who a{display:inline-flex; align-items:center; gap:8px;}
.pp-who img{width:30px; height:30px; border-radius:50%; object-fit:cover;}
.pp-cta{background:radial-gradient(120% 140% at 80% 0%,#2A2F35 0%,#16191D 100%); color:#fff; border-radius:20px; padding:30px 32px; display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between;}
.pp-cta h2{font-size:22px; margin-bottom:4px;} .pp-cta p{color:#B9BEC4; margin:0; max-width:560px;}
.pp-nav{display:flex; justify-content:space-between; gap:12px; margin-top:26px; flex-wrap:wrap;}
.pp-nav a{background:#fff; border:1px solid var(--line); border-radius:12px; padding:12px 16px; font-size:14px; max-width:48%;}
.pp-nav a:hover{border-color:var(--accent);}
.pp-nav a small{display:block; color:var(--muted); font-size:12px;}

/* lightbox */
.m-lb{position:fixed; inset:0; z-index:210; background:rgba(12,13,16,.94); display:none; align-items:center; justify-content:center; padding:56px 64px;}
.m-lb.show{display:flex;}
.m-lb img{max-width:100%; max-height:100%; object-fit:contain; border-radius:8px;}
.m-lb button{position:absolute; border:0; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; border-radius:50%; width:46px; height:46px; font-size:26px; line-height:46px; padding:0;}
.m-lb button:hover{background:rgba(255,255,255,.24);}
.m-lb .lb-x{top:14px; inset-inline-end:14px;}
.m-lb .lb-p{top:50%; margin-top:-23px; inset-inline-start:10px;}
.m-lb .lb-n{top:50%; margin-top:-23px; inset-inline-end:10px;}
.m-lb .lb-c{position:absolute; bottom:16px; left:0; right:0; text-align:center; color:#fff; font-size:13px; opacity:.8;}

/* service pages (scoped under .svp) */
.svp h2.sv-h{font-size:27px; font-weight:800; letter-spacing:-0.3px; margin-bottom:22px; line-height:1.5;}
.svp .sv-facts{display:grid; grid-template-columns:repeat(2,1fr); gap:0 28px; border-top:1px solid var(--line);}
.svp .sv-facts div{display:grid; grid-template-columns:150px 1fr; gap:14px; padding:13px 0; border-bottom:1px solid var(--line);}
.svp .sv-facts dt{color:var(--accent-d); font-weight:700; font-size:14px;}
.svp .sv-facts dd{font-size:15px;}
.svp .sv-what{list-style:none; display:grid; grid-template-columns:repeat(2,1fr); gap:16px;}
.svp .sv-what li{background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px 22px; position:relative;}
.svp .sv-what li::before{content:''; position:absolute; top:0; inset-inline-start:22px; width:44px; height:3px; border-radius:0 0 3px 3px; background:var(--accent);}
.svp .sv-what h3{font-size:17px; font-weight:800; line-height:1.5; margin-bottom:6px;}
.svp .sv-what p{color:var(--muted); font-size:14.5px;}
.svp .sv-steps{list-style:none; counter-reset:s; display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.svp .sv-steps li{counter-increment:s; border:1px solid var(--line); border-radius:16px; padding:18px 20px 20px; background:#fff;}
.svp .sv-steps li::before{content:counter(s); display:flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; background:var(--tint); color:var(--accent-d); font-weight:800; margin-bottom:10px;}
html[lang=fa] .svp .sv-steps li::before{content:counter(s, persian);}
.svp .sv-steps h3{font-size:16px; font-weight:800; margin-bottom:4px;}
.svp .sv-steps p{color:var(--muted); font-size:14.5px;}
.svp .sv-pjs{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px;}
.svp .sv-pj{background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; transition:.25s;}
.svp .sv-pj:hover{border-color:var(--accent); transform:translateY(-4px);}
.svp .sv-pj img{width:100%; height:210px; object-fit:cover; background:var(--line);}
.svp .sv-pj div{padding:16px 20px 20px;}
.svp .sv-pj h3{font-size:16px; font-weight:800; line-height:1.6; margin-bottom:6px;}
.svp .sv-pj p{color:var(--muted); font-size:14px;}
.svp .sv-two{display:grid; grid-template-columns:1.15fr 1fr; gap:48px;}
.svp .sv-two .why-list{margin:0;}
.svp .sv-two .inds{justify-content:flex-start;}
.svp .sv-team{list-style:none;}
.svp .sv-team li{display:flex; gap:12px; align-items:flex-start; margin-bottom:14px;}
.svp .sv-team img{width:48px; height:48px; border-radius:50%; flex-shrink:0;}
.svp .sv-team a{font-weight:800; display:block;}
.svp .sv-team a:hover{color:var(--accent-d);}
.svp .sv-team span{display:block; color:var(--accent-d); font-size:13.5px; font-weight:600;}
.svp .sv-team small{display:block; color:var(--muted); font-size:13px; line-height:1.7;}
.svp .sv-faq{display:grid; gap:12px;}
.svp .qa{background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 22px;}
.svp .qa h3{font-size:16.5px; font-weight:800; margin-bottom:6px; line-height:1.6;}
.svp .qa p{color:var(--muted); font-size:15px;}
.svp .related{display:flex; flex-wrap:wrap; gap:12px;}
.svp .related a{border:1px solid var(--line2); border-radius:12px; padding:12px 18px; font-weight:700; color:var(--accent-d);}
.svp .related a:hover{color:var(--accent); border-color:var(--accent);}
.svp .upd{margin-top:26px; font-size:13px; color:var(--faint);}
.svp h2.sv-h.mt{margin-top:38px;}

@media(max-width:960px){ .steps{grid-template-columns:1fr 1fr;} .pp{grid-template-columns:1fr;} }
@media(max-width:860px){
  .svp .sv-facts,.svp .sv-what,.svp .sv-two{grid-template-columns:1fr;}
  .svp .sv-steps{grid-template-columns:1fr 1fr;} .svp .sv-two{gap:20px;}
}
@media(max-width:560px){
  .steps,.svp .sv-steps{grid-template-columns:1fr;}
  .svp .sv-facts div{grid-template-columns:1fr; gap:2px;}
  .svp h2.sv-h{font-size:23px;}
  .m-lb{padding:56px 8px;} .m-lb .lb-p,.m-lb .lb-n{top:auto; bottom:6px; margin-top:0;}
  .pp-nav a{max-width:100%; flex:1 1 100%;}
}