/* Page-only details extracted from the original static build. */
.hero-coin-wrap {
  position: relative;
  width: 145px;
  height: 145px;
  margin: 0 auto 2.25rem;
  perspective: 380px;
}
.hero-coin {
  width: 100%;
  height: 100%;
  position: relative;
  transform-style: preserve-3d;
  animation: coinFlip 4.2s ease-in-out infinite;
}
.hero-coin-front,
.hero-coin-back {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  backface-visibility: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 0 4px #070c18, 0 0 0 8px #1b3a8f, 0 0 0 11px #c91c1c,
    0 0 0 15px #070c18, 0 0 36px rgba(201,28,28,.45), 0 0 70px rgba(27,58,143,.25),
    inset 0 3px 8px rgba(255,255,255,.12), inset 0 -3px 8px rgba(0,0,0,.6);
}
.hero-coin-front { background: radial-gradient(circle at 38% 32%, #131f40, #050a10); }
.hero-coin-front img { width: 80%; height: 80%; object-fit: contain; }
.hero-coin-back {
  transform: rotateY(180deg);
  background: radial-gradient(ellipse at 35% 28%, rgba(255,255,255,.06) 0%, transparent 55%), radial-gradient(circle at 50% 50%, #0c1830, #040710);
}
.hero-coin-back::before {
  content: '';
  position: absolute;
  inset: 16%;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.055);
  box-shadow: 0 0 0 9px rgba(255,255,255,.03), 0 0 0 18px rgba(255,255,255,.02), 0 0 0 27px rgba(255,255,255,.012);
}
.hero-coin-back::after {
  content: 'UCC';
  font-family: var(--font-head);
  font-size: 1.6rem;
  font-weight: 900;
  letter-spacing: 5px;
  color: rgba(255,255,255,.065);
  position: relative;
  z-index: 1;
  text-indent: 5px;
}
.hero-coin-glow {
  position: absolute;
  bottom: -22px;
  left: 50%;
  transform: translateX(-50%);
  width: 100px;
  height: 18px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(201,28,28,.5) 0%, transparent 70%);
  filter: blur(6px);
  animation: glowPulse 4.2s ease-in-out infinite;
}
@keyframes coinFlip {
  0%, 18% { transform: rotateY(0deg); }
  46%, 64% { transform: rotateY(180deg); }
  92%, 100% { transform: rotateY(360deg); }
}
@keyframes glowPulse {
  0%, 18%, 64%, 100% { opacity: .5; transform: translateX(-50%) scaleX(1); }
  46% { opacity: .9; transform: translateX(-50%) scaleX(1.5); }
}
.hero-title { font-size: clamp(2.6rem, 7vw, 5rem) !important; letter-spacing: -2px !important; line-height: 1.05 !important; }
.hero-word { display: inline-block; opacity: 0; animation: wordReveal .6s cubic-bezier(.22,.61,.36,1) forwards; }
.hero-word-1 { animation-delay: .15s; }
.hero-word-2 { animation-delay: .35s; }
.hero-word-3 { animation-delay: .55s; font-size: 110%; position: relative; background: linear-gradient(135deg, #6a9de8 0%, var(--red-bright) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
@keyframes wordReveal { from { opacity: 0; transform: translateY(24px) skewX(-6deg); } to { opacity: 1; transform: translateY(0) skewX(0); } }
.hero-dot { color: var(--red-bright); -webkit-text-fill-color: var(--red-bright); font-weight: 900; }
.hero-dot-grad { background: var(--red-bright); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.hero-word-3::after { content: 'Captivate.'; position: absolute; inset: 0; background: inherit; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: blur(18px); opacity: .45; z-index: -1; }

.search-box { display: flex; align-items: center; gap: .75rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius); padding: .65rem 1rem; margin-bottom: 1.5rem; max-width: 420px; }
.search-box input { background: none; border: none; outline: none; color: var(--text-primary); font-family: var(--font-body); font-size: .9rem; flex: 1; min-width: 0; }
.search-box input::placeholder { color: var(--text-muted); }
.search-box i { color: var(--text-muted); }

.org-tree li { transition: all .3s ease; }
.org-node-wrap { display: inline-block; }
.dept-section { margin-bottom: 3rem; }
.dept-label { display: flex; align-items: center; gap: .75rem; font-family: var(--font-mono); font-size: .72rem; letter-spacing: 2px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 1.5rem; }
.dept-label::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.member-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.5rem; text-align: center; transition: var(--ease); }
.member-card:hover { border-color: var(--border-red); transform: translateY(-4px); box-shadow: var(--shadow-red); }
.member-card .org-avatar { width: 64px; height: 64px; font-size: 1.5rem; margin: 0 auto 1rem; }
.member-card-name { font-weight: 700; font-family: var(--font-head); margin-bottom: .25rem; }
.member-card-role { font-size: .75rem; color: var(--red-bright); font-family: var(--font-mono); margin-bottom: .5rem; }
.member-card-desc { font-size: .82rem; color: var(--text-secondary); line-height: 1.6; }
.tree-container { display: flex; flex-direction: column; align-items: center; }
.tree-row { display: flex; justify-content: center; align-items: flex-start; gap: 1.5rem; flex-wrap: wrap; }
.tree-connector, .tree-branch, .tree-child { display: flex; flex-direction: column; align-items: center; }
.tree-line-v { width: 2px; height: 40px; background: linear-gradient(180deg, var(--navy), var(--red)); }
.tree-line-h-wrap, .tree-branch, .tree-branch-children, .tree-child { position: relative; }
.tree-branch-children { display: flex; gap: 1.25rem; align-items: flex-start; padding-top: 40px; }
.tree-branch-children::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent 10%, var(--navy) 30%, var(--red) 70%, transparent 90%); }
.tree-child::before { content: ''; width: 2px; height: 40px; background: linear-gradient(180deg, var(--navy), var(--red)); }

.content-entry { max-width: 860px; }
.content-entry > * + * { margin-top: 1.25rem; }
.content-entry a { color: var(--red-bright); text-decoration: underline; }
.content-entry ul, .content-entry ol { padding-left: 1.5rem; }
.post-featured-image { border-radius: var(--radius-lg); margin-bottom: 2rem; }
.not-found { min-height: calc(100vh - 68px); display: grid; place-items: center; text-align: center; }
.not-found h1 { font-size: clamp(2.2rem, 6vw, 4rem); margin: .75rem 0; }
.not-found p { color: var(--text-secondary); margin-bottom: 2rem; }
.screen-reader-text { position: absolute; left: -9999px; }
.screen-reader-text:focus { left: 1rem; top: 1rem; z-index: 2000; padding: .75rem 1rem; background: #fff; color: #000; }

@media (prefers-reduced-motion: reduce) {
  .hero-coin, .hero-coin-glow, .hero-word { animation: none; }
  .hero-word { opacity: 1; }
}