#carousel-example-celebrity-experiences .item{
    transition: transform 0.35s ease;
}

#carousel-example-celebrity-experiences .item:hover{
    transform: scale(1.06);
    z-index: 10;
}

#carousel-example-celebrity-experiences .item img, #carousel-example-celebrity-experiences-videos .item {
  width: 100%;
  height: 100%;
  object-fit: contain; /* show full image, no crop */
}

#carousel-example-celebrity-experiences .item .ratio, #carousel-example-celebrity-experiences-videos .item .ratio {
  height: 300px; /* adjust as needed */
}

#carousel-example-celebrity-experiences .image-wrapper {
  /*width: 100%;*/
  /*height: 400px;*/
  /*display: flex;*/
  /*align-items: center;*/
  /*justify-content: center;*/
  /*background: #333333;*/
  /*border-radius: 10px;*/
  
  border-radius: 20px;
  width: 100%;
  aspect-ratio: 10/16;
  overflow: hidden;
}

#carousel-example-celebrity-experiences-videos .youtube-video {
  width: 100%;
  height: 300px; /* pick a consistent height */
  display: flex;
  align-items: center;
  justify-content: center;
  background: #333333; /* optional, for letterboxing */
  border-radius: 10px;
}

#carousel-example-celebrity-experiences .image-wrapper img {
  /*max-width: 100%;*/
  /*max-height: 100%;*/
  /*object-fit: contain;*/
  
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#carousel-example-celebrity-experiences .overlay {
  /*position: absolute;*/
  /*bottom: 10px;*/
  /*left: 10px;*/
  /*right: 10px;*/
  /*background: rgba(0, 0, 0, 0.6);*/
  /*color: #fff;*/
  /*padding: 8px 12px;*/
  /*border-radius: 5px;*/
  /*font-size: 1em;*/
  
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  padding:30px 20px;

  background: linear-gradient(
      to top,
      rgba(0,0,0,1) 0%,
      rgba(0,0,0,0.9) 25%,
      rgba(0,0,0,0.7) 87%,
      rgba(0,0,0,0.4) 90%,
      rgba(0,0,0,0) 100%
  );

  color:#fff;
  border-radius: 20px;
}

#carousel-example-celebrity-experiences .text-block {
  text-align: center;        /* Center everything */
  color: white;              /* Default text color */
  /* font-family: 'Arial', sans-serif; */
}

#carousel-example-celebrity-experiences .main-title {
  font-size: 20px;           /* Big bold title */
  font-weight: bolder;
  color: gold;               /* Gold effect */
  margin: 0;
  letter-spacing: 1px;
  color: rgb(234 88 12 / var(--tw-text-opacity, 1)); 
}

#carousel-example-celebrity-experiences .separator {
  width: 130px;               /* Length of line */
  height: 3px;               /* Thickness */
  /*background-color: gold; */
  background-color: rgb(234 88 12 / var(--tw-text-opacity, 1));
  margin: 10px auto;         /* Space around + center */
}

#carousel-example-celebrity-experiences .sub-title {
  font-size: 13px;
  font-weight: 600;
  color: white;              /* Contrast with gold */
  margin: 0;
  letter-spacing: 2px;       /* Stylish spacing */
}

/* position nav centered vertically and at edges */
#carousel-example-celebrity-experiences .owl-nav {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  transform: translateY(-50%);
  z-index: 999; /* above overlays */
  pointer-events: none; /* allow clicks only on buttons */
}

#carousel-example-celebrity-experiences-videos .owl-nav {
  position: absolute;
  top: 20%;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  transform: translateY(-50%);
  z-index: 999; /* above overlays */
  pointer-events: none; /* allow clicks only on buttons */
} 

/* style and enable buttons */
#carousel-example-celebrity-experiences .owl-nav div, #carousel-example-celebrity-experiences-videos .owl-nav div {
  pointer-events: auto; /* enable clicks */
  background: #ad2a00 !important;
  color: #fff !important;
  border: none;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 20px !important;
  opacity: 1 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* ensure icons inside are visible */
#carousel-example-celebrity-experiences .owl-nav div svg, #carousel-example-celebrity-experiences-videos .owl-nav div svg {
  color: #fff !important;
  font-size: 20px;
}

