/* Custom styles lifted from the legacy inline <style> blocks (header.php call
   button + hero.php carousel) so the Next port renders identically. */

.call-button {
  position: fixed;
  bottom: 80px;
  right: 15px;
  background-color: #7c3aed;
  color: #fff;
  padding: 10px;
  border-radius: 100%;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2);
  z-index: 1000;
  font-size: 20px;
  text-align: center;
  transition: background-color 0.3s ease;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.call-button:hover { background-color: #6d28d9; color: #fff; }

/* ── Hero carousel (from hero.php) ─────────────────────────────────────────── */
.custom-hero { margin-top: 0 !important; padding-top: 0 !important; }
.custom-hero,
.aastha-hero-carousel,
.aastha-hero-inner,
.custom-carousel-item {
  height: 70vh;
  position: relative;
  overflow: hidden;
}
.carousel-image { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.custom-carousel-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.5); z-index: 1; }
.custom-carousel-container {
  position: absolute; inset: 0; z-index: 2;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; color: #fff; padding: 40px 60px;
}
.custom-carousel-container h2 {
  font-size: 3rem; font-weight: 700; margin-bottom: 15px; color: #fff !important;
  line-height: 1.2; text-shadow: 2px 2px 10px rgba(0,0,0,0.8);
}
.custom-carousel-container p {
  font-size: 1.4rem; max-width: 800px; margin-bottom: 25px; line-height: 1.5;
  color: #fff !important; text-shadow: 1px 1px 6px rgba(0,0,0,0.7);
}
.btn-get-started {
  display: inline-block; padding: 14px 32px; background: #ff5100; color: #fff;
  font-size: 15px; font-weight: 600; text-decoration: none; border-radius: 4px;
  letter-spacing: 1px; transition: all 0.3s ease;
}
.btn-get-started:hover { background: #f70202; transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,0.4); }

/* Carousel arrow controls */
.aastha-hero-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  width: 44px; height: 44px; border: none; border-radius: 50%;
  background: rgba(0,0,0,0.35); color: #fff; font-size: 22px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; opacity: 0.8;
}
.aastha-hero-arrow:hover { opacity: 1; }
.aastha-hero-arrow.prev { left: 16px; }
.aastha-hero-arrow.next { right: 16px; }
.aastha-hero-dots {
  position: absolute; bottom: 18px; left: 0; right: 0; z-index: 3;
  display: flex; gap: 8px; justify-content: center;
}
.aastha-hero-dots button {
  width: 10px; height: 10px; border-radius: 50%; border: none; padding: 0;
  background: rgba(255,255,255,0.5); cursor: pointer;
}
.aastha-hero-dots button.active { background: #fff; }

@media (max-width: 1024px) {
  .custom-hero, .aastha-hero-carousel, .aastha-hero-inner, .custom-carousel-item { height: 75vh; }
  .custom-carousel-container h2 { font-size: 2.4rem; }
  .custom-carousel-container p { font-size: 1.2rem; }
}
@media (max-width: 768px) {
  .custom-hero, .aastha-hero-carousel, .aastha-hero-inner, .custom-carousel-item { height: auto; }
  .carousel-image { height: auto; max-height: 60vh; width: 100%; object-fit: contain; background-color: #000; }
  .custom-carousel-container { padding: 16px; }
  .custom-carousel-container h2 { font-size: 1.1rem; line-height: 1.25; margin-bottom: 10px; }
  .custom-carousel-container p { font-size: 0.95rem; }
  .btn-get-started { padding: 12px 24px; font-size: 14px; }
}

/* Gallery lightbox (React reimplementation of GLightbox) */
.aastha-lightbox {
  position: fixed; inset: 0; z-index: 2000; background: rgba(0,0,0,0.9);
  display: flex; align-items: center; justify-content: center;
}
.aastha-lightbox img { max-width: 92vw; max-height: 88vh; border-radius: 6px; }
.aastha-lightbox .close {
  position: absolute; top: 18px; right: 24px; color: #fff; font-size: 34px;
  background: none; border: none; cursor: pointer; line-height: 1;
}

/* ── Toppers / testimonial cards (from testimonial.php; page-bg bug dropped) ── */
figure.custom-snip1192 {
  font-family: 'Raleway', Arial, sans-serif;
  position: relative; overflow: visible; margin: 10px;
  min-width: 280px; max-width: 400px; width: 100%;
  color: #333; text-align: left; border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
figure.custom-snip1192 * { box-sizing: border-box; }
figure.custom-snip1192 img {
  max-width: 100%; height: 100px; width: 100px; border-radius: 50%;
  margin-bottom: 15px; display: inline-block; z-index: 1; position: relative;
}
figure.custom-snip1192 blockquote {
  margin: 0; display: block; border-radius: 8px; position: relative;
  background-color: #fafafa; padding: 30px 50px; font-size: 0.8em;
  font-weight: 500; line-height: 1.6em; box-shadow: 0 5px 15px rgba(0,0,0,0.1); overflow: hidden;
}
.custom-description {
  height: 90px; overflow: hidden; text-overflow: ellipsis;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; padding: 10px;
}
figure.custom-snip1192 blockquote:before,
figure.custom-snip1192 blockquote:after {
  font-family: 'bootstrap-icons'; content: "\201C"; position: absolute;
  font-size: 50px; opacity: 0.3; font-style: normal;
}
figure.custom-snip1192 blockquote:before { top: 35px; left: 20px; }
figure.custom-snip1192 blockquote:after { content: "\201D"; right: 20px; bottom: 35px; }
figure.custom-snip1192 .custom-author { margin: 5px 10px; text-transform: uppercase; text-align: center; color: #333; }
figure.custom-snip1192 .custom-author h5 {
  opacity: 0.9; margin: 0; font-weight: 800; font-size: 15px;
  font-family: Arial, Helvetica, sans-serif; text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
figure.custom-snip1192 .rank-exam-batch {
  font-weight: 600; font-size: 14px; font-family: Arial, Helvetica, sans-serif;
  text-transform: uppercase; display: block; margin-top: 5px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.custom-swiper-container .swiper-slide { height: auto; }