:root {
  --ink:#102d46;
  --muted:#617181;
  --green:#2f806b;
  --green-soft:#eaf6f0;
  --blue:#1455d9;
  --blue-soft:#edf4ff;
  --cream:#faf7f0;
  --paper:#fffdf9;
  --orange:#b96626;
  --red:#b5443e;
  --line:#dce3e7;
  --white:#ffffff;
}

* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
}

body {
  margin:0;
  font-family:"Inter",Arial,sans-serif;
  color:var(--ink);
  background:var(--paper);
  line-height:1.55;
}

a {
  color:inherit;
}

.nav {
  min-height:82px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding:0 5vw;
  border-bottom:1px solid #edf0f1;
  background:rgba(255,255,255,.96);
  position:sticky;
  top:0;
  z-index:50;
}

.brand {
  display:flex;
  align-items:center;
  gap:12px;
  text-decoration:none;
  white-space:nowrap;
}

.brand strong {
  display:block;
  font-size:19px;
}

.brand small {
  display:block;
  color:var(--muted);
  font-size:11px;
  letter-spacing:.04em;
}

.paw {
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--ink);
  color:white;
  font-size:14px;
}

.nav nav {
  display:flex;
  gap:26px;
  align-items:center;
}

.nav nav a {
  text-decoration:none;
  font-size:13px;
  font-weight:600;
  color:#385064;
}

.nav nav a:hover {
  color:var(--green);
}

.nav-cta {
  text-decoration:none;
  padding:11px 17px;
  border:1px solid var(--ink);
  border-radius:8px;
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
}

