/*
Theme Name: Houzez Child
Theme URI: http://www.favethemes.com/
Author: Favethemes
Author URI: http://www.favethemes.com/
Description: Houzez is a premium WordPress theme for real estate agents where modern aesthetics are combined with tasteful simplicity, and where the ease of use is achieved without compromise in your ability to customise the design. Whether you are a real estate agent looking to build a website for your company or a web developer seeking a perfect WordPress theme for your next project, you are certain to appreciate the numerous features and benefits that our theme provides.
Version: 1.0
Tags: white, right-sidebar, left-sidebar, custom-colors, custom-menu, featured-images, post-formats, theme-options, translation-ready
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: houzez
Template: houzez
*/

@import url("../houzez/style.css");
/* Your CSS code goes here
-------------------------------------- */

.h2s-step-item {
    flex: 1;
    min-width: 250px;
    position: relative;
    padding: 0 20px;
}
.h2s-step-desc {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    max-width: 260px;
    margin: 0 auto;
}
/* Desktop Vertical Dividers */

.h2s-step-item:not(:last-child) {
    border-right: 1px solid #eaeaea;
}
/* Arrow Layout Positioning */

.h2s-step-arrow {
    position: absolute;
    top: 40%;
    right: 0;
    transform: translateX(50%);
    color: #c99339;
    font-size: 24px;
    background-color: #fff;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}
/* SVG Global Controller */

.h2s-svg-controller svg {
    width: 45px !important;
    height: 45px !important;
    fill: #c99339 !important;
}
/* Mobile Responsive Grid Alterations */

@media (max-width: 768px) {
    .h2s-step-arrow {
        display: none !important;
    }
    /* Force columns to split 50/50 exactly */
    .h2s-step-item {
        flex: 0 0 50% !important;
        max-width: 50% !important;
        min-width: 0 !important;
        padding: 0 10px !important;
        margin-bottom: 40px;
        border-right: none !important;
    }
    /* Elegant single divider line between column 1 and column 2 */
    .h2s-step-item:nth-child(1) {
        border-right: 1px solid #eaeaea !important;
    }
    /* Prevent structural text squishing on narrow screens */
    .h2s-step-desc {
        max-width: 100% !important;
        padding: 0 10px;
    }
}
.h2s-stats-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    background: #fff;
    padding: 40px 0;
    border-top: 1px solid #eaeaea;
    border-bottom: 1px solid #eaeaea;
}
.h2s-stat-item {
    flex: 1;
    text-align: center;
    border-right: 1px solid #eaeaea;
    padding: 0 15px;
}
.h2s-stat-item:last-child {
    border-right: none;
}
.h2s-stat-value {
    font-size: 42px;
    color: #c99339;
    font-family: serif;
    /* Adjust to match your theme's serif font */
    line-height: 1;
    margin-bottom: 10px;
}
.h2s-stat-suffix {
    font-size: 32px;
}
.h2s-stat-label {
    font-size: 14px;
    color: #333;
    font-weight: 600;
}
/* Mobile & Tablet Responsiveness */

@media (max-width: 992px) {
    .h2s-stat-item {
        flex: 0 0 33.333%;
        margin-bottom: 30px;
        border-right: none;
    }
}
@media (max-width: 768px) {
    .h2s-stats-wrapper {
        padding: 30px 0 0 0;
        border: none;
    }
    .h2s-stat-item {
        flex: 0 0 50%;
    }
}
/* Typography & Buttons */

.h2s-feat-wrapper h6 {
    color: #c99339;
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 5px;
}
.h2s-feat-wrapper h2 {
    font-size: 32px;
    color: #333;
    font-weight: normal;
    margin-bottom: 0;
}
.h2s-btn-outline {
    border: 1px solid #ddd;
    padding: 10px 20px;
    color: #333;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    border-radius: 4px;
    transition: all 0.3s ease;
}
.h2s-btn-outline:hover {
    background: #333;
    color: #fff;
}
.h2s-btn-solid {
    background: #c99339;
    color: #fff;
    padding: 12px 24px;
    display: inline-block;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    border-radius: 4px;
    transition: all 0.3s ease;
}
.h2s-btn-solid:hover {
    background: #b07d2c;
    color: #fff;
}
/* Layout Structure */

.h2s-feat-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 30px;
}
.h2s-feat-card {
    display: flex;
    background: #fff;
    border: 1px solid #eaeaea;
    border-radius: 8px;
    overflow: hidden;
}
/* Columns */

