/* ============================================================
   MERIDIAN — Antikythera Technologies design language v2 (2026)
   "Ancient precision, machine intelligence."
   Tokyo Night palette retained. Loaded LAST — intentionally wins
   the cascade over the legacy 2024/25 stylesheets.
   Type: Marcellus (lapidary display) · Schibsted Grotesk (body)
         · JetBrains Mono (instrument labels)
   ============================================================ */

:root {
  /* Palette — Tokyo Night, unchanged */
  --mn-void: #0d0e14;
  --mn-bg: #1a1b26;
  --mn-bg-raised: #1f2130;
  --mn-bg-panel: rgba(26, 27, 38, 0.72);
  --mn-line: rgba(86, 95, 137, 0.28);
  --mn-line-strong: rgba(122, 162, 247, 0.38);
  --mn-text: #c0caf5;
  --mn-text-dim: #9aa5ce;
  --mn-text-faint: #565f89;
  --mn-blue: #7aa2f7;
  --mn-purple: #bb9af7;
  --mn-cyan: #7dcfff;
  --mn-green: #9ece6a;
  --mn-gold: #e0af68;
  --mn-red: #f7768e;

  --mn-display: "Marcellus", "Times New Roman", serif;
  --mn-body: "Schibsted Grotesk", "Segoe UI", sans-serif;
  --mn-mono: "JetBrains Mono", "SFMono-Regular", monospace;

  --mn-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --mn-radius: 14px;
}

/* ── Global resets over legacy styles ──────────────────────── */

html { scroll-behavior: smooth; }

body {
  font-family: var(--mn-body) !important;
  background-color: var(--mn-void) !important;
  color: var(--mn-text);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Layered atmosphere: nebula glows + grain, replaces cyber-grid */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  background:
    radial-gradient(1100px 700px at 85% -10%, rgba(187, 154, 247, 0.10), transparent 60%),
    radial-gradient(900px 600px at -10% 35%, rgba(122, 162, 247, 0.09), transparent 60%),
    radial-gradient(700px 500px at 60% 110%, rgba(125, 207, 255, 0.07), transparent 60%),
    linear-gradient(180deg, var(--mn-void) 0%, var(--mn-bg) 45%, var(--mn-void) 100%);
  pointer-events: none;
}
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  opacity: 0.05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
  pointer-events: none;
}

/* Retire legacy particle/grid layers without touching markup */
.particles, .cyber-grid { display: none !important; }

