/* Мирские знания — изолированная панель 3D-карточек */

*,
.secular-knowledge-page *::before,
.secular-knowledge-page *::after {
  box-sizing: border-box;
}

.secular-knowledge-page {
  --page-deep: #040807;
  --page-mid: #0a1620;
  --neon-mint: #00ffd6;
  --neon-green: #08e260;
  --neon-violet: #c084fc;
  --glass-edge: rgba(255, 255, 255, 0.85);
  --sk-main-pad-x: clamp(1rem, 4vw, 2rem);
  --sk-main-pad-bottom: clamp(1.5rem, 4vw, 2.5rem);
  --sk-chamfer-clip: polygon(16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px);
  --sk-orbit-radius: clamp(14px, 18%, 26px);
  /* Original low Z — text follows card tilt without flying forward; still above base layers */
  --sk-text-depth: 26px;

  margin: 0;
  min-height: 100vh;
  min-height: 100dvh;
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
  font-weight: 500;
  color: #e8fff8;
  line-height: 1.55;
  overflow-x: hidden;
  background-color: var(--page-deep);
  background-image:
    radial-gradient(ellipse 90% 60% at 10% -10%, rgba(0, 255, 214, 0.22), transparent 50%),
    radial-gradient(ellipse 70% 50% at 95% 10%, rgba(192, 132, 252, 0.2), transparent 45%),
    radial-gradient(ellipse 60% 40% at 50% 110%, rgba(8, 226, 96, 0.12), transparent 45%),
    linear-gradient(165deg, var(--page-deep) 0%, var(--page-mid) 45%, #061210 100%);
  background-attachment: fixed;
}

body.dashboard-page.secular-knowledge-page {
  color: #e8fff8;
}

.secular-knowledge-page::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(rgba(0, 255, 214, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 255, 214, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  pointer-events: none;
  z-index: 0;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, black, transparent);
}

.secular-knowledge-page > .dashboard-main {
  position: relative;
  z-index: 1;
}

.secular-knowledge-toolbar {
  max-width: 1280px;
  margin: 0 auto;
  padding:
    clamp(1.35rem, 3.5vw, 2rem)
    max(var(--sk-main-pad-x), env(safe-area-inset-right, 0px))
    clamp(0.35rem, 1.2vw, 0.65rem)
    max(var(--sk-main-pad-x), env(safe-area-inset-left, 0px));
}

/* Back — small decorative square (matches 5th orbit tile) */
.secular-knowledge-back {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.14);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  color: rgba(255, 255, 255, 0.92);
  text-decoration: none;
  box-shadow: rgba(100, 100, 111, 0.25) -10px 10px 24px 0;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}

.secular-knowledge-back:hover,
.secular-knowledge-back:focus-visible {
  background: rgba(255, 255, 255, 0.2);
  box-shadow: rgba(100, 100, 111, 0.3) -8px 12px 28px 0;
  transform: translateY(-1px);
  outline: none;
}

.secular-knowledge-back:focus-visible {
  box-shadow:
    0 0 0 2px rgba(255, 255, 255, 0.28),
    rgba(100, 100, 111, 0.3) -8px 12px 28px 0;
}

.secular-knowledge-main {
  max-width: none;
  margin: 0;
  padding:
    72px
    0
    max(var(--sk-main-pad-bottom), env(safe-area-inset-bottom, 0px))
    0;
}

/* Card grid */
.secular-knowledge-page .shape-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 288px), 1fr));
  gap: clamp(1.1rem, 2.8vw, 1.65rem);
  align-items: stretch;
  max-width: 1280px;
  margin: 0 auto;
  padding:
    clamp(0.85rem, 2.2vw, 1.35rem)
    max(var(--sk-main-pad-x), env(safe-area-inset-right, 0px))
    0
    max(var(--sk-main-pad-x), env(safe-area-inset-left, 0px));
}

@media (min-width: 900px) {
  .secular-knowledge-page .shape-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .secular-knowledge-page .ux-parent--span-2 {
    grid-column: span 2;
  }
}

/* Core 3D shell */
.secular-knowledge-page .ux-parent {
  width: 100%;
  max-width: 400px;
  height: 300px;
  margin-inline: auto;
  perspective: 1000px;
  perspective-origin: 50% 50%;
  filter: drop-shadow(0 28px 50px rgba(0, 40, 30, 0.45));
}

.secular-knowledge-page .ux-parent--wide {
  max-width: none;
  width: 100%;
  height: 268px;
}

.secular-knowledge-page .ux-card {
  position: relative;
  height: 100%;
  border-radius: 50px;
  background: var(--ux-grad);
  transform-style: preserve-3d;
  transition:
    transform 0.55s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.55s ease;
  box-shadow:
    rgba(5, 71, 17, 0) 40px 50px 25px -40px,
    rgba(5, 71, 17, 0.28) 0 25px 25px -5px;
}

.secular-knowledge-page .ux-parent:hover .ux-card,
.secular-knowledge-page .ux-parent:focus-within .ux-card {
  transform: rotate3d(1, 1, 0, 28deg);
  box-shadow:
    rgba(5, 71, 17, 0.45) 28px 48px 28px -38px,
    rgba(0, 255, 214, 0.12) 0 0 60px -10px,
    rgba(5, 71, 17, 0.15) 0 25px 35px 0;
}

