/* RTL Support Styles - Only applied when html.rtl */

/* Anjoman — primary face for Persian when RTL is on */
@font-face {
  font-family: 'Anjoman';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/anjoman/Anjoman-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Anjoman';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('./fonts/anjoman/Anjoman-Medium.ttf') format('truetype');
}

@font-face {
  font-family: 'Anjoman';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('./fonts/anjoman/Anjoman-SemiBold.ttf') format('truetype');
}

@font-face {
  font-family: 'Anjoman';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('./fonts/anjoman/Anjoman-Bold.ttf') format('truetype');
}

html.rtl {
  direction: rtl;
}

html.rtl body {
  text-align: right;
  font-family: 'Anjoman', 'Inter', ui-sans-serif, system-ui, sans-serif !important;
}

/* Force Anjoman everywhere Farsi renders (theme sets Inter on nested nodes) */
html.rtl body *:not(script):not(style):not(pre):not(code):not(kbd):not(samp) {
  font-family: 'Anjoman', 'Inter', ui-sans-serif, system-ui, sans-serif !important;
}

html.rtl pre,
html.rtl code,
html.rtl kbd,
html.rtl samp {
  font-family: ui-monospace, monospace !important;
}

/* Flip flexbox directions */
html.rtl [class*="flex-row"],
html.rtl .w-layout-hflex {
  flex-direction: row-reverse;
}

/* Flip grid auto-flow */
html.rtl .w-layout-grid,
html.rtl .nexora-principles-grid {
  direction: rtl;
}

/* Flip margins and paddings */
html.rtl [style*="margin-left"],
html.rtl [style*="padding-left"] {
  margin-left: unset;
  margin-right: inherit;
  padding-left: unset;
  padding-right: inherit;
}

/* Flip text alignment */
html.rtl .text-left {
  text-align: right;
}

html.rtl .text-right {
  text-align: left;
}

/* Flip absolute/fixed positioned elements */
html.rtl [style*="left:"]:not([style*="right:"]) {
  left: unset;
  right: 0;
}

html.rtl [style*="right:"]:not([style*="left:"]) {
  right: unset;
  left: 0;
}

/* Navigation adjustments */
html.rtl .nav-menu,
html.rtl .navbar,
html.rtl nav {
  direction: rtl;
}

html.rtl .nav-link,
html.rtl .nav-menu a {
  text-align: right;
}

/* Button icon flip */
html.rtl .button svg,
html.rtl .btn svg,
html.rtl [class*="button"] svg,
html.rtl [class*="arrow"] {
  transform: scaleX(-1);
}

/* Lists */
html.rtl ul,
html.rtl ol {
  padding-right: 1.5em;
  padding-left: 0;
}

/* Form elements */
html.rtl input,
html.rtl textarea,
html.rtl select {
  text-align: right;
}

/* Layout utility classes (legacy w-* prefixed; kept for runtime compatibility) */
html.rtl .w-nav-menu {
  flex-direction: row-reverse;
}

html.rtl .w-nav-brand {
  margin-left: auto;
  margin-right: 0;
}

html.rtl .w-button {
  direction: rtl;
}

/* Hero sections */
html.rtl .hero-content,
html.rtl [class*="hero"] {
  text-align: right;
}

/*
 * Home hero title (Persian): shared CSS `.h2` is 4.5rem with line-height 1 — far too tall for long Farsi
 * lines and collides glyphs; tighten size and relax leading so نـقـطـهٔ‌ها و کشیدگی‌ها breathe.
 */
html.rtl .section_home .home-heading h1.h2 {
  font-size: clamp(1.875rem, 4.2vw, 3rem);
  line-height: 1.45;
}

/*
 * In-page section titles use `.text-5xl` (3.75rem / 1.2 in shared CSS) — same oversize/overlap issue as the hero with Farsi.
 */
html.rtl main .text-5xl {
  font-size: clamp(1.625rem, 3.25vw, 2.5rem);
  line-height: 1.38;
}

/*
 * `#contact` reuses `.articles_header`; the RTL sheet sets `body { text-align: right }` so centred
 * section titles still read visually “weighted” toward the logical end. Explicitly recentre this hero line.
 */
html.rtl #contact .articles_header,
html.rtl #contact .articles_header h2.text-5xl {
  text-align: center;
}

/*
 * Persian contact headline: `.is-rem` caps width (~40rem) so centred Farsi wraps oddly; span full heading column.
 */
html.rtl #contact .articles_header .max-heading.is-rem.nexora-section__title-wrap {
  max-width: none;
  width: 100%;
}

/*
 * Founder block uses `section_testimonial` / `testimonial_header` — substring rule below would right-align it.
 */
html.rtl section#founder.section_testimonial,
html.rtl #founder .testimonial_header,
html.rtl #founder .nexora-section__title-wrap,
html.rtl #founder .max-heading.is-51rem,
html.rtl #founder .testimonial_header h2.text-5xl {
  text-align: center;
}

/*
 * About («آزمایشگاه تشخیص سازمانی»): the old override used planet art at cover scale — busy vs hero +
 * hurts legibility. Use the theme workflow gradient locally plus a restrained top violet wash.
 */
