/* Local service area pages */
.city-hero {
  padding: 92px 0 86px;
  color: var(--paper);
  background: radial-gradient(ellipse at 78% 28%, rgba(202,169,107,.17), transparent 35%), linear-gradient(120deg, #171916, #24251f);
}
.city-hero-inner { max-width: 1180px; }
.city-hero h1 {
  max-width: 960px;
  margin: 0;
  font: 400 clamp(46px, 6.5vw, 78px)/1.02 var(--serif);
  letter-spacing: -.045em;
}
.city-hero h1 em { color: var(--gold-light); font-weight: 400; }
.city-lede { max-width: 720px; margin: 24px 0; color: #d0cec5; font-size: 16px; line-height: 1.85; }
.city-actions { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.city-service-note { margin: 32px 0 0; padding-top: 16px; border-top: 1px solid rgba(244,241,234,.17); color: #aaa99f; font-size: 11px; line-height: 1.7; }
.city-content { background: var(--paper); }
.city-content-grid, .city-route-grid, .city-faq-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 9%; align-items: start; }
.city-content h2, .city-route h2, .city-faq h2, .city-services h2 {
  margin: 18px 0 0;
  font: 400 clamp(39px, 5vw, 60px)/1.03 var(--serif);
  letter-spacing: -.04em;
}
.city-content h2 em, .city-route h2 em, .city-faq h2 em, .city-services h2 em { color: #9c7840; }
.city-copy p, .city-route-grid > div:nth-child(2) > p {
  margin: 0 0 18px;
  color: #62635d;
  font-size: 14px;
  line-height: 1.9;
}
.city-services { padding: 85px 0; background: #ebe7de; }
.city-services h2 { margin-top: 0; }
.city-service-grid { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 38px; border-top: 1px solid #ccc5b9; border-left: 1px solid #ccc5b9; }
.city-service-grid article { min-height: 188px; padding: 25px; border-right: 1px solid #ccc5b9; border-bottom: 1px solid #ccc5b9; }
.city-service-grid h3 { margin: 0 0 12px; font: 400 22px/1.25 var(--serif); }
.city-service-grid p { margin: 0; color: #6e6e66; font-size: 12px; line-height: 1.8; }
.city-route { background: var(--paper-deep); }
.city-route-grid { align-items: center; }
.city-route-grid .button { margin-top: 8px; }
.city-faq { padding: 85px 0; background: #f8f6f0; }
.city-faq .faq-list { border-top: 1px solid #d9d4ca; }
.city-faq .faq-list details { padding: 19px 0; border-bottom: 1px solid #d9d4ca; }
.city-faq .faq-list summary { color: var(--ink); }
.city-faq .faq-list details p { color: #62635d; }
.city-more { padding: 48px 0; background: #ebe7de; }
.city-more h2 { margin: 0 0 20px; font: 400 25px/1.25 var(--serif); }
.city-more nav, .city-footer-links { display: flex; flex-wrap: wrap; gap: 9px 17px; }
.city-more nav a, .city-footer-links a { color: #60533e; font-size: 11px; border-bottom: 1px solid rgba(96,83,62,.3); padding: 5px 0; }
.city-more nav a:hover, .city-footer-links a:hover { color: #171916; border-color: #171916; }
.city-footer-links { padding-top: 16px; border-top: 1px solid rgba(244,241,234,.12); }
.city-footer-links a { color: #c9b17e; border-color: rgba(202,169,107,.3); }
.city-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 38px; }
.city-card { display: flex; min-height: 145px; flex-direction: column; justify-content: space-between; padding: 21px; border: 1px solid #d8d1c4; background: rgba(255,253,250,.5); transition: background .2s, transform .2s; }
.city-card:hover { background: var(--white); transform: translateY(-2px); }
.city-card > span { color: #887044; font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.city-card strong { font: 400 21px/1.3 var(--serif); }
.city-card small { color: #6e6e66; font-size: 10px; }
.city-card small b { padding-left: 4px; color: #755b30; font-size: 15px; }
.city-index-note { max-width: 760px; margin: 27px 0 0; color: #62635d; font-size: 13px; line-height: 1.8; }
/* City-page booking form */
.city-booking { scroll-margin-top: 88px; background: #171916; color: var(--paper); }
.city-booking-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: 8%; align-items: start; }
.city-booking-intro { position: sticky; top: 112px; }
.city-booking-intro h2 {
  margin: 18px 0 22px;
  font: 400 clamp(40px, 5vw, 60px)/1.03 var(--serif);
  letter-spacing: -.04em;
}
.city-booking-intro h2 em { color: var(--gold-light); font-weight: 400; }
.city-booking-intro > p:not(.section-index) { max-width: 430px; color: #c3c1b7; font-size: 13px; line-height: 1.85; }
.city-booking-intro ul { margin: 24px 0; padding: 0; list-style: none; }
.city-booking-intro li { position: relative; margin: 10px 0; padding-left: 23px; color: #dedbd2; font-size: 12px; line-height: 1.6; }
.city-booking-intro li::before { position: absolute; left: 0; top: 0; content: "✓"; color: var(--gold-light); font-weight: 700; }
.city-booking-intro .city-booking-phone { padding-top: 18px; border-top: 1px solid rgba(244,241,234,.16); }
.city-booking-phone a { color: var(--gold-light); font-weight: 700; }
.city-booking-panel { min-width: 0; }
.city-booking-form { padding: 34px; background: #fdfbf6; border-color: rgba(202,169,107,.24); box-shadow: 0 24px 70px rgba(0,0,0,.25); }
.city-booking-form .form-grid { gap: 16px; }
.city-booking-form .submit-button { width: 100%; min-height: 52px; margin-top: 20px; }
.city-booking-form .form-footnote { margin-top: 8px; }
.city-booking-form .form-status { margin-top: 10px; }
.city-booking-form select:required:invalid { color: #8d8b82; }

@media (max-width: 900px) {
  .city-booking-grid { grid-template-columns: 1fr; gap: 34px; }
  .city-booking-intro { position: static; }
  .city-booking-intro > p:not(.section-index) { max-width: 650px; }
}

@media (max-width: 700px) {
  .city-hero { padding: 62px 0; }
  .city-hero h1 { font-size: clamp(43px, 11vw, 60px); }
  .city-lede { font-size: 14px; }
  .city-content-grid, .city-route-grid, .city-faq-grid { grid-template-columns: 1fr; gap: 28px; }
  .city-services, .city-faq { padding: 65px 0; }
  .city-service-grid { grid-template-columns: 1fr; margin-top: 28px; }
  .city-service-grid article { min-height: auto; padding: 21px; }
  .city-card-grid { grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 28px; }
  .city-card { min-height: 132px; padding: 15px; }
  .city-card strong { font-size: 18px; }
  .city-booking { padding: 65px 0; }
  .city-booking-intro h2 { font-size: 42px; }
  .city-booking-form { padding: 22px 17px; }
  .city-booking-form .form-grid { grid-template-columns: 1fr; gap: 14px; }
  .city-booking-form .field-full { grid-column: auto; }
}
@media (max-width: 390px) {
  .city-card-grid { grid-template-columns: 1fr; }
}