/*
 * AN Liquid Glass UI — v4.0.0
 * Apple Vision OS Spatial Glass System
 * ─────────────────────────────────────────────────────────
 *
 * VISION OS DESIGN PRINCIPLES:
 *  1. Spatial depth via shadow layering — NOT stacked blur
 *  2. ONE backdrop-filter max (nav bar only on desktop)
 *  3. Glass = tinted gradient + specular edge + deep shadow
 *  4. Elements float at measurable Z-heights above the scene
 *  5. Light source: top-centre at 45° — all shadows derive from it
 *
 * PERFORMANCE RULES:
 *  • No backdrop-filter on article cards or widgets
 *  • No will-change on static elements
 *  • No contain on any interactive parent
 *  • No overflow:hidden on articles
 *  • All transitions on transform/opacity/box-shadow only
 *
 * HEADING FIX:
 *  • color + -webkit-text-fill-color + fill on every heading selector
 *  • Maximum specificity: body.anlg h1, body.anlg .entry-title etc.
 *  • Covers WordPress block themes that use CSS custom properties
 * ─────────────────────────────────────────────────────────
 */

/* ══════════════════════════════════════════════════
   §0  DESIGN TOKENS
   ══════════════════════════════════════════════════ */
:root {
  /* Palette */
  --red:      #FF3B30;
  --red-glow: rgba(255,59,48,0.35);
  --red-dim:  rgba(255,59,48,0.14);

  --blue:      #0A84FF;
  --blue-glow: rgba(10,132,255,0.38);
  --blue-dim:  rgba(10,132,255,0.12);

  --green:      #30D158;
  --green-glow: rgba(48,209,88,0.35);
  --green-dim:  rgba(48,209,88,0.12);

  --w100: rgba(255,255,255,1.00);
  --w92:  rgba(255,255,255,0.92);
  --w72:  rgba(255,255,255,0.72);
  --w45:  rgba(255,255,255,0.45);
  --w22:  rgba(255,255,255,0.22);
  --w12:  rgba(255,255,255,0.12);
  --w08:  rgba(255,255,255,0.08);
  --w05:  rgba(255,255,255,0.05);

  /* Vision OS glass materials */
  --glass-float:  rgba(18,28,42,0.72);     /* primary floating panel */
  --glass-raised: rgba(22,34,52,0.78);     /* slightly elevated */
  --glass-deep:   rgba(8,14,24,0.88);      /* deeply inset */
  --glass-nav:    rgba(5,8,15,0.82);       /* navigation bar */
  --glass-toc:    rgba(10,18,32,0.70);     /* table of contents */

  /* Spatial shadow system — 3 layers simulate altitude */
  --shadow-z1:
    0 2px  6px  rgba(0,0,0,0.28),
    0 1px  2px  rgba(0,0,0,0.20);
  --shadow-z2:
    0 6px  18px rgba(0,0,0,0.38),
    0 2px  6px  rgba(0,0,0,0.24),
    0 0px  1px  rgba(0,0,0,0.18);
  --shadow-z3:
    0 14px 40px rgba(0,0,0,0.52),
    0 4px  12px rgba(0,0,0,0.30),
    0 1px  3px  rgba(0,0,0,0.20),
    inset 0 1px 0 rgba(255,255,255,0.14);  /* specular top */
  --shadow-z4:
    0 24px 64px rgba(0,0,0,0.65),
    0 8px  24px rgba(0,0,0,0.38),
    0 2px  6px  rgba(0,0,0,0.22),
    inset 0 1px 0 rgba(255,255,255,0.18);

  /* Borders */
  --b-subtle:  rgba(255,255,255,0.08);
  --b-base:    rgba(255,255,255,0.13);
  --b-raised:  rgba(255,255,255,0.18);
  --b-accent-red:   rgba(255,59,48,0.30);
  --b-accent-blue:  rgba(10,132,255,0.28);
  --b-accent-green: rgba(48,209,88,0.25);

  /* Radii */
  --r-xs:   6px;
  --r-sm:  10px;
  --r-md:  16px;
  --r-lg:  22px;
  --r-xl:  30px;
  --r-pill: 100px;

  /* Typography */
  --f-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --f-body:    'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --f-mono:    'SF Mono', 'JetBrains Mono', 'Fira Code', ui-monospace, monospace;

  /* Easing */
  --e-out:    cubic-bezier(0.22, 1.00, 0.36, 1.00);
  --e-spring: cubic-bezier(0.34, 1.56, 0.64, 1.00);
  --e-snap:   cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ══════════════════════════════════════════════════
   §1  SCENE BACKGROUND
   Vision OS: deep space, near-black with cool tint
   ══════════════════════════════════════════════════ */
html.anlg, html {
  scroll-behavior: smooth;
}

body.anlg {
  background-color: #05080f !important;
  background-image:
    /* Green orb — nature / growth */
    radial-gradient(ellipse 800px 650px at 5%  20%,  rgba(48,209,88,0.11)  0%, transparent 70%),
    /* Blue orb — sky / technology */
    radial-gradient(ellipse 700px 600px at 92% 12%,  rgba(10,132,255,0.13) 0%, transparent 70%),
    /* Red warmth — subtle heat at base */
    radial-gradient(ellipse 500px 400px at 48% 92%,  rgba(255,59,48,0.07)  0%, transparent 70%),
    /* Deep blue centre — Vision OS void */
    radial-gradient(ellipse 900px 700px at 50% 50%,  rgba(6,12,28,0.60)    0%, transparent 100%),
    linear-gradient(165deg, #040712 0%, #05080f 50%, #030a08 100%) !important;
  background-attachment: fixed !important;
  background-size: cover !important;
  color: var(--w92) !important;
  font-family: var(--f-body) !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  overflow-x: hidden !important;
  min-height: 100vh !important;
}

/* ══════════════════════════════════════════════════
   §2  NUCLEAR WHITE BACKGROUND RESET
   Every background → transparent. No exceptions.
   ══════════════════════════════════════════════════ */
body.anlg div, body.anlg section, body.anlg article,
body.anlg aside, body.anlg main,  body.anlg header,
body.anlg nav,  body.anlg ul,     body.anlg ol,
body.anlg li,   body.anlg span,   body.anlg p,
body.anlg form, body.anlg fieldset, body.anlg summary,
body.anlg details, body.anlg figure, body.anlg figcaption {
  background-color: transparent !important;
  background-image:  none !important;
}

/* Table elements — keep separate for overflow:hidden trick */
body.anlg table, body.anlg thead, body.anlg tbody,
body.anlg tfoot, body.anlg tr, body.anlg td, body.anlg th {
  background-color: transparent !important;
}

/* Inline style attribute — catch page builders */
body.anlg [style*="background:#fff"],
body.anlg [style*="background: #fff"],
body.anlg [style*="background:#FFF"],
body.anlg [style*="background:#ffffff"],
body.anlg [style*="background:#FFFFFF"],
body.anlg [style*="background:white"],
body.anlg [style*="background: white"],
body.anlg [style*="background-color:#fff"],
body.anlg [style*="background-color: #fff"],
body.anlg [style*="background-color:#ffffff"],
body.anlg [style*="background-color:white"],
body.anlg [style*="background-color: white"],
body.anlg [style*="background-color:#fafafa"],
body.anlg [style*="background-color:#f9f9f9"],
body.anlg [style*="background-color:#f5f5f5"],
body.anlg [style*="background-color:#f0f0f0"],
body.anlg [style*="background-color:rgb(255, 255, 255)"],
body.anlg [style*="background-color:rgb(255,255,255)"] {
  background-color: var(--glass-float) !important;
  background-image: none !important;
}

/* Dark inline text → white */
body.anlg [style*="color:#000"],
body.anlg [style*="color: #000"],
body.anlg [style*="color:#000000"],
body.anlg [style*="color:black"],
body.anlg [style*="color: black"],
body.anlg [style*="color:#1"],
body.anlg [style*="color:#2"],
body.anlg [style*="color:#333"],
body.anlg [style*="color:#444"],
body.anlg [style*="color:#555"] {
  color: var(--w92) !important;
  -webkit-text-fill-color: var(--w92) !important;
}

/* WordPress block theme CSS custom properties override */
body.anlg { --wp--preset--color--black: rgba(255,255,255,0.92) !important; }
body.anlg { --wp--preset--color--white: rgba(255,255,255,0.92) !important; }

/* ══════════════════════════════════════════════════
   §3  NAVIGATION
   ONE backdrop-filter. Sticky vision OS bar.
   ══════════════════════════════════════════════════ */
body.anlg .site-header,
body.anlg header.site-header,
body.anlg #masthead,
body.anlg #header,
body.anlg .main-header,
body.anlg .header-inner {
  background: var(--glass-nav) !important;
  backdrop-filter: blur(40px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(200%) !important;
  border-bottom: 1px solid var(--b-base) !important;
  box-shadow: var(--shadow-z2) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  transition: background 0.30s var(--e-snap), box-shadow 0.30s var(--e-snap) !important;
}

body.anlg .site-header.anlg-scrolled,
body.anlg #masthead.anlg-scrolled {
  background: rgba(3,5,10,0.92) !important;
  box-shadow: var(--shadow-z3) !important;
}

/* Site title */
body.anlg .site-title,
body.anlg .site-title a,
body.anlg .site-branding a,
body.anlg .custom-logo-link,
body.anlg .logo a {
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
  font-family: var(--f-display) !important;
  font-style: italic !important;
  font-weight: 700 !important;
  text-shadow: 0 0 20px var(--green-glow) !important;
}

/* Nav links */
body.anlg .main-navigation a,
body.anlg .nav-menu a,
body.anlg #site-navigation a,
body.anlg .menu a,
body.anlg nav.navigation a {
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
  font-family: var(--f-body) !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  letter-spacing: 0.01em !important;
  padding: 6px 12px !important;
  border-radius: var(--r-xs) !important;
  display: inline-block !important;
  transition: color 0.15s var(--e-snap), background 0.15s var(--e-snap) !important;
}
body.anlg .main-navigation a:hover,
body.anlg nav.navigation a:hover {
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
  background: var(--w08) !important;
}
body.anlg .current-menu-item > a,
body.anlg .current_page_item > a {
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  background: var(--green-dim) !important;
}

/* Dropdown sub-menus */
body.anlg .sub-menu {
  background: rgba(4,7,16,0.96) !important;
  border: 1px solid var(--b-base) !important;
  border-radius: var(--r-sm) !important;
  box-shadow: var(--shadow-z4) !important;
  padding: 6px !important;
}
body.anlg .sub-menu a {
  border-radius: var(--r-xs) !important;
  display: block !important;
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
}
body.anlg .sub-menu a:hover {
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
  background: var(--w08) !important;
}

/* ══════════════════════════════════════════════════
   §4  HEADING COLOUR SYSTEM
   Maximum specificity + -webkit-text-fill-color
   Covers: Astra, GeneratePress, OceanWP, Kadence,
           Twenty Twenty-Four, Elementor, block themes
   ══════════════════════════════════════════════════ */

/*
 * IMPORTANT: All heading rules use BOTH color AND
 * -webkit-text-fill-color because some themes set
 * -webkit-text-fill-color explicitly, which takes
 * precedence over color alone.
 */

/* ── H1: RED ─────────────────────────────────── */
body.anlg h1,
body.anlg h1.entry-title,
body.anlg .entry-title,
body.anlg .page-title,
body.anlg .post-title,
body.anlg .hero-title,
body.anlg .wp-block-post-title,
body.anlg .wp-block-heading.is-style-h1,
body.anlg article h1,
body.anlg .hentry h1,
body.anlg main h1,
body.anlg #primary h1,
body.anlg .site-content h1 {
  color: var(--red) !important;
  -webkit-text-fill-color: var(--red) !important;
  font-family: var(--f-display) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  letter-spacing: -0.025em !important;
  line-height: 1.14 !important;
  text-shadow:
    0 0 60px var(--red-glow),
    0 2px 14px rgba(0,0,0,0.65) !important;
}

/* H1 links — must stay red */
body.anlg h1 a,
body.anlg .entry-title a,
body.anlg .entry-title a:link,
body.anlg .entry-title a:visited,
body.anlg .post-title a {
  color: var(--red) !important;
  -webkit-text-fill-color: var(--red) !important;
  text-shadow: 0 0 44px var(--red-glow) !important;
}
body.anlg h1 a:hover,
body.anlg .entry-title a:hover {
  color: #FF6961 !important;
  -webkit-text-fill-color: #FF6961 !important;
}

/* ── H2: BLUE ────────────────────────────────── */
body.anlg h2,
body.anlg article h2,
body.anlg .entry-content h2,
body.anlg .post-content h2,
body.anlg .hentry h2,
body.anlg main h2,
body.anlg #primary h2,
body.anlg .wp-block-heading:is(h2),
body.anlg .site-content h2 {
  color: var(--blue) !important;
  -webkit-text-fill-color: var(--blue) !important;
  font-family: var(--f-display) !important;
  font-weight: 600 !important;
  letter-spacing: -0.018em !important;
  line-height: 1.22 !important;
  text-shadow:
    0 0 44px var(--blue-glow),
    0 2px 10px rgba(0,0,0,0.55) !important;
}

/* ── H3: GREEN ───────────────────────────────── */
body.anlg h3,
body.anlg article h3,
body.anlg .entry-content h3,
body.anlg .post-content h3,
body.anlg .hentry h3,
body.anlg main h3,
body.anlg #primary h3,
body.anlg .wp-block-heading:is(h3),
body.anlg .site-content h3 {
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  font-family: var(--f-body) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
  text-shadow:
    0 0 32px var(--green-glow),
    0 1px 8px rgba(0,0,0,0.50) !important;
}

/* ── H4: Bright white ────────────────────────── */
body.anlg h4,
body.anlg article h4,
body.anlg .entry-content h4 {
  color: rgba(255,255,255,0.93) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.93) !important;
  font-family: var(--f-body) !important;
  font-weight: 600 !important;
}

/* ── H5, H6: Soft white ──────────────────────── */
body.anlg h5, body.anlg h6 {
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
  font-family: var(--f-body) !important;
  font-weight: 500 !important;
}

/* ══════════════════════════════════════════════════
   §5  BODY TEXT & GENERAL
   ══════════════════════════════════════════════════ */
body.anlg p,
body.anlg .entry-content p,
body.anlg article p,
body.anlg .post-content p {
  color: var(--w92) !important;
  -webkit-text-fill-color: var(--w92) !important;
  font-family: var(--f-body) !important;
  font-size: 1.04rem !important;
  font-weight: 400 !important;
  line-height: 1.90 !important;
  letter-spacing: 0.003em !important;
}

body.anlg li,
body.anlg .entry-content li,
body.anlg article li {
  color: var(--w92) !important;
  -webkit-text-fill-color: var(--w92) !important;
  font-family: var(--f-body) !important;
  line-height: 1.80 !important;
}

body.anlg .entry-content ul li::marker { color: var(--green) !important; }
body.anlg .entry-content ol li::marker { color: var(--blue) !important; }

body.anlg td,
body.anlg th {
  color: var(--w92) !important;
  -webkit-text-fill-color: var(--w92) !important;
}

body.anlg span {
  color: inherit !important;
}

/* Widget titles */
body.anlg .widget-title,
body.anlg .widgettitle,
body.anlg .widget h2,
body.anlg .widget h3,
body.anlg .sidebar h2,
body.anlg .sidebar h3 {
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  font-family: var(--f-body) !important;
  font-weight: 700 !important;
  font-size: 0.70rem !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  border-bottom: 1px solid var(--b-accent-green) !important;
  padding-bottom: 10px !important;
  margin-bottom: 14px !important;
}

/* ══════════════════════════════════════════════════
   §6  LINKS
   ══════════════════════════════════════════════════ */
body.anlg a,
body.anlg a:link,
body.anlg a:visited {
  color: var(--blue) !important;
  -webkit-text-fill-color: var(--blue) !important;
  text-decoration: none !important;
  transition: color 0.15s var(--e-snap), text-shadow 0.15s var(--e-snap) !important;
}
body.anlg a:hover {
  color: #5AC8FF !important;
  -webkit-text-fill-color: #5AC8FF !important;
  text-shadow: 0 0 18px var(--blue-glow) !important;
}

/* ══════════════════════════════════════════════════
   §7  VISION OS ARTICLE CARDS
   Depth via shadow system, NOT backdrop-filter.
   This is how Vision OS achieves float — real shadows,
   not blurred glass. No overflow:hidden, no contain.
   ══════════════════════════════════════════════════ */
body.anlg article.post,
body.anlg article.page,
body.anlg .hentry,
body.anlg .type-post,
body.anlg .type-page {
  background: var(--glass-float) !important;
  border: 1px solid var(--b-subtle) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-z3) !important;
  margin-bottom: 28px !important;
  position: relative !important;
  /* Specular edge highlight via border gradient trick */
  background-clip: padding-box !important;
}

