/* JW Marriott Residences skin, loaded after the shared site.css (started from Marlin Icon's). Taken from TARAF's
   factsheet: the warm cream paper of its pages (#EEE9DF), the navy of the evening renders (#1F2A3D), the turquoise of
   the sea (#1E6F78), headings in spaced capitals ("LIVE WHERE OTHERS HOLIDAY"). Arabic keeps normal spacing. */
:root {
  --ink: #1F2A3D;
  --muted: #5A5F6A;
  --ground: #F6F3EC;
  --band: #EEE9DF;
  --line: #DCD5C8;
  --sky: #E2EEEE;
  --navy: #1F2A3D;
  --steel: #1E6F78;
  --steel-pale: #E4F0F0;
  --radius: 0;
  --shadow: 0 6px 28px rgba(31, 42, 61, 0.08);
}
body { background: var(--ground); }
.hdr { background: rgba(246, 243, 236, 0.92); }
.hdr.is-solid, .hdr.is-menu, .mnav { background: var(--ground); }

/* ---------- type: an italic serif for headings, spaced capitals for eyebrows ---------- */
.eyebrow { font: 600 12px/1.3 var(--sans); letter-spacing: 0.24em; text-transform: uppercase; color: var(--steel); margin-bottom: 12px; }
.h2, .form__title { font: 300 34px/1.15 var(--serif); letter-spacing: 0; color: var(--navy); }
.hero__title { font: 300 58px/1.04 var(--serif); letter-spacing: 0; text-shadow: 0 2px 18px rgba(0, 0, 0, 0.5); }
.hero__sub { font-weight: 500; text-shadow: 0 1px 10px rgba(0, 0, 0, 0.65); }
[dir="rtl"] .eyebrow, [dir="rtl"] .h2, [dir="rtl"] .form__title, [dir="rtl"] .hero__title { letter-spacing: 0; font-style: normal; }

/* ---------- buttons: flat, bronze ---------- */
.btn { border-radius: 0; letter-spacing: 0.08em; text-transform: uppercase; font-size: 13px; font-weight: 700; }
[dir="rtl"] .btn { letter-spacing: 0; }
.btn--line { color: var(--navy); border-color: var(--navy); }
.btn--line:hover { background: var(--navy); }
.btn--white { color: var(--navy); }
.tab { border-radius: 0; }

/* ---------- first screen ---------- */
.hero__dev { width: 110px; }
.hcard--glass { background: rgba(31, 42, 61, 0.55); border-radius: 0; }
.hcard--solid { background: var(--steel); border-radius: 0; }

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

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

/* The brochure sets its titles in thin spaced capitals. */
.h2, .form__title, .hero__title { text-transform: uppercase; letter-spacing: 0.06em; }
[dir="rtl"] .h2, [dir="rtl"] .form__title, [dir="rtl"] .hero__title { text-transform: none; letter-spacing: 0; }
.hero__dev { width: 86px; }
