/* Mindjos responsive foundation — 2026-08-18 */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%;height:auto}
iframe{max-width:100%}

/* Shared footer: prevent the third column from forcing tablet overflow. */
@media (max-width:900px){
  .footerRedesign .footerShell{width:calc(100% - 40px)!important}
  .footerRedesign .footerTop,.footerGrid{grid-template-columns:minmax(0,1fr) minmax(180px,.55fr)!important;gap:28px!important}
  .footerRedesign .footerTop>*:last-child,.footerGrid>*:last-child{grid-column:1/-1!important;min-width:0!important}
  .footerColumn,.footerColumn a{min-width:0!important;overflow-wrap:anywhere}
}
@media (max-width:620px){
  .footerRedesign .footerShell{width:calc(100% - 32px)!important;padding:30px 0 24px!important}
  .footerRedesign .footerTop,.footerGrid{grid-template-columns:1fr!important;gap:26px!important}
  .footerRedesign .footerTop>*:last-child,.footerGrid>*:last-child{grid-column:auto!important}
  .footerRedesign .footerBottom{align-items:flex-start!important;flex-direction:column!important}
}

/* Back-office navigation remains one compact, swipeable row on small screens. */
@media (max-width:760px){
  .adminHeader header,.adminHeader{position:relative!important}
  .adminNav,.shell.nav{width:100%!important;padding-inline:16px!important;margin-inline:auto!important;align-items:flex-start!important;flex-direction:column!important;gap:8px!important}
  .brandLogo{width:116px!important;max-height:58px!important}
  .brandMark{min-width:0!important}
  .adminLinks,header .shell.nav nav{display:flex!important;width:100%!important;max-width:100%!important;flex-wrap:nowrap!important;justify-content:flex-start!important;gap:6px!important;overflow-x:auto!important;overscroll-behavior-inline:contain;scrollbar-width:none;padding:2px 0 8px!important}
  .adminLinks::-webkit-scrollbar,header .shell.nav nav::-webkit-scrollbar{display:none}
  .adminLinks a,header .shell.nav nav a{flex:0 0 auto!important;white-space:nowrap!important;padding:8px 11px!important}
}

/* Back-office cards and data tables. */
@media (max-width:700px){
  .shell{width:calc(100% - 24px)!important;margin:24px auto!important}
  .card{border-radius:22px!important}
  .premiumPublisherCard{grid-template-columns:1fr!important;align-items:start!important}
  .premiumPublisherCard .btn{justify-self:start!important}
  .dashboardHero{align-items:flex-start!important;flex-direction:column!important}
  .actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important}
  .card>table{display:block!important;width:100%!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
  .card>table tbody{display:table!important;width:100%!important;min-width:680px!important}
  .scrollPanel{max-width:100%!important;overflow:auto!important;-webkit-overflow-scrolling:touch}
  .filters{grid-template-columns:1fr!important}
  .publisherGrid{display:block!important}
  .sidePanel{border-right:0!important}
  .setupTop,.publisherHead{align-items:flex-start!important;flex-direction:column!important;gap:14px!important}
  .publishCta{width:100%!important}
  .setupTop .primary,.publishCta .primary{width:100%!important;justify-content:center!important}
  .editorPanel{padding:18px 12px 22px!important}
  .editorTabs{width:100%!important}
  .editorTabs button{flex:1 1 0!important;min-width:0!important;padding-inline:10px!important}
  .onlyofficeBox{border-radius:18px!important}
  .onlyofficeHead{align-items:flex-start!important;gap:4px!important;padding:11px 13px!important}
  .onlyofficeHead strong,.onlyofficeHead span{font-size:12px!important;line-height:1.25!important}
  .onlyofficeViewport{height:calc(100svh - 170px)!important;min-height:560px!important}
  .onlyofficeViewport::after{width:104px!important;height:36px!important;font-size:10px!important;letter-spacing:.05em!important}
}

/* Front-office content should never inherit a desktop minimum width. */
@media (max-width:700px){
  .wrap,.siteNav .wrap,.navInner{max-width:100%!important}
  .articleGrid,.cardsGrid,.processGrid,.proofGrid{min-width:0!important}
  .articleCard,.processCard,.proofCard{min-width:0}
  h1,h2,h3,p,a{overflow-wrap:break-word}
  input,select,textarea,button{max-width:100%}
}
