/*
=====================================================
Ashraf Interiors - Contact Page Styles
=====================================================
*/
.contact-overview{background:var(--cream)}
.contact-card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:55px}
.contact-card{display:block;padding:34px;border-radius:24px;background:#fff;border:1px solid var(--line);transition:.35s}
.contact-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-sm)}
.contact-card-icon{width:64px;height:64px;display:grid;place-items:center;border-radius:50%;background:rgba(184,135,70,.12);color:var(--gold);font-size:1.4rem;margin-bottom:20px}
.contact-card small{display:block;color:var(--gold);text-transform:uppercase;letter-spacing:.16em}
.contact-main{background:#fff}
.contact-main-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:start}
.contact-form-panel{background:var(--cream);padding:42px;border-radius:28px}
.contact-form{margin-top:30px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-group{margin-bottom:20px}
.form-group label{display:block;margin-bottom:8px;font-weight:600}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:#fff}
.form-group textarea{resize:vertical}
.form-consent{display:flex;gap:12px;margin:18px 0 24px}
.form-note{margin-top:16px;font-size:.9rem;color:var(--text-light)}
.contact-side-image{position:relative;overflow:hidden;border-radius:28px;box-shadow:var(--shadow-md)}
.contact-side-image img{height:520px}
.contact-side-badge{position:absolute;left:20px;right:20px;bottom:20px;background:rgba(8,18,36,.82);backdrop-filter:blur(12px);padding:20px;border-radius:18px}
.contact-side-badge span{display:block;color:var(--gold-light);font-size:.75rem;text-transform:uppercase}
.contact-side-badge strong{display:block;color:#fff;font-family:"Cormorant Garamond",serif;font-size:1.6rem}
.contact-hours{margin-top:24px;padding:28px;background:var(--cream);border-radius:24px}
.contact-hours-row{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line)}
.contact-hours .btn{margin-top:22px;width:100%}
.contact-map{position:relative}
.contact-map-frame iframe{width:100%;height:520px;border:0}
.contact-map-card-wrap{position:relative}
.contact-map-card{max-width:420px;margin-top:-110px;background:#fff;padding:32px;border-radius:24px;box-shadow:var(--shadow-md)}
.contact-faq{background:var(--cream)}
.contact-faq-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px}
.contact-cta{position:relative;min-height:600px;display:grid;place-items:center;text-align:center;overflow:hidden}
.contact-cta-media,.contact-cta-media img,.contact-cta-media span{position:absolute;inset:0}
.contact-cta-media img{width:100%;height:115%}
.contact-cta-media span{background:linear-gradient(rgba(8,18,36,.82),rgba(8,18,36,.92))}
.contact-cta-content{position:relative;z-index:2;max-width:820px}
.contact-cta-content h2{color:#fff}
.contact-cta-content>p:not(.section-eyebrow){color:rgba(255,255,255,.74);margin:20px auto 28px}
.contact-cta-actions{display:flex;justify-content:center;gap:16px}
.contact-cta-actions .btn-outline{color:#fff;border-color:rgba(255,255,255,.35)}
@media(max-width:992px){
.contact-card-grid,.contact-main-grid,.contact-faq-grid{grid-template-columns:1fr}
.contact-map-card{margin:30px auto 0}
}
@media(max-width:768px){
.form-row{grid-template-columns:1fr}
.contact-card-grid{grid-template-columns:1fr}
.contact-side-image img{height:380px}
.contact-cta-actions{flex-direction:column;align-items:center}
.contact-cta-actions .btn{width:min(100%,340px)}
}
