/* ==========================================================================
   Moved from Site Editor → Styles → Additional CSS (27 Oct 2026).
   Kept first in this file so the cascade is exactly as before (it used to load
   before this stylesheet). Edit styling here, not in the Site Editor.
   ========================================================================== */
body .mw-headline{font-size:var(--wp--preset--font-size--h-2)} body .mw-headline--s,body .mw-band .mw-headline,body .mw-pricing .mw-headline{font-size:var(--wp--preset--font-size--h-2-s)} body .mw-beat h3{font-size:var(--wp--preset--font-size--h-3-l)} body h3{font-size:var(--wp--preset--font-size--h-3)}
.wp-site-blocks > .wp-block-template-part:first-child{position:sticky;top:0;z-index:50} .admin-bar .wp-site-blocks > .wp-block-template-part:first-child{top:32px} body .mw-header{position:relative;top:auto}
body .mw-closing .mw-display{font-size:clamp(44px,5.4vw,78px)} body .mw-own__text{grid-template-columns:1.15fr .85fr} body .mw-own .mw-headline{font-size:clamp(30px,3.3vw,48px)}
body .mw-headline{line-height:1.1} body .mw-display{line-height:1} body .mw-router__list a{line-height:1.16}
@media (min-width:901px){ body .mw-stage{height:700px} }
body .mw-phone, body .mw-phone__screen{box-sizing:border-box} body .mw-phone{overflow:hidden}
body .mw-router.is-scroll .mw-router__list li:not(.is-active) a:hover{color:var(--wp--preset--color--subtitle);opacity:.55}
body .mw-router.is-scroll .mw-router__list li:last-child:not(.is-active) a:hover{opacity:.35}
html.mw-mouse :focus{outline:none !important}
body .mw-faq summary:focus-visible{outline:2px solid var(--wp--preset--color--navy);outline-offset:6px;border-radius:8px}
body .mw-footer__wordmark svg{width:104.5% !important;margin-left:-3% !important;max-width:none}
body .mw-ribbon--pink{top:101px;transform:rotate(3.5deg)} body .mw-ribbon--yellow{top:98px;transform:rotate(-3.5deg)}
body .mw-hero__chips .mw-chip:nth-child(2){top:590px}
body .mw-rush .mw-frag--tr{top:-96px}
@media (max-width:900px){body .mw-ribbon--pink,body .mw-ribbon--yellow{top:74px}}
@keyframes mw-float{from{translate:0 0}to{translate:0 -6px}}
body .mw-chip,body .mw-card,body .mw-chat,body .mw-badge{animation:mw-float 3.2s ease-in-out infinite alternate}
body .mw-stage .mw-card:nth-child(2n),body .mw-hero__chips .mw-chip:nth-child(2),body .mw-rush__block:nth-child(2) .mw-card{animation-delay:-1.6s}
body .mw-stage .mw-card:nth-child(3n){animation-duration:3.8s}
@media (prefers-reduced-motion:reduce){body .mw-chip,body .mw-card,body .mw-chat,body .mw-badge{animation:none}}
body.admin-bar .mw-header{top:auto}
body .mw-stage .mw-phone{z-index:1} body .mw-stage .mw-card{z-index:3}
body .mw-header__logo img{height:30px} @media (max-width:900px){body .mw-header__logo img{height:26px}}
body .mw-chai{font-family:var(--wp--preset--font-family--poppins);font-style:normal;font-weight:500;font-size:17px;color:var(--wp--preset--color--subtitle);margin:8px 0 20px}
/* ===== End of moved Site Editor CSS ===== */

/* ==========================================================================
   Magicwant — components
   Tokens (colours, type sizes, spacing) live in theme.json and are used here
   as CSS variables: --wp--preset--color--navy etc.
   ========================================================================== */

:root {
	--mw-navy: var(--wp--preset--color--navy);
	--mw-blue: var(--wp--preset--color--blue);
	--mw-pink: var(--wp--preset--color--pink);
	--mw-yellow: var(--wp--preset--color--yellow);
	--mw-blue-50: var(--wp--preset--color--blue-50);
	--mw-yellow-50: var(--wp--preset--color--yellow-50);
	--mw-title: var(--wp--preset--color--title);
	--mw-sub: var(--wp--preset--color--subtitle);
	--mw-gutter: var(--wp--preset--spacing--gutter);
	--mw-section: var(--wp--preset--spacing--section);
	--mw-section-tight: var(--wp--preset--spacing--section-tight);
	--mw-heading-gap: var(--wp--preset--spacing--heading-gap);
	--mw-radius-photo: 20px;
	--mw-radius-card: 16px;
	--mw-shadow: 0 12px 32px rgba(0, 21, 138, 0.14);
	--mw-hairline: rgba(0, 21, 138, 0.14);
	--mw-header-h: 76px;
}

/* ---------- Type: one face, one width (Area width 200, ink traps 0) ---------- */
h1, h2, h3, h4,
.mw-display, .mw-headline, .mw-sentence, .mw-price, .mw-ribbon__item {
	font-family: var(--wp--preset--font-family--area);
	font-variation-settings: "wdth" 200, "INKT" 0, "slnt" 0;
	font-optical-sizing: auto;
	text-wrap: balance;
}
.mw-display { font-size: var(--wp--preset--font-size--display); font-weight: 800; line-height: .98; letter-spacing: -.02em; margin: 0; }
.mw-headline { font-size: var(--wp--preset--font-size--h2); font-weight: 700; line-height: 1.06; letter-spacing: -.01em; color: var(--mw-navy); margin: 0; }
.mw-headline--s { font-size: var(--wp--preset--font-size--h2-s); }
.mw-price { font-size: var(--wp--preset--font-size--price); font-weight: 800; line-height: 1; color: var(--mw-blue); margin: 0; }
.mw-accent-yellow { color: var(--mw-yellow); }
.mw-accent-pink { color: var(--mw-pink); }

/* Eyebrow labels are the real H2s (SEO); styled small */
.mw-eyebrow, h2.mw-eyebrow, h1.mw-eyebrow {
	font-family: var(--wp--preset--font-family--poppins);
	font-variation-settings: normal;
	font-size: 15px; font-weight: 600; line-height: 1.3; letter-spacing: 0;
	color: var(--mw-blue); margin: 0 0 14px;
}
.is-navy .mw-eyebrow { color: var(--mw-yellow); }

