/* ═══════════════════════════════════════════════════════════════════
   Aswati · Glass Night — site-wide skin (linked after site.css / page styles)
   One system: aurora ground · frosted panels with hairline edges ·
   gold spent once per view · brass mono eyebrows.
   ═══════════════════════════════════════════════════════════════════ */

/* ── tokens: retint everything that reads the vars ── */
:root{
  --ink:#111116;
  --ink-2:rgba(255,255,255,.045);
  --faint:rgba(255,255,255,.10);
  --faint-2:rgba(255,255,255,.06);
}

/* ── aurora ground ── */
body{
  background-color:#111116 !important;
  background-image:
    radial-gradient(1100px 520px at 30% -14%, rgba(212,175,55,.13), transparent 72%),
    radial-gradient(700px 380px at 92% 112%, rgba(127,184,164,.10), transparent 75%) !important;
  background-attachment:fixed !important;
}

/* ── floating pill nav (wraps the existing fixed bar's inner row) ── */
nav.fixed{background:transparent !important;border-bottom:none !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;padding:12px 16px 0;}
nav.fixed > div:not(#mobile-menu){
  background:rgba(255,255,255,.05);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.09);
  border-radius:999px;
  height:58px !important;
  padding-left:26px;padding-right:12px;
}
@media(max-width:767px){nav.fixed > div:not(#mobile-menu){height:54px !important;padding-left:20px;}}

/* mobile menu overlay: full-screen night glass, never the pill */
#mobile-menu{
  background:rgba(17,17,22,.97) !important;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  border:none !important;border-radius:0 !important;
  height:100vh !important;height:100dvh !important;
  padding:0 !important;
}

/* ── buttons: capsules; ghost goes glass ── */
.btn,[class*="rounded-[3px]"]{border-radius:999px !important;}
.btn-ghost{background:rgba(255,255,255,.05);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);}
.btn-ghost:hover{border-color:rgba(212,175,55,.5);}

/* ── panels & cards frost ── */
[class*="bg-[var(--ink)]"],
[class*="bg-[var(--faint)]"],
[class*="bg-[#0f0e10]"],
[class*="bg-[#111]"],
[class*="bg-[#121114]"],
[class*="bg-white/[0.015]"]{
  background:rgba(255,255,255,.045) !important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
[class*="border-[var(--faint)]"]{border-color:rgba(255,255,255,.10) !important;}

/* article answer boxes / callouts */
.answer,.answer-box,[class*="answer-box"]{
  background:linear-gradient(160deg, rgba(212,175,55,.07), rgba(255,255,255,.035)) !important;
  border:1px solid rgba(212,175,55,.28) !important;
  border-radius:16px !important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  padding:22px 26px !important;
}

/* email capture / inputs → glass capsules */
input[type="email"],input[type="text"],textarea{
  background:rgba(255,255,255,.05) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:999px !important;
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
textarea{border-radius:18px !important;}
input:focus,textarea:focus{border-color:rgba(212,175,55,.55) !important;outline:none;}

/* footer profiles: quiet text links, gold on hover (no boxes) */
#aswati-profiles a{background:none !important;border:none !important;border-radius:0 !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;padding:0 !important;}
#aswati-profiles a:hover{color:var(--gold) !important;}

/* mobile menu overlay */
#mobile-menu > div,[id="mobile-menu"]{backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);}
#mobile-menu [class*="bg-[#0b0b0c]"]{background:rgba(10,10,12,.9) !important;}

/* reading pages: dim the aurora so it never competes with text */
body.article,body[data-page="article"]{
  background-image:
    radial-gradient(1100px 520px at 30% -14%, rgba(212,175,55,.08), transparent 72%),
    radial-gradient(700px 380px at 92% 112%, rgba(127,184,164,.06), transparent 75%) !important;
}

@media (prefers-reduced-motion: reduce){
  *{background-attachment:scroll !important;}
}

/* bordered cards adopt the concept radius */
[class*="border-[var(--faint)]"][class*="rounded-md"],[class*="border-[var(--faint)]"][class*="rounded-lg"]{border-radius:16px !important;}

/* slim glass scrollbars */
*{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.16) transparent;}
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:999px;}
::-webkit-scrollbar-thumb:hover{background:rgba(212,175,55,.5);}

/* legibility: lightest text weight raised 300 -> 400 */
.font-light,[class*="font-light"]{font-weight:500 !important;}

/* one family: Manrope carries display + body (Arabic keeps Cairo/Noto) */
.serif,.display{font-family:'Manrope',sans-serif !important;letter-spacing:-.03em;}
html[dir="rtl"] .serif,html[dir="rtl"] .display,html[lang="ar"] .serif,html[lang="ar"] .display{font-family:'Cairo','Noto Sans Arabic',sans-serif !important;letter-spacing:0 !important;}

/* hairline grids (gap-px wrappers): keep seams, cells go dark glass instead of milky stacks */
[class*="gap-px"]{background:rgba(255,255,255,.09) !important;backdrop-filter:none !important;-webkit-backdrop-filter:none !important;}
[class*="gap-px"] > *{background:rgba(20,20,25,.88) !important;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}

/* air before every question heading */
h3.serif:not(:first-child){margin-top:1.6em;}

/* readable body: lightest text now 500, default paragraphs 500, muted lifted a step */
p,li{font-weight:500;}
:root{--muted:#a8a49b;}

/* wordmark matches the studio sidebar: heavy uppercase italic */
nav.fixed > div > a:first-child .serif{font-weight:800 !important;text-transform:uppercase;font-size:1.32rem !important;letter-spacing:-.02em !important;font-style:italic;}
nav.fixed > div > a:first-child .arabic{font-size:1.02rem !important;}

/* headings: Manrope on every page, whatever the page's embedded styles say */
h1,h2,h3,h4,h5,.serif,.display{font-family:'Manrope',sans-serif !important;}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] h4,html[lang="ar"] h5,
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3,html[dir="rtl"] h4,html[dir="rtl"] h5{font-family:'Cairo','Noto Sans Arabic',sans-serif !important;}