/*
* @Author: Lalit
* @Date:   2025-08-11 20:28:32
* @Last Modified by:   Lalit
* @Last Modified time: 2025-08-12 09:50:24
*/

 .btn-CTA {color: #fff;background-color: #b62c28;border-color: #b62c28;font-size: 15px;}

		 .col-md-12.col-sm-12.col-xs-12.numerologyImage {padding: 0;}
		 .numerologyContent h2 {font-weight: 700;margin-bottom: 15px;font-size: 32px !important;color: #313131;}
		 .numerologyContent h4,.numerologyContent h5,.numerologyContent h6 {font-weight: 700;margin-bottom: 10px;color: #454545;font-size: 22px;}
		 .numerologyContent p {text-align: justify;margin-bottom: 15px;}
		 .numerologyContent b {font-size: 18px;}
		 .mb-3 {margin-bottom: 15px !important;}
		 .astrobox {height: 165px;}
		 .astrotxt {width: 80%;}
		 .pricing-tables h2 {font-weight: 700;margin-bottom: 15px;font-size: 32px !important;color: #313131;}
		 .astrotxt .price-txt {font-weight: bold;font-size: 13px;color: #333;}
		 .astroprofilepic,
		 .astroprofilepic img {height: auto !important}
		 .owl-carousel .owl-dots {display: none !important;}
		 .fa-star {color: #feac18;}

		 /* Modern Numerology Styles */
		 .hero-section {
		     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		     color: white;
		     padding: 80px 0;
		     position: relative;
		     overflow: hidden;
		 }
		 
		 .hero-section::before {
		     content: '';
		     position: absolute;
		     top: 0;
		     left: 0;
		     right: 0;
		     bottom: 0;
		     background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="white" opacity="0.1"/><circle cx="75" cy="75" r="1" fill="white" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');
		     opacity: 0.3;
		 }
		 
		 .hero-content {
		     position: relative;
		     z-index: 2;
		 }

		 .form-section {
		     background: #f8f9fa;
		     padding: 60px 0;
		     position: relative;
		 }

		 .numerology-form {
		     background: white;
		     border-radius: 20px;
		     padding: 40px;
		     box-shadow: 0 20px 60px rgba(0,0,0,0.1);
		     position: relative;
		     overflow: hidden;
		 }

		 .numerology-form::before {
		     content: '';
		     position: absolute;
		     top: -50%;
		     left: -50%;
		     width: 200%;
		     height: 200%;
		     background: linear-gradient(45deg, transparent, rgba(103, 126, 234, 0.05), transparent);
		     animation: shimmer 3s infinite;
		     pointer-events: none;
		 }

		 @keyframes shimmer {
		     0% { transform: translateX(-100%) translateY(-100%) rotate(30deg); }
		     100% { transform: translateX(100%) translateY(100%) rotate(30deg); }
		 }

		 .form-group {
		     margin-bottom: 25px;
		     position: relative;
		 }

		 .form-control {
		     height: 50px;
		     border: 2px solid #e9ecef;
		     border-radius: 12px;
		     font-size: 16px;
		     transition: all 0.3s ease;
		     background: #fff;
		 }

		 .form-control:focus {
		     border-color: #667eea;
		     box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
		 }

		 .btn-calculate {
		     background-image: -webkit-linear-gradient(
71deg, rgb(183, 23, 29) 50%, rgb(243, 113, 16) 100%);
		     border: none;
		     color: white;
		     padding: 15px 40px;
		     border-radius: 50px;
		     font-weight: 600;
		     font-size: 18px;
		     transition: all 0.3s ease;
		     position: relative;
		     overflow: hidden;
		 }

		 .btn-calculate:hover {
		     transform: translateY(-2px);
		     box-shadow: 0 10px 25px rgba(102, 126, 234, 0.3);
		     color: white;
		 }

		 .btn-calculate::before {
		     content: '';
		     position: absolute;
		     top: 0;
		     left: -100%;
		     width: 100%;
		     height: 100%;
		     background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
		     transition: left 0.5s;
		 }

		 .btn-calculate:hover::before {
		     left: 100%;
		 }

		 .results-section {
		     background: white;
		     padding: 60px 0;
		 }

		 .result-card {
		     background: white;
		     border-radius: 16px;
		     padding: 30px;
		     margin-bottom: 30px;
		     box-shadow: 0 10px 30px rgba(0,0,0,0.1);
		     border: 1px solid #f0f0f0;
		     transition: all 0.3s ease;
		     position: relative;
		     overflow: hidden;
		 }

		 .result-card::before {
		     content: '';
		     position: absolute;
		     top: 0;
		     left: 0;
		     width: 100%;
		     height: 4px;
		     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		 }

		 .result-card:hover {
		     transform: translateY(-5px);
		     box-shadow: 0 20px 40px rgba(0,0,0,0.15);
		 }

		 .number-badge {
		     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		     color: white;
		     width: 60px;
		     height: 60px;
		     border-radius: 50%;
		     display: flex;
		     align-items: center;
		     justify-content: center;
		     font-size: 24px;
		     font-weight: bold;
		     margin-bottom: 15px;
		 }

		 .info-grid {
		     display: grid;
		     grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
		     gap: 20px;
		     margin-top: 30px;
		 }

		 .info-item {
		     background: #f8f9fa;
		     padding: 20px;
		     border-radius: 12px;
		     border-left: 4px solid #667eea;
		 }

		 .info-item h5 {
		     color: #667eea;
		     margin-bottom: 10px;
		     font-weight: 600;
		 }

		 .hidden {
		     display: none;
		 }

		 .number-display {
		     text-align: center;
		     margin: 30px 0;
		 }

		 .main-numbers {
		     display: flex;
		     justify-content: center;
		     gap: 40px;
		     margin-bottom: 40px;
		     flex-wrap: wrap;
		 }

		 .number-item {
		     text-align: center;
		 }

		 .number-item h4 {
		     color: #667eea;
		     margin-bottom: 10px;
		     font-size: 16px;
		     font-weight: 600;
		 }

		 .prediction-section {
		     background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
		     color: white;
		     padding: 50px 0;
		     margin: 40px 0;
		     border-radius: 20px;
		 }

		 .section-title {
		     text-align: center;
		     margin-bottom: 50px;
		     position: relative;
		 }

		 .section-title h2 {
		     font-size: 36px;
		     font-weight: 700;
		     color: #2c3e50;
		     margin-bottom: 15px;
		 }

		 .section-title::after {
		     content: '';
		     width: 80px;
		     height: 4px;
		     background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
		     display: block;
		     margin: 0 auto;
		     border-radius: 2px;
		 }

		 @media  only screen and (max-width:767px) and (min-width:300px) {
			 .numerologyContent h2 {font-size: 22px !important;}
			 .pricing-tables h2 {font-size: 22px !important;}
			 .astrobox{margin-left: 14px;margin-right: 14px;}
			 .hero-section {padding: 50px 0;}
			 .numerology-form {padding: 30px 20px;}
			 .main-numbers {gap: 20px;}
			 .info-grid {grid-template-columns: 1fr;}
			 .section-title h2 {font-size: 28px;}
		}