/*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.12.1759817431
Updated: 2025-10-07 06:10:31
*/
/* Top custom header - sticky version */
:root {
  --header-bg: #ffffff;
  --header-padding: 18px 20px;
  --container-max: 1200px;
  --logo-max-height: 56px;
  --gap: 12px;
}
body{
    font-family: 'Poppins', sans-serif;
}
/* Container */
.top-custom-header .container,
.top-custom-header.container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 0px;
  box-sizing: border-box;
}

/* Header styles */
.top-custom-header {
  width: 100%;
  background: transparent;
  padding: var(--header-padding);
  box-sizing: border-box;
  position: absolute;
  top: 0;
  z-index: 9999;
  transition: background 0.3s ease, box-shadow 0.3s ease;
}
/* When page is scrolled */
.top-custom-header.scrolled {
  padding: 10px 20px; /* shrink height */
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
  background: #ffffff; /* can darken or add opacity if desired */
  transition: all 0.3s ease;
  position: sticky;
  top: 0;
  z-index: 9999;
  transition: background 0.3s ease, box-shadow 0.3s ease;
}

.top-custom-header.scrolled img {
  max-height: 42px; /* shrink logos */
  transition: max-height 0.3s ease;
}

/* Layout */
.top-custom-header .container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap);
}

/* Logo sections */
.top-custom-header .left-logo-sec,
.top-custom-header .right-logo-sec {
  display: flex;
  align-items: center;
}