.h2s-fc-image {
    flex: 0 0 45%;
    background-size: cover;
    background-position: center;
    position: relative;
    min-height: 350px;
}
.h2s-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    background: rgba(201, 147, 57, 0.9);
    color: #fff;
    padding: 6px 12px;
    font-size: 12px;
    font-weight: bold;
    border-radius: 4px;
}
.h2s-fc-content {
    flex: 0 0 30%;
    padding: 40px;
    border-right: 1px solid #eaeaea;
}
.h2s-fc-title {
    font-size: 22px;
    color: #333;
    margin-bottom: 5px;
}
.h2s-fc-location {
    color: #c99339;
    font-size: 14px;
    margin-bottom: 25px;
}
.h2s-fc-features {
    list-style: none;
    padding: 0;
    margin: 0 0 30px 0;
}
.h2s-fc-features li {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    font-size: 14px;
    color: #555;
}
.h2s-feat-icon {
    color: #c99339;
    margin-right: 12px;
    font-size: 18px;
    width: 20px;
    text-align: center;
}
.h2s-feat-icon svg {
    width: 18px;
    fill: #c99339;
}
.h2s-fc-yield-container {
    flex: 0 0 25%;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.h2s-fc-yield-box {
    border: 1px solid #eaeaea;
    text-align: center;
    border-radius: 4px;
    height: 100%;
    display: flex;
    flex-direction: column;
}
/* Yield Box Styling */

.h2s-yield-top {
    padding: 30px 20px;
    border-bottom: 1px solid #eaeaea;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.h2s-yield-top p {
    font-size: 13px;
    color: #666;
    margin-bottom: 10px;
}
.h2s-yield-top h4 {
    font-size: 38px;
    color: #c99339;
    font-family: serif;
    margin: 0 0 5px 0;
    line-height: 1;
}
.h2s-yield-top span {
    font-size: 12px;
    color: #999;
}
.h2s-yield-bottom {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    /* Prevents children from stretching vertically */
    padding: 20px 10px;
    background: #fafafa;
}
.h2s-yb-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* Centers icon and text */
    text-align: center;
    color: #c99339;
    padding: 0 5px;
}
.h2s-yb-item svg {
    width: 24px !important;
    height: 24px !important;
    /* This stops the SVG from stretching */
    fill: #c99339 !important;
    margin-bottom: 8px;
    display: block;
}
.h2s-yb-item p {
    font-size: 11px;
    color: #555;
    margin: 0;
    line-height: 1.3;
}
/* High-End Mobile Responsiveness */

@media (max-width: 1024px) {
    .h2s-feat-card {
        flex-direction: column;
    }
    .h2s-fc-image {
        min-height: 300px;
        flex: auto;
    }
    .h2s-fc-content {
        flex: auto;
        border-right: none;
        border-bottom: 1px solid #eaeaea;
        padding: 30px;
    }
    .h2s-fc-yield-container {
        flex: auto;
        padding: 30px;
    }
}
@media (max-width: 768px) {
    .h2s-feat-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }
    .h2s-fc-image {
        min-height: 250px;
    }
    .h2s-fc-content {
        padding: 20px;
    }
    .h2s-fc-yield-container {
        padding: 20px;
    }
    .h2s-yield-top h4 {
        font-size: 32px;
    }
}
/* CITY CAROUSAL ============== */

/* CORE SWIPER FALLBACK: Prevents vertical stacking on frontend before JS loads */

.h2s-dest-carousel {
    overflow: hidden;
    position: relative;
}
.h2s-dest-carousel .swiper-wrapper {
    display: flex;
    flex-wrap: nowrap;
    transition-property: transform;
}
.h2s-dest-carousel .swiper-slide {
    flex-shrink: 0;
    width: 100%;
    transition-property: transform;
}
/* Card UI */

.h2s-dest-card {
    display: block;
    border: 1px solid #eaeaea;
    border-radius: 6px;
    overflow: hidden;
    text-decoration: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    background: #fff;
}
.h2s-dest-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.05);
}
/* Image Aspect Ratio */

.h2s-dc-image {
    width: 100%;
    padding-top: 85%;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid #eaeaea;
    background-color: #f5f5f5;
}
/* Card Content */

