/* ALBA Residences — language switch, Hebrew typography and RTL mirroring for the landing page.
   Kept apart from style.css (shared with the brand book) so the landing can change without touching brand pages. */

/* ---------- header: language switch ---------- */
.hdr__end { justify-self: end; display: flex; align-items: center; gap: clamp(20px, 2.2vw, 32px); }
.hdr__end .btn--hdr { justify-self: auto; }
.lang-sw { display: inline-flex; align-items: center; gap: 15px; font: 400 12px/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; }
.lang-sw a { position: relative; display: inline-flex; align-items: center; min-height: 32px; opacity: .62; transition: opacity .4s var(--ease); }
.lang-sw a:hover, .lang-sw a[aria-current] { opacity: 1; }
.lang-sw a[aria-current]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 6px; height: 1px; background: currentColor; }
.lang-sw a + a::before { content: ""; position: absolute; inset-inline-start: -8px; top: 50%; width: 1px; height: 11px; margin-top: -5.5px; background: currentColor; opacity: .45; }
.lang-sw a[lang="he"] { font-family: "Heebo", var(--sans); font-size: 13.5px; letter-spacing: 0; }
@media (max-width: 767px) {
  .lang-sw a[aria-current] { display: none; }
  .lang-sw a + a::before { display: none; }
  .lang-sw a { min-width: 44px; min-height: 44px; justify-content: center; opacity: 1; }
}

/* no flash of English while the Hebrew is being applied (failsafe in i18n.js) */
html.i18n-wait body { opacity: 0; }

/* ---------- Hebrew typography: Frank Ruhl Libre in the serif roles, Heebo in the text roles ----------
   Hebrew faces come first so punctuation and figures inside sentences match the letters; stand-alone figures stay in Bodoni. */
html[lang="he"] {
  --serif: "Frank Ruhl Libre", "Bodoni Moda", "Times New Roman", serif;
  --sans: "Heebo", "Hanken Grotesk", "Helvetica Neue", system-ui, sans-serif;
}
/* pure figures keep the brand's Bodoni in Hebrew too */
html[lang="he"] :is(.fact dd:not(.fact__txt), .av__num, .av__id, .av__time, .lb__n [data-lb-n], .amen__count) { font-family: "Bodoni Moda", "Frank Ruhl Libre", serif; }
html[lang="he"] .amen__count { font-family: "Hanken Grotesk", "Heebo", sans-serif; }
html[lang="he"] body { font-weight: 300; line-height: 1.7; }
html[lang="he"] .h2 { letter-spacing: 0; line-height: 1.05; font-weight: 500; }
html[lang="he"] .h3 { letter-spacing: 0; font-weight: 500; line-height: 1.2; }
html[lang="he"] .statement { letter-spacing: 0; line-height: 1.45; }
/* Latin-style wide tracking and small caps sizes do not suit Hebrew: no tracking, a size up */
html[lang="he"] :is(.eyebrow, .tlink, .btn, .hdr__nav, .tab, .caption, .step__n, .fact dt, .spec dt, .team dt, .field label,
  .av__hint, .av__tip, .av__lbl, .av__explore, .av__st, .av__dt, .av__status, .av__spec dt, .av__legend, .amen__count, .plan text, .map__sealabel, .map__street, .hero__note) {
  letter-spacing: 0;
}
html[lang="he"] :is(.eyebrow, .fact dt, .spec dt, .team dt, .field label, .av__lbl, .av__dt, .av__spec dt) { font-size: 13.5px; font-weight: 400; }
html[lang="he"] :is(.btn, .tlink) { font-size: 14.5px; font-weight: 500; }
html[lang="he"] .hdr__nav { font-size: 15px; }
html[lang="he"] .tab { font-size: 15px; }
html[lang="he"] :is(.av__st, .av__status, .av__legend, .av__tip, .av__explore) { font-size: 13px; font-weight: 400; }
html[lang="he"] .av__hint { font-size: 13px; }
html[lang="he"] .hero__note { font-size: 12.5px; }
html[lang="he"] .caption, html[lang="he"] .panel__plan figcaption { font-size: 13px; letter-spacing: 0; }
html[lang="he"] .fact dd.fact__txt, html[lang="he"] .spec dd, html[lang="he"] .team dd { font-weight: 500; }
html[lang="he"] .plan text { font-size: 12px; font-weight: 400; }
html[lang="he"] .map__sealabel { font-size: 15px; letter-spacing: .12em; }
html[lang="he"] .map__street { font-size: 13px; letter-spacing: .04em; }