::selection { background: rgba(122, 162, 247, 0.35); color: #fff; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--mn-void); }
::-webkit-scrollbar-thumb {
  background: #2a2e44;
  border-radius: 5px;
  border: 2px solid var(--mn-void);
}
::-webkit-scrollbar-thumb:hover { background: #3b4261; }

/* ── Typography ────────────────────────────────────────────── */

h1, h2, h3, .title, .main__title, .hero-main-title {
  font-family: var(--mn-display) !important;
  font-weight: 400 !important;
  letter-spacing: 0.01em;
  text-transform: none;
}

h4, h5, h6 { font-family: var(--mn-body) !important; font-weight: 600; }

p, li, .main__text, .about__text, .service-description {
  font-family: var(--mn-body) !important;
  line-height: 1.75;
  color: var(--mn-text-dim);
}

/* Lapidary gradient titles — calmer than the old holographic shimmer */
.holographic, .glow-text {
  background: linear-gradient(115deg, #e6ecff 0%, var(--mn-blue) 38%, var(--mn-purple) 72%, var(--mn-cyan) 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  animation: none !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Section badges → engraved instrument labels */
.section-badge, .main__badge, .glass-badge.section-badge {
  font-family: var(--mn-mono) !important;
  font-size: 0.72rem !important;
  font-weight: 500;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--mn-cyan) !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 0 0.9rem 0 !important;
  box-shadow: none !important;
  display: inline-flex;
  align-items: center;
  gap: 0.9rem;
}
.section-badge::before, .section-badge::after {
  content: "";
  height: 1px;
  width: 2.2rem;
  background: linear-gradient(90deg, transparent, var(--mn-line-strong));
}
.section-badge::after {
  background: linear-gradient(90deg, var(--mn-line-strong), transparent);
}

.section-header { text-align: center; margin-bottom: 3.2rem; }
.section-header .title { font-size: clamp(2rem, 4.4vw, 3.2rem); }

/* ── Header / navigation ───────────────────────────────────── */

.header.glass-nav, .header {
  background: rgba(13, 14, 20, 0.78) !important;
  backdrop-filter: blur(18px) saturate(140%);
  border-bottom: 1px solid var(--mn-line) !important;
  box-shadow: none !important;
  transition: background 0.4s var(--mn-ease), border-color 0.4s var(--mn-ease);
}
.header.is-scrolled {
  background: rgba(13, 14, 20, 0.94) !important;
  border-bottom-color: var(--mn-line-strong) !important;
}

.header__logo span, .header__logo .holographic {
  font-family: var(--mn-display) !important;
  font-size: 1.06rem;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.menu__link {
  font-family: var(--mn-mono) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mn-text-dim) !important;
  position: relative;
  transition: color 0.25s var(--mn-ease);
}
.menu__link::after {
  content: "";
  position: absolute;
  left: 0; right: 100%;
  bottom: -6px;
  height: 1px;
  background: var(--mn-cyan);
  transition: right 0.3s var(--mn-ease);
}
.menu__link:hover { color: #fff !important; }
.menu__link:hover::after { right: 0; }

/* ── Buttons — engraved bezels ─────────────────────────────── */

.button, .glass-button, .service-link {
  font-family: var(--mn-mono) !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  border-radius: 4px !important;
  border: 1px solid var(--mn-line-strong) !important;
  background: rgba(122, 162, 247, 0.06) !important;
  color: var(--mn-text) !important;
  padding: 0.85rem 1.7rem !important;
  box-shadow: none !important;
  transition: transform 0.25s var(--mn-ease), background 0.25s var(--mn-ease),
              border-color 0.25s var(--mn-ease), box-shadow 0.25s var(--mn-ease);
}
.button:hover, .glass-button:hover, .service-link:hover {
  transform: translateY(-2px);
  background: rgba(122, 162, 247, 0.14) !important;
  border-color: var(--mn-blue) !important;
  box-shadow: 0 8px 30px -12px rgba(122, 162, 247, 0.5) !important;
}
.glass-button--primary {
  background: linear-gradient(120deg, rgba(122, 162, 247, 0.22), rgba(187, 154, 247, 0.22)) !important;
  border-color: var(--mn-blue) !important;
  color: #fff !important;
}

/* ── MERIDIAN HERO ─────────────────────────────────────────── */

.mn-hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;
  isolation: isolate;
}

.mn-hero__media {
  position: absolute;
  inset: 0;
  z-index: -3;
}
.mn-hero__media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.6) saturate(1.1) contrast(1.05);
}
/* Scrims: readable text, video glows through the right side */
.mn-hero__scrim {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgba(13, 14, 20, 0.94) 0%, rgba(13, 14, 20, 0.78) 38%, rgba(13, 14, 20, 0.28) 75%, rgba(13, 14, 20, 0.55) 100%),
    linear-gradient(180deg, rgba(13, 14, 20, 0.85) 0%, transparent 25%, transparent 70%, var(--mn-void) 100%);
}
/* Engraved astrolabe ring over the video */
.mn-hero__ring {
  position: absolute;
  z-index: -1;
  right: -12vw;
  top: 50%;
  width: 56vw;
  max-width: 880px;
  aspect-ratio: 1;
  transform: translateY(-50%);
  opacity: 0.5;
  pointer-events: none;
  animation: mn-ring-spin 240s linear infinite;
}

.mn-hero__inner {
  width: min(1200px, calc(100% - 3rem));
  margin: 0 auto;
  padding: 9rem 0 4rem;
}

.mn-hero__overline {
  font-family: var(--mn-mono);
  font-size: 0.74rem;
  letter-spacing: 0.42em;
  text-transform: uppercase;
  color: var(--mn-cyan);
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.8rem;
}
.mn-hero__overline::before {
  content: "";
  width: 3rem;
  height: 1px;
  background: var(--mn-cyan);
  opacity: 0.6;
}

.mn-hero__title {
  font-family: var(--mn-display);
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  line-height: 1.12;
  color: #e9edfb;
  max-width: 24ch;
  margin: 0 0 1.6rem;
  text-wrap: balance;
  text-shadow: 0 2px 30px rgba(13, 14, 20, 0.9);
}
.mn-hero__title-line { display: block; }
.mn-hero__title em {
  /* The gradient owns its own line — never switches color mid-sentence */
  display: block;
  margin-top: 0.18em;
  font-style: normal;
  background: linear-gradient(115deg, var(--mn-blue), var(--mn-purple) 55%, var(--mn-cyan));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 2px 22px rgba(122, 162, 247, 0.25));
}

