/* SLC runtime CSS segment 01-critical-base. Generated by tools/build-css-bundles.ps1; do not edit directly. */

/* ========================================================================== */
/* Source: styles-site-initial-core.css */
/* ========================================================================== */

/* Authoritative initial CSS: shared globals and initial-page states.
   Paired below-page component rules live in styles-site-core.css.
   Both sources stay at project root so relative asset URLs are unchanged. */

/*
 * SLC consolidated stylesheet
 * Generated by tools/build-css-bundles.ps1
 * Source order is intentional and preserves the original cascade.
 */

/* ========================================================================== */
/* Source: styles-v3.css */
/* ========================================================================== */

@font-face{
  font-family: "IRANSansX";
  src: url("../../fonts/IRANSansX-Regular.woff2?v=20260928-full-woff2-1") format("woff2"),
    url("../../fonts/IRANSansX-Regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face{
  font-family: "IRANSansX";
  src: url("../../fonts/IRANSansX-Bold.woff2?v=20260928-full-woff2-1") format("woff2"),
    url("../../fonts/IRANSansX-Bold.woff") format("woff");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face{
  font-family: "IRANYekanX";
  src: url("../../fonts/IRANYekanX-Regular.woff2?v=20260928-full-woff2-1") format("woff2"),
    url("../../fonts/IRANYekanX-Regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face{
  font-family: "IRANYekanX";
  src: url("../../fonts/IRANYekanX-Bold.woff2?v=20260928-full-woff2-1") format("woff2"),
    url("../../fonts/IRANYekanX-Bold.woff") format("woff");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

/*
 * Metric-compatible local fallbacks keep the first mobile layout stable while
 * the Persian web fonts are in flight. If Tahoma is unavailable, each alias is
 * skipped and the existing fallback chain continues unchanged.
 */
@font-face{
  font-family: "SLC IRANSansX Fallback";
  src: local("Tahoma");
  font-style: normal;
  font-weight: 400;
  size-adjust: 95.16%;
  ascent-override: 100%;
  descent-override: 50%;
  line-gap-override: 0%;
}

@font-face{
  font-family: "SLC IRANSansX Fallback";
  src: local("Tahoma Bold");
  font-style: normal;
  font-weight: 700;
  size-adjust: 83.60%;
  ascent-override: 100%;
  descent-override: 50%;
  line-gap-override: 0%;
}

@font-face{
  font-family: "SLC IRANYekanX Fallback";
  src: local("Tahoma");
  font-style: normal;
  font-weight: 400;
  size-adjust: 94.85%;
  ascent-override: 90%;
  descent-override: 40%;
  line-gap-override: 0%;
}

@font-face{
  font-family: "SLC IRANYekanX Fallback";
  src: local("Tahoma Bold");
  font-style: normal;
  font-weight: 700;
  size-adjust: 84.62%;
  ascent-override: 90%;
  descent-override: 40%;
  line-gap-override: 0%;
}

@font-face{
  font-family: "SLC PeydaWeb Fallback";
  src: local("Tahoma Bold");
  font-style: normal;
  font-weight: 700;
  size-adjust: 80.96%;
  ascent-override: 145%;
  descent-override: 50%;
  line-gap-override: 0%;
}

:root{
  color-scheme: dark;
  /* Legacy aliases resolve through the active non-Hero theme contract. */
  --ink: var(--slc-color-ink-strong);
  --ink-blue: var(--slc-ref-steel-900);
  --navy-950: var(--slc-color-ink-strong);
  --navy-900: var(--slc-ref-steel-900);
  --navy-850: var(--slc-color-ink);
  --navy-800: var(--slc-color-action-hover);
  --navy-700: var(--slc-color-action);
  --blue-700: var(--slc-color-action-hover);
  --blue-600: var(--slc-color-action);
  --blue-500: var(--slc-color-accent);
  --blue-400: var(--slc-color-accent-on-dark);
  --blue-300: var(--slc-color-accent-on-dark);
  --ice: var(--slc-color-surface);
  --text: var(--slc-color-ink-strong);
  --text-soft: var(--slc-color-ink);
  --text-muted: var(--slc-color-ink-muted);
  --line: var(--slc-color-line);
  --line-strong: var(--slc-color-line-strong);
  --glass: var(--slc-color-glass);
  --glass-strong: var(--slc-color-glass-strong);
  --accent: var(--slc-color-accent);
  --accent-bright: var(--slc-color-accent-on-dark);
  --accent-deep: var(--slc-color-action-hover);
  --shadow: var(--slc-shadow-surface);
  --shadow-blue: var(--slc-shadow-surface-strong);
  --radius-panel: 1.5rem;
  --radius-control: 0.9rem;
  --radius-button: 0.9rem;
  --header-height: 4.5rem;
  --container: min(88rem, calc(100vw - 3rem));
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --z-base: 0;
  --z-content: 2;
  --z-header: 30;
  --z-menu: 25;
  --z-skip: 50;
}

*,
*::before,
*::after{
  box-sizing: border-box;
}

html{
  scroll-behavior: smooth;
  background: var(--slc-color-canvas);
}

html[data-smooth-scroll="active"]{
  scroll-behavior: auto !important;
}

body{
  margin: 0;
  min-width: 20rem;
  overflow-x: clip;
  background: var(--slc-component-body-background);
  color: var(--slc-color-ink-strong);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.7;
  text-rendering: optimizeLegibility;
}

html[lang="fa"] body{
  font-family: "IRANSansX", "SLC IRANSansX Fallback", Tahoma, "Segoe UI", Arial, sans-serif;
}

body.menu-open{
  overflow: hidden;
}

::selection{
  background: var(--blue-500);
  color: var(--ink);
}

img,
svg{
  display: block;
  max-width: 100%;
}

img{
  height: auto;
}

button,
input,
select,
textarea{
  color: inherit;
  font: inherit;
}

button,
a{
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

a{
  color: inherit;
  text-decoration: none;
}

button{
  border: 0;
}

h1,
h2,
h3,
p,
figure,
dl,
dd{
  margin: 0;
}

ul,
ol{
  margin: 0;
  padding: 0;
  list-style: none;
}

h1,
h2,
h3{
  font-family: "Arial Narrow", "Segoe UI", sans-serif;
  line-height: 1.06;
}

html[lang="fa"] h1,
html[lang="fa"] h2,
html[lang="fa"] h3{
  font-family: "IRANYekanX", "SLC IRANYekanX Fallback", Tahoma, "Segoe UI", Arial, sans-serif;
  font-weight: 700;
  line-height: 1.22;
}

:focus-visible{
  outline: 3px solid var(--blue-300);
  outline-offset: 4px;
}

.skip-link{
  position: fixed;
  inset-block-start: 0.75rem;
  inset-inline-start: 0.75rem;
  z-index: var(--z-skip);
  padding: 0.65rem 1rem;
  border-radius: var(--radius-control);
  background: var(--ice);
  color: var(--ink);
  font-weight: 700;
  transform: translateY(-160%);
  transition: transform 180ms var(--ease-out);
}

.skip-link:focus{
  transform: translateY(0);
}

.container{
  width: var(--container);
  margin-inline: auto;
}

.section{
  position: relative;
  padding-block: clamp(6.5rem, 10vw, 10rem);
}

section[id]{
  scroll-margin-block-start: calc(var(--header-height) + 1rem);
}

.header-sentinel{
  position: absolute;
  inset: 0 auto auto 0;
  width: 1px;
  height: 1px;
}

/* Header */

.site-header{
  position: fixed;
  inset: 0 0 auto;
  z-index: var(--z-header);
  height: var(--header-height);
  padding-right: env(safe-area-inset-right);
  padding-left: env(safe-area-inset-left);
  border-bottom: 1px solid transparent;
  background: linear-gradient(180deg, rgb(var(--slc-ref-ink-rgb) / 0.74), transparent);
  transition:
    background-color 220ms var(--ease-out),
    border-color 220ms var(--ease-out),
    box-shadow 220ms var(--ease-out);
}

.site-header.is-scrolled{
  border-color: var(--slc-color-line);
  background: rgb(var(--slc-ref-ink-rgb) / 0.88);
  box-shadow: var(--slc-shadow-dialog);
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
}

.route-progress{
  position: absolute;
  inset: auto 0 0;
  height: 2px;
  overflow: hidden;
  background: rgb(var(--slc-ref-accent-light-rgb) / 0.08);
}

.route-progress span{
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, var(--slc-color-action), var(--slc-color-accent-on-dark));
  box-shadow: 0 0 20px rgb(var(--slc-ref-accent-light-rgb) / 0.7);
  transform: scaleX(0);
  transform-origin: left center;
}

[dir="rtl"] .route-progress span{
  transform-origin: right center;
}

.header-inner{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  min-height: 100%;
  gap: 1.5rem;
}

.header-actions{
  display: flex;
  align-items: center;
  justify-self: start;
  gap: 0.65rem;
}

[dir="rtl"] .header-actions{
  justify-self: end;
}

.site-nav{
  grid-column: 2;
}

.nav-list{
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2vw, 2.2rem);
}

.nav-link{
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 2.75rem;
  color: var(--text-soft);
  font-size: 0.84rem;
  white-space: nowrap;
  transition:
    color 180ms var(--ease-out),
    transform 180ms var(--ease-out);
}

.nav-link::after{
  position: absolute;
  inset: auto 0 0.2rem;
  height: 2px;
  background: linear-gradient(90deg, var(--blue-600), var(--blue-300));
  content: "";
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 220ms var(--ease-out);
}

.nav-link.is-active{
  color: var(--blue-300);
}

.nav-link.is-active::after{
  transform: scaleX(1);
}

.brand{
  grid-column: 3;
  display: inline-flex;
  align-items: center;
  justify-self: end;
  gap: 0.75rem;
  min-width: max-content;
}

[dir="rtl"] .brand{
  grid-column: 1;
  justify-self: start;
}

.brand-mark{
  position: relative;
  display: grid;
  width: 2.65rem;
  height: 2.65rem;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--line-strong);
  border-radius: 0.75rem;
  background:
    linear-gradient(145deg, rgb(var(--slc-ref-accent-light-rgb) / 0.24), transparent 54%),
    rgb(var(--slc-ref-ink-rgb) / 0.85);
  box-shadow:
    inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.15),
    0 10px 32px rgb(var(--slc-ref-accent-deep-rgb) / 0.18);
  color: var(--slc-color-surface);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.09em;
}

.brand-mark::after{
  position: absolute;
  inset: -80% 35% -80% auto;
  width: 28%;
  background: rgb(var(--slc-ref-white-rgb) / 0.18);
  content: "";
  transform: rotate(24deg) translateX(-220%);
}

.brand-name{
  color: var(--text);
  font-size: 0.9rem;
  font-weight: 700;
  white-space: nowrap;
}

.language-link,
.menu-button{
  display: inline-grid;
  min-height: 2.65rem;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: var(--radius-button);
  background: rgb(var(--slc-ref-ink-rgb) / 0.66);
  color: var(--slc-color-ink);
  cursor: pointer;
  transition:
    color 180ms var(--ease-out),
    border-color 180ms var(--ease-out),
    background-color 180ms var(--ease-out),
    transform 140ms var(--ease-out);
}

.language-link{
  min-width: 2.65rem;
  padding-inline: 0.8rem;
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.menu-button{
  display: none;
  padding-inline: 1.1rem;
  font-size: 0.78rem;
  font-weight: 700;
}

/* Hero */

.hero{
  position: relative;
  isolation: isolate;
  display: grid;
  min-height: 100dvh;
  overflow: clip;
  align-items: center;
  background: var(--ink);
}

/* The HTML shell reserves the desktop hold distance from its first layout.
   The head bootstrap marks it pending, then app.js confirms ready without
   changing geometry. No JS, failed startup, compact and reduced motion
   keep the wrapper at its natural height. */
.hero-scroll-reserve{
  position: relative;
}

@media (min-width: 64.0625rem) and (prefers-reduced-motion: no-preference){
  html:is([data-slc-hero-pin-reserve="pending"], [data-slc-hero-pin-reserve="ready"]) .hero-scroll-reserve{
    min-height: 128dvh;
  }
}

.hero-media,
.hero-media::after,
.hero-shade{
  position: absolute;
  inset: 0;
}

.hero-media{
  z-index: -4;
  overflow: hidden;
}

.hero-media img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(1.18) contrast(1.06);
  transform-origin: center;
}

.hero-media::after{
  background:
    linear-gradient(90deg, rgb(1 8 19 / 0.18), rgb(0 22 58 / 0.04) 46%, rgb(0 9 24 / 0.48)),
    linear-gradient(180deg, rgb(1 8 18 / 0.22), transparent 42%, var(--ink) 100%);
  content: "";
}

[dir="rtl"] .hero-media::after{
  background:
    linear-gradient(270deg, rgb(1 8 19 / 0.18), rgb(0 22 58 / 0.04) 46%, rgb(0 9 24 / 0.48)),
    linear-gradient(180deg, rgb(1 8 18 / 0.22), transparent 42%, var(--ink) 100%);
}

.hero-shade{
  z-index: -3;
  background:
    radial-gradient(circle at 20% 47%, rgb(15 144 255 / 0.22), transparent 28rem),
    linear-gradient(90deg, rgb(1 8 19 / 0.94) 0%, rgb(2 14 32 / 0.7) 38%, transparent 70%);
}

[dir="rtl"] .hero-shade{
  background:
    radial-gradient(circle at 80% 47%, rgb(15 144 255 / 0.22), transparent 28rem),
    linear-gradient(270deg, rgb(1 8 19 / 0.94) 0%, rgb(2 14 32 / 0.7) 38%, transparent 70%);
}

.hero::before{
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(90deg, rgb(70 176 255 / 0.05) 1px, transparent 1px),
    linear-gradient(rgb(70 176 255 / 0.05) 1px, transparent 1px);
  background-size: 6rem 6rem;
  content: "";
  -webkit-mask-image: linear-gradient(90deg, black, transparent 68%);
  mask-image: linear-gradient(90deg, black, transparent 68%);
}

[dir="rtl"] .hero::before{
  -webkit-mask-image: linear-gradient(270deg, black, transparent 68%);
  mask-image: linear-gradient(270deg, black, transparent 68%);
}

.hero::after{
  position: absolute;
  inset: -30% auto -30% 42%;
  z-index: -1;
  width: 13rem;
  background: linear-gradient(90deg, transparent, rgb(92 202 255 / 0.09), transparent);
  content: "";
  opacity: 0;
  pointer-events: none;
  transform: rotate(15deg) translateX(-60vw);
}

.hero-stage{
  position: relative;
  z-index: var(--z-content);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(19rem, 5fr);
  align-items: center;
  min-height: 100dvh;
  gap: clamp(2rem, 5vw, 6rem);
  padding-block: calc(var(--header-height) + 1rem) 5rem;
}

[dir="rtl"] .hero-stage{
  grid-template-columns: minmax(19rem, 5fr) minmax(0, 7fr);
}

.hero-copy{
  position: relative;
  max-width: 46rem;
  padding-inline-start: 1.75rem;
}

.hero-copy::before{
  position: absolute;
  inset-block: 0.4rem;
  inset-inline-start: 0;
  width: 2px;
  background: linear-gradient(180deg, var(--blue-300), rgb(27 156 255 / 0.08));
  box-shadow: 0 0 22px rgb(62 184 255 / 0.75);
  content: "";
  transform-origin: top;
}

.kicker,
.panel-label{
  color: var(--blue-300);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

html[lang="fa"] .kicker,
html[lang="fa"] .panel-label{
  letter-spacing: 0;
  text-transform: none;
}

.hero h1{
  max-width: 14ch;
  margin-top: 1.15rem;
  color: var(--text);
  font-weight: 650;
  letter-spacing: -0.065em;
  line-height: 0.98;
  text-wrap: balance;
  text-shadow: 0 14px 40px rgb(0 7 24 / 0.35);
}

html[lang="fa"] .hero h1{
  max-width: 13.5ch;
  font-weight: 400;
  letter-spacing: -0.055em;
  line-height: 1.12;
}

.hero-lead{
  max-width: 34rem;
  margin-top: 1.5rem;
  color: var(--text-soft);
  line-height: 1.85;
}

.hero-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 2rem;
}

.button{
  position: relative;
  display: inline-flex;
  min-height: 3.35rem;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 0.85rem 1.55rem;
  border: 1px solid transparent;
  border-radius: var(--radius-button);
  cursor: pointer;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  touch-action: manipulation;
  transition:
    transform 140ms var(--ease-out),
    color 180ms var(--ease-out),
    border-color 180ms var(--ease-out),
    background-color 180ms var(--ease-out),
    box-shadow 180ms var(--ease-out);
}

.button::before{
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 18%, rgb(var(--slc-ref-white-rgb) / 0.24), transparent 72%);
  content: "";
  transform: translateX(-130%);
  transition: transform 480ms var(--ease-out);
}

[dir="rtl"] .button::before{
  transform: translateX(130%);
}

.button-primary{
  background: linear-gradient(135deg, var(--slc-color-action), var(--slc-color-accent-on-dark));
  box-shadow:
    inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.26),
    0 12px 35px rgb(var(--slc-ref-shadow-rgb) / 0.32);
  color: var(--slc-color-ink-strong);
}