.h-250 {
  height: 250px !important;
}

.awards-section{
  background:#fafafa;
}

.section-title{
  font-size:32px;
  font-weight:600;
}

.section-subtitle{
  color:#777;
}

.astro-awards-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:30px;
}

@media (max-width:992px){
    .astro-awards-grid{
        grid-template-columns:repeat(2, 1fr);
    }
}

@media (max-width:576px){
    .astro-awards-grid{
        grid-template-columns:1fr;
    }
}

.astro-award-item{
    background:#fff;
    border-radius:14px;
    padding:30px 25px;
    text-align:center;
    box-shadow:0 8px 25px rgba(0,0,0,0.06);
    transition:all .3s ease;
}

.astro-award-item:hover{
    transform:translateY(-6px);
    box-shadow:0 18px 40px rgba(0,0,0,0.12);
}

.astro-award-image{
    height:350px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:18px;
}

.astro-award-image img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
}

.astro-award-title{
    font-size:20px;
    font-weight:600;
    margin-bottom:10px;
}

.astro-award-desc{
    font-size:14px;
    color:#666;
    line-height:1.6;
}

.astro-award-title::after{
    content:'';
    display:block;
    width:40px;
    height:3px;
    background:#d4af37;
    margin:10px auto 0;
}

.blog-grid {
    display: flex;
    flex-wrap: wrap;
}

.blog-col {
    display: flex;
    margin-bottom: 30px;
}

.blog-link {
    text-decoration: none;
    width: 100%;
}

.blog-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    border: 1px solid #eee;
    background: #fff;
    transition: 0.3s;
}

.blog-card:hover {
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
}

