/*
Theme Name: DIVERGENTE - Child Theme
Template: twentytwentyfive
Description: Custom child theme for Divergente
Author: Milo de Prieto
Version: 2.0.0
Text Domain: divergente-child
*/

/* ===============================
          DIVERGENTE DESIGN SYSTEM
            Complete styling for art gallery
        Based on ARTESIAN, inverted for dark theme
=============================== */

/* ===============================
 ------------ Design Tokens ------------ 
=============================== */

:root {
  /* Navigation */
  --nav-font-desktop: 76px;
  --nav-font-tablet: 38px;
  --nav-font-mobile: 24px;
  --nav-gap-desktop: clamp(45px, 6.5vw, 120px);
  --nav-gap-tablet: clamp(28px, 5vw, 70px);
  --nav-gap-mobile: clamp(16px, 4vw, 32px);

  /* Logo */
  --logo-h-desktop: 104px;
  --logo-h-tablet: 64px;
  --logo-h-mobile: 48px;
  --logo-h: var(--logo-h-desktop);

  /* Header */
  --header-pad-y: clamp(8px, 1.2vw, 16px);
  --header-pad-x: clamp(16px, 3vw, 48px);
  --header-peek: 12px;
  --header-max: 1720px;
  --nav-font: var(--nav-font-desktop);
  --adminbar: 0px;
  --header-h: calc(max(var(--logo-h), var(--nav-font)) + (var(--header-pad-y) * 2));

  /* Hero */
  --hero-size-min: 2.125rem;
  --hero-size-max: 7rem;
  --hero-lh-desktop: 1.02;
  --hero-lh-mobile: 1.08;
  --hero-track-desktop: -0.008em;
  --hero-track-mobile: -0.004em;

  /* Typography scale */
  --font-h1: 3rem;
  --font-h2: 2.15rem;
  --font-h3: 1.55rem;
  --font-h4: 1.25rem;
  --font-body: 1.15rem;
  --font-small: 0.95rem;

  /* Font weights */
  --weight-h1: 800;
  --weight-h2: 700;
  --weight-h3: 600;
  --weight-h4: 500;
  --weight-body: 300;
  --weight-emphasis: 600;

  /* Line heights */
  --lh-tight: 1.15;
  --lh-normal: 1.5;
  --lh-relaxed: 1.7;

  /* Colors - INVERTED for dark theme */
  --text-heading: #FFFFFF;        /* Pure white for headings */
  --text-body: #FAFAFA;           /* Bright off-white for body */
  --text-bridge: #D4D4D4;         /* Light gray for bridge text */
  --text-secondary: #B8B8B8;      /* Mid gray for secondary */
  --text-meta: #999999;           /* Dim gray for meta */
  --text-primary: var(--text-heading);
  --border-light: #2A2A2A;        /* Dark borders */
  --accent-cyan: #00E5FF;         /* Gender divergence */
  --accent-magenta: #C219E4;      /* Neurodivergence */
  --accent-lime: #C7FF1F;         /* Sociosexual divergence */
  --accent: var(--accent-cyan);   /* Default accent */

  /* Background */
  --bg-primary: #0A0A0A;          /* Near black */
  --bg-secondary: #141414;        /* Slightly lighter */

  /* Animation System */
  --timing-instant: 120ms;
  --timing-quick: 220ms;
  --timing-smooth: 350ms;
  --timing-elegant: 500ms;
  --timing-contemplative: 700ms;
  
  --ease-natural: cubic-bezier(0.4, 0.0, 0.2, 1);
  --ease-elegant: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-subtle: cubic-bezier(0.33, 1, 0.68, 1);
  --ease-museum: cubic-bezier(0.19, 1, 0.22, 1);
}

@media (max-width: 1024px) {
  :root {
    --logo-h: var(--logo-h-tablet);
    --nav-font: var(--nav-font-tablet);
  }
}

@media (max-width: 640px) {
  :root {
    --logo-h: var(--logo-h-mobile);
    --nav-font: var(--nav-font-mobile);
  }
}

html.admin-bar {
  --adminbar: 32px;
}

/* Body background */
body {
  background-color: var(--bg-primary) !important;
}

/* ===============================
------------ HEADER SYSTEM ------------
=============================== */
#site-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 999;
  width: 100%;
  padding: var(--header-pad-y) var(--header-pad-x);
  background: transparent !important;
  pointer-events: none;
  isolation: auto;
  transition: transform 220ms ease;
  transform: translateY(0);
}

#site-header > * {
  pointer-events: auto;
}

.site-header,
.kadence-header,
.header-wrap,
.site-branding,
#site-header.wp-block-group {
  background: transparent !important;
  box-shadow: none !important;
}

#site-header .kb-row-layout-wrap,
#site-header .kt-row-layout,
#site-header .wp-block-kadence-rowlayout {
  width: 100%;
  background: transparent !important;
}

#site-header .kt-row-layout-inner,
#site-header .kt-row-column-wrap {
  display: flex;
  width: min(var(--header-max), 100%);
  margin-inline: auto;
  align-items: center;
  justify-content: space-between;
  gap: clamp(8px, 1.6vw, 24px);
}

#site-header .wp-block-kadence-column {
  min-width: 0;
  display: flex;
  align-items: center;
}

#site-header .kadence-columntwentytwentyfive__header_8d0bd7-f2 {
  flex: 0 0 auto;
}

#site-header .kadence-columntwentytwentyfive__header_df6e0e-95 {
  flex: 1 1 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center !important;
}

/* ------------ Header Typography ------------ */
#site-header .wp-block-navigation,
#site-header .wp-block-navigation__container,
#site-header .wp-block-navigation a,
#site-header .wp-block-navigation .wp-block-navigation-item__content,
.wp-block-navigation__responsive-container-content {
  font-family: "Libre Baskerville", serif !important;
}

