/*
 * BAOI 5.3.33.2.1 — visible page optimization.
 * Loaded after the 5.3.33.2 token/family foundation and intentionally uses
 * higher-specificity family scopes to override historical per-module geometry.
 */
body.baoi-ux-v533321{
  --baoi-v533321-page-max:1280px;
  --baoi-v533321-reading-max:1080px;
  --baoi-v533321-copy-max:72ch;
  --baoi-v533321-gap:clamp(18px,2.2vw,30px);
  --baoi-v533321-radius:18px;
}

/* Self-contained apps/hubs already ship their own hero/H1. Remove the second
   WordPress/page-navigation shell that was visible in the video. */
body.baoi-ux-v533321.baoi-self-contained-v533321 .entry-header,
body.baoi-ux-v533321.baoi-self-contained-v533321 header.entry-header,
body.baoi-ux-v533321.baoi-self-contained-v533321 .ast-single-post .entry-header{
  display:none!important;
}
body.baoi-ux-v533321.baoi-self-contained-v533321 :where(
  .boai-breadcrumbs,.boai-toc,.boai-topic-context,.boai-reading-time,.boai-fav-inline
){display:none!important}
body.baoi-ux-v533321.baoi-self-contained-v533321 :where(
  #primary,.content-area,.site-main,article.page,.ast-article-single,.entry-content,.wp-block-post-content
){
  margin-top:0!important;
  padding-top:0!important;
  min-height:0!important;
  box-sizing:border-box!important;
}
body.baoi-ux-v533321.baoi-self-contained-v533321 :where(article.page,.ast-article-single){
  margin-bottom:0!important;
  padding-bottom:0!important;
  box-shadow:none!important;
  border:0!important;
  background:transparent!important;
}
body.baoi-ux-v533321.baoi-self-contained-v533321 .entry-content{
  margin-bottom:0!important;
  padding-bottom:0!important;
}
body.baoi-ux-v533321.baoi-self-contained-v533321 .site-content>.ast-container,
body.baoi-ux-v533321.baoi-self-contained-v533321 #content>.ast-container{
  padding-top:0!important;
  padding-bottom:0!important;
}

/* Self-contained roots: one real page surface, not a page inside a page. */
body.baoi-ux-v533321.baoi-self-contained-v533321 :where(
 .boai-hub,.boai-guides-app,.boai-scripts-hub,.boai-pannes-app,.boai-errors-app,
 .boai-memo-app,.boai-software-app,.boai-center,.boai-event-app,.boai-comparisons-app,
 .boai-favorites-app,.boai-da,.baoi-native-tool-page,.boai-tool-app,.boai-calc-app,
 .boai-builder-app,.boai-modeles,.boai-infra-app,.boai-cyber,.boai-wp-app,.boai-fgt-app,
 .boai-mail-app,.boai-vmw-app,.boai-pra-app
){
  width:min(100%,var(--baoi-v533321-page-max))!important;
  max-width:var(--baoi-v533321-page-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Hub hero density: visible improvement above the fold. */
body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub,.boai-guides-app,.boai-scripts-hub){
  padding-top:18px!important;
  padding-bottom:44px!important;
}
body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub-hero,.boai-guides-hero,.boai-scripts-hero){
  padding:clamp(24px,3vw,32px)!important;
  margin-bottom:18px!important;
  border-radius:20px!important;
  box-shadow:0 14px 38px rgba(0,0,0,.14)!important;
}
body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub-hero,.boai-guides-hero,.boai-scripts-hero) h1{
  font-size:clamp(2rem,3.3vw,2.8rem)!important;
  line-height:1.04!important;
  margin-top:6px!important;
  margin-bottom:8px!important;
  letter-spacing:-.03em!important;
}
body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub-hero,.boai-guides-hero,.boai-scripts-hero)>p{
  max-width:760px!important;
  font-size:1rem!important;
  line-height:1.55!important;
  margin-bottom:0!important;
}
body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub-search,.boai-scripts-toolbar,.boai-guides-filter){
  margin-top:16px!important;
}
body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub-group,.boai-guides-grid,.boai-scripts-grid){
  margin-top:20px!important;
}

/* Explorer was preceded by an unrelated favourites bar and had a very tall hero. */
body.baoi-ux-v533321.baoi-family-explorer .boai-hub{padding-top:8px!important}
body.baoi-ux-v533321.baoi-family-explorer .boai-hub-group{margin:24px 0!important}
body.baoi-ux-v533321.baoi-family-explorer .boai-hub-card{
  min-height:138px!important;
  padding:16px!important;
  border-radius:14px!important;
}