/* IMAGE */
.blog-image {
    width: 100%;
    height: 260px;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.blog-image img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

/* DATE */

.blog-date {
    position: absolute;
    top: 10px;
    left: 10px;
    background: #ff5a5f;
    color: #fff;
    text-align: center;
    padding: 6px 10px;
    font-size: 13px;
}

.blog-date .day {
    display: block;
    font-size: 18px;
    font-weight: bold;
}

/* CONTENT */

.blog-content {
    padding: 18px;
    flex-grow: 1;
}

.blog-title {
    font-size: 18px;
    margin-bottom: 10px;
    color: #222;
}

.blog-text {
    font-size: 14px;
    color: #666;
    line-height: 1.6;
}

/* FOOTER */

.blog-footer {
    display: flex;
    justify-content: space-between;
    padding: 12px 18px;
    border-top: 1px solid #eee;
    font-size: 13px;
    color: #777;
}

.mb-50 {
    margin-bottom: 50px !important;
}

/* BLOG CARD */

.blog-single-card{
  background:#fff;
  box-shadow:0 5px 20px rgba(0,0,0,0.08);
  margin-bottom:40px;
}

/* FEATURED IMAGE */
.blog-featured-image{
    text-align:center;
    margin:25px 0 35px;
}

.blog-featured-image img{
    max-width:650px;
    width:100%;
    height:auto;
    border-radius:8px;
    box-shadow:0 6px 18px rgba(0,0,0,0.08);
}

/* DATE BADGE */

.blog-date-badge{
  position:absolute;
  top:20px;
  left:20px;
  background:#ff5a5f;
  color:#fff;
  padding:10px 12px;
  text-align:center;
}

.blog-date-badge .day{
  display:block;
  font-size:22px;
  font-weight:bold;
}

.blog-date-badge .month{
  font-size:14px;
}

/* BLOG CONTENT */

.blog-single-content{
  padding:35px;
}

.blog-single-title{
  font-size:30px;
  margin-bottom:15px;
}

/* META INFO */

.blog-meta{
  margin-bottom:25px;
  color:#777;
  font-size:14px;
}

.blog-meta span{
  margin-right:20px;
}

/* BLOG TEXT */

.blog-content-area{
  font-size:16px;
  line-height:1.8;
  color:#444;
}

.blog-content-area p{
  margin-bottom:18px;
}

/* SHARE */

.blog-share{
  margin-top:30px;
  border-top:1px solid #eee;
  padding-top:20px;
}

.blog-share span{
  margin-right:10px;
  font-weight:600;
}

.blog-share a{
  display:inline-block;
  margin-right:8px;
  width:36px;
  height:36px;
  line-height:36px;
  text-align:center;
  background:#f5f5f5;
  border-radius:50%;
  color:#333;
}

.blog-share a:hover{
  background:#ff5a5f;
  color:#fff;
}

/* ================= STICKY CTA ================= */
.sticky-book-full {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #b83a00;
  z-index: 9999;
  text-align: center;
  animation:astroPulse 1s infinite;
}

@keyframes astroPulse{
     0%{opacity:1;}
    50%{opacity:0.7;}
    100%{opacity:1;}
}

.full-cta-btn {
  display: block;
  width: 100%;
  padding: 15px;
  color: #fff;
  font-weight: 700;
  font-size: 17px;
  text-decoration: none;
}

.full-cta-btn:hover {
  color: #fff;
  font-weight: 700;
  font-size: 17px;
  text-decoration: none;
}

.ml-zodiac {
  margin-left: 108px !important;
}

@media (max-width: 991px){
  .hs_sign_right_wrapper .hs_slider_tabs_icon_cont_wrapper{
		text-align: left;
	}
}

.bg-img {
  filter: contrast(50%) brightness(70%) saturate(120%) !important;
}

/* ====== Blogs new css 10 march 2026 ====== */
/* Card should fill column height */
.home-blog-card {
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
  border-radius: 18px 18px 18px 18px;
}

.blog-view-all-btn {
  float: right;
}

.home-blog-body {
  background: white;
  border-radius: 18px 18px 18px 18px;
}

.home-blog-card img {
  border-radius: 18px 18px 0 0;
}

.home-blog-card {
  transition: all .3s ease;
}

.home-blog-card:hover{
  transform: translateY(-5px);
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
}

.blog-card{
    border-radius:18px;
    overflow:hidden;
    transition: all .3s ease;

    display:flex;
    flex-direction:column;
    height:100%;
}

.blog-card:hover{
  transform: translateY(-5px);
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
}

.blog-img{
  width:100%;
  aspect-ratio:3/2;
  object-fit:cover;
  display:block;
}

/* body grows */
.blog-body{
    padding:30px;
    flex-grow:1;
}

/* TITLE BLOCK FIX */
.blog-title{
    /*font-weight:700;*/
    /*color:#8b1e00;*/
    /*line-height:1.5;*/
    /*margin-bottom:20px;*/

    /*display:-webkit-box;*/
    /*-webkit-box-orient:vertical;*/
    /*-webkit-line-clamp:2;*/

    /*line-clamp:2; */
    /*overflow:hidden;*/
    /*text-overflow:ellipsis;*/

    /*word-break:break-word;*/
    
    font-weight:700;
    color:#8b1e00;
    line-height:1.5;
    margin-bottom:20px;

    min-height:3em;   /* reserve space for 2 lines */
    max-height:3em;

    overflow:hidden;
    word-break:break-word;
}

/* read more */
.read-more{
    color:#ff5a00;
    font-weight:600;
    text-decoration:none;
}

/* footer */
.blog-footer{
    padding:20px 30px;
    background:#fff;
    color:#888;
    border-top:1px solid #eee;
}

.mt-2 {
  margin-top: 2.5rem;
}
/* ====== Blogs new css 10 march 2026 ====== */

.blogs-read-more {
  float: right !important;
}

.mb-30 {
    margin-bottom: 30px;
}

.hs_about_indx_main_wrapper .row{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
}

.hs_about_left_img_wrapper{
    display:block;
    margin-top: -100px !important;
    padding-top:0 !important;
    vertical-align:top;
}

/* ===== Video TESTIMONIAL REEL CARD ===== */

.video-carousel .owl-nav {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  transform: translateY(-50%);
  z-index: 999; /* above overlays */
  pointer-events: none; /* allow clicks only on buttons */
}

@media (max-width:768px){

  .video-carousel .owl-nav{
    left:0;
    right:0;
    padding:0 10px;
  }

  .video-carousel .owl-nav button{
    width:42px;
    height:42px;
    font-size:22px;
  }

}
/* ===== Video TESTIMONIAL REEL CARD ===== */

/** video testimonial new css 12 march 2026 */
.video-carousel .owl-nav button{
  width:60px;
  height:60px;
  border-radius:50%;
  background:#fff !important;
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
  font-size:32px !important;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:0.3s;
}

.video-carousel .owl-nav button:hover{
  background:#ad2a00 !important;
  color:#fff !important;
}

.video-carousel{
  position:relative;
}

.video-carousel .owl-nav{
  position:absolute;
  top:50%;
  left:-70px;
  right:-70px;
  display:flex;
  justify-content:space-between;
  transform:translateY(-50%);
}

.video-carousel .owl-nav div {
  pointer-events: auto;
  background: #ad2a00 !important;
  color: #fff !important;
  border: none;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 20px !important;
  opacity: 1 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

@media (max-width:768px){

  .video-carousel .owl-dots{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin-top:20px;
  }

  .video-carousel .owl-dot{
    display:inline-block;
  }

  .video-carousel .owl-dot span{
    width:12px;
    height:12px;
    border-radius:50%;
    background:#ccc;
    display:block;
  }

  .video-carousel .owl-dot.active span{
    background:#ad2a00;
  }

  .video-carousel .owl-nav{
    display: none;
  }

  .video-carousel .owl-nav button{
    display: none;
  }

}

.reel-card{
  width:100%;
  max-width:440px;
  background:#fff;
  border-radius:28px;
  overflow:hidden;
  border:1px solid #f5c19c;

  display:flex;
  flex-direction:column;
  height:100%;

  transition:transform .3s ease, box-shadow .3s ease;
}

.reel-card:hover {
  transform: translateY(-6px);
}

.reel-frame{
  width:100%;
  height:580px;
  position:relative;
  overflow:hidden;
}

.reel-frame iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border:0;
  z-index:2;
}

.reel-caption{
  padding:18px;
  display:flex;
  flex-direction:column;
  flex-grow:1;
  text-align: center;
  font-size: 14px;
  font-style: italic;
  color: #555;
  background: #fff7f0;
}

.testimonial-text{
  line-height:1.5;
  max-height:3em;
  overflow:hidden;
}

.reel-author{
  line-height:1.4;
  height:2.8em;
  overflow:hidden;
  margin-top:auto;
}

.video-carousel .owl-stage{
  display:flex;
}

.video-carousel .owl-item{
  display:flex;
}

.video-carousel .owl-nav {
  display: none;
}


.video-carousel .owl-dots{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  margin-top:30px;
}

.video-carousel .owl-dot{
  outline:none;
}

.video-carousel .owl-dot span{
  width:10px;
  height:10px;
  background:#d6d6d6;
  border-radius:20px;
  display:block;
  transition:all .35s ease;
}

.video-carousel .owl-dot.active span{
  width:32px;
  background:#ad2a00;
}

/** video testimonial new css 12 march 2026 */

/** blogs carousel **/
.blogs-carousel .owl-nav button{
  width:60px;
  height:60px;
  border-radius:50%;
  background:#fff !important;
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
  font-size:32px !important;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:0.3s;
}

.blogs-carousel .owl-nav button:hover{
  background:#ad2a00 !important;
  color:#fff !important;
}

.blogs-carousel{
  position:relative;
}

.blogs-carousel .owl-nav{
  position:absolute;
  top:50%;
  left:-70px;
  right:-70px;
  display:flex;
  justify-content:space-between;
  transform:translateY(-50%);
}

.blogs-carousel .owl-nav div {
  pointer-events: auto;
  background: #ad2a00 !important;
  color: #fff !important;
  border: none;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 20px !important;
  opacity: 1 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* .blogs-carousel .owl-nav {
  display: none;
} */


.blogs-carousel .owl-dots{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  margin-top:30px;
}

.blogs-carousel .owl-dot{
  outline:none;
}

.blogs-carousel .owl-dot span{
  width:10px;
  height:10px;
  background:#d6d6d6;
  border-radius:20px;
  display:block;
  transition:all .35s ease;
}

.blogs-carousel .owl-dot.active span{
  width:32px;
  background:#ad2a00;
}

.our-services-card {
  padding: 12px !important; 
  border: 8px solid rgb(230, 90, 90) !important; 
  border-radius: 15px !important;
}

/** Blogs pagination */
.blog-pagination {
    margin-top: 40px;
}

.custom-pagination {
    list-style: none;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
}

.custom-pagination li a,
.custom-pagination li span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid #fff;
    color: black;
    text-decoration: none;
    border-radius: 4px;
    font-size: 20px;
    line-height: 1;
}

/* Bigger arrows */
.custom-pagination li:first-child a,
.custom-pagination li:last-child a {
    font-size: 24px;
    font-weight: 600;
}

.custom-pagination li a:hover {
    background: #ad2a00;
    color: #fff;
}

.custom-pagination li.active span {
    background: #ad2a00;
    color: #fff;
}

.custom-pagination li.disabled span,
.custom-pagination li.disabled {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border: 1px solid #fff;
    color: #bbb;
    text-decoration: none;
    border-radius: 4px;
    font-size: 20px;
    line-height: 1;
    font-weight: bold;
}

/* Better disabled style */
.custom-pagination li.disabled {
    color: #aaa;
    border-color: #ddd;
    background-color: #f5f5f5;
    cursor: not-allowed;
    opacity: 0.8;
    font-size: 24px;
}

/** Team detail layout footer css */
.team-layout-whatsapp-pulse {
	width: 60px;
	height: 60px;
	left: 20px;
	bottom: 40px;
	background: #10b418;
	position: fixed;
	text-align: center;
	color: #ffffff;
	cursor: pointer;
	border-radius: 50%;
	z-index: 99;
	display: inline-block;
	line-height: 65px;
}

.team-layout-whatsapp-pulse:before {
	position: absolute;
	content: " ";
	z-index: -1;
	bottom: -15px;
	right: -15px;
	background-color: #10b418;
	width: 90px;
	height: 90px;
	border-radius: 100%;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
	opacity: 0.6;
	-webkit-animation: pulse 1s ease-out;
	animation: pulse 1.8s ease-out;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
}

/* ================= STICKY CTA ================= */
.sticky-book-full {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  background: #b83a00;
  z-index: 9999;
  text-align: center;
  animation:astroPulse 1s infinite;
}

@keyframes astroPulse{
     0%{opacity:1;}
    50%{opacity:0.7;}
    100%{opacity:1;}
}

.full-cta-btn {
  display: block;
  width: 100%;
  padding: 15px;
  color: #fff;
  font-weight: 700;
  font-size: 17px;
  text-decoration: none;
}

.full-cta-btn:hover {
  color: #fff;
  font-weight: 700;
  font-size: 17px;
  text-decoration: none;
}

.mt-minus-40 {
  margin-top: -40px !important;
}

.auto-scale-products-img {
  max-width: 500px !important;
  height: auto !important;
}

.lh-15 {
  line-height: 1.5em !important;
}

/* Awards and recognitions section */
.award-gallery-item{
    position:relative;
    overflow:hidden;
    border-radius:12px;
    box-shadow:0 10px 30px rgba(0,0,0,0.15);
}

/* FIXED IMAGE SIZE */
.award-gallery-item img{
    width:100%;
    height:260px;        /* same height for all images */
    object-fit:cover;    /* fills container */
    display:block;
}

/* gradient overlay */
.award-gallery-item::before{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:40%;
    background:linear-gradient(
        to top,
        rgba(0,0,0,0.95),
        rgba(0,0,0,0.75),
        rgba(0,0,0,0.1)
    );
}

/* caption */
.award-caption{
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    padding:20px;

    display:flex;
    flex-direction:column;
    align-items:center;      /* horizontal center */
    justify-content:center;  /* vertical center */

    text-align:center;       /* center text */
    color:#fff;
}

.award-caption h4{
    font-size:20px;
    font-weight:600;
    margin-bottom:4px;
    color: gold;
    /* color: #ad2a00; */
}

.award-caption p{
  font-size:14px;
}

.award-caption h4,
.award-caption p{
  text-shadow:0 2px 6px rgba(0,0,0,0.7);
}

/** Astrologers Team Section */
.hs_astro_img_wrapper img {
  background-image: -webkit-linear-gradient(0deg, #ad2a00 0%, #ad2a00 100%) !important;
}

.profile-section .profile-img {
  background: linear-gradient(to right, #ad2a00, #ad2a00);
}

/** Puja page cards design */
.hs_astro_img_wrapper {
    width: 100%;
    height: 260px; /* fixed height */
    overflow: hidden;
}

.hs_astro_img_wrapper img{
    width: 100%;
    height: 100%;
    object-fit: cover; /* keeps image quality */
}

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

.hs_astro_img_cont_wrapper h2{
    min-height: 48px;
    line-height: 1.3em;
}

/** news and media css */
/* Masonry Layout */
.news-and-media-masonry {
    /* column-count: 3;
    column-gap: 20px; */
    column-count: 4;   /* 🔥 increase columns */
    column-gap: 15px;
}

@media (max-width: 992px) {
    .news-and-media-masonry {
        column-count: 3;
    }
}

@media (max-width: 600px) {
    .news-and-media-masonry {
        column-count: 2;
    }
}

.news-and-media-item {
    break-inside: avoid;
    margin-bottom: 20px;
}

/* Card */
.news-and-media-card {
    border-radius: 14px;
    overflow: hidden;
    position: relative;
    cursor: pointer;
    transition: transform 0.3s ease;
}

/* Image */
.news-and-media-image-wrapper {
    position: relative;
    overflow: hidden;
}

.news-and-media-image-wrapper img {
    width: 100%;
    height: auto;
    object-fit: cover; /* crops instead of stretching */
}

/* Overlay */
.news-and-media-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    color: #fff;

    background: linear-gradient(
        to top,
        rgba(44, 0, 62, 0.9),
        rgba(173, 42, 0, 0.2),
        transparent
    );

    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
}

/* Category Tag */
.news-and-media-category {
    display: inline-block;
    background: #ad2a00;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 20px;
    margin-bottom: 10px;
}

/* Title */
.news-and-media-overlay h3 {
    font-size: 18px;
    margin: 5px 0;
    font-weight: bold;
}

/* Description */
.news-and-media-overlay p {
    font-size: 13px;
    opacity: 0.9;
}

/** Kundli Automation Tool */
.horoscope-page {
    background: linear-gradient(180deg, #ffe7d9 0%, #fff0e6 139%, #ffe4d8 100%);
    padding: 56px 0;
    float: left;
    width: 100%;
}

.horoscope-shell {
    background: #fff;
    border: 1px solid rgba(165, 83, 28, 0.12);
    border-radius: 28px;
    box-shadow: 0 22px 60px rgba(117, 53, 18, 0.08);
    overflow: hidden;
}

.horoscope-hero {
    background: #ad2a00 !important;
    color: #fff;
    padding: 30px;
}

.horoscope-kicker {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.16);
    color: #fff7ef;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.horoscope-hero h2 {
    margin: 16px 0 10px;
    color: #fff;
    font-size: 36px;
    line-height: 1.08;
    font-weight: 700;
}

.horoscope-hero p {
    margin: 0;
    color: rgba(255, 246, 238, 0.92);
    font-size: 15px;
    line-height: 1.85;
    max-width: 760px;
}

.horoscope-body {
    padding: 28px;
}

.horoscope-controls {
    display: grid;
    grid-template-columns: 1fr 200px 170px 170px;
    gap: 14px;
    align-items: end;
    margin-bottom: 24px;
}

.horoscope-field label {
    display: block;
    margin-bottom: 8px;
    color: #6b2b14;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.horoscope-field input,
.horoscope-field select {
    height: 50px;
    border: 1px solid #ead7c8;
    border-radius: 16px;
    background: #fffaf5;
    color: #492216;
    padding: 0 16px;
    font-size: 14px;
}

.horoscope-load-btn {
    height: 50px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(135deg, #ad2a00 0%, #ad2a00 100%);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 14px 32px rgba(161, 67, 21, 0.2);
}

.horoscope-sign-card strong,
.horoscope-sign-card small {
    display: block;
}

.horoscope-sign-card strong {
    color: #592111;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 4px;
}

.horoscope-sign-card small {
    color: #886554;
    font-size: 13px;
}

.horoscope-status,
.horoscope-errors {
    display: none;
    margin-top: 20px;
    border-radius: 18px;
    padding: 14px 16px;
}

.horoscope-status {
    background: #fff1dc;
    color: #8a531f;
    font-weight: 700;
}

.horoscope-errors {
    background: #fff1f1;
    border: 1px solid #f2caca;
    color: #a12626;
}

.horoscope-results {
    margin-top: 24px;
}

.horoscope-placeholder,
.horoscope-result-card {
    border: 1px solid #eddccf;
    border-radius: 24px;
    padding: 24px;
}

.horoscope-placeholder h3,
.horoscope-result-head h3 {
    margin: 0 0 8px;
    color: #582111;
    font-size: 28px;
    font-weight: 700;
}

.horoscope-placeholder p,
.horoscope-result-head p {
    margin: 0;
    color: #846352;
    font-size: 14px;
    line-height: 1.8;
}

.horoscope-result-label {
    display: inline-block;
    margin-bottom: 8px;
    color: #9a6d4f;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.horoscope-summary {
    margin-top: 18px;
    padding: 20px;
    border: 1px solid #f0dfd3;
    border-radius: 20px;
    background: linear-gradient(180deg, #fffaf6 0%, #fff 100%);
}

.horoscope-summary p {
    margin: 0;
    color: #5b4337;
    font-size: 15px;
    line-height: 1.9;
    white-space: pre-line;
}

.horoscope-panels {
    margin-top: 18px;
}

.horoscope-panel {
    border: 1px solid #efdfd4;
    border-radius: 20px;
    background: #fffaf6;
    padding: 18px;
}

.horoscope-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f2e3d9;
}

.horoscope-panel-head strong {
    color: #5a2212;
    font-size: 17px;
    font-weight: 700;
}

.horoscope-panel-score {
    min-width: 46px;
    height: 32px;
    padding: 0 10px;
    border-radius: 999px;
    background: #fff0e0;
    border: 1px solid #edc8a5;
    color: #8b340f;
    font-size: 14px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.horoscope-panel p {
    margin: 0;
    color: #614638;
    font-size: 14px;
    line-height: 1.8;
    white-space: pre-line;
    word-break: break-word;
}

@media (max-width: 991px) {
    .horoscope-hero h2 {
        font-size: 30px;
    }
}

@media (max-width: 767px) {
    .horoscope-page {
        padding: 40px 0;
    }

    .horoscope-body,
    .horoscope-hero,
    .horoscope-placeholder,
    .horoscope-result-card {
        padding: 20px;
    }
}

.horoscope-panels {
  margin-top: 20px;
}

.horoscope-panel {
  background: #fffaf2; /* light cream */
  border: 1px solid #e6b17e; /* golden accent */
  border-radius: 12px;
  padding: 16px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.08);
  transition: all 0.3s ease;
}

.horoscope-panel:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 16px rgba(139,52,15,0.25); /* terracotta glow */
}

.horoscope-panel-head strong {
  color: #8b340f; /* brand accent */
  font-family: 'Playfair Display', serif;
  font-size: 1.1rem;
}

.general-overview-text strong {
  font-size:1.7rem !important;
}

.horoscope-panel-score {
  color: #e6b17e; /* golden highlight */
  font-weight: bold;
}

.hidden {
  display: none !important;
}

.rashi-result-flex-row {
    display: flex;
    flex-wrap: wrap;
}

.rashi-result-flex-row > [class*='col-'] {
    display: flex;
}

.rashi-result-equal-panel {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.equal-card .panel-body {
    flex-grow: 1;
}

.float-right {
  float: right !important;
}

/* Wrapper stays aligned right */
.float-right.rating-wrapper {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

/* ⭐ Responsive star size */
.rating {
    position: relative;
    display: inline-block;
    line-height: 1;

    /* 🔥 Responsive font size */
    font-size: clamp(14px, 2vw, 22px);
}

/* Background stars */
.rating::before {
    content: "★★★★★";
    color: #ddd;
}

/* Filled stars */
.rating-fill {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    white-space: nowrap;
}

.rating-fill::before {
    content: "★★★★★";
    color: #f8ce0b;
}

/* Rating number */
.rating-number {
    font-size: clamp(11px, 1.5vw, 14px);
    color: #555;
}

.fnt-size-15 {
  font-size: 1.5rem !important;
}

.fnt-color-site-theme {
  color: #ad2a00 !important;
}

.horoscope-panel-background-site-theme {
  background: #ad2a00 !important;
  color: white !important;
  font-weight: bold !important;
}

.fnt-weight-bold {
  font-weight: bold !important;
}

.horoscope-result-panel {
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: 15px !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2) !important;
  transition: all 0.3s ease;
}

.horoscope-result-panel:hover {
    transform: translateY(-6px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.3);
}

.horoscope-panel-body {
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  color: #5a2e2e;
  font-weight: bold;
  backdrop-filter: blur(6px);
}

.rashi-header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rashi-name {
    margin: 0;
    font-size: 24px;
    font-weight: 600;
}

.rashi-date {
    margin: 0;
    font-size: 14px;
    color: #777;
}

.rashi-symbol img {
    transition: all 0.3s ease;
    filter: brightness(0) invert(1);
}

.rashi-symbol img:hover {
    transform: scale(1.1);
    filter: brightness(0) invert(1);
}

/* Responsive */
@media (max-width: 576px) {
    .rashi-name {
        font-size: 20px;
    }

    .rashi-symbol i {
        font-size: 26px;
    }
}

.mt-10 {
  margin-top: 10px !important;
}

.horoscope-frequency-button {
  border: 1px solid #ead7c8;
  border-radius: 10px;
  background: #fffaf5;
  font-weight: bold;
}

.horoscope-frequency-button:hover {
  border: 1px solid #ad2a00;
  border-radius: 10px;
  background: #ad2a00;
  font-weight: bold;
  color: white;
}

/* Default */
.toggle-horoscope-buttons .btn {
    margin: 5px;
    border-radius: 10px;
    padding: 8px 20px;
}

/* Active button */
.toggle-horoscope-buttons .btn.active {
    border: 1px solid #ad2a00;
    border-radius: 10px;
    background: #ad2a00;
    font-weight: bold;
    color: white;
}

.toggle-horoscope-buttons .btn:focus {
    outline: none;
    box-shadow: 0 0 5px rgba(255, 87, 34, 0.5);
}

/** Horoscope loader overlay */
/* Overlay */
#horoscope-results {
    position: relative; /* 🔥 REQUIRED */
    min-height: 250px;  /* ensures overlay has space */
}

/* Loader overlay */
#horoscope-loader-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(180deg, #ffe7d9 0%, #fff0e6 139%, #ffe4d8 100%);
    z-index: 9999;
}

#horoscope-loader-overlay .fa-spinner {
  color: #a8321a;
}

/* Active state */
#horoscope-loader-overlay.active {
    opacity: 1;
    visibility: visible;
}

.horoscope-loader-content {
    text-align: center;
    color: #fff;
}

/* Flex layout for single row */
.horoscope-generate-form  {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    /* justify-content: center; */
}

/* Each field block */
.horoscope-generate-form .form-field {
    margin: 10px;
    min-width: 180px;
}

/* Labels on top */
.horoscope-generate-form  .form-field label {
    display: block;
    font-weight: 600;
    margin-bottom: 5px;
}

/* Inputs styling */
.horoscope-generate-form .form-control {
    border-radius: 20px;
    padding: 8px 12px;
}

/* Button styling */
.horoscope-generate-form .btn {
    border-radius: 20px;
    padding: 8px 20px;
}

/* Mobile responsiveness */
@media (max-width: 767px) {
    .horoscope-generate-form  {
        display: block;
        text-align: center;
    }

    .horoscope-generate-form .form-field {
        width: 100%;
        margin: 10px 0;
    }

    .horoscope-generate-form .form-control,
    .horoscope-generate-form .btn {
        width: 100%;
    }
}

.horoscope-generate-form select, .horoscope-generate-form input {
  border: 1px solid #ead7c8;
  border-radius: 10px;
  background: #fffaf5;
  font-weight: bold;
}