/**************************************************************************************************************************
    THEME SPECIFIC CSS
**************************************************************************************************************************/
/**************************************************************************************************************************
    BOMBAY DRAGON SUBSCRIBE FORM — CLEAN REBUILD
**************************************************************************************************************************/

.bd-subscribe-wrap {
    width: 100%;
    max-width: 580px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}

/* Kill CF7's default paragraph/br wrappers everywhere inside our form */
.bd-subscribe-wrap .wpcf7-form p,
.bd-subscribe-wrap .wpcf7-form br {
    display: none !important;
    margin: 0 !important;
}

/* The pill container */
.bd-subscribe-form {
    display: flex;
    align-items: center;
    width: 100%;
    background: #ffffff;
    border: 1px solid #eaeaea;
    border-radius: 100px;
    box-shadow: 0 10px 30px rgba(180, 49, 51, 0.12);
    padding: 6px;
    box-sizing: border-box;
}

/* Each field slot */
.bd-field {
    box-sizing: border-box;
}

.bd-field-name {
    flex: 1 1 35%;
    padding-left: 14px;
    border-right: 1px solid #eee;
}

.bd-field-email {
    flex: 1 1 45%;
    padding-left: 14px;
}

.bd-field-submit {
    flex: 0 0 auto;
    padding-left: 6px;
}

/* CF7 wraps every field in this span — strip it down so it doesn't add its own box model */
.bd-field .wpcf7-form-control-wrap {
    display: block;
    width: 100%;
}

/* Inputs: no border/background, just text */
.bd-field input[type="text"],
.bd-field input[type="email"] {
    display: block;
    width: 100%;
    height: 46px;
    line-height: 46px;
    padding: 0;
    margin: 0;
    border: none;
    background: transparent;
    font-size: 15px;
    font-family: inherit;
    color: #222222;
    box-shadow: none;
    outline: none;
    box-sizing: border-box;
}

.bd-field input[type="text"]:focus,
.bd-field input[type="email"]:focus {
    outline: none;
    box-shadow: none;
    background: transparent;
}

/* Submit button */
.bd-field-submit input[type="submit"] {
    display: block;
    height: 46px;
    line-height: 1;
    padding: 0 28px;
    margin: 0;
    border: none;
    border-radius: 100px;
    background: linear-gradient(135deg, #b43133, #8f2628);
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.bd-field-submit input[type="submit"]:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(180, 49, 51, 0.3);
}

/* Spinner — hidden by default, CF7 toggles it visible during actual AJAX submit */
.bd-field-submit .wpcf7-spinner {
    display: none;
    width: 20px;
    height: 20px;
    margin: 0 0 0 8px;
    vertical-align: middle;
}

.bd-field-submit .wpcf7-spinner.is-active {
    display: inline-block;
}

/* Turnstile widget — sits below the pill, centered, scaled down slightly */
.bd-subscribe-wrap .wpcf7-turnstile.cf-turnstile {
    display: flex;
    justify-content: center;
    transform: scale(0.85);
    transform-origin: center top;
}

/* Response message */
.bd-subscribe-wrap .wpcf7-response-output {
    width: 100%;
    margin: 0;
    padding: 10px 16px;
    text-align: center;
    border-radius: 8px;
    font-size: 14px;
    box-sizing: border-box;
}

/* Mobile: stack everything */
@media (max-width: 640px) {
    .bd-subscribe-form {
        flex-direction: column;
        align-items: stretch;
        border-radius: 20px;
        padding: 14px;
        gap: 10px;
        background: #ffffff;
    }

    .bd-field-name,
    .bd-field-email,
    .bd-field-submit {
        flex: 1 1 100%;
        width: 100%;
        padding-left: 0;
        border-right: none;
    }

    .bd-field-name {
        border-bottom: 1px solid #eee;
        padding-bottom: 10px;
    }

    .bd-field input[type="text"],
    .bd-field input[type="email"] {
        background: #f7f7f7;
        border-radius: 10px;
        padding: 0 12px;
    }

    .bd-field-submit input[type="submit"] {
        width: 100%;
        border-radius: 100px;
    }

    .bd-subscribe-wrap .wpcf7-turnstile.cf-turnstile {
        transform: scale(0.9);
    }
}

/**************************************************************************************************************************
    // END BOMBAY DRAGON SUBSCRIBE FORM — CLEAN REBUILD
**************************************************************************************************************************/

/****************** HEADER HOME **********************/
/* Core Header Setup */
.custom-header {
  position: fixed; 
  top: 0; 
  left: 0; 
  right: 0; 
  z-index: 9;
  padding: 20px 0; 
  background-color: rgba(255, 255, 255, 0); 
  transition: background-color 0.4s cubic-bezier(0.25, 1, 0.5, 1), padding 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s ease, backdrop-filter 0.4s ease;
  will-change: background-color, padding, box-shadow, backdrop-filter;
} 

/* Scrolled Header State */
.custom-header.scrolled {
  background-color: rgba(255, 255, 255, 0.80); 
  backdrop-filter: blur(12px); 
  -webkit-backdrop-filter: blur(12px); 
  padding: 12px 0; 
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03); 
  border-bottom: 1px solid rgba(255, 255, 255, 0.4); 
}