/* Themes */
.secular-knowledge-page .ux-parent--mint {
  --ux-grad: linear-gradient(135deg, rgb(0, 255, 214) 0%, rgb(8, 226, 96) 100%);
  --ux-title: #00894d;
  --ux-body: rgba(0, 137, 78, 0.82);
  --ux-cta: #00c37b;
  --ux-orbit: rgba(0, 249, 203, 0.22);
  --ux-fill: #00894d;
  --sk-tile-bg: rgba(0, 78, 50, 0.18);
  --sk-tile-bg-hover: rgba(0, 68, 44, 0.24);
  --sk-tile-border: rgba(0, 72, 46, 0.48);
  --sk-tile-border-hover: rgba(0, 62, 40, 0.58);
  --sk-tile-shadow:
    rgba(0, 42, 30, 0.32) -5px 7px 16px 0,
    inset 0 0 0 1px rgba(0, 90, 58, 0.28),
    inset 0 -2px 6px rgba(0, 55, 36, 0.22);
  --sk-tile-shadow-hover:
    rgba(0, 38, 28, 0.38) -5px 8px 18px 0,
    inset 0 0 0 1px rgba(0, 95, 62, 0.32),
    inset 0 -2px 8px rgba(0, 50, 34, 0.26),
    0 0 10px rgba(0, 85, 60, 0.18);
  --sk-tile-shadow-active:
    rgba(0, 32, 24, 0.42) -4px 6px 14px 0,
    inset 0 0 0 1px rgba(0, 100, 65, 0.38),
    inset 0 -3px 10px rgba(0, 45, 30, 0.32),
    0 0 8px rgba(0, 95, 68, 0.22);
  --sk-open-text-shadow-hover:
    0 0 0.5px rgba(0, 52, 38, 0.9),
    0 0 1.25px rgba(0, 72, 54, 0.75),
    0 1px 2px rgba(0, 38, 28, 0.58),
    0 0 7px rgba(0, 95, 68, 0.38);
  --sk-open-text-shadow-active:
    0 0 0.65px rgba(0, 38, 28, 0.95),
    0 0 2px rgba(0, 88, 64, 0.85),
    0 1px 3px rgba(0, 28, 20, 0.62),
    0 0 10px rgba(0, 118, 86, 0.45);
  --sk-open-arrow-filter-hover:
    drop-shadow(0 0 0.45px rgba(0, 52, 38, 0.92))
    drop-shadow(0 0 1.25px rgba(0, 72, 54, 0.78))
    drop-shadow(0 1px 2px rgba(0, 38, 28, 0.55))
    drop-shadow(0 0 6px rgba(0, 95, 68, 0.36));
  --sk-open-arrow-filter-active:
    drop-shadow(0 0 0.65px rgba(0, 38, 28, 0.98))
    drop-shadow(0 0 2px rgba(0, 88, 64, 0.88))
    drop-shadow(0 1px 3px rgba(0, 28, 20, 0.62))
    drop-shadow(0 0 9px rgba(0, 118, 86, 0.44));
  --sk-social-border: rgba(0, 72, 46, 0.42);
  --sk-social-shadow:
    rgba(0, 42, 30, 0.22) 0 4px 8px -2px,
    inset 0 0 0 1px rgba(0, 90, 58, 0.22),
    inset 0 -1px 4px rgba(0, 55, 36, 0.14),
    0 0 5px rgba(0, 85, 60, 0.1);
  --sk-social-shadow-hover:
    rgba(0, 38, 28, 0.3) -2px 6px 12px 0,
    inset 0 0 0 1px rgba(0, 95, 62, 0.3),
    inset 0 -1px 5px rgba(0, 50, 34, 0.18),
    0 0 9px rgba(0, 85, 60, 0.16);
  --sk-orbit-icon-filter:
    drop-shadow(0 0 0.45px rgba(0, 52, 38, 0.92))
    drop-shadow(0 0 1.25px rgba(0, 72, 54, 0.78))
    drop-shadow(0 1px 2.5px rgba(0, 38, 28, 0.52))
    drop-shadow(0 0 5px rgba(0, 95, 68, 0.32));
  --sk-orbit-icon-filter-hover:
    drop-shadow(0 0 0.65px rgba(0, 42, 32, 0.98))
    drop-shadow(0 0 2px rgba(0, 82, 60, 0.88))
    drop-shadow(0 2px 4px rgba(0, 32, 24, 0.58))
    drop-shadow(0 0 9px rgba(0, 108, 78, 0.42));
  --sk-orbit-icon-filter-active:
    drop-shadow(0 0 0.85px rgba(0, 38, 28, 1))
    drop-shadow(0 0 2.5px rgba(0, 88, 64, 0.92))
    drop-shadow(0 2px 5px rgba(0, 28, 20, 0.62))
    drop-shadow(0 0 12px rgba(0, 118, 86, 0.48));
}

