.page-hero--work { --hero-img: url("/assets/hero/home.webp"); }
.page-hero--about { --hero-img: url("/assets/hero/aboutblack.webp"); }
[data-theme="light"] .page-hero--about { --hero-img: url("/assets/hero/aboutwhite.webp"); }
.page-hero--services, [data-theme="light"] .page-hero--services { --hero-img: url("/assets/hero/serviceswhite1.webp"); }
.page-hero--team { --hero-img: url("/assets/hero/teamsblack.webp"); --hero-pos: 75% center; }
[data-theme="light"] .page-hero--team { --hero-img: url("/assets/hero/teamswhite.webp"); }
.page-hero--research { --hero-img: url("/assets/hero/researchblack.webp"); --hero-pos: 80% center; }
[data-theme="light"] .page-hero--research { --hero-img: url("/assets/hero/researchwhite.webp"); }
.page-hero--contact { --hero-img: url("/assets/hero/contactblack.webp"); }
[data-theme="light"] .page-hero--contact { --hero-img: url("/assets/hero/contactwhite.webp"); }

html { overflow-x: clip !important; }
body { overflow-x: clip !important; position: relative !important; width: 100% !important; }

.site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: transparent !important;
  border: none !important;
  pointer-events: none !important;
}

.site-header__inner,
.site-header a,
.site-header button {
  pointer-events: auto !important;
}

.comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.comparison__col { display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.comparison__col:first-child { padding-right: var(--space-5); }
.comparison__col + .comparison__col { padding-left: var(--space-5); border-left: 1px solid var(--border); }
.comparison__label { color: var(--text-muted); font-size: var(--fs-sm); font-weight: 600; }
.comparison__label--manual, .comparison__impact span { color: var(--accent-fg); }
.comparison__impact { padding-top: var(--space-3); border-top: 1px solid var(--border); font-weight: 600; }

.research-empty { color: var(--text-muted); }
.email-link { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--accent-fg); font-size: var(--fs-lg); font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.email-link:hover { text-decoration: underline; }
.detail-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin: 0; padding-top: var(--space-4); border-top: 1px solid var(--border); }
.detail-list dt { color: var(--text-muted); font-size: var(--fs-sm); }
.detail-list dd { margin: 0; font-weight: 600; }

.achievement-card--hidden,
.grid--collapsible.is-collapsed > *:nth-child(n+10) { display: none !important; }
.achievements-more-wrap { display: flex; justify-content: center; margin-top: var(--space-5, 2rem); width: 100%; }
.achievements-toggle-btn { cursor: pointer; display: inline-flex; align-items: center; gap: 0.5rem; transition: all 0.2s ease-in-out; }
.achievements-toggle-btn svg { transition: transform 0.25s ease; }
.achievements-toggle-btn.is-expanded svg { transform: rotate(180deg); }
.grid-actions { display: flex; justify-content: center; margin-top: 2.5rem; }
.btn--see-more { cursor: pointer; }