/* drawings keep their geometry: labels are placed in an LTR coordinate system; Hebrew runs still read right to left */
.plan, .map, .elev { direction: ltr; }
/* drawings stay unmirrored; Hebrew room names are set rtl so "חדר שינה 1" keeps its number at the end (labels are centred, so nothing moves) */
html[lang="he"] .plan text { direction: rtl; }

/* ---------- RTL mirroring (logical where style.css is physical) ---------- */
[dir="rtl"] .skip { left: auto; right: 16px; }
[dir="rtl"] .tlink::after, [dir="rtl"] .hdr__nav a::after { transform-origin: right; }
[dir="rtl"] .hero__media::after { background: linear-gradient(180deg, rgba(10,12,14,0) 38%, rgba(10,12,14,.34) 70%, rgba(10,12,14,.62) 100%), linear-gradient(270deg, rgba(10,12,14,.3) 0%, rgba(10,12,14,0) 50%); }
[dir="rtl"] .hero__note { right: auto; left: var(--gutter); }

[dir="rtl"] .fact { padding: 22px 0 12px 24px; }
[dir="rtl"] .fact + .fact { padding-left: 24px; padding-right: 24px; border-left: 0; border-right: 1px solid var(--line); }

[dir="rtl"] .tab { padding: 18px 0 20px 8px; text-align: right; }
[dir="rtl"] .tabs__ink { left: auto; right: 0; }
[dir="rtl"] .spec > div:nth-child(even) { padding-left: 0; padding-right: 22px; border-left: 0; border-right: 1px solid var(--line); }

[dir="rtl"] .av__hint { left: auto; right: 0; }
[dir="rtl"] .av__panel { padding: 0 clamp(28px, 3vw, 48px) 20px 0; }
[dir="rtl"] .av__panel::before { left: auto; right: 0; }
[dir="rtl"] .av__row { text-align: right; }
[dir="rtl"] .av__row::before { left: auto; right: 0; }
[dir="rtl"] .av__row[aria-pressed="true"] { padding-left: 0; padding-right: 16px; }
[dir="rtl"] .dot, [dir="rtl"] .av__legend .dot { margin-right: 0; margin-left: 9px; }
[dir="rtl"] .av__spec > div:nth-child(even) { padding-left: 0; padding-right: 18px; border-left: 0; border-right: 1px solid var(--line); }
[dir="rtl"] .av__num, [dir="rtl"] .av__time, [dir="rtl"] .lb__n [data-lb-n] { direction: ltr; unicode-bidi: isolate; }
[dir="rtl"] .lb__x { right: auto; left: 18px; }

[dir="rtl"] .card { scroll-margin-left: 0; scroll-margin-right: var(--gutter); }
[dir="rtl"] .amen__bar span { transform-origin: right; }

[dir="rtl"] .team__list > div { padding: 22px 0 0 24px; }
[dir="rtl"] .team__list > div + div { padding-left: 24px; padding-right: 24px; border-left: 0; border-right: 1px solid var(--line); }

[dir="rtl"] .field select { padding-right: 0; padding-left: 30px; }
[dir="rtl"] .field__chev { right: auto; left: 0; }
[dir="rtl"] .field input[dir="ltr"] { text-align: right; }
[dir="rtl"] .field input[dir="ltr"]::placeholder { text-align: right; }
.field input::placeholder { color: rgba(255,255,255,.34); opacity: 1; }

@media (max-width: 1023px) {
  [dir="rtl"] .av__panel { padding: 0 var(--gutter) 22px; }
}
@media (max-width: 767px) {
  [dir="rtl"] .fact, [dir="rtl"] .fact + .fact { padding: 20px 0 26px; border-right: 0; }
  [dir="rtl"] .fact:nth-child(even) { padding-left: 0; padding-right: 20px; border-left: 0; border-right: 1px solid var(--line); }
  [dir="rtl"] .tab { padding: 16px 0 18px; text-align: center; }
  html[lang="he"] .tab { font-size: 13px; line-height: 1.25; }
  [dir="rtl"] .team__list > div, [dir="rtl"] .team__list > div + div { padding: 20px 0 24px; border-right: 0; }
  [dir="rtl"] .team__list > div:nth-child(even) { padding-left: 0; padding-right: 20px; border-left: 0; border-right: 1px solid var(--line); }
  html[lang="he"] .plan text { font-size: 21px; }
  html[lang="he"] .map__sealabel { font-size: 24px; letter-spacing: .06em; }
}

/* ---------- walk-through links (to ../residences/) ---------- */
.panel__walk { margin-top: 26px; }
.av__links { display: flex; flex-wrap: wrap; gap: 14px 22px; }