/* =========================================================
   Onbarg — Site theme (RTL/LTR + Light/Dark)
   ========================================================= */
:root{
  --pri:#f99131;--pri2:#f9b431;--pri-d:#e07a1a;
  --grad:linear-gradient(135deg,var(--pri2),var(--pri));
  --bg:#ffffff;--surface:#ffffff;--soft:#f5f6f7;--line:#e9ebee;
  --ink:#24272b;--ink2:#555d66;--muted:#8a919b;
  --dark:#1d2024;--dark2:#272b30;--on-dark:#c3c8cf;
  --header:rgba(255,255,255,.94);--chip:#fff4ea;--chip-ink:#c96a12;
  --sh:0 10px 30px rgba(20,24,30,.07);--sh-lg:0 22px 50px rgba(20,24,30,.13);
  --r:14px;--r-lg:22px;--hh:80px;
  --font:"Rokh","Vazirmatn",Tahoma,sans-serif;
  color-scheme:light;
}
html[data-theme=dark]{
  --bg:#111316;--surface:#191c20;--soft:#15181b;--line:#2a2e34;
  --ink:#f0f2f4;--ink2:#b6bcc4;--muted:#858d97;
  --dark:#0c0e10;--dark2:#181b1f;--on-dark:#aeb4bc;
  --header:rgba(17,19,22,.92);--chip:#2a2016;--chip-ink:#f9b431;
  --sh:0 10px 30px rgba(0,0,0,.35);--sh-lg:0 22px 50px rgba(0,0,0,.5);
  color-scheme:dark;
}
html[lang=en]{--font:"RokhEn","Rokh","Inter","Segoe UI",system-ui,sans-serif}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);font-size:15.5px;line-height:1.95;color:var(--ink2);background:var(--bg);-webkit-font-smoothing:antialiased;overflow-x:hidden;transition:background .3s,color .3s}
html[lang=en] body{line-height:1.7}
img,video{max-width:100%;display:block}
img{height:auto}
a{color:inherit;text-decoration:none;transition:color .2s}
a:hover{color:var(--pri)}
h1,h2,h3,h4{color:var(--ink);line-height:1.5;margin:0 0 .5em;font-weight:800}
p{margin:0 0 1em}
button,input,textarea,select{font:inherit;color:inherit}
.container{width:100%;max-width:1240px;margin-inline:auto;padding-inline:16px}
.narrow{max-width:880px}
.ic{flex:none;vertical-align:middle}
[dir=ltr] .ic-dir{transform:scaleX(-1)}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;inset-inline-start:-999px;top:8px;z-index:200;background:var(--pri);color:#fff;padding:8px 14px;border-radius:8px}
.skip:focus{inset-inline-start:8px}
.muted{color:var(--muted)}
.center-btn{text-align:center;margin-top:40px}
@media(max-width:768px){.hide-sm{display:none!important}}
@media(max-width:1000px){.hide-md{display:none!important}}
html[data-theme=dark] .only-light,html:not([data-theme=dark]) .only-dark{display:none}
:focus-visible{outline:2px solid var(--pri);outline-offset:2px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 26px;border-radius:50px;border:2px solid transparent;background:var(--grad);color:#fff;font-weight:700;cursor:pointer;box-shadow:0 8px 20px rgba(249,145,49,.28);transition:transform .2s,box-shadow .2s,background .2s,color .2s;white-space:nowrap}
.btn:hover{color:#fff;transform:translateY(-2px);box-shadow:0 12px 26px rgba(249,145,49,.4)}
.btn--sm{padding:7px 18px;font-size:14px}
.btn--lg{padding:14px 34px;font-size:16px}
.btn--block{display:flex;width:100%;margin-top:8px}
.btn--ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.65);box-shadow:none;backdrop-filter:blur(4px)}
.btn--ghost:hover{background:#fff;color:#222}
.side__box .btn--ghost,.nav .btn--ghost-dark{background:transparent;border-color:var(--line);color:var(--ink)}
.btn--ghost-dark{background:transparent;border-color:var(--line);color:var(--ink);box-shadow:none}
.btn--outline{background:transparent;color:var(--pri);border-color:var(--pri);box-shadow:none}
.btn--outline:hover{background:var(--pri);color:#fff}
.btn--light{background:#fff;color:var(--pri-d);box-shadow:0 8px 20px rgba(0,0,0,.12)}
.btn--light:hover{color:var(--pri-d)}
.more{display:inline-flex;align-items:center;gap:6px;color:var(--pri);font-weight:700;font-size:14px}
.more .ic{transition:transform .2s}
[dir=rtl] .more:hover .ic{transform:translateX(-4px)}
[dir=ltr] .more:hover .ic{transform:scaleX(-1) translateX(-4px)}

/* Topbar */
.topbar{background:var(--dark);color:var(--on-dark);font-size:13px}
.topbar__in{display:flex;justify-content:space-between;align-items:center;min-height:40px;gap:12px}
.topbar a,.topbar span{display:inline-flex;align-items:center;gap:6px}
.topbar__info,.topbar__act{display:flex;align-items:center;gap:18px}
.topbar__login{color:#fff;font-weight:700}
.socials{display:flex;gap:10px}
.langsw{padding:2px 12px;border-radius:30px;border:1px solid rgba(255,255,255,.18);color:#fff;font-weight:700}
.langsw:hover{background:var(--pri);border-color:var(--pri);color:#fff}

/* Header */
.header{position:sticky;top:0;z-index:50;background:var(--header);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid var(--line);transition:box-shadow .3s}
.header.is-stuck{box-shadow:0 8px 24px rgba(0,0,0,.08)}
.header__in{display:flex;align-items:center;gap:20px;height:var(--hh)}
.logo img{height:46px;width:auto}
.logo__dark{display:none}
html[data-theme=dark] .logo__light{display:none}
html[data-theme=dark] .logo__dark{display:block}
.nav{margin-inline-start:auto}
.nav ul{list-style:none;display:flex;gap:2px;margin:0;padding:0}
.nav a{position:relative;display:block;padding:8px 11px;font-weight:700;color:var(--ink);font-size:15px}
.nav ul a::after{content:"";position:absolute;inset-inline:11px;bottom:2px;height:3px;border-radius:3px;background:var(--grad);transform:scaleX(0);transition:transform .25s}
.nav a:hover,.nav a.is-active{color:var(--pri)}
.nav a:hover::after,.nav a.is-active::after{transform:scaleX(1)}
.nav__close,.nav__extra{display:none}
.header__tools{display:flex;align-items:center;gap:8px}
.iconbtn{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:0;background:var(--soft);color:var(--ink);cursor:pointer;transition:background .2s,color .2s}
.iconbtn:hover{background:var(--pri);color:#fff}
.burger{display:none}
.nav-backdrop{display:none}
@media(max-width:1120px){
  .burger{display:grid}
  .nav{position:fixed;top:0;bottom:0;inset-inline-start:auto;inset-inline-end:0;width:min(330px,86vw);background:var(--surface);z-index:70;padding:70px 20px 20px;transition:transform .3s;box-shadow:var(--sh-lg);overflow:auto}
  [dir=rtl] .nav{right:0;left:auto;transform:translateX(100%)}
  [dir=ltr] .nav{left:auto;right:0;transform:translateX(100%)}
  .nav ul{flex-direction:column}
  .nav a{padding:12px;border-bottom:1px solid var(--line)}
  .nav ul a::after{display:none}
  .nav__close{display:grid;place-items:center;position:absolute;top:16px;inset-inline-end:16px;width:40px;height:40px;border:0;border-radius:50%;background:var(--soft);cursor:pointer}
  .nav__extra{display:flex;gap:8px;margin-top:20px}
  .nav__extra a{border:0}
  body.nav-open .nav{transform:none}
  body.nav-open .nav-backdrop{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:60}
}

/* Search overlay */
.search{position:fixed;inset:0;z-index:90;background:rgba(15,17,20,.95);display:grid;place-items:center;padding:16px}
.search[hidden]{display:none}
.search__box{display:flex;gap:10px;width:min(680px,100%)}
.search__box input{flex:1;min-width:0;padding:16px 22px;border-radius:50px;border:0;font-size:17px;outline:none;background:#fff;color:#222}
.search__close{position:absolute;top:24px;inset-inline-end:24px;background:none;border:0;color:#fff;cursor:pointer}

/* Hero */
.hero{position:relative;height:min(88vh,760px);min-height:540px;background:#111;overflow:hidden;color:#fff}
.hero__slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity 1s,visibility 1s}
.hero__slide.is-active{opacity:1;visibility:visible}
.hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__slide::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,12,15,.2),rgba(10,12,15,.78))}
[dir=ltr] .hero__slide::after{background:linear-gradient(270deg,rgba(10,12,15,.2),rgba(10,12,15,.78))}
.hero__content{position:relative;z-index:2;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.hero__kicker{display:inline-block;padding:4px 16px;border-radius:50px;background:rgba(249,145,49,.2);border:1px solid rgba(249,145,49,.6);color:var(--pri2);font-weight:700;font-size:14px;margin-bottom:18px}
.hero__title{color:#fff;font-size:clamp(28px,5vw,56px);font-weight:800;max-width:780px;margin-bottom:12px}
.hero__sub{font-size:clamp(15px,2vw,20px);max-width:640px;opacity:.9;margin-bottom:28px}
.hero__btns{display:flex;flex-wrap:wrap;gap:12px}
.hero__btns--center{justify-content:center}
.is-active .hero__kicker,.is-active .hero__title,.is-active .hero__sub,.is-active .hero__btns{animation:up .9s both}
.is-active .hero__title{animation-delay:.15s}.is-active .hero__sub{animation-delay:.3s}.is-active .hero__btns{animation-delay:.45s}
@keyframes up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.hero__dots{position:absolute;z-index:3;bottom:84px;inset-inline:0;display:flex;justify-content:center;gap:10px}
.hero__dots button{width:12px;height:12px;border-radius:12px;border:2px solid #fff;background:transparent;cursor:pointer;padding:0;transition:width .3s,background .3s}
.hero__dots button.is-active{width:34px;background:var(--pri);border-color:var(--pri)}

/* Experience strip */
.exp{position:relative;z-index:5;margin-top:-56px}
.exp__in{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:28px;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--sh-lg);padding:26px 34px;border:1px solid var(--line)}
.exp__years{display:flex;align-items:center;gap:10px}
.exp__years b{font-size:56px;line-height:1;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.exp__years span{font-weight:700;color:var(--ink);max-width:70px;line-height:1.4}
.exp__q{font-size:20px;font-weight:700;color:var(--ink)}
.exp__q strong{color:var(--pri)}
.exp__call{display:flex;align-items:center;gap:12px}
.exp__ic{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--grad);color:#fff;animation:ring 2.4s infinite}
.exp__call small{display:block;color:var(--muted)}
.exp__call b{font-size:20px;color:var(--ink)}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(249,145,49,.5)}70%{box-shadow:0 0 0 16px rgba(249,145,49,0)}100%{box-shadow:0 0 0 0 rgba(249,145,49,0)}}
@media(max-width:860px){.exp__in{grid-template-columns:1fr;text-align:center;justify-items:center;padding:22px}}

/* Sections */
.sec{padding:96px 0}
.sec--soft{background:var(--soft)}
.sec--dark{background:var(--dark);color:var(--on-dark)}
.sec--dark h2,.sec--dark h3{color:#fff}
@media(max-width:768px){.sec{padding:64px 0}}
.sechead{text-align:center;max-width:760px;margin:0 auto 50px}
.kicker{display:inline-flex;align-items:center;gap:10px;color:var(--pri);font-weight:800;font-size:15px;margin-bottom:6px}
.kicker::before{content:"";width:28px;height:3px;border-radius:3px;background:var(--grad)}
.kicker--light{color:var(--pri2)}
.title{font-size:clamp(24px,3.2vw,36px)}
.title em{font-style:normal;color:var(--pri)}
.lead{font-size:17px;color:var(--ink)}

/* Services (home) */
.svc-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:24px;align-items:stretch}
.svc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.svc{position:relative;display:flex;flex-direction:column;background:var(--surface);border-radius:var(--r-lg);padding:28px;border:1px solid var(--line);transition:transform .3s,box-shadow .3s,border-color .3s;overflow:hidden}
.svc:hover{transform:translateY(-6px);box-shadow:var(--sh-lg);border-color:transparent}
.svc::after{content:"";position:absolute;inset-inline:0;top:0;height:4px;background:var(--grad);transform:scaleX(0);transform-origin:var(--o,right);transition:transform .35s}
[dir=ltr] .svc::after{--o:left}
.svc:hover::after{transform:scaleX(1)}
.svc__ic{display:inline-grid;place-items:center;width:58px;height:58px;border-radius:18px;background:var(--chip);color:var(--pri);margin-bottom:16px;transition:background .3s,color .3s}
.svc:hover .svc__ic{background:var(--grad);color:#fff}
.svc__ic--lg{width:76px;height:76px;border-radius:22px;background:rgba(255,255,255,.12);color:#fff;margin-bottom:18px}
.svc__num{position:absolute;top:18px;inset-inline-end:22px;font-size:40px;font-weight:800;line-height:1;color:var(--line);transition:color .3s}
.svc:hover .svc__num{color:var(--chip)}
.svc h3{font-size:18.5px;margin-bottom:8px}
.svc p{font-size:14.5px;flex:1}
.svc--feat{background:linear-gradient(160deg,#2a2015,#1d2024 55%);color:#cfd3d9;border:0;padding:36px}
.svc--feat::before{content:"";position:absolute;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(249,145,49,.45),transparent 65%);top:-120px;inset-inline-end:-120px}
.svc--feat h3{font-size:24px;color:#fff;position:relative}
.svc--feat h3 a:hover{color:var(--pri2)}
.svc--feat p{font-size:15.5px;flex:none;position:relative}
.svc--feat .svc__ic{width:72px;height:72px;background:var(--grad);color:#fff;position:relative}
.svc--feat .svc__num{color:rgba(255,255,255,.08);font-size:60px}
.svc--feat .checks{margin:6px 0 22px;position:relative}
.svc--feat .checks li{color:#e6e8eb;font-size:14px}
.svc--feat .more{color:var(--pri2);position:relative}
@media(max-width:1000px){.svc-layout{grid-template-columns:1fr}}
@media(max-width:620px){.svc-grid{grid-template-columns:1fr}}
.checks{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px}
.checks li{display:flex;gap:10px;align-items:flex-start}
.checks .ic{color:var(--pri);margin-top:6px}
.checks--2{grid-template-columns:repeat(2,1fr);gap:10px 20px}
@media(max-width:620px){.checks--2{grid-template-columns:1fr}}

/* Services list page */
.svc-list{display:grid;gap:18px}
.svc-row{display:grid;grid-template-columns:auto auto 1fr auto;gap:22px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px 28px;transition:box-shadow .3s,transform .3s}
.svc-row:hover{box-shadow:var(--sh-lg);transform:translateY(-3px)}
.svc-row .svc__ic{margin:0}
.svc-row:hover .svc__ic{background:var(--grad);color:#fff}
.svc-row__n{font-size:34px;font-weight:800;color:var(--line);line-height:1}
.svc-row h2{font-size:20px;margin:0 0 4px}
.svc-row p{margin:0 0 8px;font-size:14.5px}
.chips--plain{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.chips--plain li{font-size:12.5px;padding:2px 10px;border-radius:20px;background:var(--soft);border:1px solid var(--line)}
@media(max-width:800px){.svc-row{grid-template-columns:auto 1fr;padding:20px}.svc-row__n{display:none}.svc-row .btn{grid-column:1/-1}}

/* Service page hero */
.svc-hero{position:relative;overflow:hidden;background:radial-gradient(900px 500px at 85% 0%,rgba(249,145,49,.35),transparent 60%),linear-gradient(180deg,#1a1d21,#24282d);color:#cfd3d9;padding:50px 0 70px}
.svc-hero::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,#000,transparent);pointer-events:none}
.svc-hero__in{position:relative;z-index:1;display:grid;grid-template-columns:1.3fr 1fr;gap:50px;align-items:center}
.svc-hero h1{color:#fff;font-size:clamp(28px,4.4vw,48px);margin:0 0 12px}
.svc-hero__lead{font-size:18px;opacity:.9;max-width:640px;margin-bottom:24px}
.svc-hero__feats{list-style:none;margin:0;padding:22px;display:grid;gap:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:var(--r-lg);backdrop-filter:blur(6px)}
.svc-hero__feats li{display:flex;gap:10px;align-items:flex-start;color:#e8eaed}
.svc-hero__feats .ic{flex:none;color:#fff;background:var(--grad);border-radius:50%;padding:3px;width:24px;height:24px;margin-top:3px}
@media(max-width:900px){.svc-hero__in{grid-template-columns:1fr}}

/* About */
.about{display:grid;grid-template-columns:1fr 1.1fr;gap:60px;align-items:center}
.about__media{position:relative}
.about__media img{width:100%;border-radius:var(--r-lg) 0 var(--r-lg) var(--r-lg);box-shadow:var(--sh-lg);aspect-ratio:4/4.2;object-fit:cover}
.about__badge{position:absolute;bottom:-24px;inset-inline-start:-24px;background:var(--grad);color:#fff;border-radius:var(--r-lg);padding:20px 26px;text-align:center;box-shadow:var(--sh-lg)}
.about__badge b{display:block;font-size:40px;line-height:1}
.why{display:grid;gap:14px;margin:24px 0 30px}
.why--grid{grid-template-columns:repeat(4,1fr);gap:22px;margin:0}
.why__item{display:flex;gap:16px;padding:18px;border-radius:var(--r);background:var(--surface);border:1px solid var(--line);transition:box-shadow .25s,transform .25s}
.why--grid .why__item{flex-direction:column;padding:26px}
.why__item:hover{box-shadow:var(--sh);transform:translateY(-3px)}
.why__ic{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:14px;background:var(--chip);color:var(--pri)}
.why__item h3{font-size:16.5px;margin-bottom:2px}
.why__item p{margin:0;font-size:14.5px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tags span{padding:5px 14px;border-radius:50px;background:var(--chip);color:var(--chip-ink);font-size:13.5px;font-weight:700}
@media(max-width:1000px){.why--grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.about{grid-template-columns:1fr;gap:50px}.about__badge{inset-inline-start:12px}}
@media(max-width:560px){.why--grid{grid-template-columns:1fr}}

/* Band / CTA */
.band{position:relative;padding:84px 0;color:#fff;background:#333 var(--img) center/cover fixed}
.band::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(249,145,49,.93),rgba(29,32,36,.86))}
[dir=ltr] .band::before{background:linear-gradient(270deg,rgba(249,145,49,.93),rgba(29,32,36,.86))}
.band__in{position:relative;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.band h2{color:#fff;font-size:clamp(24px,3.4vw,38px);margin:0}
.band p{margin:0;opacity:.92;font-size:18px}
.cta{background:var(--grad);padding:56px 0;color:#fff}
.cta__in{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.cta h2{color:#fff;margin:0;font-size:clamp(22px,3vw,32px)}
.cta p{margin:4px 0 0;opacity:.92}
@media(max-width:768px){.band{background-attachment:scroll}}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.stats--4{grid-template-columns:repeat(4,1fr)}
.stat{text-align:center;padding:34px 16px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);transition:box-shadow .25s}
.stat:hover{box-shadow:var(--sh)}
.stat b{display:block;font-size:clamp(38px,5vw,56px);line-height:1.2;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat>span{font-weight:700;color:var(--ink)}
@media(max-width:768px){.stats,.stats--4{grid-template-columns:repeat(2,1fr)}}

/* Process */
.process{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.step{position:relative;padding:30px 24px;border-radius:var(--r-lg);background:var(--dark2);border:1px solid rgba(255,255,255,.06);transition:transform .25s,border-color .25s}
.step:hover{transform:translateY(-6px);border-color:var(--pri)}
.step__n{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;font-size:22px;font-weight:800;margin-bottom:14px;background:var(--grad);color:#fff}
.step h3{font-size:19px}.step p{margin:0;font-size:14.5px}
@media(max-width:1000px){.process{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.process{grid-template-columns:1fr}}

/* Talk */
.talk{display:grid;grid-template-columns:1.5fr auto;gap:40px;align-items:center;padding:44px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh)}
.talk__btns{display:flex;flex-direction:column;gap:12px}
@media(max-width:860px){.talk{grid-template-columns:1fr;padding:28px}.talk__btns{flex-direction:row;flex-wrap:wrap}}

/* Testimonials */
.tst-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tst{margin:0;background:var(--surface);padding:30px;border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--sh);display:flex;flex-direction:column}
.tst__q{color:var(--pri);opacity:.5;margin-bottom:10px}
.tst blockquote{margin:0 0 20px;flex:1}
.tst figcaption{display:flex;align-items:center;gap:12px;border-top:1px solid var(--line);padding-top:16px}
.tst img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:3px solid var(--chip)}
.tst b{display:block;color:var(--ink)}.tst small{color:var(--muted)}
@media(max-width:960px){.tst-grid{grid-template-columns:1fr}}

/* Clients */
.clients{padding:40px 0;border-block:1px solid var(--line)}
.clients__row{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:34px 50px}
.clients img{max-height:52px;width:auto;filter:grayscale(1);opacity:.6;transition:.3s}
.clients img:hover{filter:none;opacity:1}
html[data-theme=dark] .clients img{filter:grayscale(1) invert(1) brightness(1.4)}

/* Team */
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.member{text-align:center}
.member__img{position:relative;border-radius:var(--r-lg);overflow:hidden;margin-bottom:16px;aspect-ratio:1;background:var(--soft)}
.member__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.member__img::after{content:"";position:absolute;inset:auto 0 0;height:5px;background:var(--grad);transform:scaleX(0);transition:transform .3s}
.member:hover img{transform:scale(1.07)}.member:hover .member__img::after{transform:scaleX(1)}
.member h3{font-size:18px;margin:0}.member span{color:var(--pri);font-size:14px;font-weight:700}
@media(max-width:900px){.team{grid-template-columns:repeat(2,1fr)}}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(5,1fr)}
.gallery a{position:relative;overflow:hidden;aspect-ratio:1}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .5s,filter .3s;filter:grayscale(.4)}
.gallery a:hover img{transform:scale(1.08);filter:none}
@media(max-width:700px){.gallery{grid-template-columns:repeat(3,1fr)}.gallery a:nth-child(n+4){display:none}}
.lightbox{position:fixed;inset:0;z-index:95;background:rgba(0,0,0,.92);display:grid;place-items:center;padding:16px;cursor:zoom-out}
.lightbox img{max-height:90vh;border-radius:var(--r)}
.lightbox__nav{position:fixed;top:50%;transform:translateY(-50%);width:50px;height:50px;border-radius:50%;border:0;background:rgba(255,255,255,.15);color:#fff;font-size:26px;cursor:pointer}
.lightbox__nav--prev{right:20px}.lightbox__nav--next{left:20px}

/* Page head */
.pagehead{position:relative;padding:76px 0 66px;background:var(--dark);color:#fff;overflow:hidden;text-align:center}
.pagehead::before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;background:var(--grad);opacity:.16;top:-260px;inset-inline-end:-160px}
.pagehead::after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;border:40px solid rgba(249,145,49,.1);bottom:-170px;inset-inline-start:-80px}
.pagehead .container{position:relative;z-index:1}
.pagehead h1{color:#fff;font-size:clamp(26px,4vw,44px);margin-bottom:8px}
.pagehead__lead{max-width:720px;margin:0 auto 10px;color:var(--on-dark);font-size:16.5px}
.crumbs{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;color:#9aa1a9;font-size:14px}
.crumbs a{color:var(--pri2)}
.crumbs--start{justify-content:flex-start;margin-bottom:26px}

/* Cards (blog/shop) */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.cards--2{grid-template-columns:repeat(2,1fr)}
.cards--4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--surface);border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg)}
.card__img{position:relative;display:block;aspect-ratio:16/10;background:var(--soft);overflow:hidden}
.card--product .card__img{aspect-ratio:1}
.card__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.card:hover .card__img img{transform:scale(1.06)}
.card__ph{display:grid;place-items:center;width:100%;height:100%;font-size:54px;font-weight:800;color:#fff;background:var(--grad)}
.card__off{position:absolute;top:12px;inset-inline-start:12px;z-index:2;background:#e5484d;color:#fff;font-size:12px;font-weight:700;padding:2px 10px;border-radius:50px}
.card__body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.card__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:13px;color:var(--muted);margin-bottom:6px}
.card__meta time{display:inline-flex;align-items:center;gap:5px}
.card__cat{color:var(--chip-ink);font-weight:700}
.card__body h3{font-size:17px;margin-bottom:8px}
.card__body p{font-size:14.5px;flex:1}
.price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:auto}
.price b{color:var(--pri-d);font-size:17px}
html[data-theme=dark] .price b{color:var(--pri2)}
.price del{color:var(--muted);font-size:14px}
.price__ask{color:var(--ink)!important}
@media(max-width:1000px){.cards,.cards--4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.cards,.cards--2,.cards--4{grid-template-columns:1fr}}
.empty{padding:40px;text-align:center;background:var(--soft);border-radius:var(--r-lg);border:1px dashed var(--line)}

/* Sidebar layout */
.with-side{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:40px;align-items:start}
.side{display:grid;gap:22px;position:sticky;top:calc(var(--hh) + 20px)}
.side__box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px}
.side__box h4{font-size:16px;display:flex;align-items:center;gap:8px}
.side__search{display:flex;gap:8px;padding:10px}
.side__search input{flex:1;min-width:0;border:0;background:var(--soft);border-radius:50px;padding:10px 16px;outline:none}
.side__search button{width:42px;height:42px;border-radius:50%;border:0;background:var(--grad);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.side__list{list-style:none;margin:0;padding:0}
.side__list a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed var(--line)}
.side__list--svc a{justify-content:flex-start}
.side__list--svc .ic{color:var(--pri)}
.side__list span{color:var(--muted);font-size:13px}
.side__cta{background:var(--dark);color:var(--on-dark);border:0}.side__cta h4{color:#fff}
@media(max-width:960px){.with-side{grid-template-columns:1fr}.side{position:static}}
.toc ol{margin:0;padding-inline-start:20px;font-size:14px}
.toc li{margin:4px 0}
.toc__l3{margin-inline-start:14px;font-size:13.5px}
.toc a:hover{color:var(--pri)}
.toc--inline{background:var(--soft);border:1px solid var(--line);border-radius:var(--r);padding:14px 18px;margin-bottom:24px}
.toc--inline summary{cursor:pointer;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:8px}
.toc--inline ol{margin-top:10px}
@media(min-width:961px){.toc--inline{display:none}}

/* Pager */
.pager{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:40px}
.pager a,.pager span{min-width:42px;height:42px;padding:0 12px;display:grid;place-items:center;border-radius:12px;background:var(--surface);border:1px solid var(--line);font-weight:700}
.pager a:hover{border-color:var(--pri)}
.pager .is-cur{background:var(--grad);color:#fff;border-color:transparent}
.pager .is-off{opacity:.5}

/* Article */
.article__img{width:100%;border-radius:var(--r-lg);margin-bottom:22px}
.article__meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;color:var(--muted);font-size:14px;margin-bottom:20px}
.article__meta>span{display:inline-flex;align-items:center;gap:6px}
.article__tags{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:26px;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-block;padding:4px 14px;border-radius:50px;background:var(--chip);color:var(--chip-ink);font-size:13.5px;font-weight:700}
.chip.is-on,.chip:hover{background:var(--pri);color:#fff}
.prose{font-size:16.5px;line-height:2.1;color:var(--ink2);overflow-wrap:anywhere}
html[lang=en] .prose{line-height:1.85}
.prose h2,.prose h3,.prose h4{margin:1.6em 0 .6em;scroll-margin-top:calc(var(--hh) + 20px)}
.prose h2{font-size:clamp(21px,2.4vw,26px)}
.prose h3{font-size:20px}
.prose img{height:auto;border-radius:var(--r);margin:16px auto}
.prose a{color:var(--pri-d);text-decoration:underline;text-underline-offset:3px}
html[data-theme=dark] .prose a{color:var(--pri2)}
.prose ul,.prose ol{padding-inline-start:22px}
.prose li{margin:4px 0}
.prose blockquote{margin:20px 0;padding:16px 20px;border-inline-start:4px solid var(--pri);background:var(--soft);border-radius:var(--r)}
.prose table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}
.prose td,.prose th{border:1px solid var(--line);padding:8px 12px}
.prose iframe,.prose video{max-width:100%}
.prose pre,.prose code{direction:ltr;text-align:left;background:var(--soft);border-radius:8px;font-family:ui-monospace,monospace;font-size:14px}
.prose pre{padding:14px;overflow:auto}
.share{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:30px;padding-top:20px;border-top:1px solid var(--line);font-size:14px}
.share a,.share button{padding:4px 14px;border-radius:50px;background:var(--soft);border:1px solid var(--line);cursor:pointer}
.share a:hover,.share button:hover{border-color:var(--pri);color:var(--pri)}

/* Product */
.product{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start;margin-bottom:40px}
.product__img{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh);aspect-ratio:1;background:var(--soft)}
.product__img img{width:100%;height:100%;object-fit:cover}
.product__info .price{margin:18px 0}.product__info .price b{font-size:24px}
.product__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.shopbar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:30px}
@media(max-width:860px){.product{grid-template-columns:1fr;gap:28px}}

/* Search page */
.searchpage__form{background:var(--surface);border:1px solid var(--line);border-radius:50px;margin-bottom:30px}
.searchpage__h{font-size:20px;margin:10px 0 18px}
.results{display:grid;gap:14px}
.result{display:block;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px 22px;transition:.25s}
.result:hover{border-color:var(--pri);box-shadow:var(--sh);color:inherit}
.result h3{font-size:18px;margin:2px 0 4px}
.result p{margin:0;font-size:14.5px}
.result__type{font-size:12px;font-weight:700;color:var(--chip-ink);background:var(--chip);padding:1px 10px;border-radius:20px}
.pgrid--compact{margin-bottom:30px}

/* Ticket */
.tk-top{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.tk-top p{margin:0}
.tk-head{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 20px;margin-bottom:20px}
.tk-st{padding:2px 12px;border-radius:50px;font-size:13px;font-weight:700;background:var(--chip);color:var(--chip-ink)}
.tk-st--answered{background:#e9f9ef;color:#1a7f43}.tk-st--closed{background:var(--soft);color:var(--muted)}
.thread{display:grid;gap:14px;margin-bottom:24px}
.bubble{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 20px;max-width:85%;justify-self:start;border-inline-start:4px solid var(--line)}
.bubble--staff{justify-self:end;border-inline-start-color:var(--pri)}
.bubble__who{font-weight:700;color:var(--ink);font-size:14px;margin-bottom:6px;display:flex;gap:10px;flex-wrap:wrap}
.bubble__who time{font-weight:400;color:var(--muted);font-size:12.5px}

/* Contact & forms */
.cinfo{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.cinfo__card{display:flex;flex-direction:column;align-items:center;text-align:center;padding:36px 20px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--line);transition:transform .25s,box-shadow .25s}
.cinfo__card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);color:inherit}
.cinfo__ic{display:grid;place-items:center;width:66px;height:66px;border-radius:50%;background:var(--grad);color:#fff;margin-bottom:14px}
.cinfo__card h3{font-size:18px;margin-bottom:4px}
.cinfo__v{font-size:17px;font-weight:700;color:var(--ink)}
.cinfo__card small{color:var(--muted);margin-top:4px}
@media(max-width:860px){.cinfo{grid-template-columns:1fr}}
.contact-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:50px;align-items:start}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr}}
.form{display:grid;gap:16px;background:var(--surface);padding:34px;border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--sh)}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form label span{display:block;font-weight:700;color:var(--ink);font-size:14px;margin-bottom:6px}
.form input,.form textarea,.form select{width:100%;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--soft);outline:none;transition:border-color .2s,background .2s}
.form input:focus,.form textarea:focus,.form select:focus{border-color:var(--pri);background:var(--surface)}
.form input[type=file]{padding:9px;background:var(--surface)}
.form .btn{justify-self:start}
.hp{position:absolute!important;inset-inline-start:-9999px!important}
.alert{padding:14px 18px;border-radius:12px;margin-bottom:18px;font-weight:700}
.alert--ok{background:#e9f9ef;color:#1a7f43}.alert--err{background:#fdecec;color:#b42318}
html[data-theme=dark] .alert--ok{background:#123222;color:#7ee2a8}
html[data-theme=dark] .alert--err{background:#3a1717;color:#ff9b9b}
@media(max-width:640px){.form{padding:22px}.form__row{grid-template-columns:1fr}}

/* FAQ */
.faq{display:grid;gap:14px}
.faq__item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.faq__item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 22px;font-weight:700;color:var(--ink)}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary .ic{color:var(--pri);transition:transform .25s}
.faq__item[open]{border-color:var(--pri);box-shadow:var(--sh)}
.faq__item[open] summary .ic{transform:rotate(45deg)}
.faq__a{padding:0 22px 20px}

/* 404 */
.notfound{text-align:center;max-width:680px}
.notfound>b{display:block;font-size:120px;line-height:1;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.notfound__search{max-width:440px;margin:20px auto;background:var(--soft);border-radius:50px}

/* Footer */
.footer{background:var(--dark);color:var(--on-dark);font-size:14.5px}
.footer__cta{border-bottom:1px solid rgba(255,255,255,.07)}
.footer__cta-in{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-block:34px}
.footer__cta b{display:block;color:#fff;font-size:20px}
.footer__cta-btns{display:flex;gap:10px;flex-wrap:wrap}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:40px;padding-block:60px 46px}
.footer h4{color:#fff;font-size:17px;margin-bottom:18px;position:relative;padding-bottom:10px}
.footer h4::after{content:"";position:absolute;bottom:0;inset-inline-start:0;width:34px;height:3px;border-radius:3px;background:var(--grad)}
.footer__logo{height:48px;width:auto;margin-bottom:18px}
.footer__about p{text-align:justify}
.socials--footer a{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.07)}
.socials--footer a:hover{background:var(--pri);color:#fff}
.footer__links,.footer__contact{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.footer__links a::before{content:"‹";color:var(--pri);margin-inline-end:8px}
[dir=ltr] .footer__links a::before{content:"›"}
.footer__links a:hover,.footer__contact a:hover{color:var(--pri2)}
.footer__contact li{display:flex;align-items:flex-start;gap:10px;font-size:15px}
.footer__contact .ic{color:var(--pri);margin-top:4px}
.footer__email{font-size:16.5px;font-weight:700;color:#fff}
.footer__badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.badge{background:#fff;border-radius:12px;padding:6px;display:grid;place-items:center;min-width:90px;min-height:90px}
.badge img{max-height:100px;width:auto}
.footer__bottom{border-top:1px solid rgba(255,255,255,.07);padding:18px 0;font-size:13.5px}
.footer__bottom-in{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.footer__bottom nav{display:flex;gap:16px}
@media(max-width:1000px){.footer__grid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.footer__grid{grid-template-columns:1fr}}

/* Floating */
.callfab{position:fixed;bottom:20px;inset-inline-end:20px;z-index:40;display:flex;align-items:center;gap:10px;padding:6px 18px 6px 6px;border-radius:50px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-lg);color:var(--ink)}
[dir=rtl] .callfab{padding:6px 6px 6px 18px}
.callfab img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid var(--pri)}
.callfab small{display:block;font-size:11.5px;color:var(--muted);line-height:1.3}
.callfab b{font-size:15px}
.wafab{position:fixed;bottom:84px;inset-inline-end:20px;z-index:40;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#25d366;color:#fff;box-shadow:var(--sh-lg)}
.wafab:hover{color:#fff;transform:scale(1.06)}
.totop{position:fixed;bottom:20px;inset-inline-start:20px;z-index:40;width:46px;height:46px;border-radius:50%;border:0;background:var(--grad);color:#fff;display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(10px);transition:.3s;box-shadow:var(--sh)}
.totop.is-on{opacity:1;visibility:visible;transform:none}
@media(max-width:560px){.callfab span{display:none}.callfab,[dir=rtl] .callfab{padding:5px}}

/* ================= Portfolio ================= */
.phero{position:relative;overflow:hidden;background:radial-gradient(1200px 500px at 85% -10%,rgba(249,145,49,.35),transparent 60%),radial-gradient(800px 400px at 0% 120%,rgba(249,180,49,.18),transparent 60%),var(--dark);color:var(--on-dark);padding:60px 0 80px;text-align:center}
.phero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(ellipse at center,#000 30%,transparent 75%);pointer-events:none}
.phero__in{position:relative;z-index:1;max-width:820px}
.phero .crumbs{margin-bottom:24px}
.phero h1{color:#fff;font-size:clamp(30px,5vw,54px);margin:6px 0 12px}
.phero p{font-size:18px;opacity:.85}
.phero__stats{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-top:30px}
.phero__stats div{min-width:120px;padding:14px 20px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(6px)}
.phero__stats b{display:block;font-size:30px;line-height:1.2;color:#fff}
.phero__stats span{font-size:13px}
.pfilter{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:16px}
.pfilter button{border:1px solid var(--line);background:var(--surface);border-radius:50px;padding:9px 20px;font-weight:700;color:var(--ink);cursor:pointer;transition:.25s}
.pfilter button small{display:inline-grid;place-items:center;min-width:22px;height:22px;border-radius:20px;background:var(--soft);font-size:11px;margin-inline-start:4px}
.pfilter button:hover{border-color:var(--pri);color:var(--pri)}
.pfilter button.is-on{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 8px 20px rgba(249,145,49,.3)}
.pfilter button.is-on small{background:rgba(255,255,255,.25)}
.pcats{justify-content:center;margin-bottom:34px}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
@media(max-width:1000px){.pgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.pgrid{grid-template-columns:1fr}}
.pcard{--ac:var(--pri);display:flex;flex-direction:column;background:var(--surface);border-radius:22px;border:1px solid var(--line);overflow:hidden;transition:transform .35s,box-shadow .35s}
.pcard:hover{transform:translateY(-8px);box-shadow:0 26px 50px -18px color-mix(in srgb,var(--ac) 45%,transparent)}
.pcard.is-hidden{display:none}
.pcard__media{position:relative;display:block;padding:14px 14px 0;background:linear-gradient(160deg,color-mix(in srgb,var(--ac) 22%,var(--surface)),color-mix(in srgb,var(--ac) 6%,var(--surface)))}
.pcard__bar{display:flex;align-items:center;gap:5px;height:26px;padding:0 12px;background:var(--surface);border-radius:12px 12px 0 0;border:1px solid var(--line);border-bottom:0}
.pcard__bar i{width:8px;height:8px;border-radius:50%;background:#ff5f57}.pcard__bar i:nth-child(2){background:#febc2e}.pcard__bar i:nth-child(3){background:#28c840}
.pcard__bar em{font-style:normal;font-size:11px;color:var(--muted);margin-inline-start:auto;background:var(--soft);padding:0 10px;border-radius:10px}
.pcard__shot{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--surface);border-inline:1px solid var(--line)}
.pcard__shot img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.pcard:hover .pcard__shot img{transform:scale(1.06)}
.pcard__ph{display:grid;place-items:center;height:100%;font-size:64px;color:var(--ac)}
.pcard__over{position:absolute;inset:40px 14px 0;display:grid;place-items:center;background:color-mix(in srgb,var(--ac) 55%,rgba(20,22,26,.55));opacity:0;transition:opacity .35s}
.pcard__over span{display:inline-flex;align-items:center;gap:8px;padding:10px 22px;border-radius:50px;background:#fff;color:#222;font-weight:800;transform:translateY(12px);transition:transform .35s}
.pcard:hover .pcard__over{opacity:1}.pcard:hover .pcard__over span{transform:none}
.pcard__star{position:absolute;top:22px;inset-inline-start:24px;z-index:2;background:#222;color:#fff;font-size:11px;font-weight:700;padding:2px 10px;border-radius:20px}
.pcard__body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.pcard__kind{font-size:13px;font-weight:700;color:var(--ac)}
.pcard__body h3{font-size:19px;margin:4px 0 6px}
.pcard__body p{font-size:14.5px;margin-bottom:12px;flex:1}
.ptags{display:flex;flex-wrap:wrap;gap:6px}
.ptags span{font-size:12px;padding:3px 10px;border-radius:8px;background:var(--soft);color:var(--ink2);border:1px solid var(--line)}

.pshow{--ac:var(--pri)}
.pshow__hero{position:relative;overflow:hidden;color:#d5d9de;padding:50px 0 170px;background:radial-gradient(900px 480px at 90% 0%,color-mix(in srgb,var(--ac) 55%,transparent),transparent 65%),linear-gradient(180deg,#1b1e22,#25292e)}
.pshow__hero::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(180deg,#000,transparent);pointer-events:none}
.pshow__hero .container{position:relative;z-index:1}
.pshow__head{display:grid;grid-template-columns:1.5fr 1fr;gap:40px;align-items:end}
.pshow__kind{display:inline-block;padding:4px 14px;border-radius:50px;background:color-mix(in srgb,var(--ac) 25%,transparent);border:1px solid color-mix(in srgb,var(--ac) 60%,transparent);color:#fff;font-size:13px;font-weight:700}
.pshow__head h1{color:#fff;font-size:clamp(30px,4.6vw,52px);margin:14px 0 10px}
.pshow__head p{font-size:18px;opacity:.85;max-width:640px}
.pshow__btns{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.pshow .btn{background:linear-gradient(135deg,color-mix(in srgb,var(--ac) 75%,#fff),var(--ac));box-shadow:0 10px 24px -6px color-mix(in srgb,var(--ac) 60%,transparent)}
.pshow .btn--ghost{background:rgba(255,255,255,.08);box-shadow:none}
.pshow__meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0}
.pshow__meta div{padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09)}
.pshow__meta dt{font-size:12px;opacity:.7}.pshow__meta dd{margin:0;color:#fff;font-weight:700}
@media(max-width:900px){.pshow__head{grid-template-columns:1fr}.pshow__hero{padding-bottom:120px}}
.pshow__stage{margin-top:-130px;position:relative;z-index:2}
@media(max-width:900px){.pshow__stage{margin-top:-90px}}
.devices{position:relative;display:grid;grid-template-columns:1fr;padding-inline-start:150px}
.devices--solo{padding-inline-start:0;justify-items:center}
.devices--solo .browser{width:100%}
.browser{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.06)}
.browser__bar{display:flex;align-items:center;gap:6px;height:40px;padding:0 16px;background:#f1f2f4;border-bottom:1px solid #e3e5e8}
.browser__bar i{width:11px;height:11px;border-radius:50%;background:#ff5f57}.browser__bar i:nth-child(2){background:#febc2e}.browser__bar i:nth-child(3){background:#28c840}
.browser__bar span{margin-inline:auto;font-size:12.5px;color:#666;background:#fff;border-radius:8px;padding:3px 40px;border:1px solid #e3e5e8}
.browser__screen,.phone__screen{position:relative;overflow:hidden;cursor:ns-resize}
.browser__screen{height:min(62vh,600px)}
.browser__screen img,.phone__screen img{width:100%;height:auto;display:block;transform:translateY(0);transition:transform var(--dur,6s) cubic-bezier(.45,.05,.55,.95)}
.browser__screen:hover img,.phone__screen:hover img,.is-scrolling img{transform:translateY(var(--shift,0))}
.browser__hint{display:block;text-align:center;font-size:12.5px;color:#888;padding:8px;background:#fafbfc;border-top:1px solid #eee}
.phone{position:absolute;inset-inline-start:0;bottom:-40px;width:250px;padding:12px;border-radius:40px;background:#16181b;box-shadow:0 40px 70px -20px rgba(0,0,0,.55),inset 0 0 0 2px #2c2f34}
.devices--solo .phone{position:relative;bottom:auto}
.phone__notch{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:90px;height:22px;border-radius:0 0 14px 14px;background:#16181b;z-index:2}
.phone__screen{border-radius:30px;height:470px;background:#fff}
@media(max-width:900px){.devices{padding-inline-start:0}.phone{position:relative;bottom:auto;margin:-60px auto 0 0;width:200px}.phone__screen{height:370px}.browser__screen{height:52vh}}
.pshow__h{margin-top:40px;font-size:24px}
.pfeat{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pfeat li{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;border-radius:14px;background:var(--soft);border:1px solid var(--line);transition:.25s}
.pfeat li:hover{border-color:var(--ac);background:var(--surface);box-shadow:var(--sh)}
.pfeat .ic{flex:none;color:#fff;background:var(--ac);border-radius:50%;padding:3px;width:24px;height:24px}
@media(max-width:700px){.pfeat{grid-template-columns:1fr}}
.pinfo dl{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;margin:0 0 18px}
.pinfo dt{color:var(--muted);font-size:14px}.pinfo dd{margin:0;font-weight:700;color:var(--ink)}
.pinfo .ptags{margin-bottom:18px}
.pgal{columns:3 280px;column-gap:18px}
.pgal a{display:block;margin-bottom:18px;border-radius:16px;overflow:hidden;break-inside:avoid;box-shadow:var(--sh)}
.pgal img{width:100%;transition:transform .6s}
.pgal a:hover img{transform:scale(1.04)}
.pnav{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;background:var(--dark)}
.pnav__item{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:44px 40px;color:#fff;min-height:170px;isolation:isolate}
.pnav__item::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--pimg,none) center/cover;opacity:.25;transition:transform .8s,opacity .4s}
.pnav__item::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(20,22,26,.9),rgba(20,22,26,.4))}
.pnav__item:hover{color:#fff}.pnav__item:hover::before{transform:scale(1.08);opacity:.45}
.pnav__item small{color:var(--pri2);font-weight:700}
.pnav__item b{font-size:clamp(17px,2.2vw,24px)}
.pnav__item--next{text-align:end;align-items:flex-end}
.pnav__all{display:grid;grid-template-columns:repeat(2,10px);gap:6px;place-content:center;padding:0 34px;background:#16181b}
.pnav__all i{width:10px;height:10px;border-radius:3px;background:#555;transition:.3s}
.pnav__all:hover i{background:var(--pri)}
@media(max-width:700px){.pnav{grid-template-columns:1fr}.pnav__all{padding:18px;grid-auto-flow:column}.pnav__item--next{text-align:start;align-items:flex-start}}

/* Reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s,transform .7s}
.reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}*{animation:none!important;scroll-behavior:auto!important}}
@media print{.topbar,.header,.footer,.callfab,.wafab,.totop,.side{display:none!important}}
html[data-theme=dark] .svc--feat{box-shadow:0 0 0 1px rgba(249,145,49,.25)}