.secular-knowledge-page .ux-parent--violet {
  --ux-grad: linear-gradient(145deg, #a855f7 0%, #6366f1 40%, #ec4899 100%);
  --ux-title: #3b0764;
  --ux-body: rgba(59, 7, 100, 0.85);
  --ux-cta: #7c3aed;
  --ux-orbit: rgba(216, 180, 254, 0.35);
  --ux-fill: #5b21b6;
  --sk-tile-bg: rgba(59, 7, 100, 0.2);
  --sk-tile-bg-hover: rgba(49, 7, 88, 0.28);
  --sk-tile-border: rgba(76, 29, 149, 0.52);
  --sk-tile-border-hover: rgba(91, 33, 182, 0.62);
  --sk-tile-shadow:
    rgba(39, 12, 72, 0.34) -5px 7px 16px 0,
    inset 0 0 0 1px rgba(109, 40, 217, 0.28),
    inset 0 -2px 6px rgba(49, 15, 88, 0.24);
  --sk-tile-shadow-hover:
    rgba(35, 10, 68, 0.4) -5px 8px 18px 0,
    inset 0 0 0 1px rgba(124, 58, 237, 0.34),
    inset 0 -2px 8px rgba(45, 12, 92, 0.28),
    0 0 10px rgba(124, 58, 237, 0.2);
  --sk-tile-shadow-active:
    rgba(30, 8, 58, 0.44) -4px 6px 14px 0,
    inset 0 0 0 1px rgba(139, 92, 246, 0.4),
    inset 0 -3px 10px rgba(40, 10, 78, 0.32),
    0 0 8px rgba(139, 92, 246, 0.24);
  --sk-open-text-shadow-hover:
    0 0 0.5px rgba(46, 16, 82, 0.9),
    0 0 1.25px rgba(76, 29, 149, 0.75),
    0 1px 2px rgba(39, 12, 72, 0.58),
    0 0 7px rgba(109, 40, 217, 0.38);
  --sk-open-text-shadow-active:
    0 0 0.65px rgba(35, 10, 68, 0.95),
    0 0 2px rgba(109, 40, 217, 0.85),
    0 1px 3px rgba(30, 8, 58, 0.62),
    0 0 10px rgba(139, 92, 246, 0.45);
  --sk-open-arrow-filter-hover:
    drop-shadow(0 0 0.45px rgba(46, 16, 82, 0.92))
    drop-shadow(0 0 1.25px rgba(76, 29, 149, 0.78))
    drop-shadow(0 1px 2px rgba(39, 12, 72, 0.55))
    drop-shadow(0 0 6px rgba(109, 40, 217, 0.36));
  --sk-open-arrow-filter-active:
    drop-shadow(0 0 0.65px rgba(35, 10, 68, 0.98))
    drop-shadow(0 0 2px rgba(109, 40, 217, 0.88))
    drop-shadow(0 1px 3px rgba(30, 8, 58, 0.62))
    drop-shadow(0 0 9px rgba(139, 92, 246, 0.44));
  --sk-social-border: rgba(76, 29, 149, 0.42);
  --sk-social-shadow:
    rgba(39, 12, 72, 0.22) 0 4px 8px -2px,
    inset 0 0 0 1px rgba(109, 40, 217, 0.22),
    inset 0 -1px 4px rgba(49, 15, 88, 0.14),
    0 0 5px rgba(124, 58, 237, 0.1);
  --sk-social-shadow-hover:
    rgba(35, 10, 68, 0.3) -2px 6px 12px 0,
    inset 0 0 0 1px rgba(124, 58, 237, 0.3),
    inset 0 -1px 5px rgba(45, 12, 92, 0.18),
    0 0 9px rgba(124, 58, 237, 0.16);
  --sk-orbit-icon-filter:
    drop-shadow(0 0 0.45px rgba(46, 16, 82, 0.92))
    drop-shadow(0 0 1.25px rgba(76, 29, 149, 0.78))
    drop-shadow(0 1px 2.5px rgba(39, 12, 72, 0.52))
    drop-shadow(0 0 5px rgba(109, 40, 217, 0.32));
  --sk-orbit-icon-filter-hover:
    drop-shadow(0 0 0.65px rgba(39, 12, 72, 0.98))
    drop-shadow(0 0 2px rgba(91, 33, 182, 0.88))
    drop-shadow(0 2px 4px rgba(35, 10, 68, 0.58))
    drop-shadow(0 0 9px rgba(124, 58, 237, 0.42));
  --sk-orbit-icon-filter-active:
    drop-shadow(0 0 0.85px rgba(35, 10, 68, 1))
    drop-shadow(0 0 2.5px rgba(109, 40, 217, 0.92))
    drop-shadow(0 2px 5px rgba(30, 8, 58, 0.62))
    drop-shadow(0 0 12px rgba(139, 92, 246, 0.48));
}

.secular-knowledge-page .ux-parent--solar {
  --ux-grad: linear-gradient(135deg, #fbbf24 0%, #f97316 45%, #dc2626 100%);
  --ux-title: #7c2d12;
  --ux-body: rgba(124, 45, 18, 0.88);
  --ux-cta: #c2410c;
  --ux-orbit: rgba(254, 243, 199, 0.4);
  --ux-fill: #9a3412;
  --sk-tile-bg: rgba(124, 45, 18, 0.22);
  --sk-tile-bg-hover: rgba(112, 38, 14, 0.3);
  --sk-tile-border: rgba(154, 52, 18, 0.52);
  --sk-tile-border-hover: rgba(194, 65, 12, 0.62);
  --sk-tile-shadow:
    rgba(88, 28, 8, 0.34) -5px 7px 16px 0,
    inset 0 0 0 1px rgba(180, 58, 14, 0.28),
    inset 0 -2px 6px rgba(92, 32, 10, 0.24);
  --sk-tile-shadow-hover:
    rgba(78, 24, 6, 0.4) -5px 8px 18px 0,
    inset 0 0 0 1px rgba(194, 65, 12, 0.34),
    inset 0 -2px 8px rgba(82, 28, 8, 0.28),
    0 0 10px rgba(194, 65, 12, 0.2);
  --sk-tile-shadow-active:
    rgba(68, 20, 4, 0.44) -4px 6px 14px 0,
    inset 0 0 0 1px rgba(210, 72, 10, 0.4),
    inset 0 -3px 10px rgba(72, 24, 6, 0.32),
    0 0 8px rgba(210, 72, 10, 0.24);
  --sk-open-text-shadow-hover:
    0 0 0.5px rgba(92, 32, 10, 0.9),
    0 0 1.25px rgba(124, 45, 18, 0.75),
    0 1px 2px rgba(78, 24, 6, 0.58),
    0 0 7px rgba(154, 52, 18, 0.38);
  --sk-open-text-shadow-active:
    0 0 0.65px rgba(68, 20, 4, 0.95),
    0 0 2px rgba(180, 58, 14, 0.85),
    0 1px 3px rgba(58, 16, 2, 0.62),
    0 0 10px rgba(210, 72, 10, 0.45);
  --sk-open-arrow-filter-hover:
    drop-shadow(0 0 0.45px rgba(92, 32, 10, 0.92))
    drop-shadow(0 0 1.25px rgba(124, 45, 18, 0.78))
    drop-shadow(0 1px 2px rgba(78, 24, 6, 0.55))
    drop-shadow(0 0 6px rgba(154, 52, 18, 0.36));
  --sk-open-arrow-filter-active:
    drop-shadow(0 0 0.65px rgba(68, 20, 4, 0.98))
    drop-shadow(0 0 2px rgba(180, 58, 14, 0.88))
    drop-shadow(0 1px 3px rgba(58, 16, 2, 0.62))
    drop-shadow(0 0 9px rgba(210, 72, 10, 0.44));
  --sk-social-border: rgba(154, 52, 18, 0.42);
  --sk-social-shadow:
    rgba(88, 28, 8, 0.22) 0 4px 8px -2px,
    inset 0 0 0 1px rgba(180, 58, 14, 0.22),
    inset 0 -1px 4px rgba(92, 32, 10, 0.14),
    0 0 5px rgba(194, 65, 12, 0.1);
  --sk-social-shadow-hover:
    rgba(78, 24, 6, 0.3) -2px 6px 12px 0,
    inset 0 0 0 1px rgba(194, 65, 12, 0.3),
    inset 0 -1px 5px rgba(82, 28, 8, 0.18),
    0 0 9px rgba(194, 65, 12, 0.16);
  --sk-orbit-icon-filter:
    drop-shadow(0 0 0.45px rgba(92, 32, 10, 0.92))
    drop-shadow(0 0 1.25px rgba(124, 45, 18, 0.78))
    drop-shadow(0 1px 2.5px rgba(78, 24, 6, 0.52))
    drop-shadow(0 0 5px rgba(154, 52, 18, 0.32));
  --sk-orbit-icon-filter-hover:
    drop-shadow(0 0 0.65px rgba(78, 24, 6, 0.98))
    drop-shadow(0 0 2px rgba(154, 52, 18, 0.88))
    drop-shadow(0 2px 4px rgba(68, 20, 4, 0.58))
    drop-shadow(0 0 9px rgba(194, 65, 12, 0.42));
  --sk-orbit-icon-filter-active:
    drop-shadow(0 0 0.85px rgba(68, 20, 4, 1))
    drop-shadow(0 0 2.5px rgba(180, 58, 14, 0.92))
    drop-shadow(0 2px 5px rgba(58, 16, 2, 0.62))
    drop-shadow(0 0 12px rgba(210, 72, 10, 0.48));
}

.secular-knowledge-page .ux-parent--ocean {
  --ux-grad: linear-gradient(155deg, #22d3ee 0%, #0284c7 50%, #1e3a8a 100%);
  --ux-title: #0c4a6e;
  --ux-body: rgba(12, 74, 110, 0.88);
  --ux-cta: #0369a1;
  --ux-orbit: rgba(125, 211, 252, 0.35);
  --ux-fill: #0e7490;
  --sk-tile-bg: rgba(12, 74, 110, 0.22);
  --sk-tile-bg-hover: rgba(10, 62, 92, 0.3);
  --sk-tile-border: rgba(3, 105, 161, 0.5);
  --sk-tile-border-hover: rgba(2, 132, 199, 0.6);
  --sk-tile-shadow:
    rgba(8, 42, 68, 0.34) -5px 7px 16px 0,
    inset 0 0 0 1px rgba(14, 116, 144, 0.28),
    inset 0 -2px 6px rgba(8, 38, 62, 0.24);
  --sk-tile-shadow-hover:
    rgba(6, 36, 58, 0.4) -5px 8px 18px 0,
    inset 0 0 0 1px rgba(2, 132, 199, 0.34),
    inset 0 -2px 8px rgba(6, 32, 52, 0.28),
    0 0 10px rgba(2, 132, 199, 0.2);
  --sk-tile-shadow-active:
    rgba(4, 30, 48, 0.44) -4px 6px 14px 0,
    inset 0 0 0 1px rgba(56, 189, 248, 0.38),
    inset 0 -3px 10px rgba(4, 28, 44, 0.32),
    0 0 8px rgba(56, 189, 248, 0.24);
  --sk-open-text-shadow-hover:
    0 0 0.5px rgba(8, 38, 62, 0.9),
    0 0 1.25px rgba(12, 74, 110, 0.75),
    0 1px 2px rgba(6, 32, 52, 0.58),
    0 0 7px rgba(3, 105, 161, 0.38);
  --sk-open-text-shadow-active:
    0 0 0.65px rgba(4, 28, 44, 0.95),
    0 0 2px rgba(14, 116, 144, 0.85),
    0 1px 3px rgba(2, 22, 36, 0.62),
    0 0 10px rgba(56, 189, 248, 0.45);
  --sk-open-arrow-filter-hover:
    drop-shadow(0 0 0.45px rgba(8, 38, 62, 0.92))
    drop-shadow(0 0 1.25px rgba(12, 74, 110, 0.78))
    drop-shadow(0 1px 2px rgba(6, 32, 52, 0.55))
    drop-shadow(0 0 6px rgba(3, 105, 161, 0.36));
  --sk-open-arrow-filter-active:
    drop-shadow(0 0 0.65px rgba(4, 28, 44, 0.98))
    drop-shadow(0 0 2px rgba(14, 116, 144, 0.88))
    drop-shadow(0 1px 3px rgba(2, 22, 36, 0.62))
    drop-shadow(0 0 9px rgba(56, 189, 248, 0.44));
  --sk-social-border: rgba(3, 105, 161, 0.42);
  --sk-social-shadow:
    rgba(8, 42, 68, 0.22) 0 4px 8px -2px,
    inset 0 0 0 1px rgba(14, 116, 144, 0.22),
    inset 0 -1px 4px rgba(8, 38, 62, 0.14),
    0 0 5px rgba(2, 132, 199, 0.1);
  --sk-social-shadow-hover:
    rgba(6, 36, 58, 0.3) -2px 6px 12px 0,
    inset 0 0 0 1px rgba(2, 132, 199, 0.3),
    inset 0 -1px 5px rgba(6, 32, 52, 0.18),
    0 0 9px rgba(2, 132, 199, 0.16);
  --sk-orbit-icon-filter:
    drop-shadow(0 0 0.45px rgba(8, 38, 62, 0.92))
    drop-shadow(0 0 1.25px rgba(12, 74, 110, 0.78))
    drop-shadow(0 1px 2.5px rgba(6, 32, 52, 0.52))
    drop-shadow(0 0 5px rgba(3, 105, 161, 0.32));
  --sk-orbit-icon-filter-hover:
    drop-shadow(0 0 0.65px rgba(6, 32, 52, 0.98))
    drop-shadow(0 0 2px rgba(3, 105, 161, 0.88))
    drop-shadow(0 2px 4px rgba(4, 28, 44, 0.58))
    drop-shadow(0 0 9px rgba(2, 132, 199, 0.42));
  --sk-orbit-icon-filter-active:
    drop-shadow(0 0 0.85px rgba(4, 28, 44, 1))
    drop-shadow(0 0 2.5px rgba(14, 116, 144, 0.92))
    drop-shadow(0 2px 5px rgba(2, 22, 36, 0.62))
    drop-shadow(0 0 12px rgba(56, 189, 248, 0.48));
}

.secular-knowledge-page .ux-parent--prism {
  --ux-grad: conic-gradient(from 200deg at 65% 35%, #22d3ee, #818cf8, #f472b6, #facc15, #22d3ee);
  --ux-title: #0f172a;
  --ux-body: rgba(15, 23, 42, 0.88);
  --ux-cta: #4338ca;
  --ux-orbit: rgba(255, 255, 255, 0.35);
  --ux-fill: #312e81;
  --sk-tile-bg: rgba(49, 46, 129, 0.2);
  --sk-tile-bg-hover: rgba(42, 38, 112, 0.28);
  --sk-tile-border: rgba(67, 56, 202, 0.48);
  --sk-tile-border-hover: rgba(79, 70, 229, 0.58);
  --sk-tile-shadow:
    rgba(30, 27, 75, 0.34) -5px 7px 16px 0,
    inset 0 0 0 1px rgba(79, 70, 229, 0.26),
    inset 0 -2px 6px rgba(30, 27, 75, 0.24);
  --sk-tile-shadow-hover:
    rgba(24, 22, 62, 0.4) -5px 8px 18px 0,
    inset 0 0 0 1px rgba(99, 102, 241, 0.32),
    inset 0 -2px 8px rgba(24, 22, 62, 0.28),
    0 0 10px rgba(99, 102, 241, 0.18);
  --sk-tile-shadow-active:
    rgba(20, 18, 52, 0.44) -4px 6px 14px 0,
    inset 0 0 0 1px rgba(129, 140, 248, 0.38),
    inset 0 -3px 10px rgba(20, 18, 52, 0.32),
    0 0 8px rgba(129, 140, 248, 0.24);
  --sk-open-text-shadow-hover:
    0 0 0.5px rgba(30, 27, 75, 0.9),
    0 0 1.25px rgba(49, 46, 129, 0.75),
    0 1px 2px rgba(24, 22, 62, 0.58),
    0 0 7px rgba(67, 56, 202, 0.38);
  --sk-open-text-shadow-active:
    0 0 0.65px rgba(20, 18, 52, 0.95),
    0 0 2px rgba(79, 70, 229, 0.85),
    0 1px 3px rgba(15, 14, 42, 0.62),
    0 0 10px rgba(129, 140, 248, 0.45);
  --sk-open-arrow-filter-hover:
    drop-shadow(0 0 0.45px rgba(30, 27, 75, 0.92))
    drop-shadow(0 0 1.25px rgba(49, 46, 129, 0.78))
    drop-shadow(0 1px 2px rgba(24, 22, 62, 0.55))
    drop-shadow(0 0 6px rgba(67, 56, 202, 0.36));
  --sk-open-arrow-filter-active:
    drop-shadow(0 0 0.65px rgba(20, 18, 52, 0.98))
    drop-shadow(0 0 2px rgba(79, 70, 229, 0.88))
    drop-shadow(0 1px 3px rgba(15, 14, 42, 0.62))
    drop-shadow(0 0 9px rgba(129, 140, 248, 0.44));
  --sk-social-border: rgba(67, 56, 202, 0.4);
  --sk-social-shadow:
    rgba(30, 27, 75, 0.22) 0 4px 8px -2px,
    inset 0 0 0 1px rgba(79, 70, 229, 0.2),
    inset 0 -1px 4px rgba(30, 27, 75, 0.14),
    0 0 5px rgba(99, 102, 241, 0.1);
  --sk-social-shadow-hover:
    rgba(24, 22, 62, 0.3) -2px 6px 12px 0,
    inset 0 0 0 1px rgba(99, 102, 241, 0.28),
    inset 0 -1px 5px rgba(24, 22, 62, 0.18),
    0 0 9px rgba(99, 102, 241, 0.16);
  --sk-orbit-icon-filter:
    drop-shadow(0 0 0.45px rgba(30, 27, 75, 0.92))
    drop-shadow(0 0 1.25px rgba(49, 46, 129, 0.78))
    drop-shadow(0 1px 2.5px rgba(24, 22, 62, 0.52))
    drop-shadow(0 0 5px rgba(67, 56, 202, 0.32));
  --sk-orbit-icon-filter-hover:
    drop-shadow(0 0 0.65px rgba(24, 22, 62, 0.98))
    drop-shadow(0 0 2px rgba(67, 56, 202, 0.88))
    drop-shadow(0 2px 4px rgba(20, 18, 52, 0.58))
    drop-shadow(0 0 9px rgba(99, 102, 241, 0.42));
  --sk-orbit-icon-filter-active:
    drop-shadow(0 0 0.85px rgba(20, 18, 52, 1))
    drop-shadow(0 0 2.5px rgba(79, 70, 229, 0.92))
    drop-shadow(0 2px 5px rgba(15, 14, 42, 0.62))
    drop-shadow(0 0 12px rgba(129, 140, 248, 0.48));
}

.secular-knowledge-page .ux-parent--void {
  --ux-grad: linear-gradient(160deg, #0f172a 0%, #1e1b4b 50%, #312e81 100%);
  --ux-title: #5eead4;
  --ux-body: rgba(203, 213, 225, 0.82);
  --ux-cta: #c084fc;
  --ux-orbit: rgba(167, 139, 250, 0.25);
  --ux-fill: #c084fc;
  --sk-tile-bg: rgba(30, 27, 75, 0.42);
  --sk-tile-bg-hover: rgba(36, 32, 88, 0.52);
  --sk-tile-border: rgba(109, 40, 217, 0.55);
  --sk-tile-border-hover: rgba(139, 92, 246, 0.65);
  --sk-tile-shadow:
    rgba(15, 12, 42, 0.42) -5px 7px 16px 0,
    inset 0 0 0 1px rgba(124, 58, 237, 0.32),
    inset 0 -2px 6px rgba(20, 16, 58, 0.28);
  --sk-tile-shadow-hover:
    rgba(12, 10, 36, 0.48) -5px 8px 18px 0,
    inset 0 0 0 1px rgba(139, 92, 246, 0.38),
    inset 0 -2px 8px rgba(16, 12, 48, 0.32),
    0 0 10px rgba(139, 92, 246, 0.22);
  --sk-tile-shadow-active:
    rgba(10, 8, 30, 0.52) -4px 6px 14px 0,
    inset 0 0 0 1px rgba(167, 139, 250, 0.42),
    inset 0 -3px 10px rgba(12, 10, 36, 0.36),
    0 0 8px rgba(167, 139, 250, 0.28);
  --sk-open-text-shadow-hover:
    0 0 0.5px rgba(12, 10, 36, 0.92),
    0 0 1.25px rgba(109, 40, 217, 0.78),
    0 1px 2px rgba(8, 6, 28, 0.6),
    0 0 7px rgba(167, 139, 250, 0.4);
  --sk-open-text-shadow-active:
    0 0 0.65px rgba(8, 6, 24, 0.98),
    0 0 2px rgba(167, 139, 250, 0.88),
    0 1px 3px rgba(4, 2, 18, 0.65),
    0 0 10px rgba(216, 180, 254, 0.48);
  --sk-open-arrow-filter-hover:
    drop-shadow(0 0 0.45px rgba(12, 10, 36, 0.95))
    drop-shadow(0 0 1.25px rgba(109, 40, 217, 0.82))
    drop-shadow(0 1px 2px rgba(8, 6, 28, 0.58))
    drop-shadow(0 0 6px rgba(167, 139, 250, 0.38));
  --sk-open-arrow-filter-active:
    drop-shadow(0 0 0.65px rgba(8, 6, 24, 1))
    drop-shadow(0 0 2px rgba(167, 139, 250, 0.92))
    drop-shadow(0 1px 3px rgba(4, 2, 18, 0.65))
    drop-shadow(0 0 9px rgba(216, 180, 254, 0.46));
  --sk-social-border: rgba(109, 40, 217, 0.48);
  --sk-social-shadow:
    rgba(15, 12, 42, 0.26) 0 4px 8px -2px,
    inset 0 0 0 1px rgba(124, 58, 237, 0.24),
    inset 0 -1px 4px rgba(20, 16, 58, 0.16),
    0 0 5px rgba(139, 92, 246, 0.12);
  --sk-social-shadow-hover:
    rgba(12, 10, 36, 0.34) -2px 6px 12px 0,
    inset 0 0 0 1px rgba(139, 92, 246, 0.32),
    inset 0 -1px 5px rgba(16, 12, 48, 0.2),
    0 0 9px rgba(167, 139, 250, 0.18);
  --sk-orbit-icon-filter:
    drop-shadow(0 0 0.55px rgba(12, 10, 36, 0.95))
    drop-shadow(0 0 1.5px rgba(109, 40, 217, 0.82))
    drop-shadow(0 1px 3px rgba(8, 6, 28, 0.58))
    drop-shadow(0 0 6px rgba(167, 139, 250, 0.38));
  --sk-orbit-icon-filter-hover:
    drop-shadow(0 0 0.75px rgba(10, 8, 30, 1))
    drop-shadow(0 0 2px rgba(139, 92, 246, 0.92))
    drop-shadow(0 2px 4px rgba(6, 4, 22, 0.62))
    drop-shadow(0 0 10px rgba(192, 132, 252, 0.48));
  --sk-orbit-icon-filter-active:
    drop-shadow(0 0 0.95px rgba(8, 6, 24, 1))
    drop-shadow(0 0 2.5px rgba(167, 139, 250, 0.96))
    drop-shadow(0 2px 5px rgba(4, 2, 18, 0.68))
    drop-shadow(0 0 14px rgba(216, 180, 254, 0.52));
  filter: drop-shadow(0 28px 50px rgba(0, 40, 30, 0.45));
}

.secular-knowledge-page .ux-parent--void .ux-card {
  box-shadow:
    0 0 0 1px rgba(167, 139, 250, 0.2),
    rgba(5, 71, 17, 0) 40px 50px 25px -40px,
    rgba(0, 0, 0, 0.5) 0 25px 35px -5px;
}

/* Chamfer card — shape on inner layer, 3D on outer card */
.secular-knowledge-page .ux-parent--cut {
  overflow: visible;
  filter: drop-shadow(0 28px 50px rgba(76, 29, 149, 0.48));
}

.secular-knowledge-page .ux-parent--cut .ux-card {
  background: transparent;
  clip-path: none;
  border-radius: 36px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -3px 14px rgba(59, 7, 100, 0.32),
    0 6px 0 rgba(76, 29, 149, 0.58),
    rgba(91, 33, 182, 0.42) 0 28px 28px -8px,
    rgba(192, 132, 252, 0.2) 0 0 48px -12px;
}

.secular-knowledge-page .ux-parent--cut .ux-card-shape {
  position: absolute;
  inset: 0;
  border-radius: 36px;
  clip-path: var(--sk-chamfer-clip);
  background: var(--ux-grad);
  transform: translate3d(0, 0, 2px);
  pointer-events: none;
  box-shadow: inset 0 -18px 36px rgba(59, 7, 100, 0.18);
}

.secular-knowledge-page .ux-parent--cut .ux-card-shape::after {
  content: '';
  position: absolute;
  inset: 0;
  clip-path: var(--sk-chamfer-clip);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.1) 0%, transparent 42%, rgba(59, 7, 100, 0.22) 100%);
  transform: translate3d(0, 0, 1px);
}

.secular-knowledge-page .ux-parent--cut .ux-glass {
  inset: 8px;
  border-radius: 55px;
  border-top-right-radius: 100%;
  clip-path: none;
  transform: translate3d(0, 0, 30px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    inset 0 -10px 28px rgba(91, 33, 182, 0.14);
}

.secular-knowledge-page .ux-parent--cut .ux-content {
  transform: translate3d(0, 0, 38px);
}

.secular-knowledge-page .ux-parent--cut .ux-bottom {
  transform: translate3d(0, 0, 38px);
}

.secular-knowledge-page .ux-parent--cut:hover .ux-card,
.secular-knowledge-page .ux-parent--cut:focus-within .ux-card {
  transform: rotate3d(1, 1, 0, 28deg);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.28),
    0 6px 0 rgba(76, 29, 149, 0.62),
    rgba(91, 33, 182, 0.55) 28px 48px 28px -38px,
    rgba(192, 132, 252, 0.24) 0 0 60px -10px,
    rgba(91, 33, 182, 0.18) 0 25px 35px 0;
}

.secular-knowledge-page .ux-parent--cut:hover .ux-card-shape,
.secular-knowledge-page .ux-parent--cut:focus-within .ux-card-shape {
  transform: translate3d(0, 0, 4px);
}

.secular-knowledge-page .ux-parent--cut:hover .ux-glass,
.secular-knowledge-page .ux-parent--cut:focus-within .ux-glass {
  transform: translate3d(0, 0, 34px);
}

.secular-knowledge-page .ux-parent--wide .ux-card {
  border-radius: 44px;
  transform-origin: left center;
}

.secular-knowledge-page .ux-parent--wide .ux-glass {
  border-radius: 48px;
  border-top-right-radius: 55%;
}

.secular-knowledge-page .ux-parent--wide .ux-content {
  padding: 5rem 52% 0 clamp(2.85rem, 2.4rem + 0.9vw, 3.35rem) !important;
}

.secular-knowledge-page .ux-parent--wide .ux-logo {
  inset-inline-end: 12px;
}

.secular-knowledge-page .ux-parent--wide .ux-logo .ux-circle:nth-child(2) {
  transform: translate3d(0, 0, 38px);
}

/* Glass */
.secular-knowledge-page .ux-glass {
  transform-style: preserve-3d;
  position: absolute;
  inset: 8px;
  border-radius: 55px;
  border-top-right-radius: 100%;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0.38) 0%, rgba(255, 255, 255, 0.82) 100%);
  transform: translate3d(0, 0, 25px);
  border-inline-start: 1px solid var(--glass-edge);
  border-bottom: 1px solid rgba(255, 255, 255, 0.75);
  transition: all 0.5s ease-in-out;
  pointer-events: none;
}

.secular-knowledge-page .ux-parent--void .ux-glass {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.12) 0%, rgba(15, 23, 42, 0.55) 100%);
  border-color: rgba(148, 163, 184, 0.25);
}

