/* ==========================================
   CONTACT US - PAGE HERO (same style as About Us)
========================================== */
.dz-page-hero{
    position: relative;
    background: linear-gradient(120deg, var(--dz-secondary) 0%, var(--dz-primary-950) 55%, var(--dz-primary-900) 100%);
    padding: 60px 0 70px;
    text-align: center;
    overflow: hidden;
}

.dz-page-hero::before{
    content: '';
    position: absolute;
    width: 300px; height: 300px;
    background: var(--dz-primary);
    border-radius: 50%;
    filter: blur(100px);
    opacity: .3;
    top: -60px;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
}

.dz-page-hero-inner{
    position: relative;
    z-index: 2;
    max-width: 720px;
    margin: 0 auto;
}

.dz-breadcrumb{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 13px;
    margin-bottom: 24px;
}
.dz-breadcrumb a{ color: #d9d9d9; }
.dz-breadcrumb a:hover{ color: var(--dz-primary-300); }
.dz-breadcrumb-sep{ color: #777; }
.dz-breadcrumb-current{ color: var(--dz-primary-300); font-weight: 600; }

.dz-page-hero-eyebrow{
    display: inline-block;
    background: rgba(255,255,255,.1);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 7px 16px;
    border-radius: 20px;
    margin-bottom: 18px;
}

.dz-page-hero-title{
    font-size: 40px;
    font-weight: 800;
    line-height: 1.25;
    color: #fff;
    margin-bottom: 16px;
}

.dz-page-hero-text{
    font-size: 15.5px;
    line-height: 1.7;
    color: #d9d9d9;
    margin: 0 auto;
    max-width: 560px;
}

/* ==========================================
   RESPONSIVE
========================================== */
@media (max-width: 768px){
    .dz-page-hero{ padding: 44px 0 50px; }
    .dz-page-hero-title{ font-size: 28px; }
    .dz-page-hero-text{ font-size: 14px; }
    .dz-breadcrumb{ font-size: 12px; margin-bottom: 18px; }
}

@media (max-width: 480px){
    .dz-page-hero-title{ font-size: 23px; }
}

/* ==========================================
   CONTACT INFO + FORM
========================================== */
.dz-contact-main{
    padding: 60px 0;
}

.dz-contact-grid{
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 60px;
}

/* ---------- Left: Info ---------- */
.dz-contact-info-title{
    font-size: 34px;
    font-weight: 800;
    color: var(--dz-secondary);
    margin: 10px 0 14px;
}
.dz-contact-info-text{
    font-size: 14.5px;
    line-height: 1.75;
    color: var(--dz-text-light);
    margin-bottom: 32px;
}

.dz-contact-cards{
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.dz-contact-card{
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 0 0 22px;
    border-bottom: 1px solid var(--dz-border);
}
.dz-contact-cards .dz-contact-card:last-child{
    padding-bottom: 0;
    border-bottom: none;
}

.dz-contact-card-icon{
    flex-shrink: 0;
    width: 44px; height: 44px;
    background: var(--dz-primary-50);
    color: var(--dz-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dz-contact-card-icon svg{ width: 20px; height: 20px; }

.dz-contact-card h3{
    font-size: 14.5px;
    font-weight: 700;
    color: var(--dz-secondary);
    margin: 0 0 4px;
}
.dz-contact-card a,
.dz-contact-card span{
    font-size: 13.5px;
    color: var(--dz-text-light);
    line-height: 1.6;
}
.dz-contact-card a:hover{ color: var(--dz-primary); }

/* ---------- Right: Form ---------- */
.dz-contact-form-wrap{
    background: var(--dz-bg-soft);
    border: 1px solid var(--dz-border);
    border-radius: 18px;
    padding: 40px;
}

.dz-contact-form-title{
    font-size: 20px;
    font-weight: 700;
    color: var(--dz-secondary);
    margin: 0 0 24px;
}

/* ===== Contact Form 7 overrides (tight spacing, grid layout) ===== */
.dz-form-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.dz-form-field{ margin: 0; }
.dz-form-field-full{ grid-column: 1 / -1; }

.wpcf7-form-control-wrap{ display: block; }

.dz-form-grid input[type="text"],
.dz-form-grid input[type="email"],
.dz-form-grid input[type="tel"],
.dz-form-grid textarea{
    width: 100%;
    background: #fff;
    border: 1px solid var(--dz-border);
    border-radius: var(--dz-radius);
    padding: 13px 16px;
    font-size: 14px;
    font-family: var(--dz-font);
    color: var(--dz-text);
    transition: var(--dz-transition);
    box-sizing: border-box;
}
.dz-form-grid input:focus,
.dz-form-grid textarea:focus{
    outline: none;
    border-color: var(--dz-primary);
    box-shadow: 0 0 0 3px var(--dz-primary-50);
}
.dz-form-grid textarea{ resize: vertical; min-height: 130px; }

.dz-form-grid input[type="submit"]{
    background: var(--dz-primary);
    color: #fff;
    border: none;
    padding: 14px 36px;
    border-radius: var(--dz-radius);
    font-weight: 600;
    font-size: 14.5px;
    cursor: pointer;
    transition: var(--dz-transition);
}
.dz-form-grid input[type="submit"]:hover{ background: var(--dz-primary-hover); }

/* CF7 validation / response messages */
.wpcf7-not-valid-tip{
    color: var(--dz-primary-700);
    font-size: 12.5px;
    margin-top: 4px;
}
.wpcf7-not-valid{ border-color: var(--dz-primary) !important; }
.wpcf7-response-output{
    margin: 18px 0 0 !important;
    border-radius: var(--dz-radius);
    padding: 12px 16px !important;
    font-size: 13.5px;
}
.wpcf7-mail-sent-ok{
    border-color: #16a34a !important;
    color: #16a34a;
    background: #f0fdf4;
}
.wpcf7-validation-errors,
.wpcf7-mail-sent-ng{
    border-color: var(--dz-primary) !important;
    color: var(--dz-primary-700);
    background: var(--dz-primary-50);
}

.wpcf7-spinner{ margin-left: 10px; }

/* Form field labels */
.dz-form-field label{
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--dz-secondary);
    margin-bottom: 6px;
}

/* Safety reset */
.dz-contact-form-wrap .wpcf7-form p{ margin: 0; }
.dz-contact-form-wrap .wpcf7-form br{ display: none; }

.dz-section-eyebrow{
    display: inline-block;
    color: var(--dz-primary);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin-bottom: 10px;
}

/* ==========================================
   RESPONSIVE
========================================== */
@media (max-width: 1024px){
    .dz-contact-main{ padding: 60px 0; }
    .dz-contact-grid{ gap: 40px; }
    .dz-contact-form-wrap{ padding: 32px; }
}

@media (max-width: 900px){
    .dz-contact-grid{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px){
    .dz-form-grid{
        grid-template-columns: 1fr;
    }
    .dz-contact-form-wrap{ padding: 24px 20px; border-radius: 14px; }
    .dz-contact-info-title{ font-size: 24px; }
}


/* ==========================================
   OUR BRANCHES (3 cards, map inside each)
========================================== */
.dz-branches{
    padding: 60px 0;
    background: var(--dz-bg-soft);
}

.dz-branch-grid{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 26px;
}

.dz-branch-card{
    background: #fff;
    border: 1px solid var(--dz-border);
    border-radius: 16px;
    overflow: hidden;
    transition: var(--dz-transition);
}
.dz-branch-card:hover{
    box-shadow: var(--dz-shadow-md);
    transform: translateY(-4px);
    border-color: var(--dz-primary-100);
}

.dz-branch-info{ padding: 28px 24px 22px; }

.dz-branch-icon{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px; height: 46px;
    background: var(--dz-primary-50);
    color: var(--dz-primary);
    border-radius: 50%;
    margin-bottom: 16px;
}
.dz-branch-icon svg{ width: 21px; height: 21px; }

.dz-branch-name{
    font-size: 18px;
    font-weight: 700;
    color: var(--dz-secondary);
    margin: 0 0 10px;
}

.dz-branch-address{
    font-size: 13.5px;
    line-height: 1.65;
    color: var(--dz-text-light);
    margin: 0 0 14px;
    min-height: 66px;
}

.dz-branch-phone{
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--dz-secondary);
}
.dz-branch-phone svg{ width: 15px; height: 15px; color: var(--dz-primary); }
.dz-branch-phone:hover{ color: var(--dz-primary); }

.dz-branch-map{
    position: relative;
    width: 100%;
    height: 200px;
    border-top: 1px solid var(--dz-border);
}
.dz-branch-map iframe{
    display: block;
    width: 100%;
    height: 100%;
}

.dz-branch-map-btn{
    position: absolute;
    bottom: 12px;
    left: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #fff;
    color: var(--dz-secondary);
    font-size: 12.5px;
    font-weight: 700;
    padding: 8px 14px;
    border-radius: 20px;
    box-shadow: 0 4px 14px rgba(17,17,17,.18);
    transition: var(--dz-transition);
}
.dz-branch-map-btn svg{ width: 12px; height: 12px; }
.dz-branch-map-btn:hover{
    background: var(--dz-primary);
    color: #fff;
}

/* ==========================================
   RESPONSIVE
========================================== */
@media (max-width: 1024px){
    .dz-branches{ padding: 60px 0; }
    .dz-branch-grid{ gap: 18px; }
    .dz-branch-address{ min-height: auto; }
}

@media (max-width: 900px){
    .dz-branch-grid{
        grid-template-columns: 1fr;
        max-width: 480px;
        margin: 0 auto;
    }
}

@media (max-width: 480px){
    .dz-branch-info{ padding: 22px 20px 18px; }
    .dz-branch-name{ font-size: 16.5px; }
    .dz-branch-map{ height: 180px; }
}

/* ==========================================
   SECTION HEADING (shared style, same as Home/About pages)
========================================== */
.dz-section-heading{
    text-align: center;
    max-width: 560px;
    margin: 0 auto 44px;
}
.dz-section-heading h2{
    font-size: 34px;
    font-weight: 800;
    color: var(--dz-secondary);
    margin-bottom: 12px;
}
.dz-section-heading p{
    font-size: 15px;
    color: var(--dz-text-light);
    margin: 0;
}

@media (max-width: 1024px){
    .dz-section-heading h2{ font-size: 28px; }
}
@media (max-width: 768px){
    .dz-section-heading{ margin-bottom: 32px; }
    .dz-section-heading h2{ font-size: 24px; }
}