:root { --ink: #f3eee4; --deep: #211910; --deepest: #111216; --gold: #d8a956; --gold-light: #f0d18b; --muted: #a99e8f; --line: rgba(236, 215, 178, .16); --serif: Georgia, "Times New Roman", serif; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--deep); color: var(--ink); font-family: Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
.contacts-container { width: min(100% - 48px, 1400px); margin-inline: auto; }
.contacts-header { border-top: 2px solid var(--gold); background: #17120e; }
.contacts-header-inner { min-height: 83px; display: flex; align-items: center; justify-content: space-between; }
.contacts-brand { display: inline-flex; align-items: center; gap: 13px; color: var(--gold-light); font-family: var(--serif); font-size: 19px; letter-spacing: .08em; }
.contacts-brand small { display: block; margin-top: 5px; color: #a99d8d; font-family: Arial, Helvetica, sans-serif; font-size: 7px; letter-spacing: .15em; }
.contacts-logo { display: block; flex: none; width: 45px; height: 45px; object-fit: contain; }
.contacts-back { color: #d8cdbc; font-size: 12px; }
.contacts-back span { margin-left: 8px; color: var(--gold); font-size: 17px; }
.contacts-main { padding: 42px 0 75px; }
.contacts-breadcrumb { margin-bottom: 26px; color: #9e9181; font-size: 10px; }
.contacts-breadcrumb a { color: var(--gold-light); }
.contacts-breadcrumb span { margin: 0 8px; color: #615548; }
.contacts-top { display: grid; grid-template-columns: .96fr 1.04fr; gap: 65px; align-items: start; }
.contacts-intro { padding-top: 4px; }
.contacts-intro h1 { margin: 0 0 15px; font-family: var(--serif); font-size: clamp(52px, 6vw, 76px); font-weight: 400; letter-spacing: -.055em; line-height: 1; }
.contacts-intro p { max-width: 560px; margin: 0 0 16px; color: #c5b9a8; font-size: 13px; line-height: 1.65; }
.contacts-status { display: inline-flex; align-items: center; gap: 9px; margin-top: 7px; padding: 8px 12px; border: 1px solid rgba(226, 201, 153, .2); border-radius: 20px; color: #e6d8bd; font-size: 10px; }
.contacts-status span { width: 6px; height: 6px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 4px rgba(216,169,86,.11); }
.contact-phone-card { display: flex; align-items: center; gap: 13px; min-height: 73px; padding: 13px 15px; border-radius: 13px; background: linear-gradient(110deg, #eddaa7, #b58b3d); color: #2a2015; }
.contact-action-icon { display: grid; place-items: center; flex: none; width: 27px; height: 27px; border-radius: 8px; background: rgba(38,29,19,.45); color: #f0d391; font-size: 12px; font-weight: 700; }
.contact-phone-card small, .contact-action-card small { display: block; color: #806741; font-size: 9px; }
.contact-phone-card strong { display: block; margin-top: 4px; font-family: var(--serif); font-size: 17px; font-weight: 700; }
.contact-phone-card b { margin-left: auto; padding: 7px 11px; border-radius: 14px; background: #251c14; color: #f3dfad; font-size: 9px; white-space: nowrap; }
.contact-action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.contact-action-card { min-height: 84px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 11px; background: rgba(255,255,255,.045); transition: border-color .2s, background .2s, transform .2s; }
.contact-action-card:hover { border-color: rgba(216,169,86,.55); background: rgba(255,255,255,.08); transform: translateY(-2px); }
.contact-action-card .contact-action-icon { width: 24px; height: 24px; margin-bottom: 8px; background: #413222; color: var(--gold); }
.contact-action-card small { color: #9e907c; }
.contact-action-card strong { display: block; margin-top: 4px; color: #f2eadb; font-size: 11px; }
.office-card { display: grid; grid-template-columns: 1.12fr .88fr; min-height: 480px; margin-top: 35px; overflow: hidden; border-radius: 18px; background: #f7f4ed; color: #28221c; }
.office-map { position: relative; min-height: 480px; background: #d7d0c3; }
.office-map iframe { display: block; width: 100%; height: 100%; min-height: 480px; border: 0; }
.map-link { position: absolute; left: 12px; bottom: 12px; padding: 8px 10px; border-radius: 4px; background: rgba(255,255,255,.94); color: #6f5030; font-size: 10px; box-shadow: 0 2px 8px rgba(35,25,15,.15); }
.office-details { padding: 28px 28px 25px; }
.office-kicker { display: block; margin-bottom: 12px; color: #8f7959; font-size: 9px; letter-spacing: .16em; }
.office-details h2 { margin: 0 0 15px; font-family: var(--serif); font-size: 31px; font-weight: 400; letter-spacing: -.035em; }
.office-details p { margin: 0; color: #504942; font-size: 12px; line-height: 1.55; }
.copy-address { margin-top: 16px; padding: 7px 10px; border: 0; border-radius: 12px; background: #ece5d7; color: #806b4e; font: inherit; font-size: 10px; cursor: pointer; }
.office-rule { height: 1px; margin: 22px 0 17px; background: #d6ccbc; }
.office-hours > div { display: flex; justify-content: space-between; gap: 20px; padding: 9px 11px; border-bottom: 1px solid #e0d8cb; color: #4b443b; font-size: 11px; }
.office-hours > div:first-of-type { background: #eee8dc; }
.office-hours strong { font-weight: 700; }
.office-hours small { display: block; margin-top: 12px; color: #82786b; font-size: 10px; }
.route-note { display: flex; gap: 11px; margin-bottom: 9px; padding: 11px; border: 1px solid #bb8d47; border-radius: 9px; background: #fbf9f4; }
.route-note > span { display: grid; place-items: center; flex: none; width: 24px; height: 24px; border-radius: 50%; background: #79572f; color: white; font-size: 11px; }
.route-note p { font-size: 10px; }
.route-note strong { color: #33291f; }
.route-button, .office-appointment { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; border: 1px solid #d1c3ad; border-radius: 8px; color: #76552d; font-size: 11px; }
.office-appointment { margin-top: 19px; border-color: #76552d; background: #76552d; color: white; font-weight: 700; }
.office-appointment span, .route-button span { font-size: 16px; }
.contacts-footer { padding: 23px 0; background: #17120e; color: #a99c8d; font-size: 10px; }
.contacts-footer .contacts-container { display: flex; justify-content: space-between; gap: 20px; }
.contacts-footer div { display: flex; gap: 22px; }
.contacts-footer a { color: #dbc28b; }
@media (max-width: 900px) { .contacts-container { width: min(100% - 34px, 1400px); } .contacts-top, .office-card { grid-template-columns: 1fr; } .contacts-top { gap: 31px; } .office-map, .office-map iframe { min-height: 360px; height: 360px; } }
@media (max-width: 520px) { .contacts-header-inner { min-height: 70px; } .contacts-brand { font-size: 16px; gap: 9px; } .contacts-brand small { font-size: 6px; } .contacts-logo { width: 39px; height: 39px; } .contacts-back { font-size: 10px; } .contacts-main { padding-top: 29px; } .contacts-intro h1 { font-size: 54px; } .contact-phone-card { align-items: flex-start; flex-wrap: wrap; } .contact-phone-card b { margin-left: 40px; } .contact-action-grid { gap: 6px; } .contact-action-card { min-height: 91px; padding: 10px; } .contact-action-card strong { font-size: 10px; overflow-wrap: anywhere; } .office-details { padding: 24px 17px 20px; } .contacts-footer .contacts-container, .contacts-footer div { flex-direction: column; gap: 10px; } }

@media (min-width: 521px) {
  .contacts-header-inner { min-height: 68px; }
  .contacts-brand { font-size: 16px; }
  .contacts-logo { width: 38px; height: 38px; }
  .contacts-main { padding: 30px 0 52px; }
  .contacts-top { gap: 42px; }
  .contacts-intro h1 { font-size: clamp(36px, 3.8vw, 48px); }
  .office-card { min-height: 370px; }
  .office-map, .office-map iframe { min-height: 370px; }
  .office-details { padding: 22px; }
}
@media (max-width: 520px) {
  .contacts-main { padding-bottom: 52px; }
  .contacts-intro h1 { font-size: 42px; }
  .office-map, .office-map iframe { min-height: 280px; height: 280px; }
}

/* Uniform 1.5x reduction for large headings */
.contacts-intro h1 { font-size: clamp(24px, 2.53vw, 32px); }
.office-details h2 { font-size: 21px; }
@media (max-width: 520px) {
  .contacts-intro h1 { font-size: 28px; }
}