.hero {
  min-height:700px;
  padding:90px 7vw 75px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:60px;
  background:
    radial-gradient(circle at 83% 38%, rgba(47,128,107,.09), transparent 26%),
    linear-gradient(180deg,#fff 0%,#fbfcf9 100%);
}

.eyebrow {
  margin:0 0 16px;
  color:var(--green);
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
}

.hero h1 {
  margin:0;
  font-family:"Inter",Arial,sans-serif;
  font-size:clamp(48px,5.3vw,78px);
  line-height:.98;
  letter-spacing:-.045em;
  color:var(--ink);
}

.hero h1 span {
  color:var(--green);
}

.hero-intro {
  max-width:610px;
  margin:28px 0 30px;
  color:#536878;
  font-size:19px;
  line-height:1.65;
}

.actions {
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.button {
  display:inline-block;
  padding:14px 19px;
  border-radius:7px;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
}

.button.primary {
  background:var(--ink);
  color:white;
}

.button.secondary {
  border:1px solid #b8c3ca;
  background:white;
}

.principles {
  display:flex;
  flex-wrap:wrap;
  gap:25px;
  margin-top:45px;
  color:var(--muted);
  font-size:12px;
}

.principles b {
  color:var(--green);
  margin-right:5px;
}

.hero-art {
  min-height:540px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.vitruvian {
  width:min(440px,80vw);
  aspect-ratio:1;
  border:1px solid rgba(47,128,107,.25);
  border-radius:50%;
  position:relative;
  background:
    radial-gradient(circle,rgba(47,128,107,.08) 0 1px,transparent 1.5px);
  background-size:17px 17px;
}

.orbit {
  position:absolute;
  inset:10%;
  border:1px solid rgba(47,128,107,.17);
  border-radius:50%;
}

.orbit-two {
  inset:24%;
}

.human {
  position:absolute;
  left:50%;
  top:18%;
  width:130px;
  height:285px;
  transform:translateX(-50%);
}

.head {
  position:absolute;
  width:48px;
  height:48px;
  border:4px solid var(--green);
  border-radius:50%;
  left:41px;
}

.body {
  position:absolute;
  width:52px;
  height:120px;
  border:4px solid var(--green);
  border-radius:45% 45% 25% 25%;
  left:39px;
  top:54px;
}

.arms {
  position:absolute;
  width:190px;
  height:4px;
  background:var(--green);
  left:-30px;
  top:105px;
}

.legs {
  position:absolute;
  width:80px;
  height:120px;
  border-left:4px solid var(--green);
  border-right:4px solid var(--green);
  left:25px;
  top:164px;
  transform:perspective(100px) rotateX(-5deg);
}

.species {
  position:absolute;
  bottom:15%;
  width:120px;
  height:90px;
}

.dog-shape {
  left:8%;
}

.cat-shape {
  right:8%;
}

.animal-body {
  position:absolute;
  width:82px;
  height:48px;
  border:4px solid var(--green);
  border-radius:50%;
  bottom:5px;
  left:28px;
}

.animal-head {
  position:absolute;
  width:44px;
  height:44px;
  border:4px solid var(--green);
  border-radius:50%;
  left:0;
  bottom:28px;
}

.cat-shape .animal-head:before,
.cat-shape .animal-head:after {
  content:"";
  position:absolute;
  top:-13px;
  width:15px;
  height:18px;
  border-left:4px solid var(--green);
  transform:rotate(25deg);
}

.cat-shape .animal-head:after {
  right:0;
  transform:rotate(-25deg);
}

.dna {
  position:absolute;
  color:rgba(47,128,107,.45);
  font-family:monospace;
  font-size:11px;
  line-height:1.5;
  letter-spacing:3px;
}

.dna-left {
  left:12%;
  top:20%;
}

.dna-right {
  right:10%;
  top:18%;
}

.art-caption {
  position:absolute;
  right:0;
  bottom:0;
  margin:0;
  text-align:right;
  color:var(--muted);
  font-size:14px;
}

.art-caption strong {
  color:var(--green);
  font-size:20px;
}

/* ---------- SHARED SECTIONS ---------- */

section:not(.hero) {
  padding:90px 7vw;
}

.section-heading {
  max-width:760px;
  margin:0 auto 48px;
  text-align:center;
}

.section-heading.left {
  margin-left:0;
  text-align:left;
}

.section-heading h2,
.comparative h2,
.meet h2,
.principle-banner h2 {
  margin:0 0 15px;
  font-family:"Inter",Arial,sans-serif;
  font-size:clamp(36px,4vw,55px);
  line-height:1.05;
  letter-spacing:-.035em;
}

.section-heading > p:last-child {
  color:var(--muted);
  font-size:17px;
}


/* ---------- SPECIES CARDS ---------- */

.why {
  background:var(--cream);
}

.species-grid {
  max-width:1250px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
}

.species-card {
  min-height:500px;
  padding:34px;
  border:1px solid rgba(16,45,70,.1);
  border-radius:18px;
  background:white;
  box-shadow:0 12px 40px rgba(16,45,70,.05);
}

.human-card {
  border-top:5px solid var(--blue);
}

.dog-card {
  border-top:5px solid var(--green);
}

.cat-card {
  border-top:5px solid var(--orange);
}

.species-label {
  margin:0 0 15px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.13em;
}

.human-card .species-label,
.human-card .big-stat {
  color:var(--blue);
}

.dog-card .species-label,
.dog-card .big-stat {
  color:var(--green);
}

.cat-card .species-label,
.cat-card .big-stat {
  color:var(--orange);
}

.big-stat {
  margin:0 0 10px;
  font-family:"Inter",Arial,sans-serif;
  font-size:64px;
  font-weight:700;
  line-height:1;
}

.big-stat.words {
  font-size:37px;
  line-height:1.05;
}

.stat-copy {
  min-height:85px;
  color:var(--muted);
}

.species-card h3 {
  margin-top:30px;
  font-size:15px;
}

.species-card ul {
  margin:16px 0 0;
  padding:0;
  list-style:none;
}

.species-card li {
  padding:12px 0;
  border-top:1px solid #edf0f1;
  font-size:14px;
}

.species-card li span {
  display:block;
  margin-top:2px;
  color:var(--muted);
  font-size:12px;
}

.source-note {
  margin-top:18px;
  color:#7b8993;
  font-size:11px;
}


/* ---------- COMPARATIVE ONCOLOGY ---------- */

.comparative {
  display:grid;
  grid-template-columns:1.15fr .85fr .85fr;
  gap:55px;
  align-items:start;
  background:var(--ink);
  color:white;
}

.comparative .eyebrow {
  color:#82c8b2;
}

.comparative h2 {
  color:white;
}

.comparative > p {
  margin-top:34px;
  color:#d5e0e7;
  font-size:16px;
  line-height:1.8;
}


/* ---------- METHOD ---------- */

.how {
  background:white;
}

.steps {
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.steps article {
  padding:35px 30px 42px;
  border-right:1px solid var(--line);
}

.steps article:last-child {
  border-right:none;
}

.step-no {
  margin-bottom:40px;
  color:var(--green);
  font-family:"Inter",Arial,sans-serif;
  font-size:30px;
  font-weight:700;
}

.steps h3 {
  margin:0 0 12px;
  font-size:22px;
}

.steps p {
  margin:0;
  color:var(--muted);
  font-size:14px;
}


/* ---------- RESEARCH LEDGER ---------- */

.research {
  background:#f3f8f6;
}

.ledger-grid {
  max-width:1250px;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:24px;
}

.ledger {
  padding:36px;
  background:white;
  border:1px solid #d9e5e0;
  border-radius:16px;
}

.ledger.validated {
  box-shadow:inset 5px 0 0 var(--green);
}

.ledger.active {
  box-shadow:inset 5px 0 0 var(--blue);
}

.ledger-top {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  margin-bottom:26px;
  color:#73818c;
  font-size:12px;
  font-weight:800;
  letter-spacing:.06em;
}

.status {
  padding:7px 10px;
  border-radius:5px;
  font-size:10px;
  letter-spacing:.1em;
}

.status-green {
  color:#226a57;
  background:var(--green-soft);
}

.status-blue {
  color:#174eaa;
  background:var(--blue-soft);
}

.ledger h3 {
  margin:0 0 16px;
  font-family:"Inter",Arial,sans-serif;
  font-size:28px;
  line-height:1.18;
}

.ledger > p {
  color:var(--muted);
}

.iterations {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:28px 0;
}

.iterations span {
  padding:8px 11px;
  border-radius:6px;
  font-size:11px;
  font-weight:800;
}

.failed {
  color:#8e403d;
  background:#f9eceb;
}

.passed {
  color:#226a57;
  background:var(--green-soft);
}

.numbers {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:25px 0;
}

.numbers > div {
  padding:20px;
  border-radius:10px;
  background:#f6f9f8;
}

.numbers strong {
  display:block;
  color:var(--green);
  font-family:"Inter",Arial,sans-serif;
  font-size:32px;
}

.numbers span {
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:11px;
  line-height:1.4;
}

.fine {
  font-size:11px;
  line-height:1.6;
}

.ledger > a {
  display:inline-block;
  margin-top:8px;
  color:var(--green);
  font-size:13px;
  font-weight:800;
  text-decoration:none;
}

.question-box {
  margin:30px 0;
  padding:22px;
  border-radius:10px;
  background:var(--blue-soft);
}

.question-box small {
  color:var(--blue);
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}

.question-box p {
  margin:8px 0 0;
  color:#264867;
  font-size:15px;
  font-weight:600;
}

.coming {
  color:#71808c;
  font-size:12px;
}

/* ---------- ARCHIE-000 STORY ---------- */

.archie000 {
  background:var(--paper);
}

.story-grid {
  max-width:1150px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.story-grid article {
  position:relative;
  padding:32px;
  border:1px solid var(--line);
  border-radius:14px;
  background:white;
}

.attempt {
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  margin-bottom:25px;
  border-radius:50%;
  color:white;
  font-weight:800;
}

.failed-dot {
  background:var(--red);
}

.pass-dot {
  background:var(--green);
}

.story-grid h3 {
  margin:0 0 6px;
  font-size:20px;
}

.story-grid strong {
  font-size:13px;
}

.story-grid p {
  color:var(--muted);
  font-size:14px;
}

.research-note {
  max-width:900px;
  margin:40px 0 0;
  padding:22px 25px;
  border-left:4px solid var(--green);
  background:var(--green-soft);
  font-family:"Inter",Arial,sans-serif;
  font-size:18px;
}


/* ---------- LATEST RESEARCH ---------- */

.latest {
  background:var(--cream);
}

.latest-grid {
  max-width:1200px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.latest-grid article {
  padding:30px;
  border:1px solid #e1e4df;
  border-radius:14px;
  background:white;
}

.latest-grid article > span {
  color:var(--green);
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}

.latest-grid h3 {
  margin:15px 0;
  font-family:"Inter",Arial,sans-serif;
  font-size:23px;
  line-height:1.2;
}

.latest-grid p {
  margin:0;
  color:var(--muted);
  font-size:14px;
}


/* ---------- MEET ARCHIE ---------- */

.meet {
  min-height:650px;
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  align-items:center;
  gap:70px;
  background:white;
}

.archie-photo {
  min-height:480px;
  overflow:hidden;
  position:relative;
  border-radius:18px;
  background:
    linear-gradient(135deg,#e7eee9,#cbd9d1);
}

.archie-photo img {
  width:100%;
  height:100%;
  min-height:480px;
  position:absolute;
  inset:0;
  object-fit:cover;
  object-position:center;
}

.photo-placeholder {
  min-height:480px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:var(--green);
}

.photo-placeholder span {
  font-family:"Inter",Arial,sans-serif;
  font-size:56px;
  font-weight:700;
}

.photo-placeholder small {
  color:var(--muted);
}

.meet-copy {
  max-width:620px;
}

.meet-copy .lead {
  color:var(--ink);
  font-family:"Inter",Arial,sans-serif;
  font-size:24px;
  line-height:1.4;
}

.meet-copy > p:not(.eyebrow):not(.lead):not(.archie-line) {
  color:var(--muted);
  font-size:17px;
}

.archie-line {
  margin-top:35px;
  color:var(--green);
  font-family:"Inter",Arial,sans-serif;
  font-size:24px;
  font-weight:700;
}


/* ---------- PRINCIPLE ---------- */

.principle-banner {
  text-align:center;
  color:white;
  background:var(--green);
}

.principle-banner .eyebrow {
  color:#c8eadf;
}

.principle-banner h2 {
  color:white;
}

.principle-banner > p:last-child {
  max-width:700px;
  margin:18px auto 0;
  color:#e0f0eb;
}


/* ---------- FOOTER ---------- */

footer {
  min-height:180px;
  padding:45px 7vw;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:25px;
  align-items:start;
  color:#c5d0d7;
  background:#0c263b;
}

footer strong {
  display:block;
  color:white;
  font-size:18px;
}

footer span {
  display:block;
  margin-top:3px;
  font-size:11px;
}

footer p {
  margin:0;
  text-align:right;
}

footer small {
  grid-column:1 / -1;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12);
  color:#91a2ae;
}


/* ---------- ACCESSIBILITY ---------- */

a:focus-visible,
button:focus-visible {
  outline:3px solid #e5a43d;
  outline-offset:3px;
}

::selection {
  background:#cde9df;
  color:var(--ink);
}


/* ---------- TABLET ---------- */

@media (max-width:1050px) {

  .nav nav {
    display:none;
  }

  .hero {
    grid-template-columns:1fr;
    padding-top:70px;
  }

  .hero-copy {
    max-width:760px;
  }

  .hero-art {
    min-height:500px;
  }

  .species-grid {
    grid-template-columns:1fr;
  }

  .species-card {
    min-height:auto;
  }

  .stat-copy {
    min-height:auto;
  }

  .comparative {
    grid-template-columns:1fr;
    gap:10px;
  }

  .comparative > p {
    margin-top:15px;
  }

  .steps {
    grid-template-columns:1fr 1fr;
  }

  .steps article:nth-child(2) {
    border-right:none;
  }

  .steps article:nth-child(-n+2) {
    border-bottom:1px solid var(--line);
  }

  .ledger-grid {
    grid-template-columns:1fr;
  }

  .meet {
    grid-template-columns:1fr;
  }

  .archie-photo {
    max-width:700px;
    width:100%;
  }
}


/* ---------- MOBILE ---------- */

@media (max-width:680px) {

  .nav {
    min-height:70px;
    padding:0 20px;
  }

  .brand strong {
    font-size:16px;
  }

  .brand small {
    font-size:9px;
  }

  .nav-cta {
    display:none;
  }

  .hero {
    min-height:auto;
    padding:60px 22px;
    gap:20px;
  }

  .hero h1 {
    font-size:48px;
  }

  .hero-intro {
    font-size:17px;
  }

  .actions {
    flex-direction:column;
  }

  .button {
    text-align:center;
  }

  .principles {
    gap:12px;
    flex-direction:column;
  }

  .hero-art {
    min-height:390px;
  }

  .vitruvian {
    width:330px;
  }

  .art-caption {
    right:10px;
  }

  section:not(.hero) {
    padding:65px 22px;
  }

  .section-heading {
    margin-bottom:35px;
  }

  .species-card {
    padding:27px;
  }

  .big-stat {
    font-size:55px;
  }

  .big-stat.words {
    font-size:34px;
  }

  .steps {
    grid-template-columns:1fr;
  }

  .steps article,
  .steps article:nth-child(2) {
    border-right:none;
    border-bottom:1px solid var(--line);
  }

  .steps article:last-child {
    border-bottom:none;
  }

  .step-no {
    margin-bottom:20px;
  }

  .ledger {
    padding:25px;
  }

  .ledger h3 {
    font-size:24px;
  }

  .numbers {
    grid-template-columns:1fr;
  }

  .story-grid,
  .latest-grid {
    grid-template-columns:1fr;
  }

  .meet {
    gap:35px;
  }

  .archie-photo,
  .archie-photo img,
  .photo-placeholder {
    min-height:380px;
  }

  footer {
    grid-template-columns:1fr;
    padding:40px 22px;
  }

  footer p {
    text-align:left;
  }

  footer small {
    grid-column:auto;
  }
}

/* ---------- REAL ARCHIE VISUALS ---------- */

.hero-art-real {
  min-height:540px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}

.species-hero-image {
  display:block;
  width:100%;
  max-width:650px;
  height:auto;
  object-fit:contain;
}

.hero-art-real .art-caption {
  position:absolute;
  right:0;
  bottom:10px;
  padding:10px 14px;
  border-radius:8px;
  background:rgba(255,253,249,.88);
  backdrop-filter:blur(5px);
}

@media (max-width:1050px) {
  .species-hero-image {
    max-width:620px;
  }
}

@media (max-width:680px) {
  .hero-art-real {
    min-height:360px;
  }

  .species-hero-image {
    width:115%;
    max-width:none;
  }

  .hero-art-real .art-caption {
    right:0;
    bottom:0;
  }
}

.source-note a {
  display:block;
  margin-top:6px;
  color:var(--green);
  font-weight:700;
  text-decoration:none;
}

.source-note a:hover {
  text-decoration:underline;
}

.tao-credit {
  margin-top:9px !important;
  color:#a9bac5 !important;
}

.tao-credit a {
  color:white;
  font-weight:700;
  text-decoration:none;
}

.tao-credit a:hover {
  text-decoration:underline;
}

/* ---------- SPECIES CARD PHOTOGRAPHY ---------- */

.species-card {
  overflow:hidden;
  padding:0;
}

.species-card > *:not(.species-card-visual) {
  margin-left:34px;
  margin-right:34px;
}

.species-card > .stat-copy {
  margin-top:28px;
}

.species-card > .source-note {
  margin-bottom:30px;
}

.species-card-visual {
  min-height:255px;
  position:relative;
  overflow:hidden;
  background:#edf3ef;
}

.species-card-visual img {
  width:100%;
  height:255px;
  display:block;
  object-fit:cover;
}

.dog-visual img {
  object-position:center 45%;
}

.species-stat-overlay {
  position:absolute;
  inset:0;
  padding:30px 34px;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,.97) 0%,
    rgba(255,255,255,.88) 37%,
    rgba(255,255,255,.08) 68%,
    rgba(255,255,255,0) 100%
  );
}

.species-stat-overlay .species-label {
  margin:0 0 15px;
}

.species-stat-overlay .big-stat {
  margin:0;
  font-size:54px;
}

@media (max-width:680px) {
  .species-card > *:not(.species-card-visual) {
    margin-left:27px;
    margin-right:27px;
  }

  .species-card-visual,
  .species-card-visual img {
    height:230px;
    min-height:230px;
  }

  .species-stat-overlay {
    padding:27px;
  }
}

/* ---------- THREE SPECIES VISUAL CARDS v0.3 ---------- */

.human-visual img {
  object-position:center 38%;
}

.cat-visual img {
  object-position:center 42%;
}

.human-visual .species-stat-overlay {
  background:linear-gradient(
    90deg,
    rgba(255,255,255,.98) 0%,
    rgba(255,255,255,.92) 35%,
    rgba(255,255,255,.18) 64%,
    rgba(255,255,255,0) 100%
  );
}

.dog-visual .species-stat-overlay {
  background:linear-gradient(
    90deg,
    rgba(255,255,255,.98) 0%,
    rgba(255,255,255,.91) 37%,
    rgba(255,255,255,.12) 66%,
    rgba(255,255,255,0) 100%
  );
}

.cat-visual .species-stat-overlay {
  background:linear-gradient(
    90deg,
    rgba(255,255,255,.98) 0%,
    rgba(255,255,255,.93) 42%,
    rgba(255,255,255,.16) 69%,
    rgba(255,255,255,0) 100%
  );
}

.cat-visual .species-stat-overlay .big-stat.words {
  max-width:230px;
  font-size:32px;
  line-height:1.05;
}

@media (max-width:680px) {
  .cat-visual .species-stat-overlay .big-stat.words {
    max-width:190px;
    font-size:28px;
  }
}

/* ---------- SPECIES CARDS v0.3.1: CONTRAST + CROPS ---------- */

.species-card-visual {
  height:260px;
  min-height:260px;
  background:#eef3f1;
}

.species-card-visual img {
  width:100%;
  height:100%;
  object-fit:cover;
}

/* Human: keep face clearly visible on right half. */
.human-visual img {
  object-position:56% 38%;
}

/* Archie: pull back as much as portrait source permits. */
.dog-visual img {
  object-position:50% 43%;
}

/* Cat composition already works well. */
.cat-visual img {
  object-position:57% 42%;
}

/* Remove photographic wash-out gradients. */
.human-visual .species-stat-overlay,
.dog-visual .species-stat-overlay,
.cat-visual .species-stat-overlay {
  inset:22px auto auto 22px;
  width:auto;
  height:auto;
  max-width:56%;
  padding:16px 20px 18px;
  border-radius:12px;
  background:rgba(255,255,255,.96);
  box-shadow:0 6px 24px rgba(16,45,70,.12);
  backdrop-filter:blur(7px);
}

/* Guaranteed high-contrast text. */
.species-stat-overlay .species-label {
  margin:0 0 8px;
}

.species-stat-overlay .big-stat {
  margin:0;
  line-height:.95;
  text-shadow:none;
}

.human-visual .species-label,
.human-visual .big-stat {
  color:#1257cf;
}

.dog-visual .species-label,
.dog-visual .big-stat {
  color:#176b58;
}

.cat-visual .species-label,
.cat-visual .big-stat {
  color:#a84e12;
}

.cat-visual .species-stat-overlay {
  max-width:58%;
}

.cat-visual .species-stat-overlay .big-stat.words {
  max-width:250px;
  font-size:30px;
  line-height:1.05;
}

/* Give Archie slightly more vertical room on desktop. */
.dog-visual {
  height:285px;
  min-height:285px;
}

/* Keep cards aligned despite Archie's taller image. */
.species-card {
  display:flex;
  flex-direction:column;
}

.species-card .source-note {
  margin-top:auto;
  padding-top:20px;
}

@media (max-width:680px) {

  .species-card-visual,
  .dog-visual {
    height:240px;
    min-height:240px;
  }

  .species-stat-overlay,
  .human-visual .species-stat-overlay,
  .dog-visual .species-stat-overlay,
  .cat-visual .species-stat-overlay {
    inset:14px auto auto 14px;
    max-width:68%;
    padding:13px 15px 14px;
  }

  .species-stat-overlay .big-stat {
    font-size:42px;
  }

  .cat-visual .species-stat-overlay .big-stat.words {
    font-size:25px;
  }

  .human-visual img {
    object-position:58% 40%;
  }

  .dog-visual img {
    object-position:50% 42%;
  }

  .cat-visual img {
    object-position:58% 42%;
  }
}

/* ---------- v0.4 MOBILE + ACCESSIBILITY ---------- */

.menu-button {
  display:none;
  width:44px;
  height:44px;
  padding:10px;
  border:0;
  border-radius:8px;
  background:transparent;
  cursor:pointer;
}

.menu-button span {
  display:block;
  width:23px;
  height:2px;
  margin:5px auto;
  background:var(--ink);
  border-radius:2px;
}

.button,
.nav-cta,
.menu-button,
.source-note a {
  min-height:44px;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after {
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

@media (max-width:1050px) {

  .menu-button {
    display:block;
    margin-left:auto;
  }

  .nav {
    position:sticky;
  }

  .nav nav {
    display:none;
    position:absolute;
    top:70px;
    left:18px;
    right:18px;
    padding:12px;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    border:1px solid var(--line);
    border-radius:12px;
    background:white;
    box-shadow:0 14px 40px rgba(16,45,70,.15);
  }

  .nav nav.mobile-open {
    display:flex;
  }

  .nav nav a {
    min-height:48px;
    display:flex;
    align-items:center;
    padding:0 14px;
    border-bottom:1px solid #edf0f1;
  }

  .nav nav a:last-child {
    border-bottom:0;
  }
}

@media (max-width:680px) {

  html,
  body {
    max-width:100%;
    overflow-x:hidden;
  }

  .nav {
    padding:0 18px;
  }

  .hero {
    padding:50px 20px 55px;
  }

  .hero h1 {
    font-size:clamp(42px,12.5vw,54px);
    line-height:1.01;
    letter-spacing:-.045em;
  }

  .hero-intro {
    margin-top:24px;
    font-size:16px;
    line-height:1.6;
  }

  .hero-art-real {
    min-height:330px;
    margin-top:15px;
  }

  .species-hero-image {
    width:108%;
  }

  .hero-art-real .art-caption {
    right:5px;
    bottom:0;
    font-size:12px;
  }

  .hero-art-real .art-caption strong {
    font-size:17px;
  }

  .section-heading h2,
  .comparative h2,
  .meet h2,
  .principle-banner h2 {
    font-size:36px;
  }

  .species-grid {
    gap:18px;
  }

  .species-card {
    border-radius:14px;
  }

  .species-card .stat-copy {
    font-size:15px;
  }

  .species-card h3 {
    font-size:16px;
  }

  .species-card li {
    font-size:14px;
  }

  .ledger-top {
    align-items:flex-start;
    flex-direction:column-reverse;
  }

  .iterations {
    display:grid;
    grid-template-columns:1fr;
  }

  .iterations span {
    text-align:center;
  }

  .story-grid article,
  .latest-grid article {
    padding:25px;
  }

  .archie-photo,
  .archie-photo img {
    min-height:420px;
  }

  .archie-photo img {
    object-position:54% center;
  }

  .research-note {
    font-size:16px;
  }
}

@media (max-width:360px) {

  .hero h1 {
    font-size:40px;
  }

  .brand strong {
    font-size:15px;
  }

  .brand small {
    display:none;
  }

  .species-stat-overlay,
  .human-visual .species-stat-overlay,
  .dog-visual .species-stat-overlay,
  .cat-visual .species-stat-overlay {
    max-width:75%;
  }
}

/* ---------- SPECIES CARDS FINAL ---------- */

.species-grid {
  align-items:stretch;
}

.species-card {
  display:flex;
  flex-direction:column;
  height:100%;
}

.species-card-visual,
.dog-visual {
  position:relative;
  width:100%;
  height:300px !important;
  min-height:300px !important;
  overflow:hidden;
}

.species-card-visual img,
.dog-visual img {
  width:100%;
  height:100% !important;
  min-height:0 !important;
  display:block;
  object-fit:cover;
}

/* Better individual crops */
.human-visual img {
  object-position:50% 38%;
}

.dog-visual img {
  object-position:50% 42%;
}

.cat-visual img {
  object-position:57% 42%;
}

/* Override all earlier overlay treatments */
.species-stat-overlay,
.human-visual .species-stat-overlay,
.dog-visual .species-stat-overlay,
.cat-visual .species-stat-overlay {
  position:absolute !important;
  inset:auto 0 0 0 !important;
  width:100% !important;
  height:auto !important;
  max-width:none !important;
  padding:70px 30px 25px !important;
  border-radius:0 !important;
  background:linear-gradient(
    to bottom,
    rgba(5,24,38,0) 0%,
    rgba(5,24,38,.20) 25%,
    rgba(5,24,38,.82) 100%
  ) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

/* Guaranteed white high-contrast image typography */
.species-stat-overlay .species-label,
.human-visual .species-label,
.dog-visual .species-label,
.cat-visual .species-label {
  margin:0 0 6px !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.16em !important;
  text-shadow:0 1px 5px rgba(0,0,0,.45);
}

.species-stat-overlay .big-stat,
.human-visual .big-stat,
.dog-visual .big-stat,
.cat-visual .big-stat {
  margin:0 !important;
  max-width:none !important;
  color:#fff !important;
  font-size:50px !important;
  line-height:.98 !important;
  letter-spacing:-.035em;
  text-shadow:0 2px 8px rgba(0,0,0,.42);
}

.cat-visual .species-stat-overlay .big-stat.words {
  max-width:390px !important;
  font-size:34px !important;
  line-height:1.04 !important;
}

/* Align content underneath photographs */
.species-card > .stat-copy {
  min-height:125px;
  margin-top:0 !important;
  padding-top:28px;
}

.species-card h3 {
  margin-top:24px;
}

/* Mobile keeps identical visual logic */
@media (max-width:680px) {
  .species-card-visual,
  .dog-visual {
    height:245px !important;
    min-height:245px !important;
  }

  .species-stat-overlay,
  .human-visual .species-stat-overlay,
  .dog-visual .species-stat-overlay,
  .cat-visual .species-stat-overlay {
    padding:60px 22px 20px !important;
  }

  .species-stat-overlay .big-stat,
  .human-visual .big-stat,
  .dog-visual .big-stat {
    font-size:42px !important;
  }

  .cat-visual .species-stat-overlay .big-stat.words {
    font-size:29px !important;
    max-width:300px !important;
  }

  .species-card > .stat-copy {
    min-height:auto;
    padding-top:24px;
  }
}

/* ---------- INSIDE ARCHIE: FOUNDATION ---------- */

.inside-archie {
  position:relative;
  overflow:hidden;
  color:#e9f2f5;
  background:
    radial-gradient(circle at 80% 15%,rgba(42,166,132,.14),transparent 27%),
    radial-gradient(circle at 15% 75%,rgba(35,91,150,.16),transparent 30%),
    #071b2a;
}

.inside-archie::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.12;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:42px 42px;
}

.inside-archie > * {
  position:relative;
  z-index:1;
}

.inside-head {
  max-width:1250px;
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px;
}

.inside-head .eyebrow {
  color:#5fd0ae;
}

.inside-head h2 {
  max-width:760px;
  margin:0;
  color:white;
  font-size:clamp(38px,4.8vw,68px);
  line-height:1;
  letter-spacing:-.05em;
}

.inside-intro {
  max-width:760px;
  margin:25px 0 50px;
  color:#a9bdc9;
  font-size:17px;
}

.live-chip,
.active-status {
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:#72dbbb;
  font-size:10px;
  font-weight:800;
  letter-spacing:.13em;
}

.live-chip {
  padding:10px 13px;
  border:1px solid rgba(95,208,174,.3);
  border-radius:100px;
  background:rgba(95,208,174,.06);
}

.live-dot {
  width:8px;
  height:8px;
  flex:0 0 auto;
  border-radius:50%;
  background:#55d6ad;
  box-shadow:0 0 0 5px rgba(85,214,173,.1);
  animation:archiePulse 2s infinite;
}

@keyframes archiePulse {
  0%,100% {
    box-shadow:0 0 0 4px rgba(85,214,173,.08);
  }
  50% {
    box-shadow:0 0 0 9px rgba(85,214,173,.02);
  }
}


/* Research engine */

.engine-flow {
  max-width:1250px;
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr auto 1.15fr;
  align-items:stretch;
  gap:8px;
}

.engine-node {
  min-height:150px;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  border:1px solid rgba(151,190,207,.16);
  border-radius:10px;
  background:rgba(255,255,255,.035);
  transition:.2s ease;
}

.engine-node:hover {
  border-color:rgba(95,208,174,.55);
  background:rgba(95,208,174,.06);
  transform:translateY(-2px);
}

.node-icon {
  margin-bottom:auto;
  color:#5fd0ae;
  font-family:monospace;
  font-size:11px;
}

.engine-node strong {
  color:white;
  font-size:14px;
}

.engine-node small {
  margin-top:4px;
  color:#7893a3;
  font-size:10px;
}

.engine-arrow {
  display:grid;
  place-items:center;
  color:#416274;
}

.final-node {
  border-color:rgba(95,208,174,.38);
  background:rgba(95,208,174,.07);
}

/* ---------- INSIDE ARCHIE: VALIDATION ---------- */

.validation-lab {
  max-width:1250px;
  margin-top:70px;
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:22px;
}

.validation-number,
.signal-panel {
  padding:35px;
  border:1px solid rgba(151,190,207,.17);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}

.micro-label {
  margin:0 0 20px;
  color:#5fd0ae;
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
}

.giant-number {
  color:white;
  font-size:clamp(70px,8vw,118px);
  font-weight:800;
  line-height:.9;
  letter-spacing:-.075em;
}

.giant-number span {
  color:#698493;
  font-size:.42em;
  letter-spacing:-.04em;
}

.validation-number > p:not(.micro-label) {
  max-width:390px;
  color:#a7bac5;
}

.expectation {
  margin-top:30px;
  padding-top:25px;
  border-top:1px solid rgba(255,255,255,.1);
}

.expectation strong {
  display:block;
  color:#5fd0ae;
  font-size:32px;
}

.expectation span {
  color:#829ba9;
  font-size:11px;
}

.signal-header {
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-bottom:22px;
  color:#718b9a;
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
}

.signal-row {
  min-height:52px;
  display:grid;
  grid-template-columns:150px 1fr auto;
  gap:16px;
  align-items:center;
  border-top:1px solid rgba(255,255,255,.07);
}

.signal-row span {
  color:#dce8ed;
  font-size:13px;
}

.signal-row i {
  height:1px;
  position:relative;
  overflow:visible;
  background:linear-gradient(90deg,#38a885,#67d5b4);
}

.signal-row i::before,
.signal-row i::after {
  content:"";
  width:9px;
  height:9px;
  position:absolute;
  top:-4px;
  border-radius:50%;
  background:#65d4b3;
  box-shadow:0 0 12px rgba(101,212,179,.5);
}

.signal-row i::before {
  left:0;
}

.signal-row i::after {
  right:0;
}

.signal-row b {
  color:#62d2b0;
  font-size:9px;
  letter-spacing:.1em;
}

.freeze-note {
  margin:25px 0 0;
  padding:17px;
  color:#829aa8;
  border-left:2px solid #3b9279;
  background:rgba(0,0,0,.12);
  font-size:11px;
  line-height:1.6;
}

/* ---------- INSIDE ARCHIE: CROSS-SPECIES MAP ---------- */

.molecular-map {
  max-width:1250px;
  min-height:500px;
  margin-top:22px;
  padding:45px;
  display:grid;
  grid-template-columns:.75fr 1.25fr;
  gap:30px;
  align-items:center;
  border:1px solid rgba(151,190,207,.17);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}

.molecular-copy h3 {
  max-width:450px;
  margin:0 0 18px;
  color:white;
  font-size:36px;
  line-height:1.08;
  letter-spacing:-.035em;
}

.molecular-copy > p:last-child {
  max-width:450px;
  color:#8ea6b3;
}

.molecule-stage {
  height:410px;
  position:relative;
}

.species-orb {
  width:100px;
  height:100px;
  position:absolute;
  z-index:2;
  display:grid;
  place-items:center;
  border:1px solid rgba(111,210,180,.4);
  border-radius:50%;
  color:#dff5ee;
  background:#0d2b3a;
  box-shadow:0 0 40px rgba(53,166,133,.08);
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}

.human-orb {
  left:4%;
  top:4%;
}

.dog-orb {
  left:3%;
  bottom:4%;
}

.cat-orb {
  right:3%;
  top:38%;
}

.gene-core {
  width:210px;
  height:210px;
  position:absolute;
  z-index:2;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  flex-wrap:wrap;
  align-content:center;
  justify-content:center;
  gap:8px;
  padding:30px;
  border:1px solid rgba(95,208,174,.5);
  border-radius:50%;
  background:
    radial-gradient(circle,rgba(52,158,128,.19),rgba(7,27,42,.92));
  box-shadow:0 0 70px rgba(52,158,128,.12);
}

.gene-core small {
  width:100%;
  margin-bottom:6px;
  text-align:center;
  color:#6a9185;
  font-size:8px;
  letter-spacing:.13em;
}

.gene-core strong {
  padding:5px 7px;
  color:#9ce5cf;
  border:1px solid rgba(95,208,174,.2);
  border-radius:4px;
  font-family:monospace;
  font-size:12px;
}

.connections {
  width:100%;
  height:100%;
  position:absolute;
  inset:0;
  z-index:1;
}

.connections path {
  fill:none;
  stroke:#3f9e83;
  stroke-width:1.3;
  stroke-dasharray:5 8;
  opacity:.65;
  animation:archieDash 14s linear infinite;
}

@keyframes archieDash {
  to {
    stroke-dashoffset:-150;
  }
}


/* ---------- ARCHIE-001 ---------- */

.next-question {
  max-width:1250px;
  margin-top:22px;
  padding:55px;
  text-align:center;
  border:1px solid rgba(95,208,174,.26);
  border-radius:14px;
  background:
    radial-gradient(circle at 50% 100%,rgba(53,166,133,.14),transparent 38%),
    rgba(255,255,255,.025);
}

.next-question .active-status {
  justify-content:center;
}

.next-question > p {
  margin:30px 0 10px;
  color:#6e8b9a;
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
}

.next-question h3 {
  margin:0;
  color:#a4bac5;
  font-size:20px;
  font-weight:500;
}

.next-question h2 {
  margin:6px 0 38px;
  color:white;
  font-size:clamp(38px,5vw,66px);
  line-height:1;
  letter-spacing:-.05em;
}

.species-query {
  max-width:900px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr;
  gap:14px;
  align-items:center;
}

.species-query > div:not(.query-plus) {
  min-height:100px;
  padding:22px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  border:1px solid rgba(151,190,207,.18);
  border-radius:9px;
  background:rgba(255,255,255,.035);
}

.species-query span {
  margin-bottom:5px;
  color:#5fd0ae;
  font-size:9px;
  font-weight:800;
  letter-spacing:.14em;
}

.species-query strong {
  color:#e5eff3;
  font-size:14px;
}

.query-plus {
  color:#547281;
  font-size:22px;
}

.missing-experiment {
  max-width:900px;
  min-height:62px;
  margin:16px auto 0;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid #4fc09d;
  border-radius:8px;
  color:#8be1c6;
  background:rgba(65,177,143,.08);
  font-family:monospace;
  font-size:13px;
  font-weight:700;
  letter-spacing:.09em;
}

.missing-experiment span {
  font-size:24px;
}


/* ---------- INSIDE ARCHIE MOBILE ---------- */

@media (max-width:1050px) {

  .inside-head {
    align-items:flex-start;
    flex-direction:column;
  }

  .engine-flow {
    grid-template-columns:1fr 1fr;
    gap:12px;
  }

  .engine-arrow {
    display:none;
  }

  .validation-lab,
  .molecular-map {
    grid-template-columns:1fr;
  }

  .molecule-stage {
    max-width:650px;
    width:100%;
    margin:auto;
  }
}

@media (max-width:680px) {

  .inside-archie {
    padding-left:20px !important;
    padding-right:20px !important;
  }

  .inside-head h2 {
    font-size:42px;
  }

  .inside-intro {
    margin-bottom:35px;
    font-size:15px;
  }

  .engine-flow {
    grid-template-columns:1fr;
  }

  .engine-node {
    min-height:110px;
  }

  .validation-lab {
    margin-top:45px;
  }

  .validation-number,
  .signal-panel,
  .molecular-map,
  .next-question {
    padding:25px;
  }

  .giant-number {
    font-size:78px;
  }

  .signal-header {
    flex-direction:column;
    gap:4px;
  }

  .signal-row {
    grid-template-columns:120px 1fr auto;
    gap:9px;
  }

  .signal-row span {
    font-size:11px;
  }

  .molecular-copy h3 {
    font-size:30px;
  }

  .molecule-stage {
    height:360px;
  }

  .species-orb {
    width:76px;
    height:76px;
    font-size:8px;
  }

  .gene-core {
    width:170px;
    height:170px;
    padding:22px;
  }

  .gene-core strong {
    font-size:10px;
  }

  .species-query {
    grid-template-columns:1fr;
  }

  .query-plus {
    height:18px;
    line-height:18px;
  }

  .species-query > div:not(.query-plus) {
    min-height:75px;
  }

  .next-question h2 {
    font-size:40px;
  }

  .missing-experiment {
    font-size:10px;
    letter-spacing:.06em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .live-dot,
  .connections path {
    animation:none !important;
  }
}

/* ---------- HERO TYPOGRAPHY v0.7 ---------- */

.hero h1 > span {
  display:block;
  margin-top:.18em;
}

/* ---------- ARCHIE EVIDENCE GRAPH ---------- */

.evidence-graph {
  max-width:1250px;
  margin-top:22px;
  padding:45px;
  display:grid;
  grid-template-columns:.62fr 1.38fr;
  gap:35px;
  align-items:center;
  border:1px solid rgba(151,190,207,.17);
  border-radius:14px;
  background:
    radial-gradient(circle at 70% 50%,rgba(48,159,127,.08),transparent 38%),
    rgba(255,255,255,.025);
}

.graph-copy h3 {
  margin:0 0 18px;
  color:#fff;
  font-size:34px;
  line-height:1.08;
  letter-spacing:-.035em;
}

.graph-copy > p:last-of-type {
  color:#8ea6b3;
}

.graph-legend {
  margin-top:30px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  color:#8199a7;
  font-size:10px;
}

.graph-legend span {
  display:flex;
  align-items:center;
  gap:8px;
}

.graph-legend i {
  width:9px;
  height:9px;
  display:inline-block;
  border-radius:50%;
}

.legend-species { background:#65d4b3; }
.legend-gene { background:#7caee8; }
.legend-pathway { background:#d3a45d; }
.legend-evidence { background:#b18add; }

.graph-stage {
  height:520px;
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:
    radial-gradient(circle at center,rgba(255,255,255,.025),transparent 55%),
    rgba(0,0,0,.12);
}

.graph-lines {
  width:100%;
  height:100%;
  position:absolute;
  inset:0;
}

.graph-lines line {
  stroke:#315b68;
  stroke-width:1.4;
  opacity:.65;
}

.graph-node {
  position:absolute;
  z-index:2;
  transform:translate(-50%,-50%);
  border-radius:100px;
  cursor:pointer;
  font-family:Inter,Arial,sans-serif;
  font-weight:800;
  letter-spacing:.06em;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease;
}

.graph-node:hover,
.graph-node:focus-visible {
  transform:translate(-50%,-50%) scale(1.08);
  outline:none;
}

.species-node {
  width:82px;
  height:82px;
  border:1px solid rgba(101,212,179,.65);
  color:#bdf3e2;
  background:#10362f;
  box-shadow:0 0 30px rgba(101,212,179,.08);
  font-size:10px;
}

.gene-node {
  padding:11px 15px;
  border:1px solid rgba(124,174,232,.55);
  color:#bcd8f7;
  background:#112f4b;
  font-family:monospace;
  font-size:11px;
}

.pathway-node {
  padding:12px 15px;
  border:1px solid rgba(211,164,93,.55);
  color:#f0d6ac;
  background:#3c3020;
  font-size:9px;
}

.evidence-node {
  padding:12px 15px;
  border:1px solid rgba(177,138,221,.55);
  color:#dbc5f3;
  background:#302443;
  font-size:9px;
}

.node-human { left:13.1%; top:20.2%; }
.node-dog { left:13.1%; top:50%; }
.node-cat { left:13.1%; top:79.8%; }

.node-bcl6 { left:41.25%; top:32.7%; }
.node-lck { left:41.25%; top:67.3%; }

.node-cycle { left:64.4%; top:21.2%; }
.node-dna { left:64.4%; top:48.1%; }

.node-archie { left:87.5%; top:34.6%; }
.node-published { left:87.5%; top:67.3%; }

.graph-detail {
  min-width:220px;
  max-width:310px;
  position:absolute;
  z-index:4;
  left:50%;
  bottom:20px;
  transform:translateX(-50%);
  padding:13px 16px;
  border:1px solid rgba(101,212,179,.2);
  border-radius:8px;
  background:rgba(7,27,42,.94);
  box-shadow:0 10px 30px rgba(0,0,0,.2);
  text-align:center;
  pointer-events:none;
}

.graph-detail small {
  display:block;
  margin-bottom:4px;
  color:#5fd0ae;
  font-size:8px;
  letter-spacing:.12em;
}

.graph-detail strong {
  color:#dce8ed;
  font-size:11px;
  font-weight:600;
}

@media (max-width:1050px) {
  .evidence-graph {
    grid-template-columns:1fr;
  }

  .graph-stage {
    max-width:800px;
    width:100%;
    margin:auto;
  }
}

@media (max-width:680px) {
  .evidence-graph {
    padding:25px;
  }

  .graph-copy h3 {
    font-size:29px;
  }

  .graph-stage {
    height:430px;
  }

  .graph-node {
    transform:translate(-50%,-50%) scale(.82);
  }

  .graph-node:hover,
  .graph-node:focus-visible {
    transform:translate(-50%,-50%) scale(.9);
  }

  .graph-detail {
    width:80%;
    min-width:0;
  }
}

/* Missing Experiment CTA */

a.missing-experiment {
  text-decoration:none;
  cursor:pointer;
  transition:
    background .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

a.missing-experiment:hover {
  background:rgba(65,177,143,.16);
  box-shadow:0 0 30px rgba(79,192,157,.10);
  transform:translateY(-2px);
}

a.missing-experiment:focus-visible {
  outline:3px solid #8be1c6;
  outline-offset:4px;
}

/* ---------- RESEARCH COLLABORATION ---------- */

.collaborate {
  grid-column:1 / -1;
  max-width:720px;
  padding:22px 0 5px;
}

.collaborate strong {
  color:#fff;
  font-size:15px;
}

.collaborate span {
  max-width:650px;
  display:block;
  margin:5px 0 9px;
  color:#91a5b1;
  font-size:12px;
}

.collaborate a {
  color:#79d9bc;
  font-size:13px;
  font-weight:700;
  text-decoration:none;
}

.collaborate a:hover {
  text-decoration:underline;
}

@media (max-width:680px) {
  .collaborate {
    grid-column:auto;
  }
}

/* ---------- LIVE EVIDENCE GRAPH ---------- */

.graph-node.evidence-live::after {
  content:"";
  width:6px;
  height:6px;
  position:absolute;
  right:2px;
  top:2px;
  border-radius:50%;
  background:#61d7b4;
  box-shadow:0 0 9px rgba(97,215,180,.8);
}

.graph-detail span,
.graph-detail em {
  display:block;
}

.graph-detail span {
  margin-top:5px;
  color:#91a8b5;
  font-size:10px;
  line-height:1.45;
}

.graph-detail em {
  margin-top:7px;
  color:#61d7b4;
  font-size:9px;
  font-style:normal;
  font-weight:700;
  letter-spacing:.06em;
}

.graph-stage[data-live="true"] {
  border-color:rgba(97,215,180,.22);
}

/* ---------- CANCER EXPLAINER ---------- */

.cancer-explainer {
  background:#fff;
}

.cancer-basics {
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--line);
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
}

.cancer-basics article {
  padding:34px;
  background:#fff;
}

.cancer-basics article > span {
  color:var(--green);
  font-family:monospace;
  font-size:11px;
}

.cancer-basics h3 {
  margin:25px 0 12px;
  font-size:20px;
}

.cancer-basics p {
  margin:0;
  color:var(--muted);
  font-size:14px;
}

.shared-different {
  max-width:1200px;
  margin:22px auto 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}

.shared-panel,
.different-panel {
  padding:32px;
  border-radius:14px;
}

.shared-panel {
  background:#edf8f3;
}

.different-panel {
  background:#f5f2eb;
}

.mini-title {
  margin:0 0 20px;
  color:#536b78;
  font-size:10px;
  font-weight:800;
  letter-spacing:.13em;
}

.concept-cloud {
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}

.concept-cloud span {
  padding:9px 12px;
  border-radius:100px;
  background:rgba(255,255,255,.75);
  color:#28465a;
  font-size:12px;
  font-weight:600;
}

.explainer-bottom {
  max-width:850px;
  margin:35px auto 0;
  text-align:center;
  color:#617481;
  font-size:17px;
}

.explainer-bottom strong {
  color:var(--green);
}

@media (max-width:800px) {
  .cancer-basics,
  .shared-different {
    grid-template-columns:1fr;
  }
}

/* ---------- EVIDENCE DRAWER ---------- */

.evidence-count {
  margin:8px auto 0;
  padding:0;
  border:0;
  color:#61d7b4;
  background:transparent;
  cursor:pointer;
  font:inherit;
  font-size:9px;
  font-weight:800;
  letter-spacing:.05em;
}

.evidence-count:hover {
  text-decoration:underline;
}

.evidence-count b {
  margin-left:4px;
}

.evidence-drawer {
  position:fixed;
  inset:0;
  z-index:1000;
  pointer-events:none;
  visibility:hidden;
}

.evidence-drawer.open {
  visibility:visible;
  pointer-events:auto;
}

.drawer-backdrop {
  position:absolute;
  inset:0;
  background:rgba(3,15,24,.62);
  backdrop-filter:blur(3px);
}

.drawer-panel {
  width:min(520px,92vw);
  height:100%;
  position:absolute;
  top:0;
  right:0;
  overflow-y:auto;
  padding:42px 34px;
  color:#e9f2f5;
  background:#081f30;
  border-left:1px solid rgba(97,215,180,.25);
  box-shadow:-20px 0 60px rgba(0,0,0,.3);
  transform:translateX(100%);
  transition:transform .25s ease;
}

.evidence-drawer.open .drawer-panel {
  transform:translateX(0);
}

.drawer-close {
  width:42px;
  height:42px;
  position:absolute;
  top:20px;
  right:20px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:50%;
  color:white;
  background:transparent;
  cursor:pointer;
  font-size:25px;
}

.drawer-panel h3 {
  margin:0;
  color:white;
  font-size:34px;
}

.drawer-description {
  color:#9eb2be;
}

.drawer-count {
  margin:25px 0;
  padding:13px 15px;
  border-radius:7px;
  color:#74dbbc;
  background:rgba(97,215,180,.07);
  font-size:11px;
  font-weight:800;
}

.drawer-items {
  display:grid;
  gap:12px;
}

.evidence-item {
  padding:20px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:9px;
  background:rgba(255,255,255,.035);
}

.evidence-item-top {
  display:flex;
  justify-content:space-between;
  gap:10px;
  color:#6fd4b5;
  font-size:8px;
  font-weight:800;
  letter-spacing:.08em;
}

.evidence-item-top b {
  color:#91a8b5;
}

.evidence-item h4 {
  margin:12px 0;
  color:white;
  font-size:15px;
}

.evidence-item p {
  margin:8px 0;
  color:#94aab6;
  font-size:11px;
  line-height:1.55;
}

.evidence-item p strong {
  display:block;
  color:#c8d8df;
}

.evidence-links {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:15px;
}

.evidence-links a {
  color:#6fd4b5;
  font-size:10px;
  font-weight:800;
  text-decoration:none;
}

.evidence-links a:hover {
  text-decoration:underline;
}

@media (prefers-reduced-motion: reduce) {
  .drawer-panel {
    transition:none;
  }
}

/* ---------- EVIDENCE COUNT CLICK TARGET FIX ---------- */

.graph-detail {
  pointer-events:auto !important;
  z-index:20 !important;
}

.evidence-count {
  position:relative;
  z-index:21;
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  pointer-events:auto !important;
  cursor:pointer;
  border-radius:7px;
}

.evidence-count:hover {
  background:rgba(97,215,180,.08);
}

.graph-lines {
  pointer-events:none !important;
}

.connections {
  pointer-events:none !important;
}

/* ---------- MEET ARCHIE SCOUT ---------- */

.scout-section {
  background:#f2f7f5;
}

.scout-heading {
  max-width:1200px;
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px;
}

.scout-heading h2 {
  margin:0;
  max-width:820px;
  font-size:clamp(38px,4.5vw,62px);
  line-height:1.02;
  letter-spacing:-.05em;
}

.scout-status {
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--green);
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}

.scout-intro {
  max-width:760px;
  margin:25px 0 45px;
  color:var(--muted);
  font-size:17px;
}

.scout-dashboard {
  max-width:1200px;
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:22px;
}

.scout-mission,
.scout-funnel,
.scout-rule,
.verifier-result,
.next-scout {
  border:1px solid #d8e4df;
  border-radius:14px;
  background:white;
}

.scout-mission {
  padding:34px;
}

.scout-mission h3 {
  margin:0 0 15px;
  font-size:28px;
}

.scout-mission > p:not(.micro-label) {
  color:var(--muted);
}

.mission-meta {
  margin-top:30px;
  padding-top:22px;
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  border-top:1px solid var(--line);
  color:#758792;
  font-size:10px;
}

.mission-meta strong {
  color:var(--green);
}

.scout-funnel {
  padding:30px;
  text-align:center;
}

.funnel-stage strong,
.funnel-zero strong {
  display:block;
  color:var(--green);
  font-size:54px;
  line-height:1;
}

.funnel-stage span,
.funnel-zero span,
.funnel-row span {
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:10px;
}

.funnel-arrow {
  margin:13px 0;
  color:#8eb3a6;
}

.funnel-row {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}

.funnel-row > div {
  padding:18px 10px;
  border-radius:9px;
  background:#f5f8f7;
}

.funnel-row strong {
  display:block;
  color:var(--ink);
  font-size:27px;
}

.funnel-zero {
  padding:16px;
  border-radius:9px;
  background:#eaf6f0;
}

.funnel-zero strong {
  font-size:32px;
}

.scout-rule {
  max-width:1200px;
  margin-top:22px;
  padding:30px;
  display:flex;
  gap:22px;
  align-items:flex-start;
}

.rule-lock {
  width:48px;
  height:48px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:white;
  background:var(--green);
  font-weight:800;
}

.scout-rule h3 {
  margin:0 0 7px;
}

.scout-rule p {
  margin:0;
  color:var(--muted);
}

.verifier-result {
  max-width:1200px;
  margin-top:22px;
  padding:30px;
  display:grid;
  grid-template-columns:.45fr 1.55fr;
  gap:30px;
  align-items:center;
}

.verifier-result strong {
  color:var(--green);
  font-size:50px;
}

.verifier-result > p {
  color:var(--muted);
}

.next-scout {
  max-width:1200px;
  margin-top:22px;
  padding:28px 30px;
  display:grid;
  grid-template-columns:160px 1fr;
  gap:25px;
}

.next-scout > span {
  color:var(--orange);
  font-size:10px;
  font-weight:800;
  letter-spacing:.12em;
}

.next-scout h3 {
  margin:0 0 6px;
}

.next-scout p {
  margin:0;
  color:var(--muted);
}

@media (max-width:800px) {
  .scout-heading,
  .scout-dashboard {
    display:grid;
    grid-template-columns:1fr;
  }

  .funnel-row {
    grid-template-columns:1fr;
  }

  .verifier-result,
  .next-scout {
    grid-template-columns:1fr;
  }
}


/* ARCHIE PUBLIC RELEASE v0.11 */
.archie-finding{background:#071c2b;color:#fff}.finding-kicker{max-width:1200px;margin:0 auto 35px;display:flex;justify-content:space-between;gap:20px;color:#67d8b6;font-size:10px;font-weight:800;letter-spacing:.13em}.finding-status{color:#f1bd69}.finding-hero{max-width:1200px;margin:auto}.finding-hero h2{max-width:1000px;margin:0;color:#fff;font-size:clamp(42px,5vw,72px);line-height:1.01;letter-spacing:-.055em}.finding-hero h2 span{display:block;margin-top:.18em;color:#62d7b4}.finding-lead{max-width:720px;margin:28px 0 45px;color:#a5b9c4;font-size:18px}.species-gap-grid{max-width:1200px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.12)}.species-gap-grid article{min-height:220px;padding:30px;background:#0b2638}.species-gap-grid .gap-missing{background:#102e3b}.gap-species{margin-bottom:38px;color:#7994a3;font-size:10px;font-weight:800;letter-spacing:.14em}.species-gap-grid strong{display:block;color:#fff;font-size:30px}.gap-missing strong{color:#f1bd69;font-size:58px;line-height:.8}.species-gap-grid p{color:#9eb2bd;font-size:13px}.challenge-box{max-width:900px;margin:35px auto;display:flex;align-items:center;justify-content:center;gap:25px;text-align:center}.challenge-number{min-width:170px}.challenge-number strong{display:block;color:#fff;font-size:45px}.challenge-number.final strong{color:#62d7b4}.challenge-number span{color:#91a8b5;font-size:10px}.challenge-arrow{color:#567484}.finding-copy{max-width:850px;margin:55px auto 0}.finding-copy h3{color:#fff;font-size:28px}.finding-copy>p{color:#a4b6c0}.science-caution{margin-top:30px;padding:24px;border:1px solid rgba(241,189,105,.28);border-radius:10px;background:rgba(241,189,105,.06)}.science-caution strong{color:#f1bd69}.science-caution p{margin-bottom:0;color:#abbcc5}.archie-question{margin-top:30px;padding:30px;border-radius:10px;background:#0d3040}.archie-question span{color:#62d7b4;font-size:9px;font-weight:800;letter-spacing:.14em}.archie-question p{margin:10px 0 0;color:#fff;font-size:23px;font-weight:650}.ecs-explainer{background:#edf7f2}.ecs-map{max-width:900px;margin:50px auto;display:grid;grid-template-columns:1fr 50px 1.25fr 50px 1fr;align-items:center;gap:10px}.ecs-source,.ecs-core{padding:28px 20px;border-radius:13px;text-align:center;background:#fff;border:1px solid #d7e5df}.ecs-core{padding:38px 22px;background:#082334;color:#fff}.ecs-source>span,.ecs-core>span{display:block;margin-bottom:9px;color:#78919d;font-size:8px;font-weight:800;letter-spacing:.12em}.ecs-core>span{color:#67d8b6}.ecs-source>strong,.ecs-core>strong{display:block;font-size:19px}.ecs-pills{margin-top:18px;display:flex;justify-content:center;flex-wrap:wrap;gap:7px}.ecs-pills button{border:0;border-radius:999px;padding:7px 12px;cursor:pointer;background:#e6f4ee;color:#147c60;font:inherit;font-size:10px;font-weight:800}.ecs-core .ecs-pills button{background:rgba(98,215,180,.13);color:#6ee0be}.ecs-flow{text-align:center;color:#6ba991;font-size:25px}.ecs-explanation{max-width:760px;margin:0 auto;font-size:17px;color:#52666f}.inline-term{padding:0;border:0;border-bottom:1px dotted currentColor;background:transparent;color:#147c60;cursor:pointer;font:inherit;font-weight:700}.archie-glossary{background:#fff}.glossary-grid{max-width:1200px;margin-top:45px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.glossary-card{padding:22px;border:1px solid #dce6e2;border-radius:11px;background:#fafcfb}.glossary-card h3{margin:0 0 9px;font-size:15px}.glossary-card p{margin:0;color:#64767e;font-size:12px;line-height:1.6}.glossary-popover{position:fixed;right:24px;bottom:24px;z-index:1200;width:min(380px,calc(100vw - 32px));padding:25px;border:1px solid rgba(98,215,180,.25);border-radius:12px;background:#082334;color:#fff;box-shadow:0 20px 60px rgba(0,0,0,.3);display:none}.glossary-popover.open{display:block}.glossary-popover small{display:block;color:#62d7b4;font-size:8px;font-weight:800;letter-spacing:.13em}.glossary-popover strong{display:block;margin-top:8px;font-size:21px}.glossary-popover p{color:#a6bac4;font-size:13px;line-height:1.6}.glossary-popover a{color:#62d7b4;font-size:10px;font-weight:800;text-decoration:none}.glossary-close{position:absolute;top:10px;right:12px;border:0;background:transparent;color:#fff;font-size:22px;cursor:pointer}@media(max-width:800px){.finding-kicker{display:grid}.species-gap-grid{grid-template-columns:1fr}.challenge-box{gap:10px}.challenge-number{min-width:0;flex:1}.challenge-number strong{font-size:34px}.ecs-map{grid-template-columns:1fr}.glossary-grid{grid-template-columns:1fr 1fr}}@media(max-width:520px){.glossary-grid{grid-template-columns:1fr}.challenge-number span{font-size:8px}}


/* ARCHIE RESEARCH LAB v1 */
.research-lab-section{background:#f5f8f7}.research-lab-section .section-heading{max-width:900px}.agent-grid{max-width:1200px;margin:45px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.agent-grid article{min-height:170px;padding:24px;border:1px solid #d9e4df;border-radius:12px;background:#fff}.agent-grid article.sceptic{background:#082334;color:#fff;border-color:#082334}.agent-grid span{display:block;margin-bottom:30px;color:#2c8b70;font-size:9px;font-weight:800;letter-spacing:.12em}.agent-grid .sceptic span{color:#62d7b4}.agent-grid strong{display:block;font-size:18px}.agent-grid p{color:#6b7c84;font-size:12px}.agent-grid .sceptic p{color:#a9bbc4}.lab-rule{max-width:1200px;margin:18px auto 0;padding:24px 28px;border-radius:12px;background:#e6f4ee;display:flex;gap:10px;flex-wrap:wrap}.lab-rule strong{color:#147c60}@media(max-width:900px){.agent-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.agent-grid{grid-template-columns:1fr}}
\n
/* ARCHIE OPEN RESEARCH v1 */
.open-research{background:#071c2b;color:#fff}.open-research .section-heading h2{color:#fff}.open-research .section-heading>p:last-child{color:#a8bac3}.open-research-grid{max-width:1200px;margin:45px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:14px}.open-research-grid article{padding:32px;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:#0b2638}.open-research-grid span{display:block;margin-bottom:24px;color:#62d7b4;font-size:9px;font-weight:800;letter-spacing:.14em}.open-research-grid strong{display:block;font-size:25px}.open-research-grid p{color:#a6bac4}.open-principle{max-width:1200px;margin:18px auto 0;padding:30px;border-radius:13px;background:#e9f6f0;color:#173a34}.open-principle strong{font-size:22px;color:#147c60}.open-principle p{margin-bottom:0}@media(max-width:700px){.open-research-grid{grid-template-columns:1fr}}