/* Top specular highlight — glass refraction */
body.anlg article.post::after,
body.anlg .hentry::after {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 6% !important; right: 6% !important;
  height: 1px !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,0.30) 20%,
    rgba(255,255,255,0.48) 50%,
    rgba(255,255,255,0.30) 80%,
    transparent 100%
  ) !important;
  pointer-events: none !important;
}

/* Bottom depth edge — subtle */
body.anlg article.post::before,
body.anlg .hentry::before {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important; left: 10% !important; right: 10% !important;
  height: 1px !important;
  background: rgba(0,0,0,0.40) !important;
  pointer-events: none !important;
}

/* Hover — lift to Z4 */
body.anlg .archive .hentry:hover,
body.anlg .blog .hentry:hover,
body.anlg .home .hentry:hover {
  box-shadow: var(--shadow-z4) !important;
  border-color: var(--b-accent-green) !important;
  transform: translateY(-5px) !important;
  transition: transform 0.32s var(--e-spring),
              box-shadow 0.32s var(--e-out),
              border-color 0.20s var(--e-snap) !important;
}

/* Single post — slightly brighter surface */
body.anlg.anlg-single article.post,
body.anlg.anlg-single .hentry {
  background: var(--glass-raised) !important;
}

/* ══════════════════════════════════════════════════
   §8  SEARCH — Fully fixed
   -webkit-text-fill-color prevents browser overrides
   ══════════════════════════════════════════════════ */
