/* هم‌زبان با لندینگ: CSS اختصاصی، نه utilityهای Tailwind (بیلد purge‌شده
           کلاس‌های تازه را ندارد). رنگ برند از /brand.css می‌آید. */
        :root{
            --bg:#020812; --bg-soft:#061426; --card:#091c38;
            --line:rgba(255,255,255,.075); --line-strong:rgba(255,255,255,.14);
            --fg:#e7e9ee; --fg-dim:#8b93a5; --fg-faint:#5b6376;
            --radius:14px; --maxw:1140px;
        }
        *{ box-sizing:border-box; }
        body{ margin:0; background:var(--bg); color:var(--fg);
              font-family:Vazirmatn,system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
        a{ color:inherit; text-decoration:none; }
        .wrap{ max-width:var(--maxw); margin:0 auto; padding:0 20px; }
        .en{ font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Arial; letter-spacing:.2em; text-transform:uppercase; }
        .num{ font-variant-numeric:tabular-nums; }

        .hdr{ position:sticky; top:0; z-index:50; background:rgba(2,8,18,.82);
              backdrop-filter:blur(12px); border-bottom:1px solid var(--line); }
        .hdr-in{ height:66px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
        .logo{ display:flex; align-items:center; gap:11px; min-width:0; }
        .logo img{ height:38px; width:38px; border-radius:10px; object-fit:contain;
                   background:rgba(255,255,255,.05); padding:4px; }
        .logo b{ display:block; color:#fff; font-size:15px; line-height:1.2; }
        .logo span{ font-size:8.5px; color:var(--fg-faint); }
        .back{ font-size:13px; color:var(--fg-dim); white-space:nowrap; }
        .back:hover{ color:#fff; }

        .top{ padding:52px 0 26px; border-bottom:1px solid var(--line); }
        .top h1{ margin:0 0 12px; color:#fff; font-weight:800;
                 font-size:clamp(26px,4.4vw,42px); line-height:1.25; }
        .top p{ margin:0; color:var(--fg-dim); font-size:15px; line-height:1.9; max-width:56ch; }
        .count{ display:inline-block; margin-top:16px; font-size:12.5px; color:var(--fg-faint);
                border:1px solid var(--line-strong); border-radius:999px; padding:5px 13px; }

        /* فیلتر شهر — چیپ‌های افقی، روی موبایل اسکرول می‌شوند */
        .cities{ position:sticky; top:66px; z-index:40; background:rgba(2,8,18,.9);
                 backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
        .cities-in{ display:flex; gap:8px; overflow-x:auto; padding:12px 20px;
                    max-width:var(--maxw); margin:0 auto;
                    scrollbar-width:none; -ms-overflow-style:none; }
        .cities-in::-webkit-scrollbar{ display:none; }
        .chip{ flex:none; font-size:13px; font-weight:600; padding:7px 15px; border-radius:999px;
               border:1px solid var(--line-strong); color:var(--fg-dim); background:transparent;
               cursor:pointer; white-space:nowrap; font-family:inherit; }
        .chip[aria-pressed="true"]{ color:#fff; border-color:transparent; }

        .list{ padding:34px 0 70px; }
        .city-block + .city-block{ margin-top:38px; }
        .city-name{ display:flex; align-items:baseline; gap:10px; margin:0 0 16px; }
        .city-name h2{ margin:0; font-size:19px; font-weight:800; color:#fff; }
        .city-name span{ font-size:12px; color:var(--fg-faint); }

        .cards{ display:grid; gap:14px;
                grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr)); }
        .card{ background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
               padding:18px; display:flex; flex-direction:column; gap:12px; }
        .card h3{ margin:0; font-size:16px; font-weight:700; color:#fff; line-height:1.5; }
        .addr{ margin:0; font-size:13.5px; color:var(--fg-dim); line-height:1.85; }
        .acts{ display:flex; flex-wrap:wrap; gap:8px; margin-top:auto; padding-top:4px; }
        .act{ display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700;
              padding:8px 13px; border-radius:10px; border:1px solid var(--line-strong);
              color:var(--fg); }
        .act svg{ width:14px; height:14px; flex:none; }
        .act.wa{ border-color:transparent; background:#1f8a4c; color:#fff; }
        .act .num{ direction:ltr; }

        .empty{ text-align:center; padding:70px 0; color:var(--fg-dim); font-size:15px; }
        .empty a{ color:#fff; border-bottom:1px solid var(--line-strong); }

        footer{ border-top:1px solid var(--line); padding:26px 0; }
        footer .wrap{ display:flex; flex-wrap:wrap; gap:12px; align-items:center;
                      justify-content:space-between; font-size:12.5px; color:var(--fg-faint); }