/* App-owned responsive controls; the reference composition CSS is loaded per page. */
html, body { margin: 0; min-height: 100%; background: #1a2433; }
/* Canva compositions are authored at 1366px with body { overflow:hidden }.
   Without their runtime: unlock document scroll. Desktop width scaling is
   applied by an early head script + site.js (zoom, with transform fallback)
   so frames fill the viewport instead of sitting half-width with a blank
   right margin. Body uses the hero night tone so any slim scrollbar gutter
   is not a stark white strip. Mobile keeps .ZRRuDw from mobile-layouts.css. */
@media (min-width: 601px) {
  /* Only <html> scrolls. Do NOT set overflow-x:hidden on body while
     overflow-y:visible — CSS then computes overflow-y as auto (dual bars). */
  html {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    height: auto !important;
  }
  body {
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
  }
  main.page-composition {
    overflow: visible !important;
    max-width: none !important;
  }
  /* One document scroll only — kill Canva's nested 100vh scrollport. */
  #root,
  #root .yIDCqA,
  #root main._8OlyIw,
  #root ._4KoDHA,
  #root .l3vAqg,
  #root ._65lpxA,
  #root .ZRRuDw {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  #root {
    width: 1366px !important;
    transform-origin: top left;
  }
  /* Sections are flex:1 in Canva CSS; without a fixed scrollport they collapse. */
  #root section.rGeu6w {
    flex: none !important;
    position: relative !important;
    width: 1366px !important;
    overflow: visible !important;
  }
  /* transform:scale() paints outside #root's layout box; don't clip it. */
  html:has(body[data-desktop-scale="transform"]) {
    overflow-x: visible !important;
  }
  body[data-desktop-scale="transform"] {
    overflow-x: visible !important;
  }
}
.mobile-controls { display: none; }
.mobile-menu-trigger, .mobile-menu-close { appearance: none; border: 0; background: transparent; color: #304254; cursor: pointer; font: inherit; }
.mobile-menu-trigger { pointer-events: auto; width: 48px; height: 48px; display: grid; place-items: center; }
.menu-glyph, .menu-glyph::before, .menu-glyph::after { display: block; width: 16px; height: 1.5px; background: currentColor; content: ""; position: relative; }
.menu-glyph::before { position: absolute; top: -6px; }
.menu-glyph::after { position: absolute; top: 6px; }
.mobile-menu-shade[hidden], .mobile-menu-panel[hidden] { display: none; }
/* Locale control: hover strip so it can hide on scroll (site nav stays sticky). */
.locale-menu-zone {
  position: fixed;
  z-index: 100000;
  top: 0;
  left: 0;
  /* Nav strip height; grow downward when open (do not vertically center the list). */
  min-height: 64px;
  height: auto;
  width: auto;
  max-width: min(340px, 42vw);
  padding: 22px 18px 0;
  box-sizing: border-box;
  display: flex;
  align-items: flex-start;
  overflow: visible;
}
.locale-menu {
  position: relative;
  z-index: 1;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
  font-family: "Arian AMU", "Arian Amu", sans-serif;
  font-size: var(--composition-nav-size, var(--chrome-locale-abbr-size, 15px));
  font-weight: var(--chrome-locale-weight, 700);
  line-height: 1.35;
  opacity: 1;
  transform: translateY(0);
  transition: opacity .18s ease, transform .18s ease;
}
/* After scroll: hide language menu fully. Site nav stays sticky.
   No hover-reveal — return to top to switch language. */
.locale-menu-zone.is-away .locale-menu {
  opacity: 0;
  visibility: hidden;
  transform: translateY(-4px);
  pointer-events: none;
}
/* Subpages: back-home sits under the language control.
   Keep it below the open language list so Home never blocks Armenian/etc. */
.back-home-zone {
  position: fixed;
  z-index: 99990;
  top: 64px;
  left: 0;
  width: auto;
  max-width: min(340px, 42vw);
  height: 48px;
  display: flex;
  align-items: flex-start;
  padding: 0 18px;
  box-sizing: border-box;
}
body:has(.locale-menu[open]) .back-home-zone {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.back-home {
  display: inline-block;
  color: var(--chrome-text-color, #304254);
  background: var(--chrome-bg-color, rgba(255,255,255,.92));
  padding: 8px 12px;
  text-decoration: none;
  border-radius: 2px;
  font-family: "Arian AMU", "Arian Amu", sans-serif;
  font-size: var(--chrome-back-home-size, 15px);
  font-weight: var(--chrome-locale-weight, 700);
  line-height: 1.35;
  opacity: 1;
  transform: translateY(0);
  transition: opacity .18s ease, transform .18s ease;
}
.back-home:hover, .back-home:focus-visible { background: #eef2f4; }
/* After scroll: hide until the mouse enters this left strip. */
.back-home-zone.is-away .back-home {
  opacity: 0;
  transform: translateY(-4px);
  pointer-events: none;
}
.back-home-zone.is-away:hover .back-home,
.back-home-zone.is-away:focus-within .back-home {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.scroll-top {
  position: fixed;
  z-index: 100000;
  right: 16px;
  bottom: 16px;
  appearance: none;
  border: 0;
  cursor: pointer;
  color: var(--chrome-text-color, #304254);
  background: var(--chrome-bg-color, rgba(255,255,255,.94));
  padding: 10px 14px;
  border-radius: 2px;
  font-family: "Arian AMU", "Arian Amu", sans-serif;
  font-size: var(--chrome-scroll-top-size, 15px);
  font-weight: var(--chrome-locale-weight, 700);
  line-height: 1.2;
  box-shadow: 0 2px 12px rgba(12,24,44,.16);
}
.scroll-top[hidden] { display: none; }
.scroll-top:hover, .scroll-top:focus-visible { background: #eef2f4; }
/* Site-wide type: Arian AMU on every text surface, including Canva
   composition nodes that otherwise lock Inter / Canva Sans / Arimo. */
html,
body,
body :where(*):not(script):not(style):not(svg):not(path):not(img):not(video):not(canvas) {
  font-family: "Arian AMU", "Arian Amu", sans-serif !important;
}
.locale-menu,
.back-home,
.scroll-top,
.mobile-menu-panel,
.mobile-locale-menu,
.translation-missing {
  font-family: "Arian AMU", "Arian Amu", sans-serif !important;
}
/* App-owned .locale-menu replaces Canva/Wix embedded language flags.
   Hide the flag asset + its empty Canva language-switcher anchor on every
   page. Do not use :has() on shared wrappers (.rGeu6w / .DF_utQ) — those
   also wrap hero sections. */
#root #__id8,
#root img[src*="3002b46ec267"],
#root a._3zDNwA {
  display: none !important;
}
.locale-menu > summary {
  list-style: none;
  cursor: pointer;
  color: var(--chrome-text-color, #304254);
  background: transparent;
  padding: 0;
  min-width: 0;
  text-align: left;
  border-radius: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  white-space: nowrap;
}
.locale-menu > summary::-webkit-details-marker { display: none; }
.locale-menu[open] > ul {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 100001;
  margin: 6px 0 0;
  padding: 6px 0;
  list-style: none;
  background: #fff;
  box-shadow: 0 4px 18px rgba(12,24,44,.18);
  min-width: 190px;
  max-height: min(65vh, calc(100vh - 80px));
  overflow: auto;
  font-size: var(--chrome-locale-dropdown-size, 15px);
  font-weight: var(--chrome-locale-weight, 700);
}
.locale-menu a,
.locale-menu li {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}
.locale-menu a {
  display: block;
  padding: 8px 12px;
  color: var(--chrome-text-color, #304254);
  text-decoration: none;
}
.locale-menu a:hover, .locale-menu a:focus-visible { background: #eef2f4; }
.locale-menu small {
  color: #68747c;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}
/* Optional composition overrides from admin (Site chrome / per-page typography).
   Nav/footer rules come after body so they win when both are set. */
body.chrome-body-size #root,
body.chrome-body-size #root span,
body.chrome-body-size #root p,
body.chrome-body-size #root a,
body.chrome-body-size #root li {
  font-size: var(--composition-body-size) !important;
}
body.chrome-nav-size #root nav a,
body.chrome-nav-size #root nav [role="menuitem"],
body.chrome-nav-size #root nav span {
  font-size: var(--composition-nav-size) !important;
}
body.chrome-footer-size #root section:last-of-type,
body.chrome-footer-size #root section:last-of-type span,
body.chrome-footer-size #root section:last-of-type p,
body.chrome-footer-size #root section:last-of-type a,
body.chrome-footer-size #root footer,
body.chrome-footer-size #root footer span,
body.chrome-footer-size #root footer p,
body.chrome-footer-size #root footer a {
  font-size: var(--composition-footer-size) !important;
}
/* Hero CTA text: HY composition locks ~107px (#LB9RgP3SRLzMhyj2) while the
   beige pill is ~180px; EN composition uses #LBwXkPWYhJmcX63t (~172px).
   Keep text inside the pill for longer locales (DE/FR). */
body[data-page="foundation-home"] #LB9RgP3SRLzMhyj2 {
  width: 156px !important;
  transform: translate(12.235px, 554.583px) !important;
}
body[data-page="foundation-home"] #LB9RgP3SRLzMhyj2 > .aF9o6Q {
  width: 156px !important;
}
body[data-page="foundation-home"] #LB9RgP3SRLzMhyj2 a.a_GcMg,
body[data-page="foundation-home"] #LBwXkPWYhJmcX63t a.a_GcMg {
  white-space: nowrap;
}
.translation-missing { max-width: 680px; margin: 12vh auto; padding: 24px; color: #304254; font: 16px/1.6 "Arian AMU", "Arian Amu", sans-serif; }
.translation-missing a { color: inherit; }
.translation-missing nav ul { display: flex; flex-wrap: wrap; gap: 16px; padding: 0; list-style: none; }

@media (max-width: 600px) {
  .mobile-controls { display: block; position: fixed; z-index: 99998; inset: 0 0 auto; height: 48px; pointer-events: none; background: #fff; }
  .mobile-menu-trigger { position: absolute; top: 0; right: 8px; }
  .mobile-menu-shade:not([hidden]) { display: block; pointer-events: auto; position: fixed; inset: 0; background: rgba(12,24,44,.34); }
  .mobile-menu-panel:not([hidden]) { display: block; pointer-events: auto; position: fixed; z-index: 1; top: 0; right: 0; bottom: 0; width: min(46vw, 300px); min-width: 180px; overflow: auto; background: #fff; padding: 8px 0 24px; box-sizing: border-box; }
  .mobile-menu-close { display: block; margin-left: auto; width: 48px; height: 48px; font-size: 26px; }
  .mobile-menu-panel ul { margin: 0; padding: 0; list-style: none; }
  .mobile-menu-panel a { display: block; padding: 12px 16px; color: var(--chrome-text-color, #304254); text-decoration: none; font: 600 var(--chrome-mobile-nav-size, 14px)/1.5 "Arian AMU", "Arian Amu", sans-serif; }
  .mobile-menu-panel a:focus-visible { outline: 2px solid #304254; outline-offset: -2px; }
  .has-mobile-nav > .locale-menu-zone { display: none; }
  .mobile-locale-menu { margin: 8px 16px; border-top: 1px solid #d9dfe3; color: var(--chrome-text-color, #304254); font: 600 var(--chrome-mobile-locale-size, 14px)/1.5 "Arian AMU", "Arian Amu", sans-serif; }
  .mobile-locale-menu > summary { cursor: pointer; padding: 12px 0; }
  .mobile-locale-menu > ul { list-style: none; margin: 0; padding: 0 0 8px; max-height: 40vh; overflow: auto; }
  .locale-menu-zone { top: auto; left: auto; right: 0; bottom: 0; width: auto; min-height: 0; padding: 0 8px 8px 0; }
  .locale-menu { top: auto; left: auto; right: auto; bottom: auto; }
  /* Floating home control is hover-only on desktop; mobile uses the menu item. */
  .has-mobile-nav .back-home-zone { display: none; }
  .scroll-top { right: 12px; bottom: 12px; padding: 10px 12px; font-size: 14px; }
  /* The captured desktop navigation remains in the page composition. On narrow
     screens the accessible app menu replaces it and the language picker sits
     clear of both controls. */
  .has-mobile-nav #root nav { display: none !important; }
  .translation-missing { margin: 8vh auto; padding: 20px; }

  /* Aylagir / Gitahen: Canva's captured 390 layouts crush body copy with
     ~0.27 scale. Replace with a fluid reading document on small screens. */
  html:has(body.mobile-doc-mode),
  body.mobile-doc-mode {
    background: #f3efe6 !important;
    overflow: auto !important;
    height: auto !important;
    min-height: 100% !important;
  }
  /* Keep layout for text extraction; hide paint until the article is ready. */
  body.mobile-doc-mode:not(.mobile-doc-ready) #root {
    visibility: hidden !important;
    pointer-events: none !important;
  }
  body.mobile-doc-mode.mobile-doc-ready #root {
    display: none !important;
  }
  body.mobile-doc-mode .page-composition {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
  }
  .mobile-doc {
    display: block;
    box-sizing: border-box;
    width: 100%;
    max-width: 40rem;
    margin: 0 auto;
    padding: 4.35rem 1.2rem 3.25rem;
    color: #182433;
    font-family: "Arian AMU", "Arian Amu", Georgia, "Times New Roman", serif;
    line-height: 1.58;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  .mobile-doc h2 {
    margin: 1.65rem 0 0.65rem;
    font-size: clamp(1.2rem, 5.2vw, 1.45rem);
    line-height: 1.28;
    letter-spacing: -0.02em;
    color: #0f3d4c;
    font-weight: 700;
  }
  .mobile-doc h2:first-child { margin-top: 0.2rem; }
  .mobile-doc p {
    margin: 0 0 0.9rem;
    font-size: clamp(1rem, 4.1vw, 1.08rem);
  }
  .mobile-doc a {
    color: #0b57d0;
    text-decoration: underline;
    text-underline-offset: 2px;
  }
  .mobile-doc ul {
    margin: 0 0 1rem;
    padding: 0 0 0 1.15rem;
  }
  .mobile-doc li {
    margin: 0 0 0.4rem;
    font-size: clamp(1rem, 4.1vw, 1.08rem);
  }
  .mobile-doc figure {
    margin: 0.85rem 0 1.2rem;
  }
  .mobile-doc figure img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
  }
  .mobile-doc .mobile-doc-hero {
    margin: 0 -0.35rem 1.1rem;
  }
  .mobile-doc .mobile-doc-hero img {
    border-radius: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}