.mn-hero__lede {
  max-width: 56ch;
  font-size: clamp(1rem, 1.4vw, 1.16rem);
  line-height: 1.8;
  color: var(--mn-text-dim);
  margin-bottom: 2.6rem;
}
.mn-hero__lede strong { color: var(--mn-text); font-weight: 600; }

.mn-hero__actions { display: flex; flex-wrap: wrap; gap: 1rem; }

/* Instrument readout strip pinned to hero bottom */
.mn-hero__panel {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  border-top: 1px solid var(--mn-line);
  background: rgba(13, 14, 20, 0.66);
  backdrop-filter: blur(14px);
}
.mn-hero__panel-inner {
  width: min(1200px, calc(100% - 3rem));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  font-family: var(--mn-mono);
}
.mn-dial {
  padding: 1.05rem 1.2rem;
  border-left: 1px solid var(--mn-line);
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.mn-dial:last-child { border-right: 1px solid var(--mn-line); }
.mn-dial__label {
  font-size: 0.62rem;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--mn-text-faint);
}
.mn-dial__value {
  font-size: 0.92rem;
  color: var(--mn-text);
  display: flex;
  align-items: center;
  gap: 0.55rem;
  white-space: nowrap;
}
.mn-dial__value .led {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--mn-green);
  box-shadow: 0 0 8px var(--mn-green);
  animation: mn-pulse 2.4s ease-in-out infinite;
}

/* Hero load choreography */
.mn-hero [data-stagger] {
  opacity: 0;
  transform: translateY(26px);
  animation: mn-rise 0.9s var(--mn-ease) forwards;
}
.mn-hero [data-stagger="1"] { animation-delay: 0.15s; }
.mn-hero [data-stagger="2"] { animation-delay: 0.3s; }
.mn-hero [data-stagger="3"] { animation-delay: 0.48s; }
.mn-hero [data-stagger="4"] { animation-delay: 0.66s; }
.mn-hero [data-stagger="5"] { animation-delay: 0.9s; }

/* ── Cards: flatten the glass, engrave the edges ───────────── */

.glass-card, .glass-card-enhanced, .service-card-enhanced,
.project-card, .workforce-highlight {
  background: var(--mn-bg-panel) !important;
  border: 1px solid var(--mn-line) !important;
  border-radius: var(--mn-radius) !important;
  box-shadow: 0 18px 50px -30px rgba(0, 0, 0, 0.8) !important;
  backdrop-filter: blur(12px);
  position: relative;
  overflow: hidden;
  transition: transform 0.35s var(--mn-ease), border-color 0.35s var(--mn-ease),
              box-shadow 0.35s var(--mn-ease);
}
.service-card-enhanced:hover, .project-card:hover {
  transform: translateY(-5px);
  border-color: var(--mn-line-strong) !important;
}

/* ── Instrument cards — the crew-card look, unified site-wide ──
   Every content card carries: the always-on accent top line, the
   engraved corner gear, and the lift + accent border on hover. */
