/*
Theme Name: GWOE
Theme URI: https://www.gatewayofexcellence.sa/
Author: Gateway of Excellence
Author URI: https://www.gatewayofexcellence.sa/
Description: Dark luxury WordPress theme matching the main Gateway of Excellence website style.
Version: 1.0.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: gwoe
Tags: blog, news, rtl-language-support, custom-menu
*/

/* Theme-only polish/overrides (kept minimal; main site CSS is loaded separately) */
:root{
  --goe-brand-1:#00367D;
  --goe-brand-2:#6AA1CD;
  --goe-bg:#070b14;
  --goe-card:rgba(255,255,255,.06);
  --goe-border:rgba(255,255,255,.12);
  --goe-text:#eef5ff;
  --goe-muted:rgba(238,245,255,.74);
}

html{scroll-behavior:smooth}
body{direction:rtl;text-align:right;background:var(--goe-bg);color:var(--goe-text);}
a{color:inherit}
img{max-width:100%;height:auto;display:block}

.gwoe-container{max-width:1180px;margin:0 auto;padding:0 18px;}

/* iOS safe-area padding (prevents header items touching screen edges) */
:root{--gwoe-safe-l:max(18px, env(safe-area-inset-left));--gwoe-safe-r:max(18px, env(safe-area-inset-right));}
.gwoe-section{padding:36px 0;}
.gwoe-divider{height:1px;background:var(--goe-border);}

.gwoe-topbar-spacer{height:72px;} /* offset fixed header */

.gwoe-header{
  position:fixed;top:0;left:0;right:0;z-index:999;
  background:rgba(7,11,20,.35);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.gwoe-header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0;flex-direction: row;/* RTL: logo group right, nav left */}

/* Brand (logo + tiny text) — match main site: clean, compact */
.gwoe-brand{display:flex;align-items:center;gap:10px;flex-direction: row;/* RTL: logo group right, nav left */min-width:140px;}
.gwoe-logo-link{display:inline-flex;align-items:center;justify-content:center;}
.gwoe-logo{height:34px;width:auto;max-height:34px;object-fit:contain;filter:drop-shadow(0 6px 18px rgba(0,0,0,.25));}
.gwoe-brandtext{display:flex;flex-direction:column;gap:2px;line-height:1.1;white-space:nowrap;}
.gwoe-brandtext .title{font-weight:800;letter-spacing:.2px;}
.gwoe-brandtext .subtitle{font-size:12px;color:var(--goe-muted);max-width:240px;overflow:hidden;text-overflow:ellipsis;}

.gwoe-nav{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center}
.gwoe-nav a{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:var(--goe-text);
  padding:8px 12px;border-radius:999px;
  font-size:13px;line-height:1;
}
.gwoe-nav a:hover{background:rgba(255,255,255,.08)}
.gwoe-cta{
  border:1px solid rgba(106,161,205,.55)!important;
  background:linear-gradient(180deg, rgba(0,54,125,.95), rgba(0,54,125,.65))!important;
}
.gwoe-cta:hover{filter:brightness(1.05)}

.gwoe-hero{
  position:relative;
  padding:54px 0 28px;
  background:radial-gradient(1200px 600px at 70% 10%, rgba(106,161,205,.22), transparent 60%),
             radial-gradient(900px 480px at 20% 20%, rgba(0,54,125,.28), transparent 55%),
             linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,.55));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.gwoe-hero .kicker{display:inline-flex;gap:8px;align-items:center;padding:6px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);font-size:12px;color:var(--goe-muted)}
.gwoe-hero h1{margin:14px 0 8px;font-size:44px;line-height:1.05}
.gwoe-hero p{margin:0;color:var(--goe-muted);max-width:860px;font-size:16px;line-height:1.7}
.gwoe-hero .hero-actions{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:flex-start;flex-direction:row-reverse}
.gwoe-search{flex:1 1 320px;max-width:520px;display:flex;gap:8px;align-items:center;flex-direction:row-reverse}
.gwoe-search input{
  width:100%;padding:12px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);color:var(--goe-text);outline:none;
}
.gwoe-search input::placeholder{color:rgba(238,245,255,.55)}
.gwoe-btn{
  padding:12px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);color:var(--goe-text);cursor:pointer;display:inline-flex;align-items:center;gap:8px;
}
.gwoe-btn:hover{background:rgba(255,255,255,.09)}