body.anlg input[type="search"],
body.anlg input[type="text"],
body.anlg input[type="email"],
body.anlg input[type="url"],
body.anlg input[type="tel"],
body.anlg input[type="number"],
body.anlg input[type="password"],
body.anlg textarea,
body.anlg select {
  background: rgba(255,255,255,0.07) !important;
  border: 1px solid var(--b-base) !important;
  border-radius: var(--r-pill) !important;
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
  font-family: var(--f-body) !important;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  padding: 10px 18px !important;
  outline: none !important;
  caret-color: var(--green) !important;
  transition: border-color 0.15s var(--e-snap), box-shadow 0.15s var(--e-snap) !important;
  box-shadow: var(--shadow-z1) !important;
}
body.anlg textarea { border-radius: var(--r-sm) !important; }

body.anlg input::placeholder,
body.anlg textarea::placeholder {
  color: var(--w45) !important;
  -webkit-text-fill-color: var(--w45) !important;
}
body.anlg input:focus,
body.anlg textarea:focus {
  border-color: var(--blue) !important;
  background: rgba(255,255,255,0.10) !important;
  box-shadow: 0 0 0 3px rgba(10,132,255,0.15), var(--shadow-z1) !important;
}

/* Fight browser autofill yellow */
body.anlg input:-webkit-autofill,
body.anlg input:-webkit-autofill:hover,
body.anlg input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 9999px rgba(5,10,22,0.97) inset !important;
  -webkit-text-fill-color: var(--w100) !important;
  caret-color: var(--green) !important;
}