.button-quiet{
  border-color: var(--line-strong);
  background: var(--slc-color-glass);
  color: var(--slc-color-ink-strong);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.button:active,
.language-link:active,
.menu-button:active,
.route-option:active{
  transform: scale(0.97);
}

.button:disabled{
  cursor: not-allowed;
  filter: saturate(0.62);
  opacity: 0.64;
}

.switch-signature{
  position: relative;
  align-self: center;
  width: min(39vw, 33rem);
  justify-self: end;
  padding: 1.15rem;
  border: 1px solid rgb(117 211 255 / 0.21);
  border-radius: 50%;
  background:
    radial-gradient(circle at 46% 48%, rgb(17 123 236 / 0.18), transparent 44%),
    rgb(3 20 43 / 0.18);
  box-shadow:
    inset 0 0 70px rgb(32 154 255 / 0.08),
    0 30px 100px rgb(0 17 48 / 0.38);
  aspect-ratio: 1;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

[dir="rtl"] .switch-signature{
  justify-self: start;
}

.switch-signature::before,
.switch-signature::after{
  position: absolute;
  border: 1px solid rgb(82 190 255 / 0.16);
  border-radius: inherit;
  content: "";
  pointer-events: none;
}

.switch-signature::before{
  inset: 8%;
}

.switch-signature::after{
  inset: 18%;
  border-style: dashed;
}

.switch-signature svg{
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.switch-rail{
  fill: none;
  stroke: rgb(143 202 237 / 0.28);
  stroke-linecap: round;
  stroke-width: 4;
}

.switch-rail-live{
  stroke: var(--blue-300);
  stroke-width: 6;
  filter: drop-shadow(0 0 7px rgb(64 188 255 / 0.75));
}

.switch-tie{
  fill: none;
  stroke: rgb(189 229 255 / 0.54);
  stroke-width: 3;
}

.switch-node{
  fill: var(--navy-900);
  stroke: rgb(158 220 255 / 0.7);
  stroke-width: 3;
  transform-box: fill-box;
  transform-origin: center;
}

.switch-node-live{
  fill: var(--blue-300);
  stroke: var(--ice);
  filter: drop-shadow(0 0 10px rgb(67 191 255 / 0.8));
}

/* Shared headings */

.section-heading{
  max-width: 50rem;
}

.section-title{
  max-width: 15ch;
  margin-top: 0.9rem;
  font-size: clamp(2.55rem, 5.2vw, 5.8rem);
  font-weight: 620;
  letter-spacing: -0.055em;
  text-wrap: balance;
}

html[lang="fa"] .section-title{
  font-family: "IRANYekanX", "SLC IRANYekanX Fallback", Tahoma, "Segoe UI", Arial, sans-serif;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.22;
}

.section-lead{
  max-width: 42rem;
  margin-top: 1.35rem;
  color: var(--text-soft);
  font-size: clamp(0.98rem, 1.25vw, 1.08rem);
}


/* Briefing */

.briefing-section{
  overflow: visible;
  background:
    radial-gradient(circle at 15% 26%, rgb(var(--slc-ref-accent-rgb) / 0.14), transparent 30rem),
    var(--slc-color-canvas);
}

.briefing-intro .section-title{
  font-size: clamp(2.6rem, 4.8vw, 5.2rem);
}

/* Inquiry */

.inquiry-section{
  overflow: clip;
  padding-bottom: clamp(8rem, 12vw, 12rem);
  background: var(--slc-component-inquiry-background);
}

.inquiry-copy .section-title{
  font-size: clamp(2.7rem, 5vw, 5.4rem);
}

.inquiry-form{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.15rem;
  padding: clamp(1.5rem, 3.5vw, 3.5rem);
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-panel);
  background:
    radial-gradient(circle at 92% 4%, rgb(var(--slc-ref-accent-light-rgb) / 0.14), transparent 20rem),
    rgb(var(--slc-ref-ink-rgb) / 0.78);
  box-shadow:
    inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.12),
    var(--slc-shadow-surface-strong);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}

/* Motion helpers */

.motion-word{
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
}

.motion-word > span{
  display: inline-block;
}

.motion-mask{
  overflow: hidden;
}

/* Responsive */

@media (max-width: 75rem){
  :root {
    --container: min(100% - 2rem, 72rem);
  }

  .brand-name {
    display: none;
  }


  .switch-signature {
    width: min(40vw, 28rem);
  }

  .section-title {
    font-size: clamp(2.6rem, 5.5vw, 4.8rem);
  }
}

@media not all and (min-width: 64.0625rem){
  :root{
    --header-height: 4.25rem;
  }

  .header-inner{
    grid-template-columns: 1fr auto;
  }

  .header-actions{
    grid-column: 1;
    justify-self: start;
  }

  [dir="rtl"] .header-actions{
    grid-column: 2;
    justify-self: end;
  }

  .brand,
  [dir="rtl"] .brand{
    grid-column: 2;
    justify-self: end;
  }

  [dir="rtl"] .brand{
    grid-column: 1;
    justify-self: start;
  }

  .menu-button{
    display: inline-grid;
  }

  .site-nav{
    position: fixed;
    inset: var(--header-height) 0 0;
    z-index: var(--z-menu);
    display: grid;
    grid-column: auto;
    width: 100%;
    height: calc(100dvh - var(--header-height));
    align-items: center;
    overscroll-behavior: contain;
    padding: 1rem;
    border-bottom: 1px solid var(--line);
    background:
      radial-gradient(circle at 80% 10%, rgb(var(--slc-ref-accent-rgb) / 0.18), transparent 20rem),
      var(--slc-color-glass-strong);
    box-shadow: var(--slc-shadow-dialog);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-1rem);
    visibility: hidden;
    transition:
      opacity 200ms var(--ease-out),
      transform 220ms var(--ease-out),
      visibility 0ms linear 220ms;
  }

  .site-nav[data-open="true"]{
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
    visibility: visible;
    transition:
      opacity 180ms var(--ease-out),
      transform 220ms var(--ease-out),
      visibility 0ms linear 0ms;
  }

  .keyboard-menu-toggle .site-nav{
    transition: none;
  }

  .nav-list{
    display: grid;
    width: var(--container);
    margin-inline: auto;
    gap: 0;
  }

  .nav-link{
    width: 100%;
    min-height: clamp(4rem, 10vw, 6rem);
    border-bottom: 1px solid var(--line);
    font-size: clamp(1.25rem, 4vw, 2.4rem);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage{
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
  }

  .hero-copy{
    max-width: 40rem;
  }

  .switch-signature{
    position: absolute;
    inset-block-start: 23%;
    inset-inline-end: -6rem;
    z-index: -1;
    width: 26rem;
    opacity: 0.6;
  }

  [dir="rtl"] .switch-signature{
    inset-inline: -6rem auto;
  }

}

@media (max-width: 47.99rem){
  :root{
    --container: min(100% - 1.25rem, 45rem);
    --radius-panel: 1.15rem;
    --radius-control: 0.78rem;
  }

  .section{
    padding-block: 5.5rem;
  }

  .header-inner{
    gap: 0.65rem;
  }

  .language-link,
  .menu-button{
    min-height: 2.45rem;
  }

  .menu-button{
    padding-inline: 0.85rem;
  }

  .brand-mark{
    width: 2.4rem;
    height: 2.4rem;
  }

  .hero{
    min-height: max(43rem, 100dvh);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage{
    min-height: max(43rem, 100dvh);
    align-content: end;
    padding-block: calc(var(--header-height) + 1.75rem) 5.5rem;
  }

  .hero-media img{
    object-position: 58% center;
  }

  .hero-shade,
  [dir="rtl"] .hero-shade{
    background:
      linear-gradient(180deg, rgb(1 8 18 / 0.12), rgb(2 11 27 / 0.34) 36%, rgb(1 8 20 / 0.94) 80%),
      radial-gradient(circle at 20% 34%, rgb(19 138 255 / 0.17), transparent 22rem);
  }

  .hero::before{
    opacity: 0.45;
  }

  .hero-copy{
    align-self: end;
    max-width: none;
    padding-inline-start: 1rem;
  }

  .hero h1,
  html[lang="fa"] .hero h1{
    max-width: 13.5ch;
  }

  .hero-lead{
    max-width: 31rem;
    line-height: 1.75;
  }

  .hero-actions{
    gap: 0.55rem;
    margin-top: 1.45rem;
  }

  .button{
    min-height: 3.05rem;
    padding-inline: 1.15rem;
    font-size: 0.78rem;
  }

  .switch-signature{
    inset-block-start: 18%;
    inset-inline-end: -7rem;
    width: 22rem;
    opacity: 0.46;
  }

  [dir="rtl"] .switch-signature{
    inset-inline: -7rem auto;
  }

  .section-title,
  .briefing-intro .section-title,
  .inquiry-copy .section-title{
    max-width: 17ch;
    font-size: clamp(2.2rem, 10vw, 3.6rem);
  }

  .inquiry-form{
    grid-template-columns: 1fr;
    padding: 1.15rem;
  }
}

@media (max-width: 24rem){
  .hero-actions{
    display: grid;
  }

  .button{
    width: 100%;
  }

}

@media (max-height: 45rem) and (min-width: 48rem){

  .hero-lead{
    margin-top: 1rem;
  }

  .hero-actions{
    margin-top: 1.2rem;
  }

  .switch-signature{
    width: min(35vw, 22rem);
  }
}

@media (hover: hover) and (pointer: fine){
  .nav-link:hover,
  .footer-links a:hover{
    color: var(--blue-300);
    transform: translateY(-1px);
  }

  .nav-link:hover::after{
    transform: scaleX(1);
  }

  .brand:hover .brand-mark::after{
    transform: rotate(24deg) translateX(520%);
    transition: transform 520ms var(--ease-out);
  }

  .language-link:hover,
  .menu-button:hover{
    border-color: var(--line-strong);
    background: var(--slc-color-action-hover);
    color: var(--slc-color-on-action);
  }

  .button:hover:not(:disabled){
    box-shadow:
      inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.24),
      0 16px 45px rgb(var(--slc-ref-accent-rgb) / 0.35);
    transform: translateY(-2px);
  }

  .button:hover:not(:disabled)::before{
    transform: translateX(130%);
  }

  [dir="rtl"] .button:hover:not(:disabled)::before{
    transform: translateX(-130%);
  }
}

@media (prefers-reduced-transparency: reduce){
  .site-header.is-scrolled,
  .button-quiet,
  .corridor-console,
  .inquiry-form{
    background-color: var(--navy-900);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

@media (prefers-reduced-motion: no-preference){
  .hero::after{
    animation: hero-signal-sweep 8s var(--ease-in-out) 1.5s infinite;
  }

  .switch-signature::after{
    animation: orbit-ring 18s linear infinite;
  }

  .switch-node-live{
    animation: signal-node 2.2s ease-in-out infinite;
  }

  @keyframes hero-signal-sweep{
    0%,
    70%{
      opacity: 0;
      transform: rotate(15deg) translateX(-60vw);
    }
    78%{
      opacity: 1;
    }
    100%{
      opacity: 0;
      transform: rotate(15deg) translateX(70vw);
    }
  }

  @keyframes orbit-ring{
    to{
      transform: rotate(360deg);
    }
  }

  @keyframes signal-node{
    0%,
    100%{
      opacity: 0.72;
      transform: scale(0.92);
    }
    50%{
      opacity: 1;
      transform: scale(1.08);
    }
  }

}

@media (prefers-reduced-motion: reduce){
  *,
  *::before,
  *::after{
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }

  .hero-media img,
  .switch-signature,
  .route-map,
  .inquiry-form,
  [data-reveal]{
    opacity: 1 !important;
    transform: none !important;
  }
}


/* ========================================================================== */
/* Source: styles-v4.css */
/* ========================================================================== */

/*
 * SLC V4 - Signal Daylight
 * A light, high-energy art direction layered over the V3 layout and motion system.
 */

:root{
  color-scheme: light;
  /* Legacy aliases resolve through the active non-Hero theme contract. */
  --ink: var(--slc-color-canvas-top);
  --ink-blue: var(--slc-color-canvas);
  --navy-950: var(--slc-color-ink-strong);
  --navy-900: var(--slc-ref-steel-900);
  --navy-850: var(--slc-color-ink);
  --navy-800: var(--slc-color-action-hover);
  --navy-700: var(--slc-color-action);
  --blue-700: var(--slc-color-action-hover);
  --blue-600: var(--slc-color-action);
  --blue-500: var(--slc-color-accent);
  --blue-400: var(--slc-color-accent-on-dark);
  --blue-300: var(--slc-color-accent-on-dark);
  --ice: var(--slc-color-surface);
  --text: var(--slc-color-ink-strong);
  --text-soft: var(--slc-color-ink);
  --text-muted: var(--slc-color-ink-muted);
  --line: var(--slc-color-line);
  --line-strong: var(--slc-color-line-strong);
  --glass: var(--slc-color-glass);
  --glass-strong: var(--slc-color-glass-strong);
  --accent: var(--slc-color-action);
  --accent-bright: var(--slc-color-accent-on-dark);
  --accent-deep: var(--slc-color-action-hover);
  --shadow: var(--slc-shadow-surface);
  --shadow-blue: var(--slc-shadow-surface-strong);
  --radius-panel: 1.75rem;
  --radius-control: 0.95rem;
}

html{
  background: var(--slc-color-canvas);
}

body{
  background: var(--slc-component-body-background);
  color: var(--slc-color-ink-strong);
}

::selection{
  background: var(--slc-color-action);
  color: var(--slc-color-on-action);
}

:focus-visible{
  outline-color: var(--slc-color-focus-ring);
}

.skip-link{
  background: var(--slc-color-action);
  color: var(--slc-color-on-action);
}

.section{
  background-color: transparent;
}

/* Light navigation */

.site-header{
  border-bottom-color: var(--slc-color-line-soft);
  background:
    linear-gradient(180deg, var(--slc-color-glass-strong), var(--slc-color-glass));
  box-shadow: var(--slc-shadow-surface);
  backdrop-filter: blur(18px) saturate(150%);
  -webkit-backdrop-filter: blur(18px) saturate(150%);
}

.site-header.is-scrolled{
  border-color: var(--line);
  background: var(--slc-color-glass-strong);
  box-shadow: var(--slc-shadow-surface-strong);
}

.route-progress{
  background: rgb(var(--slc-ref-accent-rgb) / 0.08);
}

.route-progress span{
  background: linear-gradient(90deg, var(--slc-color-action), var(--slc-color-accent-on-dark));
  box-shadow: 0 0 14px rgb(var(--slc-ref-accent-light-rgb) / 0.32);
}

.nav-link{
  color: var(--slc-color-ink);
}

.nav-link.is-active{
  color: var(--slc-color-action);
}

.brand-mark{
  border-color: rgb(var(--slc-ref-accent-deep-rgb) / 0.35);
  background:
    linear-gradient(145deg, rgb(var(--slc-ref-accent-light-rgb) / 0.38), transparent 50%),
    var(--slc-color-action);
  box-shadow:
    inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.42),
    var(--slc-shadow-surface-strong);
  color: var(--slc-color-on-action);
}

.brand-name{
  color: var(--slc-color-ink-strong);
}

.language-link,
.menu-button{
  border-color: var(--slc-color-line);
  background: var(--slc-color-glass);
  box-shadow: var(--slc-shadow-surface);
  color: var(--slc-color-ink);
}

/* Hero: the approved image stays, the stage becomes daylight */

.hero{
  background: #dceeff;
}

.hero-media img{
  filter: saturate(1.08) brightness(1.11) contrast(0.94);
}

.hero-media::after{
  background:
    linear-gradient(90deg, rgb(239 248 255 / 0.22), transparent 50%, rgb(210 234 255 / 0.2)),
    linear-gradient(180deg, rgb(242 249 255 / 0.24), transparent 56%, rgb(225 241 255 / 0.84) 100%);
}

[dir="rtl"] .hero-media::after{
  background:
    linear-gradient(270deg, rgb(239 248 255 / 0.22), transparent 50%, rgb(210 234 255 / 0.2)),
    linear-gradient(180deg, rgb(242 249 255 / 0.24), transparent 56%, rgb(225 241 255 / 0.84) 100%);
}

.hero-shade{
  background:
    radial-gradient(circle at 20% 47%, rgb(49 166 255 / 0.19), transparent 28rem),
    linear-gradient(90deg, rgb(241 248 255 / 0.88) 0%, rgb(235 246 255 / 0.55) 36%, transparent 68%);
}

[dir="rtl"] .hero-shade{
  background:
    radial-gradient(circle at 80% 47%, rgb(49 166 255 / 0.19), transparent 28rem),
    linear-gradient(270deg, rgb(241 248 255 / 0.88) 0%, rgb(235 246 255 / 0.55) 36%, transparent 68%);
}

.hero::before{
  background:
    linear-gradient(90deg, rgb(0 94 196 / 0.055) 1px, transparent 1px),
    linear-gradient(rgb(0 94 196 / 0.055) 1px, transparent 1px);
}

.hero::after{
  background: linear-gradient(90deg, transparent, rgb(255 255 255 / 0.44), transparent);
}

.hero-stage{
  padding-block: calc(var(--header-height) + 1rem) 4.5rem;
}

[dir="rtl"] .hero-stage{
  grid-template-columns: minmax(22rem, 6fr) minmax(0, 6fr);
}

.hero-copy{
  max-width: 47rem;
  padding: clamp(1.7rem, 3.2vw, 3.35rem);
  border: 1px solid rgb(255 255 255 / 0.88);
  border-radius: calc(var(--radius-panel) + 0.35rem);
  background:
    linear-gradient(145deg, rgb(255 255 255 / 0.86), rgb(242 249 255 / 0.72)),
    rgb(255 255 255 / 0.7);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.9),
    0 28px 80px rgb(13 69 126 / 0.17);
  backdrop-filter: blur(22px) saturate(132%);
  -webkit-backdrop-filter: blur(22px) saturate(132%);
}

.hero-copy::before{
  inset-block: 1.8rem;
  inset-inline-start: -1px;
  width: 5px;
  border-radius: 999px;
  background: linear-gradient(180deg, #005bcf, #35b7ff);
  box-shadow: 0 10px 25px rgb(0 103 224 / 0.22);
}

.kicker,
.panel-label{
  color: var(--slc-color-action);
}

.hero h1{
  color: #071d39;
  text-shadow: none;
}

html[lang="fa"] .hero h1{
  max-width: 16ch;
}

.hero-lead{
  color: #294a68;
}

.button-primary{
  border-color: var(--slc-color-action-hover);
  background: var(--slc-color-action);
  box-shadow:
    inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.24),
    var(--slc-shadow-surface-strong);
  color: var(--slc-color-on-action);
}

.button-quiet{
  border-color: var(--slc-color-line-strong);
  background: var(--slc-color-glass);
  box-shadow: var(--slc-shadow-surface);
  color: var(--slc-color-ink-strong);
}

.switch-signature{
  border-color: rgb(9 102 208 / 0.24);
  background:
    radial-gradient(circle at 46% 48%, rgb(62 182 255 / 0.25), transparent 44%),
    rgb(245 251 255 / 0.48);
  box-shadow:
    inset 0 0 70px rgb(255 255 255 / 0.28),
    0 30px 90px rgb(19 78 136 / 0.14);
}

.switch-signature::before,
.switch-signature::after{
  border-color: rgb(0 98 208 / 0.18);
}

.switch-rail{
  stroke: rgb(12 68 119 / 0.29);
}

.switch-rail-live{
  stroke: #006be7;
  filter: drop-shadow(0 3px 5px rgb(0 100 216 / 0.28));
}

.switch-tie{
  stroke: rgb(13 75 133 / 0.46);
}

.switch-node{
  fill: #f4faff;
  stroke: rgb(6 89 178 / 0.58);
}

.switch-node-live{
  fill: #087ff5;
  stroke: #eefaff;
  filter: drop-shadow(0 4px 8px rgb(0 97 207 / 0.32));
}

/* Shared typography */

.section-title{
  color: var(--slc-color-ink-strong);
}

.section-lead{
  color: var(--slc-color-ink-muted);
}


/* Sticky briefing, now floating on daylight */

.briefing-section{
  background: var(--slc-component-briefing-background);
}

/* Inquiry */

.inquiry-section{
  background: var(--slc-component-inquiry-background);
}

.inquiry-form{
  border-color: var(--slc-color-line);
  background:
    radial-gradient(circle at 92% 4%, rgb(var(--slc-ref-accent-light-rgb) / 0.13), transparent 20rem),
    var(--slc-color-glass-strong);
  box-shadow:
    inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.98),
    var(--slc-component-card-shadow);
}

/* Correct V3 hover colors for the new light material */

@media (hover: hover) and (pointer: fine){
  .nav-link:hover,
  .footer-links a:hover {
    color: var(--slc-color-action);
  }

  .language-link:hover,
  .menu-button:hover {
    border-color: rgb(var(--slc-ref-accent-deep-rgb) / 0.28);
    background: var(--slc-color-surface);
    color: var(--slc-color-action-hover);
  }

  .button:hover:not(:disabled) {
    box-shadow:
      inset 0 1px 0 rgb(var(--slc-ref-white-rgb) / 0.28),
      var(--slc-shadow-surface-strong);
  }
}