.mw-sub { color: var(--mw-sub); font-size: var(--wp--preset--font-size--body-l); }
.mw-caption { font-size: 13px; color: var(--mw-sub); }
.is-navy .mw-sub, .is-navy .mw-caption { color: rgba(255,255,255,.8); }

/* ---------- Sections ---------- */
.mw-section { padding-block: var(--mw-section); position: relative; margin-block: 0 !important; }
.mw-section > * { max-width: 1280px; margin-inline: auto; }
.mw-section.is-tight-bottom { padding-bottom: var(--mw-section-tight); }
.mw-section.is-flush-bottom { padding-bottom: 0; }
.is-navy { background: var(--mw-navy); color: #fff; }
.is-navy :where(h1,h2,h3,p) { color: #fff; }
.is-blue-50 { background: var(--mw-blue-50); }
.is-yellow-50 { background: var(--mw-yellow-50); }
.is-yellow { background: var(--mw-yellow); color: var(--mw-navy); }
.mw-heading { margin-bottom: var(--mw-heading-gap); }
.wp-site-blocks > * + * { margin-block-start: 0; }

/* ---------- Buttons ---------- */
.wp-block-button__link { transition: transform .2s cubic-bezier(.34,1.56,.64,1), background-color .2s; }
.wp-block-button__link:active { transform: scale(.96); }
.mw-btn-yellow .wp-block-button__link { background: var(--mw-yellow); color: var(--mw-navy); }
.mw-btn-yellow .wp-block-button__link:hover { background: #ffcf33; }
.mw-btn-blue .wp-block-button__link:hover { background: #1f45ff; }
.mw-btn-outline-light .wp-block-button__link { background: transparent; color: #fff; box-shadow: inset 0 0 0 1.5px #fff; }
.mw-btn-outline-dark .wp-block-button__link { background: #fff; color: var(--mw-title); box-shadow: inset 0 0 0 1.5px #d5dae8; }
.mw-btn-wa .wp-block-button__link { display: inline-flex; align-items: center; gap: 10px; }
.mw-btn-wa .wp-block-button__link::before {
	content: ""; width: 18px; height: 18px; flex: none; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21l1.65-3.8A9 9 0 1 1 7.8 20.35L3 21'/%3E%3C/svg%3E") center/contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21l1.65-3.8A9 9 0 1 1 7.8 20.35L3 21'/%3E%3C/svg%3E") center/contain no-repeat;
}
:focus-visible { outline: 3px solid var(--mw-yellow); outline-offset: 3px; border-radius: 6px; }

/* ---------- UI chips & cards (sample product UI) ---------- */
.mw-chip {
	display: inline-flex; align-items: center; gap: 10px; white-space: nowrap;
	background: #fff; color: var(--mw-title); border-radius: 12px; padding: 12px 16px;
	font: 500 14px/1.2 var(--wp--preset--font-family--poppins); box-shadow: var(--mw-shadow);
}
.mw-chip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--mw-blue); }
.mw-chip.is-green::before { background: #2ead5b; }
.mw-card { background: #fff; border-radius: var(--mw-radius-card); box-shadow: var(--mw-shadow); padding: 18px 20px; color: var(--mw-title); font: 400 13px/1.4 var(--wp--preset--font-family--poppins); }
.mw-card__label { font-weight: 600; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--mw-blue); margin-bottom: 8px; }
.mw-card__title { font-weight: 500; font-size: 14px; margin-bottom: 4px; }
.mw-card__row { display: flex; justify-content: space-between; gap: 12px; color: var(--mw-sub); }
.mw-card__total { display: flex; justify-content: space-between; border-top: 1px solid #e6e9f2; padding-top: 8px; margin-top: 8px; font-weight: 500; color: var(--mw-title); }
.mw-pill { display: inline-block; background: var(--mw-blue-50); color: var(--mw-navy); border-radius: 8px; padding: 4px 10px; font-weight: 500; font-size: 12px; }
.mw-bubble { background: #dcf8c6; border-radius: 2px 12px 12px 12px; padding: 10px 12px; }

/* ---------- Header ---------- */
.mw-header { position: sticky; top: 0; z-index: 50; background: var(--mw-navy); padding-block: 16px; }
.mw-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 32px; max-width: 1280px; margin-inline: auto; }
.mw-header__logo img { height: 22px; width: auto; display: block; }
.mw-header nav a { color: #fff; text-decoration: none; font: 500 15px/1 var(--wp--preset--font-family--poppins); }
.mw-header__nav { display: flex; gap: 40px; }
.mw-header__actions { display: flex; align-items: center; gap: 24px; }
.mw-header__actions .wp-block-button__link { padding: 12px 20px; }
.admin-bar .mw-header { top: 32px; }

/* ---------- Hero ---------- */
.mw-hero { padding-top: 56px; padding-bottom: 0; overflow: hidden; min-height: 900px; }
.mw-hero__copy { position: relative; z-index: 2; max-width: 1280px; }
.mw-hero__copy .mw-display { color: #fff; }
.mw-hero__copy .mw-sub { max-width: 520px; margin-top: 44px; }
.mw-hero__person { position: absolute; z-index: 1; right: 20px; bottom: 120px; width: min(550px, 40vw); pointer-events: none; }
.mw-hero__person img { width: 100%; height: auto; display: block; }
.mw-hero__chips { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.mw-hero__chips .mw-chip { position: absolute; }
.mw-hero__chips .mw-chip:nth-child(1) { right: max(170px, 13vw); top: 470px; }
.mw-hero__chips .mw-chip:nth-child(2) { right: 60px; top: 650px; }
.mw-hero .mw-microcopy { color: rgba(255,255,255,.7); font-size: 13px; margin-top: 12px; }

/* Ribbons (pinned to the hero's bottom edge, above the photo) */
.mw-ribbons { position: absolute; left: 0; right: 0; bottom: 0; height: 260px; z-index: 4; pointer-events: none; }
.mw-ribbons__white { position: absolute; left: 0; right: 0; bottom: 0; height: 140px; background: #fff; }
.mw-ribbon { position: absolute; left: -300px; right: -300px; height: 68px; display: flex; align-items: center; overflow: hidden; }
.mw-ribbon--pink { top: 42px; transform: rotate(-3.5deg); background: var(--mw-pink); color: #fff; }
.mw-ribbon--yellow { top: 160px; transform: rotate(3.5deg); background: var(--mw-yellow); color: var(--mw-navy); }
.mw-ribbon__track { display: flex; gap: 28px; align-items: center; white-space: nowrap; width: max-content; animation: mw-marquee var(--mw-ribbon-speed, 38s) linear infinite; }
.mw-ribbon--pink .mw-ribbon__track { animation-direction: reverse; }
.mw-ribbon__item { font-size: 22px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
.mw-ribbon__sep { width: 20px; height: 20px; flex: none; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12C16 13 13 16 12 24C11 16 8 13 0 12C8 11 11 8 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12C16 13 13 16 12 24C11 16 8 13 0 12C8 11 11 8 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat; }
.mw-ribbon--pink .mw-ribbon__sep { background: var(--mw-yellow); }
@keyframes mw-marquee { to { transform: translateX(-50%); } }

/* ---------- I run a… (sentence router) ---------- */
.mw-router { display: grid; grid-template-columns: 1fr 420px; gap: 60px; align-items: center; padding-top: var(--mw-section-tight); }
.mw-router__list { list-style: none; margin: 0 0 24px; padding: 0; }
.mw-router__list a { display: inline-flex; align-items: center; gap: 14px; text-decoration: none; font: 800 var(--wp--preset--font-size--sentence)/1.12 var(--wp--preset--font-family--area); font-variation-settings: "wdth" 200, "INKT" 0, "slnt" 0; color: var(--mw-sub); opacity: .55; transition: color .25s, opacity .25s; }
.mw-router__list li:last-child a { opacity: .35; }
.mw-router__list a .mw-arrow { opacity: 0; transform: translateX(-8px); transition: .25s; }
.mw-router__list li.is-active a, .mw-router__list a:hover, .mw-router__list a:focus-visible { color: var(--mw-blue); opacity: 1; }
.mw-router__list li.is-active a .mw-arrow, .mw-router__list a:hover .mw-arrow { opacity: 1; transform: none; }
.mw-router__list li:last-child a .mw-arrow { opacity: 1; transform: none; }
.mw-router__lead { font: 800 var(--wp--preset--font-size--sentence)/1.12 var(--wp--preset--font-family--area); font-variation-settings: "wdth" 200, "INKT" 0, "slnt" 0; color: var(--mw-blue); }
.mw-router__photos { position: relative; aspect-ratio: 7/9; border-radius: var(--mw-radius-photo); overflow: hidden; }
.mw-router__photos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .4s ease; }
.mw-router__photos img.is-active { opacity: 1; }

/* ---------- One screen ---------- */
.mw-onescreen { text-align: center; padding-bottom: 0; overflow: hidden; }
.mw-onescreen .mw-heading > * { margin-inline: auto; }
.mw-onescreen .mw-sub { max-width: 780px; }
.mw-stage { position: relative; height: 520px; max-width: 1280px; margin-inline: auto; }
.mw-phone { position: absolute; left: 50%; top: 20px; width: 320px; height: 660px; margin-left: -160px; background: #111320; border-radius: 48px; padding: 12px; box-shadow: 0 30px 60px rgba(0,21,138,.25); }
.mw-phone__screen { background: #fff; border-radius: 38px; height: 100%; padding: 44px 18px 0; text-align: left; overflow: hidden; }
.mw-phone__head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; }
.mw-phone__head strong { font: 600 22px/1 var(--wp--preset--font-family--area); color: var(--mw-title); }
.mw-phone__empty { text-align: center; padding-top: 60px; color: var(--mw-sub); font-size: 13px; }
.mw-order { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #e6e9f2; padding: 12px 0; font-size: 13px; }
.mw-order b { font-weight: 500; font-size: 14px; color: var(--mw-title); }
.mw-order small { color: var(--mw-sub); font-size: 11px; }
.mw-order .mw-pill { font-size: 11px; padding: 3px 8px; margin-right: 6px; }
.mw-status { display: inline-flex; align-items: center; gap: 5px; color: var(--mw-sub); font-size: 11px; }
.mw-status::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--dot, var(--mw-blue)); }
.mw-stage .mw-card { position: absolute; width: 250px; text-align: left; }
.mw-stage [data-src="walkin"] { left: 40px; top: 10px; transform: rotate(3.5deg); }
.mw-stage [data-src="qr"] { left: 90px; top: 200px; transform: rotate(-3.5deg); width: 230px; }
.mw-stage [data-src="flyer"] { left: 30px; top: 345px; transform: rotate(3.5deg); width: 280px; }
.mw-stage [data-src="instagram"] { right: 40px; top: 20px; transform: rotate(-3.5deg); }
.mw-stage [data-src="whatsapp"] { right: 50px; top: 195px; transform: rotate(3.5deg); width: 270px; }
.mw-stage [data-src="website"] { right: 55px; top: 370px; transform: rotate(-3.5deg); width: 240px; }
.mw-qr { width: 60px; height: 60px; flex: none; background:
	conic-gradient(from 90deg at 30% 30%, var(--mw-navy) 25%, transparent 0) 0 0/20px 20px,
	linear-gradient(var(--mw-navy) 0 0) 0 0/18px 18px no-repeat,
	linear-gradient(var(--mw-navy) 0 0) 100% 0/18px 18px no-repeat,
	linear-gradient(var(--mw-navy) 0 0) 0 100%/18px 18px no-repeat; border-radius: 4px; }

/* ---------- Built for the rush ---------- */
.mw-rush__blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.mw-rush__blocks > :nth-child(2) { padding-top: 140px; }
.mw-photo { position: relative; }
.mw-photo > img, .mw-photo .wp-block-image img { width: 100%; aspect-ratio: 616/520; object-fit: cover; border-radius: var(--mw-radius-photo); display: block; }
.mw-photo .mw-frag { position: absolute; }
.mw-frag--bl { left: -24px; bottom: 40px; }
.mw-frag--tr { right: -24px; top: -36px; }
.mw-pins { display: flex; gap: 24px; position: relative; margin: 10px 0; }
.mw-pins::before { content: ""; position: absolute; left: 14px; right: 14px; top: 13px; height: 2px; background: var(--mw-blue-50); }
.mw-pins span { position: relative; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--mw-navy); color: #fff; font: 600 12px/1 var(--wp--preset--font-family--poppins); }
.mw-pins span:first-child { background: var(--mw-yellow); color: var(--mw-navy); }
.mw-tag { display: inline-block; background: var(--mw-blue-50); color: var(--mw-navy); border-radius: 8px; padding: 6px 12px; font: 500 13px/1.3 var(--wp--preset--font-family--poppins); }

/* ---------- Ease band ---------- */
.mw-band { padding-block: var(--wp--preset--spacing--band); }
.mw-band__inner { display: flex; align-items: center; justify-content: space-between; gap: 64px; }
.mw-band .mw-headline { color: var(--mw-navy); font-size: var(--wp--preset--font-size--h2-s); }

/* ---------- Bring them back (sticky photo + beats) ---------- */
.mw-back__row { display: grid; grid-template-columns: 480px 1fr; gap: 96px; align-items: start; }
.mw-back__photo { position: sticky; top: calc(50vh - 300px); height: 600px; }
.mw-back__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: var(--mw-radius-photo); opacity: 0; transition: opacity .45s ease; }
.mw-back__photo img.is-active { opacity: 1; }
.mw-back__photo .mw-frag { position: absolute; right: -24px; bottom: 40px; width: 320px; opacity: 0; transform: translateY(8px); transition: opacity .35s, transform .35s; }
.mw-back__photo .mw-frag.is-active { opacity: 1; transform: none; }
.mw-beat { border-left: 2px solid #e6e9f2; padding: 28px 0 28px 28px; opacity: .45; transition: opacity .3s, border-color .3s; }
@media (hover: hover) and (min-width: 901px) { .mw-beat:hover { opacity: .75; } }
.mw-beat__btn { all: unset; display: block; cursor: pointer; font: inherit; color: inherit; text-align: left; }
.mw-beat__btn:focus-visible { outline: 2px solid var(--mw-blue); outline-offset: 4px; border-radius: 4px; }
.mw-beat:first-child { padding-top: 0; }
.mw-beat.is-active { opacity: 1; border-left: 4px solid var(--mw-pink); padding-left: 26px; }
.mw-beat h3 { font-size: clamp(20px, 1.6vw, 22px); color: var(--mw-title); margin: 0 0 12px; }
.mw-beat p { color: var(--mw-sub); font-size: var(--wp--preset--font-size--body-l); margin: 0; }
.mw-smallprint { padding: 48px 0 0 28px; font-size: 13px; color: var(--mw-sub); }
.mw-stamps { display: flex; gap: 8px; margin-top: 10px; }
.mw-stamps i { width: 30px; height: 30px; border-radius: 50%; background: var(--mw-navy); }
.mw-stamps i:last-child { background: var(--mw-yellow); }

/* ---------- Own it ---------- */
.mw-own__photo { position: relative; margin-bottom: var(--mw-heading-gap); }
.mw-own__photo img { width: 100%; aspect-ratio: 1280/560; object-fit: cover; border-radius: var(--mw-radius-photo); display: block; }
.mw-chat { position: absolute; right: 48px; bottom: -24px; width: 340px; background: #efeae2; border-radius: 18px; overflow: hidden; box-shadow: 0 20px 48px rgba(0,0,0,.35); font: 400 13px/1.4 var(--wp--preset--font-family--poppins); color: var(--mw-title); text-align: left; }
.mw-chat__head { background: #075e54; color: #fff; display: flex; gap: 12px; align-items: center; padding: 14px 16px; }
.mw-chat__avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--mw-yellow); color: var(--mw-navy); display: grid; place-items: center; font-weight: 600; }
.mw-chat__head small { display: block; color: #cfe9e4; font-size: 11px; }
.mw-chat__body { padding: 16px 14px; display: grid; gap: 10px; }
.mw-chat__msg { background: #fff; border-radius: 2px 10px 10px 10px; padding: 10px 12px; }
.mw-chat__msg time { display: block; font-size: 10px; color: var(--mw-sub); margin-top: 4px; }
.mw-doc { display: flex; gap: 10px; align-items: center; background: #f5f6f6; border-radius: 8px; padding: 10px; margin-bottom: 8px; }
.mw-doc__icon { width: 32px; height: 40px; border-radius: 4px; background: #e5484d; color: #fff; display: grid; place-items: center; font-size: 9px; font-weight: 600; }
.mw-own__text { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
.mw-proofs { list-style: none; padding: 0; margin: 24px 0; display: grid; gap: 14px; }
.mw-proofs li { display: flex; gap: 12px; align-items: center; font: 500 18px/1.4 var(--wp--preset--font-family--poppins); color: #fff; }
.mw-proofs li::before, .mw-included li::before { content: ""; width: 16px; height: 16px; flex: none; background: var(--mw-yellow);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12C16 13 13 16 12 24C11 16 8 13 0 12C8 11 11 8 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 0C13 8 16 11 24 12C16 13 13 16 12 24C11 16 8 13 0 12C8 11 11 8 12 0Z'/%3E%3C/svg%3E") center/contain no-repeat; }

/* ---------- Proof (merchant cards) ---------- */
.mw-proof { overflow: hidden; }
.mw-proof__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 48px; }
.mw-proof__stats { display: flex; gap: 48px; }
.mw-proof__stats b { display: block; font: 700 44px/1 var(--wp--preset--font-family--area); font-variation-settings: "wdth" 200; color: var(--mw-navy); }
.mw-track { display: flex; gap: 32px; align-items: flex-start; width: max-content; padding-right: 80px; }
.mw-track > :nth-child(2) { margin-top: 150px; }
.mw-track > :nth-child(3) { margin-top: 20px; }
.mw-track > :nth-child(4) { margin-top: 200px; }
.mw-quote { font-family: var(--wp--preset--font-family--fraunces); font-weight: 600; font-size: 22px; line-height: 1.3; color: var(--mw-title); }
.mw-mcard { border-radius: 28px; padding: 24px; width: 360px; background: #fff; }
.mw-mcard--feature { width: 672px; display: grid; grid-template-columns: 1fr 300px; gap: 24px; background: var(--mw-blue-50); }
.mw-mcard--voice { background: #e7f6ec; width: 380px; }
.mw-mcard--photo { background: var(--mw-yellow); padding: 0; overflow: hidden; width: 320px; }

/* ---------- Pricing ---------- */
.mw-pricing__row { display: grid; grid-template-columns: 1fr 460px; gap: 80px; align-items: center; }
.mw-pricing .mw-headline { font-size: var(--wp--preset--font-size--h2-s); }
.mw-included { list-style: none; padding: 0; margin: 32px 0 24px; columns: 2; column-gap: 48px; max-width: 520px; }
.mw-included li { display: flex; gap: 10px; align-items: center; font-weight: 500; margin-bottom: 14px; break-inside: avoid; }
.mw-pricing__phone { position: relative; }
.mw-pricing__phone img { width: 100%; height: auto; filter: drop-shadow(-18px 28px 48px rgba(0,21,138,.22)); }
.mw-badge { position: absolute; right: 10px; top: 20px; width: 140px; aspect-ratio: 1; display: grid; place-items: center; text-align: center; color: var(--mw-navy); font: 600 15px/1.2 var(--wp--preset--font-family--poppins); transform: rotate(-10deg); }
.mw-badge::before { content: ""; position: absolute; inset: 0; background: var(--mw-yellow); z-index: -1;
	clip-path: polygon(50% 0, 64% 36%, 100% 50%, 64% 64%, 50% 100%, 36% 64%, 0 50%, 36% 36%); }

/* ---------- FAQ ---------- */
.mw-faq__row { display: grid; grid-template-columns: 400px 1fr; gap: 96px; align-items: start; }
.mw-faq__head { position: sticky; top: calc(var(--mw-header-h) + 40px); }
.mw-faq details { border-bottom: 1px solid var(--mw-hairline); padding: 24px 0; }
.mw-faq details:first-of-type { border-top: 1px solid var(--mw-hairline); }
.mw-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 24px; align-items: center; font: 500 var(--wp--preset--font-size--body-l)/1.4 var(--wp--preset--font-family--poppins); color: var(--mw-title); }
.mw-faq summary::-webkit-details-marker { display: none; }
.mw-faq summary::after { content: "+"; flex: none; width: 32px; height: 32px; border-radius: 50%; background: #fff; color: var(--mw-navy); display: grid; place-items: center; font-size: 18px; transition: transform .2s; }
.mw-faq details[open] summary::after { content: "–"; background: var(--mw-navy); color: #fff; }
.mw-faq details > :not(summary) { color: var(--mw-sub); margin-top: 12px; }

/* ---------- Closing ---------- */
.mw-closing { overflow: hidden; padding-top: 200px; padding-bottom: var(--mw-section-tight); }
.mw-closing .mw-ribbon { top: 10px; transform: rotate(-2deg); background: var(--mw-yellow); color: var(--mw-navy); }
.mw-closing__row { display: grid; grid-template-columns: 1fr 560px; gap: 80px; align-items: center; }
.mw-closing .mw-display { font-size: clamp(48px, 6.7vw, 96px); color: #fff; }
.mw-closing__photo { position: relative; }
.mw-closing__photo img { width: 100%; aspect-ratio: 560/480; object-fit: cover; border-radius: var(--mw-radius-photo); display: block; }
.mw-closing__photo .mw-chip { position: absolute; right: -24px; top: 120px; }

/* ---------- Footer ---------- */
.mw-footer { background: var(--mw-navy); color: #fff; padding-top: 80px; position: relative; overflow: hidden; border-top: 1px solid rgba(255,255,255,.12); }
.mw-footer a { color: rgba(255,255,255,.72); text-decoration: none; }
.mw-footer a:hover { color: #fff; }
.mw-footer__top { display: grid; grid-template-columns: 340px repeat(5, auto); gap: 64px; justify-content: space-between; max-width: 1280px; margin-inline: auto; }
.mw-footer h2 { font: 600 15px/1.3 var(--wp--preset--font-family--poppins); font-variation-settings: normal; color: #fff; margin: 0 0 16px; }
.mw-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.mw-footer__bottom { display: flex; justify-content: space-between; max-width: 1280px; margin: 56px auto 0; padding: 24px 0 40px; border-top: 1px solid rgba(255,255,255,.12); font-size: 13px; color: rgba(255,255,255,.6); }
.mw-footer__wordmark { display: block; width: calc(100% + 2 * var(--mw-gutter)); margin-inline: calc(-1 * var(--mw-gutter)); height: clamp(90px, 14vw, 200px); overflow: hidden; }
.mw-footer__wordmark svg, .mw-footer__wordmark img { width: 94%; margin: 0 3%; display: block; transform: translateY(-4%); }

/* ---------- Mobile sticky CTA bar ---------- */
.mw-mobilebar { display: none; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1100px) {
	.mw-router { grid-template-columns: 1fr 340px; }
	.mw-back__row { grid-template-columns: 400px 1fr; gap: 56px; }
	.mw-footer__top { grid-template-columns: 1fr 1fr 1fr; }
}
@media (max-width: 900px) {
	:root { --mw-header-h: 60px; }
	.mw-header__nav, .mw-header__actions .mw-signin { display: none; }
	.mw-hero { min-height: 0; padding-bottom: 300px; }
	.mw-hero__copy .mw-sub { margin-top: 24px; }
	.mw-hero__person { position: relative; right: auto; bottom: auto; width: 86%; margin: 32px auto -260px; }
	.mw-hero__chips { display: none; }
	.mw-ribbon { height: 52px; }
	.mw-ribbon__item { font-size: 16px; }
	.mw-ribbons { height: 200px; }
	.mw-ribbon--pink { top: 34px; } .mw-ribbon--yellow { top: 118px; }

	.mw-router, .mw-rush__blocks, .mw-back__row, .mw-own__text, .mw-pricing__row, .mw-faq__row, .mw-closing__row { grid-template-columns: 1fr; gap: 40px; }
	.mw-router__photos { display: none; }
	.mw-rush__blocks > :nth-child(2) { padding-top: 0; }
	.mw-frag--bl, .mw-frag--tr { left: 12px; right: auto; bottom: 12px; top: auto; }

	/* One screen: finished phone, cards in a grid, no fly-in */
	.mw-stage { height: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-bottom: var(--mw-section); }
	.mw-stage:not(.is-mob) .mw-card { position: static; width: auto; transform: none !important; }
	.mw-phone { position: relative; left: auto; margin: 0 auto 8px; grid-column: 1 / -1; order: -1; height: 560px; }

	/* Bring them back: each beat stacks with its own photo + card */
	.mw-back__photo { position: relative; top: 0; height: auto; aspect-ratio: 4/5; }
	.mw-beat { opacity: 1; border-left-width: 4px; }

	.mw-chat { position: relative; right: auto; bottom: auto; margin: -60px 16px 0 auto; width: min(340px, 92%); }
	.mw-proof__head { flex-direction: column; align-items: flex-start; }
	.mw-track { overflow-x: auto; scroll-snap-type: x mandatory; width: auto; padding-bottom: 12px; }
	.mw-track > * { scroll-snap-align: start; margin-top: 0 !important; flex: none; width: 85vw !important; }
	.mw-mcard--feature { grid-template-columns: 1fr; }
	.mw-band__inner { flex-direction: column; align-items: flex-start; gap: 24px; }
	.mw-faq__head { position: static; }
	.mw-closing { padding-top: 140px; }
	.mw-footer__top { grid-template-columns: 1fr 1fr; gap: 40px; }

	/* Sticky bottom bar with both CTAs */
	.mw-mobilebar { display: flex; gap: 8px; position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.96); box-shadow: 0 -6px 24px rgba(0,21,138,.12); }
	.mw-mobilebar a { flex: 1; text-align: center; padding: 14px 10px; border-radius: 10px; font: 600 15px/1 var(--wp--preset--font-family--poppins); text-decoration: none; }
	.mw-mobilebar a:first-child { background: var(--mw-blue); color: #fff; }
	.mw-mobilebar a:last-child { background: #fff; color: var(--mw-title); box-shadow: inset 0 0 0 1.5px #d5dae8; }
	body { padding-bottom: 76px; }
}

/* Reduced motion: everything static and fully visible */
@media (prefers-reduced-motion: reduce) {
	.mw-ribbon__track { animation: none; }
	*, *::before, *::after { transition-duration: .01ms !important; }
}

/* ---------- Fixes from preview review ---------- */
.mw-section > .mw-ribbons, .mw-section > .mw-ribbon, .mw-section > .mw-hero__chips, .mw-section > .mw-hero__person,
.mw-footer > .mw-footer__wordmark { max-width: none; margin-inline: 0; }
.mw-ribbon__item { white-space: nowrap; flex: none; }
.mw-ribbon__track > * { flex: none; }
.mw-closing > .mw-ribbon { left: -300px; right: -300px; position: absolute; }
:where(h3) { color: var(--mw-title); }
.mw-band__text .mw-headline { margin-bottom: 12px; }
.mw-pricing .mw-price + .mw-headline { margin-top: 8px; margin-bottom: 20px; }
/* Empty state shows only while the fly-in runs (JS turns it on); no-JS and reduced motion see the finished list */
.mw-phone__empty { display: none; }
/* Footer wordmark: full bleed, cropped so ~60% of the letters shows */
.mw-footer__wordmark { width: calc(100% + 2 * var(--mw-gutter)); margin-inline: calc(-1 * var(--mw-gutter)) !important; height: calc((100vw) * 0.141); overflow: hidden; }
.mw-footer__wordmark svg { width: 100%; height: auto; margin: 0; transform: none; display: block; }
/* Page gutters are handled here (theme.json root padding is 0 so section backgrounds run edge to edge) */
.mw-section, .mw-header { padding-inline: var(--mw-gutter); }
body { margin: 0; }
@media (max-width: 900px) {
	.mw-phone { width: min(320px, 100%); margin-inline: auto; left: auto; }
	.mw-stage { grid-template-columns: 1fr; }
	.mw-router__list a { font-size: clamp(30px, 8.4vw, 44px); }
}
html, body { overflow-x: clip; }

/* ===== Restaurant POS page (.mw-rp-*) ===== */
.mw-rp-hero { min-height: 760px; padding-bottom: 120px; }
.mw-rp-hero .mw-rp-person { bottom: 0; width: min(560px, 40vw); }
.mw-rp-chips .mw-chip:nth-child(1) { right: max(380px, 28vw); top: 300px; }
.mw-rp-chips .mw-chip:nth-child(2) { right: 40px; top: 560px; }
.mw-chip.is-green::before { background: #2EAD5B; }
.mw-rp-counter { display: grid; grid-template-columns: 560px 1fr; gap: 80px; align-items: center; }
.mw-rp-photo .wp-block-image img { aspect-ratio: 15/16; }
.mw-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 48px; }
.mw-feat h3 { margin: 0 0 8px; }
.mw-sub-s { color: var(--mw-subtitle, #6F7591); font-size: var(--wp--preset--font-size--body); line-height: 1.55; margin: 0; }
.mw-rp-featcol .mw-caption { margin-top: 48px; }
.mw-tables { display: grid; grid-template-columns: repeat(3, 44px); gap: 8px; margin: 10px 0; }
.mw-tables i { font-style: normal; font-size: 12px; font-weight: 600; text-align: center; padding: 10px 0; border-radius: 8px; background: var(--mw-blue-50); color: var(--mw-navy); }
.mw-tables i.on { background: var(--mw-navy); color: #fff; }
.mw-tables i.bill { background: var(--mw-yellow); color: var(--mw-navy); }
.mw-pill--live { background: #E6F6EC; color: #1E7A41; margin-top: 8px; }
.mw-pill--live::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #2EAD5B; margin-right: 6px; vertical-align: middle; }
.mw-rp-stage [data-src="qr"] { left: 90px; top: 60px; transform: rotate(3.5deg); width: 240px; }
.mw-rp-stage [data-src="takeaway"] { left: 60px; top: 340px; transform: rotate(-3.5deg); width: 250px; }
.mw-rp-stage [data-src="delivery"] { right: 60px; top: 180px; transform: rotate(3.5deg); width: 280px; }
.mw-rp-beats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.mw-rp-beat img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: var(--mw-radius-photo); display: block; margin-bottom: 24px; }
.mw-rp-beat h3 { margin: 0 0 8px; }
.mw-rp-back > .mw-caption { margin-top: 48px; }
.mw-rp-own { display: grid; grid-template-columns: 1fr 620px; gap: 80px; align-items: center; }
.mw-rp-own .mw-sub { margin-bottom: 32px; }
.mw-compare { width: 100%; border-collapse: collapse; background: #fff; color: var(--mw-title, #1C1D24); border-radius: 16px; overflow: hidden; font-size: 15px; }
.mw-compare th, .mw-compare td { padding: 16px 20px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--mw-blue-50); }
.mw-compare thead th { font-size: 13px; font-weight: 600; color: var(--mw-subtitle, #6F7591); }
.mw-compare thead th:nth-child(2), .mw-compare td:nth-child(2) { background: #F4F6FF; color: var(--mw-navy); font-weight: 600; }
.mw-compare tbody th { font-weight: 600; width: 34%; }
.mw-compare td:nth-child(3) { color: var(--mw-subtitle, #6F7591); }
.mw-compare tr:last-child th, .mw-compare tr:last-child td { border-bottom: 0; }
.mw-rp-pricing { display: grid; grid-template-columns: 1fr 480px; gap: 80px; align-items: center; }
.mw-rp-explainer { background: var(--mw-blue-50); border-radius: 16px; padding: 40px; }
.mw-rp-explainer h3 { margin: 0 0 12px; }
.mw-rp-explainer p:last-child { margin: 20px 0 0; color: var(--mw-navy); }
.mw-rp-closing { padding-top: 120px; }
@media (max-width: 900px) {
	.mw-rp-hero { min-height: 0; padding-bottom: 0; }
	.mw-rp-hero .mw-rp-person { margin-bottom: 0; }
	.mw-rp-counter, .mw-rp-own, .mw-rp-pricing { grid-template-columns: 1fr; gap: 40px; }
	.mw-feats { grid-template-columns: 1fr; gap: 28px; }
	.mw-rp-beats { grid-template-columns: 1fr; gap: 40px; }
	.mw-rp-own { overflow-x: auto; }
	.mw-compare th, .mw-compare td { padding: 12px; font-size: 14px; }
	.mw-rp-explainer { padding: 28px; }
}

/* ===== Header flyout: Who it's for ===== */
.mw-flyout { position: relative; }
.mw-flyout__toggle { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; color: #fff; font: 500 15px/1 var(--wp--preset--font-family--poppins); }
.mw-flyout__toggle svg { transition: transform .2s ease-out; }
.mw-flyout__toggle:focus-visible { outline: 2px solid var(--mw-yellow); outline-offset: 6px; border-radius: 4px; }
.mw-flyout__menu { list-style: none; margin: 0; padding: 8px; position: absolute; left: -20px; top: calc(100% + 22px); width: 340px; background: #fff; border-radius: 16px; box-shadow: 0 24px 60px rgba(0, 21, 138, .22); opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .18s ease-out, transform .18s ease-out, visibility 0s linear .18s; z-index: 60; }
.mw-flyout__menu::before { content: ""; position: absolute; left: 0; right: 0; top: -22px; height: 22px; } /* hover bridge */
.mw-flyout.is-open .mw-flyout__menu, .mw-flyout:hover .mw-flyout__menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.mw-flyout.is-open .mw-flyout__toggle svg, .mw-flyout:hover .mw-flyout__toggle svg { transform: rotate(180deg); }
.mw-header nav .mw-flyout__menu a { display: block; padding: 12px 14px; border-radius: 10px; color: var(--mw-navy); line-height: 1.3; }
.mw-flyout__menu a b { display: block; font-weight: 600; font-size: 15px; }
.mw-flyout__menu a span { display: block; margin-top: 3px; font-weight: 400; font-size: 13px; color: var(--mw-subtitle, #6F7591); }
.mw-header nav .mw-flyout__menu a:hover, .mw-header nav .mw-flyout__menu a:focus-visible { background: var(--mw-blue-50); outline: none; }
.mw-header nav .mw-flyout__menu a[aria-current="page"] b { color: var(--mw-blue); }
@media (prefers-reduced-motion: reduce) { .mw-flyout__menu, .mw-flyout__toggle svg { transition: none; } }

.mw-header__nav { align-items: center; }
.mw-header__nav > a, .mw-flyout__toggle { line-height: 1; }

/* grid children: cancel WP flow-layout block gap so columns align */
.mw-rp-beats > *, .mw-feats > *, .mw-rp-counter > *, .mw-rp-own > *, .mw-rp-pricing > * { margin-block: 0; }
@media (max-width: 900px) { .mw-rp-hero .mw-rp-person { width: 86%; max-width: 420px; margin: 32px auto 0; } }

/* Footer links: Figma size, one line each */
.mw-footer__top ul a { font-size: 15px; line-height: 1.4; white-space: nowrap; }
@media (min-width: 1101px) { .mw-footer__top { gap: 48px; } }

/* ===== ACF blocks (v0.2) ===== */
.mw-rp-counter.is-full { grid-template-columns: 1fr; }
.mw-feats.cols-3 { grid-template-columns: repeat(3, 1fr); }
.mw-bill__lines { display: grid; grid-template-columns: 1fr auto; gap: 6px 16px; margin: 10px 0; font-size: 12px; }
.mw-bill { width: 300px; }
@media (max-width: 900px) { .mw-feats.cols-3 { grid-template-columns: 1fr; } }
/* Editor canvas: show animated elements at their final state */
.editor-styles-wrapper .mw-anim-hero .mw-hero__copy > *, .editor-styles-wrapper .mw-chip { opacity: 1 !important; transform: none !important; }

/* Bring them back: tab titles at H3 size (outranks the Global Styles rule) */
body .mw-back .mw-beat h3 { font-size: clamp(20px, 1.6vw, 22px); }

/* ===== Mobile fixes (27 Oct 2026) ===== */
.mw-burger, .mw-mnav { display: none; }
@media (max-width: 900px) {
	/* Phone menu */
	.mw-burger { all: unset; box-sizing: border-box; display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: 44px; height: 44px; padding: 0 11px; cursor: pointer; border-radius: 10px; }
	.mw-burger span { display: block; height: 2px; background: #fff; border-radius: 2px; transition: transform .2s ease-out, opacity .2s; }
	.mw-burger:focus-visible { outline: 2px solid var(--mw-yellow); outline-offset: 2px; }
	.mw-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.mw-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
	.mw-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
	.mw-header__actions { gap: 8px; }
	.mw-mnav { display: block; position: fixed; z-index: 70; left: 0; right: 0; bottom: 0; top: 60px; background: var(--mw-navy); overflow-y: auto; overscroll-behavior: contain; padding: 8px var(--mw-gutter) calc(24px + env(safe-area-inset-bottom)); opacity: 0; transform: translateY(-8px); transition: opacity .2s ease-out, transform .2s ease-out; }
	.mw-mnav[hidden] { display: none; }
	.mw-mnav.is-open { opacity: 1; transform: none; }
	html.mw-menu-open, html.mw-menu-open body { overflow: hidden; }
	html.mw-menu-open .mw-mobilebar { display: none; }
	.mw-mnav__list, .mw-mnav__list ul { list-style: none; margin: 0; padding: 0; }
	.mw-mnav__list > li { border-bottom: 1px solid rgba(255,255,255,.12); }
	.mw-mnav__label { display: block; padding: 18px 0 6px; color: var(--mw-yellow); font: 600 13px/1 var(--wp--preset--font-family--poppins); letter-spacing: .06em; text-transform: uppercase; }
	.mw-mnav__group ul { padding-bottom: 10px; }
	.mw-mnav__group a { display: block; padding: 10px 0; color: #fff; text-decoration: none; }
	.mw-mnav__group a b { display: block; font: 600 16px/1.3 var(--wp--preset--font-family--poppins); }
	.mw-mnav__group a span { display: block; margin-top: 2px; font: 400 13px/1.4 var(--wp--preset--font-family--poppins); color: rgba(255,255,255,.7); }
	.mw-mnav__top { display: block; padding: 18px 0; color: #fff; text-decoration: none; font: 600 17px/1.2 var(--wp--preset--font-family--poppins); }
	.mw-mnav a[aria-current="page"] b, .mw-mnav a.mw-mnav__top[aria-current="page"] { color: var(--mw-yellow); }
	.mw-mnav a:focus-visible { outline: 2px solid var(--mw-yellow); outline-offset: 2px; border-radius: 4px; }
	.mw-mnav__cta { display: grid; gap: 10px; margin-top: 24px; }
	.mw-mnav__btn { display: block; text-align: center; padding: 15px 12px; border-radius: 10px; font: 600 16px/1 var(--wp--preset--font-family--poppins); text-decoration: none; }
	.mw-mnav__btn.is-yellow { background: var(--mw-yellow); color: var(--mw-navy); }
	.mw-mnav__btn.is-outline { color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.5); }
	.mw-mnav__signin { display: block; text-align: center; padding: 14px; color: #fff; font: 500 15px/1 var(--wp--preset--font-family--poppins); }

	/* I run a…: less empty space above, a list that fits one screen so it can hold still while lines light up */
	.mw-router { padding-top: 8px; gap: 24px; }
	.mw-router__list { margin-bottom: 8px; }
	.mw-router__list a { font-size: clamp(26px, 7.4vw, 38px); }

	/* One screen: the fly-in on phones (JS adds .is-mob and sizes everything) */
	.mw-stage.is-mob { display: block; position: relative; height: var(--mw-stage-h, 640px); padding: 0; overflow: visible; }
	.mw-stage.is-mob .mw-card { position: absolute; right: auto; width: 250px; margin: 0; }
	.mw-stage.is-mob .mw-phone { position: absolute; margin: 0; width: 320px; height: 660px; order: 0; }

	/* 1 pickup · 4 drops: card sits at the photo's top corner at its own height */
	.mw-rush .mw-frag--tr { top: 12px; bottom: auto; left: 12px; right: auto; width: auto; max-width: calc(100% - 24px); }

	/* Bring them back: photo sticks under the header, beats scroll beneath it and light up in turn */
	.mw-back__photo { position: sticky; top: 84px; height: 36vh; aspect-ratio: auto; z-index: 2; }
	.mw-back__photo .mw-frag { right: 12px; left: auto; bottom: 12px; width: min(280px, 80%); }
	.mw-back__row { gap: 16px; }
	.mw-back__beats { padding-bottom: 30vh; }
	.mw-beat { opacity: .45; border-left-width: 2px; padding: 22px 0 22px 20px; }
	.mw-beat.is-active { opacity: 1; border-left-width: 4px; padding-left: 18px; }
}
@media (max-width: 600px) {
	/* The admin bar scrolls away on phones, so nothing should leave room for it */
	.admin-bar .wp-site-blocks > .wp-block-template-part:first-child, .admin-bar .mw-header { top: 0 !important; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 900px) {
	.mw-back__photo { position: relative; top: 0; }
	.mw-beat { opacity: 1; }
}
@media (max-width: 900px) {
	/* Header row fits one line on a phone: logo, trial button, menu */
	.mw-header__inner { gap: 12px; }
	.mw-header__actions .wp-block-button__link { white-space: nowrap; padding: 10px 14px; font-size: 14px; }
	.mw-burger { flex: none; }
}
@media (max-width: 900px) {
	/* Both ribbons visible (they were stacked on top of each other), and less empty space before "I run a…" */
	html body .mw-ribbons .mw-ribbon--pink { top: 24px; }
	html body .mw-ribbons .mw-ribbon--yellow { top: 104px; }
	html body .mw-router-section { padding-top: 24px; }
	/* 1 pickup · 4 drops: inside the photo's top corner on phones */
	html body .mw-rush .mw-frag--tr { top: 12px; bottom: auto; left: 12px; right: auto; }
	/* Bring them back: photo sits flush under the header, with a white band so text scrolling behind it doesn't peek out */
	html body .mw-back__photo { top: 76px; box-shadow: 0 -12px 0 12px #fff; }
}
/* Beats: the whole beat is tappable */
.mw-back .mw-beat { cursor: pointer; }
@media (max-width: 900px) {
	/* 1 pickup · 4 drops: bottom of the photo on phones, so the faces stay visible */
	html body .mw-rush .mw-frag--tr { top: auto; bottom: 12px; }
	/* Bring them back: no extra empty space below the last beat */
	html body .mw-back__beats { padding-bottom: 0; }
	/* Pricing phone: the image has a wide glow; pull the text and next section closer */
	html body .mw-pricing__phone { margin-top: -48px !important; }
	html body .mw-pricing__img { max-width: 300px; margin-inline: auto; margin-bottom: -120px; }
}
/* Footer on phones (27 Oct): nothing cut off, tighter lists, social links as a clean row */
@media (max-width: 900px) {
	html body .mw-footer { padding-top: 56px; }
	html body .mw-footer__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px 20px; }
	html body .mw-footer__top > div:first-child { grid-column: 1 / -1; }
	html body .mw-footer__top > div:first-child p { margin: 14px 0 !important; max-width: 34ch; }
	html body .mw-footer h2 { margin-bottom: 12px; }
	html body .mw-footer__top ul { gap: 4px; }
	html body .mw-footer__top ul a { display: block; padding: 6px 0; font-size: 15px; line-height: 1.35; white-space: normal; overflow-wrap: anywhere; }
	html body .mw-footer__bottom { flex-direction: column; gap: 14px; margin-top: 40px; padding: 24px 0 32px; }
	html body .mw-footer__social { order: -1; display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: 0; }
	html body .mw-footer__social a { font-size: 14px; padding: 6px 0; color: rgba(255,255,255,.85); }
}
/* Touch screens: a tapped link shouldn't stay highlighted */
@media (hover: none) { .mw-footer a:hover { color: rgba(255,255,255,.72); } .mw-footer__social a:hover { color: rgba(255,255,255,.85); } }
/* Footer has four link columns now (Support removed 27 Oct) */
@media (min-width: 1101px) { html body .mw-footer__top { grid-template-columns: 340px repeat(4, auto); } }