/* Logo orbits */
.secular-knowledge-page .ux-logo {
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  transform-style: preserve-3d;
  pointer-events: none;
  z-index: 2;
}

.secular-knowledge-page .ux-circle {
  display: block;
  position: absolute;
  aspect-ratio: 1;
  border-radius: var(--sk-orbit-radius);
  border: 1px solid rgba(255, 255, 255, 0.16);
  top: 0;
  inset-inline-end: 0;
  background: var(--ux-orbit);
  box-shadow: rgba(100, 100, 111, 0.25) -10px 10px 24px 0;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  transition: all 0.5s ease-in-out;
}

.secular-knowledge-page .ux-circle:nth-child(1) {
  width: 170px;
  transform: translate3d(0, 0, 20px);
  top: 8px;
  inset-inline-end: 8px;
}

.secular-knowledge-page .ux-circle:nth-child(2) {
  width: 140px;
  transform: translate3d(0, 0, 40px);
  top: 10px;
  inset-inline-end: 10px;
  backdrop-filter: blur(4px);
  transition-delay: 0.05s;
}

.secular-knowledge-page .ux-circle:nth-child(3) {
  width: 110px;
  transform: translate3d(0, 0, 60px);
  top: 17px;
  inset-inline-end: 17px;
  transition-delay: 0.1s;
}

