/* MeerwerkPro 6.1 — adaptive wide layout; loaded LAST after earlier CSS.
 * Container widths vary with viewport; long-form reading stays narrower.
 * No fixed pixel widths on mobile and no global overflow:hidden hacks. */
:root { --mwp61-public:1480px; --mwp61-portal:1760px; --mwp61-reading:900px; --mwp61-gutter:clamp(20px,3.4vw,56px); }
html { max-width:100%; }
body { min-width:0; }
/* One design token shared by header, footer, and public body. */
body .site-container { width:100%; max-width:var(--mwp61-public); padding-inline:var(--mwp61-gutter); margin-inline:auto; }
body .site-header .header-inner { max-width:var(--mwp61-public); }
body .page-main.page-portal > .site-container { max-width:var(--mwp61-portal); }
/* The class mwp61-layout-* is assigned only to specific WordPress pages. */
body.mwp61-layout-reading .page-main:not(.page-portal) > .site-container { max-width:calc(var(--mwp61-reading) + var(--mwp61-gutter) + var(--mwp61-gutter)); }
body.mwp61-layout-wide .page-main > .site-container { max-width:var(--mwp61-portal); }
body.mwp61-layout-full .page-main > .site-container { max-width:100%; }
/* Templates that had a historical 1100/1240 cap. */
body .mwp-site-section { max-width:min(100%,calc(var(--mwp61-public) - 2*var(--mwp61-gutter))); }
body :is(.mwp54-story-hero,.mwp54-how-hero,.mwp54-purpose,.mwp54-neighbor-story,.mwp54-bottom-cta,.mwp54-how-steps,.mwp54-how-split,.mwp54-how-benefits,.mwp54-how-faq,.mwp55-section) { max-width:min(100%,calc(var(--mwp61-public) - 2*var(--mwp61-gutter))); }
body .mwp54-story-text { max-width:min(100%,var(--mwp61-reading)); }
body .regular-page { max-width:min(100%,var(--mwp61-reading)); }
/* Dashboard content is wide, but does not break outside the page container. */
body .mwp-app { max-width:100%; }
body .mwp60,body .mwp60-guest { width:100%; max-width:100%; padding-inline:0; }
body .page-main.page-portal .mwp60 { padding-inline:0; }
body .mwp61-wide-panel { max-width:100%; }
body :is(.mwp-app,.mwp60,.mwp60-panel,.mwp60-tile,.mwp-site-section,.mwp54-story-hero,.mwp54-how-hero) { min-width:0; }
/* A wider canvas enables cards to breathe, without producing line-length fatigue. */
@media(min-width:1400px) {
  body .features-grid { gap:clamp(17px,1.6vw,27px); }
  body .mwp60-stats { gap:clamp(12px,1.35vw,20px); }
  body .mwp60-two { gap:clamp(15px,1.6vw,25px); }
  body .mwp60-project-grid { gap:clamp(14px,1.5vw,24px); }
}
@media(max-width:1100px) {
  :root { --mwp61-gutter:clamp(18px,2.5vw,30px); }
  body .hero-inner,body .pricing-preview,body .mwp54-how-split { gap:clamp(18px,3vw,36px); }
  body .mwp54-feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body .mwp60-tile { min-width:0; }
}
@media(max-width:780px) {
  :root { --mwp61-gutter:max(16px,env(safe-area-inset-left)); }
  body .site-container { padding-left:max(16px,env(safe-area-inset-left)); padding-right:max(16px,env(safe-area-inset-right)); }
  body .mwp-site-section { max-width:100%; padding-inline:0; }
  body .mwp54-story-hero,body .mwp54-how-hero { max-width:100%; }
  body .regular-page { max-width:100%; padding-inline:0; }
  body .mwp60 { padding-inline:0; }
  body .mwp60-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body .mwp-app .mwp-content { min-width:0; }
}
@media(max-width:520px) {
  body .mwp54-feature-grid { grid-template-columns:1fr; }
  body .mwp60-nav button { min-width:0; overflow-wrap:anywhere; }
  body .mwp60-stats { gap:8px; }
  body .mwp60-tile { padding:clamp(12px,3vw,18px); }
}
@media(prefers-reduced-motion:reduce) { body .mwp61-display-button { transition:none; } }
/* New: dashboard density control; client-only, no changes to underlying values. */
.mwp61-display-button { margin-left:auto; align-self:center; min-height:42px; padding:8px 13px; border:1px solid #b5d7d2; border-radius:10px; background:#f3faf8; color:#145951; font:inherit; font-weight:700; cursor:pointer; }
.mwp61-display-button:hover { background:#e3f5f0; }
.mwp61-display-button:focus-visible { outline:3px solid #16877c; outline-offset:2px; }
#mwp60-root.mwp61-compact .mwp60-tile { padding:12px 15px; gap:4px; }
#mwp60-root.mwp61-compact .mwp60-panel { padding:15px; }
#mwp60-root.mwp61-compact .mwp60-event { padding-bottom:12px; }
#mwp60-root.mwp61-compact .mwp60-bar-row { margin:8px 0; }
.mwp61-search { display:flex; gap:9px; align-items:center; flex-wrap:wrap; margin:0 0 18px; }
.mwp61-search label { font-weight:700; color:#325c5a; font-size:.88rem; }
.mwp61-search input { width:min(100%,360px); padding:10px 12px; border:1px solid #b5d7d2; border-radius:10px; background:white; font:inherit; }
.mwp61-search input:focus-visible { outline:3px solid #16877c; outline-offset:2px; }
.mwp61-search-output { font-size:.78rem; color:#637c81; }
@media(max-width:640px) { .mwp61-display-button { width:100%; margin-left:0; grid-column:1 / -1; } .mwp61-search input { width:100%; } }

.mwp60-event[hidden] { display:none!important; }
/* Long labels and hero titles may not force a 320px viewport wider. */
@media(max-width:780px) {
  body :is(.hero-inner,.mwp54-story-hero-inner,.mwp54-how-hero-inner,.mwp60-two) { min-width:0; grid-template-columns:minmax(0,1fr); }
  body :is(.hero-copy,.mwp54-story-hero,.mwp54-how-hero,.mwp60-hero,.mwp60-panel) { overflow-wrap:anywhere; }
}
