/*
Theme Name: Farz Daily
Theme URI: https://www.farzmedia.com/
Author: Farz Media
Description: A fast, accessible RTL newspaper theme for Daily Farz Karachi.
Version: 1.3.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: farz-daily
License: GPL-2.0-or-later
*/

:root {
  --farz-ink: #161616;
  --farz-muted: #666;
  --farz-paper: #fff;
  --farz-canvas: #f3f3f1;
  --farz-rule: #deded9;
  --farz-red: #b3131b;
  --farz-red-dark: #850d13;
  --farz-gold: #c99b3b;
  --farz-max: 1240px;
  --farz-radius: 3px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--farz-canvas);
  color: var(--farz-ink);
  direction: rtl;
  font-family: "Noto Naskh Arabic", "Noto Nastaliq Urdu", "Segoe UI", Georgia, serif;
  font-size: 18px;
  line-height: 1.75;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--farz-red); }
button, input, select, textarea { font: inherit; }
.screen-reader-text {
  border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
  height: 1px; margin: -1px; overflow: hidden; padding: 0;
  position: absolute; width: 1px; word-wrap: normal !important;
}
.screen-reader-text:focus {
  background: #fff; clip: auto !important; clip-path: none; color: #000;
  display: block; height: auto; inset: 8px auto auto 8px; padding: 12px 18px;
  width: auto; z-index: 100000;
}
.farz-shell { width: min(calc(100% - 32px), var(--farz-max)); margin-inline: auto; }

