/*
Theme Name: Soroush Electric
Theme URI: https://soroushelectric.ir
Author: Soroush Electric
Description: قالب فارسی راست‌به‌چپ سروش الکتریک: ماشین‌حساب‌های برق، آموزش و اخبار
Version: 1.0.2
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: soroush-electric
*/
@font-face{font-family:Vazirmatn;src:url(assets/fonts/Vazirmatn-Regular.woff) format('woff');font-weight:400;font-style:normal;font-display:swap}
:root{--bg:#fff;--surface:#fff;--field:#F6F6F3;--ink:#14161A;--muted:#5C6570;--line:#E4E4DF;--brand:#FFCF1F;--on-brand:#15130A;color-scheme:light}
:root[data-theme=dark]{--bg:#0F1216;--surface:#181D23;--field:#11151A;--ink:#ECEFF2;--muted:#98A3AE;--line:#2B333C;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.8 Vazirmatn,Tahoma,"Segoe UI",sans-serif;transition:background .25s,color .25s}
a{color:inherit}
.wrap{max-width:72rem;margin-inline:auto;padding-inline:max(16px,env(safe-area-inset-right,0px))}
.top{border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:5;padding-top:env(safe-area-inset-top,0px)}
.top .wrap{display:flex;align-items:center;gap:14px;min-height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;white-space:nowrap}
.mark{width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:#fff url(assets/logo.png) center/82% no-repeat;flex:none}
nav{display:flex;gap:4px;overflow-x:auto;flex:1;scrollbar-width:none}
nav a{padding:6px 12px;border-radius:8px;text-decoration:none;white-space:nowrap;color:var(--muted);font-weight:500}
nav a:hover{color:var(--ink)}
nav a[aria-current]{color:var(--ink);box-shadow:inset 0 -3px 0 var(--brand)}
.tbtn{border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:10px;width:40px;height:40px;cursor:pointer;font-size:18px;flex:none}
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.tag{display:inline-block;background:var(--brand);color:var(--on-brand);padding:2px 16px;transform:rotate(-3deg);box-shadow:0 8px 16px rgba(0,0,0,.18);font-weight:800;margin:0;line-height:1.6}
h1.tag{font-size:clamp(1.6rem,5vw,2.4rem)}
h2.tag{font-size:1.2rem}
.hero{display:grid;gap:18px;padding:36px 0 20px;align-items:center}
.hero-t{display:grid;gap:18px;justify-items:start}
.hero-t p{max-width:42ch;color:var(--muted);font-size:1.05rem;margin:0}
.stage{position:relative;width:100%;aspect-ratio:3/2;perspective:1000px}
.flow{position:absolute;inset:34% 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.flow svg{position:absolute;top:0;left:0;width:200%;height:100%;animation:flow 7s linear infinite}
.flow polyline{fill:none;stroke-width:3;vector-effect:non-scaling-stroke}
.flow .a{stroke:var(--brand)}.flow .b{stroke:var(--muted);opacity:.7}.flow .c{stroke:var(--ink);opacity:.8}
@keyframes flow{to{transform:translateX(-25%)}}
.sway,.scene{position:absolute;inset:0;transform-style:preserve-3d}
.sway{animation:sway 10s ease-in-out infinite alternate}
@keyframes sway{from{transform:rotateY(-5deg)}to{transform:rotateY(5deg)}}
.scene{transition:transform .15s ease-out}
.tp{position:absolute;transform:translateZ(var(--z));transform-style:preserve-3d}
.tf{transform-style:preserve-3d;cursor:pointer}
.tf.go{animation:flip .9s ease-in-out}
@keyframes flip{to{transform:rotateY(360deg)}}
.tf img{display:block;width:100%;height:auto;animation:spin var(--t) ease-in-out var(--dl) infinite alternate}
@keyframes spin{from{transform:rotateY(calc(var(--ay)*-1)) rotateX(var(--ax))}to{transform:rotateY(var(--ay)) rotateX(calc(var(--ax)*-1))}}
@media(max-width:819px),(hover:none){.stage{perspective:none}.sway,.scene,.tp,.tf{transform-style:flat}.sway{animation:none}.tp{transform:none}.tf img{animation-name:bob}}
@keyframes bob{from{transform:translateY(-5px) rotate(-2deg)}to{transform:translateY(5px) rotate(2deg)}}
@media(min-width:820px){.hero{grid-template-columns:1fr 1.4fr}}
.btn{display:inline-block;background:var(--brand);color:var(--on-brand);font-weight:800;padding:10px 22px;border-radius:10px;text-decoration:none;transition:box-shadow .18s}
.btn:hover{box-shadow:0 4px 0 var(--ink)}
.blk{padding:26px 0}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(10.5rem,1fr));gap:12px;margin-top:20px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:14px;margin-top:20px}
.tile,.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;text-decoration:none;display:block;transition:border-color .18s,box-shadow .18s}
.tile:hover,.card:hover{border-color:var(--brand);box-shadow:inset 0 -4px 0 var(--brand)}
.ico{width:46px;height:46px;border-radius:8px;background:var(--brand);color:var(--on-brand);display:grid;place-items:center;font-weight:800;direction:ltr}
.tile b,.card b{display:block;font-weight:800;margin-top:10px;line-height:1.6}
.tile small,.card small{color:var(--muted);display:block;font-size:.82rem;line-height:1.6}
.ph{color:var(--muted);font-size:.82rem}
.tile .ico.im{background:none;width:auto;height:96px;border-radius:0;display:grid;place-items:center;perspective:520px}
.tile .ico.im img{height:96px;width:auto;max-width:100%;object-fit:contain;animation:tilt var(--t) ease-in-out var(--dl) infinite alternate}
@keyframes tilt{from{transform:rotateY(calc(var(--ay)*-1)) rotateX(4deg)}to{transform:rotateY(var(--ay)) rotateX(-4deg)}}
@keyframes turn{to{transform:rotateY(360deg)}}
@media(hover:hover){.tile:hover .ico.im img{animation:turn 1.1s ease-in-out}}
article{max-width:44rem;padding:30px 0}
article p{max-width:68ch}
article h2{margin:28px 0 6px;font-size:1.15rem}
.foot{border-top:1px solid var(--line);margin-top:40px;padding:22px 0;color:var(--muted);font-size:.88rem}
.foot .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.admin-bar .top{top:32px}@media(max-width:782px){.admin-bar .top{top:46px}}
.entry{max-width:44rem;padding:30px 0}.entry p,.entry li{max-width:68ch}.entry h2,.entry h3{margin:26px 0 6px}
.entry img{max-width:100%;height:auto;border-radius:10px}.entry a{text-decoration:underline}
.nav-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}.nav-links .page-numbers{padding:6px 14px;border:1px solid var(--line);border-radius:8px;text-decoration:none}.nav-links .current{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.screen-reader-text{position:absolute;left:-9999px}
.entry .formula{direction:ltr;text-align:left;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.92rem;background:var(--field);border:1px solid var(--line);border-radius:8px;padding:10px 14px;overflow-x:auto;max-width:none}
.entry ul,.entry ol{padding-inline-start:1.4rem}
.foot .wrap{align-items:center}
.igpill{display:inline-flex;align-items:center;gap:10px;padding:6px 16px 6px 8px;border-radius:999px;background:var(--surface);border:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:700;font-size:.95rem;transition:border-color .18s,transform .18s}
.igpill:hover{border-color:var(--brand);transform:translateY(-2px)}
.igpill img{width:32px;height:32px;object-fit:contain;flex:none}
.calc{margin:8px 0 22px}.calc iframe{display:block;width:100%;height:520px;border:0;background:transparent}
.flinks{display:flex;flex-wrap:wrap;gap:6px 18px;width:100%;font-size:.82rem}.flinks a{color:inherit}
.socials{display:flex;flex-wrap:wrap;gap:10px}
