/* EMKAN v108 — final requested production refinements. */

/* 1) Context/address links below the global menu must remain clickable on desktop too. */
:is(.emkan-context-bar,.podcast-context-bar,.store-context-bar,.product-toolbar){position:relative!important;isolation:isolate!important;z-index:4000!important}
:is(.emkan-context-path,#podcastPath,#storeCategoryPath,#productPath,.product-context-path){position:relative!important;z-index:4001!important;pointer-events:auto!important}
:is(.emkan-context-path,#podcastPath,#storeCategoryPath,#productPath,.product-context-path) a.emkan-crumb{position:relative!important;z-index:4002!important;display:inline!important;pointer-events:auto!important;cursor:pointer!important;text-decoration:none!important}
:is(.emkan-context-bar,.podcast-context-bar,.store-context-bar,.product-toolbar)::before,
:is(.emkan-context-bar,.podcast-context-bar,.store-context-bar,.product-toolbar)::after{pointer-events:none!important}

/* 6) Welcome wordmark: only on phones, slightly stronger stroke and closer letters. */
@media(max-width:700px){
  .welcome{--line-width:1.16;--letter-gap:clamp(2px,.62vw,4px);--tight-factor:.54}
}
@media(max-width:360px){.welcome{--line-width:1.12;--letter-gap:2px}}

/* 7 + 8) Course detail gallery replaces the extra single cover. One color main image,
   three square monochrome thumbnails, and one centered CTA directly below. */
body.v90-education-item-page #contentApp .learning-course-cover{display:none!important}
body.v90-education-item-page #contentApp .v106-course-gallery{
  display:grid!important;grid-template-columns:minmax(0,1fr) clamp(92px,14vw,142px)!important;
  gap:8px!important;width:100%!important;height:auto!important;aspect-ratio:auto!important;
  align-items:stretch!important;margin:18px 0 12px!important;direction:ltr!important
}
body.v90-education-item-page #contentApp .v106-course-gallery-main{height:100%!important;min-height:0!important;aspect-ratio:auto!important}
body.v90-education-item-page #contentApp .v106-course-gallery-main img{filter:none!important;opacity:1!important}
body.v90-education-item-page #contentApp .v106-course-gallery-thumbs{display:grid!important;grid-template-rows:repeat(3,auto)!important;gap:8px!important;align-content:start!important}
body.v90-education-item-page #contentApp .v106-course-thumb{width:100%!important;height:auto!important;aspect-ratio:1/1!important;min-height:0!important}
body.v90-education-item-page #contentApp .v106-course-thumb img{width:100%!important;height:100%!important;object-fit:cover!important;filter:grayscale(100%)!important;opacity:.82!important}
body.v90-education-item-page #contentApp .v106-course-thumb:is(:hover,:focus-visible,.is-active) img{filter:grayscale(100%)!important;opacity:1!important}
body.v90-education-item-page #contentApp .v106-course-single-action{width:100%!important;margin:0 0 26px!important;display:flex!important;justify-content:center!important;align-items:center!important}
body.v90-education-item-page #contentApp .v106-course-single-action .v49-button{min-width:190px!important;text-align:center!important;justify-content:center!important}
@media(max-width:620px){
  body.v90-education-item-page #contentApp .v106-course-gallery{grid-template-columns:minmax(0,1fr) clamp(72px,24vw,104px)!important;gap:6px!important;margin-top:12px!important}
  body.v90-education-item-page #contentApp .v106-course-gallery-thumbs{gap:6px!important}
}

/* 9) Content Creation covers stay two-column on phones across its main cover grids. */
@media(max-width:700px){
  body.emkan-content-landing .module-main .category-grid,
  body.emkan-content-landing .module-main .category-grid.category-grid--five,
  body.content-section-page #contentApp :is(.v49-grid,.v49-work-grid,.v74-level2-grid,.v74-sample-grid,.v73-portfolio-grid){
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;max-width:none!important;
    gap:24px 12px!important;justify-content:stretch!important;align-items:start!important
  }
  body.emkan-content-landing .module-main .category-card,
  body.content-section-page #contentApp :is(.category-card,.v49-work-card,.v71-sample-card){width:100%!important;max-width:none!important;min-width:0!important;margin:0!important;justify-self:stretch!important}
}

