/*
 * AN Glass Lite — v1.0.0
 * Rule: ZERO backdrop-filter on scroll elements.
 * Glass = dark panel + 1px border + shadow. Nothing more.
 * ─────────────────────────────────────────────────────
 */

/* ── Scene ───────────────────────────────────── */
body.ang {
  background: #04070f
    radial-gradient(ellipse 800px 600px at 8%  20%, rgba(48,209,88,.10) 0%, transparent 65%),
    radial-gradient(ellipse 700px 550px at 92% 12%, rgba(10,132,255,.12) 0%, transparent 65%),
    radial-gradient(ellipse 500px 400px at 50% 90%, rgba(255,59,48,.06)  0%, transparent 65%)
    !important;
  background-attachment: fixed !important;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  overflow-x: hidden !important;
}

/* ── Nuke white backgrounds ──────────────────── */
body.ang div, body.ang section, body.ang article,
body.ang aside, body.ang main,  body.ang header,
body.ang nav,  body.ang li,     body.ang span,
body.ang p,    body.ang ul,     body.ang ol,
body.ang form, body.ang figure, body.ang blockquote,
body.ang table,body.ang tbody,  body.ang thead,
body.ang tr,   body.ang td,     body.ang th,
body.ang details, body.ang summary {
  background-color: transparent !important;
  background-image:  none !important;
}

/* Inline style white backgrounds from page builders */
body.ang [style*="background:#fff"], body.ang [style*="background: #fff"],
body.ang [style*="background:#ffffff"], body.ang [style*="background: #ffffff"],
body.ang [style*="background:white"],  body.ang [style*="background: white"],
body.ang [style*="background-color:#fff"],  body.ang [style*="background-color: #fff"],
body.ang [style*="background-color:white"], body.ang [style*="background-color: white"],
body.ang [style*="background-color:#ffffff"] { background-color: rgba(16,24,40,.72) !important; }

/* Fix dark inline text */
body.ang [style*="color:#000"],   body.ang [style*="color: #000"],
body.ang [style*="color:#333"],   body.ang [style*="color:black"],
body.ang [style*="color: black"], body.ang [style*="color:#222"] {
  color: rgba(255,255,255,.90) !important;
  -webkit-text-fill-color: rgba(255,255,255,.90) !important;
}

/* ── Navigation ──────────────────────────────── */
/* ONE backdrop-filter — nav only, never scrolls with content */
body.ang .site-header, body.ang header.site-header,
body.ang #masthead,    body.ang #header,
body.ang .main-header, body.ang .ast-primary-header {
  background: rgba(4,7,14,.88) !important;
  backdrop-filter: blur(24px) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
}

