/* box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); */
/* box-shadow: 0px 187px 75px rgba(0, 0, 0, 0.01), 0px 105px 63px rgba(0, 0, 0, 0.05), 0px 47px 47px rgba(0, 0, 0, 0.09), 0px 12px 26px rgba(0, 0, 0, 0.1), 0px 0px 0px rgba(0, 0, 0, 0.1); */
/* border-radius:15px; */
/* use linear graduant for product card backgrpund */
/* #FFFFFF */

/* repeated sryling */
 :root {
      --primary: #FF6F00;
      /* --secondary:#800000; */
      --secondary: #ff0000;
      --text: #3E2723;
      --button : #FBC02D ;
      /* --button : #FFD700 ;    */
      --white : white;
  }

/* :root {
    --primary: #fa6c13;
      --secondary:#FFBF78;
    --white: white;
    --grey: white;
   
} */

body {
    background-color: var(--white) !important;
}
 .section_container{
    padding: 10px;
    background-color:var(--secondary) ;
    border-radius: 20px;
  }

.box_sadow {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.295);
}
 /* .box-shadow{
 box-shadow:  -2px 2px hsl(0 0 100% / 1),
    -20px 20px 40px hsl(0 0 0 / .25) ;
 } */
   
.bg_primary{
    background-color: var(--primary);
}
.text_primary{
    color: var(--primary);
}
.bg_secondary{
    background-color: var(--secondary);
}
.border_primary{
 border: 2px solid var(--primary);
}
.text_justify{
    text-align: justify;
}
.heading_underline{
    /* background-color: var(--primary); */
    border:3px solid var(--primary);
    border-radius:10px;
    width:15rem;
    margin:auto;
    margin-bottom: 15px;
}
/*........................... card styleing ...............................*/


/* .top-box {
    position: relative;
    border-radius: 20px;
    overflow-y: visible;
    top: -20px;
    left: 0px;
    right: 0px;
    background: var(--white);
} */
/* .top-box img {
    position: relative;
    border-radius: 20px;
    top: -40px;
    left: 0px;
    right: 0px;
}  */
/* .content{
    position: relative;
    top: 50%;
    left: 0px;
    right: 0px;
} */
/* .btn-half {
    width: 50%;
    border-radius: 0;
    font-weight: 600;
    padding: 10px 0;
    text-align: center;
    font-size: 17px;
} */

.btn-half {
  width: 50%;             /* Keep half width on desktop */
  border-radius: 0;
  font-weight: 600;
  padding: 6px 0;         /* Reduced vertical padding */
  text-align: center;
  font-size: 14px;        /* Smaller font size */
  box-sizing: border-box;
}

/* Small devices: full width but also smaller height */
@media (max-width: 576px) {
  .btn-half {
    width: 100%;
    font-size: 13px;      /* Slightly smaller font on mobile */
    padding: 6px 0;       /* Balanced padding for tap targets */
  }
}

/* Medium devices: can keep 50% or adjust if needed */
@media (min-width: 577px) and (max-width: 767px) {
  .btn-half {
    width: 50%;
    font-size: 14px;
    padding: 6px 0;
  }
}

.primary_btn {
     border: 2px solid var(--primary);
    background-color: var(--primary);
    border-radius: 25px;
    color: var(--white);
}

.primary_btn:hover {
    border: 2px solid var(--primary);
    border-radius: 25px;
    color: var(--primary);
}

.secondary_btn {
    margin-left: 10px;
    border: 3px solid var(--primary);
    border-radius: 25px;
    color: var(--primary);
}

.secondary_btn:hover {
     border: 3px solid var(--primary);
    background-color: var(--primary);
     /* border: 2px solid var(--primary);
    background-color: var(--primary); */
    color: var(--white);
}

.big_btn{   
    font-size: 1.25rem;
    border-radius: 25px;
    border: 2px solid var(--primary);
    background-color: var(--primary);
    color: var(--white);
     
}
.big_btn:hover{
    color: var(--primary);
    border: 2px solid var(--primary);
}
.img_alignment_container{
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 0.375rem;
     }
     .img_alignment_container img{
        height: 20rem;
        width: 30rem;
     }