.page-hero .page-hero__art { display: flex !important; align-items: center; justify-content: center; background: transparent !important; border: none !important; box-shadow: none !important; padding: 0 !important; }
.page-hero .page-hero__art img {
  display: block;
  width: 100%;
  max-width: 560px;
  height: auto;
  border: none !important;
  box-shadow: none !important;
  transform: scale(1.15);
  mask-image: radial-gradient(ellipse 48% 48% at 50% 50%, #000 40%, transparent 92%);
  -webkit-mask-image: radial-gradient(ellipse 48% 48% at 50% 50%, #000 40%, transparent 92%);
  transition: transform 0.3s ease;
}
.page-hero .page-hero__art img:hover { transform: scale(1.18); }

[data-theme="dark"] body .page-hero__art .hero-art--light,
[data-theme="light"] body .page-hero__art .hero-art--dark { display: none !important; }
[data-theme="dark"] body .page-hero__art .hero-art--dark,
[data-theme="light"] body .page-hero__art .hero-art--light { display: block !important; opacity: 1 !important; visibility: visible !important; }

body .page-hero--services .page-hero__art,
body .page-hero--about .page-hero__art,
body .page-hero--contact .page-hero__art {
  position: relative !important;
  pointer-events: none !important;
}

body .page-hero--services .page-hero__art img,
body .page-hero--about .page-hero__art img,
body .page-hero--contact .page-hero__art img {
  position: relative !important;
  z-index: 1 !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
  transform: translateY(0) scale(1.02) !important;
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1), filter 0.4s ease !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

body .page-hero--services .page-hero__art img { clip-path: none !important; }
body .page-hero--about .page-hero__art img,
body .page-hero--contact .page-hero__art img { clip-path: inset(0 0 0 3.5%) !important; }

body .page-hero--services .page-hero__art img:hover,
body .page-hero--about .page-hero__art img:hover,
body .page-hero--contact .page-hero__art img:hover { transform: translateY(-8px) scale(1.04) !important; }

[data-theme="dark"] body .page-hero--services .page-hero__art img,
[data-theme="dark"] body .page-hero--about .page-hero__art img,
[data-theme="dark"] body .page-hero--contact .page-hero__art img {
  mix-blend-mode: lighten !important;
  filter: contrast(1.06) brightness(1.04) !important;
}

[data-theme="light"] body .page-hero--services .page-hero__art img,
[data-theme="light"] body .page-hero--about .page-hero__art img,
[data-theme="light"] body .page-hero--contact .page-hero__art img {
  mix-blend-mode: darken !important;
  filter: contrast(1.05) brightness(0.98) !important;
}

body .page-hero--services .page-hero__art::before,
body .page-hero--about .page-hero__art::before,
body .page-hero--contact .page-hero__art::before { display: none !important; content: none !important; }

.page-hero--about .page-hero__title,
.page-hero--services .page-hero__title,
.page-hero--contact .page-hero__title,
.page-hero--join .page-hero__title { margin-top: 0 !important; padding-top: 0 !important; }

.page-hero--about .page-hero__actions,
.page-hero--services .page-hero__actions,
.page-hero--contact .page-hero__actions,
.page-hero--join .page-hero__actions,
.page-hero--about .btn,
.page-hero--services .btn,
.page-hero--contact .btn,
.page-hero--join .btn { position: relative !important; z-index: 20 !important; pointer-events: auto !important; cursor: pointer !important; }

.page-hero--team { position: relative !important; overflow: hidden !important; padding: 5.5rem 0 8.5rem !important; margin-top: 0 !important; }
.page-hero--team .page-hero__inner { display: block !important; position: relative !important; z-index: 10 !important; pointer-events: none !important; }
.page-hero--team .page-hero__body { position: relative !important; z-index: 10 !important; max-width: 600px !important; width: fit-content !important; pointer-events: auto !important; }

.page-hero--team a,
.page-hero--team button,
.page-hero--team .btn,
.page-hero--team .page-hero__actions,
.page-hero--team a.btn { position: relative !important; z-index: 20 !important; pointer-events: auto !important; cursor: pointer !important; touch-action: manipulation !important; }

.page-hero--team .page-hero__art {
  position: absolute !important;
  top: -6.5rem !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 100vw !important;
  height: calc(100% + 6.5rem) !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 1 !important;
  display: block !important;
  pointer-events: none !important;
}

.page-hero--team .page-hero__art img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: right center !important;
  opacity: 0.35 !important;
  border-radius: 0 !important;
  border: none !important;
  box-shadow: none !important;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0, 0, 0, 0.5) 45%, rgba(0, 0, 1) 100%) !important;
  mask-image: linear-gradient(to right, transparent 0%, rgba(0, 0, 0, 0.5) 45%, rgba(0, 0, 1) 100%) !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.4s ease !important;
}

.page-hero--team .page-hero__art img:hover { opacity: 0.70 !important; transform: scale(1.03) !important; }
.page-hero--team .page-hero__art img:active { opacity: 0.90 !important; transform: scale(1.05) !important; }

@media (min-width: 901px) {
  .split__aside { position: sticky; top: calc(var(--header-h) + 2 * var(--header-gap) + var(--space-5)); }
}