body.ang .site-title, body.ang .site-title a,
body.ang .site-branding a {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

body.ang .main-navigation a, body.ang .nav-menu a,
body.ang #site-navigation a, body.ang .menu a, body.ang nav a {
  color: rgba(255,255,255,.75) !important;
  -webkit-text-fill-color: rgba(255,255,255,.75) !important;
}
body.ang .main-navigation a:hover, body.ang nav a:hover {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
body.ang .current-menu-item > a {
  color: #30D158 !important;
  -webkit-text-fill-color: #30D158 !important;
}

body.ang .sub-menu {
  background: rgba(3,5,12,.97) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 10px !important;
}

/* ── Typography ──────────────────────────────── */
/* H1 title links stay red */
body.ang h1 a, body.ang .entry-title a,
body.ang .entry-title a:visited {
  color: #FF3B30 !important;
  -webkit-text-fill-color: #FF3B30 !important;
}
body.ang h1 a:hover, body.ang .entry-title a:hover {
  color: #FF6961 !important;
  -webkit-text-fill-color: #FF6961 !important;
}
body.ang h4 {
  color: rgba(255,255,255,.92) !important;
  -webkit-text-fill-color: rgba(255,255,255,.92) !important;
}
body.ang h5, body.ang h6 {
  color: rgba(255,255,255,.70) !important;
  -webkit-text-fill-color: rgba(255,255,255,.70) !important;
}

body.ang p, body.ang li, body.ang td, body.ang th {
  color: rgba(255,255,255,.90) !important;
  -webkit-text-fill-color: rgba(255,255,255,.90) !important;
  line-height: 1.85 !important;
}

body.ang a, body.ang a:visited {
  color: #0A84FF !important;
  -webkit-text-fill-color: #0A84FF !important;
  text-decoration: none !important;
}
body.ang a:hover { color: #5AC8FF !important; -webkit-text-fill-color: #5AC8FF !important; }

/* Headings H1/H2/H3 re-asserted at high specificity */
body.ang h1, body.ang .entry-title, body.ang .page-title,
body.ang .wp-block-post-title, body.ang article h1, body.ang main h1 {
  color: #FF3B30 !important;
  -webkit-text-fill-color: #FF3B30 !important;
  font-weight: 700 !important;
  line-height: 1.14 !important;
  letter-spacing: -.02em !important;
}
body.ang h2, body.ang .entry-content h2, body.ang article h2 {
  color: #0A84FF !important;
  -webkit-text-fill-color: #0A84FF !important;
  font-weight: 600 !important;
  line-height: 1.22 !important;
}
body.ang h3, body.ang .entry-content h3, body.ang article h3 {
  color: #30D158 !important;
  -webkit-text-fill-color: #30D158 !important;
  font-weight: 600 !important;
}

body.ang .widget-title, body.ang .widgettitle {
  color: #30D158 !important;
  -webkit-text-fill-color: #30D158 !important;
  font-size: .70rem !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  border-bottom: 1px solid rgba(48,209,88,.22) !important;
  padding-bottom: 10px !important;
  margin-bottom: 14px !important;
}

/* ── Article cards — glass without blur ─────── */
/* Depth via shadow + tint only. Zero backdrop-filter.
   This is why it scrolls smooth. */
body.ang article.post, body.ang article.page,
body.ang .hentry, body.ang .type-post {
  background: rgba(16,24,40,.74) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-top: 1px solid rgba(255,255,255,.16) !important; /* specular edge */
  border-radius: 18px !important;
  box-shadow:
    0 8px 32px rgba(0,0,0,.48),
    0 2px 6px  rgba(0,0,0,.28) !important;
  margin-bottom: 28px !important;
  position: relative !important;
}

body.ang .archive .hentry:hover,
body.ang .blog   .hentry:hover,
body.ang .home   .hentry:hover {
  border-color: rgba(48,209,88,.22) !important;
  box-shadow:
    0 16px 48px rgba(0,0,0,.58),
    0 4px  10px rgba(0,0,0,.32) !important;
  transform: translateY(-4px) !important;
  transition: transform .28s cubic-bezier(.16,1,.3,1),
              box-shadow .28s ease,
              border-color .18s ease !important;
}

/* ── Sidebar widgets ─────────────────────────── */
body.ang .widget {
  background: rgba(16,24,40,.70) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-top: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 14px !important;
  box-shadow: 0 4px 18px rgba(0,0,0,.38) !important;
  padding: 20px !important;
  margin-bottom: 18px !important;
}

/* ── Search & inputs ─────────────────────────── */
body.ang input[type="search"], body.ang input[type="text"],
body.ang input[type="email"],  body.ang input[type="password"],
body.ang input[type="url"],    body.ang textarea, body.ang select {
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 100px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  padding: 10px 18px !important;
  font-size: .95rem !important;
  outline: none !important;
  caret-color: #30D158 !important;
  transition: border-color .14s ease, box-shadow .14s ease !important;
}
body.ang textarea { border-radius: 12px !important; }
body.ang input::placeholder, body.ang textarea::placeholder {
  color: rgba(255,255,255,.40) !important;
  -webkit-text-fill-color: rgba(255,255,255,.40) !important;
}
body.ang input:focus, body.ang textarea:focus {
  border-color: #0A84FF !important;
  box-shadow: 0 0 0 3px rgba(10,132,255,.15) !important;
}
body.ang input:-webkit-autofill, body.ang input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 9999px #04070f inset !important;
  -webkit-text-fill-color: #fff !important;
}
body.ang input[type="submit"], body.ang .search-submit, body.ang button {
  background: rgba(10,132,255,.16) !important;
  border: 1px solid rgba(10,132,255,.30) !important;
  border-radius: 100px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  padding: 10px 22px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}
body.ang input[type="submit"]:hover, body.ang .search-submit:hover {
  background: rgba(10,132,255,.28) !important;
}
body.ang .button, body.ang a.button, body.ang .more-link {
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 100px !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  padding: 9px 22px !important;
  display: inline-block !important;
  font-weight: 500 !important;
}

/* ── Table of Contents ───────────────────────── */
body.ang #ez-toc-container, body.ang .ez-toc-container,
body.ang .table-of-contents, body.ang .rank-math-toc,
body.ang .luckywp-toc, body.ang [class*="toc-container"] {
  background: rgba(10,132,255,.06) !important;
  border: 1px solid rgba(10,132,255,.22) !important;
  border-radius: 14px !important;
  padding: 18px 20px !important;
  margin: 24px 0 !important;
}
body.ang .ez-toc-title, body.ang #ez-toc-container .ez-toc-title {
  color: #30D158 !important;
  -webkit-text-fill-color: #30D158 !important;
  font-size: .68rem !important;
  font-weight: 700 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}
