/*
Theme Name: The Quran Asks
Description: WordPress adaptation of the existing QuranAsks Hugo design.
Version: 1.0.0
*/
body{color:#18181b;background:#fff;font-family:Arial,Helvetica,sans-serif}a{color:inherit}img{max-width:100%;height:auto}.qa-wrap{max-width:1280px;margin:auto;padding:0 32px}.qa-network{display:flex;justify-content:flex-end;gap:20px;flex-wrap:wrap;padding:12px 0;font-size:13px;color:#07516b}.qa-banner{display:block;width:100%;margin:8px 0 20px}.qa-menu{display:flex;align-items:center;gap:24px;flex-wrap:wrap;padding:14px 0 20px;border-bottom:1px solid #e4e4e7}.qa-menu a:hover,.qa-network a:hover{text-decoration:underline}.qa-search{margin-left:auto;display:flex;gap:8px}.qa-search input{border:1px solid #d4d4d8;border-radius:24px;padding:8px 14px;max-width:190px}.qa-search button,.qa-pill{border:1px solid #d4d4d8;border-radius:24px;padding:8px 16px;background:#fff;display:inline-block}.qa-title{font-size:36px;font-weight:700;margin:34px 0 24px;line-height:1.2}.qa-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px}.qa-card{background:#f4f4f5;border-radius:24px;overflow:hidden;position:relative}.qa-card:hover,.qa-hero:hover{background:#dbeafe}.qa-card img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .3s}.qa-card:hover img{transform:scale(1.025)}.qa-card-body{padding:24px}.qa-card h2{font-size:24px;font-weight:700;line-height:1.3;margin:14px 0}.qa-card p{color:#71717a;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.qa-card time{font-size:14px}.qa-hero{background:#f4f4f5;border-radius:24px;padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center;margin:52px 0}.qa-hero img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:18px}.qa-hero h1{font-size:44px;font-weight:700;line-height:1.2;margin-bottom:16px}.qa-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(240px,1fr);gap:40px;margin:32px 0 56px}.qa-content{font-size:18px;line-height:1.8;overflow-wrap:anywhere}.qa-content p{margin:0 0 1.3em}.qa-content h2,.qa-content h3{font-weight:700;margin:1.5em 0 .7em}.qa-content ul,.qa-content ol{padding-left:1.5em;margin-bottom:1em}.qa-content ul{list-style:disc}.qa-content a{color:#075985;text-decoration:underline}.qa-content img{height:auto;border-radius:12px}.qa-content iframe,.qa-content video{max-width:100%}.qa-content iframe{width:100%;min-height:300px}.qa-content [dir=rtl]{text-align:right;line-height:2}.qa-cover{width:100%;max-height:600px;object-fit:contain;border-radius:18px;margin:24px 0}.qa-aside{position:sticky;top:24px;align-self:start}.qa-aside h2{font-size:22px;font-weight:700;margin-bottom:20px}.qa-recent{display:flex;align-items:center;gap:16px;margin-bottom:20px;font-weight:700}.qa-recent img{width:90px;height:90px;object-fit:cover;border-radius:16px}.qa-pagination{display:flex;gap:10px;flex-wrap:wrap;margin:32px 0}.qa-pagination a,.qa-pagination span{padding:9px 15px;border:1px solid #d4d4d8;border-radius:20px}.qa-pagination .current{background:#dbeafe}.qa-follow{background:#3b82f6;color:#fff;border-radius:24px;padding:40px;margin:56px 0;display:flex;align-items:center;justify-content:space-between;gap:24px}.qa-follow h2{font-size:26px;font-weight:700;margin-bottom:12px}.qa-follow img{width:100px}.qa-follow a{background:white;color:#1d4ed8;border-radius:24px;padding:10px 20px;display:inline-block;margin-top:14px}.qa-footer{border-top:1px solid #e4e4e7;padding:36px 0}.qa-footer-logo{width:160px;margin-bottom:18px}.qa-footer nav{display:flex;gap:20px;flex-wrap:wrap;margin:20px 0}.qa-meta{color:#71717a;font-size:14px}.qa-taxonomy{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.qa-breadcrumb{font-size:14px;color:#71717a;margin:24px 0}.qa-empty{padding:40px;background:#f4f4f5;border-radius:24px}
@media(max-width:800px){.qa-wrap{padding:0 18px}.qa-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.qa-layout{grid-template-columns:1fr}.qa-aside{position:static}.qa-hero{padding:24px}.qa-hero h1{font-size:30px}.qa-search{margin-left:0}.qa-title{font-size:30px}}
@media(max-width:520px){.qa-grid,.qa-hero{grid-template-columns:1fr}.qa-network{justify-content:center;gap:10px;font-size:12px}.qa-menu{gap:16px}.qa-hero{margin:28px 0}.qa-hero h1{font-size:28px}.qa-follow{padding:24px;flex-direction:column;align-items:flex-start}.qa-content{font-size:17px}}
.qa-hero img{object-position:top}.qa-section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.qa-video{padding:16px;background:#f4f4f5;border-radius:18px;margin-bottom:28px}.qa-video iframe{width:100%;aspect-ratio:16/9;border:0}

/* Compact footer: logo at left, title and tagline beside it. */
/* Compact header with click-to-open category navigation. */
.qa-explore{margin:28px 0 32px;padding:24px;background:#f0f6f8;border:1px solid #dce6ea;border-radius:16px}
.qa-explore h2{font-size:23px;line-height:1.3;font-weight:700;color:#073e53;margin:0 0 8px}
.qa-explore p{font-size:14px;color:#60646c;margin:0 0 16px}
.qa-explore nav{display:flex;gap:12px;flex-wrap:wrap}
.qa-explore nav a{display:flex;align-items:center;gap:28px;padding:10px 16px;background:#fff;border:1px solid #d5e2e7;border-radius:24px;font-size:15px;color:#07516b}
.qa-explore nav a:hover,.qa-explore nav a:focus-visible{background:#e0eef3;border-color:#07516b}
.qa-breadcrumb a{color:#07516b;text-decoration:underline;text-underline-offset:3px}
.qa-article-nav{border-top:1px solid #dce6ea;margin-top:32px;padding-top:20px}
.qa-article-nav>p{font-size:16px;font-weight:600;color:#07516b;margin-bottom:14px}
.qa-article-nav-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:18px}
.qa-article-nav-links>a{padding:16px;background:#f0f6f8;border:1px solid #dce6ea;border-radius:12px;color:#073e53;font-size:16px;line-height:1.5}
.qa-article-nav-links>a:hover{background:#e0eef3}
.qa-article-nav-links small{display:block;font-size:12px;margin-bottom:6px;color:#627983}
@media(max-width:520px){.qa-article-nav-links{grid-template-columns:1fr}}
.qa-home-intro{padding:32px 0 24px;max-width:850px}
.qa-eyebrow{color:#07516b;font-size:12px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;margin-bottom:10px}
.qa-home-intro h1{font-size:36px;line-height:1.2;font-weight:700;color:#073e53;margin:0 0 12px}
.qa-home-intro>p:last-child{color:#60646c;font-size:16px;line-height:1.6;margin:0}
.qa-question-nav{padding:22px 24px;background:#f0f6f8;border:1px solid #dfebef;border-radius:16px;margin-bottom:32px}
.qa-question-nav h2{font-size:14px;font-weight:700;color:#07516b;margin:0 0 14px}
.qa-question-links{display:flex;gap:9px;flex-wrap:wrap}
.qa-question-links a{display:flex;align-items:center;gap:12px;background:white;border:1px solid #d5e2e7;border-radius:24px;padding:7px 13px;font-size:14px}
.qa-question-links span{font-size:11px;color:#627983;background:#eef4f6;border-radius:12px;padding:1px 6px}
.qa-question-links a:hover,.qa-question-links a:focus-visible{border-color:#07516b;color:#07516b;background:#e5f0f5}
.qa-question-section{padding:24px 0 32px;border-bottom:1px solid #e4e4e7;scroll-margin-top:20px}
.qa-question-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
.qa-question-heading>div{display:flex;align-items:baseline;gap:14px}
.qa-question-heading h2{font-size:26px;line-height:1.25;font-weight:700;color:#073e53;margin:0}
.qa-question-heading>div>span{font-size:13px;color:#71717a;white-space:nowrap}
.qa-view-all{color:#07516b;font-size:14px;font-weight:600;white-space:nowrap}
.qa-view-all:hover{text-decoration:underline}
.qa-category-home .qa-card{border:1px solid #e5e7eb;background:#fafafa;border-radius:16px}
.qa-category-home .qa-card:hover{background:#eef6fa}
.qa-category-home .qa-card-body{padding:18px 20px}
.qa-category-home .qa-card h2{font-size:21px;margin:9px 0;line-height:1.3}
.qa-category-home .qa-card time{font-size:12px;color:#71717a}
.qa-category-home .qa-card p{font-size:14px;line-height:1.6;-webkit-line-clamp:2}
.qa-category-home .qa-samples-1{grid-template-columns:1fr}
.qa-category-home .qa-samples-1 .qa-card>a{display:grid;grid-template-columns:260px 1fr;align-items:center}
.qa-category-home .qa-samples-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.qa-coming-soon{color:#71717a;font-size:14px;margin:0;padding:12px 0}
.qa-back-top{display:inline-block;color:#07516b;font-size:14px;margin:24px 0}
.qa-follow-compact{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:20px 0;margin:0 0 24px;border-top:1px solid #e4e4e7;font-size:14px;color:#60646c}
.qa-follow-compact a{color:#07516b;font-weight:600}
@media(max-width:800px){.qa-category-home .qa-grid{grid-template-columns:1fr}.qa-home-intro h1{font-size:28px}.qa-home-intro{padding-top:26px}.qa-question-nav{padding:18px}.qa-question-heading h2{font-size:23px}.qa-question-heading>div{gap:8px;flex-wrap:wrap}.qa-category-home .qa-card img{max-height:280px}.qa-question-links a{font-size:13px;padding:6px 10px}}
@media(max-width:800px){.qa-category-home .qa-samples-1 .qa-card>a{display:block}}
.qa-header .qa-network{padding:7px 0;font-size:12px;gap:18px}
.qa-header .qa-banner{width:auto;height:90px;max-width:100%;object-fit:contain;margin:4px auto 8px}
.qa-header .qa-menu{flex-wrap:nowrap;gap:24px;padding:8px 0;font-size:15px;min-height:48px}
.qa-header .qa-menu>a{white-space:nowrap}
.qa-header .qa-search{margin-left:auto;min-width:0;align-items:center}
.qa-header .qa-search input{width:190px;min-width:0;padding:6px 12px;font-size:14px}
.qa-header .qa-search button{padding:6px 12px;font-size:14px}
.qa-category-menu{position:relative;flex-shrink:0}
.qa-category-menu summary{cursor:pointer;list-style:none;padding:6px 0;white-space:nowrap;color:#07516b}
.qa-category-menu summary::-webkit-details-marker{display:none}
.qa-category-menu summary:focus-visible{outline:2px solid #07516b;outline-offset:4px;border-radius:3px}
.qa-category-dropdown{position:absolute;top:calc(100% + 8px);left:0;z-index:50;width:250px;max-height:65vh;overflow-y:auto;padding:8px;background:#fff;border:1px solid #e4e4e7;border-radius:12px;box-shadow:0 8px 24px #0002}
.qa-category-dropdown a{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:6px 12px;border-radius:6px;font-size:14px;line-height:20px}
.qa-category-dropdown a:hover,.qa-category-dropdown a:focus-visible{background:#eef6f9;color:#07516b;text-decoration:none}
.qa-category-count{font-size:12px;color:#71717a}
@media(max-width:600px){.qa-header .qa-network{gap:10px;font-size:10px;flex-wrap:nowrap;justify-content:center}.qa-header .qa-banner{height:74px}.qa-header .qa-menu{gap:12px;font-size:13px}.qa-header .qa-search{gap:4px;flex:1}.qa-header .qa-search input{width:100%;padding:6px 8px;font-size:12px}.qa-header .qa-search button{font-size:12px;padding:6px 8px}.qa-category-dropdown{left:auto;right:-75px;width:230px}}
@media(max-width:380px){.qa-header .qa-menu{gap:8px;font-size:12px}.qa-header .qa-search button{padding:6px}.qa-header .qa-network{gap:7px;font-size:9px}}
.qa-footer { background:#f4f4f5; padding:28px 0 20px; }
.qa-footer-brand { display:grid; grid-template-columns:104px minmax(0,1fr) auto; column-gap:24px; row-gap:6px; align-items:center; }
.qa-footer-mark { grid-column:1; grid-row:1 / 3; }
.qa-footer .qa-footer-logo { width:104px; height:104px; object-fit:contain; border-radius:22px; margin:0; }
.qa-footer-title { grid-column:2; grid-row:1; font-size:24px; font-weight:600; line-height:1.25; }
.qa-footer nav.qa-footer-social { grid-column:3; grid-row:1; display:flex; gap:14px; flex-wrap:nowrap; margin:0; }
.qa-footer-social a { width:40px; height:40px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#fff; color:#000; }
.qa-footer-social a:hover { background:#e4e4e7; }
.qa-footer-social a:focus-visible { outline:2px solid #07516b; outline-offset:3px; }
.qa-footer-social svg { width:22px; height:22px; }
.qa-footer-tagline { grid-column:2 / 4; grid-row:2; font-size:15px; line-height:1.5; margin:0; align-self:start; }
.qa-footer nav[aria-label="Footer navigation"] { margin:20px 0 16px; }
.qa-footer .qa-meta { border-top:1px solid #e4e4e7; padding-top:14px; }
@media(max-width:640px){.qa-footer-brand{grid-template-columns:76px minmax(0,1fr);column-gap:16px;row-gap:10px;}.qa-footer .qa-footer-logo{width:76px;height:76px;border-radius:16px;}.qa-footer-title{font-size:19px;}.qa-footer-tagline{grid-column:2;}.qa-footer nav.qa-footer-social{grid-column:2;grid-row:3;gap:10px;}.qa-footer-social a{width:34px;height:34px;}}
