/* Shared site header: homepage, account workflows, and public events. */
@font-face { font-family: Shabnam; src: url('/fonts/shabnam/Shabnam.woff2') format('woff2'); font-weight: 400; font-display: swap; }
@font-face { font-family: Shabnam; src: url('/fonts/shabnam/Shabnam-Medium.woff2') format('woff2'); font-weight: 500; font-display: swap; }
@font-face { font-family: Shabnam; src: url('/fonts/shabnam/Shabnam-Bold.woff2') format('woff2'); font-weight: 600 700; font-display: swap; }
:root { --ui-font: Shabnam, Tahoma, Arial, sans-serif; --serif: Georgia, 'Times New Roman', serif; }
:root:lang(fa), :root:lang(ar) { --serif: var(--ui-font); }
html { scroll-padding-top: var(--header-clearance, 140px); }
.header {
  position: sticky;
  top: 12px;
  z-index: 10;
  width: 100%;
  max-width: none;
  margin: 12px 0 0;
  padding: 0;
  display: block;
  border: 0;
  border-block: 1px solid var(--line);
  border-radius: 0;
  background: var(--paper);
  box-shadow: 0 8px 32px #24324b12, inset 0 1px 0 #ffffffb3;
  color: var(--ink);
  font: 400 1rem/1.75 var(--ui-font);
}
@supports ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
  .header {
    background: rgb(238 241 246 / 76%);
    border-color: rgb(255 255 255 / 80%);
    -webkit-backdrop-filter: blur(18px) saturate(150%);
    backdrop-filter: blur(18px) saturate(150%);
  }
}
.header .nav {
  width: min(1200px, calc(100% - 48px));
  margin-inline: auto;
  display: flex;
  align-items: center;
  gap: 45px;
  min-height: 94px;
}
.header a { color: inherit; text-decoration: none; }
.header a, .header button { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.header a:focus-visible, .header button:focus-visible { outline: 3px solid var(--focus); outline-offset: 5px; }
.header .brand {
  --brand-mark-size: 40px;
  display: grid;
  grid-template-columns: var(--brand-mark-size) auto;
  grid-template-rows: var(--brand-mark-size) auto;
  align-items: center;
  column-gap: 12px;
  row-gap: 8px;
  justify-items: start;
  flex-shrink: 0;
  font-size: 1rem;
  font-weight: 400;
}
.header .mark { width: var(--brand-mark-size); height: var(--brand-mark-size); object-fit: contain; }
.header .brand-name { font-family: var(--serif); font-size: 32px; line-height: 1; letter-spacing: 2px; align-self: center; }
.header .brand-sub { grid-column: 1 / -1; font-size: 0.875rem; letter-spacing: 0.06em; text-transform: uppercase; margin: 0; text-align: start; display: block; }
.header .navlinks { display: flex; align-items: center; gap: 29px; margin-inline: auto; font-size: 1rem; }
.header .navlinks a { white-space: nowrap; padding: 34px 8px; position: relative; }
.header .navlinks a[data-header-section]:focus { outline: none; box-shadow: none; }
.header .navlinks a[data-header-section]::after { content: ''; position: absolute; bottom: 20px; inset-inline: 8px; height: 2px; background: transparent; }
.header .navlinks a[aria-current=location]::after { background: var(--accent); }
.header .navlinks a[data-header-section]:focus-visible::after { background: var(--focus); }
.header .navlinks a:hover { color: var(--muted); }
.header .actions { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 19px; font-size: 1rem; }
.header .actions > a { white-space: nowrap; flex-shrink: 0; }
.header .text-btn { min-height: 44px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 0; font-size: 1rem; }
.header .text-btn:hover { color: var(--muted); }
.header .menu-toggle {
  display: none;
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  background: none;
  color: inherit;
  border: 1px solid var(--line);
  padding: 0;
  border-radius: 3px;
  font: inherit;
  cursor: pointer;
}
.header .menu-toggle:hover:not(:disabled) { background: var(--soft); border-color: var(--line); }
[dir=rtl] .header .brand-name, [dir=rtl] .header .brand-sub { letter-spacing: 0; }
@media (max-width: 1200px) {
  .header .nav { flex-wrap: wrap; min-height: 80px; padding-block: 17px; gap: 16px; }
  .header .navlinks { display: none; order: 4; flex-basis: 100%; gap: 0; justify-content: space-between; border-top: 1px solid var(--line); }
  .header .navlinks.open { display: flex; flex-direction: column; align-items: stretch; max-height: calc(100dvh - 160px); overflow-y: auto; }
  .header .navlinks a { align-self: flex-start; min-height: 44px; padding: 12px 8px; }
  .header .navlinks .text-btn { align-self: stretch; border-top: 1px solid var(--line); margin-top: 8px; font-weight: 600; }
  .header .navlinks a[data-header-section]::after { bottom: 6px; }
  .header .actions { margin-inline-start: auto; gap: 12px; }
  .header .menu-toggle { display: inline-flex; }
}
@media (max-width: 800px) {
  .header .brand { --brand-mark-size: 32px; }
  .header .brand-name { font-size: 28px; }
}
@media (max-width: 580px) {
  .header { top: 8px; margin-top: 8px; }
  .header .nav { width: calc(100% - 32px); gap: 10px; padding-block: 12px; justify-content: space-between; }
  .header .brand { --brand-mark-size: 28px; grid-template-columns: var(--brand-mark-size) minmax(0, 1fr); column-gap: 10px; row-gap: 6px; max-inline-size: calc(100% - 138px); }
  .header .brand-sub { overflow-wrap: anywhere; }
  .header .brand-name { font-size: 25px; }
  .header .actions { flex-basis: auto; flex-wrap: nowrap; justify-content: flex-end; margin-inline-start: auto; gap: 8px; }
  .header .navlinks a { font-size: 0.875rem; }
}
@media (forced-colors: active) {
  .header { background: Canvas; border-color: CanvasText; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .header .navlinks a[aria-current=location]::after,
  .header .navlinks a[data-header-section]:focus-visible::after { background: CanvasText; forced-color-adjust: none; }
}