/* ------------ Mix-Blend Mode (INVERTED) ------------ */
#site-header,
#site-header .wp-block-navigation {
    mix-blend-mode: difference;
    color: #FFF !important; /* Black becomes white on black background via difference blend */
}

#site-header .wp-block-navigation a {
    mix-blend-mode: difference;
    color: #FFF !important; /* Black becomes white via difference blend */
}

#site-header .wp-block-navigation a,
#site-header .wp-block-navigation .wp-block-navigation-item__content {
  color: inherit !important;
}

#site-header .wp-block-kadence-image img {
  height: var(--logo-h);
  max-height: var(--logo-h);
  width: auto !important;
  max-width: none !important;
  display: block;
  filter: invert(0) brightness(1);
  mix-blend-mode: difference;
  transition: opacity 0.2s ease;
}

@supports not (mix-blend-mode: difference) {
  #site-header {
    background: rgba(0, 0, 0, 0.92) !important;
  }
  #site-header .wp-block-navigation,
  #site-header .wp-block-navigation a {
    color: #fff !important;
    mix-blend-mode: normal;
  }
  #site-header .wp-block-kadence-image img {
    mix-blend-mode: normal;
    filter: brightness(0) invert(1);
  }
}

/* ------------ Navigation Layout ------------ */
#site-header .wp-block-navigation {
  font-weight: 700 !important;
  font-size: var(--nav-font) !important;
  letter-spacing: 0.1em !important;
  line-height: 1 !important;
  margin: 0 !important;
  transform: none !important;
}

#site-header .wp-block-navigation__container {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: var(--nav-gap-desktop);
}

#site-header .wp-block-navigation .wp-block-navigation-item,
#site-header .wp-block-navigation .wp-block-navigation-item__content {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
  padding-block: 0 !important;
  white-space: nowrap !important;
}

#site-header .wp-block-navigation a,
#site-header .wp-block-navigation a:visited,
#site-header .wp-block-navigation a:hover,
#site-header .wp-block-navigation a:focus,
.wp-block-navigation__responsive-container-content a {
  text-decoration: none !important;
}

/* ------------ Navigation: TRUE Outline ------------ */
#site-header .wp-block-navigation .nav-outline > a {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1.4px currentColor;
  font-weight: 800 !important;
  letter-spacing: calc(0.1em + 0.015em) !important;
}

#site-header .wp-block-navigation .nav-outline > a:hover {
  -webkit-text-fill-color: #fff !important;
  -webkit-text-stroke: 0 transparent;
}

@media (max-width: 1024px) {
  #site-header .wp-block-navigation .nav-outline > a {
    -webkit-text-stroke: 1.4px currentColor;
  }
}

@media (max-width: 640px) {
  #site-header .wp-block-navigation .nav-outline > a {
    -webkit-text-stroke: 1.2px currentColor;
    font-weight: 750 !important;
  }
}

@supports not (-webkit-text-stroke: 1px currentColor) {
  #site-header .wp-block-navigation .nav-outline > a {
    text-shadow: 0 1px 0 currentColor, 0 -1px 0 currentColor,
      1px 0 0 currentColor, -1px 0 0 currentColor,
      1px 1px 0 currentColor, -1px 1px 0 currentColor,
      1px -1px 0 currentColor, -1px -1px 0 currentColor;
  }
  #site-header .wp-block-navigation .nav-outline > a:hover {
    text-shadow: none;
  }
}

/* ------------ Navigation: Hover Invert ------------ */
#site-header .wp-block-navigation .wp-block-navigation-item:not(.nav-outline) > a {
  -webkit-text-fill-color: currentColor;
  -webkit-text-stroke: 0;
  transition: -webkit-text-fill-color 0.2s ease, -webkit-text-stroke 0.2s ease;
}

#site-header .wp-block-navigation .wp-block-navigation-item:not(.nav-outline) > a:hover {
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1.4px #fff !important; /* Added !important and #fff */
  font-weight: 800 !important;
  letter-spacing: calc(0.1em + 0.015em) !important;
}

@supports not (-webkit-text-stroke: 1px currentColor) {
  #site-header .wp-block-navigation .wp-block-navigation-item:not(.nav-outline) > a:hover {
    text-shadow: 0 1px 0 currentColor, 0 -1px 0 currentColor,
      1px 0 0 currentColor, -1px 0 0 currentColor,
      1px 1px 0 currentColor, -1px 1px 0 currentColor,
      1px -1px 0 currentColor, -1px -1px 0 currentColor;
  }
}

/* ------------ Smart Sticky ------------ */
#site-header.header--peek {
  transform: translateY(calc(-100% + var(--header-peek)));
  pointer-events: none;
}

#site-header.header--show {
  transform: translateY(0);
  pointer-events: auto;
}

#site-header.header--peek::after {
  content: none;
}

html.admin-bar #site-header {
  top: 32px;
}

@media (prefers-reduced-motion: reduce) {
  #site-header {
    transition: none;
  }
}

/* Remove focus box around header nav items */
#site-header .wp-block-navigation a:focus,
#site-header .wp-block-navigation a:focus-visible,
#site-header .wp-block-navigation .wp-block-navigation-item__content:focus,
#site-header .wp-block-navigation .wp-block-navigation-item__content:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Remove focus boxes site-wide */
a:focus,
a:focus-visible,
button:focus,
button:focus-visible,
.wp-block-button__link:focus,
.wp-block-button__link:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

/* Subtle focus indicator instead of box */
a:focus-visible,
button:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.3) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

/* ------------ Global Layout ------------ */
html {
  scroll-padding-top: calc(var(--header-h) + var(--adminbar) + 16px);
}

.push-under-header {
  padding-top: calc(var(--header-h) + var(--adminbar));
}

main > *:first-child {
  margin-top: max(0px, env(safe-area-inset-top));
}

/* DIVERGENTE: hard-normalize header internals to match ARTESIAN */
#site-header,
#site-header * {
  box-sizing: border-box;
}