/* 10) Mobile language rail stays inside the header in Persian and Arabic. */
@media(max-width:900px){
  .site-header .nav-frame{grid-template-columns:70px minmax(0,1fr) 70px!important}
  .site-header .language-button{max-width:68px!important;width:68px!important;min-width:0!important;margin-left:0!important;padding:0 2px!important;overflow:hidden!important;justify-content:flex-start!important}
  .site-header .language-direct-choice{min-width:18px!important;font-size:8.4px!important;letter-spacing:.01em!important;flex:0 0 auto!important}
  .site-header .language-direct-divider{margin-inline:2px!important;flex:0 0 auto!important}
}
@media(max-width:360px){
  .site-header .nav-frame{grid-template-columns:62px minmax(0,1fr) 62px!important}
  .site-header .language-button{width:60px!important;max-width:60px!important}
  .site-header .language-direct-choice{min-width:17px!important;font-size:7.8px!important}
  .site-header .language-direct-divider{margin-inline:1px!important}
}

/* 11) On touch layouts, cover titles live only under the covers, never over imagery. */
@media(max-width:900px){
  :is(.category-square,.store-square,.product-card-media,.v49-work-media,.research-index-media,.img-wrapper)
  :is(.category-name,.category-overlay,.category-glass,.store-overlay,.store-glass,.cover-title,.image-title,.media-title){display:none!important}
  :is(.category-square,.store-square,.product-card-media,.v49-work-media,.research-index-media,.img-wrapper)::before,
  :is(.category-square,.store-square,.product-card-media,.v49-work-media,.research-index-media,.img-wrapper)::after{pointer-events:none!important}
}

/* 12) About tree labels: only a tiny mobile readability increase. */
@media(max-width:640px){
  .about-main .practice-button .axis-name,.practice-button .axis-name{font-size:11.2px!important;line-height:1.62!important}
}

/* 13) Team: populated images, slightly smaller mobile cards, slightly clearer type. */
@media(max-width:700px){
  .people-grid{width:94%!important;margin-inline:auto!important;gap:20px 12px!important}
  .person-card-media,.person-card.is-senior .person-card-media{aspect-ratio:1/1!important}
  .person-card-media img{filter:none!important;opacity:1!important;object-fit:cover!important}
  .person-card-name{font-size:12px!important;font-weight:560!important;line-height:1.55!important}
  .person-card-role{font-size:9.4px!important;line-height:1.55!important}
}


/* v108 hardening — final pass */
/* With ACCOUNT added, the tablet main menu now has an even 8-item grid. */
@media (min-width:561px) and (max-width:980px){
  .menu-list .menu-cell:last-child{grid-column:auto!important;justify-self:stretch!important;width:auto!important}
}

/* Keep the under-header address row above decorative/transition layers on pointer devices. */
@media (min-width:901px){
  .emkan-context-bar,.podcast-context-bar,.store-context-bar,.product-toolbar{z-index:10020!important;pointer-events:auto!important}
  .emkan-context-bar *, .podcast-context-bar *, .store-context-bar *, .product-toolbar *{pointer-events:auto!important}
}

/* Content landing mobile cards: old responsive rules in earlier bundles must not collapse this to one column. */
@media(max-width:700px){
  body.emkan-content-landing #categoryGrid.category-grid,
  body.emkan-content-landing #categoryGrid.category-grid.category-grid--five{
    display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    grid-auto-flow:row!important;column-gap:12px!important;row-gap:24px!important;
  }
  body.emkan-content-landing #categoryGrid > .category-card{display:block!important;width:100%!important;min-width:0!important;max-width:none!important}
}

/* Team mobile tightening is intentionally subtle. */
@media(max-width:700px){
  .people-grid{width:92%!important}
  .person-card-caption{gap:7px!important}
  .person-card-name{font-size:12.2px!important;font-weight:600!important}
  .person-card-role{font-size:9.6px!important;font-weight:430!important}
}
