/* MB v3 homepage (build-first, US market). Scoped under .v3 so the rest of the theme is untouched. */
@font-face { font-family: "MBText"; src: url("../fonts/inter-regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "MBText"; src: url("../fonts/inter-medium.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "MBText"; src: url("../fonts/inter-semibold.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "MBText"; src: url("../fonts/inter-bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "MBDisplay"; src: url("../fonts/interdisplay-bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "MBDisplay"; src: url("../fonts/interdisplay-extrabold.woff2") format("woff2"); font-weight: 800; font-display: swap; }

/* Header and footer: same new type on every page */
.mb-header, .mb-footer { font-family: "MBText", system-ui, sans-serif; font-feature-settings: "cv08" 1; }
.mb-brand-name, .mb-footer .mb-brand span:last-child { font-family: "MBDisplay", system-ui, sans-serif; font-weight: 700; letter-spacing: -0.01em; }

.v3 {
	--ink: #14131A; --ink2: #3B3A47; --mute: #6F6D80; --line: #E8E6F0; --bg: #FBFBFD;
	--v: #6E56F8; --soft: #F2EFFF; --ok: #12804A;
	font-family: "MBText", system-ui, -apple-system, sans-serif; font-feature-settings: "cv08" 1;
	color: var(--ink); -webkit-font-smoothing: antialiased; overflow-x: clip;
}
.v3 *, .v3 *::before, .v3 *::after { box-sizing: border-box; }
.v3 h1, .v3 h2, .v3 h3, .v3 p, .v3 ul, .v3 li { margin: 0; padding: 0; }
.v3 a { color: inherit; text-decoration: none; }
.v3 h1, .v3 h2, .v3 h3 { font-family: "MBDisplay", system-ui, sans-serif; letter-spacing: -0.028em; color: var(--ink); }
.v3-wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; }
.v3-eyebrow { font: 600 12.5px/1.3 "MBText", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--v); }
.v3-btn { white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; gap: 10px; font: 600 15.5px/1 "MBText", sans-serif; padding: 16px 24px; border-radius: 999px; border: 1px solid transparent; cursor: pointer; transition: transform .2s, background .2s, box-shadow .2s; }
.v3-btn:hover { transform: translateY(-1px); }
.v3-btn.is-dark { background: var(--ink); color: #fff; }
.v3-btn.is-dark:hover { background: #2a2838; box-shadow: 0 12px 24px -12px rgba(20,19,26,.5); }
.v3-btn.is-light { background: #fff; border-color: var(--line); color: var(--ink); }
.v3-btn.is-white { background: #fff; color: var(--ink); }
.v3-btn:focus-visible { outline: 3px solid var(--v); outline-offset: 3px; }

/* Hero */
.v3-hero { position: relative; overflow: hidden; padding: 88px 0 80px; }
.v3-hero::before { content: ""; position: absolute; width: 1000px; height: 1000px; right: -320px; top: -460px; background: radial-gradient(closest-side, rgba(181,165,255,.55), transparent); pointer-events: none; }
.v3-hero::after { content: ""; position: absolute; width: 760px; height: 760px; left: -360px; bottom: -460px; background: radial-gradient(closest-side, rgba(255,200,176,.45), transparent); pointer-events: none; }
.v3-hero .v3-wrap { position: relative; z-index: 1; display: grid; grid-template-columns: 1.2fr .8fr; gap: 56px; align-items: center; }
.v3-hero h1 { font-size: clamp(42px, 5.2vw, 62px); line-height: 1.02; font-weight: 800; margin-top: 18px; }
.v3-grad { background: linear-gradient(90deg, #6E56F8, #B04AE0 60%, #FF6A3D); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: 4px; }
.v3-sub { font: 400 19px/1.55 "MBText", sans-serif; color: var(--ink2); margin-top: 22px !important; max-width: 540px; }
.v3-cta { display: flex; gap: 12px; margin-top: 32px; flex-wrap: wrap; }
.v3-who { display: flex; align-items: center; gap: 12px; margin-top: 30px; }
.v3-who img { width: 46px; height: 46px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 4px 12px rgba(0,0,0,.12); object-fit: cover; }
.v3-who div { font: 500 13.5px/1.4 "MBText", sans-serif; color: var(--mute); }
.v3-who b { color: var(--ink); font-weight: 600; }

.v3-viz { background: #fff; border: 1px solid var(--line); border-radius: 28px; padding: 26px; box-shadow: 0 40px 80px -40px rgba(60,40,160,.35); }
.v3-viz-h { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.v3-viz-h b { font: 700 15px "MBDisplay", sans-serif; }
.v3-tag { font: 600 11.5px "MBText", sans-serif; color: var(--ok); background: #E8F8F0; padding: 5px 10px; border-radius: 999px; white-space: nowrap; }
.v3-flow { display: grid; gap: 10px; margin-top: 18px; }
.v3-fl { display: flex; align-items: center; gap: 14px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: var(--bg); }
.v3-fl i { width: 38px; height: 38px; border-radius: 11px; background: var(--soft); display: grid; place-items: center; flex: none; }
.v3-fl b { display: block; font: 600 14.5px "MBText", sans-serif; }
.v3-fl span { font: 400 12.5px "MBText", sans-serif; color: var(--mute); }
.v3-fl em { margin-left: auto; font: 600 12px "MBText", sans-serif; color: var(--v); font-style: normal; }
.v3-bars { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); display: grid; gap: 12px; }
.v3-bar { display: grid; grid-template-columns: 56px 1fr 78px; align-items: center; gap: 12px; font: 500 13px "MBText", sans-serif; color: var(--mute); }
.v3-bar .t { height: 10px; border-radius: 99px; background: var(--line); overflow: hidden; }
.v3-bar .t i { display: block; height: 100%; border-radius: 99px; }
.v3-bar b { color: var(--ink); font-weight: 700; text-align: right; }
.v3-viz small { display: block; margin-top: 14px; font: 500 11.5px/1.45 "MBText", sans-serif; color: var(--mute); }

/* Proof */
.v3-proof { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }
.v3-proof .v3-wrap { display: grid; grid-template-columns: repeat(4, 1fr); }
.v3-proof .i { padding: 26px 22px; border-left: 1px solid var(--line); }
.v3-proof .i:first-child { border-left: 0; padding-left: 0; }
.v3-proof b { display: block; font: 800 26px/1.2 "MBDisplay", sans-serif; letter-spacing: -.02em; }
.v3-proof span { font: 500 13.5px/1.4 "MBText", sans-serif; color: var(--mute); }
.v3-proof a { color: var(--v); font-weight: 600; }

.v3-blk { padding: 104px 0; scroll-margin-top: 80px; }
.v3-blk.tight { padding-top: 0; }
.v3-head { max-width: 700px; }
.v3-head h2 { font-size: clamp(32px, 4vw, 46px); line-height: 1.05; font-weight: 800; margin-top: 14px; }
.v3-head p { font: 400 17.5px/1.6 "MBText", sans-serif; color: var(--ink2); margin-top: 16px; }

/* Services */
.v3-svc { display: grid; grid-template-columns: 1.3fr 1fr; gap: 18px; margin-top: 48px; }
.v3-card { background: #fff; border: 1px solid var(--line); border-radius: 26px; padding: 32px; position: relative; overflow: hidden; scroll-margin-top: 90px; }
.v3-card.is-big { grid-row: span 2; background: #121118; color: #fff; border: 0; }
.v3-card.is-big::before { content: ""; position: absolute; width: 700px; height: 700px; right: -280px; bottom: -360px; background: radial-gradient(closest-side, rgba(110,86,248,.55), transparent); pointer-events: none; }
.v3-card .k { font: 700 12px "MBText", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--v); position: relative; }
.v3-card.is-big .k { color: #B9A9FF; }
.v3-card h3 { font-size: 30px; font-weight: 800; line-height: 1.1; margin-top: 12px; position: relative; }
.v3-card.is-big h3 { color: #fff; }
.v3-card p { font: 400 15.5px/1.6 "MBText", sans-serif; color: var(--mute); margin-top: 10px; position: relative; }
.v3-card.is-big p { color: #B9B6CC; }
.v3-card ul { list-style: none; margin-top: 22px; display: grid; gap: 12px; position: relative; }
.v3-card li { display: flex; gap: 12px; font: 500 15.5px/1.45 "MBText", sans-serif; }
.v3-card li::before { content: ""; flex: none; width: 22px; height: 22px; border-radius: 50%; margin-top: 1px; background: rgba(185,169,255,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%23B9A9FF' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat; }
.v3-card .foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 28px; position: relative; flex-wrap: wrap; }
.v3-card .foot span { font: 500 13.5px "MBText", sans-serif; color: #B9B6CC; }
.v3-price { font: 800 34px "MBDisplay", sans-serif; letter-spacing: -.03em; margin-top: 14px; position: relative; }
.v3-price small { font: 500 14px "MBText", sans-serif; color: var(--mute); letter-spacing: 0; }
.v3-lnk { font: 600 15px "MBText", sans-serif; color: var(--v) !important; background: none; border: 0; padding: 0; cursor: pointer; }
.v3-uses { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.v3-uses span { background: #fff; border: 1px solid var(--line); border-radius: 999px; padding: 10px 16px; font: 500 14.5px "MBText", sans-serif; color: var(--ink2); }

/* Work */
.v3-work { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 48px; }
.v3-wk { background: #fff; border: 1px solid var(--line); border-radius: 24px; padding: 28px; display: flex; flex-direction: column; }
.v3-wk .k { font: 700 11.5px "MBText", sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--mute); }
.v3-wk h3 { font-size: 22px; font-weight: 700; margin-top: 12px; }
.v3-wk p { font: 400 15px/1.55 "MBText", sans-serif; color: var(--mute); margin-top: 8px; }
.v3-wk .big { font: 800 40px/1 "MBDisplay", sans-serif; letter-spacing: -.03em; margin-top: auto; padding-top: 22px; }
.v3-wk .big small { font: 500 14px "MBText", sans-serif; color: var(--mute); letter-spacing: 0; }
.v3-wk .stat { margin-top: auto; padding-top: 22px; font: 600 13px "MBText", sans-serif; color: var(--v); }

/* Steps */
.v3-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; margin-top: 48px; }
.v3-st { padding: 26px; border-radius: 22px; background: #fff; border: 1px solid var(--line); }
.v3-st i { font: 700 13px "MBText", sans-serif; font-style: normal; color: var(--v); background: var(--soft); border-radius: 8px; padding: 5px 9px; }
.v3-st h3 { font-size: 19px; font-weight: 700; margin-top: 18px; }
.v3-st p { font: 400 14.5px/1.55 "MBText", sans-serif; color: var(--mute); margin-top: 6px; }

/* About */
.v3-about { display: grid; grid-template-columns: .75fr 1.25fr; gap: 64px; align-items: center; }
.v3-about img { width: 100%; max-width: 360px; aspect-ratio: 1; object-fit: cover; border-radius: 50%; border: 8px solid #fff; box-shadow: 0 30px 60px -30px rgba(60,40,160,.3); }
.v3-about h2 { font-size: clamp(32px, 3.6vw, 42px); font-weight: 800; line-height: 1.08; margin-top: 14px; }
.v3-about p { font: 400 17px/1.65 "MBText", sans-serif; color: var(--ink2); margin-top: 16px; }

/* Final CTA */
.v3-final { background: linear-gradient(135deg, #6E56F8, #8A4DE8 55%, #D15FA8); color: #fff; border-radius: 36px; padding: 72px 56px; text-align: center; }
.v3-final h2 { font-size: clamp(32px, 4.2vw, 50px); font-weight: 800; line-height: 1.04; color: #fff; }
.v3-final p { font: 400 18px/1.6 "MBText", sans-serif; color: rgba(255,255,255,.88); margin: 16px auto 0; max-width: 580px; }
.v3-final .v3-cta { justify-content: center; }
.v3-final .v3-btn.is-light { background: transparent; color: #fff; border-color: rgba(255,255,255,.45); }
.v3-final .note { font: 500 13px "MBText", sans-serif; color: rgba(255,255,255,.75); margin-top: 20px; }
.v3-final .note a { text-decoration: underline; }

@media (max-width: 900px) {
	.v3-hero .v3-wrap, .v3-about { grid-template-columns: 1fr; }
	.v3-svc, .v3-work { grid-template-columns: 1fr; }
	.v3-card.is-big { grid-row: auto; }
	.v3-steps { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
	.v3-wrap { padding: 0 20px; }
	.v3-hero { padding: 44px 0 52px; }
	.v3-hero .v3-wrap { gap: 36px; }
	.v3-sub { font-size: 17px; }
	.v3-cta .v3-btn { width: 100%; }
	.v3-proof .v3-wrap { grid-template-columns: 1fr 1fr; }
	.v3-proof .i { border-left: 0; padding: 20px 0; border-bottom: 1px solid var(--line); }
	.v3-blk { padding: 72px 0; }
	.v3-card { padding: 26px; }
	.v3-card h3 { font-size: 26px; }
	.v3-steps { grid-template-columns: 1fr; }
	.v3-about { gap: 28px; }
	.v3-about img { max-width: 220px; }
	.v3-final { padding: 48px 24px; border-radius: 28px; }
}
@media (prefers-reduced-motion: reduce) { .v3-btn { transition: none; } .v3-btn:hover { transform: none; } }

/* Fixes after first live check */
.v3 p.v3-eyebrow { font: 600 12.5px/1.3 "MBText", sans-serif !important; letter-spacing: .14em; text-transform: uppercase; color: var(--v) !important; margin: 0 !important; }
.v3-proof span { display: block; line-height: 1.45; margin-top: 2px; }
.v3 p { text-wrap: pretty; }
.v3-fl span { display: block; line-height: 1.4; margin-top: 2px; }

/* ===== v3.1: 3D, motion, FAQ ===== */
/* Build card: content flows top to bottom, 3D stack fills the space */
.v3-card.is-big { display: flex; flex-direction: column; }
.v3-card.is-big .foot { margin-top: 0; }
.v3-stack { flex: 1; min-height: 230px; perspective: 1100px; display: grid; place-items: center; margin: 18px 0 20px; position: relative; }
.v3-stack-in { position: relative; width: 300px; height: 190px; transform-style: preserve-3d; transform: rotateX(56deg) rotateZ(-38deg); }
.v3-layer { position: absolute; inset: 0; border-radius: 18px; padding: 16px 18px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.16); box-shadow: 0 30px 50px -20px rgba(0,0,0,.6); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; animation: v3float 6s ease-in-out infinite; }
.v3-layer .lb { display: inline-block; font: 600 11px "MBText", sans-serif; letter-spacing: .06em; color: #CFC6FF; background: rgba(110,86,248,.35); border-radius: 99px; padding: 4px 9px; }
.v3-layer.l1 { transform: translateZ(0); --z: 0px; }
.v3-layer.l2 { transform: translateZ(56px); --z: 56px; animation-delay: -2s; background: rgba(110,86,248,.22); }
.v3-layer.l3 { transform: translateZ(112px); --z: 112px; animation-delay: -4s; background: rgba(255,255,255,.12); }
.v3-layer .grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 14px; }
.v3-layer .grid i { height: 18px; border-radius: 5px; background: rgba(255,255,255,.14); }
.v3-layer .grid i:nth-child(3n+1) { background: rgba(185,169,255,.4); }
.v3-layer .q { font: 500 12.5px/1.4 "MBText", sans-serif !important; color: #fff !important; margin: 12px 0 0 !important; }
.v3-layer .a { font: 400 12px/1.4 "MBText", sans-serif !important; color: #D8D2F5 !important; margin: 6px 0 0 !important; }
.v3-layer b { display: block; margin-top: 14px; font: 600 14px "MBText", sans-serif; color: #9BF0C4; }
@keyframes v3float { 0%, 100% { transform: translateZ(var(--z)); } 50% { transform: translateZ(calc(var(--z) + 14px)); } }

/* Hero: 3D tilt card + floating motion */
.v3-viz-wrap { perspective: 1200px; }
.v3-viz { transform-style: preserve-3d; transform: rotateX(var(--rx, 6deg)) rotateY(var(--ry, -10deg)); transition: transform .25s ease-out; will-change: transform; }
.v3-viz-h, .v3-flow, .v3-bars { transform: translateZ(28px); }
.v3-hero::before { animation: v3orb 16s ease-in-out infinite alternate; }
.v3-hero::after { animation: v3orb 20s ease-in-out infinite alternate-reverse; }
@keyframes v3orb { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-60px, 40px, 0); } }
/* Flow steps light up one after another */
.v3-fl { transition: border-color .3s, box-shadow .3s; animation: v3step 6s infinite; }
.v3-fl:nth-child(2) { animation-delay: 2s; }
.v3-fl:nth-child(3) { animation-delay: 4s; }
@keyframes v3step { 0%, 30% { border-color: #CFC6FF; box-shadow: 0 10px 24px -14px rgba(110,86,248,.55); background: #fff; } 34%, 100% { border-color: var(--line); box-shadow: none; } }
.v3-tag::first-letter { animation: v3blink 1.6s infinite; }
@keyframes v3blink { 50% { opacity: .2; } }
/* Bars fill when visible */
.js .v3-bar .t i { transform-origin: left; transform: scaleX(0); transition: transform 1.2s cubic-bezier(.2,.8,.2,1) .2s; }
.js .v3-viz.in .v3-bar .t i { transform: scaleX(1); }

/* Scroll reveal (only when JS runs) */
.js .v3 [data-r] { opacity: 0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.js .v3 [data-r].in { opacity: 1; transform: none; }
.v3-wk, .v3-st, .v3-card:not(.is-big) { transition: transform .25s ease, box-shadow .25s ease, border-color .25s; }
.v3-wk:hover, .v3-st:hover, .v3-card:not(.is-big):hover { transform: translateY(-4px); box-shadow: 0 24px 40px -28px rgba(60,40,160,.45); border-color: #D9D2FB; }

/* FAQ */
.v3-faq { display: grid; grid-template-columns: .8fr 1.2fr; gap: 56px; align-items: start; }
.v3-qa { display: grid; gap: 10px; }
.v3-qa details { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 0 22px; }
.v3-qa summary { list-style: none; cursor: pointer; padding: 20px 30px 20px 0; position: relative; font: 600 16.5px/1.4 "MBText", sans-serif; color: var(--ink); }
.v3-qa summary::-webkit-details-marker { display: none; }
.v3-qa summary::after { content: ""; position: absolute; right: 0; top: 50%; width: 12px; height: 12px; margin-top: -8px; border-right: 2px solid var(--v); border-bottom: 2px solid var(--v); transform: rotate(45deg); transition: transform .2s; }
.v3-qa details[open] summary::after { transform: rotate(-135deg); margin-top: -2px; }
.v3-qa details p { font: 400 15.5px/1.6 "MBText", sans-serif !important; color: var(--mute) !important; margin: 0 !important; padding-bottom: 20px; }
@media (max-width: 900px) { .v3-faq { grid-template-columns: 1fr; gap: 28px; } }
@media (max-width: 760px) {
	.v3-viz { transform: none; }
	.v3-stack { min-height: 200px; }
	.v3-stack-in { width: 240px; height: 150px; }
}
@media (prefers-reduced-motion: reduce) {
	.v3-layer, .v3-hero::before, .v3-hero::after, .v3-fl, .v3-tag::first-letter { animation: none !important; }
	.js .v3 [data-r] { opacity: 1; transform: none; transition: none; }
	.js .v3-bar .t i { transform: none; transition: none; }
	.v3-viz { transition: none; }
}
/* stack sizing: keep the 3D layers inside their own space */
.v3-stack { min-height: 300px; margin: 26px 0 8px; overflow: visible; }
.v3-stack-in { width: 260px; height: 160px; transform: translateY(30px) rotateX(55deg) rotateZ(-35deg); }
.v3-layer { -webkit-backdrop-filter: none; backdrop-filter: none; }
.v3-layer.l1 { background: #24213A; } .v3-layer.l2 { background: #2E2756; } .v3-layer.l3 { background: #3A2F72; }
.v3-layer.l2 { --z: 50px; transform: translateZ(50px); } .v3-layer.l3 { --z: 100px; transform: translateZ(100px); }
@media (max-width: 760px) { .v3-stack { min-height: 250px; } .v3-stack-in { width: 220px; height: 136px; } }
.v3-stack-in { transform: translateY(46px) rotateX(55deg) rotateZ(-35deg); }
.v3-layer.l2 { --z: 72px; transform: translateZ(72px); } .v3-layer.l3 { --z: 144px; transform: translateZ(144px); }
.v3-stack { min-height: 330px; }
@media (max-width: 760px) { .v3-stack { min-height: 280px; } }
/* One font family across the site (lighter: the older Inter, Space Grotesk and JetBrains files are no longer downloaded) */
:root {
	--f-display: "MBDisplay", "Tajawal", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--f-body: "MBText", "Tajawal", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--f-mono: "MBText", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
body { font-feature-settings: "cv08" 1; }

/* Booking window */
.v3-lock, .v3-lock body { overflow: hidden; }
.v3-modal { position: fixed; inset: 0; z-index: 10000; display: none; align-items: center; justify-content: center; padding: 24px; background: rgba(20,19,26,.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); font-family: "MBText", system-ui, sans-serif; font-feature-settings: "cv08" 1; }
.v3-modal.is-open { display: flex; animation: v3fade .2s ease; }
.v3-modal-box { width: min(1020px, 100%); height: min(760px, 100%); background: #fff; border-radius: 26px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 40px 100px -30px rgba(20,10,70,.6); animation: v3pop .28s cubic-bezier(.2,.8,.2,1); }
.v3-modal-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 18px 16px 22px; border-bottom: 1px solid #E8E6F0; }
.v3-modal-who { display: flex; align-items: center; gap: 12px; }
.v3-modal-mk { width: 38px; height: 38px; border-radius: 11px; background: linear-gradient(135deg,#6E56F8,#B04AE0 60%,#FF6A3D); color: #fff; display: grid; place-items: center; font: 800 13px "MBDisplay", sans-serif; flex: none; }
.v3-modal-who b { display: block; font: 700 16px "MBDisplay", sans-serif; color: #14131A; }
.v3-modal-who span { font: 500 13px "MBText", sans-serif; color: #6F6D80; }
.v3-modal-x { width: 42px; height: 42px; border-radius: 50%; border: 1px solid #E8E6F0; background: #fff; font: 400 26px/1 "MBText", sans-serif; color: #14131A; cursor: pointer; display: grid; place-items: center; }
.v3-modal-x:hover { background: #F2EFFF; }
.v3-modal-body { position: relative; flex: 1; }
.v3-modal-body iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; opacity: 0; transition: opacity .3s; }
.v3-modal.is-loaded iframe { opacity: 1; }
.v3-modal-load { position: absolute; inset: 0; display: grid; place-items: center; font: 500 14px "MBText", sans-serif; color: #6F6D80; }
@keyframes v3fade { from { opacity: 0; } }
@keyframes v3pop { from { transform: translateY(16px) scale(.98); opacity: 0; } }
@media (max-width: 760px) {
	.v3-modal { padding: 0; }
	.v3-modal-box { width: 100%; height: 100%; border-radius: 0; }
	.v3-modal-top { padding: 12px 14px 12px 16px; padding-top: max(12px, env(safe-area-inset-top)); }
}
.v3-modal.is-loaded .v3-modal-load { display: none; } .v3-modal-body iframe { background: #fff; }
.v3-modal-box { width: min(880px, 100%); }
.v3-modal-mk { color: #fff !important; }