#site-header .wp-block-kadence-rowlayout,
#site-header .kt-row-layout-inner,
#site-header .kt-row-column-wrap,
#site-header .kt-inside-inner-col,
#site-header .wp-block-kadence-column {
  margin: 0 !important;
  padding: 0 !important;
}

#site-header figure,
#site-header .wp-block-kadence-image {
  margin: 0 !important;   /* kills any default figure margins */
}

#site-header .kt-inside-inner-col {
  display: flex;
  align-items: center;
}

/* ================================================================
   HEADER - HIDE ON SCROLL DOWN, SHOW ON SCROLL UP
   ================================================================ */

/* Header transitions */
#site-header {
    transition: transform var(--timing-smooth) var(--ease-elegant);
    will-change: transform;
}

/* Hide header when scrolling down */
body.scrolling-down #site-header {
    transform: translateY(calc(-100% - var(--adminbar)));
}

/* Show header when scrolling up */
body.scrolling-up #site-header {
    transform: translateY(0);
}

/* Always show header at top of page */
body.at-top #site-header {
    transform: translateY(0);
}

/* Admin bar adjustment */
html.admin-bar body.scrolling-down #site-header {
    transform: translateY(calc(-100% - 32px));
}


/* ===============================
     GLOBAL TYPOGRAPHY SYSTEM
=============================== */

/* Hero statements - DRAMATIC */
.hero-title {
  font-size: clamp(var(--hero-size-min), 8vw, var(--hero-size-max)) !important;
  line-height: var(--hero-lh-desktop) !important;
  letter-spacing: var(--hero-track-desktop) !important;
  text-align: center;
  max-width: 20ch;
  margin: 0 auto;
  font-weight: 800 !important;
  color: var(--text-heading) !important;
}

@media (max-width: 1024px) {
  .hero-title {
    font-size: clamp(2rem, 7vw, 5rem) !important;
    line-height: 1.06 !important;
  }
}

@media (max-width: 640px) {
  .hero-title {
    font-size: clamp(1.75rem, 6.5vw, 3rem) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.001em !important;
    padding: 0 5vw;
  }
}

/* Page titles - COMMANDING */
.entry-title,
.page-title,
h1:not(.hero-title) {
  font-family: "Libre Baskerville", serif !important;  
  font-size: 3rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.05em !important;
  color: var(--text-heading) !important;
  line-height: 1.15 !important;
  margin-bottom: 1.5rem !important;
}

@media (max-width: 768px) {
  .entry-title,
  .page-title,
  h1:not(.hero-title) {
    font-size: 2.25rem !important;
  }
}

/* Page subtitle */
.page-subtitle {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 1.3rem !important;
  line-height: 1.5 !important;
  color: var(--text-secondary) !important;
  text-align: center !important;
  margin-top: 1rem !important;
  margin-bottom: 3rem !important;
  padding: 0 2rem !important;
}

/* Section headers - CLEAR */
h2,
.wp-block-heading h2,
.entry-content h2,
.wp-block-post-content h2 {
  font-family: "Libre Baskerville", serif !important;
  font-size: 2.15rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: var(--text-heading) !important;
  letter-spacing: 0.02em !important;
  margin-top: 3.5rem !important;
  margin-bottom: 1.5rem !important;
}

/* Exception: Post titles in queries should NOT be uppercase */
.wp-block-post-title,
h2.wp-block-post-title,
.art-grid .wp-block-post-title,
.art-related-section .wp-block-post-title {
  font-family: "Libre Baskerville", serif !important;
  font-weight: 700 !important;
  font-size: 1.5rem !important;
  line-height: 1.4 !important;
  margin-top: 0.75rem !important;
  margin-bottom: 0.5rem !important;
  color: var(--text-heading) !important;
}

/* Subsection headers - REFINED */
h3 {
  font-family: "Montserrat", sans-serif !important;
  font-size: var(--font-h3) !important;
  font-weight: 500 !important;
  line-height: var(--lh-normal) !important;
  color: var(--text-heading) !important;
  margin-top: 2.5rem !important;
  margin-bottom: 1rem !important;
}

/* Body text - SUPPORTIVE */
p {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.15rem !important;
  line-height: 1.7 !important;
  color: var(--text-body) !important;
}

/* Lists - match body text */
ul, ol {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.15rem !important;
  line-height: 1.7 !important;
  color: var(--text-body) !important;
}

li {
  margin-bottom: 0.5rem;
  color: var(--text-body) !important;
}

/* Strong/bold - confident not aggressive */
strong, b {
  font-weight: 600 !important;
  color: var(--text-heading) !important;
  letter-spacing: 0.005em;
}

/* ======== LINK SYSTEM ======= */

/* Body links - default state */
p a,
.entry-content a:not(.wp-block-button__link),
.wp-block-post-content a:not(.wp-block-button__link) {
  color: var(--text-body) !important;
  text-decoration: none !important;
  border-bottom: 1px solid transparent;
  transition: all var(--timing-smooth) var(--ease-natural);
}

/* Body links - hover state */
p a:hover,
.entry-content a:not(.wp-block-button__link):hover,
.wp-block-post-content a:not(.wp-block-button__link):hover {
  color: var(--accent) !important;
  border-bottom-color: var(--accent);
}

/* Special links in italic */
em a, .italic-link {
  font-style: italic;
  color: var(--text-secondary) !important;
}

em a:hover, .italic-link:hover {
  color: var(--accent) !important;
}

/* Post Title Links */
.wp-block-post-title a,
.kb-post-grid-item .kb-blocks-post-grid-title a {
  color: var(--text-heading) !important;
}

.wp-block-post-title a:hover,
.kb-post-grid-item .kb-blocks-post-grid-title a:hover {
  color: var(--accent-cyan) !important;
}

/* ===============================
          Front Page Components
=============================== */

