/* ============================================================
   AMAADOR Stories — shared integration shell
   Unifies the embedded /jinn and /archive sections with the
   main site's emerald + gold identity on onyx, and adds the
   real AMAADOR STORIES top nav. Loaded AFTER each section CSS.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&display=swap');

/* ---- palette → Amaador Stories (emerald primary, gold secondary, onyx) ---- */
:root, body, body[data-accent] {
  --bg:#0c0d11 !important; --bg2:#08090b !important; --bg-2:#14151b !important; --bg-3:#1c1d25 !important;
  --panel:#14151b !important; --panel2:#1c1d25 !important; --panel3:#22232c !important;
  --card:#14151b !important;
  --line:rgba(238,233,225,.08) !important; --line2:rgba(238,233,225,.14) !important; --line3:rgba(238,233,225,.24) !important; --border:rgba(238,233,225,.08) !important;
  --txt:#f1ece2 !important; --text:#f1ece2 !important; --txt-2:#aaa49b !important; --txt-3:#726c63 !important; --mut:#aaa49b !important; --muted:#aaa49b !important; --dim:#726c63 !important;
  --gold:#36b083 !important; --gold2:#6fe0b0 !important; --gold-dim:rgba(54,176,131,.14) !important; --gold-light:#f0deb0 !important; --teal:#36b083 !important; --purple:#6fe0b0 !important;
  --warm:#d4ac5e !important; --warm2:#f0deb0 !important;
  --accent:#36b083 !important; --accent-soft:rgba(54,176,131,.14) !important; --accent-glow:rgba(54,176,131,.35) !important;
  --grad:linear-gradient(120deg,#6fe0b0,#36b083 46%,#1c7a58) !important;
  --grad-warm:linear-gradient(120deg,#f0deb0,#d4ac5e) !important;
  --serif:'Cormorant Garamond', Georgia, serif !important;
}
body { background:#0c0d11 !important; color:#f1ece2 !important; cursor: auto !important; }
::selection { background: rgba(54,176,131,.45) !important; color:#0c0d11 !important; }
/* restore a normal pointer on the embedded sections (drop their heavy custom cursors / progress rail) */
.cursor-dot, .cursor-glow, .cursor-ring, .progress-bar { display: none !important; }
* { cursor: inherit; }
.ama-bar a, .ama-donate, a, button { cursor: pointer !important; }

/* ---- neutralize each section's own fixed/sticky header + archive left rail ---- */
.site-head, header.site, header.site-head, #site-head { position: static !important; top:auto !important; left:0 !important; right:0 !important; }
.rail { display:none !important; }
main { margin-left:0 !important; margin-right:0 !important; }
html[dir="rtl"] main, body[dir="rtl"] main { margin-left:0 !important; margin-right:0 !important; }
/* their old fixed-header clearance padding is redundant now the header is in flow */
.hero .wrap { padding-top: 42px !important; }
.site-head, header.site { background: rgba(12,13,17,.6) !important; border-bottom: 1px solid rgba(238,233,225,.06) !important; }

/* ---- AMAADOR STORIES top bar ---- */
.ama-bar { position: sticky; top:0; z-index: 6000; background: rgba(12,13,17,.93); -webkit-backdrop-filter: blur(16px) saturate(120%); backdrop-filter: blur(16px) saturate(120%); border-bottom:1px solid rgba(54,176,131,.18); }
.ama-bar, .ama-bar * { cursor: pointer; }
.ama-bar-in { max-width:1180px; margin:0 auto; min-height:60px; display:flex; align-items:center; gap:20px; padding:0 24px; font-family:'Outfit','Inter',system-ui,sans-serif; direction:ltr; }
.ama-brand { display:inline-flex; gap:.42em; align-items:baseline; text-decoration:none; font-weight:700; letter-spacing:.14em; font-size:.86rem; white-space:nowrap; text-transform:uppercase; }
.ama-brand b { color:#f1ece2; font-weight:700; }
.ama-brand span { color:#36b083; font-weight:500; letter-spacing:.22em; }
.ama-nav { display:flex; gap:2px; flex:1; flex-wrap:wrap; align-items:center; }
.ama-nav a { position:relative; padding:10px 12px; color:#aaa49b; text-decoration:none; font-size:.72rem; font-weight:600; letter-spacing:.07em; text-transform:uppercase; transition:color .2s ease; white-space:nowrap; }
.ama-nav a:hover { color:#f1ece2; }
.ama-nav a::after { content:""; position:absolute; left:12px; bottom:5px; width:0; height:1.5px; background:#36b083; transition:width .3s ease; }
.ama-nav a:hover::after { width:18px; }
.ama-donate { flex:0 0 auto; display:inline-flex; align-items:center; min-height:38px; padding:0 18px; border-radius:999px; text-decoration:none; color:#0c0d11 !important; background:linear-gradient(120deg,#6fe0b0,#36b083 46%,#1c7a58); font-size:.7rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; box-shadow:0 4px 16px rgba(54,176,131,.24); transition:filter .2s ease; }
.ama-donate:hover { filter:brightness(1.08); }
@media (max-width: 820px) {
  .ama-bar-in { flex-wrap:wrap; min-height:0; padding:9px 16px; gap:8px; }
  .ama-nav { order:3; width:100%; gap:0; }
  .ama-nav a { padding:6px 9px 6px 0; }
  .ama-donate { margin-inline-start:auto; }
}

/* ---- native, blended AdSense placements (section pages) ----
   Invisible until a real unit mounts (slot set in js/ads-config.js → ads.js adds .is-live);
   then it renders inline, framed only by a hairline + faint "Sponsored" label. */
.editorial-ad { width:min(1180px, calc(100% - 40px)); margin:0 auto; }
.editorial-ad:not(.is-live) { display:none; }
.editorial-ad.is-live { padding-block:clamp(20px,3.4vw,34px); }
.editorial-ad__panel { border:0 !important; border-top:1px solid rgba(238,233,225,.10) !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }
.editorial-ad--subtle .editorial-ad__panel { border-top-color:transparent !important; }
.editorial-ad__chrome { display:flex; justify-content:center; gap:0; padding:10px 0 0; border:0; background:transparent; }
.editorial-ad__eyebrow { display:none; }
.editorial-ad__tag { margin:0 auto; padding:0; border:0; background:transparent; color:#aaa49b; font-size:.7rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; font-family:'Outfit','Inter',system-ui,sans-serif; }
.editorial-ad__frame { min-height:90px; padding:8px 0 0; background:transparent; }
.editorial-ad__unit { display:block; width:100%; }