body.ang #ez-toc-container ul li a, body.ang .ez-toc-list a {
  color: rgba(90,200,255,.90) !important;
  -webkit-text-fill-color: rgba(90,200,255,.90) !important;
  font-size: .875rem !important;
  line-height: 1.65 !important;
  display: block !important;
  padding: 2px 0 !important;
}
body.ang #ez-toc-container ul li a:hover, body.ang .ez-toc-list a:hover {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
body.ang #ez-toc-container ul ul { padding-left: 14px !important; border-left: 1px solid rgba(10,132,255,.15) !important; margin: 2px 0 2px 8px !important; }

/* ── Misc content ────────────────────────────── */
body.ang blockquote {
  background: rgba(10,132,255,.08) !important;
  border-left: 3px solid #0A84FF !important;
  border-radius: 0 10px 10px 0 !important;
  padding: 16px 20px !important;
  margin: 20px 0 !important;
}
body.ang blockquote p { font-style: italic !important; }

body.ang pre, body.ang .wp-block-code {
  background: rgba(0,0,0,.55) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 10px !important;
  padding: 18px !important;
  overflow-x: auto !important;
}
body.ang pre code, body.ang .wp-block-code code {
  color: #30D158 !important;
  -webkit-text-fill-color: #30D158 !important;
}
body.ang p code, body.ang li code {
  background: rgba(48,209,88,.09) !important;
  color: #7EE8A2 !important;
  -webkit-text-fill-color: #7EE8A2 !important;
  border-radius: 4px !important;
  padding: 1px 6px !important;
}

body.ang .cat-links a, body.ang a[rel="category tag"] {
  background: rgba(48,209,88,.11) !important;
  color: #30D158 !important;
  -webkit-text-fill-color: #30D158 !important;
  border: 1px solid rgba(48,209,88,.22) !important;
  border-radius: 100px !important;
  padding: 2px 11px !important;
  font-size: .70rem !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}
