/*
Theme Name: Zawaya
Theme URI: https://zawayamaghreb.com
Author: Wusul Studio
Description: زوايا — independent Maghreb digital magazine. RTL-first editorial theme. Black / White / Electric Blue #0057FF, Tajawal.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: zawaya
*/

:root{
  --paper:#F8F7F4;
  --ink:#101114;
  --blue:#0057FF;
  --graphite:#5E6167;
  --line:#DAD9D3;
  --card:#FFFFFF;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{
  font-family:'Tajawal',sans-serif;
  background:var(--paper);
  color:var(--ink);
  line-height:1.8;
  font-size:17px;
}
a{color:inherit;text-decoration:none;}
a:hover{color:var(--blue);}
img{max-width:100%;height:auto;display:block;}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px;}

/* signature angle bracket */
.zawiya{position:relative;display:inline-block;}
.zawiya::before{content:"";position:absolute;top:-10px;right:-14px;width:24px;height:24px;border-top:3px solid var(--blue);border-right:3px solid var(--blue);}
html[dir="ltr"] .zawiya::before{right:auto;left:-14px;border-right:none;border-left:3px solid var(--blue);}

/* topbar + masthead */
.topbar{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);font-size:.82rem;color:var(--graphite);font-weight:500;}
.masthead{text-align:center;padding:40px 0 24px;border-bottom:2px solid var(--ink);}
.wordmark{font-weight:900;font-size:clamp(3.4rem,9vw,6rem);line-height:1;display:inline-block;position:relative;color:var(--ink);}
.wordmark::after{content:"";position:absolute;bottom:8px;left:-20px;width:28px;height:28px;border-bottom:4px solid var(--blue);border-left:4px solid var(--blue);}
.site-tagline{margin-top:8px;font-size:.95rem;color:var(--graphite);font-weight:500;}

/* nav */
.sections{display:flex;justify-content:center;gap:26px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid var(--line);font-weight:700;font-size:.92rem;list-style:none;}
.sections a{padding:2px 0;border-bottom:2px solid transparent;transition:.15s;}
.sections a:hover{border-color:var(--blue);color:var(--blue);}
.sections .current-menu-item a,.sections .current-cat a{border-color:var(--blue);color:var(--blue);}

/* hero */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding:56px 0;border-bottom:1px solid var(--line);}
.kicker{display:inline-block;color:var(--blue);font-weight:800;font-size:.88rem;margin-bottom:12px;}
.hero h1{font-weight:800;font-size:clamp(1.8rem,4vw,2.8rem);line-height:1.35;margin-bottom:16px;}
.hero h1 a:hover{color:var(--blue);}
.hero .dek{color:var(--graphite);font-size:1.06rem;max-width:34em;margin-bottom:24px;}
.btn{display:inline-block;background:var(--ink);color:#fff;font-weight:700;font-size:.95rem;padding:12px 28px;transition:.15s;}
.btn:hover{background:var(--blue);color:#fff;}
.hero-art{background:var(--card);border:1px solid var(--line);padding:10px;}
.hero-art img{width:100%;}

/* section headers */
.sec-head{display:flex;align-items:baseline;justify-content:space-between;margin:52px 0 26px;}
.sec-head h2{font-weight:800;font-size:1.45rem;padding-right:18px;position:relative;}
.sec-head h2::before{content:"";position:absolute;right:0;top:6px;width:12px;height:12px;border-top:3px solid var(--blue);border-right:3px solid var(--blue);}
html[dir="ltr"] .sec-head h2{padding-right:0;padding-left:18px;}
html[dir="ltr"] .sec-head h2::before{right:auto;left:0;border-right:none;border-left:3px solid var(--blue);}
.sec-head a{font-size:.88rem;font-weight:700;color:var(--graphite);}

/* angles grid */
.angles{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.angle{background:var(--card);padding:24px 22px 28px;transition:.15s;}
.angle:hover{background:var(--paper);}
.angle .cat{color:var(--blue);font-weight:800;font-size:.8rem;display:block;margin-bottom:10px;}
.angle h3{font-weight:700;font-size:1.04rem;line-height:1.5;margin-bottom:8px;}
.angle p{color:var(--graphite);font-size:.9rem;}

/* archive list */
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.issue{border-top:2px solid var(--ink);padding-top:14px;margin-bottom:24px;}
.issue .date{font-size:.78rem;color:var(--graphite);font-weight:500;display:block;margin-bottom:6px;}
.issue h3{font-weight:700;font-size:1.05rem;line-height:1.5;}
.issue .thumb{margin-bottom:12px;border:1px solid var(--line);}

/* newsletter */
.newsletter{margin:64px 0;background:var(--ink);color:#fff;padding:52px 44px;display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center;position:relative;}
.newsletter::before{content:"";position:absolute;top:14px;right:14px;width:26px;height:26px;border-top:3px solid var(--blue);border-right:3px solid var(--blue);}
.newsletter h2{font-weight:800;font-size:1.6rem;margin-bottom:10px;}
.newsletter p{color:#B9BBC0;font-size:.96rem;max-width:32em;}
.newsletter a{color:var(--blue);font-weight:700;}
.nl-embed{min-height:60px;}

/* single article */
.article-head{max-width:760px;margin:56px auto 32px;text-align:center;padding:0 24px;}
.article-head h1{font-weight:800;font-size:clamp(1.7rem,3.6vw,2.6rem);line-height:1.4;margin:14px 0;}
.article-meta{color:var(--graphite);font-size:.85rem;font-weight:500;}
.article-feature{max-width:860px;margin:0 auto 40px;padding:0 24px;}
.article-feature img{border:1px solid var(--line);}
.article-body{max-width:680px;margin:0 auto;padding:0 24px 64px;font-size:1.08rem;}
.article-body p{margin-bottom:1.4em;}
.article-body h2,.article-body h3{font-weight:800;margin:1.6em 0 .6em;position:relative;padding-right:16px;}
.article-body h2::before{content:"";position:absolute;right:0;top:8px;width:10px;height:10px;border-top:3px solid var(--blue);border-right:3px solid var(--blue);}
.article-body blockquote{border-right:3px solid var(--blue);padding-right:18px;margin:1.6em 0;color:var(--graphite);font-weight:500;}
html[dir="ltr"] .article-body blockquote{border-right:none;border-left:3px solid var(--blue);padding-right:0;padding-left:18px;}
.article-body a{color:var(--blue);}

/* footer */
.site-footer{border-top:2px solid var(--ink);padding:36px 0 48px;display:flex;justify-content:space-between;align-items:flex-start;gap:32px;flex-wrap:wrap;}
.site-footer .fm{font-weight:900;font-size:1.7rem;}
.site-footer .manifesto{color:var(--graphite);font-size:.9rem;max-width:30em;}
.site-footer .links{display:flex;gap:20px;font-weight:700;font-size:.9rem;list-style:none;}

/* pagination */
.pagination{margin:40px 0;font-weight:700;display:flex;gap:14px;justify-content:center;}
.pagination .current{color:var(--blue);}

@media(max-width:860px){
  .hero{grid-template-columns:1fr;gap:30px;padding:40px 0;}
  .angles{grid-template-columns:1fr 1fr;}
  .archive-grid{grid-template-columns:1fr;}
  .newsletter{grid-template-columns:1fr;padding:38px 26px;}
}
@media(max-width:560px){
  .angles{grid-template-columns:1fr;}
  .sections{gap:16px;font-size:.85rem;}
}
