:root {
  --tech-cyan: #38d7ff;
  --tech-aqua: #7cf4e6;
  --tech-blue: #0077a3;
  --tech-deep: #001826;
  --tech-panel: rgba(255,255,255,.72);
  --tech-line: rgba(56,215,255,.22);
}

body {
  --cursor-x: 50vw;
  --cursor-y: 30vh;
}

body::after {
  position: fixed;
  left: var(--cursor-x);
  top: var(--cursor-y);
  z-index: 999;
  width: 34vmin;
  height: 34vmin;
  pointer-events: none;
  background: radial-gradient(circle, rgba(56,215,255,.16), rgba(124,244,230,.08) 34%, transparent 68%);
  border-radius: 50%;
  content: "";
  mix-blend-mode: screen;
  opacity: .72;
  transform: translate(-50%, -50%);
  transition: opacity .18s ease;
}

.tech-canvas {
  position: fixed;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: .72;
}

.bio-scan {
  position: fixed;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    linear-gradient(180deg, transparent 0, rgba(56,215,255,.08) 50%, transparent 100%),
    repeating-linear-gradient(180deg, rgba(255,255,255,.03) 0 1px, transparent 1px 7px);
  mix-blend-mode: screen;
  opacity: .24;
  transform: translateY(-100%);
  animation: bioScan 7s linear infinite;
}

.hero,
.page-hero,
.section-dark {
  overflow: hidden;
}

.hero > .container::after,
.page-hero > .container::after {
  position: absolute;
  right: max(0px, calc((100vw - 1240px) / -2));
  top: 50%;
  z-index: -1;
  width: min(42vw, 620px);
  height: min(42vw, 620px);
  border: 1px solid rgba(124,244,230,.18);
  border-radius: 50%;
  background:
    radial-gradient(circle, transparent 0 44%, rgba(56,215,255,.08) 45% 46%, transparent 47%),
    conic-gradient(from 45deg, transparent, rgba(56,215,255,.26), transparent, rgba(124,244,230,.18), transparent);
  content: "";
  opacity: .75;
  transform: translateY(-50%);
  animation: rotateHalo 28s linear infinite;
}

.hero .eyebrow,
.page-hero .eyebrow {
  padding: 7px 11px;
  color: #bffff7;
  background: rgba(0,119,163,.18);
  border: 1px solid rgba(124,244,230,.26);
  border-radius: 999px;
  backdrop-filter: blur(10px);
}

.hero .eyebrow::before,
.page-hero .eyebrow::before {
  width: 24px;
}

.hero h1,
.page-hero h1 {
  position: relative;
}

.hero h1::after,
.page-hero h1::after {
  display: block;
  width: min(420px, 70vw);
  height: 4px;
  margin-top: 22px;
  background: linear-gradient(90deg, var(--tech-cyan), var(--tech-aqua), transparent);
  box-shadow: 0 0 24px rgba(56,215,255,.5);
  content: "";
  animation: pulseRail 3.8s ease-in-out infinite;
}

.hero-actions,
.section-actions {
  gap: 14px;
}

.tech-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 24px;
}

.tech-page-label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 18px 0 8px;
  color: #dffcff;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .12em;
}

.tech-page-label::before {
  width: 48px;
  height: 1px;
  background: linear-gradient(90deg, var(--tech-aqua), transparent);
  box-shadow: 0 0 14px rgba(124,244,230,.58);
  content: "";
}

.tech-chip {
  padding: 7px 11px;
  color: #dffcff;
  background: rgba(0,43,69,.42);
  border: 1px solid rgba(56,215,255,.22);
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

.tech-hero-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 150px));
  gap: 1px;
  width: min(100%, 520px);
  margin-top: 26px;
  overflow: hidden;
  border: 1px solid rgba(124,244,230,.24);
  border-radius: 14px;
  background: rgba(0,25,39,.36);
  box-shadow: 0 24px 60px rgba(0,0,0,.18), inset 0 0 34px rgba(56,215,255,.07);
  backdrop-filter: blur(14px);
}

.tech-hero-metrics span {
  display: grid;
  min-height: 82px;
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.025));
}

.tech-hero-metrics strong {
  color: #ffffff;
  font-size: 25px;
  line-height: 1;
  text-shadow: 0 0 18px rgba(56,215,255,.35);
}

