/* EMKAN v154 — final visual hardening requested 1405/06/28 */

/* 1) One site-wide geometry rule: blue/header line narrower, lower/context line wider. */
@media (min-width:1280px){
  :root{--emkan-v154-header-width:min(1296px,calc(100vw - 120px));}
  html body .page-shell>.site-header,html body .site-header{width:var(--emkan-v154-header-width)!important;max-width:var(--emkan-v154-header-width)!important;margin-left:calc((100% - var(--emkan-v154-header-width))/2)!important;margin-right:calc((100% - var(--emkan-v154-header-width))/2)!important;left:auto!important;right:auto!important;transform:none!important}
  
}
@media (min-width:901px) and (max-width:1279px){
  :root{--emkan-v154-header-width:min(1080px,calc(100vw - 88px));}
  html body .page-shell>.site-header,html body .site-header{width:var(--emkan-v154-header-width)!important;max-width:var(--emkan-v154-header-width)!important;margin-left:calc((100% - var(--emkan-v154-header-width))/2)!important;margin-right:calc((100% - var(--emkan-v154-header-width))/2)!important;left:auto!important;right:auto!important;transform:none!important}
  
}

/* 2) Architecture + Civil project listings: restore approved cover scale and the vertical rhythm of Civil/Execution. */
@media (min-width:901px){
  html body .architecture-main .projects-layout{margin-top:clamp(46px,6vh,64px)!important}
  html body .architecture-main .gallery-items-container{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(38px,4.7vw,62px) clamp(26px,3vw,48px)!important}
  html body .architecture-main .gallery-item{width:100%!important;max-width:none!important;justify-self:stretch!important}
  html body .architecture-main .img-wrapper{width:100%!important;aspect-ratio:1/1!important}
  /* cancel short-viewport rules that had reduced project cards to 142/156px */
  html body .architecture-main .gallery-items-container{justify-content:stretch!important}
}

/* Project detail stage should not stick to the lower line. */
@media (min-width:901px){
  html body .project-main{margin-top:26px!important}
}

/* 3) Learning-resource tree: hairline passes through the exact diamond centres. */
@media (min-width:721px){
  html[lang=fa] body.content-section-page #contentApp .learning-side>.learning-tree,
  html[lang=ar] body.content-section-page #contentApp .learning-side>.learning-tree,
  html[lang=fa] body.emkan-v149-learning-resource #contentApp .learning-tree,
  html[lang=ar] body.emkan-v149-learning-resource #contentApp .learning-tree{
    position:relative!important;direction:rtl!important;padding:0 23px 0 0!important;margin:0!important
  }
  html[lang=fa] body.content-section-page #contentApp .learning-side>.learning-tree::before,
  html[lang=ar] body.content-section-page #contentApp .learning-side>.learning-tree::before,
  html[lang=fa] body.emkan-v149-learning-resource #contentApp .learning-tree::before,
  html[lang=ar] body.emkan-v149-learning-resource #contentApp .learning-tree::before{
    display:block!important;content:""!important;position:absolute!important;top:11px!important;bottom:11px!important;left:auto!important;right:4px!important;inset-inline-start:auto!important;inset-inline-end:auto!important;width:1px!important;background:var(--line)!important
  }
  html[lang=fa] body.content-section-page #contentApp .learning-side .learning-branch::before,
  html[lang=ar] body.content-section-page #contentApp .learning-side .learning-branch::before,
  html[lang=fa] body.emkan-v149-learning-resource #contentApp .learning-branch::before,
  html[lang=ar] body.emkan-v149-learning-resource #contentApp .learning-branch::before{
    display:block!important;content:""!important;position:absolute!important;top:50%!important;left:auto!important;right:-22px!important;inset-inline-start:auto!important;inset-inline-end:auto!important;width:7px!important;height:7px!important;box-sizing:border-box!important;transform:translateY(-50%) rotate(45deg)!important
  }
  html[lang=en] body.content-section-page #contentApp .learning-side>.learning-tree,
  html[lang=en] body.emkan-v149-learning-resource #contentApp .learning-tree{position:relative!important;direction:ltr!important;padding:0 0 0 23px!important;margin:0!important}
  html[lang=en] body.content-section-page #contentApp .learning-side>.learning-tree::before,
  html[lang=en] body.emkan-v149-learning-resource #contentApp .learning-tree::before{display:block!important;content:""!important;position:absolute!important;top:11px!important;bottom:11px!important;right:auto!important;left:4px!important;inset-inline-start:auto!important;inset-inline-end:auto!important;width:1px!important;background:var(--line)!important}
  html[lang=en] body.content-section-page #contentApp .learning-side .learning-branch::before,
  html[lang=en] body.emkan-v149-learning-resource #contentApp .learning-branch::before{display:block!important;content:""!important;position:absolute!important;top:50%!important;right:auto!important;left:-22px!important;inset-inline-start:auto!important;inset-inline-end:auto!important;width:7px!important;height:7px!important;box-sizing:border-box!important;transform:translateY(-50%) rotate(45deg)!important}
}
@media (max-width:720px){
  html body.content-section-page #contentApp .v69-content-search-rail>.learning-side .learning-tree{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:0 14px!important;padding:0!important;margin:0!important}
  html body.content-section-page #contentApp .v69-content-search-rail>.learning-side .learning-tree::before,
  html body.content-section-page #contentApp .v69-content-search-rail>.learning-side .learning-branch::before{display:none!important;content:none!important}
  html body.content-section-page #contentApp .v69-content-search-rail>.learning-side .learning-branch{transform:none!important;min-height:34px!important;padding:7px 0!important;border-bottom:1px solid var(--line)!important}
}

