:root{
  --navy:#1C2B45;
  --gold:#C68A2E;
  --gold-deep:#A6721F;
  --gold-light:#E4C87A;
  --maroon:#8A2E22;
  --paper:#FFFFFF;
  --paper-soft:#FAF8F3;
  --ink:#1B1712;
  --ink-soft:#5B5546;
  --line:#E4E0D4;
}
*{box-sizing:border-box;}
body{margin:0;background:var(--paper);color:var(--ink);font-family:'Inter',sans-serif;-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,.display{font-family:'Fraunces',serif;}
.urdu{font-family:'Noto Nastaliq Urdu',serif;direction:rtl;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
img,.ph{display:block;}

/* ============ TOP BAR ============ */
.topbar{border-bottom:1px solid var(--line);padding:16px 0;}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.logo{font-family:'Fraunces',serif;font-weight:800;font-size:29px;color:var(--navy);letter-spacing:-.01em;white-space:nowrap;}
.logo span{color:var(--gold-deep);}
.search-box{flex:1;max-width:360px;display:flex;align-items:center;border:1px solid var(--line);border-radius:3px;padding:8px 12px;color:#9A9382;font-size:13px;gap:8px;}
.topbar-right{display:flex;align-items:center;gap:16px;}
.btn-subscribe{background:var(--gold);color:#fff;font-size:13px;font-weight:700;padding:10px 20px;border-radius:3px;letter-spacing:.01em;border:none;cursor:pointer;font-family:'Inter',sans-serif;}
.menu-txt{font-size:13px;font-weight:600;color:var(--navy);letter-spacing:.03em;display:flex;align-items:center;gap:6px;}

nav.mainnav{border-bottom:1px solid var(--line);}
nav.mainnav .wrap{display:flex;gap:28px;padding:13px 32px;flex-wrap:wrap;}
nav.mainnav a{font-size:13px;font-weight:600;color:var(--navy);letter-spacing:.01em;}
nav.mainnav a:hover,nav.mainnav a.active{color:var(--gold-deep);}

.dateline{background:var(--paper-soft);border-bottom:1px solid var(--line);padding:8px 0;font-size:11.5px;color:var(--ink-soft);}
.dateline .wrap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;}
.dateline b{color:var(--navy);}

/* ============ ARTICLE HEADER ============ */
.article-head{padding:38px 0 0;}
.eyebrow{display:flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-deep);margin-bottom:16px;}
.eyebrow .dot{width:6px;height:6px;background:var(--gold-deep);border-radius:50%;}
.article-head h1{font-size:44px;line-height:1.12;color:var(--ink);margin:0 0 14px;font-weight:700;max-width:20ch;}
.article-head .dek{font-size:19px;line-height:1.5;color:var(--ink-soft);font-weight:400;margin:0 0 22px;max-width:52ch;}

.byline-share{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:34px;}
.byline{font-size:13px;color:var(--ink-soft);}
.byline b{color:var(--navy);}
.share-row{display:flex;gap:8px;}
.share-row a{width:30px;height:30px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;color:var(--navy);font-weight:700;}
.share-row a:hover{border-color:var(--gold);color:var(--gold-deep);}

/* ============ MAIN 2-COL LAYOUT ============ */
.layout{display:grid;grid-template-columns:1fr 300px;gap:56px;padding-bottom:56px;}

.synopsis{font-family:'Fraunces',serif;font-style:italic;font-size:16px;line-height:1.75;color:var(--ink-soft);padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid var(--line);}
.synopsis b{font-style:normal;color:var(--ink);}

.article-body{display:flex;gap:32px;}
.article-body .col-text{flex:1;font-size:15.5px;line-height:1.85;color:var(--ink);}
.article-body .col-text p{margin:0 0 18px;}
.article-body .col-image{width:250px;flex:none;}
.article-body .col-image .ph{width:100%;aspect-ratio:3/4;background:linear-gradient(160deg,#3A3128,#1B1712);position:relative;overflow:hidden;}
.article-body .col-image .ph::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 35% 25%, rgba(198,138,46,.35), transparent 55%);}
.article-body .col-image .cap{font-size:11.5px;color:var(--ink-soft);margin-top:8px;line-height:1.5;}
.pull{font-family:'Fraunces',serif;font-style:italic;font-size:21px;line-height:1.5;color:var(--navy);border-left:3px solid var(--gold);padding-left:20px;margin:26px 0;}

.tag-list{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px;padding-top:22px;border-top:1px solid var(--line);}
.tag-list a{font-size:12px;padding:6px 13px;border:1px solid var(--line);border-radius:20px;color:var(--ink-soft);}

/* SIDEBAR */
.sidebar-box{border:1px solid var(--line);padding:26px;margin-bottom:24px;}
.sidebar-box.subscribe{background:var(--paper-soft);text-align:center;}
.sidebar-box.subscribe .kicker{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;margin-bottom:8px;}
.sidebar-box.subscribe h4{font-family:'Fraunces',serif;font-size:21px;margin:0 0 6px;color:var(--navy);font-weight:600;}
.sidebar-box.subscribe p{font-size:13px;color:var(--ink-soft);margin:0 0 16px;}
.sidebar-box.subscribe .btn-subscribe{width:100%;padding:12px;}

.sidebar-box.ad{background:var(--navy);color:#F6EFDD;text-align:center;}
.sidebar-box.ad .kicker{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-bottom:10px;}
.sidebar-box.ad h4{font-family:'Fraunces',serif;font-size:19px;margin:0 0 8px;font-weight:600;}
.sidebar-box.ad p{font-size:12.5px;color:#C6CCDA;margin:0 0 16px;line-height:1.6;}
.sidebar-box.ad .btn-out{display:inline-block;border:1px solid var(--gold);color:var(--gold-light);font-size:12px;font-weight:700;padding:9px 18px;border-radius:3px;}

.sidebar-box.list h5{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;margin:0 0 16px;}
.sidebar-box.list .item{padding:12px 0;border-bottom:1px solid var(--line);}
.sidebar-box.list .item:last-child{border-bottom:none;padding-bottom:0;}
.sidebar-box.list .item .cat{font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--maroon);font-weight:700;}
.sidebar-box.list .item h6{font-family:'Fraunces',serif;font-size:14.5px;margin:5px 0 0;color:var(--ink);font-weight:600;line-height:1.35;}

/* ============ SIMPLE SECTIONS ============ */
section.plain{padding:44px 0;border-top:1px solid var(--line);}
.sec-head-simple{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:28px;flex-wrap:wrap;gap:10px;}
.sec-head-simple h3{font-size:24px;color:var(--navy);margin:0;font-weight:700;}
.sec-head-simple .tag{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;}
.sec-head-simple .more{font-size:13px;font-weight:600;color:var(--navy);}

.page-head{padding:40px 0 8px;}
.page-head .tag{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-deep);font-weight:700;}
.page-head h1{font-size:38px;color:var(--navy);margin:8px 0 10px;font-weight:700;}
.page-head p{font-size:15.5px;color:var(--ink-soft);max-width:60ch;line-height:1.6;margin:0 0 20px;}

.simple-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}
.simple-card .ph{width:100%;height:150px;background:linear-gradient(150deg,#3A3128,#1B1712);position:relative;overflow:hidden;margin-bottom:14px;}
.simple-card .ph::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 25%, rgba(198,138,46,.3), transparent 55%);}
.simple-card .cat{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon);font-weight:700;}
.simple-card h4{font-family:'Fraunces',serif;font-size:18px;margin:8px 0 8px;color:var(--ink);font-weight:600;line-height:1.3;}
.simple-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin:0 0 10px;}
.simple-card .meta{font-size:11.5px;color:#8B8371;}

/* NEWS LIST PAGE */
.news-row{display:flex;gap:22px;padding:22px 0;border-bottom:1px solid var(--line);}
.news-row .ph{width:180px;height:120px;flex:none;background:linear-gradient(150deg,#3A3128,#1B1712);position:relative;overflow:hidden;}
.news-row .ph::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 25%, rgba(198,138,46,.3), transparent 55%);}
.news-row .cat{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--maroon);font-weight:700;}
.news-row h4{font-family:'Fraunces',serif;font-size:19px;margin:7px 0 6px;color:var(--ink);font-weight:600;}
.news-row p{font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin:0 0 8px;}
.news-row .meta{font-size:11.5px;color:#8B8371;}

/* DIRECTORY */
.dir-list{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line);}
.dir-cell{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px;}
.dir-cell .city{font-family:'Fraunces',serif;font-size:17px;color:var(--navy);font-weight:600;}
.dir-cell .jamaat{font-size:11.5px;color:var(--gold-deep);font-weight:600;margin:4px 0 8px;}
.dir-cell .count{font-size:12px;color:var(--ink-soft);}