.tech-hero-metrics em {
  align-self: end;
  color: rgba(223,252,255,.72);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.page-hero .tech-hero-metrics {
  margin-top: 22px;
}

.tech-section {
  position: relative;
}

.tech-section::after {
  position: absolute;
  right: max(18px, calc((100vw - 1240px) / 2));
  top: 28px;
  z-index: 0;
  color: rgba(0,59,92,.045);
  font-size: clamp(56px, 8vw, 132px);
  font-weight: 900;
  line-height: 1;
  content: var(--section-index);
  pointer-events: none;
}

.tech-section > .container {
  position: relative;
  z-index: 1;
}

.grid > .card,
.grid > .metric-card {
  position: relative;
}

.grid > .card:not(:has(> img)) .card-body::after,
.grid > .metric-card::after {
  position: absolute;
  right: 20px;
  top: 18px;
  color: rgba(0,119,163,.08);
  font-size: 40px;
  font-weight: 900;
  line-height: 1;
  content: var(--item-index);
  pointer-events: none;
}

body[data-page="science"] .page-hero::before,
body.tech-page-science .page-hero::before {
  background:
    linear-gradient(90deg, rgba(0,17,28,.96), rgba(0,75,96,.7) 48%, rgba(75,174,143,.22)),
    radial-gradient(circle at 78% 36%, rgba(124,244,230,.3), transparent 34%);
}

body.tech-page-pipeline .page-hero::before {
  background:
    linear-gradient(90deg, rgba(0,17,28,.96), rgba(0,59,92,.78) 46%, rgba(56,215,255,.25)),
    repeating-linear-gradient(90deg, rgba(56,215,255,.1) 0 2px, transparent 2px 120px);
}

body.tech-page-quality .page-hero::before,
body.tech-page-compliance .page-hero::before,
body.tech-page-privacy .page-hero::before {
  background:
    linear-gradient(90deg, rgba(0,17,28,.96), rgba(0,47,68,.78) 48%, rgba(130,203,217,.2)),
    radial-gradient(circle at 78% 26%, rgba(255,255,255,.16), transparent 28%);
}

body.tech-page-contact .page-hero::before,
body.tech-page-investors .page-hero::before,
body.tech-page-media .page-hero::before {
  background:
    linear-gradient(90deg, rgba(0,17,28,.96), rgba(0,59,92,.72) 48%, rgba(75,174,143,.2)),
    radial-gradient(circle at 78% 32%, rgba(56,215,255,.26), transparent 32%);
}

body.tech-page-responsibility .page-hero::before {
  background:
    linear-gradient(90deg, rgba(0,17,28,.95), rgba(0,59,92,.72) 48%, rgba(75,174,143,.3)),
    radial-gradient(circle at 80% 38%, rgba(75,174,143,.28), transparent 34%);
}

body.tech-page-careers .page-hero::before,
body.tech-page-stories .page-hero::before,
body.tech-page-news .page-hero::before,
body.tech-page-news-detail .page-hero::before {
  background:
    linear-gradient(90deg, rgba(0,17,28,.95), rgba(0,59,92,.7) 48%, rgba(124,244,230,.24)),
    radial-gradient(circle at 78% 30%, rgba(56,215,255,.24), transparent 32%);
}

body.tech-page-about .company-overview,
body.tech-page-company .company-overview {
  border-color: rgba(56,215,255,.22);
}

body.tech-page-contact .form,
body.tech-page-careers .form {
  background:
    linear-gradient(145deg, rgba(255,255,255,.92), rgba(238,248,250,.72));
  box-shadow: 0 30px 80px rgba(0,43,69,.13);
}

body.tech-page-careers .career-form {
  background:
    linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.06)) !important;
  border-color: rgba(124,244,230,.24);
  box-shadow: 0 34px 90px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.14);
}

body.tech-page-contact .contact-form {
  background: rgba(255,255,255,.96) !important;
  border-color: rgba(0,119,163,.16);
  box-shadow: 0 30px 80px rgba(0,43,69,.12);
}

body.tech-page-quality .grid .card,
body.tech-page-compliance .legal-content,
body.tech-page-privacy .legal-content,
body.tech-page-terms .legal-content,
body.tech-page-cookies .legal-content {
  position: relative;
  padding: clamp(24px, 4vw, 48px);
  background:
    linear-gradient(145deg, rgba(255,255,255,.94), rgba(238,248,250,.76));
  border: 1px solid rgba(0,119,163,.16);
  border-radius: 14px;
  box-shadow: 0 22px 58px rgba(0,43,69,.08);
}

body.tech-page-quality .grid .card .card-body {
  padding: 0;
}

body.tech-page-medicines .timeline-step,
body.tech-page-science .timeline-step {
  min-height: 176px;
}

.card,
.metric-card,
.stat-card,
.timeline-step,
.pipeline-item,
.public-pipeline-item,
.form,
.culture-principles article {
  isolation: isolate;
}

.card::after,
.metric-card::after,
.stat-card::after,
.timeline-step::after,
.pipeline-item::after,
.public-pipeline-item::after,
.form::after,
.culture-principles article::after {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at var(--card-x, 50%) var(--card-y, 30%), rgba(56,215,255,.16), transparent 34%),
    linear-gradient(135deg, transparent, rgba(124,244,230,.07));
  content: "";
  opacity: 0;
  transition: opacity .24s ease;
}

.card:hover::after,
.metric-card:hover::after,
.stat-card:hover::after,
.timeline-step:hover::after,
.pipeline-item:hover::after,
.public-pipeline-item:hover::after,
.form:hover::after,
.culture-principles article:hover::after {
  opacity: 1;
}

.card-body,
.stat-card,
.timeline-step,
.pipeline-row,
.public-pipeline-row,
.form {
  position: relative;
}