@media not all and (min-width: 64.0625rem){
  .header-actions,
  .brand,
  [dir="rtl"] .header-actions,
  [dir="rtl"] .brand{
    grid-row: 1;
  }

  .site-nav{
    border-bottom-color: var(--slc-color-line);
    background:
      radial-gradient(circle at 80% 10%, rgb(var(--slc-ref-accent-rgb) / 0.15), transparent 20rem),
      var(--slc-color-glass-strong);
    box-shadow: var(--slc-shadow-dialog);
  }

  .nav-link{
    border-bottom-color: var(--slc-color-line);
    color: var(--slc-color-ink);
  }

  .switch-signature{
    opacity: 0.72;
  }

  [dir="rtl"] .hero-stage{
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 47.99rem){
  .hero-shade,
  [dir="rtl"] .hero-shade{
    background:
      linear-gradient(180deg, rgb(239 248 255 / 0.08), rgb(234 245 255 / 0.14) 38%, rgb(227 241 255 / 0.82) 84%),
      radial-gradient(circle at 20% 34%, rgb(28 157 255 / 0.14), transparent 22rem);
  }

  .hero-copy{
    padding: 1.35rem;
    border-radius: var(--radius-panel);
    background:
      linear-gradient(145deg, rgb(255 255 255 / 0.9), rgb(238 247 255 / 0.82)),
      rgb(255 255 255 / 0.84);
  }

  .hero-copy::before{
    inset-block: 1.35rem;
  }

  .switch-signature{
    opacity: 0.42;
  }
}


@media (prefers-reduced-transparency: reduce){
  .site-header,
  .site-header.is-scrolled,
  .button-quiet,
  .corridor-console,
  .inquiry-form{
    background: var(--slc-color-surface);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  /* Hero remains a fixed visual exception, including its fallback surface. */
  .hero-copy{
    background: #f8fcff;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}


/* ========================================================================== */
/* Source: styles-v5.css */
/* ========================================================================== */

/*
 * SLC V5 — Kinetic Freight Editorial
 * One steel-blue palette, tighter information density and scroll-led storytelling.
 */

:root{
  color-scheme: light;
  /* V5 compatibility aliases are now supplied by the central theme layer. */
  --canvas: var(--slc-color-canvas);
  --surface: var(--slc-color-surface);
  --surface-muted: var(--slc-color-surface-muted);
  --surface-blue: var(--slc-color-surface-strong);
  --steel-950: var(--slc-color-ink-strong);
  --steel-900: var(--slc-ref-steel-900);
  --steel-800: var(--slc-color-ink);
  --steel-700: var(--slc-color-ink);
  --steel-600: var(--slc-color-ink-muted);
  --steel-500: var(--slc-color-ink-muted);
  --signal: var(--slc-color-action);
  --signal-strong: var(--slc-color-action-hover);
  --signal-soft: var(--slc-color-accent);
  --text: var(--steel-950);
  --text-soft: var(--steel-700);
  --text-muted: var(--steel-600);
  --line: var(--slc-color-line);
  --line-strong: var(--slc-color-line-strong);
  --glass: var(--slc-color-glass);
  --glass-strong: var(--slc-color-glass-strong);
  --accent: var(--signal);
  --accent-bright: var(--signal-soft);
  --accent-deep: var(--signal-strong);
  --shadow: var(--slc-shadow-surface);
  --shadow-blue: var(--slc-shadow-surface-strong);
  --radius-panel: 1.15rem;
  --radius-control: 0.68rem;
}

html{
  background: var(--slc-color-canvas);
}

body{
  background: var(--slc-color-canvas);
  color: var(--text);
}

::selection{
  background: var(--signal);
  color: var(--slc-color-on-action);
}

.section{
  padding-block: clamp(5rem, 7.5vw, 7.5rem);
}

.section-title{
  font-size: clamp(2.35rem, 4.45vw, 4.85rem);
}

.section-lead{
  color: var(--text-soft);
}

/* Navigation */

.site-header,
.site-header.is-scrolled{
  border-bottom-color: var(--line);
  background: var(--slc-color-glass-strong);
  box-shadow: var(--slc-shadow-surface);
}

.route-progress{
  height: 3px;
  background: rgb(var(--slc-ref-accent-rgb) / 0.08);
}

.route-progress span{
  background: var(--signal);
  box-shadow: none;
}

.brand-mark{
  border-color: rgb(var(--slc-ref-white-rgb) / 0.22);
  background: var(--signal);
  box-shadow: var(--slc-shadow-surface-strong);
}

.language-link,
.menu-button{
  border-color: var(--line);
  border-radius: var(--radius-control);
  background: var(--slc-color-glass);
  box-shadow: none;
  color: var(--steel-800);
}

/* Hero: approved switchyard image, no decorative signature */

.hero{
  background: #d7e3ec;
}

.hero-media img{
  filter: saturate(1.03) brightness(1.06) contrast(0.98);
}

.hero-media::after{
  background:
    linear-gradient(90deg, rgb(237 244 249 / 0.16), transparent 55%),
    linear-gradient(180deg, rgb(236 243 248 / 0.08), transparent 55%, rgb(222 232 240 / 0.88));
}

[dir="rtl"] .hero-media::after{
  background:
    linear-gradient(270deg, rgb(237 244 249 / 0.16), transparent 55%),
    linear-gradient(180deg, rgb(236 243 248 / 0.08), transparent 55%, rgb(222 232 240 / 0.88));
}

.hero-shade{
  background:
    linear-gradient(90deg, rgb(235 242 247 / 0.96) 0%, rgb(232 240 246 / 0.78) 31%, transparent 62%);
}

[dir="rtl"] .hero-shade{
  background:
    linear-gradient(270deg, rgb(235 242 247 / 0.96) 0%, rgb(232 240 246 / 0.78) 31%, transparent 62%);
}

.hero::before{
  background:
    linear-gradient(90deg, rgb(7 66 119 / 0.05) 1px, transparent 1px),
    linear-gradient(rgb(7 66 119 / 0.05) 1px, transparent 1px);
  background-size: 5rem 5rem;
}

.hero::after{
  display: none;
}

.hero-stage,
[dir="rtl"] .hero-stage{
  grid-template-columns: minmax(22rem, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 4vw, 5rem);
  padding-block: calc(var(--header-height) + 1rem) 4rem;
}

[dir="rtl"] .hero-stage{
  grid-template-columns: minmax(0, 7fr) minmax(22rem, 5fr);
}

.hero-copy{
  width: min(100%, 42rem);
  max-width: 42rem;
  padding: clamp(1.7rem, 2.8vw, 2.7rem);
  border: 1px solid rgb(255 255 255 / 0.78);
  border-radius: var(--radius-panel);
  background: rgb(245 249 252 / 0.9);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.92),
    0 22px 65px rgb(20 55 82 / 0.17);
  backdrop-filter: blur(18px) saturate(118%);
  -webkit-backdrop-filter: blur(18px) saturate(118%);
}

.hero-copy::before{
  inset-block: 1.55rem;
  width: 4px;
  background: var(--signal);
  box-shadow: none;
}

.kicker,
.panel-label{
  color: var(--signal);
}

.hero h1,
html[lang="fa"] .hero h1{
  max-width: 15ch;
  color: var(--steel-950);
  text-shadow: none;
}

.hero-lead{
  max-width: 31rem;
  margin-top: 1.2rem;
  color: var(--steel-700);
}

.hero-actions{
  margin-top: 1.65rem;
}

.button{
  min-height: 3.15rem;
  border-radius: var(--radius-control);
}

.button-primary{
  border-color: var(--signal-strong);
  background: var(--signal);
  box-shadow: var(--slc-shadow-surface);
  color: var(--slc-color-on-action);
}

.button-quiet{
  border-color: var(--line-strong);
  background: var(--slc-color-glass);
  box-shadow: none;
  color: var(--steel-800);
}


/* Sticky operational briefing */

.briefing-section{
  background: var(--slc-component-briefing-background);
}

.briefing-intro .section-title{
  font-size: clamp(2.35rem, 4vw, 4.4rem);
}

/* Inquiry and footer */

.inquiry-section{
  padding-bottom: clamp(5.5rem, 8vw, 8rem);
  background: var(--slc-component-inquiry-background);
}

.inquiry-form{
  padding: clamp(1.4rem, 2.7vw, 2.7rem);
  border-color: var(--line-strong);
  border-radius: var(--radius-panel);
  background: var(--slc-color-surface);
  box-shadow: var(--slc-component-card-shadow);
}

/* Motion layers */

.motion-ready .hero-media,
.motion-ready .hero-copy{
  will-change: transform, opacity;
}

@media (hover: hover) and (pointer: fine){
  .nav-link:hover,
  .footer-links a:hover{
    color: var(--signal);
  }

  .language-link:hover,
  .menu-button:hover{
    border-color: var(--line-strong);
    background: var(--slc-color-surface);
    color: var(--slc-color-action-hover);
  }

  .button:hover:not(:disabled){
    box-shadow: var(--slc-component-card-shadow);
  }


}

@media not all and (min-width: 64.0625rem){
  .section{
    padding-block: clamp(4.75rem, 8vw, 6rem);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage{
    grid-template-columns: minmax(0, 1fr);
  }

  .hero-copy{
    max-width: 39rem;
  }

}

@media (max-width: 47.99rem){
  .section{
    padding-block: 4rem;
  }

  .hero{
    min-height: 100svh;
  }

  .hero-shade,
  [dir="rtl"] .hero-shade{
    background:
      linear-gradient(180deg, rgb(238 244 248 / 0.06), rgb(232 239 244 / 0.12) 34%, rgb(225 234 241 / 0.94) 80%);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage{
    min-height: 100svh;
    padding-block: calc(var(--header-height) + 1rem) 3.5rem;
  }

  .hero-copy{
    padding: 1.25rem;
    background: rgb(246 250 252 / 0.93);
  }

  .inquiry-section{
    padding-bottom: 4.5rem;
  }
}


@media (prefers-reduced-transparency: reduce){
  .hero-copy,
  .corridor-console,
  .inquiry-form{
    background: var(--surface);
  }
}

@media (prefers-reduced-motion: reduce){
  .motion-ready .hero-media,
  .motion-ready .hero-copy{
    will-change: auto;
  }
}


/* ========================================================================== */
/* Source: styles-v6.css */
/* ========================================================================== */

/*
 * SLC V6 - Rail Atlas
 * A lighter steel-blue system with one frosted hero surface and a researched corridor map.
 */

:root{
  /* V6 compatibility aliases are now supplied by the central theme layer. */
  --canvas: var(--slc-color-canvas);
  --surface: var(--slc-color-surface);
  --surface-muted: var(--slc-color-surface-muted);
  --surface-blue: var(--slc-color-surface-strong);
  --steel-950: var(--slc-color-ink-strong);
  --steel-900: var(--slc-ref-steel-900);
  --steel-800: var(--slc-color-ink);
  --steel-700: var(--slc-color-ink);
  --steel-600: var(--slc-color-ink-muted);
  --signal: var(--slc-color-action);
  --signal-strong: var(--slc-color-action-hover);
  --signal-soft: var(--slc-color-accent);
  --line: var(--slc-color-line);
  --line-strong: var(--slc-color-line-strong);
  --shadow: var(--slc-shadow-surface);
  --shadow-blue: var(--slc-shadow-surface-strong);
}

/* One measured title scale across the page */

.section-title,
.briefing-intro .section-title,
.inquiry-copy .section-title{
  max-width: 16ch;
  font-size: clamp(2.25rem, 3.5vw, 3.95rem);
  line-height: 1.08;
}

html[lang="fa"] .section-title,
html[lang="fa"] .briefing-intro .section-title,
html[lang="fa"] .inquiry-copy .section-title{
  line-height: 1.2;
}

/* The top edge belongs to the photograph, not a white navigation slab */

.site-header:not(.is-scrolled){
  border-bottom-color: rgb(255 255 255 / 0.12);
  background:
    linear-gradient(180deg, rgb(5 25 42 / 0.86), rgb(6 31 51 / 0.6));
  box-shadow: 0 12px 34px rgb(3 17 29 / 0.13);
  backdrop-filter: blur(16px) saturate(126%);
  -webkit-backdrop-filter: blur(16px) saturate(126%);
}

.site-header:not(.is-scrolled) .nav-link{
  color: rgb(235 245 252 / 0.82);
}

.site-header:not(.is-scrolled) .nav-link.is-active{
  color: #ffffff;
}

.site-header:not(.is-scrolled) .brand-name{
  color: #f4f9fc;
}

.site-header:not(.is-scrolled) .language-link,
.site-header:not(.is-scrolled) .menu-button{
  border-color: rgb(255 255 255 / 0.2);
  background: rgb(255 255 255 / 0.09);
  color: #f4f9fc;
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.12);
}

/* Hero: retain the approved switchyard, remove the white wash */

.hero{
  background: #9fb3c1;
}

.hero-media img{
  filter: saturate(1.12) brightness(1.02) contrast(1.02);
}

.hero-media::after,
[dir="rtl"] .hero-media::after{
  background: transparent;
}

.hero-shade,
[dir="rtl"] .hero-shade{
  background: transparent;
}

.hero-copy{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: rgb(255 255 255 / 0.68);
  background: rgb(245 250 253 / 0.32);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.86),
    inset 0 -1px 0 rgb(255 255 255 / 0.18),
    0 24px 70px rgb(3 21 35 / 0.2);
  backdrop-filter: blur(10px) saturate(120%) brightness(1.18);
  -webkit-backdrop-filter: blur(10px) saturate(120%) brightness(1.18);
}

.hero-copy::before{
  display: none;
}

.hero-copy::after{
  position: absolute;
  z-index: 0;
  inset: 1px;
  border: 1px solid rgb(255 255 255 / 0.2);
  border-radius: calc(var(--radius-panel) - 1px);
  background: transparent;
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.34),
    inset 1px 0 0 rgb(255 255 255 / 0.1);
  content: "";
  pointer-events: none;
}

.hero-copy > *{
  position: relative;
  z-index: 1;
}

.hero h1,
html[lang="fa"] .hero h1{
  color: #061d31;
}

.hero-lead{
  color: #244e69;
}

.hero .button-quiet{
  border-color: rgb(6 76 137 / 0.22);
  background: rgb(248 252 255 / 0.52);
}

@keyframes map-node-pulse{
  0%,
  100%{
    opacity: 0.24;
    transform: scale(0.78);
  }

  50%{
    opacity: 0.58;
    transform: scale(1.18);
  }
}

.inquiry-copy .section-title{
  max-width: 15ch;
}

@media (hover: hover) and (pointer: fine){
  .site-header:not(.is-scrolled) .language-link:hover,
  .site-header:not(.is-scrolled) .menu-button:hover{
    border-color: rgb(255 255 255 / 0.36);
    background: rgb(255 255 255 / 0.16);
    color: #ffffff;
  }
}

@media (max-width: 47.99rem){
  .section-title,
  .briefing-intro .section-title,
  .inquiry-copy .section-title{
    font-size: clamp(2.05rem, 9vw, 3rem);
  }

  .site-header:not(.is-scrolled){
    background: rgb(5 27 45 / 0.78);
  }

  .hero-shade,
  [dir="rtl"] .hero-shade{
    background: transparent;
  }

  .hero-copy{
    border-color: rgb(255 255 255 / 0.64);
    background: rgb(245 250 253 / 0.38);
    backdrop-filter: blur(9px) saturate(118%) brightness(1.16);
    -webkit-backdrop-filter: blur(9px) saturate(118%) brightness(1.16);
  }
}

@media (prefers-reduced-transparency: reduce){
  .hero-copy{
    background: rgb(229 240 247 / 0.96);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}


/* ========================================================================== */
/* Source: styles-v7.css */
/* ========================================================================== */

/*
 * SLC V7 - Signal Cabin Glass
 * Promotes the selected V1 Hero direction into the bilingual main site.
 */

:root{
  --v7-navy: #0a1b2a;
  --v7-cyan: #66b2c7;
  --v7-blue: #3479a0;
  --v7-amber: #d4a85a;
  --v7-cyan-rgb: 102 178 199;
  --v7-blue-rgb: 52 121 160;
  --v7-amber-rgb: 212 168 90;
  --v7-text: #f3f8fc;
  --v7-muted: #c4d3da;
}

/* Dark photographic stage with local rail light, not a full-surface gradient. */

.hero{
  --v7-shift-near-x: 0px;
  --v7-shift-near-y: 0px;
  background: var(--v7-navy);
}

.hero-media img{
  object-position: 45% center;
  filter: saturate(1.12) contrast(1.08) brightness(0.75);
}

.hero-media::after,
[dir="rtl"] .hero-media::after{
  background: transparent;
}

.hero-shade,
[dir="rtl"] .hero-shade{
  background: rgb(3 14 30 / 0.42);
}

.hero::before{
  background: transparent;
  -webkit-mask-image: none;
  mask-image: none;
}

.hero::after{
  display: none;
}

/* The panel occupies the reading side while the switchyard remains exposed. */

.hero-stage{
  grid-template-columns: minmax(22rem, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 4vw, 5rem);
  padding-block: calc(var(--header-height) + 0.75rem) 3.5rem;
}

[dir="rtl"] .hero-stage{
  grid-template-columns: minmax(0, 7fr) minmax(22rem, 5fr);
}

[dir="rtl"] .hero-copy{
  grid-column: 1 / -1;
  justify-self: stretch;
  margin-right: 0;
  margin-left: auto;
}

.hero-copy{
  width: clamp(28rem, 29vw, 34rem);
  max-width: 100%;
}

.hero-copy.glass-box-shell{
  isolation: auto;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* Remove legacy V3/V6 frame layers; the inner glass-box owns the only visible edge. */
.hero-copy.glass-box-shell::before,
.hero-copy.glass-box-shell::after{
  display: none;
  content: none;
}

/* Interactive glass surface supplied for the hero; the existing content stays intact. */

.glass-box{
  --pointer-x: 50%;
  --pointer-y: 28%;
  --rotate-x: 0deg;
  --rotate-y: 0deg;
  --glare-core: rgb(205 232 255 / 0.1);
  --glare-mid: rgb(116 184 255 / 0.02);
  --glare-mid-stop: 16%;
  --glare-end-stop: 30%;
  position: relative;
  isolation: isolate;
  width: 100%;
  padding: clamp(1.55rem, 2.2vw, 2.4rem);
  overflow: hidden;
  color: #fff;
  background: rgb(255 255 255 / 0.03);
  -webkit-backdrop-filter: blur(36px) saturate(85%) brightness(94%) contrast(102%);
  backdrop-filter: blur(36px) saturate(85%) brightness(94%) contrast(102%);
  border-radius: 10px;
  box-shadow:
    0 18px 42px rgb(0 0 0 / 0.28),
    inset 0 1px 0 rgb(255 255 255 / 0.13),
    inset 0 -12px 24px rgb(0 0 0 / 0.1);
  transform: perspective(900px) rotateX(var(--rotate-x)) rotateY(var(--rotate-y));
  transform-style: preserve-3d;
  transition:
    transform 420ms cubic-bezier(0.22, 0.61, 0.36, 1),
    backdrop-filter 420ms ease,
    -webkit-backdrop-filter 420ms ease;
}

.glass-box > span{
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.glass-box__content{
  position: relative;
  z-index: 10;
}

.glass-box__ambient{
  z-index: 2;
  background:
    radial-gradient(circle at 82% 12%, rgb(116 184 255 / 0.18), transparent 72%),
    linear-gradient(
      82deg,
      color-mix(in oklab, #0e2644 5%, transparent),
      color-mix(in oklab, white 5%, transparent)
    );
}

.glass-box__noise{
  z-index: 3;
  opacity: 0.015;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
  background-size: 150px 150px;
  mix-blend-mode: soft-light;
}

.glass-box__specular{
  z-index: 4;
  background:
    radial-gradient(44% 90% at 19.5% -8%, rgb(255 255 255 / 0.24), transparent 58%),
    radial-gradient(80% 110% at 100% 100%, rgb(116 184 255 / 0.1), transparent 60%);
}

.glass-box__glare{
  z-index: 5;
  background: radial-gradient(
    circle at var(--pointer-x) var(--pointer-y),
    var(--glare-core),
    var(--glare-mid) var(--glare-mid-stop),
    transparent var(--glare-end-stop)
  );
}

.glass-box__rim{
  z-index: 8;
  padding: 1px;
  border-radius: inherit;
  background: linear-gradient(
    135deg,
    rgb(255 255 255 / 0.58),
    rgb(255 255 255 / 0.06) 34%,
    rgb(0 0 0 / 0.18) 68%,
    rgb(255 255 255 / 0.2)
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

.glass-box:hover{
  -webkit-backdrop-filter: blur(36px) saturate(85%) brightness(94%) contrast(102%);
  backdrop-filter: blur(36px) saturate(85%) brightness(94%) contrast(102%);
  transform:
    perspective(900px)
    translateY(-5px)
    rotateX(var(--rotate-x))
    rotateY(var(--rotate-y))
    scale(1.008);
}

.glass-box.is-pressed{
  transform: perspective(900px) rotateX(var(--rotate-x)) rotateY(var(--rotate-y)) scale(0.992);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  .glass-box{
    background: rgb(24 30 42 / 0.9);
  }
}

.hero .kicker{
  margin: 0 0 0.85rem;
  color: var(--v7-cyan);
  font-size: clamp(0.8rem, 1.2vw, 0.95rem);
  font-weight: 700;
}

.hero h1,
html[lang="fa"] .hero h1{
  max-width: 20ch;
  margin: 0 auto;
  color: var(--v7-text);
  font-family: "IRANYekanX", "SLC IRANYekanX Fallback", "IRANSansX", "SLC IRANSansX Fallback", sans-serif;
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: -0.03em;
  text-align: center;
  text-wrap: balance;
  text-shadow: 0 16px 44px rgb(0 8 22 / 0.34);
}

.hero-lead{
  max-width: 31rem;
  margin: 1.25rem auto 0;
  color: var(--v7-muted);
  line-height: 1.9;
  text-align: justify;
  text-align-last: right;
  text-wrap: pretty;
}

.journey-callout{
  padding: 1rem 1.25rem;
  border-inline-start: 3px solid var(--slc-color-action);
  background: rgb(var(--slc-ref-accent-rgb) / 0.08);
}

.journey-callout{
  margin-top: 2rem;
  color: var(--slc-color-ink-strong);
}

.hero-actions{
  display: grid;
  width: min(100%, 28rem);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem;
  margin: 1.5rem auto 0;
}

.hero .button{
  width: 100%;
  min-width: 0;
  min-height: 3rem;
  padding-inline: 1.35rem;
  border-radius: 8px;
}

.hero .button-primary{
  border-color: rgb(var(--v7-cyan-rgb) / 0.46);
  background: linear-gradient(135deg, var(--v7-blue), color-mix(in srgb, var(--v7-blue) 72%, var(--v7-cyan)));
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.26),
    0 14px 34px rgb(var(--v7-blue-rgb) / 0.26);
  color: #f7fbff;
}

.hero .button:disabled{
  filter: saturate(0.82);
}

.hero .button-quiet{
  border-color: rgb(255 255 255 / 0.24);
  background: rgb(255 255 255 / 0.1);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.13);
  color: var(--v7-text);
}

.hero .button-quiet:is(:hover, :focus-visible){
  border-color: rgb(var(--v7-cyan-rgb) / 0.52);
  background: rgb(var(--v7-cyan-rgb) / 0.12);
}

/* Dedicated overlay layer for the interactive route matrix. */

.v7-rail-lighting{
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.v7-visual-caption{
  position: absolute;
  bottom: 1.7rem;
  left: 0;
  display: flex;
  gap: 0.7rem;
  align-items: center;
  direction: rtl;
  color: rgb(243 248 252 / 0.52);
  font-size: 0.75rem;
}

.v7-visual-caption i{
  width: 2.8rem;
  height: 1px;
  background: rgb(var(--v7-cyan-rgb) / 0.56);
}

@media (min-width: 64.0625rem){
  .hero-copy{
    width: min(46vw, 46rem);
  }

  .glass-box{
    padding: clamp(1.75rem, 2.25vw, 2.65rem) clamp(1.9rem, 2.65vw, 3.25rem);
  }

  .hero-lead{
    max-width: 36rem;
    line-height: 1.9;
  }

  .hero-actions{
    width: min(100%, 29rem);
    gap: 0.9rem;
    margin-top: 1.55rem;
  }
}

@media not all and (min-width: 64.0625rem){
  .hero-stage,
  [dir="rtl"] .hero-stage{
    grid-template-columns: minmax(0, 1fr);
  }

  .hero-copy{
    width: min(78vw, 44rem);
  }

  .glass-box{
    padding: clamp(1.5rem, 3vw, 2.2rem);
  }

  [dir="rtl"] .hero-copy{
    grid-column: 1 / -1;
  }
}

@media (max-width: 47.99rem){
  .hero,
  .hero-stage,
  [dir="rtl"] .hero-stage{
    min-height: 100dvh;
  }

  .hero-media img{
    object-position: 42% center;
    filter: saturate(1.1) contrast(1.08) brightness(0.68);
  }

  .hero-shade,
  [dir="rtl"] .hero-shade{
    background: rgb(3 14 30 / 0.42);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage{
    align-items: end;
    padding-block: calc(var(--header-height) + 1rem) 2.5rem;
  }

  .hero-copy{
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding: 0;
    border-radius: 0;
    background: transparent;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .glass-box{
    -webkit-backdrop-filter: blur(24px) saturate(85%) brightness(94%) contrast(102%);
    backdrop-filter: blur(24px) saturate(85%) brightness(94%) contrast(102%);
    padding: clamp(1.2rem, 5vw, 1.5rem);
  }

  /*
   * Reserve the tallest expected mobile hero surface before fonts and motion
   * settle. This is a minimum, not a fixed height: longer copy may still
   * grow naturally without being clipped. The values are intentionally
   * stepped for the audited 320/360/390/412px viewport family.
  */
  section#top .glass-box{
    min-height: 31rem;
    min-block-size: 31rem;
  }

  /* A narrower viewport wraps the Persian title and lead more aggressively. */
  section#top .hero-lead{
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  @media (max-width: 24.375rem){
    section#top .glass-box{
      min-height: 32rem;
      min-block-size: 32rem;
    }
  }

  @media (max-width: 22.5rem){
    section#top .glass-box{
      min-height: 32rem;
      min-block-size: 32rem;
    }
  }

  @media (max-width: 20rem){
    section#top .glass-box{
      min-height: 33rem;
      min-block-size: 33rem;
    }
  }


  html[lang="fa"] .hero h1{
    max-width: 19ch;
  }

  .hero-lead{
    margin-top: 0.9rem;
    line-height: 1.8;
    text-align: right;
    text-align-last: auto;
  }

  .hero-actions{
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-top: 1.15rem;
  }

  .hero .button{
    min-width: 0;
    padding-inline: 0.8rem;
  }

  .v7-visual-caption{
    display: none;
  }
}

/* Keep the complete hero legible on common 1366x768 and other short desktop viewports. */
@media (min-width: 48rem) and (max-height: 50rem){
  .hero {
    min-height: max(37rem, 100svh);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage {
    padding-block: calc(var(--header-height) + 0.5rem) 2.25rem;
  }

  .hero-copy {
    width: min(47vw, 46rem);
  }

  .glass-box {
    padding: clamp(1.5rem, 2.2vw, 2.3rem) clamp(1.7rem, 2.5vw, 3rem);
  }

  .hero .kicker {
    margin-bottom: 0.65rem;
  }


  .hero-lead {
    margin-top: 0.75rem;
    line-height: 1.7;
  }

  .hero-actions {
    margin-top: 1rem;
  }

  .hero .button {
    min-height: 2.8rem;
  }
}

/* Give short non-mobile screens the same generous reading width as desktop. */
@media (min-width: 48rem) and (max-width: 64rem) and (max-height: 50rem){
  .hero-copy {
    width: min(78vw, 44rem);
  }

  .glass-box {
    padding: clamp(1.45rem, 2.8vw, 2.15rem);
  }

  .hero-lead {
    max-width: none;
    line-height: 1.85;
  }

  .hero-actions {
    width: min(100%, 29rem);
    margin-top: 1.2rem;
  }
}

@media (prefers-reduced-transparency: reduce){
  .glass-box{
    background: rgb(24 30 42 / 0.94);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}

@media (prefers-reduced-motion: reduce){
  .glass-box{
    transform: none !important;
    transition: none !important;
  }

}

/* Source: hero particles — canvas implementation aligned with the reference slider add-on. */

.hero-particles{
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  visibility: hidden;
  opacity: 0;
  mix-blend-mode: screen;
  transition: opacity 180ms ease;
}

.hero[data-hero-particles-active="true"] .hero-particles{
  visibility: visible;
  opacity: 0.9;
}

@media (prefers-reduced-motion: reduce){
  .hero-particles{
    transition: none;
  }
}

/* Shared scale for the four primary content headings requested by the page brief. */
:root{
  --slc-content-title-size: clamp(1.875rem, 3.2vw, 3rem);
}

/* Compact inquiry flow: keep the first decision small and defer optional cargo detail. */
.inquiry-form{
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
  padding: clamp(1.15rem, 2.3vw, 2.25rem);
}

@media (max-width: 47.99rem){
  .inquiry-form{
    gap: 0.85rem;
    padding: 1rem;
  }
}

@keyframes inquiry-step-enter{
  from{
    opacity: 0;
    transform: translateY(0.35rem);
  }

  to{
    opacity: 1;
    transform: translateY(0);
  }
}


/* ========================================================================== */
/* Source: assets/css/slc-smooth-scroll.css */
/* ========================================================================== */

/* ScrollSmoother owns the fixed wrapper only after motion is initialized. */
#smooth-wrapper,
#smooth-content {
  width: 100%;
}

/* Preserve a normal document flow when reduced motion is requested. */
@media (prefers-reduced-motion: reduce) {
  #smooth-wrapper {
    position: relative;
    width: 100%;
    height: auto;
    overflow: visible;
  }

  #smooth-content {
    width: 100%;
    transform: none !important;
    will-change: auto !important;
  }
}


/* ========================================================================== */
/* Source: assets/vendor/mdi/css/materialdesignicons-subset.css */
/* ========================================================================== */

/* SLC home icon subset. Keep this list aligned with the MDI classes used by index.html. */
@font-face{font-family:"Material Design Icons";src:url("../vendor/mdi/fonts/materialdesignicons-webfont-subset.woff2?v=20260911-main-nav-icons-1") format("woff2"),url("../vendor/mdi/fonts/materialdesignicons-webfont.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}.mdi:before,.mdi-set{display:inline-block;inline-size:1em;font:normal normal normal 24px/1 "Material Design Icons";font-size:inherit;text-align:center;text-rendering:auto;line-height:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.mdi-account-tie-voice-outline::before{content:"\F1309"}.mdi-boom-gate-outline::before{content:"\F0E8B"}.mdi-calendar-star-outline::before{content:"\F1B53"}.mdi-clipboard-text-search-outline::before{content:"\F1623"}.mdi-email-outline::before{content:"\F01F0"}.mdi-file-document-check-outline::before{content:"\F1A9A"}.mdi-flag-checkered::before{content:"\F023C"}.mdi-home-outline::before{content:"\F06A1"}.mdi-map-marker-outline::before{content:"\F07D9"}.mdi-map-marker-path::before{content:"\F0D20"}.mdi-office-building-outline::before{content:"\F151F"}.mdi-phone-outline::before{content:"\F0DF0"}.mdi-progress-clock::before{content:"\F0996"}.mdi-routes::before{content:"\F046A"}.mdi-swap-horizontal-bold::before{content:"\F0BCD"}.mdi-timeline-check-outline::before{content:"\F1533"}.mdi-train-car-centerbeam-full::before{content:"\F1B33"}.mdi-train-car-intermodal::before{content:"\F1B3D"}.mdi-train-variant::before{content:"\F08C4"}.mdi-transit-connection-variant::before{content:"\F0D3D"}.mdi-truck-delivery-outline::before{content:"\F129B"}


/* ========================================================================== */
/* Source: assets/css/slc-critical-fonts.css */
/* ========================================================================== */

/*
 * Fonts consumed above the fold.
 *
 * Keep only faces with a verified Hero/header consumer here. Module-only font
 * faces belong beside their lazy module so they do not extend the critical path.
 */

@font-face {
  font-family: "SLC Univia Pro";
  src: url("../fonts/customer-testimonials/UniviaPro-Regular-subset.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  unicode-range: U+0020-007E,U+00A9,U+00B7,U+041F-0420,U+0430-0432,U+0434-0435,U+0437-043A,U+043D-0443,U+0445,U+044B,U+044E-044F,U+2013-2014,U+2022,U+2026,U+2190,U+2192,U+2194;
}

@font-face {
  font-family: "PeydaWeb";
  src: url("../fonts/credentials/PeydaWeb-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}


/* ========================================================================== */
/* Source: styles-site-initial-common.css */
/* ========================================================================== */

/* Authoritative initial CSS: shared globals and initial-page states.
   Paired below-page component rules live in styles-site-common.css.
   Both sources stay at project root so relative asset URLs are unchanged. */



/* ========================================================================== */
/* Source: styles-menu.css */
/* ========================================================================== */

/*
 * WebPort-inspired icon menu, adapted for SLC.
 * Kept in a separate layer so the existing bilingual header and mobile
 * navigation behavior remain intact.
 */

:root{
  --header-height: 0rem;
}

/*
 * The reference composition places both elements inside the hero:
 * the yellow identity tab on the reading side and the icon menu opposite it.
 */

.hero-utility{
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  z-index: calc(var(--z-content) + 2);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  direction: ltr;
  pointer-events: none;
}

[dir="rtl"] .hero-utility{
  direction: rtl;
}

.hero-utility > *{
  pointer-events: auto;
}

#logo{
  position: relative;
  width: 230px;
  height: 116px;
  flex: 0 0 230px;
  overflow: visible;
  border: 0;
  line-height: 1;
}

.header-promocode-button{
  position: relative;
  isolation: isolate;
  display: block;
  width: 230px;
  height: 108px;
  overflow: visible;
  padding: 8px 10px 14px;
  background: transparent;
  filter: none;
  color: #1c1c1c;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  transform-origin: top center;
  animation: slc-logo-drop 2s ease both;
}

.header-logo-tab-shape{
  position: absolute;
  z-index: 2;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.header-promocode-button::before,
.header-promocode-button::after{
  position: absolute;
  width: auto;
  inset: 0;
  content: "";
  -webkit-mask-image: var(--logo-tab-mask);
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-image: var(--logo-tab-mask);
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: 100% 100%;
  pointer-events: none;
}

.header-promocode-button::before{
  z-index: 0;
  background:
    radial-gradient(circle at 82% 12%, rgb(116 184 255 / 0.18), transparent 72%),
    linear-gradient(82deg, rgb(14 38 68 / 0.28), rgb(255 255 255 / 0.05)),
    rgb(255 255 255 / 0.03);
  -webkit-backdrop-filter: blur(6px) saturate(85%) brightness(86%) contrast(112%);
  backdrop-filter: blur(6px) saturate(85%) brightness(86%) contrast(112%);
}

.header-promocode-button::after{
  z-index: 1;
  display: block;
  background-image:
    radial-gradient(44% 90% at 19.5% -8%, rgb(255 255 255 / 0.24), transparent 58%),
    radial-gradient(80% 110% at 100% 100%, rgb(116 184 255 / 0.1), transparent 60%),
    url("data:image/svg+xml,%3Csvg%20viewBox='0%200%20180%20180'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='.92'%20numOctaves='3'%20stitchTiles='stitch'/%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23n)'%20opacity='.025'/%3E%3C/svg%3E");
  background-size: auto, auto, 150px 150px;
  background-blend-mode: screen, normal, soft-light;
  transform: none;
  animation: none;
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))){
  .header-promocode-button::before{
    background:
      radial-gradient(circle at 82% 12%, rgb(116 184 255 / 0.14), transparent 72%),
      rgb(24 30 42 / 0.9);
  }
}

#logobobble,
#logoslogan{
  z-index: 3;
}

#logobobble{
  position: relative;
  display: block;
  width: 210px;
  height: 52px;
  margin: 5px auto 0;
  animation: slc-logo-fade 1.2s linear both;
}

#logoshine,
#logoshine_canvas{
  position: absolute;
  inset: 0;
  display: block;
  width: 210px;
  height: 52px;
}

#logoshine{
  object-fit: contain;
}

#logoshine_canvas{
  opacity: 0;
  transition: opacity 220ms ease;
}

#logobobble.is-canvas-ready #logoshine_canvas{
  opacity: 1;
}

#logobobble.is-canvas-ready #logoshine{
  opacity: 0;
}

