/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/*
    Add your custom styles here
*/

/*step form header*/
a.step_header {
    color: #0D062A;
}
a.step_header:hover {
    color: #CB1112;
}

/* ===== STEP ===== */
.step{
  display:none;
}
h2.step_tittle {
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    font-family: 'Inter';
    margin-bottom: 30px;
    color: #0D062A;
}
.step.active{
  display:block;
}

/* ===== GRID ===== */
.service-grid {
	justify-content: center;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 30px;
    max-width: 1100px;
    margin: 0px auto;
    text-align: center;
}
.service-box:has(input:checked) img{
  filter: brightness(0) saturate(100%) invert(16%) sepia(92%) 
          saturate(6300%) hue-rotate(357deg) brightness(90%) contrast(120%);
}
/* ===== BOX ===== */
.service-box {
    background: #fff;
    padding: 60px 0px;
    cursor: pointer;
    transition: .3s;
/*     width: 400px; */
}
.icon img {
    width: 130px;
}
.service-box p {
    font-weight: 600;
    font-size: 24px;
    color: #0D062A;
    font-family: inter;
    margin-top: 30px;
}

/* hide checkbox */
.service-box input{
  display:none;
}

/* active */
.service-box:has(input:checked) p{
  border-color:red;
  color:red;
}

/*===Step2===-*/
.time-options {
    max-width: 800px;
    margin: 0 auto;
    background-color: #FFFFFF;
    padding: 40px;
}

.time-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    border: 1px solid #e5e5e5;
    padding: 24px 20px;
    margin-bottom: 25px;
    cursor: pointer;
    transition: .3s;
}
span.check_box-text {
    color: #0D062A;
    font-weight: 500;
    font-size: 20px;
    font-family: 'Inter';
	line-height:24px;
}
/* hide radio */
.time-box input{
  display:none;
}

.time-box .check{
  width:22px;
  height:22px;
  border:1px solid #ccc;

  display:flex;
  align-items:center;
  justify-content:center;

  font-size:14px;
  font-weight:bold;
}

/* ===== ACTIVE ===== */
.time-box:has(input:checked) {
    background: #FAECEC;
    color: #CB1112;
    border: none;
}
.time-box:has(input:checked) span {
    color: #CB1112;
    font-weight: 600;
}
/* GREEN BOX */
.time-box:has(input:checked) .check{
  background:#CB1112;
  border-color:#CB1112;
  color:#fff;
}

/* WHITE CHECK ICON */
.time-box:has(input:checked) .check::after{
  content:"✓";
  color:#fff;
}

/*===Step4===-*/
/* ===== FORM CARD ===== */
.details-form {
    max-width: 660px;
    margin: 0px auto;
    background: #fff;
    padding: 40px 30px;
}
.form-group label {
    display: block;
    font-weight: 500;
    margin-bottom: 10px;
    color: #0D062A;
    font-size: 16px;
    font-family: 'Inter';
}
.form-group input, .form-group textarea {
    width: 100%;
    background: #F9F9F9;
    border: none;
    padding: 18px;
    font-size: 16px;
    outline: none;
    color: #747982;
    font-family: 'Inter';
}

/* ===== FOCUS ===== */
.form-group input:focus,
.form-group textarea:focus{
  border:#none;
  background:#F9F9F9;
}

/* ===== TEXTAREA ===== */
.form-group textarea{
  min-height:180px;
  resize:none;
}

/* ===== TWO COLUMN WITH REAL GAP ===== */
.row{
  display:grid;
  grid-template-columns:1fr 1fr;

  column-gap:25px;   /* HORIZONTAL GAP FIX */
  row-gap:20px;
}

/* REMOVE CONFLICT MARGIN INSIDE ROW */
.row .form-group input{
  margin-bottom:0;
}

/* ===== NORMAL SPACING ===== */
.form-group{
  margin-bottom:22px;
}




/*===Step5===*/
.icon-box {
    margin-bottom: 35px;
}
.thank-wrapper {
    max-width: 870px;
    padding: 0px 20px;
    text-align: center;
    margin: 0 auto;
}
img.thanku-img {
    width: 236px;
}
.thanku_title {
    font-weight: 600;
    color: #0D062A;
    font-family: inter;
    font-size: 40px;
    line-height: 45px;
}
.thanku-text {
    font-size: 24px;
    line-height: 30px;
    color: #0D062A;
    font-family: 'Inter';
    font-weight: 400;
	 margin-top: 8px;
}
.thanku-text-one {
    font-size: 24px;
    line-height: 30px;
    color: #0D062A;
    font-family: 'Inter';
    font-weight: 400;
    margin-top: 25px;
}
a.thanku_btn {
    background-color: #CB1112;
    color: #fff;
    padding: 17px 52px 17px 52px;
    font-size: 16px;
    font-family: 'Inter';
    font-weight: 600;
}
a.thanku_btn:hover {
    background-color: #fff;
    color: #0D062A;
    border: 1px solid #0D062A;
}
.thanks_btn {
    margin-top: 51px;
}
/* ===== BUTTON ===== */
.step_btn {
    display: flex;
    justify-content: center;
    margin-top: 40px;
    gap: 20px;
}
button.btn_next {
    background-color: #CB1112;
    color: #fff;
    font-size: 16px;
    font-family: 'Inter';
    font-weight: 500;
    padding: 10px 57px 10px 57px;
}
button.btn_next:hover {
    border: 1px solid #0D062A;
    background-color: #fff;
    color: #0D062A;
}
button.btn_back {
    border: 1px solid #0D062A;
    color: #0D062A;
    font-family: 'Inter';
    font-size: 16px;
    font-weight: 500;
    background-color: #fff;
    padding: 10px 35px 10px 35px;
}
button.btn_back:hover {
    color: #fff;
    background-color: #CB1112;
}
.iti {
    position: relative;
    display: block;
}

/*Step form Responsive*/
@media (max-width:767px){
h2.step_tittle {
    font-size: 24px;
    margin-bottom: 25px;
}
.service-grid {
    grid-template-columns: repeat(2,1fr);
    gap: 15px;
}
	.service-box {
    padding: 20px 10px;
    width: 100%;
}
.icon img {
    width: 60px;
}
.service-box p {
    font-size: 15px;
    margin-top: 15px;
    margin-bottom: 0px;
    line-height: 18px;
}
h2.step_tittle {
    font-size: 25px;
}
	.time-options {
    padding: 20px;
}
span.check_box-text {
    font-size: 16px;
}
.time-box {
    padding: 15px 15px;
}
.row {
    grid-template-columns: none;
    row-gap: 0px;
}
button.btn_next {
    padding: 10px 35px 10px 35px;
}
	img.thanku-img {
    width: 120px;
}
	.thanku_title {
    font-size: 24px;
    line-height: 30px;
}
	.thanku-text-one {
    font-size: 16px;
    line-height: 26px;
}
	.thanku-text {
    font-size: 16px;
    line-height: 26px;
}
	a.thanku_btn {
    padding: 10px 25px 10px 25px;
}
}
@media (min-width:768px) and (max-width:1024px){
.service-grid {
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}
.service-box {
    padding: 30px 0px;
}
	.icon img {
    width: 90px;
}
	.service-box p {
    font-size: 22px;
    margin-top: 25px;
}
}
.phone_error{
	margin-top: 15px;
}
.error_msg p, .phone_error, .eir_error{
    color: #CB1112;
    padding: 5px 15px;
    background-color: #cb111226;
    border-radius: 2px;
}