/* 1. Base Link Layout & Color Adjustments */
.custom-header .wp-block-navigation-item__content {
  color: #fff !important; 
  letter-spacing: 2px;
  text-decoration: none;
  position: relative; /* Required for the absolute line positioning */
  display: inline-block;
  transition: color 0.3s ease;
} 

.custom-header.scrolled .wp-block-navigation-item__content {
  color: #000000 !important;
}

/* 2. The Link Underline Effect */
.custom-header .wp-block-navigation-item__content::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -4px; /* Spaces the line slightly below the text */
  right: 0;
  width: 0;
  height: 2px;
  background: #fff; /* White line at the top */
  transition: width .5s;
}

/* Changes underline to black on scroll */
.custom-header.scrolled .wp-block-navigation-item__content::after {
  background: #000; 
}

/* 3. Hover Interaction */
.custom-header .wp-block-navigation-item__content:hover::after {
  left: 0;
  width: 100%;
}
/****************** ./ END HEADER HOME **********************/

/****************** HEADER PAGES **********************/
/* Core Header Setup */
.custom-header-pages {
  position: relative; 
  top: 0; 
  left: 0; 
  right: 0; 
  z-index: 9;
  padding: 20px 0; 
  background-color: rgba(255, 255, 255, 0); 
  transition: background-color 0.4s cubic-bezier(0.25, 1, 0.5, 1), padding 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s ease, backdrop-filter 0.4s ease;
  will-change: background-color, padding, box-shadow, backdrop-filter;
} 

/* Scrolled Header State */
.custom-header-pages.scrolled {
  background-color: rgba(255, 255, 255, 0.80); 
  backdrop-filter: blur(12px); 
  -webkit-backdrop-filter: blur(12px); 
  padding: 12px 0; 
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.03); 
  border-bottom: 1px solid rgba(255, 255, 255, 0.4); 
}

/* 1. Base Link Layout & Color Adjustments */
.custom-header-pages .wp-block-navigation-item__content {
  color: #000 !important; 
  letter-spacing: 2px;
  text-decoration: none;
  position: relative; /* Required for the absolute line positioning */
  display: inline-block;
  transition: color 0.3s ease;
} 

.custom-header-pages.scrolled .wp-block-navigation-item__content {
  color: #000000 !important;
}

/* 2. The Link Underline Effect */
.custom-header-pages .wp-block-navigation-item__content::after {
  content: '';
  display: block;
  position: absolute;
  bottom: -4px; /* Spaces the line slightly below the text */
  right: 0;
  width: 0;
  height: 2px;
  background: #000; /* White line at the top */
  transition: width .5s;
}

/* Changes underline to black on scroll */
.custom-header-pages.scrolled .wp-block-navigation-item__content::after {
  background: #000; 
}

/* 3. Hover Interaction */
.custom-header-pages .wp-block-navigation-item__content:hover::after {
  left: 0;
  width: 100%;
}
/****************** ./ END HEADER PAGES **********************/