.service-card-enhanced, .testimonial-card, .capability-item,
.stat-card, .workforce-highlight, .mission-card, .feature-card, .why-item,
.industry-card, .service-detail, .timeline-item, .outro__content {
  --crew-accent: var(--mn-blue);
  background:
    linear-gradient(90deg, transparent 8%, color-mix(in srgb, var(--crew-accent) 55%, var(--mn-purple)) 50%, transparent 92%) top / 100% 2px no-repeat,
    var(--mn-bg-panel) !important;
  border: 1px solid var(--mn-line) !important;
  border-radius: var(--mn-radius) !important;
  position: relative;
  overflow: hidden;
  transition: transform 0.35s var(--mn-ease), border-color 0.35s var(--mn-ease),
              box-shadow 0.35s var(--mn-ease);
}
.service-card-enhanced::after, .testimonial-card::after, .capability-item::after,
.stat-card::after, .workforce-highlight::after, .mission-card::after, .feature-card::after,
.why-item::after, .industry-card::after, .service-detail::after, .timeline-item::after, .outro__content::after {
  content: "";
  position: absolute;
  right: -46px;
  bottom: -46px;
  width: 150px;
  height: 150px;
  border: 1px dashed var(--mn-line);
  border-radius: 50%;
  opacity: 0.6;
  transition: transform 1.2s var(--mn-ease);
  pointer-events: none;
}
.service-card-enhanced:hover::after, .testimonial-card:hover::after, .capability-item:hover::after,
.stat-card:hover::after, .workforce-highlight:hover::after, .mission-card:hover::after, .feature-card:hover::after,
.why-item:hover::after, .industry-card:hover::after, .service-detail:hover::after, .timeline-item:hover::after, .outro__content:hover::after {
  transform: rotate(40deg);
}
.testimonial-card:hover, .capability-item:hover, .stat-card:hover,
.workforce-highlight:hover, .mission-card:hover, .feature-card:hover, .why-item:hover,
.industry-card:hover, .service-detail:hover, .timeline-item:hover {
  transform: translateY(-5px);
  border-color: var(--crew-accent) !important;
}
/* gentle accent variety across grids, mirroring the crew palette */
.mission-card:nth-child(2), .capability-item:nth-child(3n+2), .feature-card:nth-child(3n+2),
.why-item:nth-child(3n+2), .industry-card:nth-child(3n+2), .stat-card:nth-child(2) { --crew-accent: var(--mn-purple); }
.mission-card:nth-child(3), .capability-item:nth-child(3n), .feature-card:nth-child(3n),
.why-item:nth-child(3n), .industry-card:nth-child(3n), .stat-card:nth-child(3) { --crew-accent: var(--mn-cyan); }
.stat-card:nth-child(4) { --crew-accent: var(--mn-gold); }

.service-features li {
  font-family: var(--mn-body) !important;
  color: var(--mn-text-dim);
}

.tech-tag, .tech-tag.glass-badge, .status-badge {
  font-family: var(--mn-mono) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.08em;
  border-radius: 3px !important;
  border: 1px solid var(--mn-line) !important;
  background: rgba(125, 207, 255, 0.06) !important;
  color: var(--mn-cyan) !important;
  box-shadow: none !important;
}

/* ── Scroll reveal (driven by js/meridian.js) ──────────────── */

[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  transition: opacity 0.9s var(--mn-ease), transform 0.9s var(--mn-ease);
}
[data-reveal].is-visible { opacity: 1; transform: none; }
[data-reveal="fade"] { transform: none; }

/* ── THE CREW (about page roster) ──────────────────────────── */

.mn-crew__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.4rem;
  margin-top: 2.6rem;
}
@media (max-width: 1100px) {
  .mn-crew__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
  .mn-crew__grid { grid-template-columns: 1fr; }
}

.mn-crew-card {
  --crew-accent: var(--mn-blue);
  background: var(--mn-bg-panel);
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  padding: 1.9rem 1.7rem 1.7rem;
  position: relative;
  overflow: hidden;
  transition: transform 0.35s var(--mn-ease), border-color 0.35s var(--mn-ease);
}
.mn-crew-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--crew-accent), transparent);
  opacity: 0.55;
}
.mn-crew-card::after {
  /* faint engraved gear in the corner */
  content: "";
  position: absolute;
  right: -46px;
  bottom: -46px;
  width: 150px;
  height: 150px;
  border: 1px dashed var(--mn-line);
  border-radius: 50%;
  opacity: 0.6;
  transition: transform 1.2s var(--mn-ease);
}
.mn-crew-card:hover { transform: translateY(-5px); border-color: var(--crew-accent); }
.mn-crew-card:hover::after { transform: rotate(40deg); }