.gwoe-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.gwoe-card{
  grid-column:span 4;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:18px;overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.gwoe-card .thumb{aspect-ratio:16/9;background:rgba(255,255,255,.03);overflow:hidden}
.gwoe-card .thumb img{width:100%;height:100%;object-fit:cover}
.gwoe-card .body{padding:14px 14px 12px}
.gwoe-card .meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center;color:rgba(238,245,255,.65);font-size:12px}
.gwoe-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.03)}
.gwoe-card h2{margin:10px 0 8px;font-size:18px;line-height:1.35}
.gwoe-card p{margin:0;color:rgba(238,245,255,.75);font-size:14px;line-height:1.75}
.gwoe-card .readmore{margin-top:12px;display:inline-flex;align-items:center;gap:8px;color:rgba(238,245,255,.9)}
.gwoe-card .readmore span{opacity:.7}

.gwoe-content{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  border-radius:18px;
  padding:18px;
  box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.gwoe-article-meta{color:rgba(238,245,255,.65);font-size:13px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.gwoe-article-thumb{border-radius:16px;overflow:hidden;margin:14px 0;border:1px solid rgba(255,255,255,.10)}
.gwoe-article-body{color:rgba(238,245,255,.85);line-height:1.9;font-size:16px}
.gwoe-article-body h2,.gwoe-article-body h3{margin-top:22px}
.gwoe-article-body a{color:rgba(106,161,205,.95);text-decoration:underline}

.gwoe-pagination{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.gwoe-pagination a,.gwoe-pagination span{
  padding:10px 12px;border-radius:12px;border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
}
.gwoe-pagination .current{background:rgba(106,161,205,.20);border-color:rgba(106,161,205,.45)}

.gwoe-footer{
  margin-top:34px;
  border-top:1px solid rgba(255,255,255,.10);
  padding:20px 0 36px;
  color:rgba(238,245,255,.70);
  font-size:13px;
}

@media (max-width: 980px){
  .gwoe-card{grid-column:span 6}
  .gwoe-hero h1{font-size:36px}
}
@media (max-width: 640px){
  .gwoe-topbar-spacer{height:78px}
  .gwoe-card{grid-column:span 12}
  .gwoe-hero h1{font-size:30px}
  .gwoe-brand{min-width:auto}
}

/* Mobile menu button (hidden on desktop) */
.gwoe-burger{
  display:none;
  align-items:center;justify-content:center;
  height:40px;min-width:44px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  color:#fff;
  font-size:20px;
  cursor:pointer;
}
.gwoe-burger:hover{background:rgba(255,255,255,.10);}




/* ===== Responsive header fixes (mobile) ===== */
@media (max-width: 768px){
  /* iPhone notch / safe-area + comfortable spacing */
  .gwoe-header .gwoe-container{padding-left:var(--gwoe-safe-l);padding-right:var(--gwoe-safe-r);} 
  .gwoe-header-inner{padding:10px 0;}
  /* keep the fixed header compact */
  .gwoe-brand{min-width:0;}
  .gwoe-brandtext{display:none;} /* prevents header from growing too tall */
  .gwoe-logo{height:28px;max-height:28px;}

  .gwoe-burger{display:inline-flex;}

  /* turn nav into a dropdown drawer */
  .gwoe-nav{
    position:fixed;
    top:64px; /* just under header */
    left:var(--gwoe-safe-l);
    right:var(--gwoe-safe-r);
    display:none;
    flex-direction:column;
    gap:10px;
    padding:16px;
    background:rgba(7,11,20,.90);
    -webkit-backdrop-filter: blur(14px) saturate(140%);
    backdrop-filter: blur(14px) saturate(140%);
    border:1px solid rgba(255,255,255,.12);
    border-radius:16px;
    box-shadow:0 18px 50px rgba(0,0,0,.45);
  }
  body.gwoe-nav-open .gwoe-nav{display:flex;}
  .gwoe-nav a{width:100%; text-align:right;}
}