/* Light theme: white ground, navy text. Loaded after styles.css. */
:root{
  color-scheme: light;
  --ink-950:#E9EEF5;
  --ink-900:#F6F8FB;
  --navy:#0B192C;
  --navy-700:#E3E9F1;
  --navy-600:#D5DEEA;
  --silver:#3E516B;
  --silver-2:#5B6B82;
  --white:#0B192C;
  --muted:#65758C;
  --ice:#2C5A94;
  --glass:rgba(255,255,255,.6);
  --glass-2:rgba(255,255,255,.85);
  --line:rgba(11,25,44,.1);
  --line-2:rgba(11,25,44,.18);
  --shadow:0 24px 60px -28px rgba(11,25,44,.28);
}
body{background:var(--ink-900);color:var(--navy)}
::selection{background:rgba(44,90,148,.18)}

.ambient{background:
  radial-gradient(60vw 50vw at 85% -10%, rgba(120,160,215,.28), transparent 60%),
  radial-gradient(50vw 40vw at -10% 40%, rgba(150,180,220,.2), transparent 60%),
  radial-gradient(60vw 60vw at 50% 120%, rgba(130,165,210,.22), transparent 60%),
  linear-gradient(180deg,#FFFFFF 0%,#F6F8FB 55%,#EEF2F7 100%)}
.ambient::after{opacity:.07;filter:invert(1)}

.glass{
  background:linear-gradient(160deg,rgba(255,255,255,.88),rgba(255,255,255,.55));
  border-color:rgba(11,25,44,.09);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), var(--shadow);
}

/* Buttons swap: navy fill with white text */
.btn-primary{background:linear-gradient(180deg,#16304F,#0B192C);color:#FFFFFF;
  box-shadow:0 12px 28px -12px rgba(11,25,44,.55), inset 0 1px 0 rgba(255,255,255,.12)}
.btn-primary:hover{box-shadow:0 18px 36px -14px rgba(11,25,44,.6)}
.btn-ghost{background:rgba(255,255,255,.7);border-color:rgba(11,25,44,.16);color:var(--navy)}
.btn-ghost:hover{background:#FFFFFF}

/* Header */
.nav-links a:hover,.nav-links a.active{background:rgba(11,25,44,.06);color:var(--navy)}
.lang{background:rgba(11,25,44,.05)}
.lang button[aria-pressed="true"]{background:var(--navy);color:#fff}
.menu-btn{background:rgba(255,255,255,.7);color:var(--navy)}
.mobile-menu a:hover{background:rgba(11,25,44,.05);color:var(--navy)}

/* Hero */
.hero h1{background:linear-gradient(180deg,#0B192C 35%,#35557F 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.tagline span+span::before{background:var(--ice)}
.hadith .ar{color:var(--navy)}
.hero-photo::after{background:linear-gradient(180deg,transparent 60%,rgba(11,25,44,.55) 100%)}
.hero-photo-wrap::before{background:linear-gradient(160deg,rgba(11,25,44,.25),rgba(11,25,44,.03) 40%,rgba(44,90,148,.25))}
.hero-badge{background:linear-gradient(160deg,rgba(255,255,255,.92),rgba(255,255,255,.75))}
.stats{background:rgba(11,25,44,.08)}
.stat{background:rgba(255,255,255,.78)}

/* Chips, cards */
.chip{background:rgba(255,255,255,.7)}
.branches span{background:rgba(11,25,44,.04)}
.gen.current{background:linear-gradient(160deg,rgba(44,90,148,.12),rgba(255,255,255,.7))}
.step .node{background:#FFFFFF;color:var(--ice)}
.step.now .node{background:var(--navy);color:#fff;box-shadow:0 0 0 6px rgba(44,90,148,.12)}
.step .tag{background:rgba(22,140,90,.1);color:#16704A;border-color:rgba(22,140,90,.25)}
.cred.top{background:linear-gradient(160deg,rgba(44,90,148,.14),rgba(255,255,255,.75));border-color:rgba(44,90,148,.3)}
.cred.top .flag{background:var(--navy);color:#fff}
.service .ico{background:rgba(44,90,148,.08);border-color:rgba(44,90,148,.2)}
.service:hover{background:linear-gradient(160deg,#FFFFFF,rgba(255,255,255,.8))}
.social:hover{background:#FFFFFF}

/* Text on photos keeps light-on-dark or dark-on-light panels */
.masjid-hero::after{background:linear-gradient(180deg,rgba(11,25,44,0) 40%,rgba(11,25,44,.45))}
.masjid-card{background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(255,255,255,.72))}
.video-card .vc-bar{background:rgba(11,25,44,.55);border-color:rgba(255,255,255,.18)}
.video-card .vc-bar span{color:#fff}
.icon-btn{background:rgba(11,25,44,.06);border-color:rgba(11,25,44,.16);color:var(--navy)}
.video-card .icon-btn{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.3);color:#fff}
.strip figcaption{background:rgba(255,255,255,.88)!important;color:var(--navy)}
.yt-feature{background:radial-gradient(120% 90% at 20% 10%,rgba(44,90,148,.2),transparent 60%),linear-gradient(160deg,#DCE5F0,#C7D3E3)}
.yt-feature .cap{background:linear-gradient(160deg,rgba(255,255,255,.92),rgba(255,255,255,.78))}
.play{background:var(--navy);color:#fff}
.vid:hover{background:rgba(11,25,44,.04)}
.vid .thumb{background:radial-gradient(100% 90% at 80% 0%,rgba(44,90,148,.2),transparent 60%),linear-gradient(160deg,#DCE5F0,#C9D5E4)}
.contact-side::after{background:linear-gradient(180deg,transparent 45%,rgba(246,248,251,.96))}
.email-row{background:rgba(255,255,255,.9)}
.lightbox{background:rgba(246,248,251,.94)}

/* Form */
.field input,.field textarea{background:#FFFFFF;color:var(--navy);border-color:rgba(11,25,44,.14)}
.field input::placeholder,.field textarea::placeholder{color:#8C99AB}
.field input:focus,.field textarea:focus{background:#FFFFFF;border-color:var(--ice)}
.topics label > span{background:#FFFFFF}
.topics input:checked + span{background:var(--navy);color:#fff;border-color:var(--navy)}
.form-note.ok{color:#16704A}
.form-note.err{color:#B3402D}

.foot nav a:hover{background:rgba(11,25,44,.05)}