:root {
  --ink: #0a1929;
  --ink-soft: #1a3a5c;
  --muted: #6b7e8f;
  --paper: #faf8f5;
  --paper-2: #f5f2ed;
  --white: #ffffff;
  --blue: #0a8b9e;
  --blue-deep: #066b7a;
  --cyan: #5dd9d0;
  --gold: #c9a84c;
  --gold-soft: #e8d5a3;
  --rose: #e87878;
  --mint: #6dd9a8;
  --glass: rgba(255, 255, 255, 0.78);
  --glass-strong: rgba(255, 255, 255, 0.90);
  --border: rgba(26, 58, 92, 0.10);
  --shadow: 0 24px 80px rgba(10, 25, 41, 0.10);
  --shadow-soft: 0 14px 40px rgba(10, 25, 41, 0.07);
  --radius-xl: 36px;
  --radius-lg: 28px;
  --radius-md: 20px;
  --radius-sm: 14px;
  --font-head: 'PT Serif', Georgia, serif;
  --font-body: 'PT Sans', system-ui, sans-serif;
  --ease: cubic-bezier(.16, 1, .3, 1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-body);
  color: var(--ink);
  background: radial-gradient(circle at 12% 8%, rgba(93, 217, 208, .16), transparent 28rem), radial-gradient(circle at 88% 4%, rgba(201, 168, 76, .14), transparent 30rem), linear-gradient(180deg, #ffffff 0%, var(--paper) 46%, #f8f6f2 100%);
  line-height: 1.6;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
body.nav-open { overflow: hidden; }
a { color: inherit; }
img { max-width: 100%; display: block; }
.bg-aurora { position: fixed; inset: 0; pointer-events: none; z-index: -2; overflow: hidden; contain: layout paint; clip-path: inset(0); }
.bg-aurora span { position: absolute; width: 38rem; height: 38rem; border-radius: 999px; filter: blur(48px); opacity: .42; animation: floatAura 18s var(--ease) infinite alternate; }
.bg-aurora span:nth-child(1) { left: -12rem; top: 7rem; background: rgba(93, 217, 208, .34); }
.bg-aurora span:nth-child(2) { right: -10rem; top: 16rem; background: rgba(201, 168, 76, .28); animation-delay: -5s; }
.bg-aurora span:nth-child(3) { left: 28%; bottom: -18rem; background: rgba(255, 90, 106, .16); animation-delay: -9s; }
@keyframes floatAura { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(4rem, -3rem, 0) scale(1.14); } }
.container { width: min(1180px, calc(100% - 40px)); margin: 0 auto; }
.site-header { position: sticky; top: 0; z-index: 50; padding: 14px 0; backdrop-filter: blur(22px) saturate(180%); background: rgba(250, 248, 245, .72); border-bottom: 1px solid rgba(255,255,255,.54); }
.nav-shell { display: flex; align-items: center; justify-content: center; gap: 24px; min-height: 58px; }
.brand { display: none; }
/* brand hidden — logo removed per user request */
.nav-links {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px;
  border: 2px solid rgba(255,255,255,0.75);
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.75) 0%,
      rgba(250,248,245,0.40) 40%,
      rgba(250,248,245,0.15) 100%
    );
  backdrop-filter: blur(80px) saturate(240%) brightness(1.08);
  -webkit-backdrop-filter: blur(80px) saturate(240%) brightness(1.08);
  border-radius: 999px;
  box-shadow:
    /* bright specular highlight top — liquid glass sheen */
    inset 0 2px 6px rgba(255,255,255,0.95),
    inset 0 -1px 2px rgba(255,255,255,0.35),
    /* strong top glow */
    0 -2px 4px rgba(255,255,255,0.6),
    /* deep floating shadow */
    0 16px 48px rgba(10,25,41,0.14),
    0 6px 16px rgba(10,25,41,0.08),
    /* gold refraction rim */
    0 0 0 1px rgba(201,168,76,0.22),
    /* subtle inner depth */
    inset 0 0 24px rgba(255,255,255,0.15);
  position: relative;
}
.nav-links a {
  padding: 14px 24px;
  border-radius: 999px;
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  font-family: var(--font-body);
  color: var(--ink-soft);
  letter-spacing: 0.05em;
  transition: all 0.4s var(--ease);
  position: relative;
}
.nav-links a:hover {
  color: var(--gold);
  background: rgba(201,168,76,0.08);
  box-shadow: 0 0 24px rgba(201,168,76,0.10);
}
.nav-links a.active {
  background: linear-gradient(135deg, var(--blue), var(--blue-deep));
  color: white;
  box-shadow:
    0 10px 28px rgba(10,139,158,0.30),
    inset 0 1px 2px rgba(255,255,255,0.20);
}
.nav-links a.active::after {
  content: '';
  position: absolute;
  bottom: 6px;
  left: 50%;
  transform: translateX(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 8px var(--gold);
}
.nav-toggle { display: none; border: 0; border-radius: 16px; background: var(--ink); color: white; width: 46px; height: 46px; align-items: center; justify-content: center; }
main { position: relative; }
.hero { position: relative; min-height: calc(100vh - 88px); display: grid; align-items: center; padding: 74px 0 150px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(330px, .75fr); gap: 72px; align-items: center; }
.hero-grid > * { min-width: 0; }
.hero h1 { font-size: clamp(40px, 5vw, 76px); }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 22px; padding: 9px 14px; border-radius: 999px; border: 1px solid rgba(93, 217, 208, .26); background: rgba(255,255,255,.68); color: var(--blue); font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: linear-gradient(135deg, var(--cyan), var(--gold)); box-shadow: 0 0 18px rgba(93, 217, 208, .8); }
h1, h2, h3, h4 { font-family: var(--font-head); line-height: 1.15; letter-spacing: -.02em; margin: 0; }
h1 { font-size: clamp(40px, 5.6vw, 80px); max-width: 960px; overflow-wrap: break-word; word-break: normal; hyphens: auto; }
h2 { font-size: clamp(34px, 5vw, 68px); }
h3 { font-size: clamp(22px, 2.6vw, 34px); letter-spacing: -.04em; overflow-wrap: break-word; }
h4 { font-size: 20px; letter-spacing: -.03em; }
p { margin: 0; color: var(--muted); font-size: 18px; }
.lead { font-size: clamp(19px, 2vw, 25px); max-width: 760px; color: var(--ink-soft); margin-top: 28px; }
.text-gradient { background: linear-gradient(105deg, var(--blue-deep), var(--blue), var(--gold)); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* SplitType wraps chars in inline-block spans which break background-clip:text.
   Fallback: show solid blue during typing animation; JS restores gradient on complete. */
.text-gradient .char, .text-gradient .word { color: var(--blue-deep); -webkit-text-fill-color: var(--blue-deep); }
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 38px; }
.button { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 22px; border-radius: 999px; text-decoration: none; font-weight: 700; border: 1px solid transparent; transition: transform .28s var(--ease), box-shadow .28s var(--ease), background .28s var(--ease); }
.button.primary { background: var(--ink); color: white; box-shadow: 0 18px 36px rgba(7,17,31,.2); }
.button.secondary { background: rgba(255,255,255,.7); color: var(--ink); border-color: var(--border); }
.button:hover { transform: translateY(-3px); box-shadow: 0 20px 48px rgba(7,17,31,.16); }
.hero-visual { position: relative; min-height: 620px; overflow: hidden; }
.portrait-wrapper { position: absolute; inset: 0; border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; animation: morphBlob 10s ease-in-out infinite; }
.portrait-card { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; background: var(--glass); border: 1px solid rgba(255,255,255,.72); box-shadow: var(--shadow); }
.portrait-shimmer { position: absolute; inset: -4px; border-radius: inherit; background: conic-gradient(from 0deg, var(--gold), var(--cyan), var(--gold-soft), var(--cyan), var(--gold)); opacity: 0.35; z-index: 2; filter: blur(8px); animation: shimmerRotate 6s linear infinite; pointer-events: none; mix-blend-mode: overlay; }
.portrait-rays { position: absolute; inset: -100px; background: conic-gradient(from 0deg at 50% 50%, transparent 0deg, rgba(201,168,76,0.06) 15deg, transparent 30deg, rgba(93,217,208,0.04) 45deg, transparent 60deg, rgba(201,168,76,0.06) 75deg, transparent 90deg, rgba(93,217,208,0.04) 105deg, transparent 120deg, rgba(201,168,76,0.06) 135deg, transparent 150deg, rgba(93,217,208,0.04) 165deg, transparent 180deg, rgba(201,168,76,0.06) 195deg, transparent 210deg, rgba(93,217,208,0.04) 225deg, transparent 240deg, rgba(201,168,76,0.06) 255deg, transparent 270deg, rgba(93,217,208,0.04) 285deg, transparent 300deg, rgba(201,168,76,0.06) 315deg, transparent 330deg, rgba(93,217,208,0.04) 345deg, transparent 360deg); animation: rotateRays 20s linear infinite; pointer-events: none; z-index: -1; filter: blur(30px); }
@keyframes morphBlob { 0%, 100% { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; } 25% { border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%; } 50% { border-radius: 50% 60% 30% 60% / 30% 60% 70% 40%; } 75% { border-radius: 60% 30% 50% 40% / 60% 40% 30% 70%; } }
@keyframes rotateRays { to { transform: rotate(360deg); } }
@keyframes shimmerRotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.portrait-card img { width: 100%; height: 100%; object-fit: cover; }
.portrait-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 42%, rgba(10,25,41,.55)); }
.floating-panel { position: absolute; left: 0; bottom: 42px; width: min(390px, 78%); padding: 24px; border-radius: 28px; background: rgba(255,255,255,.82); backdrop-filter: blur(24px) saturate(170%); border: 1px solid rgba(255,255,255,.88); box-shadow: var(--shadow); }
.floating-panel strong { display: block; font-family: var(--font-head); font-size: 28px; letter-spacing: -.04em; }
.floating-panel span { display: block; color: var(--muted); margin-top: 8px; }
.orbit { position: absolute; right: 12px; top: 44px; width: 138px; height: 138px; border-radius: 999px; background: conic-gradient(from 90deg, var(--cyan), var(--gold), var(--rose), var(--cyan)); filter: saturate(120%); opacity: .88; animation: spin 14s linear infinite; }
.orbit::after { content: ""; position: absolute; inset: 8px; border-radius: inherit; background: rgba(255,255,255,.82); backdrop-filter: blur(20px); }
@keyframes spin { to { transform: rotate(360deg); } }
.section { padding: 104px 0; }
.section.compact { padding: 76px 0; }
.section-header { max-width: 820px; margin-bottom: 42px; }
.section-header.center { margin-left: auto; margin-right: auto; text-align: center; }
.section-header p { margin-top: 18px; }
.grid { display: grid; gap: 24px; }
.grid.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.card { position: relative; overflow: hidden; padding: 30px; min-height: 220px; border-radius: var(--radius-lg); background: var(--glass); border: 1px solid rgba(255,255,255,.78); box-shadow: var(--shadow-soft); transition: transform .38s var(--ease), box-shadow .38s var(--ease), border-color .38s var(--ease); }
.card::before { content: ""; position: absolute; inset: -1px; opacity: 0; background: radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), rgba(201,168,76,.18), transparent 48%); transition: opacity .38s var(--ease); }
.card:hover { transform: translateY(-8px); box-shadow: var(--shadow); border-color: rgba(93,217,208,.28); }
.card:hover::before { opacity: 1; }
.card > * { position: relative; z-index: 1; }
.card p { margin-top: 14px; }
.card .icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px; color: white; margin-bottom: 22px; background: linear-gradient(135deg, var(--blue), var(--gold)); box-shadow: 0 16px 28px rgba(40,115,180,.18); }
.image-card { padding: 0; min-height: 0; }
.image-card img { width: 100%; height: 240px; object-fit: contain; }
.image-card .image-body { padding: 26px; }
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 64px; align-items: center; }
.split > * { min-width: 0; }
.split h1 { font-size: clamp(36px, 4.4vw, 60px); }
.media-frame { overflow: hidden; border-radius: var(--radius-xl); background: var(--white); border: 1px solid rgba(255,255,255,.8); box-shadow: var(--shadow); }
.media-frame img { width: 100%; height: 100%; min-height: 420px; object-fit: contain; background: var(--white); }
.timeline { display: grid; gap: 18px; }
.timeline-item { display: grid; grid-template-columns: 140px 1fr; gap: 22px; padding: 22px; border-radius: 24px; background: rgba(255,255,255,.66); border: 1px solid var(--border); }
.timeline-item time { 
  font-weight: 700; 
  color: var(--blue); 
  text-align: right; 
  padding-right: 28px; 
  white-space: nowrap;
}
.kicker { color: var(--blue); font-weight: 700; text-transform: uppercase; letter-spacing: .13em; font-size: 12px; margin-bottom: 12px; }
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; margin-top: 44px; }
.stat { padding: 24px; border-radius: 24px; background: rgba(255,255,255,.64); border: 1px solid var(--border); }
.stat strong { display: block; font-family: var(--font-head); font-size: 36px; color: var(--ink); white-space: nowrap; }
.stat span { color: var(--muted); font-size: 14px; }
.pill-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; padding: 0; list-style: none; }
.pill-list li { padding: 10px 14px; border-radius: 999px; background: rgba(255,255,255,.78); border: 1px solid var(--border); color: var(--ink-soft); font-weight: 700; }
.publication { display: grid; gap: 10px; }
.publication .meta { font-size: 13px; color: var(--blue); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.source-panel { padding: 32px; border-radius: var(--radius-xl); background: linear-gradient(135deg, rgba(6,107,122,.96), rgba(10,139,158,.9)); color: white; box-shadow: var(--shadow); }
.source-panel p { color: rgba(255,255,255,.72); }
.source-panel .button.secondary { color: white; background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.22); }
.cta { margin: 80px 0 20px; padding: clamp(34px, 6vw, 72px); border-radius: 44px; background: radial-gradient(circle at 15% 20%, rgba(93,217,208,.20), transparent 26rem), linear-gradient(135deg, var(--ink), var(--blue-deep)); color: white; overflow: hidden; position: relative; box-shadow: var(--shadow); }
.cta { text-align: center !important; }
.cta p { color: rgba(255,255,255,.72); margin-top: 18px; max-width: 720px; margin-left: auto !important; margin-right: auto !important; }
.cta .button.primary { background: white; color: var(--ink); }
.cta .hero-actions { justify-content: center !important; }
.footer { padding: 60px 0 36px; color: var(--muted); }
.footer-grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 28px; border-top: 1px solid var(--border); padding-top: 34px; }
.footer a { color: var(--ink-soft); text-decoration: none; font-weight: 700; }
.footer ul { list-style: none; padding: 0; margin: 14px 0 0; display: grid; gap: 10px; }
/* Initial hidden state for scroll-reveal elements — GSAP animates to visible */
.reveal { opacity: 0; }
.revealed { opacity: 1 !important; transform: none !important; transition: opacity 0.7s ease, transform 0.7s ease; }
.split .media-frame img { transition: transform 0.1s linear; }

