/* =================================================================
   MASTER CONSOLIDATED STYLESHEET
   –––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
   All original class names preserved; only duplicate declarations merged.
   ================================================================= */

   
/* -----------------------------------------------------------------
   1.  GLOBAL CARD BASE (used by every *-card)
------------------------------------------------------------------ */
.blood-type-card, .function-card, .step-card, .cell-type-card,
.energy-card, .muscular-card, .joints-card, .movement-card,
.structure-card, .physiology-card, .anatomy-card, .pregnancy-card,
.lactation-card, .cycle-card, .transition-card, .gametogenesis-card {
  background: rgba(233, 213, 176, 0.372);
  border-radius: 12px;
  padding: 1.5rem 2rem;
  margin: 1.5rem 0;
  border-left: 5px solid;
  box-shadow: 0 4px 15px rgba(0,0,0,.1);
  transition: all .3s ease;
}
.blood-type-card:hover, .function-card:hover, .step-card:hover,
.cell-type-card:hover, .energy-card:hover, .muscular-card:hover,
.joints-card:hover, .movement-card:hover, .structure-card:hover,
.physiology-card:hover, .anatomy-card:hover, .pregnancy-card:hover,
.lactation-card:hover, .cycle-card:hover, .transition-card:hover,
.gametogenesis-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0,0,0,.1);
}

/* -----------------------------------------------------------------
   2.  STAT / BUBBLE / BADGE HELPERS
------------------------------------------------------------------ */
.stat-bubble {
  background: #fff;
  border-radius: 12px;
  padding: 10px 15px;
  margin: 8px 0;
  box-shadow: 0 2px 4px rgba(0,0,0,.05);
  border: 1px solid #e5e7eb;
}
.antigen-badge,
.antibody-badge,
.rh-factor,
.mobility-badge,
.tissue-badge {
  background: wheat;
  display: inline-block;
  padding: 4px 8px;
  color: #0b0b0b;
  border-radius: 6px;
  font-size: .8rem;
  margin: 2px;
}

/* -----------------------------------------------------------------
   3.  ICONS (shared size)
------------------------------------------------------------------ */
.function-icon, .structure-icon, .physiology-icon, .anatomy-icon,
.pregnancy-icon, .lactation-icon, .cycle-icon, .transition-icon,
.gametogenesis-icon, .joint-icon {
  font-size: 1.5rem;
  margin-right: 10px;
  vertical-align: middle;
}

/* -----------------------------------------------------------------
   4.  GRIDS
------------------------------------------------------------------ */
.energy-grid, .joints-grid, .movement-grid, .muscular-grid {
  padding: var(--space-md);
  background: rgba(233, 213, 176, 0.372);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 1.5rem;
  margin-top: 1.5rem;
}
.anatomy-grid, .comparison-grid {
  padding: var(--space-md);
  background: rgba(233, 213, 176, 0.372);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
  margin-top: 10px;
}
@media (max-width: 768px) {
  .energy-grid, .joints-grid, .movement-grid, .muscular-grid,
  .anatomy-grid, .comparison-grid {
    grid-template-columns: 1fr;
  }
}

