/* Su Varna Figma typography parity.
 * Scope: /embassy-world/ and /property/embassy-world/ only.
 * Source frames: Figma 5:222, 126:2559, 89:361 and 130:7543.
 * Loaded after all page styles so the correction remains isolated.
 */

@font-face {
  font-family: "Prompt";
  src: url("../fonts/embassy-world/prompt-thai-600.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  unicode-range: U+0E00-0E7F;
}

body.ew-page.ew-page {
  --suvarna-font-body: Raleway, Arial, sans-serif;
  --suvarna-font-ui: Montserrat, Arial, sans-serif;
  --suvarna-font-baht: Prompt, "Noto Sans Thai", "Arial Unicode MS", Arial, sans-serif;
  --ew-font-body: var(--suvarna-font-body);
  --ew-font-accent: var(--suvarna-font-ui);
  font-family: var(--suvarna-font-body);
  font-weight: 500;
  letter-spacing: 0;
  font-synthesis: none;
}

body.ew-page.ew-page :where(main, header, footer, dialog, form, button, input, select, textarea) {
  font-synthesis: none;
}

/* Figma body copy: Raleway Medium. Keep values and prominent UI separate. */
body.ew-page.ew-page :where(
  main p,
  main li,
  main small,
  main label,
  .ew-lead,
  .ew-footer,
  .ew-footer p,
  .ew-footer li,
  .ew-footer a:not(.ew-button),
  .ew-modal > p,
  .sl-modal > p,
  .sl-subtitle,
  .sl-overview__copy p,
  .sl-card-grid p,
  .sl-similar-card__body p
) {
  font-family: var(--suvarna-font-body);
  font-weight: 500;
  letter-spacing: 0;
}

/* Figma headings and prominent UI: Montserrat SemiBold. */
body.ew-page.ew-page :where(h1, h2, h3, h4, h5, h6) {
  font-family: var(--suvarna-font-ui);
  font-weight: 600;
  letter-spacing: 0;
  font-synthesis: none;
}

body.ew-page.ew-page :where(
  .ew-button,
  .sl-button,
  button[type="submit"],
  input[type="submit"]
) {
  font-family: var(--suvarna-font-ui);
  font-size: 14px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: 0;
  text-transform: none;
  font-synthesis: none;
  
}

body.ew-page.ew-page :where(
  .sl-filter-group button,
  .sl-floor-list button,
  .sl-unit-tabs button,
  .sl-plan-tabs button,
  .sl-comparison button,
  .ew-apartment-tabs button,
  select,
  input[type="number"]
) {
  font-family: var(--suvarna-font-ui);
  font-weight: 600;
  letter-spacing: 0;
  font-synthesis: none;
}

/* Navigation remains compact at laptop widths but uses the Figma UI family. */
body.ew-page.ew-page :where(
  .ew-nav-item > a,
  .ew-subnav a,
  .ew-subnav-call,
  .ew-mobile-menu a,
  .ew-page > .sidemenu .navigation__link,
  .ew-page > .sidemenu .sub-nav__link,
  .ew-page > .sidemenu .sidemenu__toggle
) {
  font-family: var(--suvarna-font-ui);
  font-weight: 600;
  font-synthesis: none;
}

body.ew-page.ew-page .ew-nav-item > a {
  font-family: var(--suvarna-font-ui);
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: 2px;
  text-transform: uppercase;
  font-synthesis: none;
}

body.ew-page.ew-page :where(.ew-subnav a, .ew-subnav-call) {
  font-size: 12px;
  line-height: 18px;
  letter-spacing: 2px;
  text-transform: uppercase;
}

/* Section labels: Raleway SemiBold with the 4% tracking from Figma. */
body.ew-page.ew-page :where(.ew-section-label, .sl-eyebrow, .sl-kicker) {
  font-family: var(--suvarna-font-body);
  font-size: 13px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Hero labels are Montserrat UI elements in both source frames. */
body.ew-page.ew-page :where(.ew-kicker, .ew-hero .ew-eyebrow, .sl-hero__content .sl-eyebrow) {
  font-family: var(--suvarna-font-ui);
  font-weight: 600;
  letter-spacing: 0;
}

body.ew-page.ew-page .ew-hero .ew-eyebrow {
  font-size: 16px;
  line-height: 20px;
}

body.ew-page.ew-page .sl-hero__content .sl-eyebrow {
  font-size: 14px;
  line-height: 18px;
  text-transform: uppercase;
}

body.ew-page.ew-page :where(.ew-hero__location, .sl-lead-copy, .sl-overview__copy .sl-lead-copy) {
  font-family: var(--suvarna-font-ui);
  font-weight: 600;
}

/* Forms: compact Montserrat labels, readable Raleway consent copy. */
body.ew-page.ew-page :where(
  form label:not(.ew-consent):not(.sl-modal__consent),
  .ew-inline-form label:not(.ew-consent),
  .ew-modal label:not(.ew-consent),
  .sl-modal form > label:not(.sl-modal__consent)
) {
  font-family: var(--suvarna-font-ui);
  font-size: 13px;
  font-weight: 600;
  line-height: 18px;
  letter-spacing: 0;
  text-transform: none;
}

body.ew-page.ew-page :where(
  .ew-consent,
  .sl-consent,
  .sl-modal__consent,
  form label:has(input[type="checkbox"])
) {
  font-family: var(--suvarna-font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: 0;
  text-transform: none;
}

/* Override the legacy global form-label token without changing form geometry. */
body.ew-page.ew-page form label.ew-consent,
body.ew-page.ew-page form label.sl-consent,
body.ew-page.ew-page form label.sl-modal__consent,
body.ew-page.ew-page form label:has(input[type="checkbox"]) {
  font-family: var(--suvarna-font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: 0;
  text-transform: none;
  font-synthesis: none;
}

/* The baht glyph has its own Figma typeface and must not inherit UI styles. */
body.ew-page.ew-page :where(
  .ew-currency-symbol,
  .sl-currency-symbol--thb,
  .sl-currency-tab-symbol
) {
  font-family: var(--suvarna-font-baht);
  font-size: 1em;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0;
  text-transform: none;
  font-synthesis: none;
}

/* Footer tokens from the desktop Figma frames. */
body.ew-page.ew-page :where(.ew-footer__group-toggle, .ew-footer h2, .ew-footer h3, .ew-footer h4) {
  font-family: var(--suvarna-font-ui);
  font-size: 16px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: 0;
  text-transform: uppercase;
}

body.ew-page.ew-page .ew-footer :where(p, li, a:not(.ew-button):not(.social-button)) {
  font-family: var(--suvarna-font-body);
  font-size: 13px;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0;
}

/* Preserve the responsive Telegram composition that was previously verified. */
@media (min-width: 1181px) and (max-width: 1320px) {
  body.ew-page.ew-page .ew-telegram-poster {
    min-height: 538px;
    padding: 34px 32px;
  }

  body.ew-page.ew-page .ew-telegram-poster :where(span, strong, small, b, i) {
    flex: 0 0 auto;
  }

  body.ew-page.ew-page .ew-telegram-poster span {
    font-size: 40px;
    line-height: 43px;
  }

  body.ew-page.ew-page .ew-telegram-poster i {
    width: 64px;
    height: 64px;
    margin-top: 18px;
  }

  body.ew-page.ew-page .ew-telegram-poster strong {
    margin-top: 14px;
    padding: 12px 14px;
    font-size: 22px;
    line-height: 28px;
  }

  body.ew-page.ew-page .ew-telegram-poster small {
    margin-top: 26px;
    font-size: 20px;
    line-height: 24px;
  }

  body.ew-page.ew-page .ew-telegram-poster b {
    margin-top: 14px;
    font-size: 40px;
  }
}

@media (max-width: 900px) {
  body.ew-page.ew-page :where(.ew-section-label, .sl-eyebrow, .sl-kicker) {
    font-size: 14px;
    line-height: 20px;
  }

  body.ew-page.ew-page :where(
    .ew-button,
    .sl-button,
    button[type="submit"],
    input[type="submit"]
  ) {
    font-size: 16px;
    line-height: 20px;
  }

  body.ew-page.ew-page :where(
    .ew-consent,
    .sl-consent,
    .sl-modal__consent,
    form label:has(input[type="checkbox"])
  ) {
    font-size: 16px;
    line-height: 22px;
  }

  body.ew-page.ew-page form label.ew-consent,
  body.ew-page.ew-page form label.sl-consent,
  body.ew-page.ew-page form label.sl-modal__consent,
  body.ew-page.ew-page form label:has(input[type="checkbox"]) {
    font-size: 16px;
    line-height: 22px;
  }

  body.ew-page.ew-page :where(.ew-footer__group-toggle, .ew-footer h2, .ew-footer h3, .ew-footer h4) {
    font-size: 20px;
    line-height: 24px;
  }

  body.ew-page.ew-page .ew-footer :where(p, li, a:not(.ew-button):not(.social-button)) {
    font-size: 16px;
    line-height: 22px;
  }
}

@media (max-width: 420px) {
  body.ew-page.ew-page :where(.ew-button, .sl-button, button[type="submit"], input[type="submit"]) {
    max-width: 100%;
    padding-inline: 14px;
    white-space: normal;
    overflow-wrap: anywhere;
  }
}

/* Landing price parity: Figma places a compact baht sign before the number. */
body.ew-page.ew-page .ew-price .ew-currency-symbol {
  display: inline-block;
  font-size: 0.86em;
  line-height: 1;
  vertical-align: 0.035em;
  letter-spacing: 0;
}

/* Price typography alignment: compact baht glyphs and one subtitle face. */
/* Property hero: the Thai glyph is an accessory to the price, not a full-size digit. */
body.ew-page.ew-page .sl-hero__content .sl-price .sl-currency-symbol--thb {
  display: inline-block;
  margin-left: 0.08em;
  font-family: var(--suvarna-font-baht);
  font-size: 0.74em;
  font-weight: 400;
  line-height: 1;
  vertical-align: -0.035em;
  letter-spacing: 0;
  font-synthesis: none;
}

/* Keep the Latin unit name and the Russian copy in one visual text system. */
body.ew-page.ew-page .sl-hero__content .sl-price + p {
  font-family: var(--suvarna-font-body);
  font-weight: 400;
  letter-spacing: 0;
  font-synthesis: none;
}

/* Advertising landing: compact the glyph in both the headline and summary price. */
body.ew-page.ew-page .ew-price > strong[data-ew-price] .ew-currency-symbol {

  font-weight: 400;
  line-height: 1;
  vertical-align: -0.025em;
}

body.ew-page.ew-page .ew-price__summary strong {
  gap: 2px;
  font-family: var(--suvarna-font-body);
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
}

body.ew-page.ew-page .ew-price__summary :where(.ew-price-prefix, .ew-price-number) {
  font-family: var(--suvarna-font-body);
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}

body.ew-page.ew-page .ew-price__summary .ew-currency-symbol {
  font-family: var(--suvarna-font-baht);
  font-weight: 400;
  line-height: 13px;
  vertical-align: -0.03em;
}