#logoslogan{
  position: relative;
  display: block;
  max-width: 202px;
  margin: 1px auto 0;
  direction: ltr;
  color: #fff;
  font-family: "SLC Univia Pro", "Segoe UI", Arial, sans-serif;
  font-size: 0.78rem;
  font-weight: 400;
  letter-spacing: 0.035em;
  line-height: 1.05;
  text-align: center;
  opacity: 0;
}

.logosloganfadeInUp{
  animation: slc-logo-slogan 1s ease-out 1.8s both;
}

@keyframes slc-logo-drop{
  0%{
    opacity: 0;
    transform: translateY(-160%);
  }
  68%{
    opacity: 1;
    transform: translateY(0);
  }
  84%{
    transform: translateY(-7px);
  }
  100%{
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slc-logo-fade{
  from{
    opacity: 0;
  }
  to{
    opacity: 1;
  }
}

@keyframes slc-logo-slogan{
  from{
    opacity: 0;
    transform: translateY(0.55rem);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slc-frame-shine{
  0%,
  18%{
    transform: translateX(-180%) skewX(-12deg);
  }
  52%,
  100%{
    transform: translateX(380%) skewX(-12deg);
  }
}

.v7-rail-lighting{
  z-index: calc(var(--z-content) + 3);
}

.hero-stage{
  padding-block-start: 8.25rem;
}

.hero-menu-button{
  display: none;
}

#main-menu{
  position: relative;
  grid-column: auto;
  align-self: start;
  direction: ltr;
  margin-block-start: 0.8rem;
}

@media (min-width: 64.0625rem){
  #main-menu{
    /* Give the left-side navigation more breathing room while preserving a safe edge. */
    --main-menu-gutter: max(1rem, min(2.5rem, 2.5vw), calc((100vw - 86.25rem) / 2));
    transform: translate3d(max(-6rem, calc(0.5rem - var(--main-menu-gutter))), 0, 0);
  }
}

#main-menu .menu-navigation,
#main-menu .menuUL{
  min-width: 0;
}

#main-menu .menuUL{
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 0.45rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

#main-menu .menuUL li{
  display: block;
  min-width: 0;
  text-align: center;
  visibility: visible;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#main-menu .menuUL .nav-link{
  position: relative;
  display: flex;
  width: clamp(5.5rem, 7.8vw, 7rem);
  height: clamp(6.1rem, 8.65vw, 7.75rem);
  min-height: clamp(6.1rem, 8.65vw, 7.75rem);
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  overflow: hidden;
  padding: clamp(0.7rem, 0.95vw, 0.85rem) 0.4rem 0.45rem;
  border: 2px solid rgb(215 215 215 / 0.18);
  border-radius: 0.25rem;
  background: rgb(255 255 255 / 0.085);
  box-shadow:
    0 0 1px rgb(255 255 255 / 0.4),
    inset 0 3px 5px rgb(0 0 0 / 0.05),
    0 2px 8px rgb(0 0 0 / 0.02),
    inset 0 1px 20px rgb(255 255 255 / 0.16),
    inset 0 -15px 30px rgb(0 0 0 / 0.05),
    0 4px 10px rgb(0 0 0 / 0.1);
  color: rgb(249 249 249 / 0.96);
  font-weight: 700;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  text-shadow:
    -1px -1px 0 #5f6a76,
    1px -1px 0 #5f6a76,
    -1px 1px 0 #5f6a76,
    1px 1px 0 #5f6a76;
  user-select: none;
  transform: translateZ(0);
  transition:
    color 200ms linear,
    background-color 200ms linear,
    border-color 420ms cubic-bezier(0.2, 0.8, 0.2, 1),
    height 220ms ease,
    transform 220ms ease,
    opacity 300ms ease;
}

#main-menu .menuUL .nav-link::after{
  display: none;
}

#main-menu .icon,
#main-menu .menu-title{
  display: block;
}

#main-menu .icon{
  padding-top: 0;
  transition: margin 300ms ease;
}

#main-menu .icon-contact{
  position: relative;
  display: inline-grid;
  width: clamp(3rem, 4.25vw, 3.85rem);
  height: clamp(3rem, 4.25vw, 3.85rem);
  margin: 0 auto;
  place-items: center;
  border-radius: 50%;
  background: rgb(255 255 255 / 0.1);
  box-shadow: 0 0 0 1.9rem transparent;
  line-height: 1;
  transform: translate3d(0, 0, 0);
  transition: box-shadow 450ms ease-in-out;
}

/* Home decoration: shared circle/active styles above remain the visual owner. */
#main-menu .menu-item-home .home-orb-host {
  display: none;
  pointer-events: none;
}

#main-menu .menu-item-home .home-orb-slot::before {
  /* Retain a nonempty line box, without a house glyph in the desktop slot. */
  content: "\00a0";
  visibility: hidden;
}

@media not all and (min-width: 64.0625rem) {
  #main-menu .menu-item-home .home-orb-slot::before {
    content: "\F06A1";
    visibility: visible;
  }
}

/* Match the main menu's desktop boundary; tablet continues to use its house icon. */
@media (min-width: 64.0625rem) {
  /* The circle and active/hover rules remain owned by the original menu CSS. */
  #main-menu .menu-item-home .home-orb-slot[data-orb-ready] > .home-orb-host {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 45px;
    height: 45px;
    color: #fff;
    transform: translate(-50%, -50%);
  }
}

#main-menu .menu-title{
  max-width: 100%;
  margin-top: 0.55rem;
  overflow: hidden;
  font-family: "IRANYekanX", "SLC IRANYekanX Fallback", "IRANSansX", "SLC IRANSansX Fallback", Tahoma, Arial, sans-serif;
  font-size: clamp(0.82rem, 1.05vw, 0.95rem);
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: margin 420ms ease;
}

html[lang="fa"] #main-menu .menu-title{
  direction: rtl;
}

@media (hover: hover) and (pointer: fine){
  #main-menu .menuUL:hover .nav-link{
    opacity: 0.42;
  }

  #main-menu .menuUL .nav-link:hover,
  #main-menu .menuUL .nav-link:focus-visible,
  #main-menu .menuUL .nav-link.is-active{
    height: clamp(6.5rem, 9.1vw, 8.2rem);
    border-color: rgb(215 215 215 / 0.42);
    background: rgb(255 255 255 / 0.22);
    color: #fff;
    opacity: 1;
    transform: translateY(0.15rem);
  }

  #main-menu .menuUL .nav-link:hover .menu-title,
  #main-menu .menuUL .nav-link:focus-visible .menu-title{
    margin-top: 0.52rem;
    text-shadow: none;
  }

  #main-menu .menuUL .nav-link:hover .icon-contact,
  #main-menu .menuUL .nav-link:focus-visible .icon-contact,
  #main-menu .menuUL .nav-link.is-active .icon-contact{
    box-shadow: 0 0 3px 2px rgb(255 255 255 / 0.22);
  }
}

#main-menu .menuUL .nav-link:focus-visible{
  outline: 2px solid #fff;
  outline-offset: 2px;
}

#main-menu .clearfix{
  display: none;
}
/* Main navigation surfaces, ported from the selected and audited concept10.
   This source owns only new surfaces; original card/ring/hero motion stays above. */

body[data-slc-menu="ready"], .slc-menu-source {
  --slc-menu-text: #f5f8fa;
  --slc-menu-muted: #d2e0e7;
  --slc-menu-line: rgb(215 230 240 / .24);
  --slc-menu-surface: rgb(27 43 56 / .68);
  --slc-menu-hover: rgb(255 255 255 / .13);
  --slc-menu-focus: #f0d18b;
  --slc-menu-radius: .35rem;
  --slc-menu-gap: 13px;
  --slc-menu-gutter: 18px;
}
/* Document-owned native fallback: outside the transformed smooth wrapper.
   Closed disclosure and enhanced hidden state never occupy hero layout space. */
.slc-menu-source {
  --slc-menu-surface: rgb(27 43 56);
  position: fixed; inset-inline-end: 1rem; bottom: 1rem; z-index: 29;
  box-sizing: border-box; max-inline-size: calc(100vw - 2rem);
  max-block-size: calc(100dvh - 2rem); overflow: auto; overscroll-behavior: contain;
  border: 1px solid var(--slc-menu-line); border-radius: var(--slc-menu-radius);
  background: var(--slc-menu-surface); color: var(--slc-menu-text);
  font-family: "IRANYekanX", "SLC IRANYekanX Fallback", sans-serif;
  font-size: .875rem; line-height: 1.9; direction: rtl; text-align: start;
}
.slc-menu-source[hidden] { display: none !important; }
.slc-menu-source[open] { inline-size: min(28rem, calc(100vw - 2rem)); }
.slc-menu-source > summary { min-block-size: 44px; padding: .6rem 1rem; cursor: pointer; }
.slc-menu-source > nav { padding: 0 1rem 1rem; }
.slc-menu-source [data-menu-group] + [data-menu-group] { border-block-start: 1px solid var(--slc-menu-line); margin-block-start: 1rem; }
.slc-menu-source h2 { font-size: 1rem; margin-block: .7rem .4rem; }
.slc-menu-source h3 { font-size: .9rem; margin-block: .5rem .25rem; }
.slc-menu-source a { display: inline-block; padding-block: .3rem; color: var(--slc-menu-text); text-decoration: underline; text-underline-offset: .2em; }
.slc-menu-source a:focus-visible, .slc-menu-source > summary:focus-visible { outline: 2px solid var(--slc-menu-focus); outline-offset: -2px; }
.slc-menu-source p { margin-block: .4rem; color: var(--slc-menu-muted); }
.slc-menu-source [data-menu-items] { list-style: none; padding: 0; margin: 0; }
.slc-menu-source [data-menu-item] + [data-menu-item] { border-block-start: 1px solid var(--slc-menu-line); margin-block-start: .8rem; padding-block-start: .4rem; }
.slc-menu-source [data-item-facts] { padding-inline-start: 1.3rem; color: var(--slc-menu-muted); }
@media not all and (min-width: 64.0625rem) {
  /* Leave the existing no-JS primary links at the bottom available. */
  .slc-menu-source { bottom: 8rem; max-block-size: calc(100dvh - 9rem); }
}
.slc-menu-popover[hidden], .slc-menu-hero-pane[hidden] { display: none !important; }
.slc-menu-popover, .slc-menu-hero-pane { font-family: "IRANYekanX", "SLC IRANYekanX Fallback", sans-serif; }
.slc-menu-popover *, .slc-menu-hero-pane * { box-sizing: border-box; }
.slc-menu-popover button, .slc-menu-hero-pane button { font-family: inherit; cursor: pointer; color: var(--slc-menu-text); }
.slc-menu-popover .mdi, .slc-menu-hero-pane .mdi { line-height: 1; }
.slc-menu-popover button:focus-visible, .slc-menu-hero-pane button:focus-visible {
  outline: 2px solid var(--slc-menu-focus); outline-offset: 3px;
}
#main-menu[data-slc-menu-open] .nav-link:not(.is-active) { opacity: .42; }
.slc-menu-popover {
  position: absolute; top: var(--slc-menu-top); left: var(--slc-menu-left);
  width: min(345px, calc(100vw - 2 * var(--slc-menu-gutter)));
  z-index: 30; direction: rtl; color: var(--slc-menu-text); padding: 12px;
  border: 1px solid rgb(215 215 215 / .35); border-radius: var(--slc-menu-radius);
  background: linear-gradient(145deg, rgb(255 255 255 / .09), transparent 65%), var(--slc-menu-surface);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .2), 0 18px 40px rgb(0 13 24 / .23);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  max-height: calc(100dvh - var(--slc-menu-top) - 55px); overflow: auto; scrollbar-width: thin;
}
.slc-menu-popup-title {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  font-size: 13px; padding: 3px 7px 10px; margin: 0 0 6px;
  border-bottom: 1px solid var(--slc-menu-line); color: #fff;
}
.slc-menu-popup-title small { font-size: 10px; color: var(--slc-menu-muted); font-weight: 400; }
.slc-menu-choices { display: grid; gap: 3px; }
.slc-menu-choice {
  border: 1px solid transparent; background: transparent; width: 100%; display: grid;
  grid-template-columns: 27px minmax(0, 1fr) 14px; align-items: center; gap: 10px;
  padding: 10px; text-align: right; border-radius: var(--slc-menu-radius); font-size: 12px; line-height: 1.85;
  transition: background .18s, border-color .18s;
}
.slc-menu-choice:focus-visible { background: var(--slc-menu-hover); border-color: var(--slc-menu-line); }
.slc-menu-choice > i { font-size: 22px; color: #e7f1f5; text-align: center; }
.slc-menu-choice strong { display: block; font-weight: 700; }
.slc-menu-choice small { display: block; color: var(--slc-menu-muted); font-size: 10px; font-weight: 400; margin-top: 2px; }
.slc-menu-choice-arrow { font-size: 16px; color: var(--slc-menu-muted); justify-self: end; }
.slc-menu-more {
  width: 100%; margin-top: 8px; border: 0; border-top: 1px solid var(--slc-menu-line);
  padding: 12px 8px 4px; background: transparent; text-align: center; font-size: 12px;
}

/* Keep the introduction in layout so the existing glass retains its size. */
.slc-menu-intro-away { visibility: hidden; pointer-events: none; }
/* Prevent native focus-scroll inside ScrollSmoother's hidden wrapper. This is
   scoped to this demo's open hero surfaces and overrides its inline overflow. */
html[data-smooth-scroll="active"] body[data-slc-menu="ready"]:is([data-slc-menu-surface="hero"], [data-slc-menu-surface="detail"]) #smooth-wrapper {
  overflow: clip !important;
}
.slc-menu-hero-pane {
  position: absolute; inset: 0; z-index: 6; padding: clamp(18px, 2.35vw, 34px);
  display: grid; grid-template-rows: auto minmax(0, 1fr); gap: 16px; direction: rtl;
  color: var(--slc-menu-text); text-shadow: 0 1px 2px rgb(0 15 25 / .28); border-radius: inherit;
}
.slc-menu-hero-heading {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  border-bottom: 1px solid var(--slc-menu-line); padding-bottom: 13px;
}
.slc-menu-hero-pane .slc-menu-hero-heading h2 {
  font-family: "PeydaWeb", "IRANYekanX", "SLC IRANYekanX Fallback", sans-serif; color: #fff;
  font-size: clamp(20px, 1.8vw, 29px); line-height: 1.5; margin: 0 0 4px; letter-spacing: -.025em;
}
.slc-menu-hero-heading p { font-size: 11px; color: var(--slc-menu-muted); line-height: 1.9; margin: 0; }
.slc-menu-hero-pane .slc-menu-back {
  background: rgb(255 255 255 / .08); border: 1px solid var(--slc-menu-line); border-radius: var(--slc-menu-radius);
  white-space: nowrap; font-size: 11px; padding: 8px 10px; flex-shrink: 0;
}
.slc-menu-pane-content {
  min-height: 0; overflow: auto; scrollbar-width: thin; scrollbar-color: #91abb9 transparent; padding: 6px;
}
.slc-menu-pane-content:focus-visible { outline: 2px solid var(--slc-menu-focus); outline-offset: -2px; }
.slc-menu-directory { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.slc-menu-directory .slc-menu-choice {
  background: rgb(255 255 255 / .055); border-color: var(--slc-menu-line);
  padding: 12px 10px; grid-template-columns: 26px minmax(0, 1fr) 12px; min-height: 80px;
}
.slc-menu-directory .slc-menu-choice strong { font-size: 12px; }
.slc-menu-directory .slc-menu-choice small { font-size: 10px; line-height: 1.8; }
.slc-menu-detail-body { font-size: 12px; color: #e2eaf0; line-height: 2.1; margin: 0; }
.slc-menu-detail-facts { list-style: none; display: grid; gap: 8px; margin: 17px 0; padding: 0; }
.slc-menu-detail-facts li {
  padding: 8px 12px; border-inline-start: 2px solid #a8cbdc;
  background: rgb(255 255 255 / .07); font-size: 11px; color: #e6eff5;
}
@media (hover: hover) and (pointer: fine) {
  .slc-menu-choice:hover { background: var(--slc-menu-hover); border-color: var(--slc-menu-line); }
  .slc-menu-more:hover { text-decoration: underline; text-underline-offset: 4px; }
  .slc-menu-back:hover { background: var(--slc-menu-hover); }
  .slc-menu-directory .slc-menu-choice:hover { background: rgb(255 255 255 / .17); }
}
@media (max-width: 1200px) {
  .slc-menu-hero-pane { padding: 20px; gap: 12px; }
  .slc-menu-directory .slc-menu-choice { min-height: 74px; padding: 9px 8px; }
  .slc-menu-choice small { font-size: 9px; }
  .slc-menu-hero-heading p { font-size: 10px; }
}
@media (max-height: 780px) {
  .slc-menu-hero-pane { gap: 10px; }
  .slc-menu-hero-heading { padding-bottom: 10px; }
  .slc-menu-directory .slc-menu-choice { min-height: 67px; padding: 9px 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .slc-menu-popover *, .slc-menu-hero-pane * { transition: none !important; animation: none !important; }
}


html.slc-menu-mobile-open,
html.slc-menu-mobile-open body { overflow: hidden; overscroll-behavior: none; }
.slc-menu-mobile-dialog {
  --slc-menu-mobile-edge: .65rem;
  --slc-menu-mobile-space: clamp(1rem, 4vw, 1.6rem);
  --slc-menu-mobile-glass: rgb(20 36 48 / .42);
  --slc-menu-mobile-surface: rgb(27 43 56 / .22);
  --slc-menu-mobile-ease: cubic-bezier(.23, 1, .32, 1);
  position: fixed;
  inset: max(var(--slc-menu-mobile-edge), env(safe-area-inset-top)) max(var(--slc-menu-mobile-edge), env(safe-area-inset-right)) max(var(--slc-menu-mobile-edge), env(safe-area-inset-bottom)) max(var(--slc-menu-mobile-edge), env(safe-area-inset-left));
  width: auto;
  height: auto;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  box-sizing: border-box;
  border: 1px solid var(--slc-menu-line);
  border-radius: calc(var(--slc-menu-radius) * 2);
  background: linear-gradient(145deg, rgb(255 255 255 / .08), transparent 65%), var(--slc-menu-mobile-glass);
  backdrop-filter: blur(18px) saturate(115%);
  -webkit-backdrop-filter: blur(18px) saturate(115%);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / .2), 0 18px 40px rgb(0 13 24 / .23);
  color: var(--slc-menu-text);
  font-family: "IRANYekanX", "SLC IRANYekanX Fallback", sans-serif;
  direction: rtl;
  text-align: right;
  isolation: isolate;
}
.slc-menu-mobile-dialog:not([open]), .slc-menu-mobile-dialog [hidden], .slc-menu-mobile-backdrop[hidden] { display: none; }
.slc-menu-mobile-dialog[open] { display: flex; flex-direction: column; }
.slc-menu-mobile-dialog::backdrop { background: rgb(0 13 24 / .16); }
.slc-menu-mobile-dialog *, .slc-menu-mobile-dialog *::before, .slc-menu-mobile-dialog *::after { box-sizing: border-box; }
.slc-menu-mobile-dialog button { font: inherit; color: inherit; cursor: pointer; }
.slc-menu-mobile-dialog button:focus-visible, .slc-menu-mobile-heading:focus-visible { outline: 2px solid var(--slc-menu-focus); outline-offset: 3px; }
.slc-menu-mobile-header { flex: 0 0 auto; padding: .6rem var(--slc-menu-mobile-space) 1rem; border-bottom: 1px solid var(--slc-menu-line); }
.slc-menu-mobile-toolbar { min-height: 44px; display: flex; align-items: center; gap: .7rem; }
.slc-menu-mobile-control { flex-shrink: 0; border: 1px solid var(--slc-menu-line); background: transparent; border-radius: var(--slc-menu-radius); min-width: 44px; min-height: 44px; }
.slc-menu-mobile-dialog .slc-menu-mobile-back { padding: .4rem .8rem; font-size: .8rem; }
.slc-menu-mobile-back::before { content: '›'; margin-inline-end: .5rem; font-size: 1.2em; }
.slc-menu-mobile-dialog .slc-menu-mobile-close { margin-inline-start: auto; font-size: 1.7rem; line-height: 1; }
.slc-menu-mobile-breadcrumb { min-width: 0; margin: 0; font-size: .75rem; line-height: 1.8; color: var(--slc-menu-muted); overflow-wrap: anywhere; }
.slc-menu-mobile-dialog .slc-menu-mobile-heading { margin: .65rem 0 0; font-size: clamp(1.15rem, 4.5vw, 1.65rem); line-height: 1.65; font-weight: 700; overflow-wrap: anywhere; }
.slc-menu-mobile-viewport { position: relative; flex: 1 1 auto; min-height: 0; overflow: hidden; }
.slc-menu-mobile-layer { position: absolute; inset: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: 1rem var(--slc-menu-mobile-space) 1.5rem; scrollbar-width: thin; scrollbar-color: var(--slc-menu-line) transparent; }
.slc-menu-mobile-layer:focus-visible { outline: 2px solid var(--slc-menu-focus); outline-offset: -3px; }
.slc-menu-mobile-layer[aria-hidden='true'] { pointer-events: none; }
.slc-menu-mobile-intro { margin: 0 0 1rem; color: var(--slc-menu-muted); font-size: .85rem; line-height: 1.9; }
.slc-menu-mobile-list { list-style: none; padding: 0; margin: 0; display: grid; gap: .65rem; }
.slc-menu-mobile-row { width: 100%; min-height: 76px; display: grid; grid-template-columns: 46px minmax(0, 1fr) 16px; align-items: center; gap: .8rem; padding: .85rem .8rem; border: 1px solid var(--slc-menu-line); border-radius: var(--slc-menu-radius); background: linear-gradient(145deg, rgb(255 255 255 / .055), transparent 70%), var(--slc-menu-mobile-surface); text-align: right; transition: background-color 160ms var(--slc-menu-mobile-ease), border-color 160ms var(--slc-menu-mobile-ease); }
.slc-menu-mobile-icon { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--slc-menu-line); border-radius: 50%; box-shadow: inset 0 1px 0 rgb(255 255 255 / .13); background: rgb(255 255 255 / .055); font-size: 1.4rem; line-height: 1; }
.slc-menu-mobile-row-label { display: grid; gap: .2rem; min-width: 0; }
.slc-menu-mobile-row-title { font-size: .95rem; font-weight: 700; line-height: 1.8; }
.slc-menu-mobile-row-subtitle { font-size: .75rem; color: var(--slc-menu-muted); line-height: 1.8; }
.slc-menu-mobile-row-arrow { color: var(--slc-menu-muted); font-size: 1.7rem; font-weight: 400; }
.slc-menu-mobile-row:active, .slc-menu-mobile-control:active { background-color: var(--slc-menu-hover); border-color: var(--slc-menu-focus); }
.slc-menu-mobile-detail { display: grid; align-content: start; gap: 1rem; }
.slc-menu-mobile-detail > .slc-menu-mobile-icon { width: 64px; height: 64px; font-size: 2rem; margin-block: .3rem; }
.slc-menu-mobile-description { font-size: .95rem; line-height: 2.1; margin: 0; }
.slc-menu-mobile-dialog .slc-menu-mobile-section-title { font-size: .9rem; line-height: 1.8; margin: .5rem 0 0; }
.slc-menu-mobile-facts { list-style: disc outside; margin: 0; padding-inline-start: 1.3rem; color: var(--slc-menu-muted); font-size: .9rem; line-height: 2.4; }
.slc-menu-mobile-facts li::marker { color: var(--slc-menu-focus); }
.slc-menu-mobile-backdrop { position: fixed; inset: 0; z-index: 100001; background: rgb(0 13 24 / .16); }
.slc-menu-mobile-dialog.slc-menu-mobile-fallback { z-index: 100002; }
/* An opaque surface keeps the menu readable when glass is unavailable/unwanted. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .slc-menu-mobile-dialog { --slc-menu-mobile-glass: rgb(20 36 48); }
  .slc-menu-popover { --slc-menu-surface: rgb(27 43 56); }
}
@media (prefers-reduced-transparency: reduce) {
  .slc-menu-mobile-dialog { --slc-menu-mobile-glass: rgb(20 36 48); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .slc-menu-popover { --slc-menu-surface: rgb(27 43 56); backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@media (hover: hover) and (pointer: fine) {
  .slc-menu-mobile-row:hover, .slc-menu-mobile-control:hover { background-color: var(--slc-menu-hover); border-color: var(--slc-menu-focus); }
}
@media (max-height: 450px) {
  .slc-menu-mobile-header { padding-block: .35rem .6rem; }
  .slc-menu-mobile-dialog .slc-menu-mobile-heading { margin-block-start: .25rem; font-size: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .slc-menu-mobile-row, .slc-menu-mobile-control { transition: none; }
}

.slc-menu-live { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }
.slc-menu-detail-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-block: 1rem; }
.slc-menu-section-link, .slc-menu-inquiry-link { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .5rem .8rem; border: 1px solid var(--slc-menu-line); border-radius: var(--slc-menu-radius); background: var(--slc-menu-hover); color: var(--slc-menu-text); font-size: .85rem; text-decoration: none; }
.slc-menu-hero-pane a:focus-visible, .slc-menu-mobile-dialog a:focus-visible { outline: 2px solid var(--slc-menu-focus); outline-offset: 3px; }
.slc-menu-mobile-dialog a.slc-menu-mobile-row { font: inherit; color: inherit; text-decoration: none; }
.slc-menu-nojs { display: none; }
@media not all and (min-width: 64.0625rem) {
  .slc-menu-nojs { position: fixed; inset-inline: 1rem; bottom: 1rem; z-index: 30; display: flex; flex-wrap: wrap; justify-content: center; gap: .4rem; padding: .6rem; border: 1px solid rgb(215 230 240 / .24); border-radius: .35rem; background: rgb(20 36 48 / .94); }
  .slc-menu-nojs a { display: inline-flex; align-items: center; min-height: 44px; padding: .4rem .65rem; color: #f5f8fa; font-size: .85rem; text-decoration: none; }
  .slc-menu-nojs a:focus-visible { outline: 2px solid #f0d18b; outline-offset: 2px; }
}


@media not all and (min-width: 64.0625rem){
  html,
  body{
    overflow-x: clip;
  }


  .hero-utility{
    inset-block-start: 0;
    justify-content: space-between;
  }

  [dir="rtl"] .hero-utility{
    justify-content: space-between;
  }

  #logo{
    width: 184px;
    height: 91px;
    flex-basis: 184px;
  }

  .header-promocode-button{
    width: 184px;
    height: 86px;
    padding: 5px 8px 11px;
    background-size: 184px auto;
  }

  #logobobble{
    width: 168px;
    height: 42px;
  }

  #logoshine,
  #logoshine_canvas{
    width: 168px;
    height: 42px;
  }

  #logoslogan{
    max-width: 168px;
    font-size: 0.62rem;
  }

  .hero-stage{
    padding-block-start: 6.6rem;
  }

  .hero-menu-button{
    position: relative;
    z-index: calc(var(--z-menu) + 2);
    display: inline-grid;
    grid-template-columns: 1rem auto;
    grid-auto-flow: column;
    gap: 0.5rem;
    align-self: flex-start;
    margin-block-start: 0.8rem;
  }

  .hero-menu-button::before {
    position: relative;
    z-index: 2;
    width: 1rem;
    height: 2px;
    border-radius: 999px;
    background: currentColor;
    box-shadow: 0 -5px 0 currentColor, 0 5px 0 currentColor;
    content: "";
  }

  .hero-menu-button[aria-expanded="true"]::before {
    width: 1rem;
    height: 1rem;
    background:
      linear-gradient(45deg, transparent 43%, currentColor 43%, currentColor 57%, transparent 57%),
      linear-gradient(-45deg, transparent 43%, currentColor 43%, currentColor 57%, transparent 57%);
    box-shadow: none;
  }

  body.menu-open .hero-menu-button{
    position: fixed;
    inset-block-start: 0.8rem;
    inset-inline-end: max(1rem, env(safe-area-inset-right));
  }

    #main-menu{
      position: fixed;
      inset: 0;
    grid-column: auto;
    height: 100dvh;
    align-items: start;
    margin-block-start: 0;
    padding: max(6.25rem, calc(env(safe-area-inset-top) + 5.25rem)) 1rem max(1.5rem, env(safe-area-inset-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
    border: 0;
    background:
      radial-gradient(circle at 82% 8%, rgb(94 190 255 / 0.14), transparent 18rem),
      rgb(238 248 255 / 0.7);
    box-shadow: none;
  }

  #main-menu .menu-navigation{
    width: min(100%, 32rem);
    margin-inline: auto;
  }

  #main-menu .menuUL{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    width: 100%;
  }

  /* Keep Home as the visual entry point: it spans the two-column card width
     while retaining exactly the same card height as the other destinations. */
  #main-menu .menuUL .menu-item-home{
    grid-column: 1 / -1;
    order: -1;
  }

  #main-menu .menuUL .nav-link{
    width: 100%;
    height: clamp(6.2rem, 20vw, 8rem);
    min-height: clamp(6.2rem, 20vw, 8rem);
    justify-content: center;
    border: 1px solid rgb(20 91 151 / 0.2);
    border-radius: 0.45rem;
    background: rgb(255 255 255 / 0.84);
    box-shadow:
      0 10px 26px rgb(35 91 139 / 0.1),
      inset 0 1px 0 rgb(255 255 255 / 0.9);
    color: #173f63;
    text-shadow: none;
  }

  #main-menu .menuUL .nav-link:is(:focus-visible, .is-active){
    height: clamp(6.2rem, 20vw, 8rem);
    border-color: rgb(9 105 180 / 0.42);
    background: #fff;
    color: #0d4773;
    opacity: 1;
    transform: none;
  }

  #main-menu .menuUL .nav-link:focus-visible{
    outline-color: #0878c5;
  }

  #main-menu .icon-contact{
    width: 2.8rem;
    height: 2.8rem;
    background: rgb(15 112 185 / 0.09);
    box-shadow: none;
    color: #1b527d;
    font-size: 1.75rem;
  }

  #main-menu .menu-title{
    margin-top: 0.55rem;
    font-size: clamp(0.82rem, 2.8vw, 1.05rem);
  }

}

