/* Living In UAE — Clean Static Site */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  font-size:17px;line-height:1.6;color:#1a1a1a;background:#f4f4f0}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
:root{
  --g:#006c35;--gd:#004d25;
  --cr:#CC0001;
  --t:#1a1a1a;--tm:#555;--tl:#888;
  --bg:#f4f4f0;--w:#fff;--b:#e0ddd6;
  --mw:1120px;--r:6px;
  --sh:0 1px 3px rgba(0,0,0,.08),0 4px 12px rgba(0,0,0,.05)}

/* Header */
.site-header{background:var(--w);border-bottom:1px solid var(--b);
  position:sticky;top:0;z-index:100}
.header-inner{max-width:var(--mw);margin:0 auto;padding:0 20px;height:64px;
  display:flex;align-items:center;gap:8px}
.site-logo{font-size:19px;font-weight:800;color:var(--g);
  white-space:nowrap;margin-right:20px}
.site-logo em{color:var(--t);font-style:normal}
.nav-sp{flex:1}
.site-nav{display:flex;gap:4px;align-items:center}
.site-nav a{padding:7px 14px;border-radius:5px;font-size:15px;font-weight:500;
  color:var(--tm);transition:color .15s,background .15s;white-space:nowrap}
.site-nav a:hover,.site-nav a.active{color:var(--g);background:rgba(0,108,53,.08)}
.menu-btn{display:none;background:none;border:none;cursor:pointer;padding:8px;
  margin-left:4px;color:var(--t)}

/* Container */
.container{max-width:var(--mw);margin:0 auto;padding:0 20px}

/* Hero */
.home-hero{background:linear-gradient(135deg,#004d25 0%,#006c35 55%,#008944 100%);
  color:#fff;padding:64px 20px}
.home-hero-inner{max-width:var(--mw);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:48px}
.home-hero h1{font-size:clamp(26px,4.5vw,46px);font-weight:800;
  line-height:1.2;margin-bottom:14px}
.home-hero p{font-size:18px;opacity:.85;margin-bottom:28px}

/* Cat chips */
.cat-chips{display:flex;gap:10px;flex-wrap:wrap;padding:12px 0 2px}
.cat-chip{padding:6px 18px;border-radius:20px;font-size:13px;font-weight:600;
  border:1.5px solid var(--b);color:var(--tm);background:var(--w);transition:all .15s}
.cat-chip:hover,.cat-chip.active{border-color:var(--g);color:var(--g);
  background:rgba(0,108,53,.06)}

/* Section head */
.sec-head{display:flex;align-items:baseline;gap:16px;margin:24px 0 20px}
.sec-head h2{font-size:26px;font-weight:800;padding-left:14px;border-left:4px solid var(--g);line-height:1}
.sec-head a{font-size:14px;color:var(--g);margin-left:auto}
.sec-head a:hover{text-decoration:underline}

/* Article grid */
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);
  gap:22px;margin-bottom:48px}

/* Featured card */
.feat-card{grid-column:1/-1;display:grid;grid-template-columns:1.1fr 1fr;
  background:var(--w);border-radius:var(--r);overflow:hidden;
  box-shadow:var(--sh);transition:transform .2s,box-shadow .2s;
  text-decoration:none;color:inherit}
.feat-card:hover{transform:translateY(-3px);
  box-shadow:0 6px 24px rgba(0,0,0,.12)}
