/*
 Copyright 2019 Novartis Institutes for BioMedical Research Inc. Licensed
 under the Apache License, Version 2.0 (the "License"); you may not use
 this file except in compliance with the License. You may obtain a copy
 of the License at http://www.apache.org/licenses/LICENSE-2.0. Unless
 required by applicable law or agreed to in writing, software distributed
 under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES
 OR CONDITIONS OF ANY KIND, either express or implied. See the License for
 the specific language governing permissions and limitations under the License.
*/


/* General customisation */

/* body tag style class */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin: 0;
  background: #ffffff;
}

/* Main content container style class */
main.main-content {
  display: flex;
  flex-direction: column;
  flex: 1 0 auto; /* Fill remaining space */
}


/* Info banner customisation */

/* Info banner style class */
.info-banner {
  background: #e7f1ff;
  border-bottom: 2px solid #007bbd;
  padding: 0.25rem 0.25rem;
  text-align: center;
  color: #084298;
}

/* Info banner bold font style class */
.info-banner strong {
  font-weight: 600;
}


/* Hero sections customisation */

/* Hero section style class */
.hero-section {
  display: flex;
  flex-direction: column;
  min-height: 50vh;
  padding: 4rem 2rem 6rem;
  text-align: center;
  justify-content: center;
  align-items: center;
  color: white;
  /* Background image for section */
  background-image: url('/static/cell.jpg');
  /* Ensures image covers the entire section */
  background-size: cover;
  /* Centers image */
  background-position: center;
  /* Prevents image from repeating */
  background-repeat: no-repeat;
}

/* Hero title style class */
.hero-title {
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 1.5rem;
  color: #000;
}

/* Hero subtitle style class */
.hero-subtitle {
  font-size: 1.25rem;
  line-height: 1.6;
  color: #555;
  max-width: 800px;
  margin: 0 auto 2rem;
}

/* Buttons style classs */
.cta-buttons a.btn-primary,
.cta-buttons a.btn-secondary {
  margin: 0.5rem;
}


/* Statistics section customisation */

/* Overall statistics section style class */
.stats-section {
  background: #f8f9fa;
  padding: 2rem;
  flex: 1; /* Stretch to fill remaining space */
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Statistic cards container style class */
.stats-container {
  max-width: 1200px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 2rem;
  width: 100%;
}

/* Statistic card style class */
.stat-card {
  background: white;
  border-radius: 8px;
  padding: 2rem;
  text-align: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: transform 0.2s, box-shadow 0.2s;
}

/* Statistic card during hovering */
.stat-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

/* Number in statistic card style class */
.stat-number {
  font-size: 3rem;
  font-weight: 700;
  color: #0066cc;
  margin-bottom: 0.5rem;
  line-height: 1;
}

/* Label under statistic card number style class */
.stat-label {
  font-size: 1.25rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 0.5rem;
}

/* Description under statistic card label style class */
.stat-description {
  font-size: 0.95rem;
  color: #666;
  line-height: 1.5;
}


/* Responsive adjustments */
@media (max-width: 768px) {
  .hero-title {
    font-size: 2.2rem;
  }

  .hero-subtitle {
    font-size: 1rem;
  }

  .stats-section {
    padding: 1.5rem;
  }

  .stat-card {
    padding: 1.5rem;
  }
}