#about.section_workflow {
  background-image: radial-gradient(
      ellipse 90% 55% at 50% -8%,
      rgba(167, 139, 250, 0.14),
      transparent 58%
    ),
    url("./6971259b45c191f77f8faa5e_up_gradient.avif");
  background-position: center top, center center;
  background-repeat: no-repeat;
  background-size: cover, cover;
}


/* Cards and features */
html.rtl .feature-card,
html.rtl [class*="card"],
html.rtl [class*="feature"] {
  text-align: right;
}

/* Footer */
html.rtl footer,
html.rtl [class*="footer"] {
  direction: rtl;
  text-align: right;
}

/* Testimonials */
html.rtl [class*="testimonial"],
html.rtl [class*="quote"] {
  text-align: right;
}

/* Spacing utilities - flip margins */
html.rtl [class*="margin-left"] {
  margin-left: 0 !important;
  margin-right: var(--spacing, 1rem);
}

html.rtl [class*="margin-right"] {
  margin-right: 0 !important;
  margin-left: var(--spacing, 1rem);
}

html.rtl [class*="padding-left"] {
  padding-left: 0 !important;
  padding-right: var(--spacing, 1rem);
}

html.rtl [class*="padding-right"] {
  padding-right: 0 !important;
  padding-left: var(--spacing, 1rem);
}

/* Transform animations - flip horizontal */
html.rtl [class*="slide-from-left"] {
  --transform-translate-x: 100%;
}

html.rtl [class*="slide-from-right"] {
  --transform-translate-x: -100%;
}

/* Slider arrows - swap positions in RTL */
html.rtl .arrow {
  transform: translate(60%) !important;
}

html.rtl .arrow:hover {
  transform: scale(.97) translate(60%) !important;
}

html.rtl .arrow.is-right {
  transform: translate(-60%) !important;
}

html.rtl .arrow.is-right:hover {
  transform: scale(.97) translate(-60%) !important;
}

/* Flip arrow icons (but not carousel arrows — see blog slider overrides below). */
html.rtl .arrow svg {
  transform: scaleX(-1) !important;
}

/*
 * With html[dir=rtl], the mask clips the wrong way and slides read as “backward” or faded out.
 */
html.rtl #articles .w-slider,
html.rtl #articles .w-slider-mask,
html.rtl #articles .slider-mask {
  direction: ltr !important;
  unicode-bidi: isolate;
}

html.rtl #articles .article_card {
  direction: rtl;
  text-align: right;
}

/* Carousel cards — keep readable but below full-bleed desktop width after slider layout tweaks */
#articles .article_card {
  padding: 1.2rem !important;
  grid-column-gap: 1.25rem !important;
  grid-row-gap: 1.25rem !important;
  border-radius: 1.25rem !important;
}

/*
 * More Articles carousel: mask stays LTR (clipping). Controls belong *under* the cards, side by side
 * not pinned mid-slider where RTL + `.arrow` bugs overlap them.
 */
#articles .slider.w-slider {
  display: grid !important;
  grid-template-columns: 1fr auto auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 0.75rem;
  row-gap: 1.25rem;
  align-items: center;
  width: 100%;
  height: auto !important;
  min-height: 0;
  background: transparent !important;
}

#articles .slider.w-slider .slider-mask,
#articles .slider.w-slider .w-slider-mask {
  grid-column: 1 / -1;
  grid-row: 1;
  width: min(100%, 40rem) !important;
  max-width: 40rem !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#articles .slider.w-slider > .arrow.w-slider-arrow-left {
  grid-column: 2;
  grid-row: 2;
  position: relative !important;
  inset: unset !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
  justify-self: end;
  align-self: center;
  z-index: 3;
}

#articles .slider.w-slider > .arrow.is-right.w-slider-arrow-right {
  grid-column: 3;
  grid-row: 2;
  position: relative !important;
  inset: unset !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
  justify-self: start;
  align-self: center;
  z-index: 4;
}

#articles .slider.w-slider > .arrow.w-slider-arrow-left:hover {
  transform: scale(0.97) !important;
}

#articles .slider.w-slider > .arrow.is-right.w-slider-arrow-right:hover {
  transform: scale(0.97) !important;
}

html.rtl #articles .slider.w-slider > .arrow svg {
  transform: none !important;
}

/*
 * edge of `.section_footer`. On static exports it often reads as an unwanted band; hide it uniformly.
 */
.section_footer .shadow-top {
  display: none !important;
}

/* Navbar raster logo — PNG intrinsic size exceeds the SVG slot the theme assumes */
.navbar_logo-link .navbar_logo,
img.navbar_logo {
  width: auto;
  height: 2.75rem;
  max-width: 12rem;
  object-fit: contain;
}

@media screen and (min-width: 992px) {
  .navbar_logo-link .navbar_logo,
  img.navbar_logo {
    height: 3rem;
  }
}

/*
 * Nexora layout: enforce a sensible minimum viewport height per major section on marketing pages.
 * Target only direct children of main so nested <section>s (e.g. long article bodies) stay untouched.
 */
main.main-wrapper > section {
  min-height: 60vh;
}