/* Personal demo page: native blocks and WPForms, central palette only. */
.mdemo-hero { padding-block: 65px; }
.mdemo-hero-copy { max-width: 920px; margin-inline: auto; text-align: center; }
.mdemo-hero-copy .mqp-eyebrow,.mdemo-hero-copy .wp-block-buttons { justify-content: center; }
.mdemo-facts { justify-content: center; gap: 12px 25px; margin: 25px 0 30px; }
.mq-demo-page .mdemo-facts p { margin: 0; padding: 8px 16px; border-radius: 30px; font-weight: 600; font-size: 14px; background: var(--wp--custom--brand--surface); color: var(--wp--custom--brand--deep); }
.mdemo-expect { padding-block: 55px; }
.mdemo-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 35px; margin-top: 30px; }
.mdemo-step { margin: 0!important; border-top: 2px solid var(--wp--custom--brand--border); padding-top: 20px; }
.mq-demo-page .mdemo-number { color: var(--wp--custom--brand--action); font-size: 24px; font-weight: 700; margin: 0 0 15px; }
.mdemo-step h3,.mdemo-audience h3 { font-size: 23px; line-height: 1.3; }
.mdemo-step p,.mdemo-audience p { font-size: 15px; }
.mdemo-audience { padding-block: 40px; }
.mdemo-request { padding-block: 65px; }
.mdemo-request .wp-block-columns { align-items: flex-start; }
.mdemo-form-panel { padding: 35px; border: 1px solid var(--wp--custom--brand--border); border-radius: 22px; }
.mdemo-form-panel h2 { font-size: clamp(2rem,3vw,2.8rem); }
.mq-demo-page .mdemo-note,.mq-demo-page .mdemo-privacy { font-size: 13px; color: var(--wp--custom--brand--muted); }
.mdemo-contact { padding: 30px; background: var(--wp--custom--brand--surface-soft); border-radius: 22px 60px 22px 22px; }
.mdemo-contact h3 { font-size: 26px; line-height: 1.2; }
.mdemo-contact p { font-size: 14px; overflow-wrap: anywhere; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container { margin: 20px 0; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container .wpforms-field { padding-block: 12px; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container .wpforms-field-label { color: var(--wp--custom--brand--ink); font-size: 15px; font-weight: 600; margin-bottom: 8px; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container input[type=text],:is(.mq-demo-page,.mq-contact-page) div.wpforms-container input[type=email],:is(.mq-demo-page,.mq-contact-page) div.wpforms-container input[type=tel],:is(.mq-demo-page,.mq-contact-page) div.wpforms-container textarea { width: 100%; max-width: 100%; border: 1px solid var(--wp--custom--brand--border-strong); border-radius: 8px; padding: 12px 14px; font-family: inherit; font-size: 16px; background: var(--wp--custom--brand--surface); color: var(--wp--custom--brand--ink); box-sizing: border-box; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container textarea { min-height: 125px; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container input:focus,:is(.mq-demo-page,.mq-contact-page) div.wpforms-container textarea:focus { outline: 2px solid var(--wp--custom--brand--focus); outline-offset: 2px; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container button[type=submit] { background: var(--wp--custom--brand--action); color: var(--wp--preset--color--white); border: 0; border-radius: 40px; padding: 15px 26px; font: inherit; font-weight: 600; cursor: pointer; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container button[type=submit]:focus-visible { outline: 3px solid var(--wp--custom--brand--focus); outline-offset: 4px; }
:is(.mq-demo-page,.mq-contact-page) .wpforms-error-container { padding: 15px; border: 2px solid currentColor; border-radius: 8px; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-confirmation-container-full { background: var(--wp--custom--brand--surface-soft); color: var(--wp--custom--brand--ink); border-color: var(--wp--custom--brand--accent); }
@media(max-width:781px) { .mdemo-hero-copy { text-align: left; } .mdemo-hero-copy .mqp-eyebrow,.mdemo-hero-copy .wp-block-buttons,.mdemo-facts { justify-content: flex-start; } .mdemo-steps { grid-template-columns: 1fr; gap: 22px; } .mdemo-form-panel { padding: 24px; } .mdemo-contact { padding: 25px; } .mdemo-hero,.mdemo-request { padding-block: 45px; } }

/* WPForms emits priority button styles; keep the submit control on the theme palette. */
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container #wpforms-submit-102 { background-color: var(--wp--custom--brand--action) !important; color: var(--wp--preset--color--white) !important; border-radius: 40px !important; }
:is(.mq-demo-page,.mq-contact-page) div.wpforms-confirmation-container-full { background-color: var(--wp--custom--brand--surface-soft) !important; color: var(--wp--custom--brand--ink) !important; border-color: var(--wp--custom--brand--accent) !important; }

/* Personal demo opening: editable photo and invitation in one responsive composition. */
.mdemo-hero-copy { max-width: none; margin: 0; text-align: left; }
.mdemo-hero-copy .mqp-eyebrow,.mdemo-hero-copy .wp-block-buttons,.mdemo-hero .mdemo-facts { justify-content: flex-start; }
.mq-demo-page h1 { font-size: clamp(2.2rem,4vw,3.5rem); }
.mdemo-hero .wp-block-columns { gap: clamp(28px,4vw,55px); }
.mdemo-hero-photo { margin: 0; border-radius: 75px 22px 22px 22px; overflow: hidden; }
.mdemo-hero-photo img { aspect-ratio: 4/5; object-fit: cover; object-position: 45% center; }
/* WPForms' fixed 41px height conflicted with the theme padding and line height. */
:is(.mq-demo-page,.mq-contact-page) div.wpforms-container #wpforms-submit-102 { display: inline-flex !important; align-items: center !important; justify-content: center !important; vertical-align: middle; text-align: center !important; height: auto !important; min-height: 52px !important; line-height: 1.2 !important; padding: 15px 26px !important; box-sizing: border-box !important; max-width: 100%; white-space: normal; }
@media(max-width:781px) { .mdemo-hero-photo img { aspect-ratio: 3/2; object-position: center; } .mdemo-hero-photo { border-top-left-radius: 45px; } .mq-demo-page h1 { font-size: clamp(2rem,7.4vw,2.8rem); } }