/* تپ امداد — پوستهٔ روشن هم‌سبک با اپلیکیشن (روی site.css اعمال می‌شود). رنگ‌ها، گردی‌ها و سایه‌ها از Design.kt اپ گرفته شده‌اند. */
@font-face{font-family:"SFArabic";src:url(/fonts/SFArabic.woff2) format("woff2");font-weight:100 900;font-display:swap}
:root{--p:#FF3B5C;--s:#7C3AED;--t:#EC4899;--bg:#F8FAFC;--ink:#0F172A;--mute:#64748B;--faint:#94A3B8;--line:#E2E8F0;--field:#F1F5F9;--rose:#FF3B5C;--rose-soft:#FFF1F3;--card:#fff;
 --sh:0 1px 2px rgba(15,23,42,.05),0 10px 28px -14px rgba(15,23,42,.18);--shc:0 14px 30px -12px color-mix(in srgb,var(--c,#FF3B5C) 45%,transparent);color-scheme:light}
body{background:var(--bg);color:var(--ink)}
h1,h2,h3,.brand b,.btn,#nav a,summary,.key b,.key .num,.chip,.steps li::before,.pt b,.mc h3,.post h3,.promo b,.promo em,.pager a{font-family:"SFArabic","Vazirmatn",Tahoma,sans-serif;font-weight:700;letter-spacing:0}
::selection{background:var(--p);color:#fff}
.skip{background:var(--p)}
:focus-visible{outline-color:var(--p)}
/* backdrop: حباب‌های نرم رنگی مثل AppBackdrop اپ */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(520px 420px at 92% -6%,color-mix(in srgb,var(--p) 16%,transparent),transparent 70%),radial-gradient(520px 460px at -8% 38%,color-mix(in srgb,var(--s) 12%,transparent),transparent 70%),radial-gradient(460px 380px at 70% 105%,color-mix(in srgb,var(--t) 11%,transparent),transparent 70%)}
/* header */
.top{background:rgba(255,255,255,.82);border-bottom:1px solid var(--line);box-shadow:0 8px 24px -20px rgba(15,23,42,.35)}
.brand img{border-radius:50%;background:#fff;box-shadow:0 0 0 2px #fff,0 6px 16px -6px color-mix(in srgb,var(--p) 60%,transparent)}
#nav a{color:var(--mute)}#nav a:hover,#nav a[aria-current]{color:var(--p);background:color-mix(in srgb,var(--p) 9%,#fff)}
.burger{background:#fff;border-color:var(--line)}.burger i{background:var(--ink)}
/* buttons: AppButton (گرادیان رنگ به ۸۰٪ تیره، سایهٔ رنگی، گردی ۱۸) */
.btn{border-radius:18px;background:#fff;border:1.5px solid var(--line);color:var(--ink)}
.btn .ic{width:20px;height:20px;fill:currentColor}
.btn.ghost:hover{background:var(--field)}
.btn.pri,.btn.neon{position:relative;overflow:hidden;color:#fff;border:0;background:linear-gradient(135deg,var(--p),color-mix(in srgb,var(--p) 80%,#000));box-shadow:0 12px 24px -10px color-mix(in srgb,var(--p) 70%,transparent)}
.btn.pri:active,.btn.neon:active{box-shadow:0 4px 10px -4px color-mix(in srgb,var(--p) 70%,transparent)}
.btn.neon::after,.btn.pri::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%);transform:translateX(-120%);animation:sheen 3.6s ease-in-out infinite}
@keyframes sheen{60%,100%{transform:translateX(120%)}}
.btn.glass{background:#fff;border:1.5px solid color-mix(in srgb,var(--p) 55%,#fff);color:var(--p)}
.btn.glass:hover{background:color-mix(in srgb,var(--p) 7%,#fff)}
.btn.dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn.lg{padding:15px 28px;font-size:17px;border-radius:18px}
.hcta{display:flex;flex-wrap:wrap;gap:14px;margin-top:28px}.cta .hcta{justify-content:center;margin-bottom:10px}
/* hero */
.hero{background:linear-gradient(170deg,#fff 0%,color-mix(in srgb,var(--p) 6%,#fff) 50%,color-mix(in srgb,var(--s) 7%,#fff) 100%)}
.htext h1{color:var(--ink)}.htext h1 em{font-style:normal;background:linear-gradient(100deg,var(--p),var(--s));-webkit-background-clip:text;background-clip:text;color:transparent}
.htext p{color:#334155}
.hbadge{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);font-size:13.5px;font-weight:700;color:var(--ink);margin-bottom:18px}
.pdot{position:relative;width:9px;height:9px;border-radius:50%;background:var(--p);flex:none}.pdot::before{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:pd 1.3s linear infinite}
@keyframes pd{to{transform:scale(2.6);opacity:0}}
/* گوشی: صفحهٔ اصلی واقعی اپ با همان تصاویر */
.phone{background:#fff;border-color:#0F172A;box-shadow:0 0 0 1px #334155,0 40px 70px -30px rgba(15,23,42,.45),0 0 60px -10px color-mix(in srgb,var(--p) 35%,transparent)}
.phone::before{background:#1e293b}.phone::after{background:#0b1220}
.pbody{background:var(--bg);padding:0;gap:8px}
.phh{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--p),var(--s));color:#fff;border-radius:0 0 26px 26px;padding:14px 12px 12px}
.phh::before{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:rgba(255,255,255,.12);top:-50px;left:-30px}
.phh .r{display:flex;justify-content:space-between;align-items:center;position:relative}.phh .r .ic{width:18px;height:18px;fill:#fff}
.phh .lg{width:30px;height:30px;border-radius:50%;background:#fff;display:grid;place-items:center}.phh .lg img{width:26px;height:26px}
.phh small{display:block;opacity:.85;font-size:9.5px;margin-top:8px;position:relative}.phh b{display:block;font-size:15px;position:relative;font-family:"SFArabic",sans-serif}
.phh .pl{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:8.5px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);border-radius:99px;padding:4px 8px;position:relative}.phh .pl .pdot{width:6px;height:6px;background:#fff}
.pin{padding:2px 10px 10px;display:flex;flex-direction:column;gap:7px}
.pst{font-size:10.5px;font-weight:800;color:var(--ink);font-family:"SFArabic",sans-serif}
.phero{display:flex;align-items:center;justify-content:space-between;gap:6px;border-radius:18px;padding:10px 12px;color:#fff;background:linear-gradient(135deg,#DC2626,color-mix(in srgb,#DC2626 70%,#000));box-shadow:0 8px 18px -8px #DC2626}
.phero span{font-size:8px;background:rgba(255,255,255,.2);border-radius:99px;padding:1px 6px}.phero b{display:block;font-size:12px;margin-top:2px;font-family:"SFArabic",sans-serif}
.phero .w{width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 0 0 5px rgba(255,255,255,.2)}.phero .w img{width:28px;height:28px}
.ptiles{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.pt{background:#fff;color:var(--ink);border-radius:16px;padding:8px;display:flex;flex-direction:column;gap:3px;min-height:0;box-shadow:var(--sh);border:1px solid var(--line)}
.pt:last-child{grid-column:auto;min-height:0}
.pt .bd{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 13%,#fff)}.pt .bd img{width:22px;height:22px}.pt .bd .ic{width:18px;height:18px;fill:var(--c)}
.pt b{font-size:9.5px;line-height:1.5}.pt small{font-size:8.5px;color:var(--c);font-weight:800}
.pchat{display:none}
/* sections */
.sec.alt{background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.4));border-block:1px solid var(--line)}
h2{color:var(--ink)}
.sh2{display:flex;align-items:center;gap:10px}.sh2::before{content:"";width:6px;height:28px;border-radius:4px;background:linear-gradient(180deg,var(--p),var(--s))}
/* ارگان‌ها: OrgGridCard اپ */
.keys{grid-template-columns:repeat(5,1fr);gap:16px}
.key{background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:24px;padding:18px 16px 16px;min-height:0;gap:10px;box-shadow:var(--sh)}
.key:hover{transform:translateY(-4px);box-shadow:var(--shc)}
.key:active,.key:focus-visible{transform:translateY(2px);box-shadow:var(--sh)}
.key .top2{display:flex;justify-content:space-between;align-items:flex-start;width:100%}
.key .bd{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 13%,#fff);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 22%,#fff)}
.key .bd img{width:44px;height:44px;object-fit:contain}.key .bd .ic{width:36px;height:36px;fill:var(--c);margin:0}
.key b{font-size:16px;line-height:1.6}
.key .top2,.key .bd{font-size:inherit;opacity:1;font-weight:inherit}
.key .num{font-size:13px;font-weight:800;opacity:1;color:var(--c);background:color-mix(in srgb,var(--c) 12%,#fff);border-radius:99px;padding:2px 10px}
/* bento ویژگی‌ها */
.bx{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--sh)}
.bx .ic{width:56px;height:56px;padding:13px;border-radius:18px;background:color-mix(in srgb,var(--c) 13%,#fff);fill:var(--c);color:var(--c);box-shadow:none}
.b0{--c:#FF3B5C}.b1{--c:#2563EB}.b2{--c:#7C3AED}.b3{--c:#F97316}.b4{--c:#0D9488}.b5{--c:#16A34A}
.bx::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--c),transparent)}
.steps li{border-top:3px solid transparent;border-image:linear-gradient(90deg,var(--p),var(--s)) 1}
.steps li::before{color:var(--p)}
.promo{background:#fff;border:1.5px solid color-mix(in srgb,var(--c) 30%,#fff);box-shadow:var(--sh)}
details{background:#fff;border-color:var(--line);box-shadow:var(--sh)}details[open]{box-shadow:0 0 0 1.5px color-mix(in srgb,var(--p) 45%,#fff),var(--sh)}details[open] summary{color:var(--p)}
.cta{background:linear-gradient(135deg,var(--p),var(--s));color:#fff;position:relative;overflow:hidden}
.cta::before,.cta::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.1);pointer-events:none}.cta::before{width:340px;height:340px;top:-160px;left:-80px}.cta::after{width:240px;height:240px;bottom:-120px;right:6%}
.cta h2{color:#fff}.cta .btn.neon{background:#fff;color:var(--p);box-shadow:0 14px 30px -12px rgba(0,0,0,.35)}.cta .btn.glass{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}.cta .btn.ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.cta .dls .btn.pri{background:#fff;color:var(--p)}
.post a{background:#fff;border-color:var(--line);box-shadow:var(--sh);border-radius:24px}.post a:hover{box-shadow:0 22px 34px -18px color-mix(in srgb,var(--p) 40%,transparent)}
.post img,.noimg{background:linear-gradient(135deg,color-mix(in srgb,var(--p) 10%,#fff),color-mix(in srgb,var(--s) 10%,#fff))}.noimg .ic{fill:var(--p);width:40px;height:40px}
.pager a[aria-current]{background:var(--p);border-color:var(--p)}
.form input,.form textarea{background:#fff;border-color:var(--line);border-radius:16px}
.form input:focus,.form textarea:focus{border-color:var(--p);outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 18%,transparent)}
.foot{background:#fff;border-top:1px solid var(--line)}
.ic{fill:currentColor}
/* 3D tilt ملایم */
.tilt{transform-style:preserve-3d;will-change:transform;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .2s}
.tilt.tilting{transition:transform .06s linear,box-shadow .2s}
.tilt::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--p) 10%,transparent),transparent 60%);opacity:0;transition:opacity .25s}
.tilt.tilting::after{opacity:1}
.key,.bx,.post a,.promo,.mcard a{position:relative}
/* scroll reveal */
.js [data-reveal]{opacity:0;transform:translate3d(0,40px,0) rotateX(10deg) scale(.98);transform-origin:50% 100%;transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i,0) * 90ms)}
.js [data-reveal="left"]{transform:translate3d(-60px,0,0) rotateY(-12deg)}
.js [data-reveal="zoom"]{transform:scale(.88) translateZ(-60px)}
.js [data-reveal].in{opacity:1;transform:none}
.sec{perspective:1200px}
/* نوار مقالات و اخبار */
.feed{overflow:hidden}
.shead{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;flex-wrap:wrap}.shead .lead{margin-bottom:18px}
.slinks{display:flex;gap:10px;margin-bottom:22px}
.marquee{position:relative;overflow:hidden;padding:14px 0 22px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);touch-action:pan-y;cursor:grab;user-select:none}
.marquee.dragging{cursor:grabbing}.marquee+.marquee{margin-top:6px}
.mtrack{display:flex;gap:18px;width:max-content;will-change:transform;padding-inline:18px}
.mcard{flex:0 0 300px;perspective:800px}
.mcard a{display:flex;flex-direction:column;height:100%;border-radius:24px;overflow:hidden;background:#fff;border:1px solid var(--line);box-shadow:var(--sh);-webkit-user-drag:none}
.mcard a:hover,.mcard a:focus-visible{border-color:color-mix(in srgb,var(--p) 45%,#fff);box-shadow:0 18px 32px -16px color-mix(in srgb,var(--p) 45%,transparent)}
.mcard img,.mcard .noimg{width:100%;aspect-ratio:16/9;object-fit:cover;pointer-events:none}
.mcard .noimg{display:grid;place-items:center}.mcard .noimg .ic{width:40px;height:40px;fill:var(--p)}
.mc{padding:14px 16px 18px}.mc time{font-size:12.5px;color:var(--mute);margin-inline-start:8px}
.mc h3{font-size:16px;line-height:1.75;margin:6px 0 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mc p{font-size:14px;color:var(--mute);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.chip{display:inline-block;font-size:12px;padding:2px 10px;border-radius:99px;background:color-mix(in srgb,var(--p) 12%,#fff);color:var(--p)}
.marquee[data-dir="-1"] .chip{background:color-mix(in srgb,var(--s) 12%,#fff);color:var(--s)}
.marquee.static{overflow-x:auto;-webkit-mask-image:none;mask-image:none;cursor:auto;touch-action:auto;user-select:auto;scrollbar-width:thin}
.marquee.static.fit .mtrack{margin-inline:auto}
@media(max-width:1000px){.keys{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){#nav{background:rgba(255,255,255,.98);backdrop-filter:blur(14px);box-shadow:0 20px 30px -20px rgba(15,23,42,.3)}.acts .neon span{font-size:14px}.acts .neon{padding:9px 14px}.mcard{flex-basis:260px}.hcta{justify-content:center}.slinks{margin-bottom:6px}}
@media(max-width:600px){.keys{grid-template-columns:repeat(2,1fr)}}
@media(max-width:420px){.acts .neon .ic{display:none}}
@media(prefers-reduced-motion:reduce){.js [data-reveal]{opacity:1!important;transform:none!important}.btn.neon::after,.btn.pri::after,.pdot::before{animation:none}}
.phero small{display:block;font-size:8px;opacity:.9}