/* Vanilla-Tilt glare disabled — transform-style: flat prevents overflow */

/* Magnetic button smooth return */
.button { will-change: transform; }

/* SplitType: preserve inline elements styling */
.h1-chars, .h1-words { display: inline-block; }
@media (max-width: 980px) {
  .hero-grid, .split { grid-template-columns: 1fr; }
  .hero-visual { min-height: 560px; }
  .grid.three, .grid.two, .stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nav-toggle { display: inline-flex; }
  .nav-shell { justify-content: center; }
  .nav-links { position: fixed; inset: 86px 20px auto 20px; display: grid; border-radius: 26px; padding: 14px; transform: translateY(-18px); opacity: 0; pointer-events: none; transition: .32s var(--ease); }
  body.nav-open .nav-links { transform: translateY(0); opacity: 1; pointer-events: auto; }
}
@media (max-width: 680px) {
  .container { width: min(100% - 28px, 1180px); }
  .nav-shell { gap: 10px; justify-content: center; }
  .hero { min-height: auto; padding: 44px 0 100px; }
  .ekg-line { height: 70px; bottom: 10px; opacity: 0.55; }
  .hero-grid { gap: 34px; }
  .hero-visual { min-height: 400px; }
  .portrait-wrapper { inset: 0; border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; animation: morphBlob 10s ease-in-out infinite; }
  .portrait-card { inset: 0; border-radius: inherit; transform: none; }
  .floating-panel { width: 86%; bottom: 16px; left: 7%; padding: 18px; }
  .floating-panel strong { font-size: 20px; }
  .orbit { width: 92px; height: 92px; right: -10px; top: 24px; }
  .section { padding: 72px 0; }
  .grid.three, .grid.two, .stat-row { grid-template-columns: 1fr; }
  .timeline-item { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }
  h1 { font-size: clamp(28px, 8vw, 36px); }
  h2 { font-size: clamp(24px, 7vw, 32px); }
  p, .lead { font-size: 16px; }
  .button { width: 100%; justify-content: center; }
  .card { padding: 24px; }
  .media-frame img { min-height: 280px; }
}
/* ═══════════════════════════════════════════════════════
   Living Pulse — EKG + Oxygen + Glow
   ═══════════════════════════════════════════════════════ */