/* Submit / Search button */
body.anlg input[type="submit"],
body.anlg button[type="submit"],
body.anlg .search-submit {
  background: rgba(10,132,255,0.16) !important;
  border: 1px solid rgba(10,132,255,0.32) !important;
  border-radius: var(--r-pill) !important;
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
  font-family: var(--f-body) !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
  padding: 10px 22px !important;
  cursor: pointer !important;
  box-shadow: var(--shadow-z1) !important;
  transition: background 0.15s var(--e-snap), box-shadow 0.15s var(--e-snap), transform 0.12s var(--e-snap) !important;
}
body.anlg input[type="submit"]:hover,
body.anlg .search-submit:hover {
  background: rgba(10,132,255,0.28) !important;
  box-shadow: 0 4px 18px var(--blue-glow) !important;
  transform: translateY(-1px) !important;
}
body.anlg input[type="submit"]:active {
  transform: translateY(0) !important;
}

/* Generic buttons */
body.anlg button,
body.anlg .button,
body.anlg a.button,
body.anlg .btn,
body.anlg .more-link,
body.anlg .read-more,
body.anlg .wp-block-button__link {
  background: var(--w08) !important;
  border: 1px solid var(--b-base) !important;
  border-radius: var(--r-pill) !important;
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
  font-family: var(--f-body) !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  padding: 9px 22px !important;
  cursor: pointer !important;
  display: inline-block !important;
  box-shadow: var(--shadow-z1) !important;
  transition: background 0.15s var(--e-snap), box-shadow 0.15s var(--e-snap) !important;
}
body.anlg .button:hover,
body.anlg .more-link:hover {
  background: var(--w12) !important;
  box-shadow: var(--shadow-z2) !important;
}