@media (min-width: 769px) {
  /* Lift services, contact, and join hero sections (headline, copy, buttons, and visual art) slightly upward */
  body .page-hero--services,
  body .page-hero--contact,
  body .page-hero--join { margin-top: -2.5rem !important; padding-top: 0 !important; padding-bottom: 2.5rem !important; }
  body .page-hero--about { margin-top: -3.5rem !important; padding-top: 0 !important; padding-bottom: 2rem !important; }
  body .page-hero--about .page-hero__inner,
  body .page-hero--services .page-hero__inner { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: space-between !important; gap: 2.5rem !important; }
  body .page-hero--about .page-hero__body,
  body .page-hero--services .page-hero__body { flex: 0 0 52% !important; max-width: 52% !important; margin: 0 !important; }
  body .page-hero--about .page-hero__art,
  body .page-hero--services .page-hero__art { flex: 0 0 48% !important; max-width: 48% !important; display: flex !important; justify-content: center !important; align-items: center !important; margin: 0 !important; padding: 0 !important; }
  body .page-hero--about .page-hero__art img,
  body .page-hero--services .page-hero__art img,
  body .page-hero--contact .page-hero__art img { width: 100% !important; max-width: 470px !important; height: auto !important; object-fit: contain !important; display: block !important; }
  body .page-hero--team { margin-top: -2.5rem !important; padding-top: 2.5rem !important; }
  body .page-hero--research { margin-top: -2.5rem !important; padding-top: 1.5rem !important; }
  body .page-hero--research .page-hero__title,
  body .page-hero--join .page-hero__title,
  body .page-hero--contact .page-hero__title { margin-top: 0 !important; }
}

@media (max-width: 768px) {
  html, body { max-width: 100vw !important; }
  main, .page-hero { max-width: 100% !important; }
  .page-hero { padding-top: 2rem !important; padding-bottom: 3rem !important; }
  .page-hero__inner { display: flex !important; flex-direction: column !important; gap: 1.75rem !important; }
  body .page-hero__inner { padding-left: 1.5rem !important; padding-right: 1.5rem !important; box-sizing: border-box !important; width: 100% !important; max-width: 100% !important; }
  .page-hero__art { max-width: 100% !important; }
  .comparison { grid-template-columns: minmax(0, 1fr); }
  .comparison__col:first-child { padding: 0 0 var(--space-5); }
  .comparison__col + .comparison__col { padding: var(--space-5) 0 0; border-left: 0; border-top: 1px solid var(--border); }
  body .page-hero--about { padding-top: 0 !important; padding-bottom: 2rem !important; margin-top: -1.5rem !important; }
  /* Lift services, contact, and join hero sections slightly upward on mobile */
  body .page-hero--services,
  body .page-hero--contact,
  body .page-hero--join { margin-top: -1rem !important; padding-top: 0.25rem !important; padding-bottom: 2rem !important; }
  body .page-hero--about .page-hero__inner,
  body .page-hero--services .page-hero__inner { display: flex !important; flex-direction: column !important; gap: 1.25rem !important; }
  body .page-hero--about .page-hero__body,
  body .page-hero--services .page-hero__body { width: 100% !important; max-width: 100% !important; }
  .page-hero--services .page-hero__art,
  .page-hero--about .page-hero__art,
  .page-hero--contact .page-hero__art { width: 100% !important; max-width: 100% !important; display: flex !important; justify-content: center !important; margin: 1.5rem auto 0 !important; }
  .page-hero--services .page-hero__art img,
  .page-hero--about .page-hero__art img,
  .page-hero--contact .page-hero__art img { width: 90% !important; max-width: 320px !important; height: auto !important; object-fit: contain !important; margin: 0 auto !important; opacity: 1 !important; }
  body .page-hero--team { position: relative !important; overflow: hidden !important; height: auto !important; min-height: auto !important; margin-top: -2.5rem !important; padding: 1.35rem 1.25rem 2.5rem !important; }
  body .page-hero--team .page-hero__inner { position: static !important; display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important; }
  body .page-hero--team .page-hero__body { position: relative !important; z-index: 5 !important; display: flex !important; flex-direction: column !important; align-items: flex-start !important; }
  body .page-hero--team .page-hero__title { margin-top: 0 !important; margin-bottom: 0.5rem !important; font-size: 2rem !important; font-weight: 800 !important; line-height: 1.18 !important; }
  body .page-hero--team .page-hero__lead { margin: 0 0 0.85rem 0 !important; font-size: 0.95rem !important; line-height: 1.45 !important; }
  body .page-hero--team .page-hero__actions { margin: 0 !important; width: 100% !important; }
  body .page-hero--team .btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; }
  body .page-hero--team .page-hero__art { position: absolute !important; inset: 0 !important; width: 100% !important; max-width: 100% !important; height: 100% !important; z-index: 1 !important; margin: 0 !important; padding: 0 !important; transform: none !important; }
  body .page-hero--team .page-hero__art img { width: 100% !important; height: 100% !important; min-height: 100% !important; max-width: none !important; object-fit: cover !important; object-position: center !important; opacity: 0.28 !important; display: block !important; -webkit-mask-image: none !important; mask-image: none !important; }
  .grid--3, .grid--2, .grid[data-members-list] { grid-template-columns: 1fr !important; gap: 1.5rem !important; width: 100% !important; }
  .grid[data-members-list] img, .member-card img { width: 100% !important; max-width: 240px !important; aspect-ratio: 1 / 1 !important; object-fit: cover !important; object-position: top center !important; margin: 0 auto 1rem !important; display: block !important; border-radius: 50% !important; }
  .card, [class*="cve"] { max-width: 100% !important; word-break: break-word !important; }
}