@media (max-width: 30rem){
  #logo{
    width: 140px;
    height: 71px;
    flex-basis: 140px;
  }

  .header-promocode-button{
    width: 140px;
    height: 67px;
    padding: 4px 6px 9px;
    background-size: 140px auto;
  }

  #logobobble{
    width: 128px;
    height: 32px;
  }

  #logoshine,
  #logoshine_canvas{
    width: 128px;
    height: 32px;
  }

  #logoslogan{
    max-width: 128px;
    font-size: 0.5rem;
  }

  .hero-stage{
    padding-block-start: 5.8rem;
  }

  #main-menu .menuUL{
    gap: 0.55rem;
  }

}

/*
 * Desktop hero proportions:
 * strengthen the logo tab and keep the glass panel close to its content.
 */
@media (min-width: 64.0625rem){
  #logo {
    width: 280px;
    height: 141px;
    flex-basis: 280px;
  }

  .header-promocode-button {
    width: 280px;
    height: 132px;
    padding: 10px 12px 17px;
    background-size: 280px auto;
  }

  #logobobble {
    width: 256px;
    height: 64px;
    margin-top: 5px;
  }

  #logoshine,
  #logoshine_canvas {
    width: 256px;
    height: 64px;
  }

  #logoslogan {
    max-width: 246px;
    font-size: 0.86rem;
  }

  /* Hero panel sizing belongs to styles-v7.css. */
  .hero-copy:not(.glass-box-shell) {
    width: min(48vw, 56rem);
    max-width: 56rem;
    padding: clamp(1.85rem, 3vw, 3rem);
  }
}

@media (min-width: 48rem) and (max-width: 64rem){
  .hero-copy:not(.glass-box-shell){
    width: min(86vw, 44rem);
    padding: clamp(1.75rem, 3.5vw, 2.75rem);
  }
}

@media (prefers-reduced-motion: reduce){
  .header-promocode-button,
  .header-promocode-button::after,
  #logobobble,
  .logosloganfadeInUp{
    animation: none;
  }

  #logoslogan{
    opacity: 1;
  }

  #main-menu .menuUL .nav-link,
  #main-menu .icon,
  #main-menu .icon-contact,
  #main-menu .menu-title{
    transition: none;
  }

}

@keyframes footer-experience-led-core{
  0%,
  100%{
    opacity: 1;
    filter: brightness(1);
  }

  50%{
    opacity: 0.66;
    filter: brightness(0.82);
  }
}

@keyframes footer-experience-led-inner{
  0%,
  100%{
    opacity: 1;
  }

  50%{
    opacity: 0.48;
  }
}

@keyframes footer-experience-led-outer{
  0%,
  100%{
    opacity: 0.94;
  }

  50%{
    opacity: 0.36;
  }
}


/* ========================================================================== */
/* Source: styles-type-scale.css */
/* ========================================================================== */

/*
 * Final typography scale
 * Keeps the visual hierarchy consistent across the versioned section styles.
 */

:root{
    --type-section: clamp(2.35rem, 3.15vw, 3.65rem);
    --type-section-compact: clamp(2.15rem, 2.75vw, 3.2rem);
    --type-group: clamp(1.5rem, 1.8vw, 2rem);
}

/* Primary section headings */
.briefing-intro .section-title{
    font-size: var(--type-section);
    line-height: 1.28;
    letter-spacing: -0.025em;
}

/* Longer headings need a slightly quieter scale to preserve readable line lengths. */
.inquiry-copy .section-title{
    max-width: 19ch;
    font-size: var(--type-section-compact);
    line-height: 1.32;
    letter-spacing: -0.02em;
}


/* Responsive section typography */
@media not all and (min-width: 64.0625rem){
    :root {
        --type-section: clamp(2.25rem, 4.8vw, 3.25rem);
        --type-section-compact: clamp(2.1rem, 4.5vw, 3rem);
    }

}

@media (max-width: 47.99rem){
    :root{
        --type-section: clamp(2rem, 8vw, 2.65rem);
        --type-section-compact: clamp(1.95rem, 7.6vw, 2.55rem);
        --type-group: clamp(1.4rem, 5.8vw, 1.8rem);
    }


}

/* ========================================================================== */
/* Source: styles-icons.css */
/* ========================================================================== */

/*
 * Central MDI icon helper
 * Icons are decorative unless the surrounding control supplies an accessible name.
 */

.app-icon{
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  color: inherit;
  font-style: normal;
  line-height: 1;
  vertical-align: -0.125em;
}

.app-icon::before{
  display: block;
  font-size: inherit;
  line-height: 1;
}

.app-icon--menu{
  font-size: clamp(1.65rem, 2.2vw, 2rem);
}


.app-icon--feature,
.app-icon--card{
  position: relative;
  z-index: 2;
  margin-block-end: 0.85rem;
}

.app-icon--feature{
  color: #ffffff;
  font-size: clamp(2rem, 2.3vw, 2.35rem);
}

.app-icon--card{
  color: var(--signal-strong);
  font-size: clamp(1.6rem, 1.8vw, 1.85rem);
}

.app-icon--step{
  margin-block-end: 0.65rem;
  color: var(--signal-strong);
  font-size: 1.45rem;
}

.app-icon--button{
  font-size: 1.2rem;
}

.app-icon--contact{
  font-size: 1.22rem;
}

.app-icon--social{
  font-size: 0.95rem;
}

html[dir="rtl"] .app-icon--button{
  transform: none;
}

@media (max-width: 47.99rem){
  .app-icon--menu{
    font-size: 1.55rem;
  }


  .app-icon--feature{
    font-size: 2rem;
  }
}


/* ========================================================================== */
/* Source: styles-reference-inspirations.css */
/* ========================================================================== */

/*
 * Reference-informed type treatments.
 * Adapted for Sahand Logistics rather than copied from template demos.
 */

/* Hero: overlapping outlined and solid titles, adapted from the supplied demo. */

.hero-dual-title{
  width: 100%;
  overflow: visible;
}

.hero .hero-outline-kicker{
  width: 100%;
  max-width: 100%;
  margin: 0;
  line-height: 1;
}

.hero-outline-word{
  display: block;
}

.hero-outline-word{
  color: rgb(37 184 255 / 0.65);
  font-size: clamp(3.35rem, 4.5vw, 3.75rem);
  font-weight: 900;
  line-height: 1;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: 1px currentColor;
  paint-order: stroke fill;
  text-shadow: none;
}

.hero-dual-title > #hero-title{
  position: relative;
  z-index: 1;
  margin-top: 0;
}

@media (max-width: 47.99rem){
  .hero-outline-word{
    font-size: clamp(2.35rem, 10vw, 3rem);
  }

  .hero-dual-title > #hero-title{
    margin-top: 0;
  }

}

@media (prefers-reduced-motion: reduce){
  .hero .hero-outline-kicker{
    transform: none !important;
  }
}

/* ========================================================================== */
/* Mobile Hero composition — scoped strictly below the 768px boundary. */
/* ========================================================================== */

@media (max-width: 47.99rem){
  .hero,
  .hero-stage,
  [dir="rtl"] .hero-stage {
    min-height: clamp(42rem, 88svh, 48rem);
  }

  .hero-utility {
    inset-block-start: env(safe-area-inset-top);
    width: min(calc(100% - 2rem), 45rem);
    align-items: flex-start;
  }

  #logo {
    width: 132px;
    height: 58px;
    flex-basis: 132px;
  }

  .header-promocode-button {
    isolation: isolate;
    display: grid;
    width: 132px;
    height: 52px;
    place-items: center;
    margin-block-start: 0.55rem;
    padding: 0.65rem 0.75rem;
    overflow: hidden;
    border: 1px solid rgb(255 255 255 / 0.2);
    border-radius: 3px;
    background: rgb(255 255 255 / 0.04);
    box-shadow:
      0 1.125rem 2.625rem rgb(0 0 0 / 0.28),
      inset 0 1px 0 rgb(255 255 255 / 0.13),
      inset 0 -0.75rem 1.5rem rgb(0 0 0 / 0.1);
    color: #f3f8fc;
    -webkit-backdrop-filter: blur(10px) saturate(88%) brightness(83%) contrast(103%);
    backdrop-filter: blur(10px) saturate(88%) brightness(83%) contrast(103%);
    animation: slc-logo-fade 420ms ease-out both;
  }

  .header-logo-tab-shape {
    display: none;
  }

  #logobobble {
    width: 108px;
    height: 27px;
    margin: 0;
    animation: none;
  }

  #logoshine,
  #logoshine_canvas {
    width: 108px;
    height: 27px;
  }

  #logobobble.is-canvas-ready #logoshine {
    opacity: 1;
  }

  #logobobble.is-canvas-ready #logoshine_canvas {
    opacity: 0;
  }

  #logoslogan {
    display: none;
  }

  .hero-menu-button {
    isolation: isolate;
    overflow: hidden;
    grid-template-columns: 1rem auto;
    grid-auto-flow: column;
    gap: 0.5rem;
    min-width: 4.75rem;
    min-height: 3rem;
    margin-block-start: 0.55rem;
    padding-inline: 0.85rem;
    border-color: rgb(255 255 255 / 0.2);
    border-radius: 3px;
    background: rgb(255 255 255 / 0.04);
    box-shadow:
      0 1.125rem 2.625rem rgb(0 0 0 / 0.28),
      inset 0 1px 0 rgb(255 255 255 / 0.13),
      inset 0 -0.75rem 1.5rem rgb(0 0 0 / 0.1);
    color: #f3f8fc;
    -webkit-backdrop-filter: blur(10px) saturate(88%) brightness(83%) contrast(103%);
    backdrop-filter: blur(10px) saturate(88%) brightness(83%) contrast(103%);
  }

  .hero-menu-button::after {
    position: absolute;
    z-index: 0;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
    background-size: 150px 150px;
    mix-blend-mode: soft-light;
    opacity: 0.015;
    content: "";
    pointer-events: none;
  }

  .hero-menu-button > span {
    position: relative;
    z-index: 2;
  }

  body.menu-open .hero-menu-button {
    inset-block-start: max(0.55rem, env(safe-area-inset-top));
  }

  .hero-media img {
    object-position: 48% center;
  }

  .hero-shade,
  [dir="rtl"] .hero-shade {
    background:
      linear-gradient(180deg, rgb(3 14 30 / 0.5), rgb(3 14 30 / 0.2) 38%, rgb(3 14 30 / 0.52)),
      rgb(3 14 30 / 0.18);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage {
    width: min(calc(100% - 2rem), 45rem);
    align-content: center;
    align-items: center;
    padding-block: max(5rem, calc(env(safe-area-inset-top) + 4.5rem)) max(1.5rem, env(safe-area-inset-bottom));
  }

  .glass-box {
    padding: clamp(1.15rem, 4.8vw, 1.35rem);
    border-radius: 0.75rem;
    background: rgb(8 25 45 / 0.3);
  }

  .hero h1,
  html[lang="fa"] .hero h1 {
    line-height: 1.28;
  }

  .hero-actions {
    gap: 0.65rem;
    margin-top: 1rem;
  }

  .hero .button {
    min-height: 3rem;
  }
}

@media (max-width: 47.99rem) and (orientation: landscape){
  .hero,
  .hero-stage,
  [dir="rtl"] .hero-stage{
    min-height: 36rem;
  }
}