/* Diagnostic Analyzer: the app itself is the hero. Remove outer dead space and
   keep the bottom of the application close to the footer. */
body.baoi-ux-v533321.baoi-family-diagnostic_analyzer .baoi-da{
  padding-top:18px!important;
  padding-bottom:34px!important;
}
body.baoi-ux-v533321.baoi-family-diagnostic_analyzer .baoi-da__hero{
  margin-top:0!important;
  border-radius:22px!important;
}
body.baoi-ux-v533321.baoi-family-diagnostic_analyzer :where(.site-main,article.page,.entry-content){
  padding-bottom:0!important;
  margin-bottom:0!important;
}
body.baoi-ux-v533321.baoi-family-diagnostic_analyzer .boai-support-footerbar{
  margin-top:18px!important;
}

/* Reading pages: keep navigation useful but make it a compact context rail
   instead of 4 large stacked boxes before the actual article. */
body.baoi-ux-v533321.baoi-shell-reading .site-main,
body.baoi-ux-v533321.baoi-shell-reading article.page,
body.baoi-ux-v533321.baoi-shell-reading article.post,
body.baoi-ux-v533321.baoi-shell-reading .ast-article-single{
  width:min(100%,var(--baoi-v533321-reading-max))!important;
  max-width:var(--baoi-v533321-reading-max)!important;
}
body.baoi-ux-v533321.baoi-shell-reading .entry-header{margin-bottom:14px!important}
body.baoi-ux-v533321.baoi-shell-reading .entry-title,
body.baoi-ux-v533321.baoi-shell-reading h1.entry-title{
  max-width:22ch!important;
  font-size:clamp(2.15rem,4vw,3.25rem)!important;
  line-height:1.02!important;
  letter-spacing:-.035em!important;
}
body.baoi-ux-v533321.baoi-shell-reading .boai-breadcrumbs{
  margin:0 0 12px!important;
  font-size:12px!important;
}
body.baoi-ux-v533321.baoi-shell-reading .boai-toc{
  margin:0 0 10px!important;
  border-radius:12px!important;
}
body.baoi-ux-v533321.baoi-shell-reading .boai-toc-toggle{
  min-height:44px!important;
  padding:9px 12px!important;
  font-size:.9rem!important;
}
body.baoi-ux-v533321.baoi-shell-reading .boai-toc-toggle span:last-child{
  width:24px!important;height:24px!important;border-radius:7px!important;font-size:17px!important;
}
body.baoi-ux-v533321.baoi-shell-reading .boai-topic-context,
body.baoi-ux-v533321.baoi-shell-reading .boai-reading-time,
body.baoi-ux-v533321.baoi-shell-reading .boai-fav-inline{
  display:inline-flex!important;
  width:auto!important;
  max-width:100%!important;
  min-height:34px!important;
  margin:0 7px 12px 0!important;
  padding:6px 9px!important;
  vertical-align:top!important;
  border-radius:10px!important;
  font-size:12px!important;
  line-height:1.25!important;
}
body.baoi-ux-v533321.baoi-shell-reading .boai-fav-inline{
  background:rgba(13,25,42,.55)!important;
  gap:7px!important;
}
body.baoi-ux-v533321.baoi-shell-reading .boai-fav-button{
  min-height:30px!important;
  padding:4px 8px!important;
  border-radius:8px!important;
}
body.baoi-ux-v533321.baoi-shell-reading .entry-content>:where(p,ul,ol,blockquote){
  max-width:var(--baoi-v533321-copy-max)!important;
}
body.baoi-ux-v533321.baoi-shell-reading .entry-content p{
  line-height:1.68!important;
}
body.baoi-ux-v533321.baoi-shell-reading .entry-content h2{
  margin-top:2.2rem!important;
  margin-bottom:.7rem!important;
}
body.baoi-ux-v533321.baoi-shell-reading .entry-content h3{
  margin-top:1.55rem!important;
}

/* Related resources should complement the article, not visually become a
   second landing page. */
body.baoi-ux-v533321 .boai-related{
  margin-top:46px!important;
  padding-top:28px!important;
}
body.baoi-ux-v533321 .boai-related-heading h2{
  font-size:clamp(1.55rem,2vw,1.9rem)!important;
  margin:6px 0 16px!important;
}
body.baoi-ux-v533321 .boai-related-grid{gap:12px!important}
body.baoi-ux-v533321 .boai-related-card{
  min-height:170px!important;
  padding:16px!important;
  border-radius:14px!important;
}
body.baoi-ux-v533321 .boai-related-card h3{
  font-size:1.05rem!important;
  line-height:1.25!important;
}
body.baoi-ux-v533321 .boai-related-card p{
  font-size:.82rem!important;
  line-height:1.45!important;
}
body.baoi-ux-v533321 .boai-related-grid:has(>.boai-related-card:only-child){
  grid-template-columns:minmax(0,480px)!important;
}