body.ang .tags-links a, body.ang a[rel="tag"] {
  background: rgba(10,132,255,.10) !important;
  color: #5AC8FF !important;
  -webkit-text-fill-color: #5AC8FF !important;
  border: 1px solid rgba(10,132,255,.22) !important;
  border-radius: 6px !important;
  padding: 2px 8px !important;
  font-size: .75rem !important;
  display: inline-block !important;
  margin: 2px !important;
}
body.ang .entry-meta * { color: rgba(255,255,255,.45) !important; font-size: .82rem !important; }
body.ang .entry-meta a { color: rgba(255,255,255,.68) !important; -webkit-text-fill-color: rgba(255,255,255,.68) !important; }

body.ang .author-box, body.ang .about-author {
  background: rgba(48,209,88,.05) !important;
  border: 1px solid rgba(48,209,88,.20) !important;
  border-radius: 16px !important;
  padding: 20px !important;
}

body.ang .site-footer, body.ang #colophon {
  background: rgba(2,4,9,.92) !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}
body.ang .site-footer * { color: rgba(255,255,255,.45) !important; }
body.ang .site-footer a { color: rgba(255,255,255,.68) !important; }

body.ang table {
  background: rgba(8,12,22,.80) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  width: 100% !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}
body.ang thead th {
  background: rgba(48,209,88,.09) !important;
  color: #30D158 !important;
  -webkit-text-fill-color: #30D158 !important;
  font-size: .70rem !important;
  font-weight: 700 !important;
  letter-spacing: .07em !important;
  text-transform: uppercase !important;
  padding: 10px 14px !important;
  border-bottom: 1px solid rgba(48,209,88,.18) !important;
}
body.ang tbody td { padding: 10px 14px !important; border-bottom: 1px solid rgba(255,255,255,.06) !important; }
body.ang tbody tr:last-child td { border-bottom: none !important; }

body.ang .page-numbers {
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.72) !important;
  -webkit-text-fill-color: rgba(255,255,255,.72) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 6px !important;
  padding: 6px 13px !important;
  display: inline-block !important;
  margin: 2px !important;
}
body.ang .page-numbers.current {
  background: rgba(10,132,255,.20) !important;
  color: #5AC8FF !important;
  -webkit-text-fill-color: #5AC8FF !important;
}

body.ang ::selection { background: rgba(10,132,255,.35); color: #fff; }
body.ang ::-webkit-scrollbar { width: 4px; }
body.ang ::-webkit-scrollbar-thumb { background: rgba(48,209,88,.22); border-radius: 100px; }
body.ang ::-webkit-scrollbar-thumb:hover { background: rgba(48,209,88,.50); }

body.ang .yoast-breadcrumb *, body.ang .breadcrumbs * {
  color: rgba(255,255,255,.45) !important;
  -webkit-text-fill-color: rgba(255,255,255,.45) !important;
  font-size: .80rem !important;
}

body.ang .entry-content img, body.ang article img {
  border-radius: 10px !important;
  max-width: 100% !important;
  height: auto !important;
}

body.ang .comment-body {
  background: rgba(255,255,255,.05) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 10px !important;
  padding: 14px !important;
  margin-bottom: 12px !important;
}
body.ang .comment-author .fn { color: #30D158 !important; -webkit-text-fill-color: #30D158 !important; }
body.ang .comments-title { color: #0A84FF !important; -webkit-text-fill-color: #0A84FF !important; }
body.ang #respond {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 14px !important;
  padding: 22px !important;
}

/* ── Responsive ──────────────────────────────── */
@media (max-width: 768px) {
  body.ang article.post, body.ang .hentry { border-radius: 12px !important; margin-bottom: 16px !important; }
  body.ang h1, body.ang .entry-title { font-size: clamp(1.35rem, 5vw, 2rem) !important; }
  body.ang h2, body.ang .entry-content h2 { font-size: clamp(1.08rem, 4vw, 1.45rem) !important; }
  body.ang p { font-size: .97rem !important; }
  /* Nav: no backdrop-filter on mobile — not worth the GPU cost */
  body.ang .site-header, body.ang #masthead { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: rgba(4,7,14,.96) !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.ang * { animation: none !important; transition: none !important; }
}