/* ── Hero watermark ── */
.hero-watermark {
  position: absolute;
  font-family: var(--font-head);
  font-size: clamp(200px, 30vw, 440px);
  font-weight: 700;
  color: var(--blue-deep);
  opacity: 0.028;
  line-height: 1;
  user-select: none;
  pointer-events: none;
  z-index: 0;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  letter-spacing: -0.04em;
}

/* ── EKG Wave Line ── */
.ekg-line {
  position: absolute;
  bottom: 18px;
  left: 0;
  width: 100%;
  height: 90px;
  pointer-events: none;
  z-index: 2;
  opacity: 0.72;
  overflow: hidden;
  filter: drop-shadow(0 0 10px rgba(93,217,208,0.35)) drop-shadow(0 0 24px rgba(201,168,76,0.18));
}
.ekg-line svg {
  width: 200%;
  height: 100%;
  animation: ekgFlow 3.2s linear infinite;
}
.ekg-path {
  stroke-dasharray: none;
  filter: drop-shadow(0 0 6px rgba(201,168,76,0.35));
}
@keyframes ekgFlow {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ── EKG subtle flicker ── */
.ekg-line::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(93,217,208,0.05) 45%, rgba(201,168,76,0.04) 55%, transparent 100%);
  animation: ekgScan 3.2s linear infinite;
  pointer-events: none;
}
@keyframes ekgScan {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

/* ── Portrait Pulse Glow ── */
.portrait-glow {
  position: absolute;
  inset: -18px;
  border-radius: 62px;
  background: radial-gradient(circle at 50% 55%, rgba(93,217,208,.18), rgba(201,168,76,.12), transparent 70%);
  opacity: 0;
  filter: blur(28px);
  animation: pulseGlow 3.2s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}
@keyframes pulseGlow {
  0%, 100% { opacity: 0; transform: scale(0.96); }
  50% { opacity: 1; transform: scale(1.04); }
}

/* ── Oxygen Bubbles ── */
.oxygen-bubbles {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  overflow: hidden;
}
.oxygen-bubbles span {
  position: absolute;
  bottom: -20px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(93,217,208,0.07);
  animation: rise 12s ease-in infinite;
}
.oxygen-bubbles span:nth-child(1) { left: 12%; width: 6px; height: 6px; animation-duration: 10s; animation-delay: 0s; }
.oxygen-bubbles span:nth-child(2) { left: 28%; width: 10px; height: 10px; animation-duration: 14s; animation-delay: 2.5s; }
.oxygen-bubbles span:nth-child(3) { left: 52%; width: 5px; height: 5px; animation-duration: 11s; animation-delay: 5s; }
.oxygen-bubbles span:nth-child(4) { left: 72%; width: 9px; height: 9px; animation-duration: 13s; animation-delay: 1.5s; }
.oxygen-bubbles span:nth-child(5) { left: 88%; width: 7px; height: 7px; animation-duration: 15s; animation-delay: 4s; }
@keyframes rise {
  0% { transform: translateY(0) scale(1); opacity: 0; }
  8% { opacity: 0.8; }
  92% { opacity: 0.4; }
  100% { transform: translateY(-110vh) scale(0.4); opacity: 0; }
}

/* ═══════════════════════════════════════════════════════
   Page-Specific Luxury Touches — One Weird Element per Page
   ═══════════════════════════════════════════════════════ */

/* ── About: Golden Timeline Thread ── */
body[data-page="about"] .timeline { position: relative; }
body[data-page="about"] .timeline::before {
  content: '';
  position: absolute;
  left: 150px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(180deg, transparent 0%, var(--gold) 20%, var(--gold-soft) 50%, var(--gold) 80%, transparent 100%);
  opacity: 0.35;
  border-radius: 2px;
}
body[data-page="about"] .timeline-item { position: relative; }
body[data-page="about"] .timeline-item::before {
  content: '';
  position: absolute;
  left: 143px;
  top: 50%;
  transform: translateY(-50%);
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--paper);
  border: 2px solid var(--gold);
  box-shadow: 0 0 16px rgba(201,168,76,0.25);
  z-index: 2;
}
@media (max-width: 680px) {
  body[data-page="about"] .timeline::before { left: 50px; }
  body[data-page="about"] .timeline-item::before { left: 44px; top: 24px; width: 12px; height: 12px; }
  body[data-page="about"] .timeline-item time { margin-bottom: 8px; display: inline-block; }
}
body[data-page="about"] .timeline-item time { color: var(--gold); font-weight: 700; align-self: center; text-align: right; padding-right: 28px; white-space: nowrap; }