.mn-crew-card__head {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  margin-bottom: 1.1rem;
}
.mn-crew-card__sigil {
  width: 58px; height: 58px;
  flex: 0 0 58px;
  border-radius: 50%;
  border: 1px solid var(--crew-accent);
  display: grid;
  place-items: center;
  font-family: var(--mn-display);
  font-size: 1.5rem;
  color: var(--crew-accent);
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,0.04), transparent 70%);
  box-shadow: inset 0 0 18px -6px var(--crew-accent);
  position: relative;
}
.mn-crew-card__sigil::after {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 1px dashed var(--mn-line);
}
.mn-crew-card__sigil img {
  width: 100%; height: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.mn-crew-card__name {
  font-family: var(--mn-display) !important;
  font-size: 1.35rem;
  color: #e9edfb;
  margin: 0;
}
.mn-crew-card__desig {
  font-family: var(--mn-mono);
  font-size: 0.66rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--crew-accent);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.35rem;
}
.mn-crew-card__desig .led {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--mn-green);
  box-shadow: 0 0 7px var(--mn-green);
  animation: mn-pulse 2.4s ease-in-out infinite;
}
.mn-crew-card__desc {
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--mn-text-dim);
  margin: 0 0 1.2rem;
}
.mn-crew-card__meta {
  font-family: var(--mn-mono);
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  color: var(--mn-text-faint);
  border-top: 1px solid var(--mn-line);
  padding-top: 0.9rem;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

/* Founder spans the full first row — the one human on the crew */
.mn-crew-card--wide { grid-column: 1 / -1; }
.mn-crew-card--wide .mn-crew-card__desc { max-width: 72ch; }

/* Crew accents */
.mn-crew-card--founder { --crew-accent: var(--mn-gold); }
.mn-crew-card--sapphire { --crew-accent: var(--mn-blue); }
.mn-crew-card--kronos { --crew-accent: var(--mn-red); }
.mn-crew-card--claude { --crew-accent: var(--mn-purple); }
.mn-crew-card--codex { --crew-accent: var(--mn-cyan); }
.mn-crew-card--gemini { --crew-accent: var(--mn-green); }
.mn-crew-card--coder { --crew-accent: #ff9e64; } /* Tokyo Night orange — the in-house build */

/* Workforce stat strip */
.mn-statline {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  border: 1px solid var(--mn-line);
  border-radius: var(--mn-radius);
  overflow: hidden;
  margin-top: 2.6rem;
  background: rgba(13, 14, 20, 0.5);
}
.mn-stat {
  padding: 1.5rem 1.2rem;
  text-align: center;
  border-left: 1px solid var(--mn-line);
}
.mn-stat:first-child { border-left: none; }
.mn-stat__value {
  font-family: var(--mn-display);
  font-size: 2.1rem;
  background: linear-gradient(115deg, var(--mn-blue), var(--mn-purple));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.mn-stat__label {
  font-family: var(--mn-mono);
  font-size: 0.64rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--mn-text-faint);
  margin-top: 0.45rem;
}

/* ── Footer & outro ────────────────────────────────────────── */

.footer, footer {
  border-top: 1px solid var(--mn-line) !important;
  background: var(--mn-void) !important;
}

.outro.hero-enhanced, .page__outro {
  background:
    radial-gradient(700px 320px at 50% 100%, rgba(122, 162, 247, 0.12), transparent 70%) !important;
}

/* ── Animations ────────────────────────────────────────────── */

@keyframes mn-rise {
  to { opacity: 1; transform: none; }
}
@keyframes mn-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.35; }
}
@keyframes mn-ring-spin {
  to { transform: translateY(-50%) rotate(360deg); }
}

/* ── Responsiveness ────────────────────────────────────────── */

@media (max-width: 900px) {
  .mn-hero__panel-inner { grid-template-columns: repeat(2, 1fr); }
  .mn-dial:nth-child(3), .mn-dial:nth-child(4) { border-top: 1px solid var(--mn-line); }
  .mn-hero__ring { display: none; }
  .mn-hero__inner { padding-top: 7rem; }
}
@media (max-width: 560px) {
  .mn-hero__panel-inner { grid-template-columns: 1fr 1fr; }
  .mn-dial { padding: 0.8rem 0.9rem; }
  .mn-dial__value { font-size: 0.78rem; }
  .mn-hero__actions .button { width: 100%; text-align: center; }
}

/* ── Reduced motion ────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  .mn-hero [data-stagger] { animation: none; opacity: 1; transform: none; }
  [data-reveal] { transition: none; opacity: 1; transform: none; }
  .mn-hero__ring { animation: none; }
  html { scroll-behavior: auto; }
}

/* ============================================================
   MERIDIAN INTERACTIONS — cursor-driven instrument effects
   (lens reveal, magnetic tilt, spotlight, hero parallax)
   Touch-safe: applied only under (hover:hover) and (pointer:fine).
   ============================================================ */

