/* V104 — single authoritative public header geometry.
   The logo and its text are one shrink-wrapped group. The nav is independent,
   so the brand text can never align to or borrow space from the top tabs. */
.site-header{
  position:sticky!important;
  top:0!important;
  z-index:50!important;
  width:100%!important;
  background:rgba(9,13,16,.96)!important;
  color:#fff!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
}
.site-header .nav{
  width:min(1180px,calc(100% - 40px))!important;
  max-width:1180px!important;
  min-height:72px!important;
  margin:0 auto!important;
  padding:0!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
}
/* The brand has no 250px spacer. Its width is exactly logo + 8px + text. */
.site-header .brand{
  position:relative!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  flex:0 0 auto!important;
  height:38px!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  direction:rtl!important;
  gap:8px!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  color:#fff!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  line-height:1!important;
  font-family:'Vazirmatn',sans-serif!important;
}
.site-header .brand img[data-site-logo],
.site-header .brand .brand-mark{
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  max-width:38px!important;
  max-height:38px!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  object-fit:contain!important;
}
.site-header .brand .brand-mark{
  display:grid!important;
  place-items:center!important;
}
.site-header .brand img[data-site-logo]{
  display:block;
  border:0!important;
}
.site-header .brand-text{
  position:static!important;
  inset:auto!important;
  transform:none!important;
  order:1!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  gap:0!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  font-family:'Vazirmatn',sans-serif!important;
  white-space:nowrap!important;
}
.site-header .brand-text b{
  display:block!important;
  margin:0!important;
  padding:0!important;
  font-family:'Vazirmatn',sans-serif!important;
  font-size:14px!important;
  font-weight:800!important;
  line-height:1.4!important;
  letter-spacing:.04em!important;
  color:#fff!important;
  white-space:nowrap!important;
}
.site-header .brand-text span{
  display:block!important;
  margin:0!important;
  padding:0!important;
  font-family:'Vazirmatn',sans-serif!important;
  font-size:8px!important;
  font-weight:400!important;
  line-height:1.5!important;
  letter-spacing:.12em!important;
  color:#9fa5a6!important;
  white-space:nowrap!important;
}
.site-header .navlinks{
  flex:1 1 auto!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:22px!important;
  margin:0!important;
  padding:0!important;
  font-family:'Vazirmatn',sans-serif!important;
  font-size:12px!important;
  line-height:1.5!important;
  color:#c4c7c7!important;
  white-space:nowrap!important;
}
.site-header .navlinks a{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  height:40px!important;
  margin:0!important;
  padding:0 2px!important;
  font-family:'Vazirmatn',sans-serif!important;
  font-size:12px!important;
  font-weight:500!important;
  line-height:1.5!important;
  color:#c4c7c7!important;
}
/* Auth navigation visibility: hidden must win over the general inline-flex rule. */
.site-header .navlinks a[hidden],
.site-header .navlinks #panelLink[hidden],
.site-header .navlinks #logoutNavBtn[hidden],
.site-header .navlinks #authNavBtn[hidden]{display:none!important}