.secular-knowledge-page .ux-circle:nth-child(4) {
  width: 80px;
  transform: translate3d(0, 0, 80px);
  top: 23px;
  inset-inline-end: 23px;
  transition-delay: 0.15s;
}

.secular-knowledge-page .ux-circle:nth-child(5) {
  width: 50px;
  transform: translate3d(0, 0, 100px);
  top: 30px;
  inset-inline-end: 30px;
  display: grid;
  place-content: center;
  transition-delay: 0.2s;
}

.secular-knowledge-page .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-circle:nth-child(5) .ux-orbit-logo {
  width: 38px;
  height: 38px;
  object-fit: contain;
  display: block;
}

.secular-knowledge-page .ux-circle:nth-child(5) .ux-orbit-logo {
  mix-blend-mode: lighten;
}

.secular-knowledge-page .ux-circle:nth-child(5) svg {
  fill: #fff;
}

/* Icon tile (5th orbit) — mint reference, per-card tokens on .ux-parent--* */
.secular-knowledge-page .ux-parent--mint .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--violet .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--solar .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--ocean .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--prism .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--void .ux-circle:nth-child(5) {
  position: relative;
  background: var(--sk-tile-bg);
  border-color: var(--sk-tile-border);
  box-shadow: var(--sk-tile-shadow);
}