/* -----------------------------------------------------------------
   5.  BLOOD TYPES
------------------------------------------------------------------ */
.type-a { border-left-color: #ef4444;   background: rgba(233, 213, 176, 0.372); }
.type-b { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.type-ab { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }
.type-o { border-left-color: #f59e0b; background: #fffbeb; }

/* -----------------------------------------------------------------
   6.  BLOOD FUNCTIONS
------------------------------------------------------------------ */
.transport { border-left-color: #ef4444;   background: rgba(233, 213, 176, 0.372); }
.regulation { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.protection { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }
.respiratory { border-left-color: #06b6d4;   background: rgba(134, 168, 136, 0.4); }
.nutritional { border-left-color: #f59e0b; background: #fffbeb; }
.excretory { border-left-color: #84cc16; background: #f7fee7; }
.endocrine { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.repair { border-left-color: #dc2626;   background: rgba(233, 213, 176, 0.372); }
.immunity { border-left-color: #7c3aed;   background: rgba(134, 168, 136, 0.4); }
.storage { border-left-color: #0f766e;   background: rgba(134, 168, 136, 0.4); }

/* -----------------------------------------------------------------
   7.  PLATELET / COAG STEPS
------------------------------------------------------------------ */
.vascular-step { border-left-color: #ef4444;   background: rgba(233, 213, 176, 0.372); }
.platelet-step { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.coagulation-step { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }
.retraction-step { border-left-color: #f59e0b; background: #fffbeb; }
.fibrinolysis-step { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }

/* -----------------------------------------------------------------
   8.  LEUKOCYTE CARDS
------------------------------------------------------------------ */
.neutrophil-card { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.lymphocyte-card { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }
.monocyte-card { border-left-color: #f59e0b; background: #fffbeb; }
.eosinophil-card { border-left-color: #ef4444;   background: rgba(233, 213, 176, 0.372); }
.basophil-card { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }

/* -----------------------------------------------------------------
   9.  ENERGY SYSTEMS
------------------------------------------------------------------ */
.atp-card, .atp-system { border-left-color: #ef4444;   background: rgba(233, 213, 176, 0.372); }
.phosphagen-card, .phosphagen-system { border-left-color: #f59e0b; background: #fffbeb; }
.glycolysis-card, .glycolysis-system { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }
.aerobic-card, .aerobic-system { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }
.transition-system { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.recovery-system { border-left-color: #06b6d4;   background: rgba(134, 168, 136, 0.4); }

/* -----------------------------------------------------------------
   10.  JOINT CARDS
------------------------------------------------------------------ */
.synarthrosis { padding: 0 var(--space-md); border-left-color: #ef4444;   background: rgba(233, 213, 176, 0.372); }
.amphiarthrosis { padding: 0 var(--space-md); border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.diarthrosis { padding: 0 var(--space-md); border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }
.suture { padding: 0 var(--space-md); border-left-color: #06b6d4;   background: rgba(134, 168, 136, 0.4); }
.syndesmosis { padding: 0 var(--space-md); border-left-color: #f59e0b; background: #fffbeb; }
.gomphosis { padding: 0 var(--space-md); border-left-color: #84cc16; background: #f7fee7; }
.synchondrosis { padding: 0 var(--space-md); border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.symphysis { padding: 0 var(--space-md); border-left-color: #dc2626;   background: rgba(233, 213, 176, 0.372); }
.synovial { padding: 0 var(--space-md); border-left-color: #7c3aed;   background: rgba(134, 168, 136, 0.4); }
.hinge { padding: 0 var(--space-md); border-left-color: #0f766e;   background: rgba(134, 168, 136, 0.4); }
.pivot { padding: 0 var(--space-md); border-left-color: #d97706; background: #fef3c7; }
.condyloid { padding: 0 var(--space-md); border-left-color: #7c3aed;   background: rgba(134, 168, 136, 0.4); }
.saddle { padding: 0 var(--space-md); border-left-color: #059669;   background: rgba(134, 168, 136, 0.4); }
.ball-socket { padding: 0 var(--space-md); border-left-color: #3b82f6;   background: rgba(168, 150, 180, 0.4); }
.plane { padding: 0 var(--space-md); border-left-color: #6b7280; background: #f3f4f6; }

/* mobility badges */
.mobility-low { background: #ef444486; }
.mobility-medium { background: #f59e0b; }
.mobility-high { background: #10b981; }

/* -----------------------------------------------------------------
   11.  MUSCLE / TISSUE BADGES
------------------------------------------------------------------ */
.voluntary { background: #ea6060; }
.involuntary { background: #3b82f6; }
.striated { background: #8b5cf6; }
.non-striated { background: #06b6d4; }

/* -----------------------------------------------------------------
   12.  REPRODUCTIVE CARDS
------------------------------------------------------------------ */
.male-system { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.female-system { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.testes { border-left-color: #0ea5e9; background: #f0f9ff; }
.ovaries { border-left-color: #f59e0b; background: #fffbeb; }
.accessory { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }

/* -----------------------------------------------------------------
   13.  PREGNANCY / LACTATION / CYCLE / TRANSITION / GAMETOGENESIS
------------------------------------------------------------------ */
.fertilization { border-left-color: #06b6d4;   background: rgba(134, 168, 136, 0.4); }
.implantation { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }
.placenta { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }
.maternal { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.fetal { border-left-color: #f59e0b; background: #fffbeb; }

.anatomy { border-left-color: #f59e0b; background: #fffbeb; }
.hormonal { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }
.milk-ejection { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.milk-composition { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }
.benefits { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }

.ovarian-cycle { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.uterine-cycle { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }
.clinical { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }

.puberty { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.menopause { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.treatment { border-left-color: #f59e0b; background: #fffbeb; }

.meiosis { border-left-color: #8b5cf6;   background: rgba(134, 168, 136, 0.4); }
.spermatogenesis { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.oogenesis { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.comparison { border-left-color: #10b981;   background: rgba(233, 213, 176, 0.372); }

.male-physiology { border-left-color: #3b82f6;   background: rgba(233, 213, 176, 0.372); }
.female-physiology { border-left-color: #ec4899;   background: rgba(205, 127, 100, 0.4); }
.sexual-response { border-left-color: #ef4444;   background: rgba(233, 213, 176, 0.372); }
.menstrual-cycle { border-left-color: #10b981;     background: rgba(233, 213, 176, 0.372); }

/* -----------------------------------------------------------------
   14.  REACTION / CASCADE BOXES
------------------------------------------------------------------ */
.reaction-card {
  border-radius: 8px;
  padding: 12px;
  margin: 10px 0;
  border-left: 4px solid;
  background: #f8fafc;
}
.hemolytic { border-left-color: #dc2626; }
.febrile { border-left-color: #f59e0b; }
.allergic { border-left-color: #8b5cf6; }
.trali { border-left-color: #06b6d4; }

.cascade-pathway {
  background: rgba(205, 127, 100, 0.4);
  border-radius: 8px;
  padding: 15px;
  margin: 10px 0;
  border-left: 4px solid #3b82f6;
}
.pathway-header {
  font-weight: bold;
  color: #1e40af;
  margin-bottom: 8px;
}

/* -----------------------------------------------------------------
   15.  MISC HELPERS
------------------------------------------------------------------ */
.system-comparison {
  background: rgba(205, 127, 100, 0.4);
  border-radius: 12px;
  padding: 20px;
  margin: 20px 0;
}
.journey-visualization, .cycle-visualization, .timeline-visualization {
  text-align: center;
  margin: 20px 0;
  padding: 20px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  border-radius: 12px;
  border: 2px solid #e2e8f0;
}
.joint-anatomy {
  text-align: center;
  margin: 20px 0;
  padding: 15px;
  background: linear-gradient(135deg, #fef7cd 0%, #fef3c7 100%);
  border-radius: 12px;
  border: 2px solid #f59e0b;
}


/* keyframe for subtle joint animation */
@keyframes movement {
  0%, 100% { transform: rotate(0deg); opacity: .7; }
  50% { transform: rotate(10deg); opacity: 1; }
}

/* -----------------------------------------------------------------
   16.  INTERNAL CARD HELPERS (kept for completeness)
------------------------------------------------------------------ */
.anatomy-card, .comparison-card {
  border: 1px solid #e6e9ee;
  border-radius: 6px;
  padding: 12px;
  background: #f9fafb;
}
.anatomy-card h3, .comparison-card h3 {
  margin-top: 0;
  font-size: 1rem;
  color: #0f172a;
}
.energy-card h3, .joints-card h3, .movement-card h3, .muscular-card h3 {
  margin-top: .5rem;
  font-size: 1.2rem;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
}
.energy-card ul, .joints-card ul, .movement-card ul, .muscular-card ul {
  margin: 5px 0;
  padding-left: 18px;
}