/*
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");

/* =====================================================================
   MyCityHomes — Post Property Landing Page
   ===================================================================== */

/* ---------- Shared ---------- */
.mch-section-title{text-align:center;font-size:32px;font-weight:700;color:#1a1a2e;margin:0 0 8px}
.mch-section-sub{text-align:center;font-size:16px;color:#666;margin:0 0 40px}

.mch-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .25s ease;text-decoration:none}
.mch-btn--primary{background:#00aeff;color:#fff;padding:14px 32px;font-size:16px}
.mch-btn--primary:hover{background:#0090d4;color:#fff;transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,174,255,.35)}
.mch-btn--lg{padding:18px 48px;font-size:18px;border-radius:50px}
.mch-btn--full{width:100%}
.mch-btn--outline{background:transparent;color:#00aeff;border:2px solid #00aeff;padding:12px 28px;font-size:15px;border-radius:8px}
.mch-btn--outline:hover{background:#00aeff;color:#fff}
.mch-btn__loader{display:inline-block;width:18px;height:18px;border:2.5px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:mch-spin .6s linear infinite}
@keyframes mch-spin{to{transform:rotate(360deg)}}

/* =======================================
   SECTION 1 — HERO
   ======================================= */
.mch-hero{background:linear-gradient(135deg,#0052d4 0%,#00aeff 100%);padding:60px 0 70px;position:relative;overflow:hidden}
.mch-hero::after{content:'';position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(255,255,255,.07) 0%,transparent 70%);top:-200px;right:-150px;pointer-events:none}
.mch-hero__grid{display:grid;grid-template-columns:1fr 420px;gap:50px;align-items:center}
.mch-hero__title{font-size:38px;font-weight:800;color:#fff;line-height:1.25;margin:0 0 28px}
.mch-hero__title span{color:#ffe066}
.mch-hero__perks{list-style:none;padding:0;margin:0 0 30px}
.mch-hero__perks li{display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.92);font-size:16px;padding:7px 0}
.mch-hero__perk-icon{flex-shrink:0;display:flex}
.mch-hero__illustration{max-width:400px;margin-top:10px}
.mch-hero__illustration svg{width:100%;height:auto}

/* Auth card — OTP login */
.mch-auth-card{background:#fff;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.15);padding:0;overflow:hidden}
.mch-otp-header{text-align:center;padding:28px 28px 0;display:flex;flex-direction:column;align-items:center;gap:6px}
.mch-otp-header svg{margin-bottom:4px}
.mch-otp-header h3{font-size:20px;font-weight:700;color:#1a1a2e;margin:0}
.mch-otp-header p{font-size:14px;color:#888;margin:0 0 4px}
.mch-otp-step{display:none;padding:24px 28px 32px}
.mch-otp-step.active{display:block}
.mch-field{margin-bottom:16px}
.mch-field label{display:block;font-size:13px;font-weight:600;color:#444;margin-bottom:5px}
.mch-field input{width:100%;padding:12px 14px;border:1.5px solid #ddd;border-radius:8px;font-size:15px;transition:border-color .2s;box-sizing:border-box}
.mch-field input:focus{outline:none;border-color:#00aeff;box-shadow:0 0 0 3px rgba(0,174,255,.12)}
/* Phone input with +91 prefix */
.mch-phone-input{display:flex;align-items:stretch;border:1.5px solid #ddd;border-radius:8px;overflow:hidden;transition:border-color .2s}
.mch-phone-input:focus-within{border-color:#00aeff;box-shadow:0 0 0 3px rgba(0,174,255,.12)}
.mch-phone-prefix{display:flex;align-items:center;padding:0 14px;background:#f5f5f5;font-size:15px;font-weight:600;color:#333;border-right:1.5px solid #ddd;white-space:nowrap}
.mch-phone-input input{border:none!important;border-radius:0!important;box-shadow:none!important;padding-left:14px}
.mch-phone-input input:focus{box-shadow:none!important}
/* OTP digit boxes */
.mch-otp-inputs{display:flex;gap:10px;justify-content:center;margin-top:8px}
.mch-otp-digit{width:48px!important;height:56px;text-align:center;font-size:24px!important;font-weight:700;color:#1a1a2e;padding:0!important;border:2px solid #ddd;border-radius:10px;transition:border-color .2s}
.mch-otp-digit:focus{border-color:#00aeff;box-shadow:0 0 0 3px rgba(0,174,255,.12)}
/* Sent-to line */
.mch-otp-sent-to{font-size:14px;color:#555;margin-bottom:20px;text-align:center}
.mch-otp-sent-to strong{color:#1a1a2e}
/* Resend row */
.mch-otp-resend{text-align:center;margin-bottom:16px;font-size:13px;color:#888}
.mch-otp-resend strong{color:#1a1a2e}
/* Shared */
.mch-forgot{color:#00aeff;text-decoration:none;font-size:13px}
.mch-forgot:hover{text-decoration:underline}
.mch-auth-msg{font-size:13px;margin-bottom:10px;min-height:20px;text-align:center}
.mch-auth-msg.error{color:#e53935}
.mch-auth-msg.success{color:#43a047}

/* =======================================
   SECTION 2 — STEPS
   ======================================= */
.mch-steps{padding:80px 0 60px;background:#fff}
.mch-steps__track{display:flex;justify-content:center;gap:0;position:relative;margin-bottom:50px;flex-wrap:wrap}
.mch-steps__line{display:none}
.mch-step{text-align:center;flex:0 0 180px;position:relative;padding:0 10px}
.mch-step::after{content:'';position:absolute;top:28px;right:-18px;width:36px;height:2px;background:#00aeff}
.mch-step:last-child::after{display:none}
.mch-step__circle{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#00aeff,#0052d4);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 4px 15px rgba(0,174,255,.3)}
.mch-step__circle--accent{background:linear-gradient(135deg,#43a047,#2e7d32)}
.mch-step h4{font-size:15px;font-weight:700;color:#1a1a2e;margin:0 0 6px}
.mch-step p{font-size:13px;color:#777;line-height:1.4;margin:0}
.mch-steps__cta{text-align:center}

/* =======================================
   SECTION 3 — KPI
   ======================================= */
.mch-kpi{padding:70px 0;background:#f8f9fa}
.mch-kpi__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.mch-kpi-card{background:#fff;border-radius:16px;padding:36px 24px;text-align:center;box-shadow:0 2px 12px rgba(0,0,0,.06);transition:transform .25s,box-shadow .25s}
.mch-kpi-card:hover{transform:translateY(-4px);box-shadow:0 8px 30px rgba(0,0,0,.1)}
.mch-kpi-card__icon{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.mch-kpi-card__icon--blue{background:#e3f2fd;color:#1e88e5}
.mch-kpi-card__icon--green{background:#e8f5e9;color:#43a047}
.mch-kpi-card__icon--orange{background:#fff3e0;color:#fb8c00}
.mch-kpi-card__icon--purple{background:#f3e5f5;color:#8e24aa}
.mch-kpi-card__num{font-size:40px;font-weight:800;color:#1a1a2e;line-height:1}
.mch-kpi-card__suffix{font-size:28px;font-weight:700;color:#00aeff}
.mch-kpi-card p{margin:10px 0 0;font-size:14px;color:#666;font-weight:500}

/* =======================================
   SECTION 4 — RECENT PROPERTIES
   ======================================= */
.mch-recent{padding:80px 0;background:#fff}
.mch-recent__slider{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.mch-prop-card{border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.07);transition:transform .25s,box-shadow .25s}
.mch-prop-card:hover{transform:translateY(-4px);box-shadow:0 8px 25px rgba(0,0,0,.12)}
.mch-prop-card__link{text-decoration:none;color:inherit;display:block}
.mch-prop-card__img{height:180px;background-size:cover;background-position:center;background-color:#e0e0e0;position:relative}
.mch-prop-card__badge{position:absolute;top:12px;left:12px;background:#00aeff;color:#fff;font-size:11px;font-weight:700;padding:4px 12px;border-radius:4px;text-transform:uppercase}
.mch-prop-card__body{padding:16px}
.mch-prop-card__price{font-size:18px;font-weight:800;color:#1a1a2e;margin-bottom:4px}
.mch-prop-card__price small{font-size:12px;font-weight:500;color:#888}
.mch-prop-card__title{font-size:14px;font-weight:600;color:#333;margin:0 0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mch-prop-card__loc{font-size:12px;color:#888;margin:0 0 8px;display:flex;align-items:center;gap:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mch-prop-card__loc svg{flex-shrink:0;color:#00aeff}
.mch-prop-card__meta{display:flex;gap:12px;font-size:12px;color:#666}
.mch-prop-card__meta span{display:flex;align-items:center;gap:3px}

/* =======================================
   SECTION 5 — TESTIMONIALS
   ======================================= */
.mch-testimonials{padding:80px 0;background:linear-gradient(135deg,#e3f2fd 0%,#f3e5f5 100%)}
.mch-testimonials__slider{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.mch-testi-card{background:#fff;border-radius:16px;padding:32px;box-shadow:0 2px 12px rgba(0,0,0,.06);transition:transform .25s}
.mch-testi-card:hover{transform:translateY(-3px)}
.mch-testi-card__stars{color:#ffc107;font-size:20px;margin-bottom:14px;letter-spacing:2px}
.mch-testi-card__text{font-size:15px;color:#444;line-height:1.7;margin:0 0 20px;font-style:italic}
.mch-testi-card__author{display:flex;align-items:center;gap:12px}
.mch-testi-card__avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#00aeff,#0052d4);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0}
.mch-testi-card__author strong{display:block;font-size:14px;color:#1a1a2e}
.mch-testi-card__author span{font-size:12px;color:#888}

/* =======================================
   SECTION 6 — FAQ
   ======================================= */
.mch-faq{padding:80px 0;background:#fff}
.mch-faq__wrap{max-width:800px;margin:0 auto}
.mch-faq .accordion-item{border:1.5px solid #e8e8e8;border-radius:12px !important;margin-bottom:12px;overflow:hidden}
.mch-faq .accordion-button{font-size:15px;font-weight:600;color:#1a1a2e;padding:18px 24px;background:#fff}
.mch-faq .accordion-button:not(.collapsed){color:#00aeff;background:#f0f9ff;box-shadow:none}
.mch-faq .accordion-button:focus{box-shadow:0 0 0 3px rgba(0,174,255,.12)}
.mch-faq .accordion-button::after{background-size:14px}
.mch-faq .accordion-body{font-size:14px;color:#555;line-height:1.7;padding:0 24px 20px}

/* =======================================
   SECTION 7 — BLOG
   ======================================= */
.mch-blog{padding:80px 0;background:#f8f9fa}
.mch-blog__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.mch-blog-card{border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.06);transition:transform .25s,box-shadow .25s}
.mch-blog-card:hover{transform:translateY(-4px);box-shadow:0 8px 25px rgba(0,0,0,.1)}
.mch-blog-card__link{text-decoration:none;color:inherit;display:block}
.mch-blog-card__img{height:200px;background-size:cover;background-position:center;background-color:#e0e0e0}
.mch-blog-card__body{padding:20px}
.mch-blog-card__date{font-size:12px;color:#00aeff;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.mch-blog-card__title{font-size:17px;font-weight:700;color:#1a1a2e;margin:8px 0;line-height:1.35}
.mch-blog-card__excerpt{font-size:13px;color:#777;line-height:1.6;margin:0 0 14px}
.mch-blog-card__more{font-size:13px;font-weight:600;color:#00aeff}

/* =======================================
   SECTION 8 — QUICK LINKS
   ======================================= */
.mch-quicklinks{padding:70px 0;background:#1a1a2e}
.mch-quicklinks__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px}
.mch-ql-card{background:rgba(255,255,255,.06);border:1.5px solid rgba(255,255,255,.1);border-radius:16px;padding:40px;text-align:center;transition:background .25s,border-color .25s}
.mch-ql-card:hover{background:rgba(255,255,255,.1);border-color:rgba(0,174,255,.4)}
.mch-ql-card__icon{color:#00aeff;margin-bottom:18px}
.mch-ql-card h3{color:#fff;font-size:22px;font-weight:700;margin:0 0 12px}
.mch-ql-card p{color:rgba(255,255,255,.65);font-size:14px;line-height:1.6;margin:0 0 24px}
.mch-ql-card .mch-btn--outline{border-color:rgba(255,255,255,.3);color:#fff}
.mch-ql-card .mch-btn--outline:hover{background:#00aeff;border-color:#00aeff;color:#fff}

/* =======================================
   RESPONSIVE
   ======================================= */
@media(max-width:1024px){
  .mch-hero__grid{grid-template-columns:1fr;gap:40px}
  .mch-hero__left{text-align:center}
  .mch-hero__perks li{justify-content:center}
  .mch-hero__illustration{margin:10px auto 0}
  .mch-hero__right{max-width:440px;margin:0 auto}
  .mch-kpi__grid{grid-template-columns:repeat(2,1fr)}
  .mch-recent__slider{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:767px){
  .mch-hero{padding:40px 0 50px}
  .mch-hero__title{font-size:28px}
  .mch-section-title{font-size:24px}
  .mch-steps__track{flex-direction:column;align-items:center;gap:30px}
  .mch-step{flex:0 0 auto}
  .mch-step::after{display:none}
  .mch-kpi__grid{grid-template-columns:1fr 1fr}
  .mch-kpi-card__num{font-size:30px}
  .mch-recent__slider{grid-template-columns:1fr}
  .mch-testimonials__slider{grid-template-columns:1fr}
  .mch-blog__grid{grid-template-columns:1fr}
  .mch-quicklinks__grid{grid-template-columns:1fr}
  .mch-ql-card{padding:28px 20px}
}

@media(max-width:480px){
  .mch-hero__title{font-size:24px}
  .mch-kpi__grid{grid-template-columns:1fr}
  .mch-otp-step{padding:20px 18px 24px}
  .mch-otp-header{padding:20px 18px 0}
  .mch-otp-digit{width:40px!important;height:48px;font-size:20px!important}
  .mch-otp-inputs{gap:6px}
}