@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800&display=swap');
:root{--teal:#08b8b0;--teal2:#0b8f91;--ink:#102a35;--muted:#70818a;--line:#e7f0f1;--bg:#f7fbfb}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Vazirmatn,Arial,sans-serif}
.topbar{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:34px;padding:0 4%;position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);min-width:245px}.brand b{font-size:19px}.brand small{display:block;color:#7d8b91;font-size:10px;direction:ltr}.cube{width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,#d9ffff,#08b8b0);display:grid;place-items:center;color:#087f82;font-size:27px}nav{display:flex;gap:22px;flex:1}nav a{color:#52666f;text-decoration:none;font-size:14px;padding:27px 4px}nav a.active{color:var(--teal2);border-bottom:2px solid var(--teal)}.actions{display:flex;gap:10px}.actions input,.modal-card input,.modal-card select,.modal-card textarea{border:1px solid var(--line);background:#fbfefe;border-radius:14px;padding:12px 15px;font:inherit;outline:none}.actions input{width:190px}.actions input:focus,.modal-card input:focus,.modal-card textarea:focus{border-color:#7adeda}button,.primary{font:inherit;border:0;cursor:pointer}.actions button,.secondary{background:#e8fbfa;color:#078f8e;border-radius:13px;padding:11px 16px;font-weight:700}.hero{margin:28px auto 18px;width:92%;max-width:1450px;min-height:330px;border-radius:28px;overflow:hidden;background:linear-gradient(115deg,#fff 0%,#f4ffff 55%,#d9fbfa 100%);display:flex;position:relative;border:1px solid #e1f0f0;box-shadow:0 18px 60px #0b777d12}.hero-copy{padding:55px 6%;position:relative;z-index:2;max-width:780px}.pill{display:inline-block;padding:7px 13px;border-radius:999px;background:#ddfaf8;color:#078d8b;font-size:12px;font-weight:700}.hero h1{font-size:54px;margin:17px 0 7px;letter-spacing:-2px}.hero h1 em{font-style:normal;color:var(--teal)}.hero p{color:#62757d;font-size:17px}.primary{display:inline-block;background:linear-gradient(135deg,#0bbeb6,#078f91);color:white;padding:13px 23px;border-radius:14px;text-decoration:none;font-weight:800;box-shadow:0 10px 25px #08aaa633}.hero-art{position:absolute;inset:0 0 0 52%;overflow:hidden}.hero-art:before{content:"";position:absolute;width:560px;height:560px;border-radius:50%;right:-90px;top:-120px;background:radial-gradient(circle,#8ce9e4 0,#bff8f5 35%,transparent 68%)}.pixel{position:absolute;right:13%;top:19%;font-size:150px;color:#0ab8b1;opacity:.45;transform:rotate(-8deg)}.glow{position:absolute;right:25%;bottom:-140px;width:480px;height:250px;background:#1cc9c1;filter:blur(90px);opacity:.2}.categories{width:92%;max-width:1450px;margin:20px auto;display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.cat{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;color:#516871;font-weight:700;box-shadow:0 8px 25px #17444b08}.cat.active{background:linear-gradient(135deg,#0bbab4,#099797);color:#fff}.content{width:92%;max-width:1450px;margin:35px auto}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:17px}.section-head span{color:var(--teal2);font-size:12px;font-weight:800}.section-head h2{margin:3px 0;font-size:25px}.section-head small{color:#8a999e}.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:9px;box-shadow:0 12px 35px #17444b09;transition:.2s}.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px #17444b14}.thumb{height:155px;border-radius:14px;background:linear-gradient(135deg,#d8f8f7,#c2e9f5 50%,#8ed7d5);display:grid;place-items:center;color:#078f91;font-size:55px;position:relative}.tag{position:absolute;top:9px;right:9px;background:#fff;border-radius:999px;padding:5px 9px;font-size:10px;color:#078f91;font-weight:800}.card-body{padding:11px}.card h3{margin:0 0 5px;font-size:16px}.card p{margin:0;color:#778990;font-size:12px;min-height:38px}.meta{display:flex;justify-content:space-between;color:#8b999e;font-size:10px;margin:10px 0}.download{display:block;text-align:center;background:#e7fbfa;color:#078f91;padding:10px;border-radius:12px;text-decoration:none;font-weight:800;font-size:12px}.comment-box{width:92%;max-width:1450px;margin:40px auto;padding:25px 30px;border-radius:22px;background:#073f49;color:#fff;display:flex;justify-content:space-between;align-items:center}.comment-box p{color:#b7d5d7;font-size:12px}.comment-box .secondary{background:#fff}.modal{position:fixed;inset:0;background:#062c3299;backdrop-filter:blur(8px);display:grid;place-items:center;z-index:30;padding:20px}.hidden{display:none!important}.modal-card{background:#fff;width:min(560px,100%);border-radius:25px;padding:28px;position:relative;box-shadow:0 30px 100px #0004}.modal-card.small{width:min(470px,100%)}.close{position:absolute;left:18px;top:15px;background:#eef7f7;border-radius:50%;width:32px;height:32px;font-size:20px;color:#567}.modal-card h2{margin-top:5px}.modal-card input,.modal-card select,.modal-card textarea{width:100%;margin:7px 0}.modal-card textarea{min-height:100px;resize:vertical}.full{width:100%;text-align:center;margin-top:8px}.error{color:#c83f48;font-size:12px;margin-top:8px}.panel-head{display:flex;justify-content:space-between;align-items:center}.admin-item{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:10px 0;font-size:13px}.danger{border:0;background:#fff0f0;color:#c43b43;border-radius:10px;padding:8px 12px}footer{text-align:center;color:#8b9a9f;padding:30px;font-size:11px}@media(max-width:950px){nav{display:none}.topbar{justify-content:space-between}.actions input{width:150px}.hero-art{opacity:.35}.grid{grid-template-columns:repeat(2,1fr)}.categories{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.topbar{padding:0 4%;height:68px}.brand{min-width:0}.brand b{font-size:15px}.actions input{display:none}.hero{min-height:360px}.hero-copy{padding:45px 7%}.hero h1{font-size:38px}.categories{grid-template-columns:repeat(2,1fr)}.grid{grid-template-columns:1fr}.comment-box{display:block}.comment-box button{margin-top:10px}.hero-art{inset:0 0 0 15%;opacity:.22}}