/* ── Education: Medical Cross Watermark ── */
body[data-page="education"] .section-header.center { position: relative; }
body[data-page="education"] .section-header.center::before {
  content: '+';
  position: absolute;
  font-family: var(--font-head);
  font-size: clamp(180px, 25vw, 380px);
  font-weight: 700;
  color: var(--blue);
  opacity: 0.025;
  line-height: 1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 0;
  user-select: none;
}

/* ── Research: Gold Accents ── */
body[data-page="research"] .publication .meta { color: var(--gold); letter-spacing: 0.12em; }
body[data-page="research"] .card.publication { border-left: 3px solid var(--gold-soft); }
body[data-page="research"] .card.publication:hover { border-left-color: var(--gold); }

/* ── Practice: X-Ray Hover on Image Cards ── */
body[data-page="practice"] .image-card {
  position: relative;
  overflow: hidden;
}
body[data-page="practice"] .image-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(93,217,208,0.12), transparent 60%);
  opacity: 0;
  transition: opacity 0.5s var(--ease);
  mix-blend-mode: overlay;
  pointer-events: none;
}
body[data-page="practice"] .image-card:hover::after {
  opacity: 1;
}
body[data-page="practice"] .image-card:hover img {
  filter: sepia(0.25) contrast(1.08) saturate(0.9);
  transition: filter 0.5s var(--ease);
}