/* ══════════════════════════════════════════════════
   §9  TABLE OF CONTENTS
   Vision OS panel — raised with inner glow
   ══════════════════════════════════════════════════ */
body.anlg #ez-toc-container,
body.anlg .ez-toc-container,
body.anlg nav.ez-toc-sticky-fixed,
body.anlg .ez-toc-sticky,
body.anlg #ez-toc-sticky-container,
body.anlg .table-of-contents,
body.anlg .rank-math-toc,
body.anlg .luckywp-toc,
body.anlg [class*="toc-container"] {
  background: var(--glass-toc) !important;
  border: 1px solid var(--b-accent-blue) !important;
  border-radius: var(--r-md) !important;
  padding: 20px 22px !important;
  margin: 24px 0 !important;
  box-shadow: var(--shadow-z2),
              inset 0 0 30px rgba(10,132,255,0.04) !important;
  position: relative !important;
}
/* Inner glow */
body.anlg #ez-toc-container::before,
body.anlg .table-of-contents::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important;
  right: 0 !important; bottom: 0 !important;
  border-radius: inherit !important;
  background: radial-gradient(ellipse 60% 40% at 80% 0%, rgba(10,132,255,0.08) 0%, transparent 70%) !important;
  pointer-events: none !important;
}

/* TOC title */
body.anlg .ez-toc-title,
body.anlg #ez-toc-container p.ez-toc-title,
body.anlg .table-of-contents .title,
body.anlg .rank-math-toc h5 {
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  font-family: var(--f-body) !important;
  font-weight: 700 !important;
  font-size: 0.70rem !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
}

/* TOC links */
body.anlg #ez-toc-container ul,
body.anlg .ez-toc-list,
body.anlg .toc-list {
  background: transparent !important;
  list-style: none !important;
  padding-left: 0 !important;
}
body.anlg #ez-toc-container ul li a,
body.anlg .ez-toc-list a,
body.anlg .toc-list a,
body.anlg .luckywp-toc a {
  color: rgba(90,200,255,0.88) !important;
  -webkit-text-fill-color: rgba(90,200,255,0.88) !important;
  font-size: 0.875rem !important;
  line-height: 1.65 !important;
  display: block !important;
  padding: 2px 0 !important;
  transition: color 0.12s var(--e-snap) !important;
}
body.anlg #ez-toc-container ul li a:hover,
body.anlg .ez-toc-list a:hover {
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
  text-shadow: 0 0 14px var(--blue-glow) !important;
}

/* Nested TOC */
body.anlg #ez-toc-container ul ul,
body.anlg .ez-toc-list ul {
  padding-left: 14px !important;
  border-left: 1px solid rgba(10,132,255,0.16) !important;
  margin: 3px 0 3px 8px !important;
}