.card-body::before,
.stat-card::after,
.timeline-step::after {
  position: absolute;
  right: 18px;
  bottom: 16px;
  width: 54px;
  height: 54px;
  pointer-events: none;
  background:
    linear-gradient(var(--tech-line) 1px, transparent 1px),
    linear-gradient(90deg, var(--tech-line) 1px, transparent 1px);
  background-size: 10px 10px;
  content: "";
  opacity: .28;
  mask-image: radial-gradient(circle, #000 0 54%, transparent 72%);
}

.section-head h2,
section h2 {
  position: relative;
}

.section-head h2::after,
section h2::after {
  display: block;
  width: 86px;
  height: 3px;
  margin-top: 14px;
  background: linear-gradient(90deg, var(--tech-blue), var(--tech-aqua));
  box-shadow: 0 0 18px rgba(56,215,255,.22);
  content: "";
}

.stage-track {
  position: relative;
}

.stage-track::before {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  z-index: -1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(56,215,255,.34), transparent);
  content: "";
}

.stage-track .stage.active,
.stage-track .stage5.active,
.public-phase.active {
  position: relative;
  overflow: hidden;
}

.stage-track .stage.active::after,
.stage-track .stage5.active::after,
.public-phase.active::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent, rgba(255,255,255,.36), transparent);
  content: "";
  transform: translateX(-120%);
  animation: stageSweep 2.8s ease-in-out infinite;
}

.public-pipeline-section {
  position: relative;
  overflow: hidden;
}

.public-pipeline-section::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 18%, rgba(56,215,255,.13), transparent 30%),
    linear-gradient(rgba(0,119,163,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,119,163,.035) 1px, transparent 1px);
  background-size: auto, 46px 46px, 46px 46px;
  content: "";
}

.public-pipeline-intro,
.public-pipeline-toolbar,
.public-pipeline-stats,
.public-pipeline-list {
  position: relative;
  z-index: 1;
}

.site-header.is-scrolled .primary-link.active::before {
  position: absolute;
  left: 50%;
  bottom: 8px;
  width: 28px;
  height: 1px;
  background: var(--tech-cyan);
  box-shadow: 0 0 10px rgba(56,215,255,.9);
  content: "";
  transform: translateX(-50%);
}

.search-overlay h2 {
  text-shadow: 0 0 40px rgba(56,215,255,.22);
}

.search-results a {
  border: 1px solid rgba(56,215,255,.1);
}

.search-results a:hover {
  background:
    linear-gradient(135deg, rgba(0,59,92,.98), rgba(0,119,163,.54));
}

@keyframes bioScan {
  0% { transform: translateY(-100%); opacity: 0; }
  12% { opacity: .26; }
  86% { opacity: .2; }
  100% { transform: translateY(100%); opacity: 0; }
}

@keyframes rotateHalo {
  to { transform: translateY(-50%) rotate(360deg); }
}

@keyframes pulseRail {
  0%, 100% { opacity: .55; transform: scaleX(.72); transform-origin: left; }
  50% { opacity: 1; transform: scaleX(1); transform-origin: left; }
}

@keyframes stageSweep {
  0%, 45% { transform: translateX(-120%); }
  100% { transform: translateX(120%); }
}

@media (prefers-reduced-motion: reduce) {
  body::after,
  .bio-scan,
  .hero > .container::after,
  .page-hero > .container::after,
  .hero h1::after,
  .page-hero h1::after,
  .stage-track .stage.active::after,
  .stage-track .stage5.active::after,
  .public-phase.active::after {
    animation: none;
  }
}

@media (max-width: 768px) {
  body::after {
    display: none;
  }

  .tech-canvas {
    opacity: .38;
  }

  .bio-scan {
    opacity: .14;
  }

  .hero > .container::after,
  .page-hero > .container::after {
    right: -48vw;
    width: 86vw;
    height: 86vw;
    opacity: .38;
  }

  .hero .eyebrow,
  .page-hero .eyebrow {
    padding: 6px 9px;
  }

  .tech-page-label {
    margin-top: 12px;
    font-size: 11px;
    letter-spacing: .08em;
  }

  .tech-page-label::before {
    width: 28px;
  }

  .tech-chip-row {
    gap: 7px;
    margin-top: 16px;
  }

  .tech-chip {
    padding: 6px 9px;
    font-size: 11px;
  }

  .tech-hero-metrics {
    grid-template-columns: repeat(3, 1fr);
    margin-top: 18px;
    border-radius: 10px;
  }

  .tech-hero-metrics span {
    min-height: 66px;
    padding: 11px 10px;
  }

  .tech-hero-metrics strong {
    font-size: 19px;
  }

  .tech-hero-metrics em {
    font-size: 10px;
  }

  .tech-section::after {
    top: 16px;
    right: 18px;
    font-size: 54px;
  }

  .card-body::before,
  .stat-card::after,
  .timeline-step::after {
    width: 38px;
    height: 38px;
    opacity: .18;
  }
}