.feat-card .ci{min-height:300px;overflow:hidden;background:#dde8dd}
.feat-card .ci img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.feat-card:hover .ci img{transform:scale(1.03)}
.feat-card .cb{padding:36px 40px;display:flex;flex-direction:column;
  justify-content:center}
.feat-card .cc{font-size:12px;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:var(--g);margin-bottom:12px}
.feat-card .ct{font-size:24px;font-weight:800;line-height:1.3;
  color:var(--t);margin-bottom:14px}
.feat-card .cd{font-size:15px;color:var(--tm);line-height:1.6;margin-bottom:22px}
.feat-card .cm{font-size:13px;color:var(--tl);margin-bottom:20px}
.rm-btn{display:inline-block;padding:10px 24px;background:var(--g);
  color:#fff!important;border-radius:5px;font-size:14px;font-weight:600;
  transition:background .15s;text-decoration:none!important;align-self:flex-start}
.rm-btn:hover{background:var(--gd)}

/* Article card */
.article-card{background:var(--w);border-radius:var(--r);overflow:hidden;
  box-shadow:var(--sh);transition:transform .2s,box-shadow .2s;
  display:flex;flex-direction:column;text-decoration:none;color:inherit}
.article-card:hover{transform:translateY(-3px);
  box-shadow:-3px 0 0 var(--cr),0 6px 24px rgba(0,0,0,.12)}
.ci{aspect-ratio:16/9;overflow:hidden;background:#dde8dd;flex-shrink:0}
.ci img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.article-card:hover .ci img{transform:scale(1.04)}
.ci-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.ci-ph span{font-size:12px;font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;color:rgba(255,255,255,.65)}
.cb{padding:18px 20px 22px;flex:1;display:flex;flex-direction:column}
.cc{font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.07em;color:var(--g);margin-bottom:8px}
.ct{font-size:16px;font-weight:700;line-height:1.4;color:var(--t);
  margin-bottom:8px;flex:1;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cd{font-size:13.5px;color:var(--tm);line-height:1.5;margin-bottom:12px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cm{font-size:12.5px;color:var(--tl)}

/* Article page */
.art-layout{max-width:760px;margin:0 auto;padding:36px 20px 80px}
.breadcrumb{font-size:13px;color:var(--tl);margin-bottom:24px;
  display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.breadcrumb a{color:var(--g)}
.breadcrumb a:hover{text-decoration:underline}
.art-badge{display:inline-block;font-size:11.5px;font-weight:700;
  text-transform:uppercase;letter-spacing:.09em;color:var(--g);
  background:rgba(0,108,53,.08);padding:4px 12px;border-radius:3px;
  margin-bottom:14px}
.art-title{font-size:clamp(24px,4vw,38px);font-weight:800;
  line-height:1.22;color:var(--t);margin-bottom:16px}
.art-meta{display:flex;align-items:center;gap:14px;font-size:14px;
  color:var(--tl);flex-wrap:wrap;padding-bottom:20px;
  border-bottom:2px solid var(--cr)}
.art-img{border-radius:var(--r);overflow:hidden;margin:28px 0 32px;
  aspect-ratio:16/9;background:#dde8dd}
.art-img img{width:100%;height:100%;object-fit:cover}
.art-body{font-size:17px;line-height:1.78;color:#262626}
.art-body h2{font-size:25px;font-weight:800;margin:38px 0 14px;line-height:1.3}
.art-body h3{font-size:20px;font-weight:700;margin:30px 0 12px}
.art-body h4{font-size:17px;font-weight:700;margin:22px 0 10px}
.art-body p{margin-bottom:20px}
.art-body ul,.art-body ol{margin:14px 0 20px 28px}
.art-body li{margin-bottom:9px}
.art-body blockquote{border-left:4px solid var(--g);padding:14px 22px;
  margin:24px 0;background:rgba(0,108,53,.04);color:var(--tm);
  font-style:italic;border-radius:0 4px 4px 0}
.art-body a{color:var(--g);text-decoration:underline}
.art-body a:hover{color:var(--cr)}
.art-body strong{font-weight:700}
.art-body em{font-style:italic}
.art-body table{width:100%;border-collapse:collapse;margin:24px 0;font-size:15px}
.art-body th{background:var(--g);color:#fff;padding:11px 16px;
  text-align:left;font-size:14px}
.art-body td{padding:10px 16px;border-bottom:1px solid var(--b);vertical-align:top}
.art-body tr:nth-child(even) td{background:rgba(0,0,0,.02)}
.art-body figure{margin:24px 0}
.art-body figure img,.art-body .wp-block-image img{
  border-radius:var(--r);width:100%}
.art-body figcaption{font-size:13px;color:var(--tl);
  text-align:center;margin-top:8px}

/* Related */
.rel-sec{margin-top:60px;padding-top:36px;border-top:2px solid var(--cr)}
.rel-sec h3{font-size:20px;font-weight:700;margin-bottom:22px}
.rel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}

/* Category page */
.cat-hero{background:linear-gradient(135deg,#004d25 0%,#006c35 100%);
  color:#fff;padding:52px 20px;margin-bottom:40px}
.cat-hero-inner{max-width:var(--mw);margin:0 auto}
.cat-hero h1{font-size:clamp(28px,4vw,42px);font-weight:800}
.cat-hero p{margin-top:10px;opacity:.85;font-size:17px}

/* Simple pages */
.simple-page{max-width:700px;margin:60px auto;padding:0 20px 80px}
.simple-page h1{font-size:36px;font-weight:800;margin-bottom:12px}
.simple-page .lead{color:var(--tm);font-size:18px;margin-bottom:36px}
.info-card{background:var(--w);border-radius:var(--r);
  padding:32px 36px;box-shadow:var(--sh)}
.info-card p{margin-bottom:16px;color:var(--t);line-height:1.7}
.info-card a{color:var(--g)}
.info-card a:hover{text-decoration:underline}
.info-card h3{font-size:18px;font-weight:700;margin:24px 0 10px}
.info-card ul{margin-left:22px}
.info-card li{margin-bottom:8px;color:var(--t)}

/* Footer */
.site-footer{background:#1a1a1a;color:#8aaa8a;
  padding:52px 20px 28px;margin-top:80px}
.footer-inner{max-width:var(--mw);margin:0 auto}
.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr;
  gap:48px;margin-bottom:40px}
.f-brand{font-size:19px;font-weight:800;color:#fff;margin-bottom:10px}
.f-tag{font-size:14px;line-height:1.65;max-width:280px}
.footer-col h4{color:#fff;font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:16px}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:10px}
.footer-col a{font-size:14px;color:#8aaa8a;transition:color .15s}
.footer-col a:hover{color:#fff}
.footer-bot{border-top:1px solid rgba(255,255,255,.08);padding-top:22px;
  display:flex;align-items:center;justify-content:space-between;
  font-size:13px;flex-wrap:wrap;gap:10px}
.footer-bot a{color:#8aaa8a;margin-left:16px}
.footer-bot a:hover{color:#fff}

/* Responsive */
@media(max-width:768px){
  .menu-btn{display:flex}
  .site-nav{display:none;position:absolute;top:64px;left:0;right:0;
    background:var(--w);border-bottom:1px solid var(--b);
    flex-direction:column;padding:12px 16px;gap:4px;
    box-shadow:0 4px 12px rgba(0,0,0,.1)}
  .site-nav.open{display:flex}
  .article-grid{grid-template-columns:1fr}
  .feat-card{grid-template-columns:1fr}
  .feat-card .ci{min-height:220px}
  .feat-card .cb{padding:24px 22px}
  .rel-grid{grid-template-columns:1fr 1fr}
  .footer-top{grid-template-columns:1fr;gap:28px}
  .footer-bot{flex-direction:column;text-align:center}
  .home-hero{padding:48px 20px}
  .home-hero-inner{flex-direction:column;gap:24px;text-align:center}
  .hero-stats{text-align:center}
  .hero-cta{margin:0 auto}
}
@media(min-width:769px) and (max-width:1024px){
  .article-grid{grid-template-columns:repeat(2,1fr)}
  .feat-card .cb{padding:28px 30px}
  .footer-top{grid-template-columns:1fr 1fr}
  .footer-top>*:first-child{grid-column:1/-1}
  .rel-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:480px){
  .rel-grid{grid-template-columns:1fr}
  .feat-card .ct{font-size:20px}
}


/* Hero two-column layout */
.hero-content{flex:1;max-width:580px;text-align:center}
.hero-cta{display:inline-block;padding:12px 28px;background:#fff;
  color:var(--g)!important;border-radius:5px;font-size:15px;font-weight:700;
  text-decoration:none!important;transition:opacity .15s,transform .15s;
  margin-top:4px}
.hero-cta:hover{opacity:.92;transform:translateY(-1px)}
.hero-stats{color:rgba(255,255,255,.7);font-size:13px;font-weight:500;
  white-space:nowrap;line-height:1.9;text-align:right;
  border-left:1px solid rgba(255,255,255,.2);padding-left:36px;
  flex-shrink:0}
.hero-stats strong{font-size:22px;font-weight:800;color:#fff;letter-spacing:-.3px}

/* ── Dark mode ─────────────────────────────────────── */
.theme-toggle{background:none;border:none;cursor:pointer;padding:8px;
  margin-left:4px;color:var(--t);display:flex;align-items:center;
  border-radius:5px;transition:background .15s}
.theme-toggle:hover{background:rgba(0,108,53,.08)}
html[data-theme=dark]{
  --g:#4caf7d;--gd:#2e8b57;--cr:#e84040;
  --t:#ddeade;--tm:#9aab9e;--tl:#637568;
  --bg:#0f1a12;--w:#182419;--b:#253b28;
  --sh:0 1px 3px rgba(0,0,0,.3),0 4px 12px rgba(0,0,0,.2)}
html[data-theme=dark] body{background:#0f1a12;color:#ddeade}
html[data-theme=dark] .site-header{border-bottom-color:#253b28}
html[data-theme=dark] .site-nav{background:#182419;border-bottom-color:#253b28}
html[data-theme=dark] .home-hero{background:linear-gradient(135deg,#001f0d 0%,#003319 55%,#004d25 100%)}
html[data-theme=dark] .site-footer{background:#0d0d0d}
html[data-theme=dark] .art-body{color:#b8c9bb}
html[data-theme=dark] .art-body a{color:#4caf7d}
html[data-theme=dark] .art-body a:hover{color:var(--cr)}
html[data-theme=dark] .art-body blockquote{background:rgba(76,175,125,.07);border-left-color:#4caf7d}
html[data-theme=dark] .art-body td{border-bottom-color:#253b28}
html[data-theme=dark] .art-body tr:nth-child(even) td{background:rgba(255,255,255,.03)}
html[data-theme=dark] .art-body th{background:#2e8b57}
html[data-theme=dark] .art-meta{border-bottom-color:#253b28}
html[data-theme=dark] .rel-sec{border-top-color:#253b28}
html[data-theme=dark] .sec-head h2,.art-title{color:inherit}
html[data-theme=dark] .art-title{color:#ddeade}
html[data-theme=dark] .cat-hero{background:linear-gradient(135deg,#001f0d 0%,#003319 100%)}
html[data-theme=dark] .info-card p,html[data-theme=dark] .info-card li{color:#9aab9e}
html[data-theme=dark] .simple-page h1{color:#ddeade}
html[data-theme=dark] .simple-page .lead{color:#9aab9e}
html[data-theme=dark] .breadcrumb{color:#637568}
html[data-theme=dark] .art-badge{background:rgba(76,175,125,.12)}
