@font-face {
  font-family: "Nunito";
  src: url(../fonts/Nunito/Nunito-VariableFont_wght.ttf);
}

@font-face {
  font-family: "Fredoka";
  src: url(../fonts/Fredoka/Fredoka-VariableFont_wdth\,wght.ttf);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body {
  line-height: 1;
  overflow-x: hidden;
}

a {
  text-decoration: none;
}

/* Header styles */

header {
  display: flex;
  padding: 1rem 5rem;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(249, 115, 22, 0.1);
  background: rgba(254, 249, 231, 0.9);
  backdrop-filter: blur(6px);
}

header .logo {
  width: 12rem;
}

header nav {
  display: flex;
  gap: 2rem;
  align-items: center;
}

header nav a {
  color: #4b5563;
  font-family: Nunito;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5rem;
  letter-spacing: 0.01075rem;
}

header nav a.active {
  color: #f97316;
  text-decoration: underline;
  text-underline-offset: 0.25rem;
}

header .buy-tickets-btn {
  padding: 0.625rem 1.5rem;
  border-radius: 624.9375rem;
  background: #f97316;
  color: #fff;
  font-family: Fredoka;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5rem;
  letter-spacing: 0.025rem;
}

/* Footer styles */

footer {
  width: 100%;
  border-radius: 2.5rem 2.5rem 0 0;
  background: #1a4a2e;
  padding: 5rem 5rem 2.5rem 5rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 4rem;
}

.footer-logo {
  width: 12rem;
}

footer .section-one .body-text {
  color: rgba(255, 255, 255, 0.8);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.42188rem; /* 162.5% */
}

footer .section-one .location {
  margin-top: 1.5rem;
  color: rgba(255, 255, 255, 0.6);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: -0.00344rem;
}

footer .section-one .location i {
  color: #f97316;
}

footer .links-header {
  color: #fff;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
}

footer .links {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1.5rem;
  list-style-type: none;
}

footer .links a {
  color: rgba(255, 255, 255, 0.7);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25rem; /* 142.857% */
}

footer .sm-container {
  margin-top: 1.5rem;
  display: flex;
  gap: 1rem;
}

footer .sm-container .sm-item {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  font-size: 1rem;
  color: #fff;
}

footer .newsletter-container {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
}

footer .newsletter-container p {
  color: rgba(255, 255, 255, 0.6);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem; /* 142.857% */
}

footer .newsletter-container .input-container {
  margin-top: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

footer .newsletter-container .input-container input {
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
}

footer .newsletter-container .go-btn {
  padding: 0.5rem 1rem;
  border-radius: 0.75rem;
  background: #f97316;
  color: #fff;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.03844rem;
}

/* Home page styles */

.home-hero-section {
  background: linear-gradient(180deg, rgba(8, 145, 178, 0.1) 0%, #fef9e7 100%);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  padding: 13rem 5rem 2rem;
  place-items: center;
  position: relative;
}

.home-hero-section .text-section .welcome-container {
  display: flex;
  padding: 0.5rem 1rem;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  background: rgba(249, 115, 22, 0.1);
  width: fit-content;
}

.home-hero-section .text-section .welcome-container img {
  height: 0.875rem;
}

.home-hero-section .text-section .welcome-container p {
  color: #f97316;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.04375rem;
  text-transform: uppercase;
}

.home-hero-section .text-section h1 {
  margin-top: 2rem;
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 5rem;
  letter-spacing: 0.00488rem;
}

.home-hero-section .text-section h1 span {
  display: block;
  color: #f97316;
}

.home-hero-section .text-section .intro-text {
  margin-top: 2rem;
  color: #4b5563;
  font-family: Nunito;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.03125rem;
  letter-spacing: -0.00369rem;
}

.home-hero-section .text-section .buttons-container {
  margin-top: 3.25rem;
  display: flex;
  gap: 1rem;
}

.home-hero-section .text-section .buttons-container .plan-btn {
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  background: #f97316;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem;
  letter-spacing: 0.00331rem;
}

.home-hero-section .text-section .buttons-container .explore-btn {
  padding: 1rem 2rem;
  display: flex;
  gap: 0.75rem;
  align-items: center;
  border-radius: 624.9375rem;
  border: 2px solid rgba(26, 74, 46, 0.1);
  background: #fff;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00331rem;
}

.home-hero-section .text-section .buttons-container .explore-btn img {
  width: 2rem;
  height: 2rem;
}

.home-hero-section .image-section {
  position: relative;
  display: flex;
  justify-content: flex-end;
}

.home-hero-section .image-section .hero-image {
  width: 100%;
}

.home-hero-section .image-section .orange-background {
  width: 80%;
  height: 80%;
  border-radius: 2.5rem;
  background: #fbbf2410;
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}

.home-hero-section .blue-blur {
  width: 28rem;
  height: 28rem;
  background-color: #0891b290;
  border-radius: 50%;
  filter: blur(40px);
  position: absolute;
  z-index: -1;
  bottom: 0;
  left: -10rem;
}

.home-hero-section .orange-blur {
  width: 28rem;
  height: 28rem;
  background-color: #fbbf2480;
  border-radius: 50%;
  filter: blur(30px);
  position: absolute;
  z-index: -1;
  top: 0;
  right: -3rem;
}

.home-hero-section .daily-shows-container {
  width: 16rem;
  height: 5rem;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.1);
  position: absolute;
  bottom: 3rem;
  left: -3rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
}

.home-hero-section .daily-shows-container .blue-dot {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background-color: #0891b21a;
}

.home-hero-section .daily-shows-container .small-text {
  color: #6b7280;
  font-family: Nunito;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.25rem;
}

.home-hero-section .daily-shows-container .starts-text {
  color: #1a4a2e;
  font-family: Nunito;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5rem;
}

.home-hero-section .lion-icon {
  position: absolute;
  top: 5rem;
  left: 10%;
  width: 1.75rem;
}

.home-hero-section .panda-icon {
  position: absolute;
  bottom: 0rem;
  left: 17%;
  width: 1.75rem;
}

.home-hero-section .bird-icon {
  position: absolute;
  bottom: 1rem;
  right: 10%;
  width: 1.75rem;
}

.home-hero-section .giraffe-icon {
  position: absolute;
  top: 10rem;
  right: 20%;
  width: 1.75rem;
}

.statistics-section {
  background-color: #fef9e7;
  padding: 6rem 10rem;
  display: flex;
  justify-content: center;
}

.statistics-section .statistics-container {
  width: 100%;
  padding: 2rem;
  border-radius: 2rem;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.05);
  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 3rem;
}

.statistics-section .statistic {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.statistics-section .statistic img {
  width: 3.5rem;
  height: 3.5rem;
}

.statistics-section .statistic .figure {
  margin-top: 0.75rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 2rem;
  letter-spacing: 0.04rem;
}

.statistics-section .statistic .desc {
  margin-top: 0.75rem;
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5rem;
  letter-spacing: 0.00294rem;
}

.zones-section {
  background-color: #fef9e7;
  padding: 6rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.zones-section .heading-section {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-items: center;
}

.zones-section .heading-section p {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.zones-section .heading-section h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-size: 3rem;
  font-family: Fredoka;
  font-weight: 700;
}

.zones-container {
  margin-top: 4rem;
  display: flex;
  gap: 2rem;
  justify-content: center;
  flex-wrap: wrap;
}

.zones-container .zone {
  width: 25rem;
  height: 18.25rem;
  border-radius: 2rem;
  border: 1px solid #f3f4f6;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  padding: 2rem;
  position: relative;
  overflow: hidden;
}

.zone .top-section img {
  width: 4rem;
  height: 4rem;
}

.zone .circle {
  width: 10rem;
  height: 10rem;
  position: absolute;
  z-index: 2;
  right: -3.5rem;
  top: -3.5rem;
  border-radius: 624.9375rem;
  opacity: 0.1;
  background: linear-gradient(135deg, #f97316 0%, #fbbf24 100%);
}

.zone.rainforest .circle {
  background: linear-gradient(135deg, #0891b2 0%, #34d399 100%);
}

.zone.arctic .circle {
  background: linear-gradient(135deg, #60a5fa 0%, #bfdbfe 100%);
}

.zone h3 {
  margin-top: 1.5rem;
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 2rem;
}

.zone p {
  margin-top: 0.75rem;
  color: #4b5563;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5rem;
}

.zone a {
  display: flex;
  margin-top: 1.5rem;
  gap: 0.25rem;
  color: #f97316;
  font-family: Nunito;
  font-size: 1rem;
  font-weight: 700;
}

.zone.rainforest a {
  color: #0891b2;
}

.zone.zone.arctic a {
  color: #3b82f6;
}

/* Animals page styles  */

.animals-hero-section {
  padding: 5rem 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  background:
    radial-gradient(
      14.12% 4.17% at 10% 20%,
      rgba(255, 255, 255, 0.04) 0%,
      rgba(255, 255, 255, 0) 70%
    ),
    radial-gradient(
      10.59% 5.56% at 80% 10%,
      rgba(255, 255, 255, 0.04) 0%,
      rgba(255, 255, 255, 0) 70%
    ),
    radial-gradient(
      12.36% 3.47% at 50% 70%,
      rgba(255, 255, 255, 0.03) 0%,
      rgba(255, 255, 255, 0) 70%
    ),
    radial-gradient(
      8.83% 4.86% at 20% 80%,
      rgba(255, 255, 255, 0.03) 0%,
      rgba(255, 255, 255, 0) 70%
    ),
    radial-gradient(
      10.59% 6.25% at 90% 60%,
      rgba(255, 255, 255, 0.03) 0%,
      rgba(255, 255, 255, 0) 70%
    ),
    #1a4a2e;
  position: relative;
  overflow: hidden;
}

.hero-text-container {
  padding: 0.375rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.1);
}

.hero-text-container img {
  width: 0.875rem;
  height: 0.875rem;
}

.hero-text-container p {
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.animals-hero-section h1 {
  margin-top: 1.5rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 4.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 5.625rem;
}

.animals-hero-section .heading-text {
  margin-top: 1.5rem;
  color: rgba(255, 255, 255, 0.75);
  text-align: center;
  font-family: Nunito;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.03125rem;
  letter-spacing: -0.00488rem;
}

.animals-hero-section .stats-container {
  margin-top: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}

.animals-hero-section .animal-stat {
  display: flex;
  padding: 0.625rem 1.25rem;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.15);
}

.animals-hero-section .animal-stat img {
  height: 1rem;
}

.animals-hero-section .animal-stat p {
  color: #fff;
  text-align: center;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.5rem;
  letter-spacing: 0.00394rem;
}

.animals-hero-section .animal-ribbon {
  margin-top: 3rem;
  height: 4.5rem;
  width: 100%;
  object-fit: cover;
}

.animals-hero-section .blue-circle {
  width: 18rem;
  height: 18rem;
  border-radius: 624.9375rem;
  opacity: 0.5;
  background: #0891b2;
  filter: blur(35px);
  position: absolute;
  bottom: 0;
  left: 0;
}

.animals-hero-section .orange-circle {
  width: 24rem;
  height: 24rem;
  border-radius: 624.9375rem;
  opacity: 0.5;
  background: #fbbf24;
  filter: blur(35px);
  position: absolute;
  right: -5rem;
  top: -5rem;
}

.animals-grid-section {
  padding: 6rem 3rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  background-color: #fef9e7;
  place-items: center;
}

.animals-grid-section .animal {
  border-radius: 1.75rem;
  border: 1px solid #f3f4f6;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.animals-grid-section .animal .image-section {
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  height: 13rem;
  overflow: hidden;
}

.animals-grid-section .animal .image-section .country-container {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(2px);
  padding: 0.25rem 0.75rem;
}

.animals-grid-section .animal .image-section .country-container p {
  color: #fff;
  font-family: Nunito;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1rem;
  letter-spacing: 0.014rem;
}

.animals-grid-section .animal .text-section {
  padding: 1.5rem;
}

.animals-grid-section .animal .text-section .top-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.animals-grid-section .animal .text-section .food-container {
  padding: 0.25rem 0.75rem;
  border-radius: 600rem;
  font-family: Nunito;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1rem;
  letter-spacing: 0.007rem;
}

.animals-grid-section .animal .text-section .food-container.herbivore {
  background: #dcfce7;
  color: #16a34a;
}

.animals-grid-section .animal .text-section .food-container.omnivore {
  background-color: #fef9c3;
  color: #ca8a04;
}

.animals-grid-section .animal .text-section .food-container.carnivore {
  background-color: #fee2e2;
  color: #dc2626;
}

.animals-grid-section .animal .name {
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem;
  letter-spacing: 0.00144rem;
}

.animals-grid-section .animal .latin-name {
  color: #9ca3af;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: italic;
  font-weight: 400;
  line-height: 1, 25rem;
}

.animals-grid-section .animal .body-text {
  margin-top: 0.75rem;
  color: #4b5563;
  font-family: Nunito;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.4rem;
}

.animals-grid-section a {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  height: 2.5rem;
  width: 100%;
  margin-top: 1rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.25rem;
  border-radius: 0.75rem;
}

.animals-grid-section .animal.lion .image-section,
.animals-grid-section .animal.lion a {
  background: linear-gradient(118deg, #f59e0b 0%, #d97706 50%, #92400e 100%);
}

.animals-grid-section .animal.elephant .image-section,
.animals-grid-section .animal.elephant a {
  background: linear-gradient(118deg, #6b7280 0%, #4b5563 50%, #374151 100%);
}

.animals-grid-section .animal.giraffe .image-section,
.animals-grid-section .animal.giraffe a {
  background: linear-gradient(118deg, #fbbf24 0%, #f59e0b 50%, #b45309 100%);
}

.animals-grid-section .animal.panda .image-section,
.animals-grid-section .animal.panda a {
  background: linear-gradient(118deg, #86efac 0%, #22c55e 50%, #15803d 100%);
}

.animals-grid-section .animal.macaw .image-section,
.animals-grid-section .animal.macaw a {
  background: linear-gradient(118deg, #ef4444 0%, #f97316 50%, #fbbf24 100%);
}

.animals-grid-section .animal.snake .image-section,
.animals-grid-section .animal.snake a {
  background: linear-gradient(118deg, #365314 0%, #4d7c0f 50%, #84cc16 100%);
}

.animals-grid-section .animal.shark .image-section,
.animals-grid-section .animal.shark a {
  background: linear-gradient(118deg, #0284c7 0%, #0369a1 50%, #1e3a5f 100%);
}

.animals-grid-section .animal.flamingo .image-section,
.animals-grid-section .animal.animal.flamingo a {
  background: linear-gradient(118deg, #f9a8d4 0%, #ec4899 50%, #be185d 100%);
}

.animals-grid-section .animal.butterfly .image-section,
.animals-grid-section .animal.butterfly a {
  background: linear-gradient(118deg, #fb923c 0%, #f97316 50%, #c2410c 100%);
}

.animals-grid-section .animal.crocodile .image-section,
.animals-grid-section .animal.crocodile a {
  background: linear-gradient(118deg, #166534 0%, #15803d 50%, #4ade80 100%);
}

.animals-grid-section .animal.rhino .image-section,
.animals-grid-section .animal.rhino a {
  background: linear-gradient(118deg, #a8a29e 0%, #78716c 50%, #44403c 100%);
}

.animals-grid-section .animal.otter .image-section,
.animals-grid-section .animal.otter a {
  background: linear-gradient(118deg, #0891b2 0%, #0e7490 50%, #164e63 100%);
}

.load-more-btn {
  height: 4rem;
  padding: 1rem 2.5rem;
  border-radius: 624.9375rem;
  border: 2px solid #1a4a2e;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  display: flex;
  gap: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00219rem;
  width: fit-content;
  margin: 0 auto;
}

.animals-button-cheetah-section {
  padding: 0 3rem;
  background-color: #fef9e7;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.cheetah-container {
  margin-top: 4rem;
  width: 100%;
  padding: 2.5rem;
  border-radius: 2rem;
  background: linear-gradient(112deg, #0891b2 0%, #1a4a2e 60%, #065f46 100%);
  display: flex;
  gap: 5rem;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.cheetah-container .animal-month-container {
  display: flex;
  padding: 0.375rem 1rem;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  background: rgba(251, 191, 36, 0.2);
  width: fit-content;
  color: #fbbf24;
  font-family: Nunito;
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.cheetah-container .animal-month-container img {
  height: 0.876rem;
}

.amara-container {
  margin-top: 2rem;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.amara-container h2 {
  color: #fff;
  font-family: Fredoka;
  font-size: 3rem;
  font-weight: 700;
  line-height: 3.75rem;
}

.amara-container .small-cheetah-img {
  height: 3rem;
}

.cheetah-container .body-text {
  margin-top: 1.25rem;
  color: rgba(255, 255, 255, 0.7);
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.82813rem;
  width: 100%;
  max-width: 35rem;
}

.cheetah-container .stats-container {
  margin-top: 1.75rem;
  display: flex;
  gap: 3rem;
  flex-wrap: wrap;
}

.cheetah-container .stat {
  padding: 1rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(2px);
}

.cheetah-container .stat .figure {
  color: #fbbf24;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.25rem;
  letter-spacing: 0.00731rem;
}

.cheetah-container .stat .desc {
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem;
  letter-spacing: -0.00169rem;
}

.cheetah-container .learn-more-amara-btn {
  display: flex;
  margin-top: 1.25rem;
  align-items: center;
  gap: 0.75rem;
  border-radius: 624.9375rem;
  background: #f97316;
  box-shadow:
    0 20px 25px -5px rgba(249, 115, 22, 0.4),
    0 8px 10px -6px rgba(249, 115, 22, 0.4);
  width: fit-content;
  padding: 1rem 2.5rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
}

.cheetah-container .image-container {
  width: 16rem;
  height: 16rem;
  display: flex;
  flex-direction: column;
  gap: 0.95rem;
  justify-content: center;
  align-items: center;
  border-radius: 50%;

  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(2px);
}

.cheetah-container .image-container img {
  width: 6rem;
}

.cheetah-container .image-container .species {
  color: rgba(255, 255, 255, 0.6);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.00169rem;
}

.protect-section {
  padding: 4rem 0 0;
  background-color: #fef9e7;
}

.ticket-section {
  padding: 1.5rem 5rem;
  background: linear-gradient(90deg, #1a4a2e 0%, #15803d 50%, #1a4a2e 100%);
  display: flex;
  gap: 4rem;
  align-items: center;
}

.ticket-section .main-section {
  display: flex;
  gap: 1rem;
  align-items: center;
  width: 100%;
  max-width: 30rem;
}

.ticket-section .leaf-container {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.ticket-section .yellow-leaf {
  width: 1.5rem;
  height: 1.5rem;
}

.ticket-section h4 {
  color: #fff;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
}

.ticket-section .partner-text {
  color: rgba(255, 255, 255, 0.6);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25rem;
}

.ticket-advantages-container {
  display: flex;
  align-items: center;
  gap: 2rem;
}

.ticket-advantages-container .advantage {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
  max-width: 10rem;
}

.ticket-advantages-container .advantage img {
  width: 0.875rem;
  height: 0.875rem;
}

.ticket-advantages-container .advantage p {
  color: rgba(255, 255, 255, 0.7);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.25rem;
  letter-spacing: 0.00169rem;
}

.ticket-section .learn-more-btn {
  display: flex;
  padding: 0.75rem 1.5rem;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 624.9375rem;
  background: #fbbf24;
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.00088rem;
}

/* Plan your visit page container */

.plan-visit-hero-section {
  padding: 6rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: hidden;

  background: linear-gradient(90deg, #1a4a2e 0%, #15803d 50%, #1a4a2e 100%);

  padding: 8rem 6rem 14rem;
  color: #fef9e7;
}

body {
  margin: 0;
  background: #fef9e7;
}

.plan-visit-hero-section::after {
  content: "";
  position: absolute;

  left: 50%;
  bottom: -560px;

  transform: translateX(-50%);

  width: 180%;
  height: 700px;

  background: #fef9e7;
  border-radius: 50%;
}

.hero-content {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
}

.guide-container {
  display: flex;
  padding: 0.5rem 1rem;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.1);
  width: fit-content;
}

.guide-container img {
  height: 0.875rem;
}

.guide-container p {
  color: #fbbf24;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.hero-content h1 {
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 4.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.725rem;
  text-transform: capitalize;
}

.hero-content h1 span {
  color: #fbbf24;
}

.hero-content .heading-text {
  color: rgba(255, 255, 255, 0.8);
  text-align: center;
  font-family: Nunito;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.75rem;
  letter-spacing: -0.00488rem;
  width: 100%;
  max-width: 34rem;
}

.hero-content .buttons-container {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.hero-content .buttons-container a {
  padding: 1rem 2rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00331rem;
}

.hero-content .buttons-container .get-tickets-btn {
  border-radius: 624.9375rem;
  background: #f97316;
  box-shadow:
    0 20px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1);
}

.hero-content .buttons-container .view-map-btn {
  border-radius: 624.9375rem;
  border: 2px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.15);
}

.get-tickets-section {
  padding: 1rem 3rem;
  background-color: #fef9e7;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.get-tickets-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.get-tickets-section h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.5rem;
  letter-spacing: 0.00294rem;
}

.get-tickets-section .heading-text {
  margin-top: 1rem;
  color: #4b5563;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem;
  width: 100%;
  max-width: 30rem;
}

.ticket-options {
  margin-top: 4rem;
  display: flex;
  justify-content: space-between;
  gap: 2rem;
}

.ticket-option {
  padding: 2rem;
  border-radius: 1.5rem;
  width: 25rem;
}

.ticket-option .top-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.ticket-option .age-container {
  padding: 0.25rem 0.75rem;
  border-radius: 624.9375rem;
  font-family: Nunito;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1rem;
  letter-spacing: 0.01875rem;
  text-transform: uppercase;
}

.ticket-option .top-section img {
  height: 3rem;
}

.ticket-option h3 {
  color: #713f12;
  font-family: Fredoka;
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.25rem;
}

.ticket-option .price-container {
  margin-top: 0.25rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.ticket-option .price {
  color: #713f12;
  font-family: Fredoka;
  font-size: 3.5rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.0205rem;
}

.ticket-option .per-person {
  color: #a16207;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.5rem;
  letter-spacing: 0.00881rem;
}

.ticket-features {
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.ticket-feature {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.ticket-feature img {
  width: 1.5rem;
}

.ticket-feature p {
  font-family: Nunito;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5rem;
  letter-spacing: 0.00881rem;
  text-transform: capitalize;
}

.get-tickets-section .buy-now-btn {
  margin-top: 2rem;
  border-radius: 1rem;
  width: 100%;
  height: 3.75rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 0.75rem;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: -0.03075rem;
  color: #fff;
}

.get-tickets-section .buy-now-btn img {
  height: 1.125rem;
}

.ticket-option.cub {
  background: linear-gradient(152deg, #fef3c7 0%, #fde68a 60%, #fbbf24 100%);
  box-shadow: 0 20px 50px -10px rgba(251, 191, 36, 0.35);
}

.ticket-option.cub .age-container {
  background: rgba(178, 122, 2, 0.2);
  color: #854d0e;
}

.ticket-option.cub .buy-now-btn {
  background: #b3870370;
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.ticket-option.explorer {
  border-radius: 1.5rem;
  background: linear-gradient(152deg, #fff7ed 0%, #fed7aa 60%, #f97316 100%);
  box-shadow: 0 20px 50px -10px rgba(249, 115, 22, 0.35);
}

.ticket-option.explorer .age-container {
  background-color: #ea580c33;
  color: #7c2d12;
}

.ticket-option.explorer .buy-now-btn {
  background-color: orange;
  color: #fff;
}

.ticket-option.pride {
  box-shadow: 0 20px 60px -10px rgba(26, 74, 46, 0.5);
  background-color: #15803d;
}

.ticket-option.pride .age-container {
  background: rgba(255, 255, 255, 0.15);
  color: #ffffffcc;
}

.ticket-option.pride h3,
.ticket-option.pride .price {
  color: #fff;
}

.ticket-option.pride .per-person {
  color: #ffffff99;
}

.ticket-option.pride .ticket-feature {
  color: #fff;
}

.ticket-option.pride .buy-now-btn {
  background-color: rgb(207, 207, 29);
  color: #1a4a2e;
}

.ticket-option.cub .ticket-feature p,
.ticket-option.explorer .ticket-feature p {
  color: #713f12;
}

.ticket-option.cub .ticket-feature p.inactive {
  color: #facc15;
}

.ticket-option.explorer .ticket-feature p.inactive {
  color: #fb923c;
}

.ticket-option.pride {
  position: relative;
}

.best-value-container {
  border-radius: 624.9375rem;
  background: rgb(207, 207, 29);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
  height: 2rem;
  padding: 0 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  width: fit-content;
  position: absolute;
  top: -1rem;
  left: 8rem;
}

.best-value-container p {
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: -0.02rem;
}

.opening-hours-section {
  padding: 6rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.opening-hours-section .schedule {
  color: #0891b2;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.opening-hours-section h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-size: 3rem;
  font-weight: 700;
  line-height: 4.5rem;
  letter-spacing: 0.00284rem;
  font-family: Fredoka;
}

.opening-hours-container {
  border-radius: 1.5rem;
  background: linear-gradient(111deg, #1a4a2e 0%, #0d3b20 100%);
  padding: 2.5rem;
  width: 100%;
  margin-top: 3.5rem;
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.opening-hours {
  width: 23rem;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 1rem;
  border: 2px solid rgba(8, 145, 178, 0.2);
  background: rgba(8, 145, 178, 0.15);
}

.opening-hours.weekends {
  border-radius: 1rem;
  border: 2px solid rgba(249, 115, 22, 0.3);
  background: rgba(249, 115, 22, 0.15);
}

.opening-hours img {
  height: 2.5rem;
}

.opening-hours .days-container {
  margin: 1.25rem 0;
  padding: 0.375rem 1rem;
  border-radius: 624.9375rem;
  background: rgba(251, 191, 36, 0.2);
}

.opening-hours .days-container p {
  color: #fbbf24;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0.02188rem;
  text-transform: uppercase;
}

.opening-hours.weekends .days-container {
  background: rgba(249, 115, 22, 0.25);
}

.opening-hours.weekends .days-container p {
  color: #f97316;
}

.opening-hours.holidays .days-container {
  background: rgba(8, 145, 178, 0.2);
}

.opening-hours.holidays .days-container p {
  color: #0891b2;
}

.opening-hours .time {
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.25rem;
  letter-spacing: 0.011rem;
}

.opening-hours .to {
  color: rgba(255, 255, 255, 0.4);
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.05056rem;
}

.opening-hours .hours-open {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.opening-hours .green-dot {
  width: 0.5rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #4ade80;
}

.opening-hours .orange-dot {
  width: 0.5rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #f97316;
}

.opening-hours .blue-dot {
  width: 0.5rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #0891b2;
}

.opening-hours .hours-open p {
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem;
  letter-spacing: 0.00088rem;
}

.last-chance-container {
  margin: 2rem auto 0;
  padding: 0.75rem 1.5rem;
  gap: 0.75rem;
  display: flex;
  align-items: center;
  border-radius: 1rem;
  border: 1px solid rgba(251, 191, 36, 0.25);
  background: rgba(251, 191, 36, 0.12);
}

.last-chance-container img {
  height: 1rem;
}

.last-chance-container p {
  color: rgba(255, 255, 255, 0.8);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.25rem;
  letter-spacing: 0.00088rem;
}

.last-chance-container p span {
  color: #fbbf24;
  font-weight: 800;
}

.directions-section {
  padding: 3rem;
  background-color: #fef9e7;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.directions-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.directions-section h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-weight: 700;
  line-height: 4.5rem;
  letter-spacing: 0.00294rem;
}

.directions-grid {
  margin-top: 3.5rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.5rem;
}

.directions-grid .map-side img {
  width: 100%;
}

.directions-grid .transport-section {
  margin-top: 2rem;
}

.transport-section .intro-transport-text {
  color: #4b5563;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.75rem;
}

.transport-items {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.transport-item {
  padding: 2.25rem 1.5rem 1.5rem;
  display: flex;
  gap: 1.25rem;
  border-radius: 1rem;
  align-items: flex-start;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.transport-item.car {
  border-left: 5px solid #f97316;
}

.transport-item.bus {
  border-left: 5px solid #fbbf24;
}

.transport-item.metro {
  border-left: 5px solid #0891b2;
}

.transport-item.bike {
  border-left: 5px solid #1a4a2e;
}

.transport-item img {
  width: 3.5rem;
  height: 3.5rem;
}

.transport-item .text-section h4 {
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00731rem;
}

.transport-item .text-section p {
  margin-top: 0.25rem;
  color: #4b5563;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5rem;
  letter-spacing: -0.00294rem;
}

.transport-item.bus p span {
  color: #f97316;
  font-weight: 700;
}

.transport-item.metro p span {
  color: #0891b2;
  font-weight: 500;
}

.zoo-map-section {
  padding: 8rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.zoo-map-section .small-heading-text {
  color: #1a4a2e;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.zoo-map-section h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.5rem; /* 150% */
  letter-spacing: 0.00881rem;
}

.zoo-map-section .map-desc-text {
  color: #4b5563;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem;
  width: 100%;
  max-width: 30rem;
}

.zoo-map-section .large-zoo-map {
  width: 100%;
}

.zoo-map-section .zones-list {
  margin-top: 2rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
}

.zoo-map-section .zone {
  width: 12rem;
  padding: 0.75rem 1rem;
  display: flex;
  gap: 0.5rem;
  align-items: center;
  border-radius: 0.75rem;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.zone .zone-square {
  width: 1rem;
  height: 1rem;
  border-radius: 0.25rem;
}

.zone.savanna .zone-square {
  background-color: #fde047;
}

.zone.rainforest .zone-square {
  background-color: #4ade80;
}

.zone.arctic .zone-square {
  background-color: #93c5fd;
}

.zone.ocean .zone-square {
  background-color: #99f6e4;
}

.zone.reptile .zone-square {
  background-color: #d9f99d;
}

.zone.petting .zone-square {
  background-color: #fbcfe8;
}

.zone p {
  color: #374151;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem;
  letter-spacing: 0.00088rem;
  padding: 0;
  margin: 0;
}

.visit-tips-section {
  padding: 5rem 3rem;
  background: #fef3c7;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.visit-tips-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.visit-tips-section h2 {
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.5rem;
}

.visit-tips-section .heading-text {
  margin-top: 1rem;
  color: #4b5563;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem;
  letter-spacing: 0.00113rem;
}

.visit-tips-section .tips-grid {
  margin-top: 3.5rem;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1.25rem;
}

.visit-tips-section .tip {
  padding: 1.5rem;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.visit-tips-section .tip img {
  height: 3rem;
}

.visit-tips-section .tip .horizontal-line {
  width: 100%;
  height: 0.0625rem;
  background: rgba(249, 115, 22, 0.4);
  margin: 1rem 0;
}

.visit-tips-section .tip h3 {
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.40625rem;
  letter-spacing: 0.00219rem;
}

.visit-tips-section .tip .body-text {
  margin-top: 1rem;
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25rem;
  letter-spacing: 0.00088rem;
}

.access-section {
  padding: 5rem 3rem;
  background: linear-gradient(118deg, #0891b2 0%, #0e7490 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.access-section .small-heading-text {
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.access-section h2 {
  margin-top: 1rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.5rem;
}

.access-section .heading-text {
  margin-top: 1rem;
  color: rgba(255, 255, 255, 0.75);
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem;
  width: 100%;
  max-width: 36rem;
}

.access-section .access-grid {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.access-grid .access-item {
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.12);
}

.access-grid .access-item img {
  width: 4rem;
  height: 4rem;
}

.access-grid .access-item h3 {
  margin-top: 1rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00244rem;
  text-transform: capitalize;
}

.access-grid .access-item .body-text {
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.42188rem;
  letter-spacing: 0.00169rem;
}

.access-section .download-access-btn {
  margin-top: 3rem;
  width: 20.875rem;
  height: 3.75rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 1);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #0891b2;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00113rem;
  gap: 1rem;
}

/* Events page styles */

.events-hero-section {
  padding: 5rem 3rem;
  background-color: #1a4a2e;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 3rem;
  flex-wrap: wrap;
}

.events-hero-section .text-section {
  width: 100%;
  max-width: 35rem;
}

.events-hero-section .live-container {
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  border: 1px solid rgba(249, 115, 22, 0.4);
  background: rgba(249, 115, 22, 0.2);
  width: fit-content;
}

.events-hero-section .live-container img {
  height: 0.875rem;
}

.events-hero-section .live-container p {
  color: #f97316;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem;
  letter-spacing: 0.04375rem;
  text-transform: uppercase;
}

.events-hero-section h1 {
  margin-top: 1.5rem;
  color: #fff;
  font-family: Fredoka;
  font-size: 4.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.725rem;
  letter-spacing: 0.00438rem;
}

.events-hero-section h1 span {
  color: #fbbf24;
  display: block;
}

.events-hero-section .heading-text {
  margin-top: 1.5rem;
  color: rgba(255, 255, 255, 0.8);
  font-family: Nunito;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.03125rem;
  letter-spacing: -0.00488rem;
}

.events-hero-section .buttons-container {
  margin-top: 1.5rem;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.events-hero-section .buttons-container .today {
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  background: #f97316;
  box-shadow:
    0 20px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1);
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00438rem;
  text-transform: capitalize;
}

.events-hero-section .buttons-container .all-events {
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  border: 2px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00438rem;
  text-transform: capitalize;
}

.events-hero-section .image-section {
  position: relative;
}

.events-hero-section .image-section img {
  width: 100%;
  max-width: 22rem;
}
.after-dark-section {
  margin: 5rem 3rem;
  display: flex;
  justify-content: center;
}

.after-dark-container {
  width: 100%;
  padding: 2.5rem;
  display: flex;
  justify-content: space-between;
  gap: 3rem;
  border-radius: 2.5rem;
  background: linear-gradient(110deg, #3b0764 0%, #1a1a5e 35%, #1a4a2e 100%);
}

.after-dark-container .special-container {
  display: flex;
  padding: 0.5rem 1rem;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  border: 1px solid rgba(251, 191, 36, 0.4);
  background: rgba(251, 191, 36, 0.2);
  width: fit-content;
}

.after-dark-container .special-container img {
  height: 0.875rem;
}

.after-dark-container .special-container {
  color: #fbbf24;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;

  letter-spacing: 0.04375rem;
  text-transform: uppercase;
}

.after-dark-container h2 {
  margin-top: 2rem;
  color: #fff;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3.3rem; /* 110% */
}

.after-dark-container .body-text {
  margin-top: 1rem;
  color: rgba(255, 255, 255, 0.7);
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.82813rem;
  width: 100%;
  max-width: 34rem;
}

.after-dark-container .event-features-container {
  margin-top: 1.5rem;
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.after-dark-container .event-feature {
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.1);

  color: #fff;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.5rem;
  letter-spacing: 0.001rem;
}

.after-dark-container .event-feature.calendar i {
  color: #fbbf24;
}

.after-dark-container .event-feature.clock i {
  color: #0891b2;
}

.after-dark-container .event-feature.tag {
  border-radius: 624.9375rem;
  border: 1px solid rgba(249, 115, 22, 0.5);
  background: rgba(249, 115, 22, 0.2);
  color: #f97316;
}

.after-dark-container .buttons-container {
  margin-top: 1.5rem;
  display: flex;
  gap: 1rem;
}

.after-dark-container .buttons-container .book-now-btn {
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  background: #f97316;
  box-shadow:
    0 20px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1);
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00438rem;
  text-transform: capitalize;
}

.after-dark-container .buttons-container .learn-more-btn {
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  border: 2px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00438rem;
  text-transform: capitalize;
}

.after-dark-container .image-section {
  display: flex;
  justify-content: center;
  align-items: center;
}

.after-dark-container .after-dark-hero {
  width: 100%;
  max-width: 17.5rem;
}

.today-shows-section {
  padding: 3rem;
}

.today-shows-section .top-section {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.today-shows-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.today-shows-section h2 {
  margin-top: 0.75rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.5rem;
  letter-spacing: 0.00294rem;
}

.today-shows-section .heading-text {
  margin-top: 0.75rem;
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.75rem;
  letter-spacing: -0.00331rem;
  width: 100%;
  max-width: 30rem;
}

.today-shows-section .today-live-container {
  margin-top: 2rem;
  padding: 1rem 1.5rem;
  border-radius: 1rem;
  border: 1px solid #f3f4f6;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  width: fit-content;
  display: flex;
  gap: 0.75rem;
  align-items: center;
}

.today-shows-section .green-dot {
  width: 0.75rem;
  height: 0.75rem;
  border-radius: 624.9375rem;
  background: #22c55e;
}

.today-shows-section p {
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: 0.00219rem;
}

.today-live-grid {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.5rem;
}

.today-live-grid .today {
  padding: 1.5rem;
  border-radius: 1.75rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
}

.today-live-grid .today.lion {
  border-radius: 1.75rem;
  background: linear-gradient(113deg, #f97316 0%, #dc2626 100%);
}

.today-live-grid .today.dolphin {
  border-radius: 1.75rem;
  background: linear-gradient(113deg, #0891b2 0%, #0e7490 100%);
}

.today-live-grid .today.bird {
  border-radius: 1.75rem;
  background: linear-gradient(113deg, #7c3aed 0%, #4c1d95 100%);
}

.today-live-grid .today.elephant {
  border-radius: 1.75rem;
  background: linear-gradient(113deg, #1a4a2e 0%, #166534 100%);
}

.today-live-grid .today.reptile {
  border-radius: 1.75rem;
  background: linear-gradient(113deg, #ca8a04 0%, #854d0e 100%);
}

.today-live-grid .today.parade {
  border-radius: 1.75rem;
  background: linear-gradient(113deg, #db2777 0%, #9d174d 100%);
}

.today-live-grid .today .top-section {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.today .today-icon {
  width: 2.5rem;
}

.today .top-section .right-side {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.75rem;
}

.today .time-container {
  display: flex;
  padding: 0.25rem 0.75rem;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.00513rem;
  width: fit-content;
}

.today .location-container {
  display: flex;
  padding: 0.25rem 0.75rem;
  align-items: center;
  gap: 0.25rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.15);
  color: rgba(255, 255, 255, 0.9);
  font-family: Nunito;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1rem; /* 133.333% */
  letter-spacing: 0.00219rem;
}

.today h3 {
  margin-top: 2rem;
  color: #fff;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem; /* 133.333% */
}

.today .body-text {
  margin-top: 0.5rem;
  color: rgba(255, 255, 255, 0.8);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.42188rem; /* 162.5% */
}

.today .reserve-btn {
  margin-top: 1.75rem;
  display: flex;
  padding: 0.625rem 1.25rem;
  justify-content: center;
  align-items: center;
  border-radius: 624.9375rem;
  background: #fff;

  text-align: center;
  font-family: Fredoka;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.006rem;
}

.today.lion .reserve-btn {
  color: #f97316;
}

.today.dolphin .reserve-btn {
  color: #0891b2;
}

.today.bird .reserve-btn {
  color: #7e22ce;
}

.today.elephant .reserve-btn {
  color: #1a4a2e;
  background-color: #fbbf24;
}

.today.reptile .reserve-btn {
  color: #854d0e;
}

.today.parade .reserve-btn {
  color: #be185d;
}

.today-circle {
  width: 10rem;
  height: 10rem;
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 624.9375rem;
  opacity: 0.2;
  background: radial-gradient(
    70.71% 70.71% at 50% 50%,
    #fff 0%,
    rgba(255, 255, 255, 0) 100%
  );
}

.annual-events-section {
  padding: 5rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: #fff;
}

.annual-events-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.annual-events-section h2 {
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.5rem; /* 150% */
  letter-spacing: 0.00294rem;
}

.annual-events-section .heading-text {
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: -0.0055rem;
}

.annual-events-grid {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1.5rem;
}

.annual-event {
  padding: 1.5rem;
  border-radius: 1.75rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}

.annual-event img {
  height: 3rem;
  align-self: flex-start;
}

.annual-event .date-container {
  margin-top: 1.25rem;
  padding: 0.25rem 0.75rem;
  width: fit-content;
  border-radius: 624.9375rem;

  font-family: Nunito;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1rem; /* 133.333% */
  letter-spacing: 0.00731rem;
}

.annual-event.spooky {
  background: linear-gradient(165deg, #1c0533 0%, #4c1d95 50%, #7c2d12 100%);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.annual-event.winter {
  border-radius: 1.75rem;
  background: linear-gradient(165deg, #0c4a6e 0%, #0891b2 50%, #164e63 100%);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.annual-event.spring {
  border-radius: 1.75rem;
  background: linear-gradient(165deg, #14532d 0%, #16a34a 50%, #166534 100%);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.annual-event.tropical {
  border-radius: 1.75rem;
  background: linear-gradient(165deg, #7c2d12 0%, #f97316 50%, #ca8a04 100%);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.annual-event.family {
  border-radius: 1.75rem;
  background: linear-gradient(165deg, #581c87 0%, #9333ea 50%, #1a4a2e 100%);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.annual-event.spooky .date-container {
  border: 1px solid rgba(249, 115, 22, 0.3);
  background: rgba(124, 45, 18, 0.5);
  color: #f97316;
}

.annual-event.winter .date-container,
.annual-event.spring .date-container,
.annual-event.tropical .date-container,
.annual-event.family .date-container {
  border-radius: 624.9375rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
}

.annual-event h3 {
  margin-top: 0.75rem;
  color: #fff;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 140% */
}

.annual-event .body-text {
  margin-top: 0.5rem;
  color: rgba(255, 255, 255, 0.7);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.42188rem; /* 162.5% */
}

.annual-event .learn-more-btn {
  margin-top: 1.5rem;
  width: 100%;
  padding: 0.625rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 624.9375rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.00088rem;
}

.birthday-section {
  padding: 5rem 3rem;
  display: flex;
  justify-content: center;
}

.birthday-section .birthday-container {
  border-radius: 2.5rem;
  background: linear-gradient(116deg, #fbbf24 0%, #f59e0b 100%);
  padding: 3rem;
  width: 100%;
  display: grid;
  grid-template-columns: 2.5fr 1fr;
  gap: 4rem;
}

.birthday-container .cake-hero {
  width: 3.75rem;
}

.birthday-container h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 2.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3.025rem;
  width: 100%;
  max-width: 35rem;
}

.birthday-container .body-text {
  margin-top: 1rem;
  color: rgba(26, 74, 46, 0.8);
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: -0.00438rem;
  width: 100%;
  max-width: 32rem;
}

.birthday-container .body-text span {
  color: #1a4a2e;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: -0.00438rem;
}

.birthday-container .celebrate-items-grid {
  margin-top: 1.5rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  width: 100%;
}

.birthday-container .celebrate-items-grid .celebrate-item {
  padding: 0.75rem 1rem;
  display: flex;
  gap: 0.75rem;
  align-items: center;
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.5);
}

.celebrate-item img {
  height: 1.5rem;
}

.celebrate-item p {
  color: #1a4a2e;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.00088rem;
}

.birthday-hero {
  width: 100%;
  align-self: center;
}

.birthday-container .enquire-btn {
  margin-top: 2rem;
  display: block;
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  background: #14532d;
  box-shadow:
    0 20px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1);
  width: fit-content;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 140% */
  letter-spacing: 0.00613rem;
}

.group-bookings-section {
  padding: 3rem;
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 2rem;
  background: linear-gradient(120deg, #0891b2 0%, #0e7490 100%);
}

.group-bookings-section .school-container {
  padding: 0.5rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.15);
  width: fit-content;
}

.group-bookings-section .school-container img {
  height: 0.875rem;
}

.group-bookings-section .school-container p {
  color: #fff;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;

  letter-spacing: 0.04375rem;
  text-transform: uppercase;
}

.group-bookings-section h2 {
  margin-top: 1.5rem;
  color: #fff;
  font-family: Fredoka;
  font-size: 2.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3.025rem; /* 110% */
}

.group-bookings-section h2 span {
  color: #fbbf24;
  display: block;
}

.group-bookings-section .heading-text {
  margin-top: 1rem;
  color: rgba(255, 255, 255, 0.8);
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.82813rem;
  width: 100%;
  max-width: 35rem;
}

.group-bookings-section .learning-grid {
  margin-top: 2rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.group-bookings-section .learning-item {
  padding: 1rem 1.25rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  border-radius: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.15);
  background: rgba(255, 255, 255, 0.1);
}

.group-bookings-section .learning-item img {
  width: 2.5rem;
  height: 2.5rem;
}

.group-bookings-section .learning-item h4 {
  color: #fff;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.75rem;
  letter-spacing: 0.00219rem;
}

.group-bookings-section .learning-item .body-text {
  color: rgba(255, 255, 255, 0.7);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.25rem;
}

.group-bookings-section .buttons-container {
  margin-top: 2.5rem;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.group-bookings-section .book-group-btn {
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  background: #fbbf24;
  box-shadow:
    0 20px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1);
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: 0.00331rem;
}

.group-bookings-section .download-brochure-btn {
  padding: 1rem 2rem;
  border-radius: 624.9375rem;
  border: 2px solid rgba(255, 255, 255, 0.3);
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: 0.00219rem;
}

.group-bookings-section .stats-section {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-self: center;
}

.group-bookings-section .stats-section .visits-container {
  width: 100%;
  border-radius: 1.5rem;
  background: rgba(255, 255, 255, 1);
  box-shadow:
    0 20px 25px -5px rgba(0, 0, 0, 0.1),
    0 8px 10px -6px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: 1rem;
}

.group-bookings-section .stats-section .visits-container img {
  width: 2.25rem;
}

.group-bookings-section .stats-section .visits-container h3 {
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.25rem; /* 120% */
  letter-spacing: 0.00369rem;
}

.group-bookings-section .stats-section .visits-container p {
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5rem; /* 150% */
  letter-spacing: -0.00294rem;
}

.group-bookings-section .stats-section .middle-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

.group-bookings-section .stats-section .middle-row .small-stat-container {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  border-radius: 1.25rem;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.15);
}

.group-bookings-section .stats-section .program-stat {
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem; /* 133.333% */
  letter-spacing: 0.00881rem;
}

.group-bookings-section .stats-section .free {
  color: #fbbf24;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem; /* 133.333% */
  letter-spacing: 0.01756rem;
  text-transform: uppercase;
}

.group-bookings-section .stats-section .small-body-text,
.group-bookings-section .stats-section .call-times {
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: -0.00256rem;
}

.group-bookings-section .stats-section .call-times {
  text-align: left;
}

.group-bookings-section .call-container {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  border-radius: 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(26, 74, 46, 0.4);
}

.group-bookings-section .call-container .call-text {
  color: #fff;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: 0.00331rem;
}

.group-bookings-section .call-container .call-text i {
  color: #fbbf24;
}

.group-bookings-section .call-container .phone-number {
  color: #fbbf24;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 140% */
}

/* Adopt page styles */

.adopt-hero-section {
  padding: 5rem;
  background: linear-gradient(151deg, #fef9e7 0%, #d1fae5 50%, #ecfdf5 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: hidden;
}

.adopt-hero-section .conservation-section {
  padding: 0.5rem 1.25rem;
  display: flex;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  border: 1px solid rgba(249, 115, 22, 0.2);
  background: rgba(249, 115, 22, 0.1);
}

.adopt-hero-section .conservation-section img {
  width: 0.75rem;
}

.adopt-hero-section .conservation-section p {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.adopt-hero-section .heading-one {
  margin-top: 2.5rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 4.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.86rem; /* 108% */
  letter-spacing: -0.07031rem;
}

.adopt-hero-section .heading-two {
  color: #f97316;
  text-align: center;
  font-family: Fredoka;
  font-size: 4.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.86rem; /* 108% */
}

.adopt-hero-section .heading-text {
  margin-top: 2rem;
  width: 100%;
  max-width: 40rem;
  color: #4b5563;
  text-align: center;
  font-family: Nunito;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.03125rem; /* 162.5% */
  letter-spacing: -0.00369rem;
}

.adopt-hero-section .heading-text span {
  color: #1a4a2e;
  font-weight: 700;
}

.adopt-hero-section .buttons-container {
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

.adopt-hero-section .choose-animal-btn {
  display: flex;
  padding: 1rem 2.5rem;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  background: #f97316;
  box-shadow: 0 0 40px 0 rgba(249, 115, 22, 0.3);
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 140% */
  letter-spacing: -0.01344rem;
}

.adopt-hero-section .choose-animal-btn img {
  height: 1.25rem;
}

.adopt-hero-section .how-it-works-btn {
  display: flex;
  padding: 1rem 2.5rem;
  align-items: center;
  gap: 0.5rem;
  border-radius: 624.9375rem;
  border: 2px solid #1a4a2e;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 140% */
  letter-spacing: 0.00488rem;
}

.adopt-hero-section .how-it-works-btn i {
  color: #0891b2;
}

.adopt-stats-container {
  margin-top: 3.25rem;
  display: flex;
  gap: 1.5rem;
  justify-content: center;
  align-items: center;
}

.adopt-stat {
  padding: 0.5rem 1.5rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.08);
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.adopt-stat img {
  width: 0.66rem;
}

.adopt-stat p {
  color: #1a4a2e;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.00256rem;
}

.supporters-grid {
  margin-top: 4rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}

.supporters-grid .supporter {
  padding: 2rem;
  border-radius: 1.5rem;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.15);
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.supporters-grid .supporter img {
  height: 4.5rem;
}

.supporters-grid .supporter h3 {
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: 0.02419rem;
}

.supporters-grid .supporter p {
  color: #9ca3af;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: -0.00088rem;
}

.adopt-hero-section .yellow-circle {
  position: absolute;
  top: 0;
  right: 5rem;
  width: 24rem;
  height: 24rem;
  border-radius: 12rem;
  opacity: 0.5;
  background: #fbbf24;
  filter: blur(45px);
}

.adopt-hero-section .orange-circle {
  position: absolute;
  top: 15rem;
  right: 35rem;
  width: 18rem;
  height: 18rem;
  border-radius: 12rem;
  opacity: 0.5;
  background: #f59e0b;
  filter: blur(45px);
  z-index: 0;
}

.adopt-hero-section .blue-circle {
  width: 20rem;
  height: 20rem;
  position: absolute;
  left: -3.75rem;
  bottom: -2.5rem;
  border-radius: 10rem;
  opacity: 0.5;
  background-color: #0891b2;
  filter: blur(46px);
}

.how-it-works-section {
  padding: 5rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.how-it-works-section .small-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.how-it-works-section h2 {
  margin-top: 0.75rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.875rem; /* 150% */
}

.how-it-works-section .heading-text {
  margin-top: 0.75rem;
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem; /* 155.556% */
  width: 100%;
  max-width: 33rem;
}

.how-it-works-section .packages-grid {
  margin-top: 4rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.packages-grid .package {
  border-radius: 1.5rem;
  background: rgba(255, 255, 255, 1);
  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.08);
  padding: 2.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.packages-grid .package img {
  width: 2.5rem;
  margin-top: 1rem;
}

.packages-grid h3 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem; /* 133.333% */
  letter-spacing: 0.00294rem;
}

.packages-grid .body-text {
  margin-top: 1rem;
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.625rem; /* 162.5% */
  letter-spacing: -0.00194rem;
}

.package .number-container {
  width: 4rem;
  height: 4rem;
  flex-shrink: 0;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-weight: 700;
}

.package.package-one .number-container {
  background-color: #f97316;
  color: #fff;
  box-shadow:
    0 10px 15px -3px rgba(249, 115, 22, 0.3),
    0 4px 6px -4px rgba(249, 115, 22, 0.3);
}

.package.package-two .number-container {
  background-color: #fbbf24;
  box-shadow:
    0 10px 15px -3px rgba(251, 191, 36, 0.3),
    0 4px 6px -4px rgba(251, 191, 36, 0.3);
  color: #1a4a2e;
}

.package.package-three .number-container {
  background-color: #1e3a5f;
  box-shadow:
    0 10px 15px -3px rgba(8, 145, 178, 0.3),
    0 4px 6px -4px rgba(8, 145, 178, 0.3);
  color: #fff;
}

.package.package-four .number-container {
  color: #fff;
  background-color: #111;
  box-shadow:
    0 10px 15px -3px rgba(26, 74, 46, 0.3),
    0 4px 6px -4px rgba(26, 74, 46, 0.3);
}

.choose-package-section {
  padding: 6rem 3rem;
  background: linear-gradient(180deg, #ecfdf5 0%, #fef9e7 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
}

.choose-package-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.choose-package-section h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.875rem; /* 150% */
}

.choose-package-section .heading-text {
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem; /* 155.556% */
}

.support-packages-grid {
  margin-top: 4rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.support-package {
  padding: 2rem;
  position: relative;
}

.support-package.cub-package {
  border-radius: 1.5rem;
  border: 2px solid #dcfce7;
  background: #fff;
  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.08);
}

.support-package.guardian-package {
  border-radius: 1.5rem;
  background: linear-gradient(154deg, #f97316 0%, #fb923c 50%, #fbbf24 100%);
  box-shadow: 0 0 40px 0 rgba(249, 115, 22, 0.3);
}

.support-package.champion-package {
  border-radius: 1.5rem;
  border: 1px solid rgba(8, 145, 178, 0.2);
  background: linear-gradient(153deg, #0f2d1c 0%, #1a4a2e 60%, #0891b2 100%);
  box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.15);
}

.support-package .package-icon {
  width: 3.5rem;
  height: 3.5rem;
}

.support-package .package-name {
  margin-top: 1rem;
  font-family: Fredoka;
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.25rem; /* 120% */
}

.support-package.cub-package .package-name {
  color: #1a4a2e;
}

.support-package.guardian-package .package-name,
.support-package.champion-package .package-name {
  color: #fff;
}

.support-package .package-cost {
  margin-top: 1rem;
  display: flex;
  align-items: flex-end;
  gap: 0.25rem;
}

.support-package .package-cost .price {
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;

  letter-spacing: 0.06738rem;
}

.support-package.cub-package .package-cost .price {
  color: #1a4a2e;
}

.support-package.guardian-package .package-cost .price,
.support-package.champion-package .package-cost .price {
  color: #fff;
}

.support-package .package-cost .month {
  color: rgba(255, 255, 255, 0.6);
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5rem; /* 150% */
  letter-spacing: 0.00488rem;
}

.support-package.cub-package .package-cost .month {
  color: #9ca3af;
}

.support-package .package-features {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1.5rem;
}

.support-package .package-feature {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.support-package .package-feature img {
  width: 1.5rem;
  height: 1.5rem;
}

.support-package .package-feature p {
  color: #fff;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.5rem; /* 150% */
  letter-spacing: -0.00388rem;
}

.support-package.cub-package .package-feature p {
  color: #374151;
}

.cub-inactive {
  color: #d1d5db !important;
}

.guardian-inactive {
  color: #ffffff80 !important;
}

.adopt-now-btn {
  display: block;
  margin-top: 1.5rem;
  width: 100%;
  padding: 1rem 0;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 1rem;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 140% */
  letter-spacing: -0.02688rem;
}

.support-package.cub-package .adopt-now-btn {
  background-color: #1a4a2e;
  color: #fff;
}

.support-package.guardian-package .adopt-now-btn {
  border-radius: 1rem;
  background: rgba(255, 255, 255, 1);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
  color: #f97316;
}

.support-package.champion-package .adopt-now-btn {
  border-radius: 1rem;
  background: #0891b2;
  box-shadow: 0 0 40px 0 rgba(8, 145, 178, 0.3);
  color: #fff;
}

.most-popular-container {
  position: absolute;
  top: 1rem;
  right: 1rem;
  width: 10rem;
  height: 1.75rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0);
  box-shadow:
    0 10px 15px -3px rgba(0, 0, 0, 0.1),
    0 4px 6px -4px rgba(0, 0, 0, 0.1);
}

.most-popular-container p {
  color: #fff;
  font-family: Nunito;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1rem; /* 133.333% */
  letter-spacing: 0.075rem;
  text-transform: uppercase;
}

.support-package.guardian-package {
  transform: scale(1.1);
}

.meet-animals-section {
  padding: 6rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.meet-animals-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.meet-animals-section h2 {
  margin-top: 1.5rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4rem;
  width: 100%;
  max-width: 38rem;
}

.meet-animals-section .heading-text {
  margin-top: 1.5rem;
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem; /* 155.556% */
  width: 100%;
  max-width: 35rem;
}

.meet-animals-grid {
  margin-top: 4rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  width: 100%;
}

.meet-animal {
  width: 100%;
  padding: 2rem;
  border-radius: 1.5rem;
  border: 1px solid #fff;

  box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}

.meet-animal .animal-image {
  width: 4.5rem;
  height: 4.5rem;
}

.meet-animal .name {
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem; /* 133.333% */
  letter-spacing: 0.01175rem;
  margin-top: 1rem;
}

.meet-animal .species {
  color: #6b7280;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem; /* 142.857% */
}

.meet-animal .row-container {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.meet-animal .age-container,
.meet-animal .diet-container {
  padding: 0.25rem 0.75rem;
  border-radius: 624.9375rem;
  background: rgba(255, 255, 255, 0.7);
  color: #4b5563;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: -0.02819rem;
}

.meet-animal .supporters-container {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}

.meet-animal .supporters-container img {
  width: 0.875rem;
}

.meet-animal .supporters-container p {
  color: #f43f5e;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.00256rem;
}

.meet-animal .adopt-me-btn {
  margin-top: 1rem;
  width: 100%;
  height: 3.25rem;
  border-radius: 1rem;
  background: #14532d;
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.1),
    0 2px 4px -2px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: -0.02856rem;
}

.meet-animal.meet-lion {
  background: linear-gradient(
    142deg,
    #fef3c7 0%,
    #fde68a 50%,
    rgba(245, 158, 11, 0.13) 100%
  );
}

.meet-animal.meet-elephant {
  background: linear-gradient(
    142deg,
    #e0e7ff 0%,
    #c7d2fe 50%,
    rgba(129, 140, 248, 0.13) 100%
  );
}

.meet-animal.meet-giraffe {
  background: linear-gradient(
    142deg,
    #fef9c3 0%,
    #fde047 50%,
    rgba(234, 179, 8, 0.13) 100%
  );
}

.meet-animal.meet-panda {
  background: linear-gradient(
    142deg,
    #f0fdf4 0%,
    #bbf7d0 50%,
    rgba(74, 222, 128, 0.13) 100%
  );
}

.meet-animal.meet-macaw {
  background: linear-gradient(
    142deg,
    #ecfeff 0%,
    #cffafe 50%,
    rgba(8, 145, 178, 0.13) 100%
  );
}

.meet-animal.meet-cheetah {
  background: linear-gradient(
    142deg,
    #fff7ed 0%,
    #fed7aa 50%,
    rgba(249, 115, 22, 0.13) 100%
  );
}

.meet-animal.meet-rhino {
  background: linear-gradient(
    142deg,
    #f1f5f9 0%,
    #cbd5e1 50%,
    rgba(100, 116, 139, 0.13) 100%
  );
}

.meet-animal.meet-otter {
  background: linear-gradient(
    142deg,
    #eff6ff 0%,
    #bfdbfe 50%,
    rgba(59, 130, 246, 0.13) 100%
  );
}

.meet-animal.meet-flamingo {
  background: linear-gradient(
    142deg,
    #fdf2f8 0%,
    #fce7f3 50%,
    rgba(236, 72, 153, 0.13) 100%
  );
}

.meet-animal .temper-container {
  display: flex;
  padding: 0.25rem 0.75rem;
  justify-content: center;
  align-items: flex-start;
  text-align: center;
  font-family: Nunito;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1rem; /* 133.333% */
  letter-spacing: 0.01875rem;
  text-transform: uppercase;
  position: absolute;
  right: 1rem;
  top: 1rem;
}

.meet-animal.meet-lion .temper-container {
  border-radius: 624.9375rem;
  background: rgba(249, 115, 22, 0.2);
  color: #f97316;
}

.meet-animal.meet-elephant .temper-container {
  border-radius: 624.9375rem;
  background: #f3e8ff;
  color: #9333ea;
}

.meet-animal.meet-giraffe .temper-container {
  border-radius: 624.9375rem;
  background: rgba(251, 191, 36, 0.3);
  color: #1f2937;
}

.meet-animal.meet-panda .temper-container {
  border-radius: 624.9375rem;
  background: #dcfce7;
  color: #15803d;
}

.meet-animal.meet-macaw .temper-container {
  border-radius: 624.9375rem;
  background: rgba(8, 145, 178, 0.1);
  color: #0891b2;
}

.meet-animal.meet-cheetah .temper-container {
  border-radius: 624.9375rem;
  background: rgba(249, 115, 22, 0.1);
  color: #f97316;
}

.meet-animal.meet-rhino .temper-container {
  border-radius: 624.9375rem;
  background: #f1f5f9;
  color: #475569;
}

.meet-animal.meet-otter .temper-container {
  border-radius: 624.9375rem;
  background: #dbeafe;
  color: #2563eb;
}

.meet-animal.meet-flamingo .temper-container {
  border-radius: 624.9375rem;
  background: #fce7f3;
  color: #db2777;
}

.your-impact-section {
  margin: 6rem 1.5rem;
  flex: 1;
  border-radius: 1.5rem;
  background: linear-gradient(117deg, #0f2d1c 0%, #1a4a2e 50%, #0891b2 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 6rem 3.5rem;
}

.your-impact-section .small-heading-text {
  color: #fbbf24;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.your-impact-section h2 {
  margin-top: 0.75rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 3.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.875rem; /* 150% */
  letter-spacing: -0.04125rem;
}

.your-impact-section .heading-text {
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem; /* 155.556% */
  width: 100%;
  max-width: 35rem;
}

.your-impact-section .impact-grid {
  margin-top: 4rem;
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(4, 1fr);
}

.impact-item {
  padding: 2rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.07);
  box-shadow: 0 0 30px 0 rgba(8, 145, 178, 0.15);
  backdrop-filter: blur(5px);
}

.impact-item img {
  height: 4rem;
}

.impact-item .figure {
  margin-top: 1rem;
  color: #fff;
  text-align: center;
  font-family: Fredoka;
  font-size: 3rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3rem; /* 100% */
  letter-spacing: 0.00881rem;
}

.impact-item.conservation .figure {
  color: #fbbf24;
}

.impact-item.supporters .figure {
  color: #f97316;
}

.impact-item p {
  margin-top: 1rem;
  color: rgba(255, 255, 255, 0.7);
  text-align: center;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.40625rem; /* 125% */
  letter-spacing: 0.00113rem;
}

.stories-section {
  padding: 6rem 3rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.stories-section .small-heading-text {
  color: #f97316;
  text-align: center;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.stories-section h2 {
  margin-top: 1rem;
  color: #1a4a2e;
  text-align: center;
  font-family: Fredoka;
  font-size: 3.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: 4.875rem; /* 150% */
  letter-spacing: -0.0095rem;
}

.stories-grid {
  margin-top: 4rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}

.stories-grid .story {
  padding: 2rem;
  border-radius: 1.5rem;
}

.stories-grid .story .star-rating {
  height: 1.25rem;
}

.stories-grid .story .review {
  margin-top: 1.5rem;
  color: #374151;
  font-family: Nunito;
  font-size: 1.125rem;
  font-style: italic;
  font-weight: 500;
  line-height: 1.82813rem; /* 162.5% */
  letter-spacing: -0.0055rem;
}

.stories-grid .story .supporter-details {
  margin-top: 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.stories-grid .story .supporter-details img {
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
}

.stories-grid .story .supporter-details h4 {
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 155.556% */
  letter-spacing: 0.00881rem;
}

.stories-grid .story .supporter-details p {
  color: #6b7280;
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: -0.01369rem;
}

.story.sarah {
  background: linear-gradient(
    140deg,
    #fef3c7 0%,
    rgba(253, 230, 138, 0.13) 100%
  );
}

.story.tom {
  background: linear-gradient(
    140deg,
    #f0fdf4 0%,
    rgba(187, 247, 208, 0.25) 100%
  );
}

.story.emma {
  background: linear-gradient(
    140deg,
    #ecfeff 0%,
    rgba(207, 250, 254, 0.25) 100%
  );
}

.gift-section {
  margin: 4rem 3rem 2rem;
  padding: 5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 1.5rem;
  background: linear-gradient(114deg, #fbbf24 0%, #f59e0b 40%, #fde68a 100%);
  border-top: 2rem solid #f59e0b;
  position: relative;
  overflow: hidden;
}

.gift-section .text-section {
  width: 100%;
  max-width: 35rem;
}

.gift-section .heading-container {
  display: flex;
  gap: 0.5rem;
  align-items: center;
}

.gift-section .heading-container img {
  width: 3.5rem;
}

.gift-section .heading-container p {
  color: rgba(26, 74, 46, 0.7);
  font-family: Nunito;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.25rem; /* 142.857% */
  letter-spacing: 0.0875rem;
  text-transform: uppercase;
}

.gift-section h2 {
  margin-top: 2rem;
  color: #1a4a2e;
  font-family: Fredoka;
  font-size: 3.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3.675rem; /* 105% */
}

.gift-section .body-text {
  margin-top: 1.5rem;
  color: rgba(26, 74, 46, 0.8);
  font-family: Nunito;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.03125rem; /* 162.5% */
  letter-spacing: -0.00488rem;
}

.gift-section .button-container {
  margin-top: 2rem;
  display: flex;
  gap: 1.5rem;
  align-items: center;
}

.gift-section .adopt-now-btn {
  padding: 1rem 2.5rem;
  border-radius: 624.9375rem;
  background: #1a4a2e;
  box-shadow: 0 0 40px 0 rgba(26, 74, 46, 0.4);
  width: fit-content;
  color: #fff;
}

.gift-section .instant-delivery {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #1a4a2e;
  margin-top: 1rem;
}

.gift-section .instant-delivery img {
  height: 1.125rem;
  width: 1.125rem;
}

.gift-section .instant-delivery p {
  color: #1a4a2e;
  font-family: Nunito;
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
}

.gift-section .wild-gift-hero-image {
  width: 16rem;
}

.gift-section .horizontal-line {
  position: absolute;
  top: calc(50% - 2.5rem / 2);
  left: 0;
  right: 0;
  background-color: #f9731633;
  height: 2.5rem;
}

.gift-section .vertical-line {
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(50% - 2.5rem / 2);
  background-color: #f9731633;
  width: 2.6rem;
}

.gift-section .central-circle {
  position: absolute;
  width: 5rem;
  height: 5rem;
  background-color: #f9731633;
  border-radius: 50%;
  top: calc(50% - 5rem / 2);
  left: calc(50% - 5rem / 2);
  z-index: 2;
}

.gift-section .top-left-circle {
  width: 16rem;
  height: 16rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  position: absolute;
  top: -5rem;
  left: -5rem;
}

.gift-section .bottom-right-circle {
  width: 16rem;
  height: 16rem;
  border-radius: 50%;
  background: rgba(249, 115, 22, 0.2);
  position: absolute;
  bottom: -5rem;
  right: -5rem;
}

/* ========================================
   Responsive home page
======================================== */

/* Prevent media from overflowing */
.home-hero-section img,
.statistics-section img,
.zones-section img {
  max-width: 100%;
}

/* Large tablets and smaller laptops */
@media (max-width: 1100px) {
  .home-hero-section {
    padding: 9rem 3rem 4rem;
    gap: 3rem;
  }

  .home-hero-section .text-section h1 {
    font-size: clamp(3.5rem, 6vw, 4.5rem);
    line-height: 1;
  }

  .home-hero-section .image-section .orange-background {
    width: 100%;
    height: auto;
  }

  .home-hero-section .daily-shows-container {
    left: -1.5rem;
  }

  .statistics-section {
    padding: 4rem 3rem;
  }

  .statistics-section .statistics-container {
    gap: 2rem;
  }

  .zones-section {
    padding: 5rem 3rem;
  }

  .zones-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 25rem));
    width: 100%;
  }

  .zones-container .zone {
    width: 100%;
    height: auto;
    min-height: 18.25rem;
  }
}

/* Tablets */
@media (max-width: 850px) {
  .home-hero-section {
    grid-template-columns: 1fr;
    padding: 7rem 2rem 4rem;
    text-align: center;
  }

  .home-hero-section .text-section {
    width: 100%;
    max-width: 42rem;
    position: relative;
    z-index: 2;
  }

  .home-hero-section .text-section .welcome-container {
    margin-inline: auto;
  }

  .home-hero-section .text-section h1 {
    font-size: clamp(3.25rem, 9vw, 4.5rem);
    line-height: 1.05;
  }

  .home-hero-section .text-section h1 span {
    display: inline;
  }

  .home-hero-section .text-section .intro-text {
    max-width: 38rem;
    margin: 1.5rem auto 0;
  }

  .home-hero-section .text-section .buttons-container {
    justify-content: center;
    margin-top: 2.5rem;
  }

  .home-hero-section .image-section {
    width: 100%;
    max-width: 37rem;
    justify-content: center;
    margin-top: 2rem;
  }

  .home-hero-section .image-section .orange-background {
    width: 90%;
    justify-content: center;
  }

  .home-hero-section .image-section .hero-image {
    display: block;
    width: 100%;
    height: auto;
  }

  .home-hero-section .daily-shows-container {
    left: -1rem;
    bottom: 1.5rem;
  }

  .home-hero-section .lion-icon {
    top: 3rem;
    left: 8%;
  }

  .home-hero-section .giraffe-icon {
    top: 6rem;
    right: 8%;
  }

  .home-hero-section .panda-icon {
    bottom: 2rem;
    left: 5%;
  }

  .home-hero-section .bird-icon {
    bottom: 1rem;
    right: 5%;
  }

  .home-hero-section .blue-blur,
  .home-hero-section .orange-blur {
    width: 20rem;
    height: 20rem;
  }

  .statistics-section {
    padding: 4rem 2rem;
  }

  .statistics-section .statistics-container {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 2.5rem 1.5rem;
  }

  .zones-section {
    padding: 4rem 2rem;
  }

  .zones-section .heading-section h2 {
    font-size: clamp(2.5rem, 7vw, 3rem);
  }
}

/* Mobile phones */
@media (max-width: 600px) {
  .home-hero-section {
    padding: 5rem 1.25rem 3rem;
    gap: 2rem;
  }

  .home-hero-section .text-section .welcome-container {
    padding: 0.45rem 0.75rem;
  }

  .home-hero-section .text-section .welcome-container p {
    font-size: 0.75rem;
    line-height: 1rem;
  }

  .home-hero-section .text-section h1 {
    margin-top: 1.5rem;
    font-size: clamp(2.75rem, 13vw, 3.75rem);
    line-height: 1.05;
  }

  .home-hero-section .text-section h1 span {
    display: block;
  }

  .home-hero-section .text-section .intro-text {
    margin-top: 1.25rem;
    font-size: 1rem;
    line-height: 1.65rem;
  }

  .home-hero-section .text-section .buttons-container {
    flex-direction: column;
    width: 100%;
    margin-top: 2rem;
  }

  .home-hero-section .text-section .buttons-container .plan-btn,
  .home-hero-section .text-section .buttons-container .explore-btn {
    width: 100%;
    min-height: 3.5rem;
    padding: 0.75rem 1.25rem;
    justify-content: center;
    font-size: 1rem;
  }

  .home-hero-section .image-section {
    margin-top: 1rem;
  }

  .home-hero-section .image-section .orange-background {
    width: 100%;
    border-radius: 1.5rem;
  }

  .home-hero-section .daily-shows-container {
    width: auto;
    min-width: 12.5rem;
    height: auto;
    left: 50%;
    bottom: -1.75rem;
    transform: translateX(-50%);
    padding: 0.75rem 1rem;
    border-radius: 0.875rem;
  }

  .home-hero-section .daily-shows-container .blue-dot {
    flex: 0 0 2.5rem;
    width: 2.5rem;
    height: 2.5rem;
  }

  .home-hero-section .daily-shows-container .small-text {
    font-size: 0.75rem;
  }

  .home-hero-section .daily-shows-container .starts-text {
    font-size: 0.875rem;
    white-space: nowrap;
  }

  /* Hide floating icons where they would overlap content */
  .home-hero-section .lion-icon,
  .home-hero-section .panda-icon,
  .home-hero-section .bird-icon,
  .home-hero-section .giraffe-icon {
    display: none;
  }

  .home-hero-section .blue-blur,
  .home-hero-section .orange-blur {
    width: 14rem;
    height: 14rem;
    filter: blur(45px);
  }

  .statistics-section {
    padding: 5rem 1.25rem 3rem;
  }

  .statistics-section .statistics-container {
    padding: 1.5rem 1rem;
    gap: 2rem 1rem;
    border-radius: 1.5rem;
  }

  .statistics-section .statistic img {
    width: 3rem;
    height: 3rem;
  }

  .statistics-section .statistic .figure {
    margin-top: 0.5rem;
    font-size: 1.25rem;
  }

  .statistics-section .statistic .desc {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
  }

  .zones-section {
    padding: 3.5rem 1.25rem;
  }

  .zones-section .heading-section {
    gap: 0.5rem;
  }

  .zones-section .heading-section h2 {
    margin-top: 0.5rem;
    font-size: 2.25rem;
    line-height: 1.15;
  }

  .zones-container {
    grid-template-columns: 1fr;
    margin-top: 2.5rem;
    gap: 1.5rem;
  }

  .zones-container .zone {
    min-height: 0;
    padding: 1.5rem;
    border-radius: 1.5rem;
  }

  .zone .top-section img {
    width: 3.5rem;
    height: 3.5rem;
  }

  .zone .circle {
    width: 8rem;
    height: 8rem;
    right: -3rem;
    top: -3rem;
  }

  .zone h3 {
    margin-top: 1.25rem;
    font-size: 1.35rem;
  }

  .zone p {
    white-space: normal;
  }
}

/* Very small phones */
@media (max-width: 380px) {
  .home-hero-section {
    padding-inline: 1rem;
  }

  .home-hero-section .text-section h1 {
    font-size: 2.5rem;
  }

  .statistics-section .statistics-container {
    grid-template-columns: 1fr;
  }
}

/* ========================================
   Responsive Animals page
======================================== */

/* General image protection */
.animals-hero-section img,
.animals-grid-section img,
.animals-button-cheetah-section img,
.protect-section img {
  max-width: 100%;
}

/* Ensure decorative hero circles sit behind the content */
.animals-hero-section .hero-text-container,
.animals-hero-section h1,
.animals-hero-section .heading-text,
.animals-hero-section .stats-container,
.animals-hero-section .animal-ribbon {
  position: relative;
  z-index: 2;
}

/* Keep cards at an even height */
.animals-grid-section .animal {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.animals-grid-section .animal .text-section {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.animals-grid-section .animal .text-section > a {
  margin-top: auto;
}

/* Control animal image dimensions */
.animals-grid-section .animal .image-section > img {
  width: auto;
  max-width: 75%;
  height: 9rem;
  object-fit: contain;
}

/* Large screens */
@media (min-width: 1400px) {
  .animals-grid-section,
  .animals-button-cheetah-section {
    padding-left: max(3rem, calc((100vw - 86rem) / 2));
    padding-right: max(3rem, calc((100vw - 86rem) / 2));
  }
}

/* Small laptops and tablets */
@media (max-width: 1100px) {
  .animals-hero-section {
    padding: 4.5rem 2rem 0;
  }

  .animals-hero-section h1 {
    font-size: 4rem;
    line-height: 1.15;
  }

  .animals-hero-section .heading-text {
    max-width: 40rem;
  }

  .animals-grid-section {
    padding: 4rem 2rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cheetah-container {
    gap: 3rem;
  }

  .cheetah-container > .text-section {
    flex: 1 1 30rem;
  }

  .cheetah-container > .image-section {
    flex: 0 1 16rem;
  }

  .cheetah-container .stats-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(8rem, 1fr));
    gap: 1rem;
  }

  .ticket-section {
    padding: 2rem 3rem;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2rem;
  }

  .ticket-section .main-section {
    max-width: none;
  }

  .ticket-advantages-container {
    grid-column: 1 / -1;
    justify-content: space-between;
    order: 3;
  }

  .ticket-advantages-container .advantage {
    max-width: none;
    justify-content: center;
  }
}

/* Tablets */
@media (max-width: 800px) {
  .animals-hero-section {
    padding: 4rem 1.5rem 0;
  }

  .animals-hero-section h1 {
    margin-top: 1.25rem;
    font-size: clamp(3rem, 9vw, 4rem);
    line-height: 1.1;
  }

  .animals-hero-section .heading-text {
    padding-inline: 1rem;
    font-size: 1.1rem;
    line-height: 1.75rem;
  }

  .animals-hero-section .stats-container {
    flex-wrap: wrap;
    gap: 0.75rem;
  }

  .animals-hero-section .animal-ribbon {
    margin-top: 2.5rem;
  }

  .animals-hero-section .blue-circle {
    width: 13rem;
    height: 13rem;
  }

  .animals-hero-section .orange-circle {
    width: 16rem;
    height: 16rem;
  }

  .animals-grid-section {
    padding: 3.5rem 1.5rem;
    gap: 1.5rem;
  }

  .animals-grid-section .animal .text-section .top-info {
    align-items: flex-start;
    gap: 1rem;
  }

  .animals-grid-section .animal .name {
    font-size: 1.3rem;
    line-height: 1.6rem;
  }

  .animals-button-cheetah-section {
    padding-inline: 1.5rem;
  }

  .cheetah-container {
    padding: 2rem;
    flex-direction: column;
    align-items: stretch;
  }

  .cheetah-container > .text-section {
    flex-basis: auto;
  }

  .cheetah-container > .image-section {
    flex-basis: auto;
    display: flex;
    justify-content: center;
  }

  .amara-container h2 {
    font-size: clamp(2.25rem, 7vw, 3rem);
    line-height: 1.15;
  }

  .cheetah-container .body-text {
    max-width: none;
  }

  .ticket-section {
    padding: 2rem;
    grid-template-columns: 1fr;
  }

  .ticket-section .learn-more-btn {
    width: fit-content;
    align-items: center;
  }

  .ticket-advantages-container {
    grid-column: auto;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }

  .ticket-advantages-container .advantage {
    justify-content: flex-start;
  }
}

/* Mobile phones */
@media (max-width: 600px) {
  .animals-hero-section {
    padding: 3.5rem 1rem 0;
  }

  .hero-text-container {
    padding: 0.375rem 0.75rem;
  }

  .hero-text-container p {
    font-size: 0.75rem;
  }

  .animals-hero-section h1 {
    font-size: clamp(2.5rem, 12vw, 3.25rem);
  }

  .animals-hero-section .heading-text {
    margin-top: 1rem;
    padding: 0;
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .animals-hero-section .stats-container {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  .animals-hero-section .animal-stat {
    width: 100%;
    justify-content: center;
  }

  .animals-hero-section .animal-ribbon {
    width: calc(100% + 2rem);
    max-width: none;
    margin-left: -1rem;
    height: 3.5rem;
  }

  .animals-grid-section {
    padding: 3rem 1rem;
    grid-template-columns: 1fr;
    gap: 1.25rem;
  }

  .animals-grid-section .animal {
    max-width: 28rem;
  }

  .animals-grid-section .animal .image-section {
    height: 12rem;
  }

  .animals-grid-section .animal .image-section > img {
    height: 8rem;
  }

  .animals-grid-section .animal .text-section {
    padding: 1.25rem;
  }

  .animals-grid-section .animal .text-section .top-info {
    flex-wrap: wrap;
  }

  .animals-grid-section .animal .name {
    font-size: 1.4rem;
  }

  .load-more-btn {
    width: 100%;
    height: auto;
    min-height: 3.5rem;
    padding: 0.75rem 1.25rem;
    justify-content: center;
    font-size: 1rem;
  }

  .animals-button-cheetah-section {
    padding-inline: 1rem;
  }

  .cheetah-container {
    margin-top: 3rem;
    padding: 1.5rem;
    gap: 2rem;
    border-radius: 1.5rem;
  }

  .cheetah-container .animal-month-container {
    font-size: 0.7rem;
    line-height: 1rem;
    letter-spacing: 0.06rem;
  }

  .amara-container {
    margin-top: 1.5rem;
  }

  .amara-container h2 {
    font-size: 2.25rem;
  }

  .amara-container .small-cheetah-img {
    height: 2.5rem;
    width: auto;
  }

  .cheetah-container .body-text {
    font-size: 1rem;
    line-height: 1.65rem;
  }

  .cheetah-container .stats-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cheetah-container .stat {
    padding: 0.875rem 0.5rem;
  }

  .cheetah-container .stat .figure {
    font-size: 1.35rem;
    line-height: 1.75rem;
    overflow-wrap: anywhere;
  }

  .cheetah-container .stat .desc {
    font-size: 0.75rem;
  }

  .cheetah-container .learn-more-amara-btn {
    width: 100%;
    padding: 0.875rem 1rem;
    justify-content: center;
    font-size: 1rem;
  }

  .cheetah-container .image-container {
    width: min(13rem, 100%);
    height: 13rem;
  }

  .protect-section {
    padding-top: 3rem;
  }

  .ticket-section {
    padding: 2rem 1rem;
    gap: 1.5rem;
  }

  .ticket-section .main-section {
    align-items: flex-start;
  }

  .ticket-section h4 {
    white-space: normal;
  }

  .ticket-advantages-container {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .ticket-advantages-container .advantage {
    max-width: none;
  }

  .ticket-section .learn-more-btn {
    width: 100%;
    align-items: center;
    text-align: center;
  }
}

/* Very small phones */
@media (max-width: 380px) {
  .animals-grid-section {
    padding-inline: 0.75rem;
  }

  .animals-grid-section .animal .text-section .top-info {
    flex-direction: column;
  }

  .cheetah-container .stats-container {
    grid-template-columns: 1fr;
  }

  .amara-container {
    align-items: flex-start;
  }

  .amara-container h2 {
    font-size: 2rem;
  }
}

/* ========================================
   Responsive Plan Your Visit page
======================================== */

/* General width protection */
.plan-visit-hero-section img,
.get-tickets-section img,
.opening-hours-section img,
.directions-section img,
.zoo-map-section img,
.visit-tips-section img,
.access-section img {
  max-width: 100%;
}

/* Keep the main sections from becoming excessively wide */
.ticket-options,
.opening-hours-container,
.directions-grid,
.zoo-map-section .large-zoo-map,
.visit-tips-section .tips-grid,
.access-section .access-grid {
  width: 100%;
  max-width: 86rem;
}

/* Keep ticket cards equal in height */
.ticket-option {
  display: flex;
  flex-direction: column;
}

.ticket-option .ticket-features {
  flex: 1;
}

.ticket-option .buy-now-btn {
  margin-top: 2rem;
}

/* Large tablets and smaller laptops */
@media (max-width: 1100px) {
  /* Hero */
  .plan-visit-hero-section {
    padding: 7rem 3rem 12rem;
  }

  .hero-content h1 {
    font-size: clamp(3.75rem, 7vw, 4.5rem);
    line-height: 1.08;
  }

  /* Ticket cards */
  .get-tickets-section {
    padding: 2rem 2rem 5rem;
  }

  .ticket-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-content: center;
  }

  .ticket-option {
    width: 100%;
  }

  .ticket-option.pride {
    grid-column: 1 / -1;
    width: min(100%, 34rem);
    justify-self: center;
  }

  .best-value-container {
    left: 50%;
    transform: translateX(-50%);
  }

  /* Opening hours */
  .opening-hours-section {
    padding: 5rem 2rem;
  }

  .opening-hours-container {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .opening-hours {
    width: 100%;
  }

  .opening-hours.holidays {
    grid-column: 1 / -1;
    width: min(100%, 32rem);
    justify-self: center;
  }

  .last-chance-container {
    grid-column: 1 / -1;
  }

  /* Directions */
  .directions-section {
    padding: 5rem 2rem;
  }

  .directions-grid {
    gap: 2rem;
    align-items: start;
  }

  .directions-grid .transport-section {
    margin-top: 0;
  }

  .transport-item {
    padding: 1.5rem;
  }

  /* Visit tips */
  .visit-tips-section {
    padding: 5rem 2rem;
  }

  .visit-tips-section .tips-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Accessibility */
  .access-section {
    padding: 5rem 2rem;
  }

  .access-section .access-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Tablets */
@media (max-width: 800px) {
  /* Hero */
  .plan-visit-hero-section {
    padding: 6rem 2rem 10rem;
  }

  .plan-visit-hero-section::after {
    bottom: -590px;
    width: 220%;
  }

  .hero-content {
    width: 100%;
  }

  .hero-content h1 {
    font-size: clamp(3rem, 10vw, 4rem);
  }

  .hero-content .heading-text {
    font-size: 1.1rem;
  }

  /* Common section headings */
  .get-tickets-section h2,
  .opening-hours-section h2,
  .directions-section h2,
  .zoo-map-section h2,
  .visit-tips-section h2,
  .access-section h2 {
    font-size: clamp(2.4rem, 7vw, 3rem);
    line-height: 1.2;
  }

  /* Tickets */
  .get-tickets-section {
    padding-top: 2rem;
  }

  .ticket-options {
    margin-top: 3rem;
  }

  /* Directions */
  .directions-grid {
    grid-template-columns: 1fr;
  }

  .directions-grid .map-side {
    max-width: 40rem;
    width: 100%;
    margin-inline: auto;
  }

  .transport-section .intro-transport-text {
    text-align: center;
  }

  /* Zoo map */
  .zoo-map-section {
    padding: 5rem 2rem;
  }

  .zoo-map-section .large-zoo-map {
    margin-top: 2rem;
  }

  .zoo-map-section .zones-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    width: 100%;
    max-width: 42rem;
  }

  .zoo-map-section .zone {
    width: 100%;
  }
}

/* Mobile phones */
@media (max-width: 600px) {
  /* Hero */
  .plan-visit-hero-section {
    padding: 4.5rem 1.25rem 8rem;
  }

  .plan-visit-hero-section::after {
    width: 300%;
    height: 650px;
    bottom: -585px;
  }

  .guide-container {
    padding: 0.45rem 0.75rem;
  }

  .guide-container p {
    font-size: 0.7rem;
    line-height: 1rem;
    letter-spacing: 0.06rem;
  }

  .hero-content {
    gap: 1.25rem;
  }

  .hero-content h1 {
    font-size: clamp(2.75rem, 13vw, 3.5rem);
    line-height: 1.05;
  }

  .hero-content h1 span {
    display: block;
  }

  .hero-content .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .hero-content .buttons-container {
    width: 100%;
    flex-direction: column;
  }

  .hero-content .buttons-container a {
    width: 100%;
    padding: 0.875rem 1.25rem;
  }

  /* Section headings */
  .get-tickets-section h2,
  .opening-hours-section h2,
  .directions-section h2,
  .zoo-map-section h2,
  .visit-tips-section h2,
  .access-section h2 {
    font-size: 2.25rem;
  }

  /* Tickets */
  .get-tickets-section {
    padding: 1rem 1rem 4rem;
  }

  .get-tickets-section .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .ticket-options {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .ticket-option,
  .ticket-option.pride {
    grid-column: auto;
    width: 100%;
    max-width: 28rem;
    justify-self: center;
    padding: 1.5rem;
  }

  .ticket-option .top-section img {
    width: auto;
  }

  .ticket-option h3 {
    margin-top: 0.75rem;
    font-size: 1.65rem;
  }

  .ticket-option .price {
    font-size: 3rem;
  }

  .ticket-features {
    margin-top: 1.5rem;
  }

  .ticket-feature p {
    font-size: 0.9rem;
  }

  .best-value-container {
    padding-inline: 1.25rem;
    white-space: nowrap;
  }

  /* Opening hours */
  .opening-hours-section {
    padding: 4rem 1rem;
  }

  .opening-hours-container {
    margin-top: 2.5rem;
    padding: 1rem;
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .opening-hours,
  .opening-hours.holidays {
    grid-column: auto;
    width: 100%;
    padding: 1.25rem;
  }

  .opening-hours .time {
    font-size: 1.65rem;
  }

  .last-chance-container {
    grid-column: auto;
    width: 100%;
    margin-top: 0.5rem;
    align-items: flex-start;
    padding: 0.75rem 1rem;
  }

  .last-chance-container img {
    flex-shrink: 0;
    margin-top: 0.15rem;
  }

  /* Directions */
  .directions-section {
    padding: 4rem 1rem;
  }

  .directions-grid {
    margin-top: 2.5rem;
  }

  .transport-section .intro-transport-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .transport-item {
    padding: 1.25rem 1rem;
    gap: 1rem;
  }

  .transport-item img {
    width: 2.75rem;
    height: 2.75rem;
    flex-shrink: 0;
  }

  .transport-item .text-section h4 {
    font-size: 1.1rem;
  }

  .transport-item .text-section p {
    font-size: 0.9rem;
    line-height: 1.4rem;
  }

  /* Zoo map */
  .zoo-map-section {
    padding: 4rem 1rem;
  }

  .zoo-map-section .map-desc-text {
    margin-top: 1rem;
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .zoo-map-section .large-zoo-map {
    margin-top: 2rem;
    min-height: 14rem;
    object-fit: cover;
    border-radius: 1rem;
  }

  .zoo-map-section .zones-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
  }

  .zoo-map-section .zone {
    padding: 0.65rem 0.75rem;
  }

  .zoo-map-section .zone p {
    font-size: 0.75rem;
    line-height: 1.25rem;
  }

  /* Visit tips */
  .visit-tips-section {
    padding: 4rem 1rem;
  }

  .visit-tips-section .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .visit-tips-section .tips-grid {
    margin-top: 2.5rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }

  .visit-tips-section .tip {
    padding: 1.25rem 1rem;
  }

  .visit-tips-section .tip img {
    height: 2.5rem;
    width: auto;
  }

  .visit-tips-section .tip h3 {
    font-size: 1rem;
  }

  .visit-tips-section .tip .body-text {
    font-size: 0.8rem;
    white-space: normal;
  }

  /* Accessibility */
  .access-section {
    padding: 4rem 1rem;
  }

  .access-section .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .access-section .access-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 1rem;
    max-width: 28rem;
  }

  .access-grid .access-item {
    padding: 1.5rem;
  }

  .access-grid .access-item .body-text {
    white-space: normal;
  }

  .access-section .download-access-btn {
    width: 100%;
    max-width: 22rem;
    height: auto;
    min-height: 3.75rem;
    padding: 0.875rem 1rem;
    font-size: 1rem;
  }
}

/* Very small phones */
@media (max-width: 380px) {
  .hero-content h1 {
    font-size: 2.5rem;
  }

  .ticket-option {
    padding: 1.25rem;
  }

  .ticket-option .price {
    font-size: 2.75rem;
  }

  .transport-item {
    flex-direction: column;
  }

  .zoo-map-section .zones-list,
  .visit-tips-section .tips-grid {
    grid-template-columns: 1fr;
  }

  .visit-tips-section .tip {
    max-width: 20rem;
    width: 100%;
    justify-self: center;
  }
}

/* ========================================
   Responsive Events page
======================================== */

.events-hero-section img,
.after-dark-section img,
.today-shows-section img,
.annual-events-section img,
.birthday-section img,
.group-bookings-section img {
  max-width: 100%;
}

.events-hero-section,
.after-dark-container,
.today-live-grid,
.annual-events-grid,
.birthday-section .birthday-container,
.group-bookings-section {
  width: 100%;
}

/* Keep cards equal in height */
.today-live-grid .today,
.annual-events-grid .annual-event {
  height: 100%;
}

.today-live-grid .today .reserve-btn,
.annual-event .learn-more-btn {
  margin-top: auto;
}

/* Larger desktop screens */
@media (min-width: 1400px) {
  .events-hero-section,
  .after-dark-section,
  .today-shows-section,
  .annual-events-section,
  .birthday-section,
  .group-bookings-section {
    padding-left: max(3rem, calc((100vw - 86rem) / 2));
    padding-right: max(3rem, calc((100vw - 86rem) / 2));
  }

  .after-dark-section {
    margin-left: 0;
    margin-right: 0;
  }
}

/* Small laptops */
@media (max-width: 1100px) {
  /* Events hero */
  .events-hero-section {
    padding: 5rem 2.5rem;
    flex-wrap: nowrap;
  }

  .events-hero-section .text-section,
  .events-hero-section .image-section {
    flex: 1;
  }

  .events-hero-section h1 {
    font-size: clamp(3.5rem, 7vw, 4.5rem);
    line-height: 1.05;
  }

  .events-hero-section .image-section {
    display: flex;
    justify-content: center;
  }

  /* After dark */
  .after-dark-section {
    margin: 4rem 2rem;
  }

  .after-dark-container > .text-section {
    flex: 1;
  }

  .after-dark-container > .image-section {
    flex: 0 1 18rem;
  }

  /* Annual events */
  .annual-events-section {
    padding: 5rem 2rem;
  }

  .annual-events-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  /* Birthday */
  .birthday-section {
    padding: 5rem 2rem;
  }

  .birthday-section .birthday-container {
    grid-template-columns: 2fr 1fr;
    gap: 2rem;
  }

  /* Group bookings */
  .group-bookings-section {
    padding: 3rem 2rem;
    grid-template-columns: minmax(0, 2fr) minmax(15rem, 1fr);
  }
}

/* Tablets */
@media (max-width: 800px) {
  /* Events hero */
  .events-hero-section {
    padding: 4.5rem 2rem;
    flex-direction: column;
    text-align: center;
  }

  .events-hero-section .text-section {
    max-width: 42rem;
  }

  .events-hero-section .live-container {
    margin-inline: auto;
  }

  .events-hero-section h1 {
    font-size: clamp(3.25rem, 10vw, 4rem);
  }

  .events-hero-section .heading-text {
    max-width: 38rem;
    margin-inline: auto;
    margin-top: 1.5rem;
  }

  .events-hero-section .buttons-container {
    justify-content: center;
  }

  .events-hero-section .image-section img {
    max-width: 18rem;
  }

  /* After dark */
  .after-dark-container {
    flex-direction: column;
    padding: 2rem;
  }

  .after-dark-container > .image-section {
    flex-basis: auto;
    order: -1;
  }

  .after-dark-container .after-dark-hero {
    max-width: 15rem;
  }

  .after-dark-container .special-container {
    margin-inline: auto;
  }

  .after-dark-container .text-section {
    text-align: center;
  }

  .after-dark-container .body-text {
    margin-inline: auto;
  }

  .after-dark-container .event-features-container,
  .after-dark-container .buttons-container {
    justify-content: center;
  }

  /* Today's shows */
  .today-shows-section {
    padding: 4rem 2rem;
  }

  /* Annual events */
  .annual-events-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Birthday */
  .birthday-section .birthday-container {
    grid-template-columns: 1fr;
  }

  .birthday-container .left-side {
    text-align: center;
  }

  .birthday-container .cake-hero {
    margin-inline: auto;
  }

  .birthday-container h2,
  .birthday-container .body-text {
    margin-left: auto;
    margin-right: auto;
  }

  .birthday-container .enquire-btn {
    margin-inline: auto;
    margin-top: 2rem;
  }

  .birthday-container > .birthday-hero {
    width: min(100%, 22rem);
    justify-self: center;
  }

  /* Group bookings */
  .group-bookings-section {
    grid-template-columns: 1fr;
    padding: 4rem 2rem;
  }

  .group-bookings-section > .left-side {
    text-align: center;
  }

  .group-bookings-section .school-container {
    margin-inline: auto;
  }

  .group-bookings-section .heading-text {
    margin-left: auto;
    margin-right: auto;
  }

  .group-bookings-section .learning-item {
    text-align: left;
  }

  .group-bookings-section .buttons-container {
    justify-content: center;
  }

  .group-bookings-section .stats-section {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .group-bookings-section .stats-section .visits-container,
  .group-bookings-section .call-container {
    min-height: 100%;
  }

  .group-bookings-section .stats-section .middle-row {
    grid-column: 1 / -1;
  }
}

/* Mobile phones */
@media (max-width: 600px) {
  /* Events hero */
  .events-hero-section {
    padding: 4rem 1rem;
    gap: 2.5rem;
  }

  .events-hero-section .live-container {
    padding: 0.45rem 0.75rem;
  }

  .events-hero-section .live-container p {
    font-size: 0.7rem;
    line-height: 1rem;
  }

  .events-hero-section h1 {
    font-size: clamp(2.75rem, 13vw, 3.5rem);
  }

  .events-hero-section .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .events-hero-section .buttons-container {
    width: 100%;
    flex-direction: column;
  }

  .events-hero-section .buttons-container .today,
  .events-hero-section .buttons-container .all-events {
    width: 100%;
    padding: 0.875rem 1.25rem;
    font-size: 1rem;
  }

  .events-hero-section .image-section img {
    max-width: 14rem;
  }

  /* After dark event */
  .after-dark-section {
    margin: 3rem 1rem;
  }

  .after-dark-container {
    padding: 1.5rem;
    gap: 1.5rem;
    border-radius: 1.5rem;
  }

  .after-dark-container .after-dark-hero {
    max-width: 12rem;
  }

  .after-dark-container h2 {
    margin-top: 1.5rem;
    font-size: 2.25rem;
    line-height: 1.15;
  }

  .after-dark-container .body-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .after-dark-container .event-features-container {
    flex-direction: column;
    align-items: stretch;
  }

  .after-dark-container .event-feature {
    width: 100%;
    justify-content: center;
    font-size: 0.875rem;
  }

  .after-dark-container .buttons-container {
    width: 100%;
    flex-direction: column;
  }

  .after-dark-container .buttons-container .book-now-btn,
  .after-dark-container .buttons-container .learn-more-btn {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 1rem;
  }

  /* Shared section headings */
  .today-shows-section h2,
  .annual-events-section h2,
  .birthday-container h2,
  .group-bookings-section h2 {
    font-size: 2.25rem;
    line-height: 1.15;
  }

  /* Today's shows */
  .today-shows-section {
    padding: 3.5rem 1rem;
  }

  .today-shows-section .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .today-shows-section .today-live-container {
    width: 100%;
    justify-content: center;
    padding: 0.75rem 1rem;
  }

  .today-live-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .today-live-grid .today {
    padding: 1.25rem;
  }

  .today-live-grid .today .top-section {
    align-items: flex-start;
    gap: 1rem;
  }

  .today .top-section .right-side {
    min-width: 0;
  }

  .today .location-container {
    max-width: 100%;
    text-align: left;
  }

  .today h3 {
    margin-top: 1.5rem;
    font-size: 1.35rem;
  }

  .today .reserve-btn {
    width: 100%;
    margin-top: 1.5rem;
  }

  /* Annual events */
  .annual-events-section {
    padding: 4rem 1rem;
  }

  .annual-events-section .heading-text {
    margin-top: 0.75rem;
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .annual-events-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 1rem;
    max-width: 28rem;
    width: 100%;
  }

  .annual-event {
    padding: 1.5rem;
  }

  .annual-event .body-text {
    white-space: normal;
  }

  /* Birthday */
  .birthday-section {
    padding: 4rem 1rem;
  }

  .birthday-section .birthday-container {
    padding: 1.5rem;
    border-radius: 1.5rem;
  }

  .birthday-container .body-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .birthday-container .celebrate-items-grid {
    grid-template-columns: 1fr;
  }

  .birthday-container .celebrate-items-grid .celebrate-item {
    text-align: left;
  }

  .birthday-container .enquire-btn {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 1rem;
  }

  /* School and group bookings */
  .group-bookings-section {
    padding: 3.5rem 1rem;
  }

  .group-bookings-section .school-container {
    padding: 0.45rem 0.75rem;
  }

  .group-bookings-section .school-container p {
    font-size: 0.7rem;
    line-height: 1rem;
  }

  .group-bookings-section .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .group-bookings-section .learning-item {
    padding: 1rem;
    align-items: flex-start;
  }

  .group-bookings-section .learning-item img {
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
  }

  .group-bookings-section .learning-item h4 {
    font-size: 1rem;
    line-height: 1.4rem;
  }

  .group-bookings-section .buttons-container {
    width: 100%;
    flex-direction: column;
  }

  .group-bookings-section .book-group-btn,
  .group-bookings-section .download-brochure-btn {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 1rem;
  }

  .group-bookings-section .stats-section {
    display: flex;
    flex-direction: column;
  }

  .group-bookings-section .stats-section .middle-row {
    grid-column: auto;
  }

  .group-bookings-section .call-container {
    text-align: center;
  }

  .group-bookings-section .stats-section .call-times {
    text-align: center;
  }
}

/* Very small phones */
@media (max-width: 380px) {
  .events-hero-section h1 {
    font-size: 2.5rem;
  }

  .today-live-grid .today .top-section {
    flex-direction: column;
  }

  .today .top-section .right-side {
    width: 100%;
    align-items: flex-start;
  }

  .birthday-container .celebrate-items-grid {
    gap: 0.75rem;
  }

  .group-bookings-section .learning-item {
    flex-direction: column;
  }

  .group-bookings-section .stats-section .middle-row {
    grid-template-columns: 1fr;
  }
}

/* ========================================
   Responsive Adopt an Animal page
======================================== */

.adopt-hero-section img,
.how-it-works-section img,
.choose-package-section img,
.meet-animals-section img,
.your-impact-section img,
.stories-section img,
.gift-section img {
  max-width: 100%;
}

/* Keep hero content above the decorative circles */
.adopt-hero-section
  > *:not(.yellow-circle):not(.orange-circle):not(.blue-circle) {
  position: relative;
  z-index: 2;
}

/* Set useful maximum widths */
.supporters-grid,
.how-it-works-section .packages-grid,
.support-packages-grid,
.meet-animals-grid,
.your-impact-section .impact-grid,
.stories-grid {
  width: 100%;
  max-width: 86rem;
}

/* Equal-height package cards */
.support-package {
  display: flex;
  flex-direction: column;
}

.support-package .package-features {
  flex: 1;
}

.support-package .adopt-now-btn {
  margin-top: 1.5rem;
}

/* Keep the gift content above its decorative lines */
.gift-section .text-section,
.gift-section .image-section {
  position: relative;
  z-index: 3;
}

/* Large desktops */
@media (min-width: 1400px) {
  .adopt-hero-section,
  .how-it-works-section,
  .choose-package-section,
  .meet-animals-section,
  .stories-section {
    padding-left: max(3rem, calc((100vw - 86rem) / 2));
    padding-right: max(3rem, calc((100vw - 86rem) / 2));
  }

  .your-impact-section,
  .gift-section {
    max-width: 86rem;
    margin-left: auto;
    margin-right: auto;
  }
}

/* Small laptops */
@media (max-width: 1100px) {
  /* Hero */
  .adopt-hero-section {
    padding: 5rem 2rem;
  }

  .adopt-hero-section .heading-one,
  .adopt-hero-section .heading-two {
    font-size: clamp(3.75rem, 7vw, 4.5rem);
    line-height: 1.08;
  }

  .adopt-stats-container {
    flex-wrap: wrap;
  }

  .supporters-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .supporters-grid .supporter {
    justify-content: center;
  }

  .adopt-hero-section .yellow-circle {
    right: -5rem;
  }

  .adopt-hero-section .orange-circle {
    right: 20%;
  }

  /* How it works */
  .how-it-works-section {
    padding: 5rem 2rem;
  }

  .how-it-works-section .packages-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Adoption packages */
  .choose-package-section {
    padding: 5rem 2rem;
  }

  .support-packages-grid {
    gap: 1.25rem;
  }

  .support-package {
    padding: 1.5rem;
  }

  .support-package.guardian-package {
    transform: scale(1.03);
  }

  .support-package .package-name {
    font-size: 1.6rem;
  }

  .support-package .package-feature p {
    font-size: 0.9rem;
  }

  /* Animals */
  .meet-animals-section {
    padding: 5rem 2rem;
  }

  /* Impact */
  .your-impact-section {
    padding: 5rem 2rem;
  }

  .your-impact-section .impact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Stories */
  .stories-section {
    padding: 5rem 2rem;
  }

  .stories-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .stories-grid .story:last-child {
    grid-column: 1 / -1;
    width: min(100%, 32rem);
    justify-self: center;
  }

  /* Gift */
  .gift-section {
    margin: 4rem 2rem 2rem;
    padding: 4rem 3rem;
    gap: 2rem;
  }
}

/* Tablets */
@media (max-width: 800px) {
  /* Hero */
  .adopt-hero-section {
    padding: 4.5rem 1.5rem;
  }

  .adopt-hero-section .heading-one,
  .adopt-hero-section .heading-two {
    font-size: clamp(3.25rem, 10vw, 4rem);
  }

  .adopt-hero-section .heading-text {
    font-size: 1.1rem;
    line-height: 1.75rem;
  }

  .supporters-grid {
    gap: 1rem;
  }

  /* Shared headings */
  .how-it-works-section h2,
  .choose-package-section h2,
  .meet-animals-section h2,
  .your-impact-section h2,
  .stories-section h2,
  .gift-section h2 {
    font-size: clamp(2.5rem, 7vw, 3.25rem);
    line-height: 1.2;
  }

  /* Adoption packages */
  .support-packages-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .support-package.guardian-package {
    transform: none;
  }

  .support-package.champion-package {
    grid-column: 1 / -1;
    width: min(100%, 32rem);
    justify-self: center;
  }

  /* Animals */
  .meet-animals-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Gift */
  .gift-section {
    padding: 3rem 2rem;
    flex-direction: column;
    text-align: center;
  }

  .gift-section .heading-container {
    justify-content: center;
  }

  .gift-section .text-section {
    max-width: 40rem;
  }

  .gift-section .button-container {
    justify-content: center;
  }

  .gift-section .image-section {
    display: flex;
    justify-content: center;
  }

  .gift-section .wild-gift-hero-image {
    width: 13rem;
  }

  .gift-section .vertical-line {
    display: none;
  }
}

/* Mobile phones */
@media (max-width: 600px) {
  /* Adopt hero */
  .adopt-hero-section {
    padding: 4rem 1rem;
  }

  .adopt-hero-section .conservation-section {
    padding: 0.45rem 0.75rem;
  }

  .adopt-hero-section .conservation-section p {
    font-size: 0.7rem;
    line-height: 1rem;
    letter-spacing: 0.055rem;
  }

  .adopt-hero-section .heading-one {
    margin-top: 2rem;
  }

  .adopt-hero-section .heading-one,
  .adopt-hero-section .heading-two {
    font-size: clamp(2.65rem, 13vw, 3.5rem);
    line-height: 1.05;
    letter-spacing: -0.03rem;
  }

  .adopt-hero-section .heading-two {
    margin-top: 0.5rem;
  }

  .adopt-hero-section .heading-text {
    margin-top: 1.5rem;
    font-size: 1rem;
    line-height: 1.6rem;
  }

  .adopt-hero-section .buttons-container {
    width: 100%;
    flex-direction: column;
    margin-top: 2rem;
  }

  .adopt-hero-section .choose-animal-btn,
  .adopt-hero-section .how-it-works-btn {
    width: 100%;
    justify-content: center;
    padding: 0.875rem 1rem;
    font-size: 1rem;
  }

  .adopt-stats-container {
    width: 100%;
    margin-top: 2.5rem;
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
  }

  .adopt-stat {
    width: 100%;
    justify-content: center;
    padding: 0.65rem 1rem;
  }

  .supporters-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
  }

  .supporters-grid .supporter {
    padding: 1.25rem;
  }

  .supporters-grid .supporter img {
    height: 3.5rem;
    width: auto;
  }

  .adopt-hero-section .yellow-circle,
  .adopt-hero-section .orange-circle,
  .adopt-hero-section .blue-circle {
    width: 12rem;
    height: 12rem;
  }

  /* Shared headings and text */
  .how-it-works-section h2,
  .choose-package-section h2,
  .meet-animals-section h2,
  .your-impact-section h2,
  .stories-section h2,
  .gift-section h2 {
    font-size: 2.25rem;
    line-height: 1.15;
  }

  .how-it-works-section .heading-text,
  .choose-package-section .heading-text,
  .meet-animals-section .heading-text,
  .your-impact-section .heading-text {
    font-size: 1rem;
    line-height: 1.6rem;
  }

  /* How it works */
  .how-it-works-section {
    padding: 4rem 1rem;
  }

  .how-it-works-section .packages-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .packages-grid .package {
    padding: 1.5rem;
  }

  .packages-grid .body-text {
    white-space: normal;
  }

  /* Support packages */
  .choose-package-section {
    padding: 4rem 1rem;
  }

  .support-packages-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .support-package,
  .support-package.champion-package {
    grid-column: auto;
    width: 100%;
    max-width: 28rem;
    justify-self: center;
  }

  .support-package .package-name {
    font-size: 1.5rem;
  }

  .support-package .package-cost .price {
    font-size: 2.75rem;
  }

  .support-package .package-feature {
    align-items: flex-start;
  }

  .support-package .package-feature img {
    flex-shrink: 0;
  }

  .support-package .adopt-now-btn {
    font-size: 1rem;
    padding: 0.875rem;
  }

  .most-popular-container {
    width: auto;
    padding-inline: 0.75rem;
  }

  /* Meet the animals */
  .meet-animals-section {
    padding: 4rem 1rem;
  }

  .meet-animals-section h2 {
    white-space: normal;
  }

  .meet-animals-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 1rem;
    max-width: 28rem;
  }

  .meet-animal {
    padding: 1.5rem;
  }

  .meet-animal .row-container {
    flex-wrap: wrap;
    justify-content: center;
  }

  /* Impact */
  .your-impact-section {
    margin: 3rem 1rem;
    padding: 4rem 1rem;
  }

  .your-impact-section .impact-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    width: 100%;
    max-width: 28rem;
  }

  .impact-item {
    padding: 1.5rem;
  }

  .impact-item img {
    height: 3rem;
    width: auto;
  }

  .impact-item .figure {
    font-size: 2.5rem;
    line-height: 2.75rem;
  }

  /* Stories */
  .stories-section {
    padding: 4rem 1rem;
  }

  .stories-grid {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 1rem;
    max-width: 28rem;
  }

  .stories-grid .story,
  .stories-grid .story:last-child {
    grid-column: auto;
    width: 100%;
    padding: 1.5rem;
  }

  .stories-grid .story .review {
    font-size: 1rem;
    line-height: 1.65rem;
    white-space: normal;
  }

  /* Gift section */
  .gift-section {
    margin: 3rem 1rem 1rem;
    padding: 3rem 1.25rem;
    border-top-width: 1rem;
  }

  .gift-section .heading-container {
    flex-direction: column;
  }

  .gift-section .heading-container img {
    width: 3rem;
  }

  .gift-section .heading-container p {
    font-size: 0.75rem;
  }

  .gift-section .body-text {
    font-size: 1rem;
    line-height: 1.6rem;
    white-space: normal;
  }

  .gift-section .button-container {
    width: 100%;
    flex-direction: column;
    gap: 0.75rem;
  }

  .gift-section .adopt-now-btn {
    width: 100%;
    padding: 0.875rem 1rem;
    font-size: 1rem;
  }

  .gift-section .instant-delivery {
    margin-top: 0;
  }

  .gift-section .wild-gift-hero-image {
    width: 11rem;
  }

  .gift-section .horizontal-line,
  .gift-section .central-circle {
    opacity: 0.5;
  }
}

/* Very small phones */
@media (max-width: 380px) {
  .adopt-hero-section .heading-one,
  .adopt-hero-section .heading-two {
    font-size: 2.4rem;
  }

  .support-package {
    padding: 1.25rem;
  }

  .meet-animal .row-container {
    flex-direction: column;
    width: 100%;
  }

  .meet-animal .age-container,
  .meet-animal .diet-container {
    width: 100%;
  }

  .stories-grid .story .supporter-details {
    align-items: flex-start;
  }
}

/* ========================================
   Responsive header
======================================== */

.site-header {
  position: relative;
  z-index: 1000;
  display: flex;
  min-height: 5rem;
  padding: 1rem 5rem;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  border-bottom: 1px solid rgba(249, 115, 22, 0.1);
  background: rgba(254, 249, 231, 0.95);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.header-logo-link {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.site-header .logo {
  display: block;
  width: 12rem;
  max-width: 100%;
  height: auto;
}

.site-header .header-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
}

.site-header .header-nav > a:not(.mobile-buy-tickets-btn) {
  position: relative;
  color: #4b5563;
  font-family: Nunito, sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.5rem;
  letter-spacing: 0.01075rem;
  transition:
    color 0.2s ease,
    transform 0.2s ease;
}

.site-header .header-nav > a:not(.mobile-buy-tickets-btn):hover {
  color: #f97316;
}

.site-header .header-nav > a.active:not(.mobile-buy-tickets-btn) {
  color: #f97316;
}

.site-header .header-nav > a.active:not(.mobile-buy-tickets-btn)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -0.35rem;
  height: 0.125rem;
  border-radius: 1rem;
  background: #f97316;
}

.site-header .buy-tickets-btn,
.site-header .mobile-buy-tickets-btn {
  padding: 0.625rem 1.5rem;
  border-radius: 624.9375rem;
  background: #f97316;
  color: #fff;
  text-align: center;
  font-family: Fredoka, sans-serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.5rem;
  transition:
    background-color 0.2s ease,
    transform 0.2s ease;
}

.site-header .buy-tickets-btn {
  flex-shrink: 0;
}

.site-header .buy-tickets-btn:hover,
.site-header .mobile-buy-tickets-btn:hover {
  background: #ea580c;
  transform: translateY(-1px);
}

/* Hidden on desktop */
.site-header .mobile-buy-tickets-btn,
.site-header .hamburger {
  display: none;
}

/* Hamburger button */
.site-header .hamburger {
  width: 2.75rem;
  height: 2.75rem;
  padding: 0.6rem;
  border: 0;
  border-radius: 0.75rem;
  background: transparent;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.3rem;
}

.site-header .hamburger span {
  display: block;
  width: 1.5rem;
  height: 0.15rem;
  border-radius: 1rem;
  background: #1a4a2e;
  transform-origin: center;
  transition:
    transform 0.25s ease,
    opacity 0.2s ease;
}

/* Hamburger changes to an X */
.site-header .hamburger.active span:nth-child(1) {
  transform: translateY(0.45rem) rotate(45deg);
}

.site-header .hamburger.active span:nth-child(2) {
  opacity: 0;
}

.site-header .hamburger.active span:nth-child(3) {
  transform: translateY(-0.45rem) rotate(-45deg);
}

/* Slightly smaller desktop spacing */
@media (max-width: 1050px) {
  .site-header {
    padding-inline: 2rem;
  }

  .site-header .header-nav {
    gap: 1.25rem;
  }

  .site-header .logo {
    width: 10rem;
  }
}

/* Mobile navigation */
@media (max-width: 850px) {
  .site-header {
    min-height: 4.75rem;
    padding: 0.75rem 1.5rem;
    gap: 1rem;
  }

  .site-header .logo {
    width: 9rem;
  }

  .site-header .hamburger {
    display: flex;
    margin-left: auto;
    position: relative;
    z-index: 1002;
  }

  .site-header > .buy-tickets-btn {
    display: none;
  }

  .site-header .header-nav {
    position: absolute;
    z-index: 1001;
    top: 100%;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    max-height: 0;
    padding: 0 1.5rem;
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    background: #fef9e7;
    border-bottom: 1px solid rgba(249, 115, 22, 0.15);
    box-shadow: 0 1.25rem 2.5rem rgba(0, 0, 0, 0.12);
    transform: translateY(-0.75rem);
    transition:
      max-height 0.35s ease,
      padding 0.35s ease,
      opacity 0.25s ease,
      transform 0.35s ease,
      visibility 0.35s ease;
  }

  .site-header .header-nav.active {
    max-height: 35rem;
    padding-top: 1rem;
    padding-bottom: 1.5rem;
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
  }

  .site-header .header-nav > a:not(.mobile-buy-tickets-btn) {
    width: 100%;
    padding: 1rem 0.25rem;
    border-bottom: 1px solid rgba(26, 74, 46, 0.08);
    font-size: 1rem;
  }

  .site-header .header-nav > a.active:not(.mobile-buy-tickets-btn) {
    padding-left: 0.75rem;
    color: #f97316;
    border-left: 0.2rem solid #f97316;
  }

  .site-header .header-nav > a.active:not(.mobile-buy-tickets-btn)::after {
    display: none;
  }

  .site-header .mobile-buy-tickets-btn {
    display: block;
    width: 100%;
    margin-top: 1rem;
    padding: 0.875rem 1rem;
  }

  body.menu-open {
    overflow: hidden;
  }
}

/* Very small phones */
@media (max-width: 420px) {
  .site-header {
    padding-inline: 1rem;
  }

  .site-header .logo {
    width: 8rem;
  }

  .site-header .header-nav {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

/* ========================================
   Responsive footer
======================================== */

footer > div {
  min-width: 0;
}

footer .section-one .body-text {
  margin-top: 1.25rem;
  max-width: 18rem;
}

footer .newsletter-container .input-container input {
  width: 100%;
  min-width: 0;
  outline: none;
}

footer .newsletter-container .input-container input::placeholder {
  color: rgba(255, 255, 255, 0.55);
}

footer .newsletter-container .input-container input:focus {
  border-color: #f97316;
}

footer .newsletter-container .go-btn {
  flex-shrink: 0;
  border: 0;
  cursor: pointer;
}

footer .links a,
footer .sm-item,
footer .go-btn {
  transition:
    color 0.2s ease,
    background-color 0.2s ease,
    transform 0.2s ease;
}

footer .links a:hover {
  color: #f97316;
}

footer .sm-container .sm-item:hover {
  color: #fff;
  background: #f97316;
  transform: translateY(-2px);
}

/* Smaller laptops */
@media (max-width: 1100px) {
  footer {
    padding: 4rem 3rem 2.5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3rem 4rem;
  }

  footer .section-one .body-text {
    max-width: 22rem;
  }

  footer .newsletter-container {
    max-width: 24rem;
  }
}

/* Tablets */
@media (max-width: 750px) {
  footer {
    padding: 3.5rem 2rem 2rem;
    gap: 2.5rem;
    border-radius: 2rem 2rem 0 0;
  }

  .footer-logo {
    width: 10rem;
  }

  footer .section-one .body-text {
    margin-top: 1rem;
  }

  footer .links {
    margin-top: 1rem;
  }

  footer .sm-container {
    margin-top: 1rem;
  }
}

/* Mobile phones */
@media (max-width: 550px) {
  footer {
    padding: 3rem 1.25rem 2rem;
    grid-template-columns: 1fr;
    gap: 2.25rem;
    border-radius: 1.5rem 1.5rem 0 0;
  }

  footer .section-one,
  footer .section-two,
  footer .section-three,
  footer .section-four {
    width: 100%;
  }

  .footer-logo {
    width: 9rem;
  }

  footer .section-one .body-text {
    max-width: 22rem;
    white-space: normal;
  }

  footer .section-one .location {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    line-height: 1.4rem;
  }

  footer .section-one .location i {
    margin-top: 0.15rem;
    flex-shrink: 0;
  }

  footer .section-two,
  footer .section-three,
  footer .section-four {
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
  }

  footer .links {
    gap: 0;
  }

  footer .links li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  footer .links a {
    display: block;
    width: 100%;
    padding: 0.75rem 0;
  }

  footer .sm-container .sm-item {
    width: 2.75rem;
    height: 2.75rem;
  }

  footer .newsletter-container {
    width: 100%;
    max-width: none;
  }

  footer .newsletter-container .input-container {
    width: 100%;
  }

  footer .newsletter-container .input-container input {
    min-height: 2.75rem;
  }

  footer .newsletter-container .go-btn {
    min-height: 2.75rem;
    padding-inline: 1.25rem;
  }
}

/* Very small phones */
@media (max-width: 350px) {
  footer {
    padding-inline: 1rem;
  }

  footer .newsletter-container .input-container {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }

  footer .newsletter-container .go-btn {
    width: 100%;
  }
}