﻿/* Contact page (scoped) */
.hero--contact > .container-fluid{
  width:100%;
  max-width:100%;
  margin-inline:0;
  padding-left:0;
  padding-right:0;
}

.hero--contact{
  position:relative;
  overflow:hidden;
}

.hero--contact .hero__card{
  border-radius:0;
  width:100%;
  min-height:640px;
  height:auto;
  position:relative;
  background:
    linear-gradient(90deg, rgba(251,246,242,.94) 0%, rgba(251,246,242,.84) 46%, rgba(251,246,242,.14) 72%, rgba(251,246,242,0) 100%),
    url("images/contact_hero_section_image.png") right center/cover no-repeat;
}

.hero--contact .hero__media{min-height:420px}

.hero--contact .hero__card > *{position:relative}
.hero--contact .hero__grid{align-items:center}
.hero--contact .hero__content{max-width:720px}

.hero--contact .hero__bullets{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:12px;color:#3a312c;font-weight:700}
.hero--contact .hero__bullets li{display:flex;align-items:flex-start;gap:12px}
.hero--contact .hero__bulletIcon{
  width:28px;height:28px;border-radius:999px;
  display:grid;place-items:center;flex:0 0 auto;margin-top:2px;
  border:2px solid rgba(230,123,42,.55);
  background:rgba(255,255,255,.55);
  color:var(--orange);
}
.hero--contact .hero__bulletIcon i{font-size:13px;line-height:1}
.hero--contact .hero__bulletText{line-height:1.55}
.hero--contact .hero__actions{margin-top:22px}
.hero--contact .hero--contact__cta{align-items:center;gap:10px;padding:12px 22px;border-radius:12px;font-weight:900}

@media (max-width: 991.98px){
  .hero--contact .hero__card{
    min-height:560px;
    background:
      linear-gradient(180deg, rgba(251,246,242,.94) 0%, rgba(251,246,242,.84) 58%, rgba(251,246,242,.14) 100%),
      url("images/contact_hero_section_image.png") center bottom/cover no-repeat;
  }
}

@media (max-width: 575.98px){
  .hero--contact .hero__card{min-height:520px}
}



.cpage-intro{padding:22px 0 10px}

.cpage{padding:28px 0 56px}

.cpage-top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}
.cpage-top__title{margin:0}

.cpage-visit{
  margin-top:18px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:stretch;
}

.cpage-card{
  background:rgba(255,255,255,.72);
  border:1px solid rgba(64,44,36,.12);
  border-radius:18px;
  box-shadow:var(--shadow-soft);
  padding:18px;
}

.cpage-card--map{padding:0;overflow:hidden}
.cpage-map iframe{width:100%;height:320px;border:0;display:block}

.cpage-locTitle{font-weight:950;color:#3a312c;font-size:20px;margin-bottom:10px}

.cpage-contactRow{
  display:flex;
  gap:12px;
  align-items:flex-start;
  color:#4f4945;
  line-height:1.6;
  margin-top:10px;
}
.cpage-ico{
  width:34px;
  height:34px;
  border-radius:12px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  background:rgba(246,198,167,.25);
  border:1px solid rgba(230,123,42,.22);
  color:#3a312c;
}

.cpage-mid{margin-top:34px}
.cpage-mid__title{margin:0 0 14px}

.cpage-mid__grid{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:18px;
  align-items:start;
}

.cpage-form__grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:12px;
}

.cpage-in{
  width:100%;
  border-radius:14px;
  border:1px solid rgba(64,44,36,.14);
  background:rgba(255,255,255,.86);
  padding:12px 14px;
  font-weight:600;
  color:#3a312c;
  outline:none;
  box-shadow:0 10px 18px rgba(24,18,14,.06);
}
.cpage-in:focus{border-color:rgba(230,123,42,.45);box-shadow:0 12px 22px rgba(24,18,14,.10)}
.cpage-in--ta{grid-column:1 / -1;resize:vertical;min-height:120px}

.cpage-send{margin-top:14px}