/*********************** GRADIENT STARTING FROM BOTTOM TO TOP - (RED IN BOTTOM AND TRANSPARENET IN TOP) ***************************/
.home-blend-bottom::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 300px;
  background: linear-gradient(
    to bottom,
    rgba(162, 40, 39, 0) 0%,
    rgba(162, 40, 39, 0.013) 8.1%,
    rgba(162, 40, 39, 0.049) 15.5%,
    rgba(162, 40, 39, 0.104) 22.5%,
    rgba(162, 40, 39, 0.175) 29%,
    rgba(162, 40, 39, 0.259) 35.3%,
    rgba(162, 40, 39, 0.352) 41.2%,
    rgba(162, 40, 39, 0.45) 47.1%,
    rgba(162, 40, 39, 0.55) 52.9%,
    rgba(162, 40, 39, 0.648) 58.8%,
    rgba(162, 40, 39, 0.741) 64.7%,
    rgba(162, 40, 39, 0.825) 71%,
    rgba(162, 40, 39, 0.896) 77.5%,
    rgba(162, 40, 39, 0.951) 84.5%,
    rgba(162, 40, 39, 0.987) 91.9%,
    rgba(162, 40, 39, 1) 100%
  );
  pointer-events: none;
  z-index: 1;
}
/***********************  ./ END OF GRADIENT STARTING FROM BOTTOM TO TOP - (RED IN BOTTOM AND TRANSPARENET IN TOP) ***************************/

.remove-duotone-hover:hover img {
    filter: none !important;
}

.hero-buttons {position:absolute; bottom:6% !important; left:0; right:0;}
@media ony screen and (max-width:767px) {
    .hero-buttons {bottom:20% !important;}
}

/************************************************************
    CONTACT FORM 7 CONTACT PAGE
*************************************************************/
/* Container */
.custom-cf7-wrapper {
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; max-width: 800px; margin: 0 auto; padding: 20px; box-sizing: border-box;}

/* Layout Grid */
.cf7-row {display: flex; gap: 40px; margin-bottom: 30px; flex-wrap: wrap;}

.cf7-col { flex: 1; display: flex; flex-direction: column;}

.cf7-col.full-width { flex: 100%;}

/* Labels */
.custom-cf7-wrapper label {font-size: 14px; font-weight: 700; color: #4a4a4a; margin-bottom: 10px; text-transform: capitalize; letter-spacing: 0.5px;}

/* Inputs, Selects, Textareas */
.custom-cf7-wrapper input[type="text"],
.custom-cf7-wrapper input[type="email"],
.custom-cf7-wrapper select,
.custom-cf7-wrapper textarea {width: 100%; padding: 10px 0; border: none; border-bottom: 1px solid #cccccc; background: transparent; font-size: 16px; color: #666; outline: none; border-radius: 0; box-shadow: none; transition: border-color 0.3s ease;}

/* Placeholder Styling */
.custom-cf7-wrapper ::placeholder {color: #999; opacity: 1;}

/* Focus State */
.custom-cf7-wrapper input:focus,
.custom-cf7-wrapper select:focus,
.custom-cf7-wrapper textarea:focus {border-bottom-color: #333;}

/* Dropdown Arrow Styling */
.custom-cf7-wrapper select {appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E");
background-repeat: no-repeat; background-position: right 10px top 50%; background-size: 10px auto; cursor: pointer;}

/* Message Textarea Height */
.custom-cf7-wrapper textarea {height: 100px; resize: vertical; border-bottom: 1px solid #cccccc; /* Ensure line is visible */}

/* Submit Button */
.custom-cf7-wrapper input[type="submit"] { background-color: #b92b27; /* Deep Red */ color: #ffffff; border: none; padding: 18px 30px; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; cursor: pointer; width: 100%; transition: background-color 0.3s ease; border-radius: 0;}

.custom-cf7-wrapper input[type="submit"]:hover {background-color: #8a1f1c;}

.wpcf7 form .wpcf7-response-output {margin:0;}

/* Responsive */
@media (max-width: 600px) {
    .cf7-row {
        gap: 20px;
    }
    .cf7-col {
        flex: 100%;
    }
}
/************************************************************
    ./ END OF CONTACT FORM 7 CONTACT PAGE
*************************************************************/