.secular-knowledge-page .ux-parent--mint .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--violet .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--solar .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--ocean .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--prism .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--void .ux-circle:nth-child(5) .ux-orbit-logo {
  mix-blend-mode: normal;
  filter: var(--sk-orbit-icon-filter);
  transition: filter 0.35s ease;
}

.secular-knowledge-page .ux-parent--mint .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--violet .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--solar .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--ocean .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--prism .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--void .ux-circle:nth-child(5) svg {
  filter: var(--sk-orbit-icon-filter);
  transition: filter 0.35s ease;
}

.secular-knowledge-page .ux-parent--mint:hover .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--mint:focus-within .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--violet:hover .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--violet:focus-within .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--solar:hover .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--solar:focus-within .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--ocean:hover .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--ocean:focus-within .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--prism:hover .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--prism:focus-within .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--void:hover .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--void:focus-within .ux-circle:nth-child(5) {
  background: var(--sk-tile-bg-hover);
  border-color: var(--sk-tile-border-hover);
  box-shadow: var(--sk-tile-shadow-hover);
}

.secular-knowledge-page .ux-parent--mint:hover .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--mint:focus-within .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--mint:hover .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--mint:focus-within .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--violet:hover .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--violet:focus-within .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--violet:hover .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--violet:focus-within .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--solar:hover .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--solar:focus-within .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--solar:hover .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--solar:focus-within .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--ocean:hover .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--ocean:focus-within .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--ocean:hover .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--ocean:focus-within .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--prism:hover .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--prism:focus-within .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--prism:hover .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--prism:focus-within .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--void:hover .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--void:focus-within .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--void:hover .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--void:focus-within .ux-circle:nth-child(5) svg {
  filter: var(--sk-orbit-icon-filter-hover) brightness(1.05) contrast(1.06);
}

.secular-knowledge-page .ux-parent--mint:active .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--violet:active .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--solar:active .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--ocean:active .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--prism:active .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent--void:active .ux-circle:nth-child(5) {
  box-shadow: var(--sk-tile-shadow-active);
}

.secular-knowledge-page .ux-parent--mint:active .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--mint:active .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--violet:active .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--violet:active .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--solar:active .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--solar:active .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--ocean:active .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--ocean:active .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--prism:active .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--prism:active .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--void:active .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--void:active .ux-circle:nth-child(5) svg {
  filter: var(--sk-orbit-icon-filter-active) brightness(1.08) contrast(1.1);
}

.secular-knowledge-page .ux-parent--mint[data-secular-card='arabic'] .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--mint[data-secular-card='arabic'] .ux-circle:nth-child(5) svg {
  filter: var(--sk-orbit-icon-filter) brightness(1.03) contrast(1.04);
}

.secular-knowledge-page .ux-parent--mint[data-secular-card='arabic']:hover .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--mint[data-secular-card='arabic']:focus-within .ux-circle:nth-child(5) .ux-orbit-logo,
.secular-knowledge-page .ux-parent--mint[data-secular-card='arabic']:hover .ux-circle:nth-child(5) svg,
.secular-knowledge-page .ux-parent--mint[data-secular-card='arabic']:focus-within .ux-circle:nth-child(5) svg {
  filter: var(--sk-orbit-icon-filter-hover) brightness(1.06) contrast(1.08);
}

.secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(2),
.secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(2) {
  transform: translate3d(0, 0, 60px);
}

.secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(3),
.secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(3) {
  transform: translate3d(0, 0, 80px);
}

.secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(4),
.secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(4) {
  transform: translate3d(0, 0, 100px);
}

.secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(5),
.secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(5) {
  transform: translate3d(0, 0, 120px);
}

/* Content — low Z follows card perspective; stable XY on hover */
.secular-knowledge-page .ux-content {
  padding: 100px 3.75rem 0 1.85rem;
  transform: translate3d(0, 0, var(--sk-text-depth));
  transform-origin: left center;
  position: relative;
  z-index: 3;
}

.secular-knowledge-page .ux-title {
  display: block;
  color: var(--ux-title);
  font-weight: 900;
  font-size: 1.25rem;
  letter-spacing: -0.02em;
  transform: none;
}

.secular-knowledge-page .ux-text {
  display: block;
  margin-top: 1.05rem;
  color: var(--ux-body);
  font-size: 0.95rem;
  line-height: 1.5;
  font-weight: 600;
  transform: none;
}