.cpage-side{display:grid;gap:14px}
.cpage-side__head{font-weight:950;color:#3a312c;font-size:18px;margin-bottom:10px}


.cpage-timings{position:relative;padding:0;overflow:hidden}
.cpage-timings__title{padding:14px 16px;text-align:center;font-weight:950;letter-spacing:.06em;color:#7a736d;background:rgba(255,255,255,.35);border-bottom:1px solid rgba(64,44,36,.12)}
.cpage-timings__table{padding:10px 16px 16px}
.cpage-timings__row{display:grid;grid-template-columns:56px 1fr 14px 1fr;align-items:center;gap:10px;padding:10px 0;border-top:1px solid rgba(64,44,36,.12)}
.cpage-timings__row:first-child{border-top:0}
.cpage-timings__day{font-weight:900;color:#6b655f}
.cpage-timings__time{font-weight:900;color:#3a312c;justify-self:end;white-space:nowrap}
.cpage-timings__dash{color:rgba(64,44,36,.35);justify-self:center}
.cpage-timings__row.is-today .cpage-timings__day{color:var(--orange)}
.cpage-timings__row.is-today .cpage-timings__time{color:#1f1b17}
.cpage-timings:before{content:"";position:absolute;left:50%;bottom:-18px;transform:translateX(-50%);border:18px solid transparent;border-top-color:rgba(64,44,36,.12)}
.cpage-timings:after{content:"";position:absolute;left:50%;bottom:-17px;transform:translateX(-50%);border:17px solid transparent;border-top-color:rgba(255,255,255,.72)}
.cpage-hours__list{list-style:none;margin:0;padding:0;display:grid;gap:10px;color:#4f4945;font-weight:600}
.cpage-hours__list .dot{display:inline-block;width:7px;height:7px;border-radius:999px;background:var(--orange);margin-right:8px}

.cpage-promo{position:relative;overflow:hidden;padding:18px;display:grid;gap:12px}
.cpage-promo__img{width:88px;height:88px;border-radius:999px;object-fit:cover;border:4px solid rgba(255,255,255,.86);box-shadow:0 14px 22px rgba(24,18,14,.10)}
.cpage-promo__text{font-weight:950;line-height:1.1;color:#3a312c;font-size:22px}
.cpage-promo__btn{justify-self:start}

.cpage-strip{
  margin-top:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(64,44,36,.12);
  border-radius:18px;
  box-shadow:var(--shadow-soft);
  padding:16px 18px;
}
.cpage-strip__text{color:#6b655f;font-weight:700;line-height:1.6;max-width:720px}
.cpage-strip__icons{display:flex;gap:10px;align-items:center}

.cpage-cta{
  margin-top:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(64,44,36,.12);
  border-radius:18px;
  box-shadow:var(--shadow-soft);
  padding:16px 18px;
}
.cpage-cta__title{font-weight:950;color:#3a312c}

.cpage-faqHead{margin-top:18px;display:grid;gap:6px;text-align:center}
.cpage-faqTitle{font-weight:950;color:#3a312c;font-size:24px;line-height:1.15}
.cpage-faqSub{color:#6b655f;font-weight:700}

.cpage-faq{margin-top:18px;display:grid;gap:12px}
.cpage-faq__item{border:1px solid rgba(64,44,36,.12);border-radius:18px;background:rgba(255,255,255,.72);box-shadow:var(--shadow-soft);padding:0}
.cpage-faq__sum{cursor:pointer;list-style:none;padding:14px 16px;font-weight:900;color:#3a312c;display:flex;align-items:center;justify-content:space-between;gap:12px}
.cpage-faq__sum::-webkit-details-marker{display:none}
.cpage-faq__body{padding:0 16px 14px;color:#6b655f;font-weight:700;line-height:1.65}

@media (max-width: 991.98px){
  .hero--contact .hero__media{min-height:360px}
  .cpage-visit{grid-template-columns:1fr}
  .cpage-map iframe{height:300px}
  .cpage-mid__grid{grid-template-columns:1fr}
}

@media (max-width: 575.98px){
  .cpage-form__grid{grid-template-columns:1fr}
  .cpage-in--ta{grid-column:auto}
}


/* ========================================
   CONTACT PAGE MOBILE RESPONSIVE CSS
   ======================================== */

/* Desktop Layout */
.cpage-visit {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: stretch;
    margin-bottom: 32px;
}

.cpage-card {
    background: #fff;
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

.cpage-locTitle {
    font-size: 24px;
    font-weight: 700;
    color: #e67b2a;
    margin-bottom: 20px;
}

.cpage-contactRow {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
    line-height: 1.7;
}

.cpage-ico {
    color: #e67b2a;
    font-size: 18px;
    min-width: 20px;
    margin-top: 3px;
}

.cpage-strip__icons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 16px 0 0 !important;
}

.footer__socialBtn {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #f8f8f8;
    color: #e67b2a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: 0.3s ease;
}

.footer__socialBtn:hover {
    background: #e67b2a;
    color: #fff;
}

.cpage-bookBtnWrap {
    margin-top: 20px;
}

.cpage-bookBtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 0 !important;
}

.cpage-map {
    border-radius: 16px;
    overflow: hidden;
    min-height: 400px;
}

.cpage-map iframe {
    width: 100%;
    height: 100%;
    min-height: 400px;
    border: 0;
}

/* ========================================
   TABLET & MOBILE
   ======================================== */
@media (max-width: 768px) {

    .cpage-visit {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .cpage-card {
        padding: 20px;
        border-radius: 16px;
    }

    .cpage-locTitle {
        font-size: 22px;
        margin-bottom: 16px;
        text-align: center;
    }

    .cpage-contactRow {
        gap: 10px;
        margin-bottom: 12px;
        font-size: 15px;
    }

    .cpage-ico {
        font-size: 16px;
        min-width: 18px;
    }

    /* Social icons centered */
    .cpage-strip__icons {
        margin-top: 18px !important;
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        flex-wrap: wrap;
        gap: 10px;

        /* Remove unwanted spacing */
        margin: 18px 0 0 0 !important;
        padding-left: 0 !important;

        /* Force left alignment */
        width: 100%;
        text-align: left !important
    }

    /* Book button full width */
    .cpage-bookBtnWrap {
        margin-top: 18px;
    }

    .cpage-bookBtn {
        width: 100%;
        justify-content: center;
        margin-left: 0 !important;
    }

    /* Map height */
    .cpage-map,
    .cpage-map iframe {
        min-height: 300px;
    }
}

/* ========================================
   SMALL MOBILE
   ======================================== */
@media (max-width: 480px) {

    .cpage-card {
        padding: 16px;
    }

    .cpage-locTitle {
        font-size: 20px;
    }

    .cpage-contactRow {
        font-size: 14px;
        line-height: 1.6;
    }

    .footer__socialBtn {
        width: 38px;
        height: 38px;
        font-size: 14px;
    }

    .cpage-map,
    .cpage-map iframe {
        min-height: 250px;
    }
}

.cpage-promo__actions {
    display: flex;
    gap: 40px;
    margin-top: 20px;
}

/* column layout */
.cpage-promo__column {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* button style */
.cpage-promo__btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 20px;
    font-size: 16px;
    text-decoration: none;
}

/* LEFT alignment */
.cpage-promo__column.left {
    align-items: flex-start;
}

/* RIGHT alignment */
.cpage-promo__column.right {
    align-items: flex-start;
}


@media (max-width: 768px) {
    .consultation-lead__next {
        display: inline; /* Mobile: same line */
    }
}


/* --- Base Actions Wrapper --- */
.cpage-promo__actions {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 24px; /* Left aur Right columns ke beech ka distance */
    width: 100%;
    max-width: 900px; /* Aap apne hisab se section container width modify kar sakte hain */
    margin: 20px auto;
}

/* --- Columns Configuration --- */
.cpage-promo__column {
    display: flex;
    flex-direction: column;
    flex: 1; /* Dono side ko equal size space dega */
    gap: 15px; /* Column ke andar buttons ke beech ka symmetrical gap */
}

/* --- Button Styling & Symmetric Typography --- */
.cpage-promo__btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: flex-start; /* Icons aur text standard left side shuru honge */
    padding: 12px 24px !important;
    font-size: 18px !important;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px; /* Smooth professional edges */
    width: 100%; /* Column block ke andar poori level space lene ke liye */
    box-sizing: border-box;
}

/* Icons aur text ke beech ki standard spacing */
.cpage-promo__btn i {
    margin-right: 10px !important;
    font-size: 20px;
    flex-shrink: 0;
}

/* --- Mobile Responsive Rules --- */
@media (max-width: 768px) {
    /* Pure container wrapper ko columns ko vertical stack kar dega */
    .cpage-promo__actions {
        flex-direction: column !important;
        gap: 15px !important;
        padding: 0 15px; /* Screen edges se touch hone se bachaane ke liye */
    }

    /* Column gaps ko optimize karne ke liye */
    .cpage-promo__column {
        gap: 15px !important;
        width: 100% !important;
    }

    /* Mobile standard button alignment */
    .cpage-promo__btn {
        width: 100% !important;
        justify-content: center; /* Mobile screen par standard symmetric visual ke liye center kiya hai, agar left aligned chahiye toh comment kijiye */
        font-size: 16px !important; /* Mobile padding and size correction */
        padding: 14px 20px !important;
    }
}












