@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;500;600&display=swap');

/* V90 typography system.
   IRANYekanX is read from the user's locally installed Windows fonts.
   Font binaries are not bundled into the website. */
@font-face{
  font-family:'BermorYekan';
  src:local('IRANYekanX Regular'),local('IRANYekanX-Regular'),local('IRANYekanX');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:'BermorYekan';
  src:local('IRANYekanX DemiBold'),local('IRANYekanX-DemiBold'),local('IRANYekanX');
  font-style:normal;
  font-weight:600;
  font-display:swap;
}
@font-face{
  font-family:'BermorYekan';
  src:local('IRANYekanX Bold'),local('IRANYekanX-Bold'),local('IRANYekanX');
  font-style:normal;
  font-weight:700;
  font-display:swap;
}

:root{
  --bermor-font-fa:'BermorYekan','IRANYekanX','IRANYekanX Regular',Tahoma,'Segoe UI',Arial,sans-serif;
  --bermor-font-latin:'Bai Jamjuree','Segoe UI',Arial,sans-serif;
}

html[lang='fa'] body{font-family:var(--bermor-font-fa) !important;font-weight:400 !important;}
html[lang='en'] body,
html[lang='de'] body,
html[lang='fr'] body{font-family:var(--bermor-font-latin) !important;font-weight:400 !important;}

html[lang='fa'] :where(button,input,textarea,select,option,a,p,span,strong,small,em,b,i,li,dt,dd,h1,h2,h3,h4,h5,h6,label,.team-code),
html[lang='fa'] :where(.menu-section-trigger,.service-submenu__item,.service-pricing__label,.service-pricing__value){font-family:var(--bermor-font-fa) !important;}

html[lang='en'] :where(button,input,textarea,select,option,a,p,span,strong,small,em,b,i,li,dt,dd,h1,h2,h3,h4,h5,h6,label,.team-code),
html[lang='de'] :where(button,input,textarea,select,option,a,p,span,strong,small,em,b,i,li,dt,dd,h1,h2,h3,h4,h5,h6,label,.team-code),
html[lang='fr'] :where(button,input,textarea,select,option,a,p,span,strong,small,em,b,i,li,dt,dd,h1,h2,h3,h4,h5,h6,label,.team-code),
html[lang='en'] :where(.menu-section-trigger,.service-submenu__item,.service-pricing__label,.service-pricing__value),
html[lang='de'] :where(.menu-section-trigger,.service-submenu__item,.service-pricing__label,.service-pricing__value),
html[lang='fr'] :where(.menu-section-trigger,.service-submenu__item,.service-pricing__label,.service-pricing__value){font-family:var(--bermor-font-latin) !important;}

/* Persian: main titles Bold, sub titles DemiBold, body Regular. */
html[lang='fa'] :where(h1,h2,.typo-main-title,.team-card__meta span,.team-directory-card__text strong){font-weight:700 !important;}
html[lang='fa'] :where(h3,h4,h5,h6,.typo-sub-title,.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link,.team-card__meta strong,.team-directory-card__text small,.service-tile__title,.service-panel__title,.service-detail__title){font-weight:600 !important;}
html[lang='fa'] :where(p,li,.typo-body){font-weight:400 !important;}

/* EN / DE / FR: titles Medium with SemiBold initials; body Regular with Medium initials. */
html[lang='en'] :where(h1,h2,h3,h4,h5,h6,.typo-main-title,.typo-sub-title,.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link,.team-card__meta,.team-directory-card__text,.service-tile__title,.service-panel__title,.service-detail__title),
html[lang='de'] :where(h1,h2,h3,h4,h5,h6,.typo-main-title,.typo-sub-title,.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link,.team-card__meta,.team-directory-card__text,.service-tile__title,.service-panel__title,.service-detail__title),
html[lang='fr'] :where(h1,h2,h3,h4,h5,h6,.typo-main-title,.typo-sub-title,.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link,.team-card__meta,.team-directory-card__text,.service-tile__title,.service-panel__title,.service-detail__title){font-weight:500 !important;}

.bermor-word{font-weight:inherit;}
.bermor-initial--title{font-weight:600 !important;}
.bermor-initial--text{font-weight:500 !important;}
html[lang='en'] .portfolio-initial,
html[lang='de'] .portfolio-initial,
html[lang='fr'] .portfolio-initial{font-weight:600 !important;}

/* =========================================================
   V92 — keep Latin first-letter styling inline inside team cards
   Previous generic .team-card__meta span rules made the typography
   helper spans block-level, causing words/letters to stack vertically.
   ========================================================= */