/* Mint card — original title/description layout */
.secular-knowledge-page .ux-parent--mint .ux-title {
  white-space: nowrap;
}

.secular-knowledge-page .ux-parent--mint .ux-text {
  line-height: 1.35;
}

@media (min-width: 641px) {
  .secular-knowledge-page .ux-content {
    padding-left: 2.35rem;
  }

  .secular-knowledge-page .ux-parent--mint .ux-content {
    padding-right: 5rem;
    max-width: 58%;
    transform: translate3d(0, 0, var(--sk-text-depth));
  }

  .secular-knowledge-page .ux-parent--mint .ux-title {
    position: relative;
    z-index: 6;
    transform: none;
    font-size: 1.12rem;
  }

  .secular-knowledge-page .ux-parent--mint .ux-text {
    font-size: 0.88rem;
    margin-top: 0.85rem;
  }

  .secular-knowledge-page .ux-parent--mint .ux-glass {
    inset: 8px;
    border-radius: 55px;
    border-top-right-radius: 100%;
    clip-path: none;
    transform: translate3d(0, 0, 16px);
    opacity: 0.92;
  }

  .secular-knowledge-page .ux-parent--mint .ux-bottom {
    transform: translate3d(0, 0, 44px);
  }
}

@media (min-width: 1024px) {
  .secular-knowledge-page .ux-parent--mint .ux-content {
    max-width: 56%;
    padding-right: 5.25rem;
  }
}

/* Narrow desktop — text above orbit hover max (120px); stable translateZ, no XY change */
@media (max-width: 1100px) and (min-width: 641px) {
  .secular-knowledge-page .ux-parent:not(.ux-parent--wide) .ux-content {
    transform: translate3d(0, 0, 130px);
  }
}

.secular-knowledge-page .ux-text--parts {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  row-gap: 0.15em;
}

.secular-knowledge-page .ux-text-part,
.secular-knowledge-page .ux-text-sep {
  white-space: nowrap;
}

.secular-knowledge-page .ux-text--marked {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.38rem;
}

.secular-knowledge-page .ux-text-line {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  white-space: nowrap;
}

.secular-knowledge-page .ux-text-marker {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  border-radius: 2px;
  border: 1px solid rgba(0, 88, 52, 0.8);
  background: linear-gradient(
    145deg,
    rgba(0, 105, 58, 0.95) 0%,
    rgba(0, 165, 98, 0.82) 45%,
    rgba(120, 255, 210, 0.62) 100%
  );
  box-shadow:
    inset 0 0 5px rgba(255, 255, 255, 0.5),
    inset 0 -1px 2px rgba(0, 55, 32, 0.45),
    0 0 7px rgba(0, 130, 78, 0.55),
    0 1px 2px rgba(0, 45, 28, 0.45);
  animation: sk-text-marker-shimmer 3.8s ease-in-out infinite;
}

.secular-knowledge-page .ux-text-line:nth-child(2) .ux-text-marker {
  animation-delay: 0.35s;
}

.secular-knowledge-page .ux-text-line:nth-child(3) .ux-text-marker {
  animation-delay: 0.7s;
}

@keyframes sk-text-marker-shimmer {
  0%,
  100% {
    opacity: 0.88;
    filter: brightness(1);
    box-shadow:
      inset 0 0 4px rgba(255, 255, 255, 0.4),
      inset 0 -1px 2px rgba(0, 55, 32, 0.4),
      0 0 6px rgba(0, 120, 72, 0.45),
      0 1px 2px rgba(0, 45, 28, 0.4);
  }

  50% {
    opacity: 1;
    filter: brightness(1.22);
    box-shadow:
      inset 0 0 7px rgba(255, 255, 255, 0.65),
      inset 0 -1px 3px rgba(0, 55, 32, 0.35),
      0 0 12px rgba(0, 200, 130, 0.65),
      0 1px 3px rgba(0, 45, 28, 0.35);
  }
}

/* Bottom bar */
.secular-knowledge-page .ux-bottom {
  padding: 10px 12px;
  transform-style: preserve-3d;
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transform: translate3d(0, 0, 26px);
  z-index: 4;
}

.secular-knowledge-page .ux-social {
  display: flex;
  gap: 10px;
  transform-style: preserve-3d;
}

.secular-knowledge-page .ux-social-btn {
  width: 32px;
  aspect-ratio: 1;
  padding: 6px;
  background: #fff;
  border-radius: clamp(5px, 14%, 7px);
  border: 1px solid var(--sk-social-border, rgba(255, 255, 255, 0.2));
  display: grid;
  place-content: center;
  cursor: pointer;
  box-shadow: var(--sk-social-shadow, rgba(5, 71, 17, 0.45) 0 8px 6px -5px);
  transition:
    transform 0.2s ease-in-out,
    box-shadow 0.2s ease-in-out,
    background 0.2s;
  -webkit-tap-highlight-color: transparent;
}

.secular-knowledge-page .ux-social-btn:nth-child(1) {
  transition-delay: 0.05s;
}

.secular-knowledge-page .ux-social-btn:nth-child(2) {
  transition-delay: 0.1s;
}

.secular-knowledge-page .ux-social-btn:nth-child(3) {
  transition-delay: 0.15s;
}

.secular-knowledge-page .ux-social-logo {
  width: 18px;
  height: 18px;
  object-fit: contain;
  display: block;
  background: transparent;
  pointer-events: none;
  transition: filter 0.2s ease;
}

.secular-knowledge-page .ux-social-btn:hover,
.secular-knowledge-page .ux-social-btn:focus-visible,
.secular-knowledge-page .ux-social-btn:active {
  background: #0f172a;
  outline: none;
}

.secular-knowledge-page .ux-social-btn:hover .ux-social-logo,
.secular-knowledge-page .ux-social-btn:focus-visible .ux-social-logo,
.secular-knowledge-page .ux-social-btn:active .ux-social-logo {
  filter: brightness(0) invert(1);
}

.secular-knowledge-page .ux-parent--mint:hover .ux-social-btn,
.secular-knowledge-page .ux-parent--mint:focus-within .ux-social-btn,
.secular-knowledge-page .ux-parent--violet:hover .ux-social-btn,
.secular-knowledge-page .ux-parent--violet:focus-within .ux-social-btn,
.secular-knowledge-page .ux-parent--solar:hover .ux-social-btn,
.secular-knowledge-page .ux-parent--solar:focus-within .ux-social-btn,
.secular-knowledge-page .ux-parent--ocean:hover .ux-social-btn,
.secular-knowledge-page .ux-parent--ocean:focus-within .ux-social-btn,
.secular-knowledge-page .ux-parent--prism:hover .ux-social-btn,
.secular-knowledge-page .ux-parent--prism:focus-within .ux-social-btn,
.secular-knowledge-page .ux-parent--void:hover .ux-social-btn,
.secular-knowledge-page .ux-parent--void:focus-within .ux-social-btn {
  transform: translate3d(0, 0, 50px);
  box-shadow: var(--sk-social-shadow-hover);
}

.secular-knowledge-page .ux-more {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 42%;
  justify-content: flex-end;
  transition: transform 0.2s ease;
}

@media (hover: hover) and (pointer: fine) {
  .secular-knowledge-page .ux-more:hover {
    transform: translate3d(0, 0, 10px);
  }

  .secular-knowledge-page .ux-more:hover .ux-more-btn,
  .secular-knowledge-page .ux-more-btn:hover {
    text-shadow: var(--sk-open-text-shadow-hover);
  }

  .secular-knowledge-page .ux-more:hover svg {
    filter: var(--sk-open-arrow-filter-hover);
  }
}

