/* Paker magazine */
:root{--bg:#f6f4f0;--surface:#fff;--ink:#141414;--muted:#6d6a65;--line:rgba(0,0,0,.08);--green:#123228;--gold:#c9a55c;--accent:#a8612e}
:root[data-theme="dark"]{--bg:#121110;--surface:#1c1a18;--ink:#f1ece4;--muted:#a59e93;--line:rgba(255,255,255,.1)}
*{box-sizing:border-box}html{overflow-x:clip;scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:"Vazirmatn",Tahoma,sans-serif;line-height:2.05;transition:background .3s,color .3s}
a{color:var(--accent)}img{max-width:100%}.w{max-width:1120px;margin:0 auto;padding:0 16px}.nw{max-width:760px}
header{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
header .w{display:flex;align-items:center;justify-content:space-between;gap:10px;height:62px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;font-weight:900;font-size:18px}.brand img{width:38px;height:38px;border-radius:10px}
.hnav{display:flex;gap:2px}.hnav a{text-decoration:none;color:var(--muted);font-weight:700;font-size:14px;padding:6px 12px;border-radius:99px}.hnav a.on{color:var(--accent);background:color-mix(in srgb,var(--accent) 12%,transparent)}
.tb{width:40px;height:40px;border-radius:50%;border:0;cursor:pointer;background:linear-gradient(135deg,#1d2b4a,#3b4f86);color:#ffd76a;display:grid;place-items:center}:root[data-theme="dark"] .tb{background:linear-gradient(135deg,#f7c948,#f08a24);color:#fff}
/* magazine home */
.mhero{margin-top:18px;border-radius:30px;overflow:hidden;position:relative;display:block;color:#fff;text-decoration:none;aspect-ratio:21/9;min-height:300px;background:#222}
.mhero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}.mhero:hover img{transform:scale(1.04)}
.mhero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,8,6,.85),rgba(10,8,6,.15) 60%,transparent)}
.mhero .in{position:absolute;inset:auto 0 0;padding:clamp(18px,4vw,40px);z-index:1;max-width:760px}
.mhero h2{font-family:"Noto Kufi Arabic","Vazirmatn",sans-serif;font-size:clamp(22px,3.6vw,38px);line-height:1.45;margin:6px 0}.mhero p{margin:0;opacity:.85;font-size:15px}
.pill{display:inline-block;font-size:12px;font-weight:800;padding:3px 12px;border-radius:99px;background:var(--gold);color:#1b140c}
.mtitle{display:flex;align-items:end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:34px 0 14px}.mtitle h1{font-family:"Noto Kufi Arabic","Vazirmatn",sans-serif;font-size:clamp(26px,3.4vw,36px);margin:0;line-height:1.3}.mtitle p{margin:4px 0 0;color:var(--muted)}
.cats{display:flex;gap:6px;flex-wrap:wrap}.cats button{border:1px solid var(--line);background:var(--surface);color:inherit;font:700 13px inherit;padding:6px 14px;border-radius:99px;cursor:pointer}.cats button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:24px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .35s,box-shadow .35s}
.card:hover{transform:translateY(-5px);box-shadow:0 26px 44px -28px rgba(0,0,0,.45)}
.card .ph{aspect-ratio:16/10;overflow:hidden;background:#e9e4da}.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .9s}.card:hover .ph img{transform:scale(1.06)}
.card .cb{padding:14px 16px 18px;display:grid;gap:6px}.card h3{margin:0;font-size:17px;line-height:1.7}.card p{margin:0;color:var(--muted);font-size:13.5px;line-height:1.9;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .mt{display:flex;gap:10px;font-size:12px;color:var(--muted)}.card .mt b{color:var(--accent)}
/* article */
.ahero{position:relative;margin-top:16px;border-radius:30px;overflow:hidden;min-height:340px;display:flex;align-items:flex-end;color:#fff;background:#222}
.ahero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ahero::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,8,6,.88),rgba(10,8,6,.2) 65%,rgba(10,8,6,.05))}
.ahero .in{position:relative;z-index:1;padding:clamp(18px,4vw,40px);max-width:820px}
.ahero h1{font-family:"Noto Kufi Arabic","Vazirmatn",sans-serif;font-size:clamp(25px,4vw,42px);line-height:1.45;margin:8px 0}
.ameta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;opacity:.9}
.bc{font-size:12.5px;opacity:.85}.bc a{color:inherit}
.alayout{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:34px;margin-top:26px;align-items:start}
.toc{position:sticky;top:80px;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:16px 18px;font-size:13.5px}
.toc b{display:block;margin-bottom:6px}.toc a{display:block;color:var(--muted);text-decoration:none;padding:3px 0;border-inline-start:2px solid transparent;padding-inline-start:10px}.toc a.on{color:var(--accent);border-color:var(--accent)}
.toc .buy{display:block;margin-top:14px;text-align:center;background:var(--accent);color:#fff;border-radius:99px;padding:8px;font-weight:800;border:0}
.prog{position:fixed;top:0;inset-inline-start:0;height:3px;background:linear-gradient(90deg,var(--gold),var(--accent));width:0;z-index:60}
.body{font-size:16.5px}.body>p:first-child{font-size:18px;color:color-mix(in srgb,var(--ink) 85%,var(--muted))}
.body h2{font-family:"Noto Kufi Arabic","Vazirmatn",sans-serif;font-size:23px;margin:34px 0 6px;line-height:1.6;scroll-margin-top:80px}
.body h3{font-size:18px;margin:22px 0 4px}.body li{margin:4px 0}.body strong{color:var(--ink)}
.body table{width:100%;border-collapse:collapse;margin:14px 0;font-size:15px;background:var(--surface);border-radius:16px;overflow:hidden}.body th,.body td{border-bottom:1px solid var(--line);padding:9px 10px;text-align:center}.body th{background:color-mix(in srgb,var(--gold) 22%,var(--surface))}
.note{background:color-mix(in srgb,var(--gold) 14%,var(--surface));border-radius:18px;padding:14px 18px;margin:18px 0;border-inline-start:4px solid var(--gold)}
.prods{margin:30px 0;padding:18px;border-radius:24px;background:var(--surface);border:1px solid var(--line)}.prods>b{display:block;margin-bottom:10px;font-size:16px}
.prow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.prow a{display:grid;gap:4px;text-decoration:none;color:inherit;text-align:center;font-size:13.5px;font-weight:700}.prow img{aspect-ratio:1;object-fit:cover;border-radius:16px;background:#efece6;width:100%}.prow span{color:var(--accent);font-weight:900}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:10px 16px;margin:8px 0}.faq summary{cursor:pointer;font-weight:800}.faq p{margin:6px 0 0;color:var(--muted)}
.author{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:14px 18px;margin:26px 0}.author img{width:56px;height:56px;border-radius:14px}.author p{margin:0;font-size:13.5px;color:var(--muted)}
.cta{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0}.cta a{flex:1;min-width:180px;text-align:center;background:linear-gradient(135deg,#c06a2f,#a8612e);color:#fff;text-decoration:none;font-weight:800;padding:12px 20px;border-radius:99px}.cta a.g{background:var(--green)}
.related h2{font-family:"Noto Kufi Arabic","Vazirmatn",sans-serif;font-size:24px;margin:40px 0 14px}
footer{margin-top:50px;background:var(--green);color:#cfc4ae;font-size:13.5px;padding:26px 0}footer a{color:#e8dcc4}
.mbar{display:none}
@media (max-width:900px){.grid{grid-template-columns:repeat(2,1fr)}.alayout{grid-template-columns:minmax(0,1fr)}.toc{display:none}}
@media (max-width:600px){.grid{grid-template-columns:1fr}.mhero{aspect-ratio:auto;min-height:0;height:380px;border-radius:24px}.mhero p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px}.ahero{min-height:300px;border-radius:24px;margin-inline:-6px}.hnav{display:none}.body{font-size:16px}.prow{gap:6px}.prow a{font-size:12px}
 body{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
 .mbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;z-index:80;inset-inline:10px;bottom:calc(8px + env(safe-area-inset-bottom));height:62px;border-radius:22px;background:color-mix(in srgb,var(--surface) 88%,transparent);backdrop-filter:blur(16px);border:1px solid var(--line);box-shadow:0 18px 40px -18px rgba(0,0,0,.45)}
 .mbar a{display:grid;justify-items:center;align-content:center;gap:3px;color:var(--muted);font:600 11px inherit;text-decoration:none}.mbar svg{width:22px;height:22px}.mbar .on{color:var(--accent)}}