/* ── Contacts: Document Seal Aesthetic ── */
body[data-page="contacts"] .card {
  position: relative;
}
body[data-page="contacts"] .card::after {
  content: '';
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border: 2px solid var(--gold);
  border-radius: 50%;
  opacity: 0.12;
  pointer-events: none;
}
body[data-page="contacts"] .source-panel {
  position: relative;
}
body[data-page="contacts"] .source-panel::before {
  content: '';
  position: absolute;
  top: 18px;
  right: 18px;
  width: 50px;
  height: 50px;
  border: 3px double var(--gold);
  border-radius: 6px;
  opacity: 0.08;
  transform: rotate(10deg);
  pointer-events: none;
}

/* ===== ANIMATIONS ===== */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 16px rgba(201,168,76,0.15); }
  50% { box-shadow: 0 0 32px rgba(201,168,76,0.35), 0 0 60px rgba(201,168,76,0.08); }
}
@keyframes popIn {
  0% { opacity: 0; transform: scale(0.85) translateY(30px); }
  60% { transform: scale(1.03) translateY(-4px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}
@keyframes slideInUp {
  from { opacity: 0; transform: translateY(50px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes slideInLeft {
  from { opacity: 0; transform: translateX(-50px); }
  to { opacity: 1; transform: translateX(0); }
}
@keyframes drawLine {
  from { stroke-dashoffset: 1000; }
  to { stroke-dashoffset: 0; }
}
@keyframes nodePulse {
  0%, 100% { transform: scale(1); box-shadow: 0 0 12px rgba(201,168,76,0.25); }
  50% { transform: scale(1.3); box-shadow: 0 0 28px rgba(201,168,76,0.5); }
}
@keyframes iconPop {
  0% { transform: scale(0) rotate(-20deg); }
  60% { transform: scale(1.15) rotate(5deg); }
  100% { transform: scale(1) rotate(0deg); }
}
@keyframes shimmerBorder {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* Utility classes */
.animate-float { animation: float 4s ease-in-out infinite; }
.animate-pulse-glow { animation: pulseGlow 3s ease-in-out infinite; }
.animate-pop { animation: popIn 0.7s var(--ease) both; }
.animate-slide-up { animation: slideInUp 0.8s var(--ease) both; }

/* Enhanced card hover */
.card {
  transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease), border-color 0.5s var(--ease);
}
.card:hover {
  transform: translateY(-8px);
  box-shadow: 0 24px 64px rgba(10,25,41,0.12), 0 0 0 1px rgba(201,168,76,0.18);
}
.card .icon {
  transition: transform 0.45s var(--ease), box-shadow 0.45s var(--ease);
}
.card:hover .icon {
  transform: scale(1.12) rotate(-6deg);
  box-shadow: 0 0 24px rgba(201,168,76,0.15);
}

/* Button magnetic + lift */
.button {
  transition: transform 0.25s var(--ease), box-shadow 0.3s var(--ease), background 0.3s var(--ease);
}
.button:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(10,139,158,0.22);
}
.button:active {
  transform: translateY(-1px);
}

/* Stat counter lift */
.stat-item {
  transition: transform 0.45s var(--ease), box-shadow 0.45s var(--ease);
}
.stat-item:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 48px rgba(10,25,41,0.1);
}
.stat-item:hover .stat-number {
  color: var(--gold);
  transform: scale(1.1);
}
.stat-number {
  transition: color 0.35s var(--ease), transform 0.35s var(--ease);
}

/* Footer link underline draw */
.footer a {
  position: relative;
}
.footer a::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--gold);
  transition: width 0.4s var(--ease);
}
.footer a:hover::after {
  width: 100%;
}

/* Timeline node pulse on hover */
body[data-page="about"] .timeline-item::before {
  transition: all 0.5s var(--ease);
}
body[data-page="about"] .timeline-item:hover::before {
  transform: translateY(-50%) scale(1.5);
  box-shadow: 0 0 28px rgba(201,168,76,0.5);
}
body[data-page="about"] .timeline-item {
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
body[data-page="about"] .timeline-item:hover {
  transform: translateX(8px);
}

/* Image card sweep (X-ray) */
.image-card {
  overflow: hidden;
}
.image-card img {
  transition: transform 0.8s var(--ease), filter 0.8s var(--ease);
}
.image-card:hover img {
  transform: scale(1.08);
  filter: brightness(1.05) contrast(1.05);
}

/* Contact card 3D tilt */
body[data-page="contacts"] .card {
  transition: transform 0.5s var(--ease), box-shadow 0.5s var(--ease);
  transform-style: preserve-3d;
}
body[data-page="contacts"] .card:hover {
  transform: translateY(-8px) rotateX(4deg) rotateY(-2deg);
  box-shadow: 0 24px 64px rgba(10,25,41,0.15), 0 0 0 1px rgba(201,168,76,0.2);
}

/* Research card teal glow */
body[data-page="research"] .card:hover {
  box-shadow: 0 24px 64px rgba(10,25,41,0.12), 0 0 30px rgba(93,217,208,0.08);
}

/* Education card icon pop */
body[data-page="education"] .card:hover .icon {
  transform: scale(1.18) rotate(12deg);
}

/* Floating panel bob */
.floating-panel {
  animation: float 5s ease-in-out infinite;
}

/* EKG line draw */
.ekg-line svg polyline {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  animation: drawLine 3s ease-out 0.5s forwards;
}

/* Skip-to-content link (visible only on keyboard focus) */
.skip-link { position: absolute; top: -100%; left: 16px; z-index: 999; padding: 12px 20px; border-radius: 0 0 var(--radius-sm) var(--radius-sm); background: var(--ink); color: white; font-weight: 700; text-decoration: none; transition: top .2s ease; }
.skip-link:focus { top: 0; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
  .card, .button { transform: none !important; }
  .ekg-line svg, .portrait-glow, .oxygen-bubbles span { animation: none !important; }
  .portrait-glow { opacity: 0 !important; }
  .ekg-line { opacity: 0.12; }
}