html[lang='en'] .team-card__meta .bermor-word,
html[lang='de'] .team-card__meta .bermor-word,
html[lang='fr'] .team-card__meta .bermor-word,
html[lang='en'] .team-card__meta .bermor-initial--title,
html[lang='de'] .team-card__meta .bermor-initial--title,
html[lang='fr'] .team-card__meta .bermor-initial--title,
html[lang='en'] .team-card__meta .bermor-initial--text,
html[lang='de'] .team-card__meta .bermor-initial--text,
html[lang='fr'] .team-card__meta .bermor-initial--text,
html[lang='en'] .team-directory-card__text .bermor-word,
html[lang='de'] .team-directory-card__text .bermor-word,
html[lang='fr'] .team-directory-card__text .bermor-word,
html[lang='en'] .team-directory-card__text .bermor-initial--title,
html[lang='de'] .team-directory-card__text .bermor-initial--title,
html[lang='fr'] .team-directory-card__text .bermor-initial--title,
html[lang='en'] .team-directory-card__text .bermor-initial--text,
html[lang='de'] .team-directory-card__text .bermor-initial--text,
html[lang='fr'] .team-directory-card__text .bermor-initial--text{
  display:inline !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  font-size:inherit !important;
  line-height:inherit !important;
  white-space:nowrap !important;
}

html[lang='en'] .team-card__meta,
html[lang='de'] .team-card__meta,
html[lang='fr'] .team-card__meta{
  direction:ltr !important;
  text-align:right !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  hyphens:none !important;
}

html[lang='en'] .team-card__meta > strong,
html[lang='de'] .team-card__meta > strong,
html[lang='fr'] .team-card__meta > strong,
html[lang='en'] .team-card__meta > span,
html[lang='de'] .team-card__meta > span,
html[lang='fr'] .team-card__meta > span{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
}


/* =========================================================
   V110 — menu typography one weight lighter
   ========================================================= */
html[lang='fa'] :where(.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link){font-weight:500 !important;}
html[lang='en'] :where(.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link),
html[lang='fr'] :where(.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link),
html[lang='de'] :where(.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link){font-weight:400 !important;}
html[lang='en'] :where(.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link) .bermor-initial--title,
html[lang='fr'] :where(.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link) .bermor-initial--title,
html[lang='de'] :where(.menu-title,.menu-submenu a,.menu-blog,.menu-doc-link) .bermor-initial--title{font-weight:500 !important;}

/* =========================================================
   V134 — shared site background texture
   The supplied RGBA PNG is used byte-for-byte, over the existing white
   page surface and below page content. Existing design bands/lines such
   as the header strip, showcase separator surfaces, and footer bands keep
   their own backgrounds because they are intentionally not targeted here.
   ========================================================= */
:root{
  --bermor-site-bg-image:url('../assets/site/Site BG.png');
}
html{
  background:#fff !important;
}
body,
.hero,
.services-hub,
.showreel-section,
.showreel-frame,
.portfolio-logo-matrix,
.team-showcase,
.team-directory,
.safe-page-main,
.visual-archive-page,
.audio-archive-main,
.portfolio-artwork-main,
.portfolio-page-main,
.pazza-page-main,
.person-page,
.doc-shell,
.berlog-page,
.agency-page{
  background-color:#fff !important;
  background-image:var(--bermor-site-bg-image) !important;
  background-repeat:no-repeat !important;
  background-position:center top !important;
  background-size:cover !important;
  background-attachment:fixed !important;
}

/* iOS/Safari can repaint fixed backgrounds during viewport resizing.
   Keep the same image and white base, but scroll it normally on touch-sized
   viewports so there is no resize flash or jump. */
@media (max-width:820px){
  body,
  .hero,
  .services-hub,
  .showreel-section,
  .showreel-frame,
  .portfolio-logo-matrix,
  .team-showcase,
  .team-directory,
  .safe-page-main,
  .visual-archive-page,
  .audio-archive-main,
  .portfolio-artwork-main,
  .portfolio-page-main,
  .pazza-page-main,
  .person-page,
  .doc-shell,
  .berlog-page,
  .agency-page{
    background-attachment:scroll !important;
  }
}

/* =========================================================
   V135 — one continuous site background, no section resets / scroll jumps
   The new Site BG PNG is used once on body. Page surfaces that V134 painted
   independently are transparent now, so scrolling never restarts the texture.
   Existing header/footer/separator bands keep their own backgrounds.
   ========================================================= */
:root{
  --bermor-site-bg-image:url('../assets/site/Site BG.png');
}
html{
  background:#fff !important;
}
body{
  background-color:#fff !important;
  background-image:var(--bermor-site-bg-image) !important;
  background-repeat:repeat-y !important;
  background-position:center top !important;
  background-size:min(100vw, 2048px) auto !important;
  background-attachment:scroll !important;
}
.hero,
.services-hub,
.showreel-section,
.showreel-frame,
.portfolio-logo-matrix,
.team-showcase,
.team-directory,
.safe-page-main,
.visual-archive-page,
.audio-archive-main,
.portfolio-artwork-main,
.portfolio-page-main,
.pazza-page-main,
.person-page,
.doc-shell,
.berlog-page,
.agency-page{
  background-color:transparent !important;
  background-image:none !important;
  background-attachment:scroll !important;
}