/* 4) One hover language for all public image cards. No parent movement = no shake. */
html body :is(.project-card,.category-card,.v49-card,.v49-course,.v49-work-card,.civil-entry-card,.store-card,.product-card,.person-card,.team-preview,.vthumb,.research-entry,.related-item){transform:none!important;backface-visibility:hidden!important}
html body :is(.img-wrapper,.category-media,.category-square,.v49-card-media,.v49-course-cover,.v49-course-media,.v49-work-media,.civil-entry-media,.store-big,.store-small,.store-card-media,.product-card-media,.product-main-image,.person-card-media,.team-portrait,.vthumb-media,.research-index-media,.article-cover,.people-photo){overflow:hidden!important;backface-visibility:hidden!important;transform:translateZ(0)!important}
html body :is(.img-wrapper img,.category-media img,.v49-card-media img,.v49-course-cover img,.v49-course-media img,.v49-work-media img,.civil-entry-media img,.store-big img,.store-small img,.store-card-media img,.product-card-media img,.product-main-image img,.person-card-media img,.team-portrait img,.vthumb-media img,.vthumb-media video,.research-index-media img,.article-cover img,.people-photo img){filter:grayscale(100%)!important;transform:scale(1.002) translateZ(0)!important;transform-origin:center center!important;will-change:transform,filter,opacity;transition:filter .62s ease,opacity .34s ease,transform .72s cubic-bezier(.22,.61,.36,1)!important}
@media (hover:hover) and (pointer:fine){
  html body :is(.project-card,.category-card,.v49-card,.v49-course,.v49-work-card,.civil-entry-card,.store-card,.product-card,.person-card,.team-preview,.vthumb,.research-entry,.related-item):is(:hover,:focus-visible,:focus-within) :is(.img-wrapper img,.category-media img,.v49-card-media img,.v49-course-cover img,.v49-course-media img,.v49-work-media img,.civil-entry-media img,.store-big img,.store-small img,.store-card-media img,.product-card-media img,.product-main-image img,.person-card-media img,.team-portrait img,.vthumb-media img,.vthumb-media video,.research-index-media img,.article-cover img,.people-photo img){filter:grayscale(0%)!important;opacity:1!important;transform:scale(1.03) translateZ(0)!important}
  html body .vthumb.is-selected :is(.vthumb-media img,.vthumb-media video){filter:grayscale(0%)!important;opacity:1!important;transform:scale(1.03) translateZ(0)!important}
}