/* Global base (skip link, page shell) */
*,
*::before,
*::after { box-sizing: border-box; }

html {
  height: 100%;
  scroll-padding-top: var(--navbar-height);
}

html.nav-scroll-locked {
  overflow: hidden;
  overscroll-behavior: none;
}

body {
  min-height: 100%;
  min-height: 100dvh;
  margin: 0;
  display: flex;
  flex-direction: column;
  font-family: "IBM Plex Sans Hebrew", sans-serif;
  font-size: var(--font-body);
  line-height: 1.5;
  color: var(--color-black);
  background: var(--color-bg);
}

body.nav-scroll-locked {
  overflow: hidden;
  overscroll-behavior: none;
}

@supports (-webkit-touch-callout: none) {
  body {
    min-height: -webkit-fill-available;
  }
}

/* Sticky footer: main grows when content is short */
main {
  flex: 1 0 auto;
}

/* Fixed navbar: offset main content on inner pages (home hero handles offset in hero.css) */
body:not(.page-home):not(.page-under-nav-hero) main {
  padding-top: var(--navbar-height);
}

/* Inner pages where the first section (e.g. .app-hero) extends under the fixed navbar */
body.page-under-nav-hero main {
  padding-top: 0;
}

/* Focus: hide mouse focus ring; high-contrast keyboard focus (black + white) */
:focus {
  outline: none;
}

:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px #13181a;
}

/* Text fields use their own focus UI (e.g. .laya-field) — no black focus square */
input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="image"]):not([type="range"]):not([type="color"]):focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: none;
  box-shadow: none;
}

/* Skip link for accessibility */
.skip-link {
  position: absolute;
  top: -100%;
  right: var(--padding);
  padding: var(--padding);
  background: var(--color-black);
  color: var(--color-white);
  text-decoration: none;
  font-weight: 600;
  z-index: 10000;
  border-radius: var(--radius-inner);
  transition: top var(--transition);
}
.skip-link:focus-visible {
  top: var(--padding);
}

/* Homepage stacked sections — vertical rhythm + horizontal page gutters */
.section-stack,
.section {
  padding-block: var(--section-stack-padding-y);
  padding-inline: var(--padding);
}

/* Screen-reader only (shared utility) */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}