.h2s-dc-content {
    padding: 15px 10px;
}
.h2s-dc-content h3 {
    font-size: 16px;
    color: #333;
    margin: 0 0 5px 0;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.h2s-dc-content p {
    font-size: 12px;
    color: #c99339;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Outline Button */

.h2s-btn-outline {
    border: 1px solid #ddd;
    padding: 12px 24px;
    color: #333;
    text-decoration: none;
    font-size: 13px;
    font-weight: 600;
    border-radius: 4px;
    transition: all 0.3s ease;
    display: inline-block;
}
.h2s-btn-outline:hover {
    background: #333;
    color: #fff;
    border-color: #333;
}
/* Custom Swiper Arrow Styling */

.h2s-swiper-nav {
    color: #c99339;
    background: #fff;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.h2s-swiper-nav:after {
    font-size: 16px !important;
    font-weight: bold;
}
.swiper-button-prev {
    left: -15px;
}
.swiper-button-next {
    right: -15px;
}
/* Mobile Tweaks */

@media (max-width: 768px) {
    .h2s-dc-content {
        padding: 10px 5px;
    }
    .h2s-dc-content h3 {
        font-size: 14px;
    }
    .h2s-dc-content p {
        font-size: 11px;
    }
    .swiper-button-prev, .swiper-button-next {
        display: none;
    }
    /* Hide arrows on mobile to save screen space */
}
/* ======== TESTIMONIALS ============ */

.h2s-testi-carousel {
    overflow: hidden;
    position: relative;
    padding: 0 40px !important;
}
.h2s-testi-card {
    background: #fff;
    border: 1px solid #eaeaea;
    border-radius: 8px;
    padding: 30px;
    text-align: left;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.h2s-testi-body {
    display: flex;
    gap: 20px;
    margin-bottom: 25px;
}
.h2s-testi-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}
.h2s-testi-quote {
    font-size: 14px;
    color: #555;
    line-height: 1.6;
    position: relative;
}
.h2s-quote-icon {
    font-size: 32px;
    color: #c99339;
    font-family: serif;
    line-height: 1;
    margin-right: 5px;
    float: left;
    margin-top: -5px;
}
.h2s-testi-footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-left: 80px;
}
.h2s-testi-meta h4 {
    margin: 0;
    font-size: 15px;
    color: #c99339;
    font-weight: 600;
}
.h2s-testi-meta span {
    font-size: 12px;
    color: #777;
}
.h2s-testi-stars {
    color: #f5b301;
    font-size: 16px;
    letter-spacing: 2px;
}
.h2s-testi-nav {
    color: #c99339;
    background: transparent;
    width: 30px;
    height: 30px;
}
.h2s-testi-nav:after {
    font-size: 20px !important;
}
@media (max-width: 768px) {
    .h2s-testi-carousel {
        padding: 0 !important;
    }
    .h2s-testi-nav {
        display: none;
    }
    /* Hide arrows on mobile */
    .h2s-testi-footer {
        padding-left: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
}
/* =========== ENQUIRY ========= */
.h2s-enq-container {
    display: flex;
    border: 1px solid #eaeaea;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.03);
}
/* Left Column */

.h2s-enq-left {
    flex: 0 0 50%;
    padding: 30px 50px;
    background-size: cover;
    background-position: bottom center;
}
.h2s-enq-left h3 {
    font-size: 32px;
    font-weight: normal;
    color: #c99339;
    margin-bottom: 20px;
    line-height: 1.3;
}
.h2s-enq-desc {
    font-size: 16px;
    color: #333;
    margin-bottom: 30px;
    font-weight: 500;
}
.h2s-enq-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.h2s-enq-list li {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    font-size: 15px;
    color: #333;
    font-weight: 600;
}
.h2s-el-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    color: #c99339;
    margin-right: 15px;
}
.h2s-enq-list svg {
    width: 24px;
    fill: #c99339;
}
/* Right Column */

.h2s-enq-right {
    flex: 0 0 50%;
    padding: 30px 50px;
}
.h2s-enq-right h3{
    font-size: 24px;
    color: #333;
    font-weight: normal;
    margin-bottom: 30px;
}
/* Form Styling Overrides to match Mockup */

.h2s-enq-right input[type="text"], .h2s-form-shortcode-wrap input[type="email"], .h2s-form-shortcode-wrap input[type="tel"], .h2s-form-shortcode-wrap select, .h2s-form-shortcode-wrap textarea {
    padding: 12px 15px;
    border: 1px solid #eaeaea !important;
    border-radius: 4px !important;
    margin-bottom: 20px !important;
    font-size: 14px !important;
}
.h2s-enq-right input[type="submit"], .h2s-form-shortcode-wrap button {
    background: #c99339 !important;
    color: #fff !important;
    border: none !important;
    padding: 15px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    transition: 0.3s !important;
}
.h2s-enq-right input[type="submit"]:hover, .h2s-form-shortcode-wrap button:hover {
    background: #b07d2c !important;
}
/* Responsive */

@media (max-width: 992px) {
    .h2s-enq-container {
        flex-direction: column;
    }
    .h2s-enq-left, .h2s-enq-right {
        flex: 1;
        padding: 40px 30px;
    }
    .h2s-enq-right {
        border-left: none;
        border-top: 1px solid #eaeaea;
    }
}