@media (hover: hover) and (pointer: fine) {

  /* ── Schematic lens reveal (About imagery) ─────────────────
     A cloned, CSS-filtered copy of the image sits above the
     original, masked to a circle that follows the cursor —
     looking through the instrument's loupe at the blueprint. */
  .mn-lens { position: relative; overflow: hidden; }
  .mn-lens__reveal {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.45s var(--mn-ease);
    pointer-events: none;
    -webkit-mask-image: radial-gradient(circle var(--mn-lens-r, 150px) at var(--mn-mx, 50%) var(--mn-my, 50%),
      #000 0%, #000 62%, transparent 100%);
    mask-image: radial-gradient(circle var(--mn-lens-r, 150px) at var(--mn-mx, 50%) var(--mn-my, 50%),
      #000 0%, #000 62%, transparent 100%);
  }
  .mn-lens__reveal img {
    width: 100%; height: 100%;
    object-fit: cover;
    display: block;
    filter: invert(0.86) hue-rotate(195deg) saturate(2.4) contrast(1.15) brightness(0.92);
  }
  /* engraved measurement grid over the schematic */
  .mn-lens__reveal::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
      repeating-linear-gradient(0deg, rgba(125, 207, 255, 0.16) 0 1px, transparent 1px 28px),
      repeating-linear-gradient(90deg, rgba(125, 207, 255, 0.16) 0 1px, transparent 1px 28px),
      radial-gradient(circle at 50% 50%, transparent 60%, rgba(125, 207, 255, 0.12) 100%);
    mix-blend-mode: screen;
  }
  .mn-lens:hover .mn-lens__reveal { opacity: 1; }

  .mn-lens__tag {
    position: absolute;
    left: 1rem; bottom: 0.9rem;
    font-family: var(--mn-mono);
    font-size: 0.62rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--mn-cyan);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    opacity: 0;
    transform: translateY(8px);
    transition: opacity 0.35s var(--mn-ease), transform 0.35s var(--mn-ease);
    pointer-events: none;
    text-shadow: 0 1px 8px rgba(13, 14, 20, 0.9);
  }
  .mn-lens__tag::before {
    content: "";
    width: 7px; height: 7px;
    border-radius: 50%;
    border: 1px solid var(--mn-cyan);
    box-shadow: 0 0 8px var(--mn-cyan);
  }
  .mn-lens:hover .mn-lens__tag { opacity: 1; transform: none; }

  /* ── Magnetic tilt + glare sweep (project showcases) ────── */
  .mn-tilt {
    transform-style: preserve-3d;
    will-change: transform;
  }
  .mn-tilt .project-card__video, .mn-tilt .project-card__content {
    transform: translateZ(18px);
  }
  .mn-tilt::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(105deg,
      transparent 42%,
      rgba(192, 202, 245, 0.07) 48%,
      rgba(125, 207, 255, 0.10) 50%,
      rgba(192, 202, 245, 0.07) 52%,
      transparent 58%);
    background-position: calc(var(--mn-gx, 50%) * 1.6 - 30%) 0;
    background-size: 220% 100%;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 0.35s var(--mn-ease);
    pointer-events: none;
  }
  .mn-tilt:hover::after { opacity: 1; }

  /* ── Cursor spotlight (crew + service cards) ─────────────── */
  .mn-spot::before {
    content: "" !important;
    position: absolute;
    inset: 0;
    border-radius: inherit;
    height: auto !important;
    background: radial-gradient(300px circle at var(--mn-mx, 50%) var(--mn-my, 50%),
      rgba(122, 162, 247, 0.10), transparent 55%) !important;
    opacity: 0;
    transition: opacity 0.4s var(--mn-ease);
    pointer-events: none;
  }
  .mn-crew-card.mn-spot::before {
    background: radial-gradient(300px circle at var(--mn-mx, 50%) var(--mn-my, 50%),
      color-mix(in srgb, var(--crew-accent) 14%, transparent), transparent 55%) !important;
  }
  .mn-spot:hover::before { opacity: 1 !important; }

  /* crew sigil gear spins up under the spotlight */
  .mn-crew-card .mn-crew-card__sigil::after {
    transition: transform 1.4s var(--mn-ease);
  }
  .mn-crew-card:hover .mn-crew-card__sigil::after {
    transform: rotate(180deg);
  }

  /* ── Hero depth parallax ───────────────────────────────────
     Video drifts against the cursor; scaled up so edges never show. */
  .mn-hero__media video {
    transform: scale(1.07)
      translate3d(calc(var(--mn-px, 0) * -14px), calc(var(--mn-py, 0) * -9px), 0);
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
  }
  .mn-hero__inner {
    transform: translate3d(calc(var(--mn-px, 0) * 6px), calc(var(--mn-py, 0) * 4px), 0);
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .mn-lens__reveal, .mn-lens__tag { display: none; }
  .mn-tilt { transform: none !important; }
  .mn-hero__media video, .mn-hero__inner { transform: none !important; }
}


