@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

body {
    font-family: "Inter", sans-serif;
    font-weight: 400;
    font-size: 18px;
    color:rgba(0, 0, 0, 1);
    overflow-x: hidden;
  
  }
  .container{
    max-width: 1280px;
  }
  
  .lead {
    font-size: 18px;
    font-weight: 300;
    font-family: "Inter", sans-serif;
}
  .hero {
    background: #243746;
    color: #fff;
  }
  .hero h1 {
    font-family: "orpheuspro", serif;
    font-weight: 400;
    font-style: Regular;
    font-size: 64px;
  }
  .section-title {
    font-family: "orpheuspro", serif;
    font-weight: 400;
    font-style: Regular;
    font-size: 64px;
    margin-bottom: 1rem;
  }
.bg-light-box-inner{
    max-width: 500px;
    margin: 0 auto;

}
.bg-light {
    background: linear-gradient(0deg, #D6D1CA, #D6D1CA),
linear-gradient(0deg, var(--Warm-Clay, #EAE8E5), var(--Warm-Clay, #EAE8E5));
  }
  

  .bg-light-about{  
    background: rgba(214, 209, 202, 1);
  }
  .bg-light-box-inner-about {
    max-width: 538px;
    margin: 0 auto;
}
.bg-light-home{
    background: var(--Warm-Clay, rgba(234, 232, 229, 1));

}
.bg-light-home h3{
    font-family: "orpheuspro", serif;
    font-weight: 400;
    font-style: Regular;
    font-size: 48px;
}

.bg-light-box-prouct {
    max-width: 550px;
    margin: 0 auto;
}

  .bg-light-box{
    background: var(--Warm-Clay, rgba(234, 232, 229, 1));
  }
.btn-light:hover{
    background-color: #e9ebec;
}
.btn-dark:hover{
    background-color: #134668!important;  
}
.btn-dark {
    color: #fff;
    background: rgba(16, 54, 79, 1);
   font-family: "Roboto", sans-serif;
   font-size: 16px;
   font-weight: 500;
   letter-spacing: 0.5px;

}
.btn{
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.5px;
    padding: 12px;
    border-radius: 5px;
    text-transform: uppercase;
    border: none;
  }
.marble-stone-bg{
    background: url(../img/Marbled\ Stone.png);
    background-size: cover;
    background-position: 100%;
    background-repeat: no-repeat;
}
/* .icon-set{
    border: 1px solid rgba(255, 255, 255, 1)
}


  .icon {
    font-size: 1.5rem;
    margin-right: .5rem;
  } */
  footer {
    background: rgba(127, 123, 119, 1);
    color: #fff;
    padding: 1rem 0;
    text-align: center;

  }
  .footer-logo{
    padding-top: 24px;
  }
  .footer-txt{
    color: rgba(255, 255, 255, 1);
    font-size: 14px;
    font-weight: 400;
    padding-top: 45px;
    text-align: center;
    display: block;
    
  }
  
  .small, .small {
    font-family: "Inter", sans-serif;
    font-size: 18px;
    font-weight: 300;
    font-style:italic;
    color: #BABABA;

}

.icon-ring {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 1);
 
 
  }
  .icon-set{
    width:24px;
    height:24px;
  }
  .marble-stone-bg h5{
    font-family: "orpheuspro", serif;
    font-weight: 400;
    font-size: 22px;
    color: #fff;
    letter-spacing: 0.5px;

  }
  .eyepillow-banner{
    max-width: 1140px;
    margin: 0 auto;
  }

  /* Small screens */
  @media (max-width: 575.98px) {
    .eyepillow-banner {
      padding: 0.9rem !important;
    }
    .icon-ring {
      width: 38px;
      height: 38px;
      font-size: 1rem;
    }
  }


   /* Light canvas/frame like the screenshot */
   .product-frame{
    background: #fff;
    padding: 2.25rem;
    min-height: 460px;               /* keeps a steady stage height */
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* Keep image nicely contained */
  .product-img{
    max-height: 548px;
    object-fit: contain;
  }
  /* Subtle dot indicators */
  .carousel-indicators [data-bs-target]{
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background-color: #6c757d;
    opacity: .4;
  }
  .carousel-indicators .active{
    opacity: 1;
  }
  @media (max-width: 575.98px){
    .product-frame{ padding: 1rem; min-height: 360px; }
    .product-img{ max-height: 320px; }
  }
 @media (max-width: 768px){
    .hero h1{font-size: 32px; line-height: 38px;}
    .section-title{font-size: 32px; line-height: 38px;}
    .lead{font-size: 16px; line-height: 24px;}
    .product-frame{min-height: 360px;}
    .product-img{max-height: 320px;}

 }
  
/*form-css*/

.wrapper{padding-top: 95px;}
    .container { max-width: 1280px; width: 100%; margin: 0 auto; }
    .header { position: fixed;  width: 100%; margin: 0 auto; padding: 16px 10px;top: 0;z-index: 9;background: #fff; }
    .logo_main { padding: 16px 39px; }
    .fw-semi-bold { font-weight: 600 !important; }
    .banner-main { background: #243746; position: relative; }
    .back-home { position: absolute; top: 27px; left: 27px; z-index: 9; }
    .back-home a { text-decoration: none; color: #fff; }
    .back-home a span { font-size: 15px; font-family: "Inter", sans-serif; color: #fff; line-height: 18px; }
    .title { font-size: 64px; color: #fff; font-family: "orpheuspro", serif; line-height: 72px; font-weight: 400; margin: 0; }
    .form-label { margin-bottom: 10px; font-size: 18px; color: #000; font-family: "Inter", sans-serif; font-weight: 400; }
    .form-check .form-check-label { padding: 7px 11px; font-size: 18px; color: #000; font-weight: 300; line-height: 20px; }
    .form-check .form-check-label span { font-style: italic; margin-top: 19px; }
    .form-main { padding: 80px 16px; }
    .form-main .container { max-width: 1160px; width: 100%; margin: 0 auto; }
    .form-check .form-check-input { width: 32px; height: 32px; margin-left: 0; opacity: 1; border: 1.5px solid #10364F;}
    .form-check { padding-left: 0; margin-bottom: 16px; }
    .form-check-input:checked[type=radio] { background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16.534" height="16.534" viewBox="0 0 16.534 16.534"><circle id="Ellipse_3" data-name="Ellipse 3" cx="8.267" cy="8.267" r="8.267" fill="%2310364f"/></svg>') no-repeat center; }
    .form-radio-main { margin-top: 11px; }
    .heading_2 { font-size: 35px; font-family: "orpheuspro", serif; color: #000; }
    .spa-bo-info { padding: 46px 0; }
    .form-select { border: 1px solid rgba(0, 0, 0, 0.1); background: rgba(247, 247, 247, 1); font-family: "Inter", sans-serif; font-weight: 400; height: 56px; border-radius: 0; font-size: 18px; appearance: none; -webkit-appearance: none; -moz-appearance: none; background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="19.12" height="11.154" viewBox="0 0 19.12 11.154"><path id="Vector_1" data-name="Vector 1" d="M1.173,1.093l9.02,9,7.98-9" transform="translate(-0.112 -0.032)" fill="none" stroke="%23000" stroke-linecap="round" stroke-width="1.5"/></svg>') no-repeat right 16px center; }
    .form-control { border: 1px solid rgba(0, 0, 0, 0.1); background: rgba(247, 247, 247, 1); font-family: "Inter", sans-serif; font-weight: 400; height: 56px; border-radius: 0; font-size: 18px; appearance: none; -webkit-appearance: none; -moz-appearance: none; }
    .mt-49 { margin-top: 49px; }
    textarea.form-control { height: 210px; }
    /* .btn-dark { min-width: 170px; height: 47px; padding: 12px 16px; border-radius: 5px; background: #243746 !important; color: #FFFFFF; font-family: "Inter", sans-serif; font-weight: 500; font-size: 16px; text-align: center; vertical-align: middle; text-transform: uppercase; background: #FFFFFF; } */
    .main-order-info { border-top: 1px solid #00000026; border-bottom: 1px solid #00000026; padding: 50px 0; margin-bottom: 30px; }
    .form-check.d-flex .form-check-input{flex: 0 0 32px;}
    .banner-img img {width: 100%;}
    @media(min-width:768px) {
    .custom-lft-grid { width: 55%; }
    .custom-rft-grid { width: 45%; }
    .max-487 { max-width: 487px; width: 100%; }
    }
    @media(max-width:991px){
    .title { font-size: 45px; line-height: 50px; }  
    } 
    @media(max-width:767px){
    .title {font-size: 23px; line-height: 28px; }
    }
    @media(max-width:575px){
        .banner-title{padding: 40px 10px;}
        .form-label{font-size: 16px;}
        .banner-grid .row{flex-direction: column-reverse;}
        .banner-img{position: relative;}
        .heading_2 {font-size: 30px;}
        .banner-img::before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);}
    }