@media (max-width: 47.99rem) and (prefers-reduced-transparency: reduce){
  .header-promocode-button{
    background: transparent;
  }

  .header-promocode-button::before,
  .hero-menu-button{
    background: rgb(24 30 42 / 0.94);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* Pause CSS motion owned by elements outside the viewport. Canvas/RAF loops
   use their own visibility gates in JavaScript. */
html.slc-motion-policy-ready .slc-motion-offscreen,
html.slc-motion-policy-ready .slc-motion-offscreen::before,
html.slc-motion-policy-ready .slc-motion-offscreen::after{
  animation-play-state: paused !important;
}

/* Increase only the two hero CTA labels by exactly 5%. */
.hero .button{
  font-size: 0.903rem;
}

@media (max-width: 47.99rem){
  .hero .button{
    font-size: 0.819rem;
  }
}


/* ========================================================================== */
/* Source: assets/css/header-logo-glass-v1.2.2.css */
/* ========================================================================== */

/* Header logo frame — Glass V1.2.2 production integration */
.header-promocode-button {
  --logo-glass-color: #4e8abe;
  --logo-glass-color-light: #8fb8dc;
  --logo-glass-color-lighter: #c5d9eb;
  --logo-glass-color-dark: #315777;
  --logo-glass-color-darker: #1e3a53;
  --logo-glass-color-deep: #10283d;
  --logo-glass-tint-strength: 1;
  --logo-glass-surface-opacity: 0.60;
  --logo-glass-blur: 6px;
  --logo-glass-saturation: 170%;
  --logo-glass-brightness: 92%;
  --logo-glass-contrast: 108%;
  --logo-glass-rim-strength: 0.88;
  --logo-glass-specular-strength: 1;
  --logo-glass-shadow-strength: 1;
  --logo-glass-fallback-alpha: 0.08;
  --logo-glass-fallback-alpha-no-blur: 0.62;
  --logo-slogan-drop: clamp(6px, 0.7vw, 9px);
  container-type: inline-size;
  padding-inline: 0;
}

@supports (color: color-mix(in oklab, red, blue)) {
  .header-promocode-button {
    --logo-glass-color-light: color-mix(in oklab, var(--logo-glass-color) 44%, white);
    --logo-glass-color-lighter: color-mix(in oklab, var(--logo-glass-color) 24%, white);
    --logo-glass-color-dark: color-mix(in oklab, var(--logo-glass-color) 58%, #06111d);
    --logo-glass-color-darker: color-mix(in oklab, var(--logo-glass-color) 35%, #06111d);
    --logo-glass-color-deep: color-mix(in oklab, var(--logo-glass-color) 20%, #020912);
  }
}

.header-promocode-button::before,
.header-promocode-button::after {
  content: none;
}

.header-logo-frame__fallback-base {
  fill: var(--logo-glass-color-dark);
  fill-opacity: clamp(0, var(--logo-glass-fallback-alpha), 1);
}

/* Composite the entire face together; the rim, logo and reveal stay independent. */
.header-logo-frame__surface-group {
  opacity: clamp(0, var(--logo-glass-surface-opacity), 1);
}

.header-logo-glass-surface {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: rgb(255 255 255 / 0.065);
  -webkit-backdrop-filter:
    blur(var(--logo-glass-blur))
    saturate(var(--logo-glass-saturation))
    brightness(var(--logo-glass-brightness))
    contrast(var(--logo-glass-contrast));
  backdrop-filter:
    blur(var(--logo-glass-blur))
    saturate(var(--logo-glass-saturation))
    brightness(var(--logo-glass-brightness))
    contrast(var(--logo-glass-contrast));
}

.header-logo-glass-surface > span {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.header-logo-glass-surface__ambient {
  background:
    radial-gradient(circle at 82% 12%, color-mix(in oklab, var(--logo-glass-color-light) 21%, transparent), transparent 71%),
    linear-gradient(49deg, color-mix(in oklab, var(--logo-glass-color) 17%, transparent), rgb(255 255 255 / 0.03) 52%, transparent);
}

.header-logo-glass-surface__specular {
  background:
    radial-gradient(44% 90% at 17.75% -8%, rgb(255 255 255 / 0.20), transparent 58%),
    radial-gradient(80% 110% at 100% 100%, color-mix(in oklab, var(--logo-glass-color-light) 13%, transparent), transparent 60%);
  opacity: clamp(0, var(--logo-glass-specular-strength), 1);
}

.header-logo-glass-surface__inner-shadow {
  background: linear-gradient(180deg, rgb(255 255 255 / 0.09), rgb(255 255 255 / 0.03) 20%, rgb(3 10 18 / 0.02) 56%, rgb(3 10 18 / 0.18));
}

/* Lift the frame tint without fading the logo, rim or reveal animation. */
.logo-glass-stop--tint-1 { stop-color: var(--logo-glass-color-lighter); stop-opacity: 0.14; }
.logo-glass-stop--tint-2 { stop-color: var(--logo-glass-color-light); stop-opacity: 0.09; }
.logo-glass-stop--tint-3 { stop-color: var(--logo-glass-color); stop-opacity: 0.22; }
.logo-glass-stop--tint-4 { stop-color: var(--logo-glass-color-dark); stop-opacity: 0.36; }
.logo-glass-stop--highlight-1 { stop-color: white; stop-opacity: 0.46; }
.logo-glass-stop--highlight-2 { stop-color: white; stop-opacity: 0.16; }
.logo-glass-stop--highlight-3 { stop-color: var(--logo-glass-color-lighter); stop-opacity: 0.10; }
.logo-glass-stop--glow-1 { stop-color: var(--logo-glass-color-lighter); stop-opacity: 0.28; }
.logo-glass-stop--glow-2 { stop-color: var(--logo-glass-color-light); stop-opacity: 0.16; }
.logo-glass-stop--glow-3 { stop-color: var(--logo-glass-color-dark); stop-opacity: 0.06; }
.logo-glass-stop--transparent { stop-color: transparent; stop-opacity: 0; }
.logo-glass-stop--inner-1 { stop-color: white; stop-opacity: 0.08; }
.logo-glass-stop--inner-2 { stop-color: white; stop-opacity: 0.02; }
.logo-glass-stop--inner-3 { stop-color: var(--logo-glass-color-deep); stop-opacity: 0.04; }
.logo-glass-stop--inner-4 { stop-color: var(--logo-glass-color-deep); stop-opacity: 0.18; }

.header-logo-glass-layer--highlight { opacity: calc(0.84 * var(--logo-glass-specular-strength)); }
.header-logo-glass-layer--glow { opacity: calc(0.94 * var(--logo-glass-tint-strength)); }
.header-logo-glass-layer--shade { opacity: 0.84; }
.logo-glass-shadow--outer { flood-color: var(--logo-glass-color-deep); flood-opacity: calc(0.34 * var(--logo-glass-shadow-strength)); }
.logo-glass-shadow--top { flood-color: white; flood-opacity: calc(0.11 * var(--logo-glass-shadow-strength)); }

.logo-rim-stop--1 { stop-color: white; stop-opacity: calc(0.82 * var(--logo-glass-rim-strength)); }
.logo-rim-stop--2 { stop-color: var(--logo-glass-color-lighter); stop-opacity: calc(0.18 * var(--logo-glass-rim-strength)); }
.logo-rim-stop--3 { stop-color: var(--logo-glass-color-darker); stop-opacity: calc(0.34 * var(--logo-glass-rim-strength)); }
.logo-rim-stop--4 { stop-color: var(--logo-glass-color-light); stop-opacity: calc(0.26 * var(--logo-glass-rim-strength)); }
.logo-rim-stop--5 { stop-color: white; stop-opacity: calc(0.48 * var(--logo-glass-rim-strength)); }
.logo-rim-glow-stop--1 { stop-color: var(--logo-glass-color-lighter); stop-opacity: calc(0.42 * var(--logo-glass-rim-strength)); }
.logo-rim-glow-stop--2 { stop-color: var(--logo-glass-color-light); stop-opacity: calc(0.10 * var(--logo-glass-rim-strength)); }
.logo-rim-glow-stop--3 { stop-color: var(--logo-glass-color-dark); stop-opacity: calc(0.05 * var(--logo-glass-rim-strength)); }
.logo-rim-glow-stop--4 { stop-color: var(--logo-glass-color-lighter); stop-opacity: calc(0.27 * var(--logo-glass-rim-strength)); }
.logo-rim-inner-stop--1 { stop-color: white; stop-opacity: calc(0.08 * var(--logo-glass-rim-strength)); }
.logo-rim-inner-stop--2 { stop-color: var(--logo-glass-color-dark); stop-opacity: calc(0.24 * var(--logo-glass-rim-strength)); }
.logo-rim-inner-stop--3 { stop-color: var(--logo-glass-color-deep); stop-opacity: calc(0.58 * var(--logo-glass-rim-strength)); }

.header-logo-frame__rim-glow,
.header-logo-frame__rim,
.header-logo-frame__rim-inner {
  vector-effect: non-scaling-stroke;
}

.header-logo-frame__rim-glow {
  stroke-width: 2.2;
  stroke-opacity: 0.34;
}

.header-logo-frame__rim {
  stroke-width: 1.05;
  stroke-opacity: 0.64;
}

.header-logo-frame__rim-inner {
  stroke-width: 0.7;
  stroke-opacity: 0.3588;
  transform: translateY(0.6px);
  transform-box: fill-box;
}

#logobobble {
  width: 84%;
  height: auto;
  aspect-ratio: 282 / 70;
}

#logoshine,
#logoshine_canvas {
  width: 100%;
  height: 100%;
}

#logoslogan {
  width: 79.5%;
  max-width: none;
  margin-top: var(--logo-slogan-drop);
  white-space: nowrap;
}

@media (min-width: 64.0625rem) {
  #logoslogan {
    box-sizing: border-box;
    width: calc(100% - 2rem);
    max-width: calc(100% - 2rem);
    font-size: 0.72rem;
    font-size: clamp(0.64rem, 4.35cqw, 0.76rem);
    letter-spacing: 0.02em;
    overflow: hidden;
    text-overflow: clip;
  }
}

#logoshine {
  filter: drop-shadow(0 1px 0 rgb(255 255 255 / 0.16));
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .header-logo-frame__surface-group {
    opacity: 1;
  }

  .header-logo-frame__fallback-base {
    fill-opacity: var(--logo-glass-fallback-alpha-no-blur);
  }

  .header-logo-glass-surface {
    background: var(--logo-glass-color-dark);
  }

  .header-logo-glass-layer--highlight {
    opacity: calc(0.62 * var(--logo-glass-specular-strength));
  }
}

@media (prefers-reduced-transparency: reduce) {
  .header-logo-frame__surface-group {
    opacity: 1;
  }

  .header-logo-frame__fallback-base {
    fill-opacity: var(--logo-glass-fallback-alpha-no-blur);
  }

  .header-logo-glass-surface {
    background: var(--logo-glass-color-dark);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

/* =========================================================
   Preloader/logo handoff
   ========================================================= */

/* Keep the logo out of the first paint while bootstrap resolves the display
   mode. The opaque preloader mount remains responsible for the visible cover. */
html.slc-logo-boot #logo .header-promocode-button,
html.slc-logo-boot #logo .header-logo-tab-shape,
html.slc-logo-boot #logo #logobobble,
html.slc-logo-boot #logo #logoslogan {
  opacity: 0 !important;
  transform: none !important;
  animation-play-state: paused !important;
}

/* In the full desktop experience, keep the complete logo stack covered until
   the preloader has actually released the page. The app adds
   .slc-logo-revealed only after the initial Hero/ScrollTrigger layout has
   settled, so releasing the preloader cannot turn into a visible blink. */
@media (min-width: 48rem) {
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo .header-promocode-button,
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo .header-logo-tab-shape,
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo #logobobble,
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo #logoslogan {
    opacity: 0 !important;
    transform: none !important;
    animation-play-state: paused !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo .header-promocode-button,
  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo .header-logo-tab-shape,
  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo #logobobble,
  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo #logoslogan {
    opacity: 0 !important;
    animation: none !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo .header-promocode-button {
    transform: translate3d(0, -8px, 0) !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo .header-logo-tab-shape,
  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo #logobobble,
  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo #logoslogan {
    transform: none !important;
  }

  /* Re-arm the original directional entrance only after the initial layout
     has settled: frame from above, artwork fade, then slogan from below. */
  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo .header-promocode-button:not([data-slc-logo-entrance]) {
    animation: slc-logo-drop-position 2s ease both !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo .header-logo-tab-shape {
    opacity: 1 !important;
    animation: none !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo #logobobble:not([data-slc-logo-entrance]) {
    animation: slc-logo-fade 1.2s linear both !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo #logoslogan:not([data-slc-logo-entrance]) {
    animation: slc-logo-slogan 1s ease-out 1.8s both !important;
  }
}

/* Repeat/skip modes use the same post-layout gate and directional entrance.
   Keeping the whole logo hidden until .slc-logo-revealed prevents a fast
   repeat visit from flashing at the exact moment the preloader releases. */
html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo .header-promocode-button,
html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo .header-logo-tab-shape,
html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo #logobobble,
html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo #logoslogan,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo .header-promocode-button,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo .header-logo-tab-shape,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo #logobobble,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo #logoslogan {
  opacity: 0 !important;
  animation: none !important;
}

html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo .header-promocode-button,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo .header-promocode-button {
  transform: translate3d(0, -8px, 0) !important;
}

html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo .header-logo-tab-shape,
html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo #logobobble,
html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo #logoslogan,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo .header-logo-tab-shape,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo #logobobble,
html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo #logoslogan {
  transform: none !important;
}

html[data-slc-preloader-mode="short"].slc-logo-revealed #logo .header-promocode-button:not([data-slc-logo-entrance]),
html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo .header-promocode-button:not([data-slc-logo-entrance]) {
  animation: slc-logo-drop-position 2s ease both !important;
}

html[data-slc-preloader-mode="short"].slc-logo-revealed #logo .header-logo-tab-shape,
html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo .header-logo-tab-shape {
  opacity: 1 !important;
  animation: none !important;
}

html[data-slc-preloader-mode="short"].slc-logo-revealed #logo #logobobble:not([data-slc-logo-entrance]),
html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo #logobobble:not([data-slc-logo-entrance]) {
  animation: slc-logo-fade 1.2s linear both !important;
}

html[data-slc-preloader-mode="short"].slc-logo-revealed #logo #logoslogan:not([data-slc-logo-entrance]),
html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo #logoslogan:not([data-slc-logo-entrance]) {
  animation: slc-logo-slogan 1s ease-out 1.8s both !important;
}

@keyframes slc-logo-drop-position {
  0% { transform: translateY(-160%); }
  68% { transform: translateY(0); }
  84% { transform: translateY(-7px); }
  100% { transform: translateY(0); }
}

/* app.js promotes these finite CSS entrances to explicit animations once.
   Keep the finished state in CSS; reparent/refresh must never re-arm them. */
html.slc-logo-revealed #logo [data-slc-logo-entrance] {
  animation: none !important;
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo .header-promocode-button,
  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo .header-logo-tab-shape,
  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo #logobobble,
  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo #logoslogan,
  html[data-slc-preloader-mode="short"].slc-logo-revealed #logo .header-promocode-button,
  html[data-slc-preloader-mode="short"].slc-logo-revealed #logo .header-logo-tab-shape,
  html[data-slc-preloader-mode="short"].slc-logo-revealed #logo #logobobble,
  html[data-slc-preloader-mode="short"].slc-logo-revealed #logo #logoslogan,
  html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo .header-promocode-button,
  html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo .header-logo-tab-shape,
  html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo #logobobble,
  html[data-slc-preloader-mode="skip"].slc-logo-revealed #logo #logoslogan {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }

  html[data-slc-preloader-mode="short"]:not(.slc-logo-revealed) #logo .header-promocode-button,
  html[data-slc-preloader-mode="skip"]:not(.slc-logo-revealed) #logo .header-promocode-button {
    transform: none !important;
    transition: none !important;
  }
}

@media (min-width: 48rem) and (prefers-reduced-motion: reduce) {
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo .header-promocode-button,
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo .header-logo-tab-shape,
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo #logobobble,
  html[data-slc-preloader-mode="full"]:not(.slc-preloader-released) #logo #logoslogan {
    opacity: 0 !important;
    transform: none !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released:not(.slc-logo-revealed) #logo .header-promocode-button {
    transform: none !important;
    transition: none !important;
  }

  html[data-slc-preloader-mode="full"].slc-preloader-released.slc-logo-revealed #logo .header-promocode-button {
    transition: none !important;
  }
}


/* ========================================================================== */
/* Source: styles-site-initial-home.css */
/* ========================================================================== */

/* Authoritative initial CSS: shared globals and initial-page states.
   Paired below-page component rules live in styles-site-home.css.
   Both sources stay at project root so relative asset URLs are unchanged. */



/* Briefing-local geometry belongs to this component owner. */
.briefing-section {
  --briefing-intro-min-height: clamp(10rem, 12vw, 12rem);
}

@media (max-width: 47.99rem) {
  .briefing-section {
    --briefing-intro-min-height: clamp(10rem, 36vw, 12.5rem);
  }
}

/* Marq2 component styles live in assets/css/marq2.css. */

/* Current Hero composition is owned by assets/css/slc-hero-initial.css. */

/* V13 CSS-shade launch clock: timer above the Hero boundary, one persistent lower shell below it. */

.launch-clock-dock {
  --launch-clock-width: min(19rem, calc(100vw - 3.5rem));
  --launch-clock-field-width: calc(var(--launch-clock-width) / 4);
  --launch-clock-face-height: 4.875rem;
  --launch-clock-value-height: 3.75rem;
  --launch-clock-rail-width: 1.75rem;
  position: relative;
  z-index: 8;
  margin-top: calc(-1 * var(--launch-clock-face-height));
  direction: rtl;
}

.launch-clock-dock__inner {
  display: flex;
  justify-content: flex-start;
  padding-inline-end: clamp(1.25rem, 11vw, 9rem);
}

.launch-clock-card {
  position: relative;
  width: var(--launch-clock-width);
  overflow: visible;
  isolation: isolate;
}

.launch-clock-card__face {
  position: relative;
  display: flex;
  width: var(--launch-clock-width);
  height: var(--launch-clock-face-height);
  align-items: flex-start;
  justify-content: center;
  overflow: visible;
  border-radius: 0 0.5rem 0 0;
  background: linear-gradient(180deg, rgb(43 61 81 / 0.96), rgb(25 37 50 / 0.96));
}

.launch-clock-card__face::after {
  position: absolute;
  z-index: 0;
  inset: 0 0 auto auto;
  width: 4.375rem;
  height: var(--launch-clock-face-height);
  border-start-end-radius: 0.5rem;
  background: repeating-linear-gradient(
    45deg,
    rgb(96 170 235 / 0) 0 3px,
    rgb(96 170 235 / 0.26) 3px 4px
  );
  clip-path: polygon(46% 0, 100% 0, 100% 100%);
  content: "";
  opacity: 0.14;
  pointer-events: none;
}

.launch-clock-timer {
  position: relative;
  z-index: 1;
  width: var(--launch-clock-width);
  height: var(--launch-clock-face-height);
  overflow: visible;
  direction: ltr;
  font-family: Arial, "IRANSansX", "SLC IRANSansX Fallback", sans-serif;
}

.launch-clock-timer::before {
  position: absolute;
  inset: 0 auto 0 calc(-1 * var(--launch-clock-rail-width));
  width: calc(var(--launch-clock-rail-width) + 2px);
  border: 1px solid rgb(255 255 255 / 0.12);
  border-inline-end: 0;
  border-radius: 0.5rem 0 0;
  background:
    linear-gradient(180deg, rgb(182 210 235 / 0.12), rgb(82 133 183 / 0.08)),
    rgb(36 55 74 / 0.32);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  content: "";
  pointer-events: none;
}

.launch-clock-timer::after {
  position: absolute;
  top: 1.625rem;
  left: calc(-1 * var(--launch-clock-rail-width) - 1.75rem);
  width: 5.25rem;
  height: 1.625rem;
  color: rgb(232 240 247 / 0.82);
  content: attr(data-label);
  font-size: 0.78rem;
  line-height: 1.625rem;
  letter-spacing: 0.03em;
  text-align: center;
  text-shadow: 0 1px 2px rgb(0 0 0 / 0.18);
  transform: rotate(-90deg);
  transform-origin: 50% 50%;
  pointer-events: none;
}

.launch-clock-countdown {
  position: relative;
  display: flex;
  width: var(--launch-clock-width);
  height: var(--launch-clock-face-height);
  overflow: hidden;
  border: 1px solid rgb(151 188 221 / 0.14);
  border-top-color: rgb(255 255 255 / 0.24);
  border-radius: 0 0.5rem 0 0;
  background: rgb(28 44 58 / 0.5);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.14);
}

/* V13 recessed divider: separates the digit reel from the unit labels. */
.launch-clock-countdown::after {
  position: absolute;
  z-index: 3;
  inset: 3.6875rem 0 0;
  border-top: 1px solid rgb(207 228 245 / 0.07);
  background:
    linear-gradient(
      180deg,
      rgb(218 233 246 / 0.05) 0,
      rgb(255 255 255 / 0.016) 1px,
      rgb(5 14 23 / 0.115) 2px,
      rgb(4 12 20 / 0.205) 100%
    );
  box-shadow:
    0 -1px 0 rgb(0 0 0 / 0.14),
    inset 0 1px 0 rgb(255 255 255 / 0.018);
  content: "";
  pointer-events: none;
}

.launch-clock-field {
  position: relative;
  width: var(--launch-clock-field-width);
  height: var(--launch-clock-face-height);
  flex: 0 0 var(--launch-clock-field-width);
  overflow: hidden;
  border-inline-end: 1px solid rgb(149 187 218 / 0.1);
  background:
    linear-gradient(
      180deg,
      rgb(255 255 255 / 0.34) 0%,
      rgb(255 255 255 / 0.14) 41%,
      rgb(255 255 255 / 0.06) 42%,
      rgb(103 168 228 / 0.08) 100%
    ),
    rgb(38 56 74 / 0.68);
  box-shadow:
    inset 0 1px 0 rgb(255 255 255 / 0.24),
    inset 0 -10px 14px rgb(0 0 0 / 0.18);
  -webkit-backdrop-filter: blur(2px) saturate(108%);
  backdrop-filter: blur(2px) saturate(108%);
}

.launch-clock-field--last {
  border-inline-end: 0;
}

.launch-clock-field::after {
  position: absolute;
  inset: 0 0 auto;
  height: 1.375rem;
  background: linear-gradient(180deg, rgb(255 255 255 / 0.14), transparent);
  content: "";
  pointer-events: none;
}

.launch-clock-field--shadow::before {
  position: absolute;
  z-index: 1;
  inset: 0 auto 0.5rem -2.5625rem;
  width: 2.5rem;
  border-radius: 1.25rem / 6.25rem;
  box-shadow: 0 0 7px 1px rgb(92 64 0 / 0.12);
  content: "";
  pointer-events: none;
}

.launch-clock-value {
  position: relative;
  height: var(--launch-clock-value-height);
  overflow: hidden;
  color: rgb(217 226 234 / 0.78);
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-variant-numeric: tabular-nums;
  line-height: var(--launch-clock-value-height);
  text-align: center;
  text-shadow:
    0 1px 0 rgb(255 255 255 / 0.1),
    0 -1px 0 rgb(0 0 0 / 0.2);
}

.launch-clock-current,
.launch-clock-next {
  position: absolute;
  inset: 0;
  width: 100%;
  height: var(--launch-clock-value-height);
}

.launch-clock-current.is-narrow,
.launch-clock-next.is-narrow {
  font-size: 0.84em;
  letter-spacing: -0.04em;
}

.launch-clock-shade {
  position: absolute;
  z-index: 2;
  inset: 0;
  background:
    linear-gradient(
      180deg,
      rgb(255 255 255 / 0.1) 0%,
      transparent 30%,
      rgb(0 0 0 / 0.12) 100%
    ),
    linear-gradient(
      180deg,
      transparent 0 3px,
      rgb(255 255 255 / 0.008) 3px,
      rgb(255 255 255 / 0.392) 31px,
      transparent 31px
    );
  opacity: 0.2;
  pointer-events: none;
}

.launch-clock-unit {
  display: block;
  color: rgb(184 203 219 / 0.66);
  font-size: 0.75rem;
  line-height: 1rem;
  text-align: center;
  text-shadow: 0 1px 0 rgb(255 255 255 / 0.12);
}

.launch-clock-card__lower-shell {
  position: relative;
  width: var(--launch-clock-width);
  overflow: hidden;
  border-radius: 0 0 0.5625rem 0.5625rem;
  background: #1d2c3b;
  isolation: isolate;
}

