/* Manchester City Yas Residences Phase 2 skin, loaded after the shared site.css. Taken from Ohana's leaflet:
   its sky blue (#569ED0) for headings, maps and rules, the pale blue paper (#EAF2F8), white pages, and
   headings in tall condensed capitals ("A DESTINATION THAT FOLLOWS ITS OWN PACE", LF p2); the buttons a
   deeper shade of the same blue (#2B6CA8) so white type reads on them.
   Arabic keeps normal spacing: spaced letters break Arabic joining. */
:root {
  --ink: #1B2A3A;
  --muted: #586777;
  --ground: #FFFFFF;
  --pale: #EAF2F8;
  --band: #F2F7FB;
  --line: #D3E2EE;
  --sky: #569ED0;
  --deep: #2B6CA8;
  --radius: 0;
  --shadow: 0 6px 28px rgba(43, 108, 168, 0.08);
}
body { background: var(--ground); }
.hdr { background: rgba(255, 255, 255, 0.92); }
.hdr.is-solid, .hdr.is-menu, .mnav { background: var(--ground); }
.hdr__logo--project img { width: 104px; height: auto; }

/* ---------- type: tall condensed capitals in the sky blue, as the leaflet sets them ---------- */
.eyebrow { font-size: 12px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--sky); margin-bottom: 10px; }
.h2, .form__title { font-weight: 700; font-size: 34px; line-height: 1.1; letter-spacing: 0.01em; text-transform: uppercase; font-stretch: condensed; color: var(--sky); }
.hero__title { font-weight: 700; font-size: 56px; line-height: 1.04; letter-spacing: 0.01em; text-transform: uppercase; font-stretch: condensed; text-shadow: 0 2px 18px rgba(0, 0, 0, 0.45); }
.hero__sub { font-weight: 500; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.6); }
[dir="rtl"] .eyebrow, [dir="rtl"] .h2, [dir="rtl"] .form__title, [dir="rtl"] .hero__title { letter-spacing: 0; text-transform: none; }

/* ---------- buttons: flat, the deeper City blue ---------- */
.btn { border-radius: 0; letter-spacing: 0.06em; text-transform: uppercase; font-size: 14px; }
[dir="rtl"] .btn { letter-spacing: 0; }
.btn--line { color: var(--deep); border-color: var(--deep); }
.btn--line:hover { background: var(--deep); }
.btn--white { color: var(--deep); }
.tab { border-radius: 0; }

/* ---------- first screen ---------- */
.hero__dev { width: 120px; }
.hcard--glass { background: rgba(43, 108, 168, 0.45); border-radius: 0; }
.hcard--solid { background: var(--deep); border-radius: 0; }

/* ---------- bands in the leaflet's colours ---------- */
.amen { background: var(--pale); }
.amen__text { background: var(--ground); }
.gallery { background: var(--band); }
.unit__row, .plans, .facts { background: var(--band); }
.unit.is-open .unit__row { background: var(--deep); }
.loc__card { background: var(--pale); }
.drive__n { background: var(--sky); color: #fff; }

@media (max-width: 700px) {
  .hero__title { font-size: 36px; }
  .h2, .form__title { font-size: 27px; }
}