/* Front page subhead - THE BRIDGE not used yet */
.front-subhead {
  font-size: clamp(1.35rem, 3vw, 1.85rem) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
  letter-spacing: 0.005em !important;
  margin-top: clamp(2rem, 4vh, 3rem) !important;
  margin-bottom: clamp(2.5rem, 5vh, 4rem) !important;
  max-width: 48em !important;
  margin-inline: auto !important;
  color: var(--text-bridge) !important;
  padding: 0 2rem !important;
}

@media (min-width: 769px) {
  .front-subhead {
    font-size: 1.85rem !important;
    padding: 0 3rem !important;
  }
}

.front-logo {
  padding-block: clamp(8px, 1.8vw, 28px);
  position: relative;
}

@media (max-width: 640px) {
  .front-logo {
    padding-block: clamp(12px, 3vh, 48px);
  }
}

.front-logo img {
  display: block;
  width: min(96vw, 1600px);
  height: auto;
  margin-inline: auto;
  margin-block: 0;
  mix-blend-mode: normal !important;
  filter: brightness(0) invert(1);
  position: relative;
  animation: glitch-hologram 6s infinite;
  will-change: filter, transform;
}

.front-logo .wp-block-image,
.front-logo figure {
  margin: 0;
}

/* Logo Holographic Glitch Animation */
@keyframes glitch-hologram {
  0%, 100% { 
    filter: 
      brightness(1) 
      saturate(1) 
      hue-rotate(0deg)
      drop-shadow(0 0 0 transparent);
    transform: translate(0, 0) skew(0deg);
  }
  
  14.5%, 31%, 100% {
    filter: 
      brightness(1) 
      saturate(1) 
      hue-rotate(0deg)
      drop-shadow(0 0 0 transparent);
    transform: translate(0, 0) skew(0deg);
  }
  
  15% { 
    filter: 
      brightness(1.2) 
      saturate(1.5) 
      hue-rotate(65deg)
      drop-shadow(-4px -2px 0 #00E5FF)
      drop-shadow(5px 3px 0 #C219E4);
    transform: translate(-2px, 1px) skew(-0.5deg);
  }
  
  16.5% { 
    filter: 
      brightness(1.3) 
      saturate(1.6) 
      hue-rotate(70deg)
      drop-shadow(-6px 2px 0 #00E5FF)
      drop-shadow(7px -3px 0 #C219E4)
      drop-shadow(0 0 8px #C7FF1F);
    transform: translate(3px, -2px) skew(0.5deg);
  }
  
  18% { 
    filter: 
      brightness(1.25) 
      saturate(1.7) 
      hue-rotate(60deg)
      drop-shadow(-3px -4px 0 #00E5FF)
      drop-shadow(4px 5px 0 #C219E4)
      drop-shadow(0 0 12px #C7FF1F);
    transform: translate(-1px, 2px) skew(-0.3deg);
  }
  
  19.5% { 
    filter: 
      brightness(1.15) 
      saturate(1.4) 
      hue-rotate(65deg)
      drop-shadow(-5px 3px 0 #00E5FF)
      drop-shadow(6px -4px 0 #C219E4);
    transform: translate(2px, -1px) skew(0.4deg);
  }
  
  21% { 
    filter: 
      brightness(1.1) 
      saturate(1.3) 
      hue-rotate(55deg)
      drop-shadow(-7px 1px 0 #00E5FF)
      drop-shadow(8px 2px 0 #C219E4)
      drop-shadow(0 0 6px #C7FF1F);
    transform: translate(-3px, 1px) skew(-0.6deg);
  }
  
  22.5% { 
    filter: 
      brightness(1.2) 
      saturate(1.5) 
      hue-rotate(65deg)
      drop-shadow(-2px -3px 0 #00E5FF)
      drop-shadow(3px 4px 0 #C219E4);
    transform: translate(1px, -2px) skew(0.2deg);
  }
  
  24% { 
    filter: 
      brightness(1.15) 
      saturate(1.3) 
      hue-rotate(50deg)
      drop-shadow(-4px 2px 0 #00E5FF)
      drop-shadow(5px -2px 0 #C219E4)
      drop-shadow(0 0 10px #C7FF1F);
    transform: translate(-2px, 1px) skew(-0.4deg);
  }
  
  25.5% { 
    filter: 
      brightness(1.1) 
      saturate(1.2) 
      hue-rotate(30deg)
      drop-shadow(-1px 1px 0 #00E5FF)
      drop-shadow(2px -1px 0 #C219E4);
    transform: translate(-1px, 1px) skew(-0.1deg);
  }
  
  27% { 
    filter: 
      brightness(1.05) 
      saturate(1.1) 
      hue-rotate(10deg)
      drop-shadow(0 0 0 transparent);
    transform: translate(0, 0) skew(0deg);
  }
  
  28.5% { 
    filter: 
      brightness(1.02) 
      saturate(1.05) 
      hue-rotate(0deg)
      drop-shadow(0 0 0 transparent);
    transform: translate(0, 0) skew(0deg);
  }
}

.front-logo {
  animation: logo-container-glow 6s infinite;
}

@keyframes logo-container-glow {
  0%, 14.5%, 31%, 100% {
    filter: drop-shadow(0 0 0 transparent);
  }
  15%, 18%, 21%, 24%, 27% {
    filter: drop-shadow(0 0 20px rgba(0, 229, 255, 0.4))
            drop-shadow(0 0 30px rgba(194, 25, 228, 0.3))
            drop-shadow(0 0 40px rgba(199, 255, 31, 0.2));
  }
}

@media (max-width: 640px) {
  @keyframes glitch-hologram {
    0%, 14.5%, 31%, 100% {
      filter: brightness(1) saturate(1) hue-rotate(0deg);
      transform: translate(0, 0);
    }
    
    15%, 16.5%, 18%, 19.5%, 21%, 22.5%, 24%, 25.5%, 27% {
      filter: 
        brightness(1.15) 
        saturate(1.3) 
        hue-rotate(65deg)
        drop-shadow(-2px -1px 0 #00E5FF)
        drop-shadow(2px 1px 0 #C219E4)
        drop-shadow(0 0 4px #C7FF1F);
      transform: translate(0, 0);
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .front-logo img,
  .front-logo {
    animation: none !important;
  }
}

/* ===============================
HOVER EFFECTS - Divergence Types
=============================== */

/* GENDER DIVERGENCE - Cyan */
.hover-gender {
  position: relative;
  transition: color 0.3s ease;
  cursor: pointer;
}

.hover-gender:hover {
  color: #00E5FF !important;
  animation: glitch-gender 0.4s ease-in-out;
  text-shadow: 
    0 0 20px rgba(0, 229, 255, 1),
    0 0 40px rgba(0, 229, 255, 0.8),
    0 0 60px rgba(0, 229, 255, 0.6);
  filter: brightness(1.4);
}

@keyframes glitch-gender {
  0%, 100% { 
    transform: translate(0);
    filter: brightness(1);
  }
  15% { 
    transform: translate(-3px, 2px);
    filter: brightness(1.2);
  }
  30% { 
    transform: translate(3px, -2px);
    filter: brightness(1.3);
  }
  45% { 
    transform: translate(-2px, -1px);
    filter: brightness(1.1);
  }
  60% { 
    transform: translate(2px, 1px);
    filter: brightness(1.2);
  }
  75% { 
    transform: translate(-1px, 1px);
    filter: brightness(1.15);
  }
}

/* NEURODIVERGENCE - Magenta */
.hover-neuro {
  position: relative;
  transition: color 0.3s ease;
  cursor: pointer;
}

.hover-neuro:hover {
  color: #C219E4 !important;
  animation: glitch-neuro 0.4s ease-in-out;
  text-shadow: 
    0 0 20px rgba(194, 25, 228, 1),
    0 0 40px rgba(194, 25, 228, 0.8),
    0 0 60px rgba(194, 25, 228, 0.6);
  filter: brightness(1.4);
}

@keyframes glitch-neuro {
  0%, 100% { 
    transform: translate(0) skew(0deg);
    filter: brightness(1);
  }
  12% { 
    transform: translate(2px, -3px) skew(-1deg);
    filter: brightness(1.2);
  }
  24% { 
    transform: translate(-3px, 2px) skew(1deg);
    filter: brightness(1.3);
  }
  36% { 
    transform: translate(3px, 1px) skew(-0.5deg);
    filter: brightness(1.1);
  }
  48% { 
    transform: translate(-2px, -2px) skew(0.5deg);
    filter: brightness(1.25);
  }
  60% { 
    transform: translate(1px, 2px) skew(-0.3deg);
    filter: brightness(1.15);
  }
  72% { 
    transform: translate(-1px, 1px) skew(0.2deg);
    filter: brightness(1.1);
  }
}

/* SOCIOSEXUAL DIVERGENCE - Lime */
.hover-socio {
  position: relative;
  transition: color 0.3s ease;
  cursor: pointer;
}

.hover-socio:hover {
  color: #C7FF1F !important;
  animation: glitch-socio 0.4s ease-in-out;
  text-shadow: 
    0 0 20px rgba(199, 255, 31, 1),
    0 0 40px rgba(199, 255, 31, 0.8),
    0 0 60px rgba(199, 255, 31, 0.6);
  filter: brightness(1.4);
}

@keyframes glitch-socio {
  0%, 100% { 
    transform: translate(0) scale(1);
    filter: brightness(1);
  }
  10% { 
    transform: translate(-2px, 3px) scale(1.01);
    filter: brightness(1.25);
  }
  25% { 
    transform: translate(3px, -2px) scale(0.99);
    filter: brightness(1.3);
  }
  40% { 
    transform: translate(-3px, -2px) scale(1.02);
    filter: brightness(1.2);
  }
  55% { 
    transform: translate(2px, 2px) scale(0.98);
    filter: brightness(1.25);
  }
  70% { 
    transform: translate(-1px, 2px) scale(1.01);
    filter: brightness(1.15);
  }
  85% { 
    transform: translate(1px, -1px) scale(1);
    filter: brightness(1.1);
  }
}

/* Enhanced versions with RGB split */
.hover-gender-enhanced:hover {
  color: #00E5FF;
  animation: glitch-gender-enhanced 0.5s ease-in-out;
filter: brightness(1.4);
}

@keyframes glitch-gender-enhanced {
  0%, 100% { 
    transform: translate(0);
    text-shadow: 0 0 10px rgba(0, 229, 255, 0.6);
  }
  20% { 
    transform: translate(-3px, 2px);
    text-shadow: 
      -4px 0 0 #C219E4,
      4px 0 0 #C7FF1F,
      0 0 15px rgba(0, 229, 255, 0.8);
  }
  40% { 
    transform: translate(3px, -2px);
    text-shadow: 
      -5px 0 0 #C7FF1F,
      5px 0 0 #C219E4,
      0 0 20px rgba(0, 229, 255, 1);
  }
  60% { 
    transform: translate(-2px, 1px);
    text-shadow: 
      -3px 0 0 #C219E4,
      3px 0 0 #C7FF1F,
      0 0 15px rgba(0, 229, 255, 0.8);
  }
  80% { 
    transform: translate(1px, -1px);
    text-shadow: 
      -2px 0 0 #C7FF1F,
      2px 0 0 #C219E4,
      0 0 10px rgba(0, 229, 255, 0.6);
  }
}

.hover-neuro-enhanced:hover {
  color: #C219E4;
  animation: glitch-neuro-enhanced 0.5s ease-in-out;
filter: brightness(1.4);
}

@keyframes glitch-neuro-enhanced {
  0%, 100% { 
    transform: translate(0);
    text-shadow: 0 0 10px rgba(194, 25, 228, 0.6);
  }
  20% { 
    transform: translate(2px, -3px);
    text-shadow: 
      -4px 0 0 #00E5FF,
      4px 0 0 #C7FF1F,
      0 0 15px rgba(194, 25, 228, 0.8);
  }
  40% { 
    transform: translate(-3px, 2px);
    text-shadow: 
      -5px 0 0 #C7FF1F,
      5px 0 0 #00E5FF,
      0 0 20px rgba(194, 25, 228, 1);
  }
  60% { 
    transform: translate(3px, 1px);
    text-shadow: 
      -3px 0 0 #00E5FF,
      3px 0 0 #C7FF1F,
      0 0 15px rgba(194, 25, 228, 0.8);
  }
  80% { 
    transform: translate(-1px, 2px);
    text-shadow: 
      -2px 0 0 #C7FF1F,
      2px 0 0 #00E5FF,
      0 0 10px rgba(194, 25, 228, 0.6);
  }
}

.hover-socio-enhanced:hover {
  color: #C7FF1F;
  animation: glitch-socio-enhanced 0.5s ease-in-out;
filter: brightness(1.4);
}

@keyframes glitch-socio-enhanced {
  0%, 100% { 
    transform: translate(0);
    text-shadow: 0 0 10px rgba(199, 255, 31, 0.6);
  }
  20% { 
    transform: translate(-2px, 3px);
    text-shadow: 
      -4px 0 0 #00E5FF,
      4px 0 0 #C219E4,
      0 0 15px rgba(199, 255, 31, 0.8);
  }
  40% { 
    transform: translate(3px, -2px);
    text-shadow: 
      -5px 0 0 #C219E4,
      5px 0 0 #00E5FF,
      0 0 20px rgba(199, 255, 31, 1);
  }
  60% { 
    transform: translate(-3px, 2px);
    text-shadow: 
      -3px 0 0 #00E5FF,
      3px 0 0 #C219E4,
      0 0 15px rgba(199, 255, 31, 0.8);
  }
  80% { 
    transform: translate(1px, -1px);
    text-shadow: 
      -2px 0 0 #C219E4,
      2px 0 0 #00E5FF,
      0 0 10px rgba(199, 255, 31, 0.6);
  }
}

@media (max-width: 640px) {
  @keyframes glitch-gender,
  @keyframes glitch-neuro,
  @keyframes glitch-socio {
    0%, 100% { transform: translate(0); }
    50% { transform: translate(-1px, 1px); }
  }
  
  .hover-gender-enhanced:hover,
  .hover-neuro-enhanced:hover,
  .hover-socio-enhanced:hover {
    animation-duration: 0.3s;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hover-gender:hover,
  .hover-neuro:hover,
  .hover-socio:hover,
  .hover-gender-enhanced:hover,
  .hover-neuro-enhanced:hover,
  .hover-socio-enhanced:hover {
    animation: none;
    transform: none;
    text-shadow: none;
  }
}

/* Bold text with hover effects - extra bright */
strong.hover-gender:hover,
b.hover-gender:hover,
strong.hover-gender-enhanced:hover,
b.hover-gender-enhanced:hover {
  filter: brightness(1.6) !important;
}

strong.hover-neuro:hover,
b.hover-neuro:hover,
strong.hover-neuro-enhanced:hover,
b.hover-neuro-enhanced:hover {
  filter: brightness(1.6) !important;
}

strong.hover-socio:hover,
b.hover-socio:hover,
strong.hover-socio-enhanced:hover,
b.hover-socio-enhanced:hover {
  filter: brightness(1.6) !important;
}

/* Divergence tag: force the hover color to win even if Gutenberg/theme sets a text color */
p.art-divergence-tags.hover-gender:hover,
p.art-divergence-tags.hover-neuro:hover,
p.art-divergence-tags.hover-socio:hover,
p.art-divergence-tags.hover-gender:hover *,
p.art-divergence-tags.hover-neuro:hover *,
p.art-divergence-tags.hover-socio:hover * {
  color: inherit !important;
}

/* Set the actual hover colors on the p itself */
p.art-divergence-tags.hover-gender:hover { color: var(--accent-cyan) !important; }
p.art-divergence-tags.hover-neuro:hover  { color: var(--accent-magenta) !important; }
p.art-divergence-tags.hover-socio:hover  { color: var(--accent-lime) !important; }

/* ===============================
   FOOTER STYLING - DIVERGENTE
   Clean, minimal approach
=============================== */

/* Footer container background */
footer {
  background-color: var(--bg-secondary) !important;
}

/* Tagline under logo */
footer .footer-tagline {
  font-size: 0.95rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.05rem !important;
  max-width: 300px;
  margin-inline: auto;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

/* Description text (right column on DIVERGENTE) */
footer .footer-description,
footer .footer-description p {
  font-size: 0.9rem !important;
  font-weight: 200 !important;  /* Lighter than tagline */
  letter-spacing: 0.05rem !important;
  line-height: 1.6 !important;
  color: #FAFAFA !important;
}

/* Copyright text */
footer .footer-copyright {
  font-size: 0.8rem !important;
  font-weight: 100 !important;
  letter-spacing: 0.14rem !important;
  color: var(--text-body) !important;
  margin-top: 2rem !important;
  margin-bottom: 0 !important;
}

/* Footer links - general */
footer a {
  color: var(--text-heading) !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}

footer a:hover {
  color: var(--accent-cyan) !important;
}

/* ===============================
        ART GALLERY - Post Queries
=============================== */

/* Gallery Intro */
.art-intro {
  text-align: center;
}

.art-intro h1 {
  font-family: "Libre Baskerville", serif !important;
  font-weight: 700 !important;
  font-size: 2.5rem !important;
  margin-bottom: 1rem !important;
  color: var(--text-heading) !important;
}

.art-intro .tagline {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.15rem !important;
  color: var(--text-secondary) !important;
  font-style: italic !important;
}

/* Query Container */
.wp-block-query {
  max-width: 100%;
}

/* Grid Layout */
.art-grid .wp-block-post-template,
.art-related-section .wp-block-post-template {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 3rem !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Individual Art Cards */
.wp-block-post {
  border: none !important;
  transition: transform 0.2s ease;
  padding: 0 !important;
}

.wp-block-post:hover {
  transform: translateY(-4px);
}

/* Subtitles in Query Loops */
.art-related-section .wp-block-post-title + p.art-subtitle,
.wp-block-query .wp-block-post-template .wp-block-post-title + p.art-subtitle {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 1.05rem !important;
  line-height: 1.5 !important;
  color: var(--text-secondary) !important;
  margin-top: 0.25rem !important;
  margin-bottom: 0.75rem !important;
  display: block !important;
}

/* Query Loop Subtitle - smaller for galleries/related */
.query-subtitle,
p.query-subtitle {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 1.05rem !important;
  line-height: 1.5 !important;
  color: var(--text-secondary) !important;
  text-align: center !important;
  margin-top: 0.25rem !important;
  margin-bottom: 0.75rem !important;
  padding: 0 !important;
  display: block !important;
}


/* Excerpts */
.wp-block-post-excerpt,
.wp-block-post-excerpt__excerpt {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-size: .95rem !important;
  line-height: 1.6 !important;
  color: var(--text-body) !important;
  margin-bottom: 0.75rem !important;
  margin-top: 0 !important;
}

/* Featured Images */
.wp-block-post-featured-image {
  margin-bottom: 0 !important;
}

.wp-block-post-featured-image img {
  border-radius: 4px;
}

/* ===============================
   SINGLE ART POST PAGE
=============================== */

/* Section Containers */
.art-header-section,
.art-content-section,
.art-related-section {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Art Title */
.single-post .art-title,
.single-post .wp-block-post-title {
  font-family: "Libre Baskerville", serif !important;
  font-weight: 700 !important;
  font-size: 3rem !important;
  line-height: 1.15 !important;
  color: var(--text-heading) !important;
  text-align: center !important;
  text-decoration: none !important;
  margin-top: 0 !important;
  margin-bottom: 1rem !important;
}

/* Art Subtitle */
.art-subtitle {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 1.5rem !important;
  line-height: 1.8 !important;
  color: var(--text-secondary) !important;
  text-align: center !important;
  margin-top: 0.5rem !important;
  margin-bottom: 1.5rem !important;
  padding: 0 2rem !important;
  min-height: 1.5rem !important;
  display: block !important;
}

.art-header-section .art-subtitle:empty {
  display: none !important;
}

/* Art Body Container */
.single-post .entry-content,
.single-post .post-content,
.single-post .wp-block-post-content {
  max-width: 680px;
  margin: 0 auto;
}

/* Art Body Typography */
.single-post .entry-content h2,
.single-post .post-content h2,
.single-post .wp-block-post-content h2 {
  font-family: "Libre Baskerville", serif !important;
  font-weight: 400 !important;
  font-size: 1.75rem !important;
  margin-top: 3rem !important;
  margin-bottom: 1.5rem !important;
  color: var(--text-heading) !important;
}

.single-post .entry-content h3,
.single-post .post-content h3,
.single-post .wp-block-post-content h3 {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 600 !important;
  font-size: 1.35rem !important;
  margin-top: 2.5rem !important;
  margin-bottom: 1rem !important;
  color: var(--text-heading) !important;
}

.single-post .entry-content p,
.single-post .post-content p,
.single-post .wp-block-post-content p {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.15rem !important;
  line-height: 1.8 !important;
  color: var(--text-body) !important;
  margin-bottom: 1.5rem !important;
}

/* Images and Figures */
.single-post .entry-content figure,
.single-post .post-content figure,
.single-post .wp-block-post-content figure {
  margin: 3rem auto !important;
  max-width: 100%;
}

.single-post .entry-content figure img,
.single-post .post-content figure img,
.single-post .wp-block-post-content figure img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 4px;
}

/* Captions */
.single-post figcaption,
.single-post .wp-element-caption,
.single-post .wp-caption-text {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 0.95rem !important;
  color: var(--text-secondary) !important;
  margin-top: 0.75rem !important;
  line-height: 1.5 !important;
  text-align: center !important;
}

/* Related Art Heading */
.related-heading {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  letter-spacing: 1.4px !important;
  text-align: center !important;
  margin-top: 0 !important;
  margin-bottom: 2rem !important;
  color: var(--text-secondary) !important;
}

/* Featured Image Visibility Rules */
.single-post > .wp-block-post-featured-image,
.art-header-section .wp-block-post-featured-image,
.art-content-section .wp-block-post-featured-image {
  display: none !important;
}

.art-related-section .wp-block-post-featured-image {
  display: block !important;
  margin-bottom: 0 !important;
}

/* ===============================
META LINE (Artist, Date)
=============================== */

.art-meta-line {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
}

.art-meta-line .art-author,
.art-meta-line .art-dot,
.art-meta-line .wp-block-post-date {
  font-family: "Montserrat", sans-serif !important;
  font-size: 0.9rem !important;
  color: var(--text-meta) !important;
  margin: 0 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.01em;
}

.art-meta-line .art-dot {
  opacity: 0.8;
  user-select: none;
}

.art-meta-line .art-author a {
  color: var(--text-meta) !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
}

.art-meta-line .art-author a:hover {
  color: var(--accent-cyan) !important;
}

/* =============================
     VIDEO EMBED - FULL WIDTH
============================= */

/* Default video embed (respects content width) */
.art-video-embed {
  margin: 3rem auto !important;
  max-width: 100%;
}

.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
  background: var(--bg-secondary);
  border-radius: 4px;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* FULL-WIDTH VIDEO: Edge-to-edge within post content */
.single-post .wp-block-post-content > .art-video-embed {
  max-width: 100vw !important;
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 2.5rem !important;
  margin-bottom: 2.5rem !important;
}

/* No border-radius on full-width videos for cleaner edge */
.single-post .wp-block-post-content > .art-video-embed .video-container {
  border-radius: 0;
}

/* Divergence Tags - SUBTLE CLUES */
p.art-divergence-tags,
.art-divergence-tags {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin: 3rem auto 3rem !important;
  padding: 0 !important;
  border: none !important;
  max-width: 680px;
}

/* Base styling for the divergence tag paragraph itself */
p.art-divergence-tags,
.art-divergence-tags {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 400 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.1em !important;
  color: var(--text-meta) !important;
  opacity: 0.7;
  transition: all 0.4s ease;
}

/* Optional motion on hover */
p.art-divergence-tags:hover,
.art-divergence-tags:hover {
  opacity: 1;
  transform: translateY(-1px);
}

@media (max-width: 640px) {
  p.art-divergence-tags,
  .art-divergence-tags {
    gap: 1.5rem;
  }
  
  p.art-divergence-tags span,
  .art-divergence-tags span {
    font-size: 0.8rem !important;
  }
}

/* Video caption (if necessary) */
.art-video-caption {
  font-family: "Montserrat", sans-serif !important;
  font-weight: 300 !important;
  font-style: italic !important;
  font-size: 0.95rem !important;
  color: var(--text-secondary) !important;
  text-align: center !important;
  margin: 1rem auto 0 !important;
  max-width: 680px !important;
  padding: 0 2rem;
}

@media (max-width: 640px) {
  .art-divergence-tags {
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
  }
  
  .single-post .wp-block-post-content > .art-video-embed {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
  }
}


/* ===============================
   MOBILE RESPONSIVE
=============================== */

@media (max-width: 768px) {
  /* Grid to Single Column */
  .art-grid .wp-block-post-template,
  .art-related-section .wp-block-post-template {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
  
  /* Mobile Typography Adjustments */
  .art-intro h1 {
    font-size: 2rem;
  }
  
  .single-post .art-title,
  .single-post .wp-block-post-title {
    font-size: 2.25rem;
  }
  
  .art-subtitle {
    font-size: 1.15rem;
    padding: 0 1rem;
  }
  
  .single-post .entry-content h2,
  .single-post .post-content h2,
  .single-post .wp-block-post-content h2 {
    font-size: 1.5rem;
  }
  
  /* Mobile Padding */
  .art-header-section,
  .art-content-section,
  .art-related-section {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* ===============================
   RESPONSIVE - UNIFIED BREAKPOINTS
=============================== */

/* Large Desktop - 1280px and below */
@media (max-width: 1280px) {
  :root {
    --logo-h: clamp(64px, 6vw, 104px);
  }
  
  #site-header .wp-block-navigation {
    font-size: clamp(48px, 5vw, 76px) !important;
  }
  
  #site-header .wp-block-navigation__container {
    gap: clamp(28px, 3.5vw, 60px);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  
  #site-header .wp-block-navigation__container::-webkit-scrollbar {
    display: none;
  }
}

/* Tablet - 1024px and below */
@media (max-width: 1024px) {
  #site-header .wp-block-navigation {
    font-size: var(--nav-font-tablet) !important;
  }
  
  #site-header .wp-block-navigation__container {
    gap: var(--nav-gap-tablet);
  }
  
  #site-header .wp-block-navigation .nav-outline > a {
    -webkit-text-stroke: 1.2px currentColor;
  }
  
  .hero-title {
    font-size: clamp(2rem, 7vw, 5rem) !important;
    line-height: 1.06 !important;
  }
  
  .entry-title,
  .page-title,
  h1:not(.hero-title) {
    font-size: 2.25rem !important;
  }
}

/* Mobile - 768px and below (PRIMARY MOBILE BREAKPOINT) */
@media (max-width: 768px) {
  /* Navigation */
  #site-header .wp-block-navigation {
    font-size: var(--nav-font-mobile) !important;
  }
  
  #site-header .wp-block-navigation__container {
    gap: var(--nav-gap-mobile);
  }
  
  #site-header .wp-block-navigation .nav-outline > a {
    -webkit-text-stroke: 1px currentColor;
    font-weight: 750 !important;
  }
  
  /* Grid to Single Column */
  .art-grid .wp-block-post-template,
  .art-related-section .wp-block-post-template {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }
  
  /* Typography Adjustments */
  .art-intro h1 {
    font-size: 2rem !important;
  }
  
  .single-post .art-title,
  .single-post .wp-block-post-title {
    font-size: 2.25rem !important;
  }
  
  .art-subtitle {
    font-size: 1.15rem !important;
    padding: 0 1rem !important;
  }
  
  .single-post .entry-content h2,
  .single-post .post-content h2,
  .single-post .wp-block-post-content h2 {
    font-size: 1.5rem !important;
  }
  
  .hero-title {
    font-size: clamp(1.75rem, 6.5vw, 3rem) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.001em !important;
    padding: 0 5vw;
  }
  
  .front-subhead {
    font-size: 1.35rem !important;
    padding: 0 1rem !important;
  }
  
  .front-logo {
    padding-block: clamp(12px, 3vh, 48px);
  }
  
  /* Padding Adjustments */
  .art-header-section,
  .art-content-section,
  .art-related-section {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
  
  /* Divergence Tags */
  .art-divergence-tags {
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
  }
  
  /* Video Embeds */
  .single-post .wp-block-post-content > .art-video-embed {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
  }
  
  /* Glitch Animations - Simplified for mobile */
  @keyframes glitch-hologram {
    0%, 14.5%, 31%, 100% {
      filter: brightness(1) saturate(1) hue-rotate(0deg);
      transform: translate(0, 0);
    }
    
    15%, 16.5%, 18%, 19.5%, 21%, 22.5%, 24%, 25.5%, 27% {
      filter: 
        brightness(1.15) 
        saturate(1.3) 
        hue-rotate(65deg)
        drop-shadow(-2px -1px 0 #00E5FF)
        drop-shadow(2px 1px 0 #C219E4)
        drop-shadow(0 0 4px #C7FF1F);
      transform: translate(0, 0);
    }
  }
}