/* Procedure archive: constrain the enormous archive card typography seen in
   the recording. WordPress/Astra class names are included as a compatibility
   layer; module filters remain untouched. */
body.baoi-ux-v533321.post-type-archive-boai_procedure .ast-row,
body.baoi-ux-v533321.baoi-family-procedures_hub .ast-row{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  width:100%!important;
}
body.baoi-ux-v533321.post-type-archive-boai_procedure .ast-article-post,
body.baoi-ux-v533321.baoi-family-procedures_hub .ast-article-post{
  width:auto!important;
  margin:0!important;
  padding:0!important;
}
body.baoi-ux-v533321.post-type-archive-boai_procedure .ast-article-post>div,
body.baoi-ux-v533321.baoi-family-procedures_hub .ast-article-post>div{
  height:100%!important;
  padding:20px!important;
  border:1px solid rgba(151,188,215,.18)!important;
  border-radius:18px!important;
  background:linear-gradient(155deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
}
body.baoi-ux-v533321.post-type-archive-boai_procedure .entry-title,
body.baoi-ux-v533321.baoi-family-procedures_hub .ast-article-post .entry-title{
  font-size:clamp(1.45rem,1.9vw,2rem)!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
  margin:6px 0 10px!important;
  overflow-wrap:anywhere!important;
}
body.baoi-ux-v533321.post-type-archive-boai_procedure .entry-content,
body.baoi-ux-v533321.baoi-family-procedures_hub .ast-article-post .entry-content{
  font-size:.9rem!important;
  line-height:1.5!important;
}

/* Support / contribution strips: keep dark-site consistency and reduce the
   large white interruption visible near the bottom of tool pages. */
body.baoi-ux-v533321 :where(.boai-support-compact,.boai-support-footerbar){
  border:1px solid rgba(151,188,215,.2)!important;
  background:linear-gradient(145deg,rgba(17,31,51,.96),rgba(8,20,35,.96))!important;
  color:#eef5ff!important;
  border-radius:16px!important;
  box-shadow:none!important;
}
body.baoi-ux-v533321 :where(.boai-support-compact,.boai-support-footerbar) :where(strong,span){color:inherit!important}
body.baoi-ux-v533321 .boai-support-compact{margin-top:20px!important;margin-bottom:24px!important}

/* Footer transition: no artificial empty viewport after short apps. */
body.baoi-ux-v533321.baoi-self-contained-v533321 :where(.site-content,#content,.site-main){
  min-height:0!important;
}
body.baoi-ux-v533321.baoi-self-contained-v533321 .site-footer{margin-top:18px!important}

@media (max-width: 1050px){
  body.baoi-ux-v533321.post-type-archive-boai_procedure .ast-row,
  body.baoi-ux-v533321.baoi-family-procedures_hub .ast-row{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

@media (max-width: 782px){
  body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub,.boai-guides-app,.boai-scripts-hub){padding-top:8px!important;padding-bottom:30px!important}
  body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub-hero,.boai-guides-hero,.boai-scripts-hero){padding:20px 16px!important;border-radius:16px!important}
  body.baoi-ux-v533321.baoi-shell-hub :where(.boai-hub-hero,.boai-guides-hero,.boai-scripts-hero) h1{font-size:clamp(1.8rem,8vw,2.3rem)!important}
  body.baoi-ux-v533321.baoi-family-diagnostic_analyzer .baoi-da{padding:8px 8px 24px!important}
  body.baoi-ux-v533321.baoi-shell-reading .entry-title,
  body.baoi-ux-v533321.baoi-shell-reading h1.entry-title{font-size:clamp(1.9rem,9vw,2.55rem)!important;max-width:none!important}
  body.baoi-ux-v533321.baoi-shell-reading .boai-topic-context,
  body.baoi-ux-v533321.baoi-shell-reading .boai-reading-time,
  body.baoi-ux-v533321.baoi-shell-reading .boai-fav-inline{display:flex!important;width:100%!important;margin-right:0!important}
  body.baoi-ux-v533321.post-type-archive-boai_procedure .ast-row,
  body.baoi-ux-v533321.baoi-family-procedures_hub .ast-row{grid-template-columns:1fr!important}
  body.baoi-ux-v533321.post-type-archive-boai_procedure .entry-title,
  body.baoi-ux-v533321.baoi-family-procedures_hub .ast-article-post .entry-title{font-size:1.45rem!important}
}