.site-topbar { background: #111; border-bottom: 3px solid var(--farz-red); color: #fff; font-family: Arial, sans-serif; font-size: 13px; }
.site-topbar__inner { min-height: 36px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.site-topbar a { color: #fff; opacity: .86; }
.topbar-links { display: flex; gap: 18px; }
.site-masthead { background: var(--farz-paper); border-bottom: 1px solid var(--farz-rule); }
.site-masthead__inner { min-height: 158px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; }
.site-branding { text-align: center; grid-column: 2; }
.custom-logo { max-height: 112px; width: auto; margin-inline: auto; }
.default-logo-link { display: inline-block; line-height: 0; }
.default-logo-link .custom-logo { width: 112px; height: 112px; object-fit: contain; }
.site-title { margin: 0; font-size: clamp(42px, 6vw, 76px); line-height: 1; font-weight: 800; }
.site-title a { color: #111; }
.site-description { margin: 7px 0 0; color: var(--farz-muted); font-size: 13px; letter-spacing: .04em; }
.masthead-date { justify-self: start; color: var(--farz-muted); font-size: 15px; }
.masthead-search { justify-self: end; }
.masthead-search button { border: 0; background: transparent; cursor: pointer; font-size: 22px; }

.primary-nav { background: var(--farz-red); box-shadow: 0 3px 12px rgba(0,0,0,.14); color: #fff; position: sticky; top: 0; z-index: 50; }
.primary-nav__inner { display: flex; align-items: center; justify-content: space-between; min-height: 50px; }
.menu-toggle { display: none; border: 0; background: transparent; color: #fff; padding: 10px 0; cursor: pointer; }
.primary-nav ul { display: flex; flex-wrap: wrap; gap: 0; list-style: none; margin: 0; padding: 0; }
.primary-nav li { border-inline-start: 1px solid rgba(255,255,255,.18); }
.primary-nav a { color: #fff; display: block; padding: 10px 15px; font-weight: 700; white-space: nowrap; }
.primary-nav a:hover, .primary-nav .current-menu-item > a { background: var(--farz-red-dark); color: #fff; }

.news-ticker { background: #fff; border-bottom: 1px solid var(--farz-rule); }
.news-ticker__inner { min-height: 43px; display: flex; align-items: center; gap: 14px; overflow: hidden; }
.news-ticker__label { align-self: stretch; display: inline-flex; align-items: center; background: #111; color: #fff; font: 700 13px/1 Arial,sans-serif; padding: 0 16px; white-space: nowrap; }
.news-ticker__items { display: flex; gap: 28px; white-space: nowrap; overflow: hidden; font-size: 15px; }
.news-ticker__items a::before { content: "•"; color: var(--farz-red); margin-inline-end: 8px; }

.site-main { padding-block: 30px 68px; }
.section { margin-top: 36px; }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-top: 4px solid var(--farz-ink); padding-top: 10px; margin: 0 0 18px; }
.section-heading h2, .archive-title { margin: 0; font-size: clamp(25px, 3vw, 34px); line-height: 1.35; }
.section-heading a { color: var(--farz-red); font-size: 14px; font-family: Arial,sans-serif; }

.lead-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .85fr); gap: 24px; }
.lead-story, .story-card, .epaper-promo { background: #fff; box-shadow: 0 5px 24px rgba(25,20,15,.055); }
.lead-story__image { aspect-ratio: 16 / 9; width: 100%; object-fit: cover; background: #ddd; }
.lead-story__body { padding: 20px 24px 24px; }
.story-kicker { color: var(--farz-red); font: 700 12px/1.3 Arial,sans-serif; letter-spacing: .03em; }
.lead-story h1 { font-size: clamp(31px, 4vw, 48px); line-height: 1.28; margin: 8px 0 10px; }
.story-meta { color: var(--farz-muted); font-size: 13px; font-family: Arial, sans-serif; }
.story-summary { margin: 12px 0 0; color: #3c3c3c; }
.lead-side { display: grid; gap: 1px; background: var(--farz-rule); }
.compact-story { background: #fff; padding: 18px; display: grid; grid-template-columns: 112px 1fr; gap: 14px; align-items: start; }
.compact-story img { width: 112px; height: 76px; object-fit: cover; }
.compact-story h3 { font-size: 19px; line-height: 1.42; margin: 0 0 5px; }

.story-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.story-card { border-bottom: 3px solid var(--farz-ink); transition: transform .18s ease, box-shadow .18s ease; }
.story-card:hover { box-shadow: 0 10px 30px rgba(25,20,15,.10); transform: translateY(-2px); }
.story-card img, .story-card__placeholder { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: #ddd; }
.story-card__body { padding: 15px 16px 18px; }
.story-card h3 { font-size: 22px; line-height: 1.42; margin: 5px 0 7px; }

.epaper-promo { display: grid; grid-template-columns: minmax(260px, .72fr) 1.28fr; gap: 0; border-top: 5px solid var(--farz-red); }
.epaper-promo__cover { background: #ececea; min-height: 340px; display: grid; place-items: center; overflow: hidden; }
.epaper-promo__cover img { max-height: 520px; width: auto; box-shadow: 0 12px 35px rgba(0,0,0,.18); }
.epaper-promo__content { padding: clamp(26px, 5vw, 62px); display: flex; flex-direction: column; justify-content: center; }
.epaper-promo h2 { font-size: clamp(32px, 4vw, 50px); margin: 8px 0 12px; line-height: 1.3; }
.button { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; margin-top: 14px; background: var(--farz-red); color: #fff; min-height: 44px; padding: 7px 22px; font-weight: 700; border-radius: var(--farz-radius); }
.button:hover { background: var(--farz-red-dark); color: #fff; }

.utility-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.utility-card { align-items: center; background: #fff; border: 1px solid var(--farz-rule); border-inline-start: 5px solid var(--farz-red); display: grid; gap: 16px; grid-template-columns: 58px 1fr auto; min-height: 112px; padding: 18px 22px; transition: transform .18s ease, box-shadow .18s ease; }
.utility-card:hover { box-shadow: 0 10px 28px rgba(25,20,15,.10); color: var(--farz-ink); transform: translateY(-2px); }
.utility-card--bond { border-inline-start-color: var(--farz-gold); }
.utility-card__icon { align-items: center; background: #f7e8e9; border-radius: 50%; color: var(--farz-red); display: inline-flex; font: 700 28px/1 Arial,sans-serif; height: 54px; justify-content: center; width: 54px; }
.utility-card--bond .utility-card__icon { background: #f7f0df; color: #906816; }
.utility-card strong, .utility-card small { display: block; }
.utility-card strong { font-size: 23px; line-height: 1.35; }
.utility-card small { color: var(--farz-muted); margin-top: 4px; }
.utility-card__arrow { color: var(--farz-red); font: 24px/1 Arial,sans-serif; }

.content-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 34px; }
.article, .archive-wrap, .page-wrap { background: #fff; padding: clamp(20px, 4vw, 48px); }
.article-header { border-bottom: 1px solid var(--farz-rule); margin-bottom: 24px; padding-bottom: 18px; }
.article-title { font-size: clamp(34px, 5vw, 56px); line-height: 1.3; margin: 5px 0 12px; }
.article-featured { margin: 0 0 26px; }
.article-content { font-size: 21px; line-height: 1.95; }
.article-content p:first-child { margin-top: 0; }
.article-content a { color: var(--farz-red); text-decoration: underline; }
.image-credit { color: var(--farz-muted); font: 12px/1.5 Arial,sans-serif; margin-top: -20px; margin-bottom: 24px; }
.sidebar-box { background: #fff; padding: 18px; border-top: 4px solid #111; margin-bottom: 22px; }
.sidebar-box h2 { font-size: 23px; margin: 0 0 12px; }
.sidebar-box ul { list-style: none; margin: 0; padding: 0; }
.sidebar-box li { border-top: 1px solid var(--farz-rule); padding: 9px 0; }

.archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.pagination { margin-top: 32px; }
.pagination .nav-links { display: flex; gap: 8px; justify-content: center; }
.pagination .page-numbers { background: #fff; padding: 6px 13px; }
.pagination .current { background: var(--farz-red); color: #fff; }

.site-footer { background: #111; border-top: 5px solid var(--farz-red); color: #ddd; padding: 42px 0 24px; }
.site-footer__grid { display: grid; grid-template-columns: 1.2fr .8fr .8fr; gap: 32px; }
.site-footer h2 { color: #fff; font-size: 22px; }
.site-footer ul { list-style: none; margin: 0; padding: 0; }
.site-footer a { color: #ddd; }
.site-footer__bottom { border-top: 1px solid #333; margin-top: 28px; padding-top: 18px; color: #aaa; font: 12px/1.5 Arial,sans-serif; }

@media (max-width: 900px) {
  .lead-grid, .content-layout, .epaper-promo { grid-template-columns: 1fr; }
  .story-grid, .archive-grid { grid-template-columns: repeat(2, 1fr); }
  .site-footer__grid { grid-template-columns: 1fr 1fr; }
  .utility-grid { grid-template-columns: 1fr; }
  .content-sidebar { order: 2; }
}
@media (max-width: 680px) {
  body { font-size: 17px; }
  .farz-shell { width: min(calc(100% - 22px), var(--farz-max)); }
  .site-topbar__inner { justify-content: center; }
  .site-topbar__inner > :last-child, .masthead-date, .masthead-search { display: none; }
  .site-masthead__inner { min-height: 108px; grid-template-columns: 1fr; }
  .site-branding { grid-column: auto; }
  .custom-logo { max-height: 82px; }
  .default-logo-link .custom-logo { width: 82px; height: 82px; }
  .primary-nav__inner { display: block; }
  .menu-toggle { display: block; width: 100%; text-align: right; }
  .primary-nav ul { display: none; flex-direction: column; }
  .primary-nav.is-open ul { display: flex; }
  .primary-nav li { border: 0; border-top: 1px solid rgba(255,255,255,.18); }
  .lead-side { grid-template-columns: 1fr; }
  .story-grid, .archive-grid, .site-footer__grid { grid-template-columns: 1fr; }
  .compact-story { grid-template-columns: 96px 1fr; }
  .compact-story img { width: 96px; height: 70px; }
  .epaper-promo__content { padding: 24px; }
  .article-content { font-size: 19px; }
}