/* ══════════════════════════════════════════════════
   §10  BLOCKQUOTES & CALLOUTS
   ══════════════════════════════════════════════════ */
body.anlg blockquote,
body.anlg .wp-block-quote {
  background: var(--blue-dim) !important;
  border: none !important;
  border-left: 3px solid var(--blue) !important;
  border-radius: 0 var(--r-sm) var(--r-sm) 0 !important;
  padding: 18px 22px !important;
  margin: 24px 0 !important;
  box-shadow: var(--shadow-z1) !important;
}
body.anlg blockquote p {
  color: var(--w92) !important;
  -webkit-text-fill-color: var(--w92) !important;
  font-style: italic !important;
  font-family: var(--f-display) !important;
  font-size: 1.06rem !important;
  line-height: 1.75 !important;
}
body.anlg blockquote cite {
  color: var(--w45) !important;
  -webkit-text-fill-color: var(--w45) !important;
  font-size: 0.82rem !important;
  font-style: normal !important;
}

body.anlg .wp-block-pullquote {
  background: var(--red-dim) !important;
  border-top: 2px solid var(--red) !important;
  border-bottom: 2px solid var(--red) !important;
  border-left: none !important;
  border-radius: var(--r-xs) !important;
  padding: 24px 22px !important;
}
body.anlg .wp-block-pullquote p {
  color: #FF6961 !important;
  -webkit-text-fill-color: #FF6961 !important;
  font-family: var(--f-display) !important;
  font-style: italic !important;
}

/* ══════════════════════════════════════════════════
   §11  CODE
   ══════════════════════════════════════════════════ */
body.anlg pre,
body.anlg .wp-block-code {
  background: rgba(0,0,0,0.58) !important;
  border: 1px solid var(--b-subtle) !important;
  border-radius: var(--r-sm) !important;
  padding: 20px !important;
  overflow-x: auto !important;
  box-shadow: var(--shadow-z1) !important;
}
body.anlg pre code,
body.anlg .wp-block-code code {
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  font-family: var(--f-mono) !important;
  font-size: 0.875rem !important;
  line-height: 1.70 !important;
  background: transparent !important;
  border: none !important;
}
body.anlg p code,
body.anlg li code {
  background: rgba(48,209,88,0.09) !important;
  color: #7EE8A2 !important;
  -webkit-text-fill-color: #7EE8A2 !important;
  border: 1px solid rgba(48,209,88,0.16) !important;
  border-radius: 4px !important;
  padding: 1px 6px !important;
  font-family: var(--f-mono) !important;
  font-size: 0.875em !important;
}

/* ══════════════════════════════════════════════════
   §12  TABLES
   ══════════════════════════════════════════════════ */
body.anlg table {
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  background: var(--glass-deep) !important;
  border: 1px solid var(--b-subtle) !important;
  border-radius: var(--r-sm) !important;
  overflow: hidden !important;
  box-shadow: var(--shadow-z1) !important;
  margin: 20px 0 !important;
}
body.anlg thead th {
  background: rgba(48,209,88,0.09) !important;
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  font-weight: 700 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  padding: 11px 15px !important;
  border-bottom: 1px solid var(--b-accent-green) !important;
}
body.anlg tbody td {
  padding: 10px 15px !important;
  color: var(--w92) !important;
  -webkit-text-fill-color: var(--w92) !important;
  border-bottom: 1px solid var(--b-subtle) !important;
  font-size: 0.925rem !important;
}
body.anlg tbody tr:last-child td { border-bottom: none !important; }
body.anlg tbody tr:nth-child(even) { background: rgba(255,255,255,0.02) !important; }

/* ══════════════════════════════════════════════════
   §13  IMAGES
   ══════════════════════════════════════════════════ */
body.anlg .entry-content img,
body.anlg article img,
body.anlg .wp-post-image {
  border-radius: var(--r-sm) !important;
  border: 1px solid var(--b-subtle) !important;
  box-shadow: var(--shadow-z2) !important;
  max-width: 100% !important;
  height: auto !important;
}
body.anlg .post-thumbnail img,
body.anlg .featured-image img {
  border-radius: var(--r-md) var(--r-md) 0 0 !important;
  box-shadow: none !important;
}

/* ══════════════════════════════════════════════════
   §14  TAXONOMY — Categories & Tags
   ══════════════════════════════════════════════════ */