.launch-clock-card__toggle {
  display: flex;
  width: var(--launch-clock-width);
  min-height: 3.875rem;
  align-items: center;
  justify-content: flex-end;
  padding: 0.5rem 0.9375rem 0.5rem 0.8125rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: inset 0 1px 0 rgb(93 170 238 / 0.62);
  color: #fff;
  cursor: pointer;
  font-family: "IRANSansX", "SLC IRANSansX Fallback", Tahoma, Arial, sans-serif;
  text-align: right;
}

.launch-clock-card__toggle:focus-visible {
  position: relative;
  z-index: 2;
  outline: 2px solid var(--v7-cyan, #66b2c7);
  outline-offset: -3px;
}

.launch-clock-card__toggle-copy {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  gap: 0.25rem;
  align-items: stretch;
  justify-content: center;
  direction: rtl;
  text-align: right;
}

.launch-clock-card__meta-row,
.launch-clock-card__headline-row {
  display: flex;
  width: 100%;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
  direction: ltr;
}

.launch-clock-card__eyebrow {
  color: #7dc1ff;
  font-size: 0.58rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.launch-clock-card__title {
  min-width: 0;
  color: #f5f9fd;
  font-size: 0.925rem;
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -0.03em;
  white-space: nowrap;
  direction: rtl;
  text-align: right;
}

.launch-clock-card__plus {
  position: relative;
  display: block;
  width: 0.875rem;
  height: 0.875rem;
  flex: 0 0 0.875rem;
  opacity: 0.86;
}

.launch-clock-card__plus-line {
  position: absolute;
  top: 50%;
  left: 50%;
  display: block;
  background: #f4f8fb;
  transform-origin: 50% 50%;
  pointer-events: none;
}

.launch-clock-card__plus-line--horizontal {
  width: 0.75rem;
  height: 1.4px;
  transform: translate(-50%, -50%);
}

.launch-clock-card__plus-line--vertical {
  width: 1.4px;
  height: 0.75rem;
  transform: translate(-50%, -50%);
}

.launch-clock-card__panel {
  width: var(--launch-clock-width);
  height: 0;
  overflow: hidden;
  padding: 0 0.9375rem;
  border-top: 1px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #f4f8fb;
  font-family: "IRANSansX", "SLC IRANSansX Fallback", Tahoma, Arial, sans-serif;
  text-align: right;
}

.launch-clock-card__panel-text {
  margin: 0;
  color: #f5f9fd;
  font-size: 0.8125rem;
  font-weight: 500;
  line-height: 1.8;
}

.launch-clock-card__timezone {
  display: inline-flex;
  min-height: 1.125rem;
  align-items: center;
  padding: 1px 0.375rem 2px;
  border: 1px solid rgb(109 181 245 / 0.13);
  border-radius: 999px;
  background: rgb(109 181 245 / 0.055);
  color: rgb(211 225 238 / 0.74);
  font-family: Arial, sans-serif;
  font-size: 0.6rem;
  line-height: 1.25;
  direction: ltr;
  unicode-bidi: isolate;
  pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
  .launch-clock-card__toggle:hover {
    background: rgb(74 126 171 / 0.08);
  }
}

@media (max-width: 47.99rem) {
  .launch-clock-dock {
    --launch-clock-overlap: clamp(2rem, 8vw, 2.75rem);
    --launch-clock-width: min(19rem, calc(100vw - 4rem));
    margin-top: calc(-1 * var(--launch-clock-overlap));
  }

  .launch-clock-dock__inner {
    padding-inline: 1.25rem;
  }
}

@media (max-width: 26.25rem) {
  .launch-clock-dock {
    --launch-clock-width: calc(100vw - 3.5rem);
    --launch-clock-rail-width: 1.5rem;
  }

  .launch-clock-dock__inner {
    padding-inline: 1.25rem;
  }

  .launch-clock-value {
    font-size: clamp(1.8rem, 9.5vw, 2.25rem);
  }

  .launch-clock-card__eyebrow {
    font-size: 0.52rem;
  }

  .launch-clock-card__title {
    font-size: 0.82rem;
  }
}

/* The launch countdown is an update notice for desktop visitors only. */
@media (max-width: 64rem) {
  .launch-clock-dock {
    display: none;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .launch-clock-timer::before,
  .launch-clock-field {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .launch-clock-timer::before {
    background: rgb(34 53 71 / 0.96);
  }

  .launch-clock-field {
    background: #263b4e;
  }
}

@media (prefers-reduced-motion: reduce) {
  .launch-clock-card__toggle {
    scroll-behavior: auto;
  }
}

/* Narrow phones: lay out distant modules when they approach the viewport.
   The reserved heights follow the measured 320–480px layouts so activating a
   module does not substantially move later content or native anchor targets.
   If module copy or geometry changes, remeasure these reservations. */
@media (min-width: 20rem) and (max-width: 30rem) {
  @supports (content-visibility: auto) and (contain-intrinsic-size: auto 1px) {
    #main-content > #why-choose-us { content-visibility: auto; contain-intrinsic-size: auto calc(2022px - 170vw); }
    #main-content > .slc-about-shell { content-visibility: auto; contain-intrinsic-size: auto calc(3321px - 222vw); }
    #main-content > #about { content-visibility: auto; contain-intrinsic-size: auto calc(3050px - 362vw); }
    #main-content > #afghanistan-transit { content-visibility: auto; contain-intrinsic-size: auto calc(2075px - 164vw); }
    #main-content > #central-asia-sulfur { content-visibility: auto; contain-intrinsic-size: auto calc(1510px - 109vw); }
    #main-content > #regional-sales { content-visibility: auto; contain-intrinsic-size: auto calc(1679px - 146vw); }
    #main-content > #sahand-bento-light { content-visibility: auto; contain-intrinsic-size: auto calc(1983px + 2vw); }
    #main-content > #transport-project-path { content-visibility: auto; contain-intrinsic-size: auto calc(4878px - 452vw); }
    #main-content > #inquiry { content-visibility: auto; contain-intrinsic-size: auto calc(1516px - 48vw); }
    #contact { content-visibility: auto; contain-intrinsic-size: auto calc(1462px - 56vw); }
  }
}


/* ========================================================================== */
/* Source: assets/css/slc-hero-initial.css */
/* ========================================================================== */

/* Current Hero stage, typography and footer captions.
   Include immediately after styles-site-home.css to preserve the cascade. */

/* Hero-stage spacing keeps the current glass module clear of footer captions. */

.hero-stage,
[dir="rtl"] .hero-stage {
  padding-block-end: clamp(9rem, 14vh, 11rem);
}

.hero .v7-visual-caption {
  bottom: 8.5rem;
}


@media (max-width: 47.99rem) {
  .hero,
  .hero-stage,
  [dir="rtl"] .hero-stage {
    min-height: max(48rem, 100dvh);
  }

  .hero-stage,
  [dir="rtl"] .hero-stage {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding-block-end: 11.75rem;
  }

  .hero-copy,
  .hero-module,
  .hero-module__title-wrap {
    min-width: 0;
  }

}


/* Persian rail-logistics module integrated into the existing Hero glass. */

.hero-module {
  --hero-cyan: var(--v7-cyan, #66b2c7);
  --hero-muted: var(--v7-muted, #c4d3da);
  --hero-text: var(--v7-text, #f3f8fc);
  --hero-glass: var(--glass-strong, rgb(7 31 62 / 0.88));
  container-type: inline-size;
  display: grid;
  width: 100%;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  direction: rtl;
  font-family: "IRANSansX", "SLC IRANSansX Fallback", Tahoma, sans-serif;
}

.hero .hero-module__eyebrow {
  margin: 0 0 clamp(1.15rem, 2vw, 1.7rem);
  padding-inline-start: clamp(0.75rem, 2.5cqw, 1.5rem);
  color: var(--hero-muted);
  font-family: "PeydaWeb", "SLC PeydaWeb Fallback", "IRANSansX", "SLC IRANSansX Fallback", Tahoma, sans-serif;
  font-size: clamp(0.98rem, 1.2vw, 1.16rem);
  font-weight: 500;
  line-height: 1.7;
  text-align: right;
}

.hero-module__title-wrap {
  display: flex;
  justify-content: center;
}

.hero h1.hero-module__title,
html[lang="fa"] .hero h1.hero-module__title {
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--hero-text);
  font-family: "PeydaWeb", "SLC PeydaWeb Fallback", "IRANSansX", "SLC IRANSansX Fallback", Tahoma, sans-serif;
  font-size: clamp(2.75rem, 10cqw, 4rem);
  font-weight: 700;
  line-height: 1.14;
  letter-spacing: -0.055em;
  text-align: center;
  white-space: nowrap;
  text-shadow: 0 18px 46px rgb(0 8 22 / 0.34);
}

.hero-module__title-primary,
.hero-module__title-secondary {
  display: inline-block;
}

.hero-module__title-secondary {
  margin-inline-start: 0.17em;
  color: color-mix(in srgb, var(--hero-muted) 88%, var(--hero-cyan));
}

.hero-module__credentials {
  display: grid;
  grid-template-areas: "forwarder divider rank";
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  gap: clamp(1.25rem, 2.8cqw, 2.1rem);
  align-items: center;
  width: 100%;
  margin-block: clamp(2.15rem, 4.2cqw, 3rem) clamp(2.35rem, 4.6cqw, 3.2rem);
  direction: ltr;
}

.hero-credential {
  display: flex;
  gap: 0;
  align-items: center;
  min-width: 0;
  direction: rtl;
  font-family: "PeydaWeb", "SLC PeydaWeb Fallback", "IRANSansX", "SLC IRANSansX Fallback", Tahoma, sans-serif;
  font-size: clamp(1.125rem, 3.4cqw, 1.25rem);
  font-weight: 600;
  line-height: 1.55;
  text-wrap: balance;
  white-space: normal;
  text-shadow: 0 10px 28px rgb(0 8 22 / 0.3);
}

.hero-credential--rank {
  grid-area: rank;
  color: var(--hero-muted);
  justify-content: flex-start;
}

.hero-credential--forwarder {
  grid-area: forwarder;
  color: var(--hero-text);
  justify-content: flex-start;
  font-variant-numeric: tabular-nums;
}

.hero-credential > span {
  min-width: 0;
  text-wrap: balance;
}

.hero-module__credentials-divider {
  grid-area: divider;
  width: 1px;
  height: clamp(2.8rem, 5.5cqw, 3.6rem);
  background: linear-gradient(to bottom, transparent, var(--hero-cyan) 18%, var(--hero-cyan) 82%, transparent);
  box-shadow: 0 0 12px color-mix(in srgb, var(--hero-cyan) 24%, transparent);
}

.hero-module__bottom {
  display: grid;
  grid-template-areas: "cta summary";
  grid-template-columns: minmax(11.75rem, 0.68fr) minmax(0, 1.7fr);
  gap: clamp(1.75rem, 3.6cqw, 2.5rem);
  align-items: center;
  align-self: end;
  margin-top: 0;
  padding-top: 0;
  direction: ltr;
}

.hero-lead.hero-module__summary {
  grid-area: summary;
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  margin: 0;
  direction: rtl;
  color: var(--hero-muted);
  font-family: "IRANSansX", "SLC IRANSansX Fallback", Tahoma, sans-serif;
  font-size: clamp(1rem, 2.7cqw, 1.0625rem);
  font-weight: 400;
  line-height: 2.05;
  text-align: justify;
  text-align-last: right;
  text-justify: inter-word;
  text-shadow: 0 7px 22px rgb(0 8 22 / 0.42);
  text-wrap: pretty;
  white-space: normal;
}

.hero-module__summary br {
  display: none;
}

.hero-actions.hero-module__actions {
  display: block;
  grid-area: cta;
  flex: 0 0 auto;
  width: auto;
  margin: 0;
  direction: rtl;
  justify-self: start;
  transform: translateY(clamp(-0.75rem, -1.1cqw, -0.4rem));
}

.hero .button.hero-module__cta {
  --cta-bg-start: rgb(28 72 101 / 0.96);
  --cta-bg-end: rgb(9 40 64 / 0.98);
  --cta-hover-bg-start: rgb(33 84 117 / 0.98);
  --cta-hover-bg-end: rgb(11 48 76 / 0.98);
  --cta-edge-inset: 0.45rem;
  --cta-icon-size: clamp(2.5rem, 4.8cqw, 2.85rem);
  --cta-hole-radius: calc(var(--cta-icon-size) / 2);
  --cta-hole-x: calc(100% - var(--cta-edge-inset) - var(--cta-hole-radius));
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--cta-icon-size);
  grid-template-rows: 1fr;
  align-items: center;
  justify-content: initial;
  direction: ltr;
  width: clamp(11.75rem, 23cqw, 12.75rem);
  min-height: 0;
  aspect-ratio: 3.28 / 1;
  gap: 0.5rem;
  padding: 0.4rem var(--cta-edge-inset) 0.4rem 1.35rem;
  border-color: rgb(104 191 232 / 0.34);
  border-radius: 999px;
  background: transparent;
  box-shadow:
    0 10px 24px rgb(0 28 52 / 0.22),
    0 4px 16px rgb(var(--v7-cyan-rgb, 102 178 199) / 0.12);
  color: var(--hero-text);
  font-family: "PeydaWeb", "SLC PeydaWeb Fallback", "IRANSansX", "SLC IRANSansX Fallback", Tahoma, sans-serif;
  font-size: clamp(0.78rem, 1.5cqw, 0.88rem);
  font-weight: 700;
}

.hero .button.hero-module__cta::before {
  z-index: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, var(--cta-bg-start), var(--cta-bg-end));
  content: "";
  pointer-events: none;
  transform: none;
  transition: background 180ms ease;
  -webkit-mask: radial-gradient(
    circle at var(--cta-hole-x) 50%,
    transparent 0 var(--cta-hole-radius),
    #000 calc(var(--cta-hole-radius) + 1px)
  );
  mask: radial-gradient(
    circle at var(--cta-hole-x) 50%,
    transparent 0 var(--cta-hole-radius),
    #000 calc(var(--cta-hole-radius) + 1px)
  );
}

.hero-module__cta > span {
  position: relative;
  z-index: 1;
}

.hero-module__cta-icon {
  grid-column: 2;
  grid-row: 1;
  display: grid;
  width: var(--cta-icon-size);
  height: var(--cta-icon-size);
  flex: 0 0 auto;
  place-items: center;
  transform: none;
  border: 1px solid color-mix(in srgb, var(--hero-cyan) 22%, transparent);
  border-radius: 50%;
  background: transparent;
  box-shadow: 0 0 0 1px rgb(0 20 42 / 0.1);
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

.hero-module__cta-label {
  grid-column: 1;
  grid-row: 1;
  width: 100%;
  direction: rtl;
  text-align: center;
  top: -1px;
}

@media (hover: hover) and (pointer: fine) {
  .hero .button.hero-module__cta:is(:hover, :focus-visible) {
    border-color: rgb(121 205 241 / 0.48);
    background: transparent;
    transform: none;
    box-shadow:
      inset 0 1px 0 rgb(255 255 255 / 0.2),
      inset 0 -10px 20px rgb(0 23 41 / 0.12),
      0 13px 30px rgb(0 42 72 / 0.3);
    color: var(--hero-text);
  }

  .hero .button.hero-module__cta:is(:hover, :focus-visible)::before {
    background: linear-gradient(135deg, var(--cta-hover-bg-start), var(--cta-hover-bg-end));
    transform: none;
  }

  .hero .button.hero-module__cta:is(:hover, :focus-visible) .hero-module__cta-icon {
    border-color: rgb(121 205 241 / 0.42);
    background: transparent;
    box-shadow: 0 0 0 1px rgb(0 20 42 / 0.1);
  }
}

@media (min-width: 48rem) and (max-height: 50rem) {
  .hero .hero-module__eyebrow {
    margin-bottom: 0.75rem;
  }

  .hero h1.hero-module__title,
  html[lang="fa"] .hero h1.hero-module__title {
    font-size: clamp(2.5rem, 9cqw, 3.4rem);
  }

  .hero-module__bottom {
    padding-top: 0;
  }

  .hero-module__credentials {
    margin-block: 1.35rem 1.55rem;
  }

  .hero .button.hero-module__cta {
    --cta-icon-size: 2.5rem;
    aspect-ratio: 3.28 / 1;
  }
}

@media (max-width: 64rem) {
  .hero h1.hero-module__title,
  html[lang="fa"] .hero h1.hero-module__title {
    font-size: clamp(2.7rem, 10cqw, 4rem);
  }
}

@media (max-width: 47.99rem) {
  .hero-module {
    display: block;
  }

  .hero .glass-box {
    padding-block: clamp(0.9rem, 4vw, 1.15rem);
  }

  .hero .hero-module__eyebrow {
    margin-bottom: 0.8rem;
    font-size: 0.86rem;
  }

  .hero h1.hero-module__title,
  html[lang="fa"] .hero h1.hero-module__title {
    font-size: clamp(2.65rem, 12vw, 3.5rem);
    line-height: 1.12;
    letter-spacing: -0.055em;
    white-space: normal;
  }

  .hero-module__title-primary,
  .hero-module__title-secondary {
    display: block;
  }

  .hero-module__title-secondary {
    margin: 0.05em 0 0;
  }

  .hero-module__credentials {
    grid-template-areas:
      "rank"
      "divider"
      "forwarder";
    grid-template-columns: minmax(0, 1fr);
    gap: 0.45rem;
    margin-block: 1.1rem 1.25rem;
    direction: rtl;
  }

  .hero-credential {
    justify-content: center;
    font-size: 0.98rem;
    line-height: 1.4;
    text-align: center;
    white-space: normal;
  }

  .hero-credential--rank {
    font-size: clamp(0.76rem, 3.7vw, 0.98rem);
    letter-spacing: -0.018em;
    white-space: nowrap;
  }

  .hero-module__credentials-divider {
    width: min(12rem, 58%);
    height: 1px;
    justify-self: center;
    background: linear-gradient(to right, transparent, color-mix(in srgb, var(--hero-cyan) 82%, transparent) 20%, color-mix(in srgb, var(--hero-cyan) 82%, transparent) 80%, transparent);
  }

  .hero-module__bottom {
    grid-template-areas:
      "summary"
      "cta";
    grid-template-columns: minmax(0, 1fr);
    gap: 0.85rem;
    align-self: auto;
    margin-top: 0;
    padding-top: 0;
    direction: rtl;
  }

  .hero-lead.hero-module__summary {
    font-size: 1rem;
    line-height: 1.75;
    text-align: right;
    text-align-last: right;
  }

  .hero-actions.hero-module__actions {
    width: min(100%, 13rem);
    justify-self: center;
    transform: none;
  }

  .hero .button.hero-module__cta {
    --cta-icon-size: 2.35rem;
    width: 100%;
    min-height: 3.4rem;
    aspect-ratio: 3.28 / 1;
    font-size: 0.82rem;
  }

}

@media (prefers-reduced-motion: reduce) {
  .hero-module__cta-icon,
  .hero .button.hero-module__cta::before {
    transition: none;
  }
}

/* Minimal hero footer captions. */

.hero-stage,
[dir="rtl"] .hero-stage {
  padding-block-end: 3.5rem;
}

.hero .v7-visual-caption {
  position: absolute;
  bottom: 1.7rem;
}

.hero-footer-captions {
  position: absolute;
  z-index: 4;
  inset-inline-start: 0;
  inset-block-end: 1.7rem;
  display: flex;
  gap: clamp(4.5rem, 9vw, 9rem);
  align-items: center;
  direction: ltr;
}

.hero-footer-captions .v7-visual-caption {
  position: static;
  flex: 0 0 auto;
}

.hero-transport-modes {
  position: static;
  flex: 0 0 auto;
  width: auto;
  display: flex;
  gap: 0.48rem;
  align-items: center;
  justify-content: flex-start;
  margin: 0;
  padding: 0;
  color: rgb(243 248 252 / 0.52);
  font-family: "SLC Univia Pro", sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  white-space: nowrap;
  pointer-events: none;
}

.hero-transport-modes i {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: rgb(var(--v7-cyan-rgb, 102 178 199) / 0.72);
}

@media (max-width: 47.99rem) {
  .hero-stage,
  [dir="rtl"] .hero-stage {
    padding-block-end: 2.5rem;
  }

  .hero-footer-captions {
    display: none;
  }

  .hero-transport-modes {
    display: none;
  }
}



/* ========================================================================== */
/* Source: assets/css/rail-language-switcher.css */
/* ========================================================================== */

/*
 * SLC railway language switcher - Design 1 glass checkpoint v4.
 * Hero-only component: keep this palette isolated from the non-Hero theme.
 * Component styles are deliberately scoped to prevent page-level leakage.
 */
.rail-language-switcher {
  --text: #edf3f6;
  --muted: #b2bdc4;
  --muted-2: #9ca8af;
  --fa-rgb: 74 222 100;
  --en-rgb: 91 143 255;
  --ru-rgb: 240 115 127;
  --zh-rgb: 255 220 61;
  --active-rgb: var(--fa-rgb);
  --switch-width: 248px;
  --switch-height: 366px;
  --radius: 10px;
  --font-ui: "Segoe UI", Arial, sans-serif;
  --font-fa: "IRANSansX", "SLC IRANSansX Fallback", "Vazirmatn", Tahoma, Arial, sans-serif;
  color: var(--text);
  font-family: var(--font-ui);
}

.rail-language-switcher,
.rail-language-switcher *,
.rail-language-switcher *::before,
.rail-language-switcher *::after {
  box-sizing: border-box;
}

.rail-language-switcher a {
  font: inherit;
}

.rail-language-switcher .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
/* Component shell - glass treatment adapted from the approved checkpoint reference. */
.rail-language-switcher .language-switcher {
  position: relative;
  isolation: isolate;
  direction: ltr;
  width: var(--switch-width);
  height: var(--switch-height);
  overflow: hidden;
  border: 0;
  border-radius: var(--radius);
  background:
    linear-gradient(145deg, rgba(255,255,255,.045), transparent 34%),
    linear-gradient(180deg, rgba(20,27,31,.18), rgba(8,12,15,.24));
  box-shadow:
    0 24px 58px rgba(0,0,0,.40),
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -12px 24px rgba(0,0,0,.09);
  -webkit-backdrop-filter: blur(3px) saturate(108%);
  backdrop-filter: blur(3px) saturate(108%);
}
.rail-language-switcher .language-switcher::before,
.rail-language-switcher .language-switcher::after { content: ""; position: absolute; pointer-events: none; }
/* True 1px optical rim: bright upper-left, restrained lower-right. */
.rail-language-switcher .language-switcher::before {
  z-index: 8;
  inset: 0;
  padding: 1px;
  border-radius: inherit;
  background: linear-gradient(135deg,
    rgba(255,255,255,.44),
    rgba(255,255,255,.055) 34%,
    rgba(0,0,0,.18) 68%,
    rgba(255,255,255,.16));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.rail-language-switcher .language-switcher::after {
  z-index: 3;
  inset: 1px;
  border-radius: calc(var(--radius) - 1px);
  background:
    linear-gradient(28deg, rgba(0,0,0,.025), rgba(255,255,255,.012)),
    radial-gradient(circle at 76% 16%, rgba(201,235,255,.045), transparent 36%);
}
.rail-language-switcher .language-switcher__chrome {
  position: absolute;
  z-index: 4;
  inset: -32% -72%;
  pointer-events: none;
  opacity: .46;
  transform: rotate(22deg) translateX(-25%);
  background: linear-gradient(90deg, transparent 42%, rgba(255,255,255,.024) 50%, transparent 58%);
}
.rail-language-switcher .language-switcher__header,
.rail-language-switcher .language-switcher__footer,
.rail-language-switcher .turnout { z-index: 10; }

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .rail-language-switcher .language-switcher {
    background: linear-gradient(180deg, rgba(20,27,31,.94), rgba(8,12,15,.97));
  }
}

@media (prefers-reduced-transparency: reduce) {
  .rail-language-switcher .language-switcher {
    background: linear-gradient(180deg, rgba(20,27,31,.95), rgba(8,12,15,.98));
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}
.rail-language-switcher .language-switcher__header,
.rail-language-switcher .language-switcher__footer {
  position: absolute;
  left: 16px;
  right: 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #9ba7ae;
  font-size: .54rem;
  font-weight: 680;
  letter-spacing: .155em;
  text-transform: uppercase;
}
.rail-language-switcher .language-switcher__header { top: 15px; }
.rail-language-switcher .language-switcher__footer {
  bottom: 13px;
  padding-top: 8px;
  border-top: 1px solid rgba(186,202,211,.15);
}
.rail-language-switcher .language-switcher__status { display: inline-flex; align-items: center; gap: 8px; }
.rail-language-switcher .language-switcher__status-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgb(var(--en-rgb));
  box-shadow: 0 0 12px rgba(var(--en-rgb) / .66);
}
.rail-language-switcher .language-switcher__current {
  color: var(--text);
  font-size: .56rem;
  font-weight: 760;
  letter-spacing: .11em;
  white-space: nowrap;
  text-align: right;
}

/* Station display occupies the empty right side of the common rail. Its
   footprint is fixed; discrete digits never move the rail or surrounding page. */
.rail-language-switcher .language-switcher__countdown {
  position: absolute;
  z-index: 11;
  right: 17px;
  bottom: 75px;
  /* 57.2px digit area + 6px padding: 10% larger than the former 52px. */
  width: 63.2px;
  padding: 7px 3px 8px;
  color: rgb(var(--motion-rgb, var(--active-rgb)));
  pointer-events: none;
}
.rail-language-switcher .language-switcher__countdown[hidden] { display: none; }
.rail-language-switcher .language-switcher__countdown-label {
  display: block;
  margin-bottom: 5px;
  color: #d6e2e8;
  font-size: 8px;
  font-weight: 650;
  line-height: 1.3;
  letter-spacing: .035em;
  text-align: center;
  white-space: nowrap;
}
.rail-language-switcher .language-switcher__countdown-display {
  display: block;
  width: 100%;
  height: auto;
  overflow: hidden;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
}
.rail-language-switcher .language-switcher__countdown-unlit {
  stroke: #a8bac5;
  opacity: .24;
}
.rail-language-switcher .language-switcher__countdown-steps {
  display: flex;
  justify-content: center;
  gap: 6px;
  height: 4px;
  margin-top: 7px;
}
.rail-language-switcher [data-countdown-step] {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: currentColor;
  opacity: .18;
  transition: opacity 140ms ease-out;
}
.rail-language-switcher [data-countdown-step][data-lit="true"] { opacity: .9; }
.rail-language-switcher [data-language-status] {
  min-width: 0;
  white-space: nowrap;
  letter-spacing: .075em;
}
.rail-language-switcher [data-route-caption] { flex-shrink: 0; }
.rail-language-switcher .language-switcher__current { min-width: 0; }

/* Turnout geometry */
.rail-language-switcher .turnout { position: absolute; inset: 31px 6px 38px; }
.rail-language-switcher .turnout__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.rail-language-switcher .track-track,
.rail-language-switcher .track-gap,
.rail-language-switcher .route,
.rail-language-switcher .route-sweep,
.rail-language-switcher .blade-guides path { fill: none; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.rail-language-switcher .track-track {
  stroke: url(#steelGradient);
  stroke-width: 6.15;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.52));
}
.rail-language-switcher .track-gap { stroke: rgba(12, 17, 21, .72); stroke-width: 2.05; }
.rail-language-switcher .sleepers line {
  stroke: rgba(190,205,213,.38);
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
}
.rail-language-switcher .blade-guides { opacity: 0; pointer-events: none; }
.rail-language-switcher .blade-guides path { stroke: transparent; stroke-width: 1; }

/* Route illumination stays inside the physical rail gauge, but is deliberately visible at normal viewing distance. */
.rail-language-switcher .route { opacity: .16; stroke-width: 1.8; }
.rail-language-switcher .route--fa { stroke: rgb(var(--fa-rgb)); }
.rail-language-switcher .route--en { stroke: rgb(var(--en-rgb)); }
.rail-language-switcher .route--ru { stroke: rgb(var(--ru-rgb)); }
.rail-language-switcher .route--zh { stroke: rgb(var(--zh-rgb)); }
.rail-language-switcher .route-sweep {
  opacity: 0;
  stroke: #fff;
  stroke-width: 2.6;
  filter: url(#softGlow);
}

/* Calibrated tongues: the main group rotates rigidly about its SVG pivot. */
.rail-language-switcher .switch-blade {
  opacity: .95;
}
/* Calibrated FA geometry is already in HTML; runtime interaction may arrive
   after the initial Hero frame without an empty rail shell. */
.rail-language-switcher .language-switcher:not([data-ready="true"]) .switch-blade--main { opacity: .98; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .switch-blade--left { opacity: .96; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .switch-blade--right { opacity: .42; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .route { opacity: .17; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .route--fa { opacity: .92; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .terminal__ring { opacity: .60; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .terminal__core { opacity: .15; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .terminal--fa .terminal__halo { opacity: .29; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .terminal--fa .terminal__ring,
.rail-language-switcher .language-switcher:not([data-ready="true"]) .terminal--fa .terminal__core { opacity: 1; }
.rail-language-switcher .language-switcher:not([data-ready="true"]) .language-switcher__status-dot {
  background: rgb(var(--fa-rgb));
  box-shadow: 0 0 12px rgb(var(--fa-rgb) / .68);
}
.rail-language-switcher .switch-blade__shadow,
.rail-language-switcher .switch-blade__metal,
.rail-language-switcher .switch-blade__active {
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
}
.rail-language-switcher .switch-blade__shadow { stroke: rgba(0,0,0,.68); stroke-width: 6.6; }
.rail-language-switcher .switch-blade__metal { stroke: #aab5bc; stroke-width: 4.6; }
.rail-language-switcher .switch-blade__gauge { stroke: rgba(12,17,21,.76); stroke-width: 2.1; }
.rail-language-switcher .switch-blade__active {
  stroke: rgb(var(--motion-rgb, var(--active-rgb)) / .42);
  stroke-width: 1.05;
  opacity: .48;
}

.rail-language-switcher .pivot__outer {
  fill: #151d21;
  stroke: rgba(204,217,224,.5);
  stroke-width: 1;
}
.rail-language-switcher .pivot__inner { fill: #a6b1b7; opacity: .88; }
.rail-language-switcher .pivot__lock {
  fill: none;
  stroke: rgb(var(--motion-rgb, var(--active-rgb)) / .58);
  stroke-width: 1;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
}

.rail-language-switcher .terminal__halo,
.rail-language-switcher .terminal__ring,
.rail-language-switcher .terminal__core { transform-box: fill-box; transform-origin: center; }
.rail-language-switcher .terminal__halo { opacity: .01; filter: url(#softGlow); }
.rail-language-switcher .terminal__ring { fill: rgba(12,17,20,.94); stroke: rgba(179,194,203,.36); stroke-width: 1.15; opacity: .76; }
.rail-language-switcher .terminal__core { fill: rgba(170,184,192,.82); opacity: .22; }
.rail-language-switcher .terminal--fa .terminal__halo,
.rail-language-switcher .terminal--fa .terminal__core { fill: rgb(var(--fa-rgb)); }
.rail-language-switcher .terminal--fa .terminal__ring { --terminal-accent: var(--fa-rgb); }
.rail-language-switcher .terminal--en .terminal__halo,
.rail-language-switcher .terminal--en .terminal__core { fill: rgb(var(--en-rgb)); }
.rail-language-switcher .terminal--en .terminal__ring { --terminal-accent: var(--en-rgb); }
.rail-language-switcher .terminal--ru .terminal__halo,
.rail-language-switcher .terminal--ru .terminal__core { fill: rgb(var(--ru-rgb)); }
.rail-language-switcher .terminal--ru .terminal__ring { --terminal-accent: var(--ru-rgb); }
.rail-language-switcher .terminal--zh .terminal__halo,
.rail-language-switcher .terminal--zh .terminal__core { fill: rgb(var(--zh-rgb)); }
.rail-language-switcher .terminal--zh .terminal__ring { --terminal-accent: var(--zh-rgb); }
.rail-language-switcher .terminal-stems line {
  stroke: url(#steelGradient);
  stroke-width: 6.15;
  vector-effect: non-scaling-stroke;
  stroke-linecap: round;
}
.rail-language-switcher .terminal-stems line::after { content: none; }
.rail-language-switcher .technical-marks path {
  fill: none;
  stroke: rgba(177,193,202,.3);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

/* Language controls */
.rail-language-switcher .language-option {
  position: absolute;
  top: -3px;
  width: 52px;
  height: 60px;
  padding: 4px 2px 2px;
  border: 0;
  border-radius: 15px;
  color: var(--muted);
  background: transparent;
  text-decoration: none;
  display: grid;
  place-items: center;
  align-content: start;
  gap: 3px;
  cursor: pointer;
  z-index: 4;
  transition: color 180ms ease;
}
.rail-language-switcher .language-option::before {
  content: "";
  position: absolute;
  inset: 1px;
  border: 1px solid transparent;
  border-radius: 14px;
  background: currentColor;
  opacity: 0;
  transform: scale(.91);
  transition: opacity 180ms ease, transform 210ms cubic-bezier(.65,0,.35,1), border-color 180ms ease;
}
.rail-language-switcher .language-option:hover::before { opacity: .04; transform: scale(1); }
.rail-language-switcher .language-option:focus-visible {
  outline: 2px solid rgba(225,235,240,.86);
  outline-offset: 3px;
}
.rail-language-switcher .language-option:focus-visible::before { opacity: .045; }
.rail-language-switcher .language-option--fa { left: 5px; }
.rail-language-switcher .language-option--en { left: 61px; }
.rail-language-switcher .language-option--ru { right: 61px; }
.rail-language-switcher .language-option--zh { right: 5px; }
.rail-language-switcher .language-option__code,
.rail-language-switcher .language-option__name { position: relative; z-index: 1; }
.rail-language-switcher .language-option__code { font-size: .72rem; font-weight: 790; letter-spacing: .105em; }
.rail-language-switcher .language-option__name { color: #adbac1; font-size: .615rem; line-height: 1.14; white-space: nowrap; }
.rail-language-switcher .language-option--fa .language-option__name { font-family: var(--font-fa); }


.rail-language-switcher .language-switcher[data-busy="true"] .language-option {
  pointer-events: none;
}
.rail-language-switcher .language-switcher[data-navigating="true"] .language-option {
  cursor: progress;
}
.rail-language-switcher .language-option[aria-current="page"] {
  cursor: default;
}

.rail-language-switcher .language-switcher[data-language="fa"] { --active-rgb: var(--fa-rgb); }
.rail-language-switcher .language-switcher[data-language="en"] { --active-rgb: var(--en-rgb); }
.rail-language-switcher .language-switcher[data-language="ru"] { --active-rgb: var(--ru-rgb); }
.rail-language-switcher .language-switcher[data-language="zh-Hans"] { --active-rgb: var(--zh-rgb); }
.rail-language-switcher .language-switcher[data-language="fa"] .language-option--fa { color: #b0f4ba; }
.rail-language-switcher .language-switcher[data-language="en"] .language-option--en { color: #bdd0ff; }
.rail-language-switcher .language-switcher[data-language="ru"] .language-option--ru { color: #ffe5e8; }
.rail-language-switcher .language-switcher[data-language="zh-Hans"] .language-option--zh { color: #ffeb9b; }


/* Live Hero integration */
.v7-rail-lighting > .rail-language-switcher {
  position: absolute;
  z-index: calc(var(--z-content) + 5);
  inset: 0;
  pointer-events: none;
}

.v7-rail-lighting > .rail-language-switcher > .language-switcher {
  position: absolute;
  bottom: clamp(2rem, 7vh, 4.5rem);
  left: clamp(1rem, 4vw, 4.5rem);
  pointer-events: auto;
}

@media (max-width: 64rem) and (min-width: 48rem) {
  .rail-language-switcher {
    --switch-width: 224px;
    --switch-height: 340px;
    --radius: 27px;
  }

  .v7-rail-lighting > .rail-language-switcher > .language-switcher {
    bottom: 1.25rem;
    left: 1.25rem;
  }

  .rail-language-switcher .language-option--fa { left: 1px; }
  .rail-language-switcher .language-option--en { left: 52px; }
  .rail-language-switcher .language-option--ru { right: 52px; }
  .rail-language-switcher .language-option--zh { right: 1px; }
  .rail-language-switcher .language-switcher__countdown {
    right: 13px;
    bottom: 68px;
    /* 51.7px digit area: 10% larger than the former tablet 47px. */
    width: 57.7px;
  }
}

@media (min-width: 48rem) and (max-height: 50rem) {
  .v7-rail-lighting > .rail-language-switcher > .language-switcher {
    transform: scale(.88);
    transform-origin: bottom left;
  }
}

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


/* ========================================================================== */
/* Source: assets/css/mobile-signal-language-initial.css */
/* ========================================================================== */

/* Initial phone language shell and basic native fallback. Interaction decoration is deferred. */
/*
 * Hero-only component. Its signal palette is intentionally isolated from the
 * site theme so switching the non-Hero body theme cannot recolor the Hero.
 */
.mobile-signal-language-switcher {
  --fa: 74 222 100;
  --en: 91 143 255;
  --ru: 240 115 127;
  --zh: 255 220 61;
  --active: var(--fa);
  --motion: var(--fa);
  --signal-glass: rgb(255 255 255 / 0.04);
  --signal-border: rgb(255 255 255 / 0.2);
  --signal-radius: 3px;
  --font-ui: "Univia Pro", "Segoe UI", Arial, sans-serif;

  position: absolute;
  z-index: calc(var(--z-content) + 8);
  top: max(4.5rem, calc(env(safe-area-inset-top) + 4.5rem));
  left: max(1rem, env(safe-area-inset-left));
  display: none;
  color: #edf3f6;
  font-family: var(--font-ui);
  pointer-events: auto;
}

.mobile-signal-language-switcher,
.mobile-signal-language-switcher *,
.mobile-signal-language-switcher *::before,
.mobile-signal-language-switcher *::after {
  box-sizing: border-box;
}

.mobile-signal-language-switcher a,
.mobile-signal-language-switcher button {
  font: inherit;
}

.mobile-signal-language-switcher .signal-switcher {
  position: relative;
  width: 72px;
  height: 44px;
  isolation: isolate;
  direction: ltr;
}

.mobile-signal-language-switcher .signal-switcher[data-language="fa"] { --active: var(--fa); }
.mobile-signal-language-switcher .signal-switcher[data-language="en"] { --active: var(--en); }
.mobile-signal-language-switcher .signal-switcher[data-language="ru"] { --active: var(--ru); }
.mobile-signal-language-switcher .signal-switcher[data-language="zh-Hans"] { --active: var(--zh); }

.mobile-signal-language-switcher .signal-trigger,
.mobile-signal-language-switcher .signal-panel {
  overflow: hidden;
  border: 1px solid var(--signal-border);
  border-radius: var(--signal-radius);
  background: var(--signal-glass);
  box-shadow:
    0 1.125rem 2.625rem rgb(0 0 0 / 0.28),
    inset 0 1px 0 rgb(255 255 255 / 0.13),
    inset 0 -0.75rem 1.5rem rgb(0 0 0 / 0.1);
  -webkit-backdrop-filter: blur(10px) saturate(88%) brightness(83%) contrast(103%);
  backdrop-filter: blur(10px) saturate(88%) brightness(83%) contrast(103%);
}

.mobile-signal-language-switcher .signal-trigger::before,
.mobile-signal-language-switcher .signal-panel::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(145deg, rgb(255 255 255 / 0.11), transparent 44%);
  content: "";
  pointer-events: none;
}

.mobile-signal-language-switcher .signal-trigger::after,
.mobile-signal-language-switcher .signal-panel::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  border-radius: inherit;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.75'/%3E%3C/svg%3E");
  background-size: 150px 150px;
  mix-blend-mode: soft-light;
  opacity: 0.015;
  content: "";
  pointer-events: none;
}

.mobile-signal-language-switcher .signal-trigger {
  position: relative;
  width: 72px;
  height: 44px;
  display: grid;
  grid-template-columns: 27px 1fr 8px;
  align-items: center;
  gap: 5px;
  padding: 0 8px 0 6px;
  color: #edf3f6;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.mobile-signal-language-switcher .signal-trigger > * {
  position: relative;
  z-index: 2;
}

.mobile-signal-language-switcher .signal-trigger:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.mobile-signal-language-switcher .signal-trigger:active {
  transform: scale(0.985);
}

.mobile-signal-language-switcher .signal-trigger__lamp,
.mobile-signal-language-switcher .signal-lamp {
  position: relative;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 30%, #354047 0 10%, #222c31 34%, #151d21 68%, #0e1417 100%);
}

.mobile-signal-language-switcher .signal-trigger__lamp {
  width: 25px;
  height: 25px;
  border: 1px solid rgb(var(--active) / 0.64);
  box-shadow: inset 0 1px 1px rgb(255 255 255 / 0.18), inset 0 -4px 8px rgb(0 0 0 / 0.25), 0 0 8px rgb(var(--active) / 0.18);
}

.mobile-signal-language-switcher .signal-trigger__lens,
.mobile-signal-language-switcher .signal-lamp__lens {
  position: absolute;
  border-radius: 50%;
}

.mobile-signal-language-switcher .signal-trigger__lens {
  inset: 4px;
  background: radial-gradient(circle at 37% 29%, rgb(255 255 255 / 0.42) 0 8%, rgb(var(--active)) 19%, rgb(var(--active) / 0.92) 47%, rgb(var(--active) / 0.58) 100%);
  box-shadow: 0 0 9px rgb(var(--active) / 0.28), inset 0 1px 1px rgb(255 255 255 / 0.22);
}

.mobile-signal-language-switcher .signal-trigger__glint,
.mobile-signal-language-switcher .signal-lamp__glint {
  position: absolute;
  border-radius: 50%;
  transform: rotate(-28deg);
  background: radial-gradient(ellipse, rgb(255 255 255 / 0.32), transparent 72%);
}

.mobile-signal-language-switcher .signal-trigger__glint {
  top: 5px;
  left: 6px;
  width: 7px;
  height: 4px;
  opacity: 0.55;
}

.mobile-signal-language-switcher .signal-trigger__code {
  font-size: 0.69rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.08em;
}

.mobile-signal-language-switcher .signal-trigger__chevron {
  width: 6px;
  height: 6px;
  border-right: 1px solid #c4d0d6;
  border-bottom: 1px solid #c4d0d6;
  transform: rotate(45deg) translateY(-1px);
  transition: transform 180ms ease;
}

.mobile-signal-language-switcher .signal-trigger[aria-expanded="true"] .signal-trigger__chevron {
  transform: rotate(225deg) translate(-1px, -1px);
}

.mobile-signal-language-switcher .signal-panel {
  position: absolute;
  top: 50px;
  left: 0;
  width: 170px;
  height: 112px;
  padding: 8px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(-5px) scale(0.985);
  transform-origin: top left;
  transition: opacity 170ms ease, transform 190ms cubic-bezier(0.2, 0.75, 0.25, 1), visibility 190ms;
}

.mobile-signal-language-switcher .signal-switcher[data-open="true"] .signal-panel {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
}

.mobile-signal-language-switcher .signal-grid {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template: repeat(2, 1fr) / repeat(2, 1fr);
  gap: 4px;
  width: 100%;
  height: 100%;
}

.mobile-signal-language-switcher .signal-option {
  --option: var(--en);
  position: relative;
  z-index: 3;
  min-width: 0;
  min-height: 44px;
  display: grid;
  grid-template-columns: 30px 1fr;
  align-items: center;
  padding: 2px 8px 2px 7px;
  border-radius: var(--signal-radius);
  color: #8e9aa1;
  text-decoration: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.mobile-signal-language-switcher .signal-option:focus-visible {
  outline: 2px solid #fff;
  outline-offset: -1px;
}

.mobile-signal-language-switcher .signal-option:active {
  background: rgb(255 255 255 / 0.055);
}

.mobile-signal-language-switcher .signal-code {
  justify-self: start;
  margin-left: 3px;
  color: #9ba8af;
  font-size: 0.58rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 0.075em;
}

.mobile-signal-language-switcher .mobile-signal-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 47.99rem) {
  .mobile-signal-language-switcher {
    display: block;
    transform: none;
  }
  .rail-language-switcher { display: none; }

  body.menu-open .mobile-signal-language-switcher {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
  }
}

@media (max-width: 30rem) {
  .mobile-signal-language-switcher {
    top: max(4.25rem, calc(env(safe-area-inset-top) + 4.25rem));
  }
}

@media (max-width: 22.5rem) {
  .mobile-signal-language-switcher .signal-panel { width: 164px; }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .mobile-signal-language-switcher .signal-trigger,
  .mobile-signal-language-switcher .signal-panel { background: rgb(24 30 42 / 0.94); }
}

@media (prefers-reduced-transparency: reduce) {
  .mobile-signal-language-switcher .signal-trigger,
  .mobile-signal-language-switcher .signal-panel {
    background: rgb(24 30 42 / 0.94);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mobile-signal-language-switcher .signal-trigger,
  .mobile-signal-language-switcher .signal-trigger__chevron,
  .mobile-signal-language-switcher .signal-panel,
  .mobile-signal-language-switcher .signal-lamp,
  .mobile-signal-language-switcher .signal-lamp__lens {
    transition: none !important;
  }

  .mobile-signal-language-switcher .signal-pulse,
  .mobile-signal-language-switcher .signal-lamp__confirm { display: none !important; }
}

/* Native fallback retains the panel's basic layout when decoration fails. */
.mobile-signal-language-switcher [data-slc-language-state="fallback"] .signal-option { grid-template-columns: 1fr; }
.mobile-signal-language-switcher [data-slc-language-state="fallback"] .signal-lamp { display: none; }

/* Control centers and active labels remain valid without decorative CSS. */
.mobile-signal-language-switcher .signal-option[data-lang="fa"] { --option: var(--fa); }

.mobile-signal-language-switcher .signal-option[data-lang="en"] { --option: var(--en); }

.mobile-signal-language-switcher .signal-option[data-lang="ru"] { --option: var(--ru); }

.mobile-signal-language-switcher .signal-option[data-lang="zh-Hans"] { --option: var(--zh); }

.mobile-signal-language-switcher .signal-lamp {
  width: 24px;
  height: 24px;
  justify-self: center;
  border: 1px solid rgb(196 209 216 / 0.3);
  box-shadow: inset 0 1px 1px rgb(255 255 255 / 0.07), inset 0 -4px 8px rgb(0 0 0 / 0.34), 0 2px 3px rgb(0 0 0 / 0.34);
  transition: border-color 150ms ease, box-shadow 180ms ease;
}

.mobile-signal-language-switcher .signal-option:is([aria-current="page"], .is-arriving) .signal-code { color: #eef4f6; }

.mobile-signal-language-switcher .signal-switcher[data-navigating="true"] { pointer-events: none; }