/* ── Engraved stat icons (inline SVG, accent-tinted) ───────── */
.mn-icon {
  width: 44px;
  height: 44px;
  color: var(--crew-accent, var(--mn-blue));
  filter: drop-shadow(0 0 10px color-mix(in srgb, var(--crew-accent, var(--mn-blue)) 40%, transparent));
  transition: transform 1.6s var(--mn-ease);
}
.stat-card:hover .mn-icon { transform: rotate(25deg); }
.stat-card .stat-icon { display: flex; justify-content: center; }

/* Engraved icons inherit accents everywhere; retire legacy glow chrome */
.icon-glow, .service-icon, .why-icon, .feature-icon, .workforce-highlight__icon,
.mission-icon, .industry-icon, .capability-icon {
  background: none !important;
  box-shadow: none !important;
}
.service-card-enhanced:hover .mn-icon, .why-item:hover .mn-icon,
.feature-card:hover .mn-icon, .mission-card:hover .mn-icon,
.capability-item:hover .mn-icon, .industry-card:hover .mn-icon,
.workforce-highlight:hover .mn-icon, .service-detail:hover .mn-icon,
.timeline-item:hover .mn-icon {
  transform: rotate(22deg);
}


/* ── Page hero variant (services — the forge visage) ───────── */
/* Content anchors to the bottom so the artwork's baked-in
   ANTIKYTHERA TECHNOLOGIES wordmark owns the upper band. */
.mn-hero--page {
  min-height: 92svh;
  justify-content: flex-end;
}
.mn-hero__media--image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 78% 30%;
  filter: brightness(0.62) saturate(1.05);
}
.mn-hero__scrim--page {
  background:
    linear-gradient(90deg, rgba(13, 14, 20, 0.95) 0%, rgba(13, 14, 20, 0.8) 40%, rgba(13, 14, 20, 0.3) 72%, rgba(13, 14, 20, 0.5) 100%),
    linear-gradient(180deg, rgba(13, 14, 20, 0.85) 0%, transparent 30%, transparent 65%, var(--mn-void) 100%);
}
.mn-hero--page .mn-hero__inner { padding: 3rem 0 4.5rem; }
@media (hover: hover) and (pointer: fine) {
  .mn-hero__media--image img {
    transform: scale(1.07)
      translate3d(calc(var(--mn-px, 0) * -14px), calc(var(--mn-py, 0) * -9px), 0);
    transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
  }
}
@media (prefers-reduced-motion: reduce) {
  .mn-hero__media--image img { transform: none !important; }
}

/* ── Home service-card icons: full instrument presence ─────── */
.service-card-enhanced .mn-icon {
  width: 68px !important;
  height: 68px !important;
}
.service-card-enhanced .service-icon { margin-bottom: 0.6rem; }

/* Legacy lists prepend a ::before checkmark on top of the literal ✓ in the
   copy — drop the pseudo so each feature reads with exactly one mark. */
.service-features li::before, .why-item li::before { content: none !important; }

/* Wide-and-short viewports: the artwork's wordmark sits mid-frame, so keep
   the text block compact in the lower-left to stay clear of it. */
@media (min-aspect-ratio: 15/8) {
  /* The artwork's wordmark occupies the middle of the frame at wide aspect
     ratios. Pull the text out of the centered column to the left edge and
     cap its width so it always ends before the wordmark begins (~40% in). */
  .mn-hero--page .mn-hero__inner {
    margin-left: 4vw;
    margin-right: auto;
    width: auto;
    max-width: 34vw;
    padding-bottom: 3.5rem;
  }
  .mn-hero--page .mn-hero__title { font-size: clamp(1.9rem, 2.6vw, 3.2rem); }
  .mn-hero--page .mn-hero__lede { font-size: 0.98rem; margin-bottom: 1.8rem; }
}