@media (max-width: 480px) {
  .detail-list { grid-template-columns: minmax(0, 1fr); }
}

body .page-hero--research .page-hero__art img {
  mask-image: radial-gradient(ellipse 53% 50% at 50% 50%, #000 68%, transparent 96%) !important;
  -webkit-mask-image: radial-gradient(ellipse 53% 50% at 50% 50%, #000 68%, transparent 96%) !important;
  filter: contrast(1.22) brightness(0.98) saturate(1.4) !important;
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1), filter 0.35s ease !important;
}
body .page-hero--research .page-hero__art img:hover { transform: translateY(-6px) scale(1.03) !important; filter: contrast(1.25) brightness(1.01) saturate(1.45) !important; }

[data-theme="dark"] body .page-hero--research .page-hero__art img {
  mask-image: radial-gradient(ellipse 53% 50% at 50% 50%, #000 68%, transparent 96%) !important;
  -webkit-mask-image: radial-gradient(ellipse 53% 50% at 50% 50%, #000 68%, transparent 96%) !important;
  filter: contrast(1.3) saturate(1.4) !important;
  mix-blend-mode: lighten !important;
}
[data-theme="dark"] body .page-hero--research .page-hero__art img:hover { filter: contrast(1.35) saturate(1.5) !important; }

body .page-hero--join .page-hero__art { display: flex !important; align-items: center !important; justify-content: center !important; pointer-events: none !important; }
body .page-hero--join .page-hero__art img {
  mask-image: none !important;
  -webkit-mask-image: none !important;
  width: 100% !important;
  max-width: 360px !important;
  height: auto !important;
  object-fit: contain !important;
  border: none !important;
  outline: none !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1), filter 0.35s ease !important;
}
[data-theme="light"] body .page-hero--join .page-hero__art img { mix-blend-mode: multiply !important; filter: contrast(1.18) brightness(1.08) !important; }
[data-theme="dark"] body .page-hero--join .page-hero__art img { mix-blend-mode: lighten !important; filter: contrast(1.15) brightness(0.98) !important; }
body .page-hero--join .page-hero__art img:hover { transform: translateY(-6px) scale(1.03) !important; }

@media (max-width: 768px) {
  body .page-hero--join .page-hero__art img { max-width: 250px !important; margin: 0.75rem auto 0 !important; }
}

/* Adjust coin size for large screens */
body .page-hero--join .page-hero__art img {
  max-width: 270px !important;
}

/* Adjust coin size for mobile screens */
@media (max-width: 768px) {
  body .page-hero--join .page-hero__art img {
    max-width: 200px !important;
  }
}