/* Arabic + Russian pages: language fonts and right-to-left mirroring.
   Loaded after responsive.css so these overrides win. The brand fonts keep
   leading each stack, so Latin text (brand names, digits) still renders in
   Moisette / Maxima Nouva and only the Arabic or Cyrillic glyphs they lack
   fall through to the web fonts linked in each page's head. */

html[lang="ar"]{
  --font-serif:"Moisette","Amiri","Times New Roman",serif;
  --font-sans:"Maxima Nouva","Noto Sans Arabic","Helvetica Neue",Arial,sans-serif;
}
html[lang="ru"]{
  --font-sans:"Maxima Nouva","Montserrat","Helvetica Neue",Arial,sans-serif;
}

/* Arabic is a connected script: letter-spacing breaks the joins and
   uppercasing means nothing, so both are switched off. Italic is a synthetic
   slant in Arabic and reads badly; the gold colour still marks the emphasis. */
html[lang="ar"] *{letter-spacing:0 !important;text-transform:none !important}
html[lang="ar"] em{font-style:normal}
html[lang="ar"] body{line-height:1.85}
html[lang="ar"] .display,html[lang="ar"] .h2{line-height:1.3}
html[lang="ar"] .hero__title{white-space:normal;line-height:1.25}
html[lang="ar"] .board__note,html[lang="ar"] .footer__brand p{font-style:normal}

/* Russian words run longer than English; let the big headline wrap rather than
   overflow, and tighten the nav so the longer labels don't crowd the header tools. */
html[lang="ru"] .hero__title{white-space:normal;font-size:clamp(2.6rem,5.2vw,6rem)}
html[lang="ru"] .nav__list{gap:clamp(.7rem,1.2vw,1.8rem)}
@media (min-width:1181px){
  html[lang="ru"] .nav__link{font-size:.6875rem;letter-spacing:.06em}
}

/* ---------- RTL mirroring: desktop ---------- */
html[dir="rtl"] .skip-link{left:auto;right:var(--gutter)}
html[dir="rtl"] .tools .btn{margin-left:0;margin-right:.9rem}
html[dir="rtl"] .nav__link::after{transform-origin:right}
html[dir="rtl"] .menu{left:auto;right:-1.5rem}
html[dir="rtl"] .menu-arrow--sub{margin-left:0;margin-right:.3rem}

html[dir="rtl"] .hero__media{inset:0 auto 0 0;-webkit-mask-image:linear-gradient(270deg,transparent 0,#000 34%);mask-image:linear-gradient(270deg,transparent 0,#000 34%)}

html[dir="rtl"] .col-card__text{left:auto;right:clamp(1rem,1.8vw,1.75rem)}
html[dir="rtl"] .col-card__go{left:auto;right:clamp(1rem,1.8vw,1.5rem)}

html[dir="rtl"] .board{margin-right:0;margin-left:calc(var(--gutter) * -.4)}
html[dir="rtl"] .board__cake{left:auto;right:12%}
html[dir="rtl"] .board__venue{right:auto;left:0}
html[dir="rtl"] .board__floral{right:auto;left:4%}
html[dir="rtl"] .board__fabric{left:auto;right:0}
html[dir="rtl"] .board__note{left:auto;right:0}
html[dir="rtl"] .board__palette{right:auto;left:6%}
html[dir="rtl"] .board__star{left:auto;right:3%}

/* Arrows point the other way; their hover nudge goes the other way too. */
html[dir="rtl"] .btn__arrow,html[dir="rtl"] .col-card__go .icon,html[dir="rtl"] .link-arrow .icon{transform:scaleX(-1)}
html[dir="rtl"] .btn:hover .btn__arrow,html[dir="rtl"] .btn:focus-visible .btn__arrow,html[dir="rtl"] .link-arrow:hover .btn__arrow{transform:scaleX(-1) translateX(5px)}

/* Keep phone numbers and emails reading left to right inside RTL text. */
html[dir="rtl"] .ltr,html[dir="rtl"] .footer__contact a[href^="https://wa.me"],html[dir="rtl"] .footer__contact a[href^="mailto"]{direction:ltr;unicode-bidi:isolate}

/* ---------- RTL mirroring: compact nav (<=1180) ---------- */
@media (max-width:1180px){
  html[dir="rtl"] .menu-arrow{right:auto;left:0}
  html[dir="rtl"] .menu{padding:0 1rem .5rem 0}
  html[dir="rtl"] .menu__link{padding:.95rem 0 .95rem 3rem}
  html[dir="rtl"] .menu__sub{padding-left:0;padding-right:1rem}
}

/* ---------- RTL mirroring: mobile (<=600) ---------- */
@media (max-width:600px){
  html[dir="rtl"] .board{margin-left:0}
  html[dir="rtl"] .board__cake{left:auto;right:0}
  html[dir="rtl"] .board__venue{right:auto;left:0}
  html[dir="rtl"] .board__floral{right:auto;left:3%}
  html[dir="rtl"] .board__fabric{left:0;right:auto}
  html[dir="rtl"] .board__note{left:auto;right:0}
  html[dir="rtl"] .board__palette{right:auto;left:0}
  html[dir="rtl"] .board__star{left:auto;right:52%}
}

/* ---------- RTL mirroring: tablet + wide desktop ---------- */
@media (min-width:901px) and (max-width:1180px){
  html[dir="rtl"] .board__note{left:auto;right:-3%;padding-right:.9rem;padding-left:1.1rem}
  html[dir="rtl"] .board__star{left:auto;right:0}
}
@media (min-width:1600px){
  html[dir="rtl"] .board__palette{right:auto;left:11%}
}