.secular-knowledge-page .ux-more:focus-within {
  transform: translate3d(0, 0, 10px);
}

.secular-knowledge-page .ux-more:focus-within .ux-more-btn,
.secular-knowledge-page .ux-more-btn:focus-visible {
  text-shadow: var(--sk-open-text-shadow-hover);
}

.secular-knowledge-page .ux-more:focus-within svg {
  filter: var(--sk-open-arrow-filter-hover);
}

.secular-knowledge-page .ux-more-btn:active,
.secular-knowledge-page .ux-more:has(.ux-more-btn:active) .ux-more-btn {
  text-shadow: var(--sk-open-text-shadow-active);
}

.secular-knowledge-page .ux-more:has(.ux-more-btn:active) svg {
  filter: var(--sk-open-arrow-filter-active);
}

.secular-knowledge-page .ux-more-btn {
  background: none;
  border: none;
  color: var(--ux-cta);
  font-weight: 800;
  font-size: 0.75rem;
  font-family: inherit;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  text-shadow: none;
  transition: text-shadow 0.22s ease;
  -webkit-tap-highlight-color: transparent;
}

.secular-knowledge-page .ux-more-btn:focus {
  outline: none;
}

.secular-knowledge-page .ux-more-btn:focus-visible {
  outline: none;
}

.secular-knowledge-page .ux-more svg {
  fill: none;
  stroke: var(--ux-cta);
  stroke-width: 3px;
  max-height: 15px;
  width: 18px;
  filter: none;
  transition: filter 0.22s ease;
}

/* Responsive */
@media (max-width: 640px) {
  .secular-knowledge-page .ux-parent {
    height: auto;
    min-height: 280px;
  }

  .secular-knowledge-page .ux-parent--wide {
    height: auto;
    min-height: 252px;
  }

  .secular-knowledge-page .ux-content {
    padding-top: 92px;
    padding-right: 3rem;
    max-width: calc(100% - 0.25rem);
  }

  .secular-knowledge-page .ux-title {
    font-size: 1.12rem;
  }

  .secular-knowledge-page .ux-text {
    font-size: 0.84rem;
    line-height: 1.4;
    margin-top: 0.85rem;
    max-width: min(100%, 11.75rem);
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  /* Android font metrics are slightly wider — allow part wrap, avoid clip of «Аллах» */
  .secular-knowledge-page .ux-text--parts {
    max-width: min(100%, 11.75rem);
    column-gap: 0.2em;
    row-gap: 0.12em;
  }

  .secular-knowledge-page .ux-text-part,
  .secular-knowledge-page .ux-text-sep {
    white-space: normal;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: break-word;
  }

  .secular-knowledge-page .ux-parent--mint .ux-title {
    font-size: 1.08rem;
  }

  .secular-knowledge-page .ux-parent--mint .ux-text {
    font-size: 0.8rem;
    line-height: 1.4;
  }

  .secular-knowledge-page .ux-content {
    pointer-events: none;
  }

  .secular-knowledge-page .ux-bottom {
    z-index: 8;
    transform: translate3d(0, 0, 48px);
  }

  .secular-knowledge-page .ux-more-btn {
    min-height: 44px;
    padding: 0.5rem 0.35rem;
    position: relative;
    z-index: 2;
  }
}

@media (max-width: 430px) {
  .secular-knowledge-page .ux-text,
  .secular-knowledge-page .ux-text--parts {
    max-width: min(100%, 11.25rem);
  }
}

@media (max-width: 390px) {
  .secular-knowledge-page {
    --sk-main-pad-x: 0.85rem;
  }

  .secular-knowledge-page .ux-parent {
    min-height: 268px;
  }

  .secular-knowledge-page .ux-circle:nth-child(1) {
    width: 150px;
  }

  .secular-knowledge-page .ux-circle:nth-child(2) {
    width: 124px;
  }

  .secular-knowledge-page .ux-circle:nth-child(3) {
    width: 98px;
  }

  .secular-knowledge-page .ux-content {
    padding-left: 1.45rem;
    padding-right: 2.35rem;
  }

  .secular-knowledge-page .ux-text {
    font-size: 0.8rem;
    line-height: 1.38;
    max-width: min(100%, 10.75rem);
  }

  .secular-knowledge-page .ux-text--parts {
    max-width: min(100%, 10.75rem);
  }

  .secular-knowledge-page .ux-bottom {
    left: 14px;
    right: 14px;
    bottom: 16px;
  }
}

@media (max-width: 360px) {
  .secular-knowledge-page .ux-title {
    font-size: 1.05rem;
  }

  .secular-knowledge-page .ux-text {
    font-size: 0.76rem;
    line-height: 1.36;
    max-width: min(100%, 10.25rem);
  }

  .secular-knowledge-page .ux-text--parts {
    max-width: min(100%, 10.25rem);
  }

  .secular-knowledge-page .ux-more-btn {
    font-size: 0.7rem;
  }
}

@media (max-width: 320px) {
  .secular-knowledge-page .ux-content {
    padding-left: 1.25rem;
    padding-right: 2.1rem;
  }

  .secular-knowledge-page .ux-text {
    font-size: 0.72rem;
    line-height: 1.35;
    max-width: min(100%, 9.75rem);
  }

  .secular-knowledge-page .ux-text--parts {
    max-width: min(100%, 9.75rem);
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .secular-knowledge-page .ux-card,
  .secular-knowledge-page .ux-circle,
  .secular-knowledge-page .ux-text-marker,
  .secular-knowledge-page .ux-social-btn,
  .secular-knowledge-page .ux-more,
  .secular-knowledge-page .ux-more-btn,
  .secular-knowledge-back {
    transition: none !important;
  }

  .secular-knowledge-page .ux-parent--mint .ux-circle:nth-child(5) .ux-orbit-logo,
  .secular-knowledge-page .ux-parent--mint .ux-circle:nth-child(5) svg,
  .secular-knowledge-page .ux-parent--violet .ux-circle:nth-child(5) .ux-orbit-logo,
  .secular-knowledge-page .ux-parent--violet .ux-circle:nth-child(5) svg,
  .secular-knowledge-page .ux-parent--solar .ux-circle:nth-child(5) .ux-orbit-logo,
  .secular-knowledge-page .ux-parent--solar .ux-circle:nth-child(5) svg,
  .secular-knowledge-page .ux-parent--ocean .ux-circle:nth-child(5) .ux-orbit-logo,
  .secular-knowledge-page .ux-parent--ocean .ux-circle:nth-child(5) svg,
  .secular-knowledge-page .ux-parent--prism .ux-circle:nth-child(5) .ux-orbit-logo,
  .secular-knowledge-page .ux-parent--prism .ux-circle:nth-child(5) svg,
  .secular-knowledge-page .ux-parent--void .ux-circle:nth-child(5) .ux-orbit-logo,
  .secular-knowledge-page .ux-parent--void .ux-circle:nth-child(5) svg {
    transition: none !important;
  }

  .secular-knowledge-page .ux-parent:hover .ux-card,
  .secular-knowledge-page .ux-parent:focus-within .ux-card {
    transform: none;
  }

  .secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(2),
  .secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(3),
  .secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(4),
  .secular-knowledge-page .ux-parent:hover .ux-circle:nth-child(5),
  .secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(2),
  .secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(3),
  .secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(4),
  .secular-knowledge-page .ux-parent:focus-within .ux-circle:nth-child(5) {
    transform: inherit;
  }

  .secular-knowledge-page .ux-parent:hover .ux-social-btn,
  .secular-knowledge-page .ux-parent:focus-within .ux-social-btn {
    transform: none;
  }
}
