/* Frosted navigation, with an opaque fallback when backdrop-filter is absent. */
.glass-nav { --nav-ink: #021024; position: fixed; z-index: 100; inset-inline-start: 18px; top: 18px; bottom: 18px; width: 76px; padding: 18px 10px; border: 1px solid #5483b3; border-radius: 26px; background: linear-gradient(160deg,#c1e8ff 0%,#c1e8ff 58%,#c1e8ff 100%); box-shadow: 0 14px 48px #05265930,inset 0 1px 0 #eff8ffd9; color: var(--nav-ink); display: flex; flex-direction: column; gap: 20px; box-sizing: border-box; }
@supports (backdrop-filter: blur(24px)) or (-webkit-backdrop-filter: blur(24px)) {
 .glass-nav { background: linear-gradient(160deg,#c1e8ff70 0%,#c1e8ff61 58%,#c1e8ff5c 100%); backdrop-filter: blur(16px) saturate(150%); -webkit-backdrop-filter: blur(16px) saturate(150%); }
}
.glass-ready .site-header .site-nav { display: none; }
.glass-ready .header-inner { justify-content: space-between; }
.glass-ready .header-cta { margin-inline-start: auto; }
.glass-links { display: grid; gap: 12px; }
.glass-links a { position: relative; display: flex; align-items: center; gap: 14px; min-height: 48px; padding: 10px 16px; color: #021024; border-radius: 14px; white-space: nowrap; border: 1px solid transparent; text-decoration: none; }
.glass-links .fa { flex: 0 0 20px; text-align: center; font-size: 19px; }
.glass-links a:hover,.glass-links a[aria-current="page"] { background: #eff8ff70; color: #021024; border-color: #eff8ff; box-shadow: 0 4px 14px #05265912,inset 0 1px 0 #eff8ff; }
.glass-label,.glass-note { display: none; }
.glass-tooltip { position: absolute; inset-inline-start: calc(100% + 20px); top: 50%; transform: translateY(-50%) translateX(5px); padding: 7px 14px; background: #021024; color: #c1e8ff; font-size: 13px; border-radius: 10px; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 160ms ease,transform 160ms ease; }
.glass-links a:is(:hover,:focus-visible) .glass-tooltip { opacity: 1; visibility: visible; transform: translateY(-50%); }
.glass-toggle { display: grid; place-items: center; min-width: 44px; min-height: 44px; border: 1px solid #7da0ca; border-radius: 14px; color: #021024; background: #c1e8ff; font: inherit; font-size: 24px; cursor: pointer; }
.glass-nav a:focus-visible,.glass-toggle:focus-visible { outline: 3px solid #052659; outline-offset: 4px; }
.glass-expanded .glass-nav { width: 260px; }
.glass-expanded :is(.glass-label,.glass-note) { display: block; }
.glass-label { font-size: 14px; }
.glass-note { margin-top: auto; padding: 12px 16px; color: #021024; font-size: 12px; border-top: 1px solid #7da0ca; }
.glass-expanded .glass-tooltip { display: none; }
.glass-backdrop { position: fixed; inset: 0; z-index: 90; border: 0; background: #02102418; }
.glass-backdrop[hidden] { display: none; }
/* Desktop rail; mobile uses a header toggle and an off-canvas panel. */
html[lang="fa"] body.glass-ready { padding-inline-start: 112px; }
.glass-ready .site-header { background: transparent; border: 0; }
.glass-ready .header-inner { min-height: 80px; }
.glass-nav .glass-toggle { flex: 0 0 44px; width: 44px; align-self: flex-start; }
.glass-label { display: block; max-width: 0; overflow: hidden; opacity: 0; }
.glass-links a { gap: 0; }
.glass-expanded .glass-label { max-width: 190px; opacity: 1; }
.glass-expanded .glass-links a { gap: 14px; }
@media (max-width: 767px) {
 html[lang="fa"] body.glass-ready { padding-inline-start: 0; }
 .glass-ready .header-inner { flex-direction: row; padding-block: 14px; min-height: 0; }
 .glass-ready .site-header .brand { display: inline-flex; visibility: visible; }
 .glass-ready .header-cta { display: none; }
 .glass-ready .header-inner > .glass-toggle { margin: 0; }
 .glass-ready .site-header .brand { margin-inline-start: auto; }
 .glass-nav { top: 88px; bottom: 16px; max-height: calc(100dvh - 104px); inset-inline-start: 12px; inset-inline-end: auto; width: min(179.2px,calc(100vw - 24px)); overflow-y: auto; transform: translateX(115%); visibility: hidden; pointer-events: none; }
 .glass-expanded .glass-nav { width: min(179.2px,calc(100vw - 24px)); transform: none; visibility: visible; pointer-events: auto; }
 .glass-expanded .site-header { position: relative; z-index: 101; }
 .glass-links { gap: 8px; }
 .glass-links a { min-height: 48px; padding-inline: 8px; }
 .glass-expanded .glass-links a { gap: 8px; }
 .glass-label { font-size: 13px; white-space: normal; line-height: 1.8; min-width: 0; }
 .glass-nav { border-color: #eff8ffaa; box-shadow: 0 14px 48px #05265924,inset 0 1px 0 #eff8ffcc; }
 .glass-tooltip { display: none; }
}
@media (prefers-reduced-motion: no-preference) {
 .glass-nav { transition: width 600ms cubic-bezier(.22,.68,.24,1),transform 600ms cubic-bezier(.22,.68,.24,1),visibility 600ms; }
 .glass-label { transition: max-width 600ms cubic-bezier(.22,.68,.24,1),opacity 380ms ease; }
 .glass-links a { transition: gap 600ms ease,background 180ms ease,box-shadow 180ms ease,color 180ms ease; }
}

/* Keep the full brand outside the menu, above its hamburger control. */
@media (min-width: 768px) {
 .glass-ready .site-header .brand { position: fixed; z-index: 101; top: 24px; inset-inline-start: 28px; visibility: visible; display: inline-flex; gap: 10px; font-size: 22px; }
 .glass-nav { top: 104px; }
}
@media (max-width: 767px) and (prefers-reduced-motion: no-preference) {
 .glass-nav { transition: none; }
 .glass-label { transition: max-width 1000ms ease,opacity 700ms ease; }
}

/* Blue glass tint retains the accepted transparency and blur. */
@supports (backdrop-filter: blur(16px)) or (-webkit-backdrop-filter: blur(16px)) {
 .glass-nav { background: linear-gradient(160deg,#c1e8ff70,#7da0ca61 58%,#5483b35c); }
}
.glass-toggle { background: #c1e8ff; color: #052659; border-color: #5483b3; }
.glass-links a,.glass-note { color: #052659; }
.glass-links a:hover,.glass-links a[aria-current="page"] { color: #021024; }