body.anlg .cat-links a,
body.anlg .post-categories a,
body.anlg a[rel="category tag"] {
  background: var(--green-dim) !important;
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  border: 1px solid var(--b-accent-green) !important;
  border-radius: var(--r-pill) !important;
  padding: 2px 11px !important;
  font-size: 0.70rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
}
body.anlg .tags-links a,
body.anlg a[rel="tag"],
body.anlg .post-tags a {
  background: var(--blue-dim) !important;
  color: #5AC8FF !important;
  -webkit-text-fill-color: #5AC8FF !important;
  border: 1px solid var(--b-accent-blue) !important;
  border-radius: var(--r-xs) !important;
  padding: 2px 8px !important;
  font-size: 0.75rem !important;
  display: inline-block !important;
  margin: 2px !important;
}
body.anlg .entry-meta * { color: var(--w45) !important; font-size: 0.82rem !important; }
body.anlg .entry-meta a { color: var(--w72) !important; -webkit-text-fill-color: var(--w72) !important; }
body.anlg .entry-meta a:hover { color: var(--green) !important; -webkit-text-fill-color: var(--green) !important; }

/* ══════════════════════════════════════════════════
   §15  SIDEBAR & WIDGETS
   ══════════════════════════════════════════════════ */
body.anlg #secondary, body.anlg .widget-area, body.anlg .sidebar {
  background: transparent !important;
}
body.anlg .widget {
  background: var(--glass-float) !important;
  border: 1px solid var(--b-subtle) !important;
  border-radius: var(--r-md) !important;
  box-shadow: var(--shadow-z2) !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
  position: relative !important;
}
body.anlg .widget li {
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
}
body.anlg .widget p {
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
}
body.anlg .widget a {
  color: #5AC8FF !important;
  -webkit-text-fill-color: #5AC8FF !important;
}
body.anlg .widget a:hover {
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
}

/* ══════════════════════════════════════════════════
   §16  AUTHOR BOX
   ══════════════════════════════════════════════════ */
body.anlg .author-box,
body.anlg .author-card,
body.anlg .about-author,
body.anlg .post-author-box,
body.anlg [class*="author-bio"] {
  background: rgba(48,209,88,0.05) !important;
  border: 1px solid var(--b-accent-green) !important;
  border-radius: var(--r-lg) !important;
  box-shadow: var(--shadow-z2) !important;
  padding: 22px !important;
  margin-top: 28px !important;
}
body.anlg .author-box h3,
body.anlg .author-name {
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
}
body.anlg .author-box p {
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
}

/* ══════════════════════════════════════════════════
   §17  FOOTER
   ══════════════════════════════════════════════════ */
body.anlg .site-footer,
body.anlg #colophon,
body.anlg footer.site-footer {
  background: rgba(2,5,10,0.90) !important;
  border-top: 1px solid var(--b-subtle) !important;
  box-shadow: 0 -4px 20px rgba(0,0,0,0.30) !important;
}
body.anlg .site-footer * { color: var(--w45) !important; -webkit-text-fill-color: var(--w45) !important; }
body.anlg .site-footer a { color: var(--w72) !important; -webkit-text-fill-color: var(--w72) !important; }
body.anlg .site-footer a:hover { color: var(--green) !important; -webkit-text-fill-color: var(--green) !important; }

/* ══════════════════════════════════════════════════
   §18  COMMENTS
   ══════════════════════════════════════════════════ */
body.anlg .comments-title,
body.anlg #reply-title {
  color: var(--blue) !important;
  -webkit-text-fill-color: var(--blue) !important;
  font-family: var(--f-display) !important;
}
body.anlg .comment-body {
  background: var(--w05) !important;
  border: 1px solid var(--b-subtle) !important;
  border-radius: var(--r-sm) !important;
  padding: 16px !important;
  margin-bottom: 14px !important;
  box-shadow: var(--shadow-z1) !important;
}
body.anlg .comment-content p {
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
}
body.anlg .comment-author .fn,
body.anlg .comment-author .fn a {
  color: var(--green) !important;
  -webkit-text-fill-color: var(--green) !important;
  font-weight: 600 !important;
}
body.anlg .comment-metadata { color: var(--w45) !important; font-size: 0.78rem !important; }
body.anlg #respond {
  background: var(--w05) !important;
  border: 1px solid var(--b-subtle) !important;
  border-radius: var(--r-md) !important;
  padding: 24px !important;
  margin-top: 24px !important;
  box-shadow: var(--shadow-z1) !important;
}

/* ══════════════════════════════════════════════════
   §19  BREADCRUMBS & PAGINATION
   ══════════════════════════════════════════════════ */
body.anlg .yoast-breadcrumb *,
body.anlg .breadcrumbs *,
body.anlg .breadcrumb * {
  color: var(--w45) !important;
  -webkit-text-fill-color: var(--w45) !important;
  font-size: 0.80rem !important;
}
body.anlg .yoast-breadcrumb a { color: var(--w72) !important; -webkit-text-fill-color: var(--w72) !important; }
body.anlg .yoast-breadcrumb a:hover { color: var(--green) !important; -webkit-text-fill-color: var(--green) !important; }

