:root{
    --accent: #d4af37;
    --muted: #6b7376;
    --surface: #ffffff;
    --glass: rgba(255,255,255,0.9);
    --card-shadow: 0 12px 30px rgba(20,20,20,0.06);
}



/* Base */
body.contact-page, .contact-page { font-family: 'Outfit', sans-serif; color:#1b2730; background:#f5f5f5; }
main.contact-page { padding-top: 80px; }

/* HERO */
.contact-hero{ position:relative; min-height:36vh; display:flex; align-items:center; justify-content:center; padding:3.5rem 1rem; overflow:hidden; }
.contact-hero-video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.contact-hero .hero-bg{ position:absolute; inset:0; background-image:linear-gradient(180deg, rgba(7,10,12,0.6), rgba(7,10,12,0.6)); z-index:1; }
.contact-hero .hero-inner{ position:relative; max-width:980px; text-align:center; color:#fff; z-index:2; }
.contact-hero .eyebrow{ color:var(--accent); font-weight:700; letter-spacing:0.18em; text-transform:uppercase; margin-bottom:0.6rem; font-size:0.85rem; }
.contact-hero h1{ font-size:clamp(2rem,4vw,2.8rem); margin:0 0 0.6rem; font-weight:700; }
.contact-hero .hero-sub{ color:rgba(255,255,255,0.9); max-width:760px; margin:0 auto; }

/* CONTENT LAYOUT */
.contact-content{ padding:3rem 1.25rem 5rem; max-width:1200px; margin:0 auto; }
.contact-grid{ display:grid; grid-template-columns: 300px 1fr 340px; gap:28px; align-items:start; }

/* INFO CARDS (LEFT) */
.contact-cards{ display:flex; flex-direction:column; gap:18px; }
.info-card{ display:flex; gap:14px; align-items:center; padding:16px; border-radius:12px; background:var(--surface); box-shadow:var(--card-shadow); border:1px solid rgba(20,20,20,0.03); transition:transform .18s ease,box-shadow .18s ease; }
.info-card:hover{ transform:translateY(-6px); box-shadow:0 24px 60px rgba(20,20,20,0.08); }
.info-icon{ width:52px; height:52px; border-radius:10px; display:grid; place-items:center; background:linear-gradient(135deg, rgba(212,175,55,0.12), rgba(255,255,255,0.95)); color:var(--accent); }
.info-body h4{ margin:0; font-size:1rem; font-weight:700; }
.info-body .muted{ margin:4px 0 0; color:var(--muted); font-size:0.95rem; }

/* FORM (CENTER) */
.contact-form{ background:linear-gradient(180deg,#ffffff,#fbfbfb); padding:22px; border-radius:14px; box-shadow:0 20px 45px rgba(15,20,25,0.06); border:1px solid rgba(15,20,25,0.04); }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.form-field{ display:flex; flex-direction:column; gap:6px; }
.form-field label{ font-weight:700; font-size:0.95rem; color:#111827; }
.form-field input, .form-field select, .form-field textarea{ padding:12px 14px; border-radius:10px; border:1px solid rgba(20,20,20,0.06); background:transparent; font-size:0.95rem; color:#0b1220; transition:box-shadow .12s ease, transform .08s ease; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus{ box-shadow:0 12px 30px rgba(16,24,40,0.06); transform:translateY(-2px); outline:none; }
.form-field textarea{ min-height:140px; resize:vertical; }
.error{ color:#c53030; font-size:0.88rem; min-height:18px; }

.form-actions{ display:flex; gap:12px; align-items:center; margin-top:12px; }
.btn{ padding:12px 18px; border-radius:999px; cursor:pointer; font-weight:700; border:0; }
.btn-primary{ background:linear-gradient(90deg,var(--accent),#f2d06b); color:#111; box-shadow:0 12px 28px rgba(212,175,55,0.12); }
.btn-secondary{ background:transparent; color:#111; border:1px solid rgba(20,20,20,0.06); }

/* MAP (RIGHT) */
.contact-map .map-title{ margin:0 0 10px; font-weight:700; }
.map-embed{ height:360px; border-radius:12px; overflow:hidden; box-shadow:0 16px 36px rgba(16,24,40,0.06); border:1px solid rgba(20,20,20,0.04); }

/* Responsive */
@media (max-width:1100px){
    .contact-grid{ grid-template-columns: 1fr; gap:36px; }
    .contact-map{ order:3; }
    .contact-cards{ order:1; display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
    .contact-form{ order:2; }
    .map-embed{ height:300px; }
}

@media (max-width:768px){
    .contact-cards{ grid-template-columns: 1fr; }
    .form-grid{ grid-template-columns: 1fr; }
    .contact-content{ padding:2rem 1rem 4rem; }
}

@media (prefers-reduced-motion: no-preference){ .fade-up-scroll{ transform:translateY(12px); opacity:0; transition:all .6s ease; } .fade-up-scroll.visible{ transform:none; opacity:1; } }