.site-header .navlinks a:hover,
.site-header .navlinks a.active{color:#fff!important}
.site-header .navlinks a.active:after{
  content:''!important;
  position:absolute!important;
  right:0!important;
  left:0!important;
  bottom:-1px!important;
  width:auto!important;
  height:2px!important;
  background:var(--copper)!important;
}
.site-header .navlinks .nav-cta,
.site-header .navlinks .cta-link{
  height:auto!important;
  padding:10px 16px!important;
  background:linear-gradient(100deg,var(--copper-deep),var(--copper),var(--copper-light))!important;
  color:#17120e!important;
  font-weight:800!important;
  border-radius:3px!important;
}
.site-header .navlinks .nav-cta:hover,
.site-header .navlinks .cta-link:hover{color:#17120e!important}
@media(max-width:900px){
  .site-header .nav{width:min(calc(100% - 28px),1180px)!important}
  .site-header .navlinks{gap:13px!important;overflow:auto!important}
}
@media(max-width:820px){
  .site-header .brand-text b{font-size:13px!important}
  .site-header .brand-text span{font-size:7px!important}
  .site-header .navlinks a:not(.nav-cta):not(.cta-link){display:none!important}
}
@media(max-width:600px){
  .site-header .nav{min-height:62px!important}
  .site-header .brand{height:36px!important}
  .site-header .brand img[data-site-logo],
  .site-header .brand .brand-mark{
    width:36px!important;height:36px!important;min-width:36px!important;flex-basis:36px!important;max-width:36px!important;max-height:36px!important
  }
}


/* V106 — FIX: on Home, site-shared.css is not loaded. The runtime hides the fallback mark
   with inline display:none, but header-unified.css previously forced .brand-mark to
   display:grid !important. That left an invisible 38px fallback slot between the
   real logo image and the brand text. Internal pages had a :has() rule in
   site-shared.css that correctly removed that slot. Keep the same rule here so
   every public page has identical logo/text geometry. */
.site-header .brand:has(img[data-site-logo][style*="display: block"]) .brand-mark{
  display:none!important;
}

/* V105 — explicit auto-sized brand. The Home page contains legacy .brand{width:250px;flex:0 0 250px}; keep the logo anchored and size the brand to its actual contents. */
.site-header .brand{
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  flex:0 0 auto!important;
  flex-basis:auto!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
}
.site-header .brand-text{
  width:auto!important;
  min-width:0!important;
  max-width:none!important;
  flex:0 0 auto!important;
}


/* V114 — one shared source of truth for logo text on every public page.
   The CMS may apply global style_site_name/style_site_tagline inline styles;
   page-specific logo styles are ignored by site-runtime.js. */
.site-header .brand-text,
.site-footer .brand-text {
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  gap:0!important;
  margin:0!important;
  padding:0!important;
  min-width:0!important;
  width:auto!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.site-header .brand-text b,
.site-footer .brand-text b {
  display:block!important;
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  font-family:'Vazirmatn',sans-serif;
  font-size:14px;
  font-weight:800;
  line-height:1.4;
  letter-spacing:.04em;
  color:#fff;
  white-space:nowrap!important;
}
.site-header .brand-text span,
.site-footer .brand-text span {
  display:block!important;
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  font-family:'Vazirmatn',sans-serif;
  font-size:8px;
  font-weight:400;
  line-height:1.5;
  letter-spacing:.12em;
  color:#9fa5a6;
  white-space:nowrap!important;
}
@media(max-width:820px){
  .site-header .brand-text b,.site-footer .brand-text b{font-size:13px}
  .site-header .brand-text span,.site-footer .brand-text span{font-size:7px}
}



/* V115 — remove default browser margins from rich-text tags injected into
   the brand fields by the CMS. Apply only to the five affected inner pages. */
body[data-page-id="about"] .site-header .brand-text h1,
body[data-page-id="about"] .site-header .brand-text h2,
body[data-page-id="about"] .site-header .brand-text h3,
body[data-page-id="about"] .site-header .brand-text p,
body[data-page-id="turning-cnc"] .site-header .brand-text h1,
body[data-page-id="turning-cnc"] .site-header .brand-text h2,
body[data-page-id="turning-cnc"] .site-header .brand-text h3,
body[data-page-id="turning-cnc"] .site-header .brand-text p,
body[data-page-id="milling-cnc"] .site-header .brand-text h1,
body[data-page-id="milling-cnc"] .site-header .brand-text h2,
body[data-page-id="milling-cnc"] .site-header .brand-text h3,
body[data-page-id="milling-cnc"] .site-header .brand-text p,
body[data-page-id="4-axis-cnc"] .site-header .brand-text h1,
body[data-page-id="4-axis-cnc"] .site-header .brand-text h2,
body[data-page-id="4-axis-cnc"] .site-header .brand-text h3,
body[data-page-id="4-axis-cnc"] .site-header .brand-text p,
body[data-page-id="cnc-prototyping"] .site-header .brand-text h1,
body[data-page-id="cnc-prototyping"] .site-header .brand-text h2,
body[data-page-id="cnc-prototyping"] .site-header .brand-text h3,
body[data-page-id="cnc-prototyping"] .site-header .brand-text p {
  display:block!important;
  margin:0!important;
  padding:0!important;
  min-height:0!important;
  line-height:1.05!important;
}

/* V116 — restore a small, intentional gap between the two logo lines.
   Only the Persian heading gets a bottom margin; English tagline remains reset. */
body[data-page-id="about"] .site-header .brand-text h2,
body[data-page-id="turning-cnc"] .site-header .brand-text h2,
body[data-page-id="milling-cnc"] .site-header .brand-text h2,
body[data-page-id="4-axis-cnc"] .site-header .brand-text h2,
body[data-page-id="cnc-prototyping"] .site-header .brand-text h2 {
  margin-bottom:6px!important;
}