.lang-strip{display:flex;justify-content:space-between;align-items:center;background:var(--paper-soft);border:1px solid var(--line);padding:30px 36px;gap:30px;flex-wrap:wrap;}
.lang-strip .urdu{font-size:28px;color:var(--navy);}
.lang-strip .translit{font-family:'Fraunces',serif;font-style:italic;font-size:15px;color:var(--gold-deep);margin-top:6px;}
.lang-strip .meaning{font-size:13px;color:var(--ink-soft);max-width:40ch;line-height:1.6;}

/* FORM (submit page) */
.form-wrap{max-width:640px;padding:20px 0 60px;}
.form-row{margin-bottom:20px;}
.form-row label{display:block;font-size:12.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--navy);margin-bottom:7px;}
.form-row input,.form-row select,.form-row textarea{width:100%;border:1px solid var(--line);border-radius:3px;padding:11px 13px;font-size:14.5px;font-family:'Inter',sans-serif;color:var(--ink);background:#fff;}
.form-row textarea{resize:vertical;min-height:120px;}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{outline:none;border-color:var(--gold);}
.form-two{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.form-note{font-size:12px;color:var(--ink-soft);margin-top:6px;}
.form-success{display:none;background:var(--paper-soft);border:1px solid var(--gold);padding:20px;border-radius:3px;font-size:14px;color:var(--navy);margin-bottom:20px;}

footer{border-top:1px solid var(--line);padding:36px 0;}
.foot-row{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-soft);flex-wrap:wrap;gap:10px;}
.foot-row a{margin-right:16px;color:var(--navy);font-weight:600;}

@media(max-width:900px){
  .layout{grid-template-columns:1fr;}
  .article-body{flex-direction:column-reverse;}
  .article-body .col-image{width:100%;}
  .simple-grid{grid-template-columns:1fr;}
  .dir-list{grid-template-columns:1fr 1fr;}
  .article-head h1{font-size:30px;}
  .news-row{flex-direction:column;}
  .news-row .ph{width:100%;height:160px;}
  .form-two{grid-template-columns:1fr;}
  nav.mainnav .wrap{gap:16px;}
}