/* Logo images */
.top-custom-header img {
  display: block;
  max-width: 150px;
  height: auto;
  /*max-height: var(--logo-max-height);*/
  /*object-fit: contain;*/
  transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Hover effect */
@media (hover: hover) and (pointer: fine) {
  .top-custom-header img:hover {
    transform: translateY(-2px) scale(1.02);
    opacity: 0.95;
  }
}

/* Right logo slightly smaller */
.top-custom-header .right-logo-sec img {
  /*max-height: calc(var(--logo-max-height) * 0.95);*/
  max-height:auto;
}
.bg-light{
    background:#fff;
}
/* Mobile view */
@media (max-width: 620px) {
  .top-custom-header .container {
    /*flex-direction: column;*/
    align-items: center;
    /*justify-content: center;*/
    gap: 10px;
    padding-top: 12px;
    padding-bottom: 12px;
  }

  :root {
    --logo-max-height: 48px;
  }
}

/* Optional: reduce motion */
@media (prefers-reduced-motion: reduce) {
  .top-custom-header img,
  .top-custom-header * {
    transition: none !important;
  }
}

.hero-countdown-section {
  background: #fbf9f0;
  padding: 60px 20px;
  font-family: 'Inter', sans-serif;
}

.hero-container {
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  /*align-items: center;*/
}

.hero-left h2 {
    text-transform: uppercase;
  font-size: 21px;
  font-weight: 600;
  color: #000;
}
.reward-cards span{
    color:#FAC200;
}
.hero-left p {
    font-size:17px;
  margin: 15px 0;
  color: #555;
}
.corner-btn img{
    max-width: 20px !important;
}
.language-select p{
    margin-bottom: 0px !important;
    font-size: 14px !important;
}
.cta-button {
  display: inline-block;
  background: linear-gradient(180deg, #FFCB05 0%, #B8860B 100%);
  color: #fff;
  padding: 12px 28px;
  border-radius: 10px;
  font-weight: 600;
  text-decoration: none;
  transition: transform 0.2s ease;
}
.cta-button, .reward-card, .forminator-button-submit {
text-transform: uppercase;
font-family:Poppins, sans-serif;
}
.cta-button:hover, .reward-card .btn:hover, .forminator-button-submit:hover {
    background: linear-gradient(180.04deg, #FAC200 -3.82%, #000000 76.85%) !important;
  transform: translateY(-3px);
  color:#fff;
}

.hero-right h3 {
    text-align: center;
  font-size: 1.8rem;
  font-weight: 800;
  color: #000;
}
.hero-right{
   max-width: 450px;
   margin-left: auto;
}
.countdown {
  display: flex;
  gap: 25px;
  margin-top: 20px;
  width: 100%;
  justify-content: space-between;
}

.countdown div {
    background:transparent;
  text-align: center;
}

.countdown span {
  display: block;
  font-size: 2.5rem;
  font-weight: 800;
  color: #111;
}

.countdown small {
  color: #555;
  font-size: 0.9rem;
}

.update-text {
  margin-top: 8px;
  font-size: 0.85rem;
  color: #777;
}

/* Responsive */
@media (max-width: 768px) {
  .hero-container {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .hero-right {
    margin-top: 30px;
  }
}


.how-it-works {
    text-align: center;
    padding: 60px 20px;
    margin: auto;
}
.container {
    max-width: 1240px !important;
    margin: auto;
}
.section-title {
    text-transform: uppercase;
  font-size: 32px;
    letter-spacing: 2px;
    font-weight: 600;
    color: #000;
    margin-bottom: 20px;
}

.steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 30px;
  justify-content: center;
  align-items: stretch;
}

.step-box {
  background: #fdfdfd;
  border: 1px solid #eee;
  display: flex;
  flex-direction: column;
  text-align: left;
  /*box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);*/
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.step-box:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.step-header {
  text-transform: uppercase;
  background: linear-gradient(90deg, #E2AF01 0%, rgba(255, 255, 255, 0) 100%);
  padding: 10px 20px;
  font-weight: 600;
  font-size: 16px;
  color: #000;
}

.step-img img {
  width: 100%;
  height: auto;
  display: block;
}

.step-content {
  background: #FFF3CA5E;
  padding: 20px;
  flex-grow: 1;
  border-top: none;
  border-bottom: 6px solid #FAC200;
}

.step-content p {
  font-size: 15px;
  color: #434343;
  margin: 0 0 10px;
  line-height: 1.5;
}

.step-content strong {
  color: #434343;
  font-weight: 700;
}




.reward-section {
    border-bottom: 18px solid; /* fallback */
  border-image: linear-gradient(to right, #FFCB05 50%, #616161 50%) 1;
 
  padding-bottom: 5px;
  background: #F9F8F396;
  padding: 70px 20px;
}

.reward-section .container {
  display: flex;
  flex-wrap: wrap;
  gap: 40px;
  align-items: flex-start;
  justify-content: space-between;
}

/* Left Section */
.left-section {
  flex: 1;
  min-width: 300px;
  text-align: left;
}

.left-section img {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px;
}

.left-section h2 {
    max-width: 300px;
  font-size: 24px;
  font-weight: 600;
  color: #000;
  margin-bottom: 20px;
}
/* Right Section */
.right-section {
  flex: 2;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.right-section .row h2 {
  font-size: 32px;
  font-weight: 600;
  color: #000;
  margin-bottom: 10px;
}
.right-section h2 {
  text-transform:uppercase;  
}
.conten-part h4{
    text-transform: math-auto;
    color:#fff;
    font-size: 30px;
    margin-bottom: 10px;
}
.conten-part p {
    color: #fff !important;
    font-size: 16px !important;
}
/* Reward Cards Row */
.right-section .row:last-child {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* Reward Card */
.reward-card {
  
}


/* Card Icon */
.reward-card .icon img {
   max-width: fit-content;
    height: 55px;
    object-fit: contain;
    margin-bottom: 10px
}

/* Card Text */
.reward-card p {
    text-transform: math-auto;
  font-size: 14px;
  color:#000000;
  margin: 0;
  line-height: 1.5;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .right-section .row:last-child {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .reward-section .container {
    flex-direction: column;
    align-items: center;
  }

  .left-section {
    text-align: center;
    margin-bottom: 30px;
  }

  .right-section .row:last-child {
    grid-template-columns: 1fr;
  }

  .right-section .row h2 {
    text-align: center;
  }
}


.custom-rewards-sec {
  max-width:1240px;
  margin:auto;
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
  text-align: center;
  padding: 60px 20px;
  font-family: "Poppins", sans-serif;
  background: #020202 url("https://cesl.brandsnarrative.com/wp-content/uploads/2025/10/Mask-group.svg") no-repeat center top;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.custom-rewards-sec h2 {
  text-transform: uppercase;
  color: #333;
  font-size: 22px;
  letter-spacing: 1px;
  margin-bottom: 40px;
}

.custom-rewards-sec .reward-cards {
  display: flex;
  justify-content: center;
  gap: 25px;
  flex-wrap: wrap;
  align-items: stretch; /* ✅ Ensures equal height */
}

.custom-rewards-sec .reward-card {
 box-shadow: 0px 2px 16.8px 0px #FDDF77 inset;
    /*border: 1px solid #e6c94c;*/
    border-radius: 10px;
    width: 360px;
    padding:30px 30px 0 30px;
    text-align: left;
    position: relative;
    background: linear-gradient(179.7deg, rgba(9, 2, 2, 0.28) 26.16%, rgba(2, 2, 2, 0.28) 156.47%
156.47%
);
      transition: all 0.4s 
ease;  
}
.cta-arrow{
    
}
.custom-rewards-sec .reward-card:hover {
  transform: translateY(-5px);
}

.custom-rewards-sec .reward-card .icon {
  margin-bottom:5px;
}

.custom-rewards-sec .reward-card .icon img {
 width: 70px;
 object-fit: contain;
 height: 70px;
 filter: brightness(0) saturate(100%) invert(69%) sepia(84%) saturate(424%) hue-rotate(14deg) brightness(95%) contrast(89%);
}

.custom-rewards-sec .reward-card .desc {
  font-size: 16px;
  font-weight: 500;
  color: #fff;
  margin-bottom: 25px;
  flex-grow: 1; /* ✅ Helps fill vertical space evenly */
}

.custom-rewards-sec .reward-card .btn {
    margin-top: 15px !important;
    background: linear-gradient(180deg, #DBAA01 31.82%, #755B01 98.86%);
    display: inline-block;
    color: #fff;
    padding: 8px 18px;
    text-decoration: none;
    font-weight: 600;
    border-radius: 5px;
    margin-top: auto;
    
}

.custom-rewards-sec .refer-links {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: auto; /* ✅ Keeps consistent bottom alignment */
}

.custom-rewards-sec .refer-links span {
  font-weight: 600;
  color: #000;
}

.custom-rewards-sec .social-icons a img {
  width: 22px;
  height: 22px;
  vertical-align: middle;
}
.main-banner-sec {
    background-size: cover !important;
    background-position: center !important;
    width: 100%;
    background-repeat: no-repeat !important;
    position: relative;
    overflow: hidden;
}
.banner-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  min-height: 100vh; /* full height section */
}

.image-block {
  flex: 1;
  min-width: 60%;
}

.image-block img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.contact-form-section {
  flex: 1;
  min-width: 40%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px 20px;
}
.pass-word-filed{
    display:none;
}
.contact-form-section label{
    color:#fff !important;
}

.form-content {
  margin-top:90px;
  max-width: 450px;
  width: 100%;
  background: linear-gradient(180.04deg, #FAC200 -3.82%, #000000 76.85%);
  padding: 15px 25px;
  border-radius: 16px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}
.contact-form-section h2 {
    font-size: 30px;
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 0px;
}
.contact-form-section p {
  font-size: 16px;
  color: #fff;
  margin-bottom: 10px;
}
.forminator-design--default .forminator-label .forminator-required {
    color: #fff !important;
}
.forminator-ui.forminator-custom-form{
    margin:5px 0px !important;
}


.discount-section {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  padding: 40px 20px;
}

.discount-card {
  flex: 1 1 300px;
    max-width: 300px;
    background: #f8f7f4 url('/wp-content/uploads/2025/10/Group-47.png') no-repeat center;
     background-size: cover;
     background-repeat:no-repeat;
    border-radius: 16px;
    padding: 5px 10px;
    text-align: left;
    transition: all 0.4s ease;
    box-shadow: 0px 4px 6.3px 0px #E0D7B96E inset;
    color: #3D2B20CC;
    position: relative;
    overflow: hidden;
}

.discount-card::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle at top left, rgba(255,255,255,0.2), transparent 70%);
  transition: opacity 0.4s ease;
  opacity: 0;
}

.discount-card:hover::before {
  opacity: 1;
}

.discount-card:hover {
     background: #020202 url('/wp-content/uploads/2025/10/Group-44.png') no-repeat center;
     background-repeat:no-repeat;
      background-size: cover;
  color: #fff;
  box-shadow: 0 5px 20px rgba(0,0,0,0.3);
  transform: translateY(-5px);
}

.discount-card .icon {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-bottom: 20px;
}

.discount-card h2 {
  font-size: 40px;
  font-weight: 600;
  margin: 0 0 5px;
  line-height: 30px;
}

.discount-card h2 span {
  font-size: 40px;
  font-weight: 600;
}
.discount-card:hover h2 {
    color:#fff;
}
.discount-card:hover h5.dic{
    color: #ffff !important;
}
h5.dic {
    margin-bottom: 20px;
}
.right-logo-sec .select{
margin-right: 30px !important;
}
.discount-card p {
  font-size: 16px;
  color: #3D2B20CC;
}
.discount-card:hover p{
    color:#fff;
}
.discount-content {
    padding: 20px;
}
.forminator-button-submit {
    background: linear-gradient(180deg, #FFCB05 0%, #B8860B 100%) !important;
    border-radius: 5px !important;
}
.forminator-row{
  margin-bottom:10px!important;  
}
.language-select select{
    padding: 6px 10px!important;
    background: linear-gradient(180deg, #FFCB05 0%, #B8860B 100%)!important;
    color: #000 !important;
    border: 1px solid #00000000 !important;
}
@media (max-width: 768px) {
  .discount-section {
    flex-direction: column;
    align-items: center;
  }
  .discount-card {
    max-width: 90%;
  }
}
@media (min-width: 1024px) {
.contact-form-section .address-row .forminator-row{
    display: flex !important;
    gap: 20px !important;
}
#select-1{
    width:55% !important;
}
.contact-form-section .address-row .forminator-col, .contact-form-section .forminator-col-6{
    margin-bottom: 0px!important;
}
.contact-form-section .forminator-col-12{
    width:100% !important;
}

.forminator-ui.forminator-custom-form[data-grid=open] .forminator-row:not(:last-child) {
    gap: 20px;
    display: flex;
    margin-bottom: 10px;
}
}
/* Responsive Design */
@media (max-width: 991px) {
  .banner-wrapper {
    flex-direction: column;
  }

  .image-block,
  .contact-form-section {
    min-width: 100%;
  }

  .contact-form-section {
    padding: 40px 20px;
  }
}
@media (max-width: 767px) {
  .custom-rewards-sec .reward-card {
    width: 100%;
  }
  .hero-right{
      max-width: 100%;
    margin: auto;
  }
  .how-it-works{
      padding: 30px 15px;
  }
  .discount-card {
    flex: auto;
  }
  .reward-card {
    text-align: center;
}
.contact-form-section h2{
    font-size: 25px;
}
.countdown span{
    font-size: 2rem;
}

.top-custom-header img{
        max-width: 95px;
}

.top-custom-header{
    padding: 0px 8px;
    position: relative;
}
.form-content {
    margin-top: 0px;
}
.main-banner-sec .image-block {
    flex: initial;
}
.left-section img{
    max-width: 200px;
}
.language-select select {
    padding: 5px 8px;
    font-size: 14px;
}
.language-select p{
    font-size: 12px !important;
}
.top-custom-header .container{
    padding-top: 10px;
    padding-bottom: 10px;
}
}
.d-none{
    display: none !important;
}