body.anlg .page-numbers {
  background: var(--w08) !important;
  color: var(--w72) !important;
  -webkit-text-fill-color: var(--w72) !important;
  border: 1px solid var(--b-subtle) !important;
  border-radius: var(--r-xs) !important;
  padding: 6px 13px !important;
  display: inline-block !important;
  margin: 2px !important;
  transition: background 0.15s var(--e-snap) !important;
}
body.anlg .page-numbers.current {
  background: rgba(10,132,255,0.20) !important;
  border-color: var(--b-accent-blue) !important;
  color: #5AC8FF !important;
  -webkit-text-fill-color: #5AC8FF !important;
}
body.anlg .page-numbers:hover {
  background: var(--w12) !important;
  color: var(--w100) !important;
  -webkit-text-fill-color: var(--w100) !important;
}

/* ══════════════════════════════════════════════════
   §20  THEME OVERRIDES
   ══════════════════════════════════════════════════ */
body.anlg .inside-article,
body.anlg .inside-page-hero,
body.anlg .ast-container,
body.anlg .ast-article-single,
body.anlg .generate-columns-container,
body.anlg .inside-header-image,
body.anlg .wp-block-template-part,
body.anlg .wp-block-post-content,
body.anlg .is-layout-flow,
body.anlg .is-layout-constrained,
body.anlg .elementor-section,
body.anlg .elementor-container,
body.anlg .elementor-column-wrap,
body.anlg .elementor-widget-wrap,
body.anlg .vc_row, body.anlg .vc_column-inner,
body.anlg .wp-site-blocks,
body.anlg .entry {
  background: transparent !important;
}

/* ══════════════════════════════════════════════════
   §21  SCROLLBAR & SELECTION
   ══════════════════════════════════════════════════ */
body.anlg ::-webkit-scrollbar { width: 4px; height: 4px; }
body.anlg ::-webkit-scrollbar-track { background: rgba(255,255,255,0.02); }
body.anlg ::-webkit-scrollbar-thumb {
  background: rgba(48,209,88,0.22);
  border-radius: 100px;
}
body.anlg ::-webkit-scrollbar-thumb:hover { background: rgba(48,209,88,0.50); }
body.anlg ::selection { background: rgba(10,132,255,0.35); color: var(--w100); }

/* ══════════════════════════════════════════════════
   §22  ANIMATIONS
   CSS keyframes only — no JS animation loops
   ══════════════════════════════════════════════════ */
@keyframes anlg-rise {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0);    }
}
@keyframes anlg-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* Orb drift — these run on CSS, no JS loop needed */
@keyframes anlg-drift-a {
  0%,100% { transform: translate(0px,0px)   scale(1.00); }
  38%     { transform: translate(26px,-16px) scale(1.03); }
  72%     { transform: translate(-14px,12px) scale(0.97); }
}
@keyframes anlg-drift-b {
  0%,100% { transform: translate(0px,0px)    scale(1.00); }
  42%     { transform: translate(-20px,18px) scale(1.02); }
  78%     { transform: translate(12px,-8px)  scale(0.98); }
}

/* Article stagger */
body.anlg article,
body.anlg .hentry {
  animation: anlg-rise 0.55s cubic-bezier(0.16,1,0.3,1) both !important;
}
body.anlg article:nth-child(1) { animation-delay:  0ms !important; }
body.anlg article:nth-child(2) { animation-delay: 55ms !important; }
body.anlg article:nth-child(3) { animation-delay:110ms !important; }
body.anlg article:nth-child(4) { animation-delay:165ms !important; }
body.anlg article:nth-child(5) { animation-delay:220ms !important; }

body.anlg .widget { animation: anlg-fade 0.45s ease both !important; }

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
  body.anlg *, body.anlg *::before, body.anlg *::after {
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
}

/* ══════════════════════════════════════════════════
   §23  RESPONSIVE
   ══════════════════════════════════════════════════ */
@media (max-width: 768px) {
  body.anlg article.post,
  body.anlg .hentry {
    border-radius: var(--r-md) !important;
    margin-bottom: 18px !important;
  }
  body.anlg h1,
  body.anlg .entry-title {
    font-size: clamp(1.4rem, 5vw, 2.2rem) !important;
    line-height: 1.18 !important;
  }
  body.anlg h2,
  body.anlg .entry-content h2 {
    font-size: clamp(1.1rem, 4vw, 1.55rem) !important;
  }
  body.anlg p,
  body.anlg .entry-content p {
    font-size: 0.975rem !important;
    line-height: 1.82 !important;
  }
  /* Reduce nav blur on mobile for performance */
  body.anlg .site-header,
  body.anlg #masthead {
    backdrop-filter: blur(20px) saturate(160%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  }
  body.anlg #ez-toc-container,
  body.anlg .table-of-contents {
    padding: 15px 16px !important;
  }
}

@media (max-width: 480px) {
  body.anlg h1,
  body.anlg .entry-title { font-size: 1.38rem !important; }
  body.anlg h2,
  body.anlg .entry-content h2 { font-size: 1.10rem !important; }
  body.anlg h3 { font-size: 1.0rem !important; }
}

/* Retina hairlines */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  body.anlg article.post,
  body.anlg .hentry,
  body.anlg .widget {
    border-width: 0.5px !important;
  }
}