/* VOLIQA V427 — canonical popup surface + mobile content alignment.
 * Presentation only. Locked top/bottom navigation/menu button geometry is untouched.
 */
:root{
  --v427-web-bg:#02080d;
  --v427-web-panel:#06131b;
  --v427-web-panel-2:#07151d;
}

/* One background system for every public popup: the same near-black/navy family as the site.
   Semantic opener colour is an accent only (frame, close, small highlights). */
body.v13 :is(
 .v13-modalbox,.v364-about-dialog,.v400-how-dialog,.v40-faq-dialog,
 .v48-sitemap-dialog,.v48-case-dialog,.v81-ai-dialog,.v339-analysis-dialog,
 .v347-cookie-dialog,.v113-legal-dialog,.v24-help-dialog
){
  background:linear-gradient(145deg,var(--v427-web-panel) 0%,var(--v427-web-bg) 100%)!important;
  border-color:var(--v-popup-accent)!important;
}
body.v13 :is(.v13-modalhead,.v48-sitemap-head){
  background:linear-gradient(180deg,var(--v427-web-panel) 84%,rgba(6,19,27,0))!important;
}
body.v13 :is(
 .v371-build-grid article,.v400-how-grid section,.v48-sitemap-grid>div,
 #modal-sitemap .v346-sitemap-grid article,.v40-faq-content details,
 .v364-about-dialog section,.v81-ai-dialog .v81-ai-quick>*
){
  background:linear-gradient(145deg,rgba(6,19,27,.96),rgba(2,8,13,.96))!important;
}
body.v13 :is(
 .v13-modalhead .v13-close,.v48-sitemap-head [data-v48-sitemap-close],
 .v364-about-dialog>.v364-about-close,.v400-how-dialog>.v400-how-close,
 .v40-faq-dialog>.v40-faq-close,.v48-case-dialog>.v48-case-close,
 .v81-ai-dialog>.v81-ai-close,.v339-analysis-dialog>.v339-analysis-close,
 .v347-cookie-dialog>.v347-cookie-close,.v113-legal-dialog>.v113-legal-close,
 .v24-help-dialog>.v24-help-close
){background:var(--v427-web-panel-2)!important}

/* BUILD WITH US follows ABOUT's card geometry/spacing. Accent remains BUILD orange. */
body.v13 #modal-build .v13-modalbox{width:min(900px,calc(100vw - 32px))!important}
body.v13 #modal-build .v13-modalhead{margin-bottom:8px!important;padding-bottom:0!important}
body.v13 #modal-build .v371-build-grid{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;margin:8px 0 14px!important;
}
body.v13 #modal-build .v371-build-grid article{
  border-radius:14px!important;padding:16px 17px!important;
  border-color:color-mix(in srgb,var(--v-popup-accent) 28%,transparent)!important;
}
body.v13 #modal-build .v371-build-grid b{margin:0 0 8px!important;line-height:1.2!important}
body.v13 #modal-build .v371-build-grid span{margin:0!important;line-height:1.6!important}

@media(max-width:760px){
  /* Canonical phone gutter. No content surface may use the old viewport breakout/negative margin. */
  html,body{max-width:100%!important;overflow-x:hidden!important}
  body.v13 .v253-home,
  body.v13 .v403-restored-surface,
  body.v13 :is(#scanner,#results,#pattern-lab,.v253-scanner-shell,.v256-results,.v272-public-pattern){
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin-left:0!important;margin-right:0!important;box-sizing:border-box!important;
  }
  body.v13 :is(
    #scanner .v253-scanner-shell,#results .v256-results-shell,
    #pattern-lab .v282-pattern-table,#pattern-lab .v341-case-study-table,
    .v256-table,.v253-table
  ){
    width:100%!important;max-width:100%!important;min-width:0!important;
    margin-left:0!important;margin-right:0!important;box-sizing:border-box!important;
  }
  /* The scanner/results/registry grids fit inside their own surface instead of pushing the page sideways. */
  body.v13 .v256-table .v253-row{min-width:0!important;width:100%!important;box-sizing:border-box!important}
  body.v13 :is(.v256-results-head,.v256-result-row,#v256ResultsRows>*){min-width:0!important;width:100%!important;box-sizing:border-box!important}
  body.v13 #pattern-lab .v341-case-row{min-width:0!important;width:100%!important;box-sizing:border-box!important}

  /* All major mobile section heads share the same left/right content axis. */
  body.v13 :is(.v253-scanner-top,.v254-section-head,.v291-move-top,.v388-live-candidates-heading){
    width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important;
  }

  /* Locked footer controls stay untouched; only footer identity is centred. */
  body.v13 .v13-footer .v36-footer-brand{
    width:100%!important;display:flex!important;justify-content:center!important;align-items:center!important;
    justify-self:center!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important;
  }
  body.v13 .v13-footer .v36-footer-brand img{display:block!important;margin-left:auto!important;margin-right:auto!important}
  body.v13 .v13-footer .v345-footer-copyright{
    width:100%!important;justify-self:center!important;align-self:center!important;
    margin-left:auto!important;margin-right:auto!important;text-align:center!important;
  }

  body.v13 #modal-build .v371-build-grid{grid-template-columns:1fr!important}
}