/* MiliienkoStudio — Signal Blue 2026 */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/inter-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/inter-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
/* Display serif: preloaded and "optional" so a late load never reflows the big headings (CLS). */
@font-face { font-family: "Instrument Serif"; font-style: normal; font-weight: 400; font-display: optional; src: url("../fonts/InstrumentSerif-Regular.woff2") format("woff2"); }
@font-face { font-family: "Instrument Serif"; font-style: italic; font-weight: 400; font-display: optional; src: url("../fonts/InstrumentSerif-Italic.woff2") format("woff2"); }
/* Arial scaled to Inter's metrics: text keeps its size when Inter swaps in. */
@font-face { font-family: "Inter Fallback"; src: local("Arial"); size-adjust: 107.4%; ascent-override: 90.2%; descent-override: 22.48%; line-gap-override: 0%; }

:root {
	--c-void: #03060E;
	--c-ink: #070D1A;
	--c-ink-2: #0C1528;
	--c-ink-3: #142038;
	--c-surface: rgba(255, 255, 255, .04);
	--c-surface-2: rgba(255, 255, 255, .07);
	--c-line-dark: rgba(255, 255, 255, .08);
	--c-line-dark-2: rgba(255, 255, 255, .16);
	--c-blue: #1677FF;
	--c-blue-600: #0B63E0;
	--c-cyan: #5EB8FF;
	--c-blue-50: rgba(94, 184, 255, .12);
	--c-text: #E6ECF7;
	--c-muted: #95A6BF;
	--c-on-dark: #F5F8FF;
	--c-on-dark-muted: #9AABC4;
	--c-bg: #050A15;
	--c-bg-muted: #0A1222;
	--c-line: rgba(255, 255, 255, .09);
	--c-line-2: rgba(255, 255, 255, .18);
	--c-ok: #4ADE80;
	--c-ok-bg: rgba(74, 222, 128, .12);
	--c-err: #FF7A6E;
	--c-err-bg: rgba(255, 122, 110, .12);
	--grad-brand: linear-gradient(135deg, var(--c-cyan), var(--c-blue));
	--grad-hero: radial-gradient(90% 70% at 78% 8%, rgba(22, 119, 255, .38) 0%, transparent 55%), radial-gradient(60% 50% at 10% 90%, rgba(56, 182, 255, .12) 0%, transparent 50%), var(--c-void);
	--grad-dark: radial-gradient(80% 90% at 100% 0%, rgba(22, 119, 255, .28) 0%, transparent 55%), var(--c-ink);
	--grad-footer: linear-gradient(180deg, #0A1224 0%, var(--c-void) 100%);
	--grad-mesh-a: radial-gradient(circle at 30% 20%, rgba(94, 184, 255, .55), transparent 42%), radial-gradient(circle at 80% 70%, rgba(22, 119, 255, .7), transparent 50%), linear-gradient(160deg, #0A1A38, #050A16);
	--grad-mesh-b: radial-gradient(circle at 70% 25%, rgba(22, 119, 255, .5), transparent 45%), radial-gradient(circle at 20% 80%, rgba(94, 184, 255, .35), transparent 40%), linear-gradient(200deg, #0C1830, #040810);
	--grad-mesh-c: radial-gradient(circle at 50% 0%, rgba(94, 184, 255, .4), transparent 50%), linear-gradient(180deg, #0E2040, #060B16);
	--grad-mesh-d: conic-gradient(from 210deg at 50% 50%, #0B63E0, #050A16, #5EB8FF, #0B1220, #1677FF);
	--grad-mesh-e: radial-gradient(ellipse at 40% 40%, rgba(22, 119, 255, .45), transparent 55%), linear-gradient(135deg, #081428, #03060E);

	--font: "Inter", "Inter Fallback", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--font-display: "Instrument Serif", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
	--dock-mobile-h: 0px;
	--dock-gap: 16px;
	--fs-xs: .8125rem;
	--fs-sm: .9375rem;
	--fs-base: 1.0625rem;
	--fs-lead: clamp(1.0625rem, .98rem + .4vw, 1.25rem);
	--fs-h3: clamp(1.2rem, 1.1rem + .4vw, 1.4rem);
	--fs-h2: clamp(1.9rem, 1.45rem + 1.85vw, 3.05rem);
	--fs-h1: clamp(2.35rem, 1.6rem + 3.1vw, 4.65rem);
	--fs-h1-page: clamp(2.15rem, 1.55rem + 2.35vw, 3.55rem);

	--sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem; --sp-5: 1.5rem;
	--sp-6: 2rem; --sp-7: 2.5rem; --sp-8: 3rem; --sp-9: 4rem; --sp-10: 5rem;
	--section-y: clamp(4rem, 2.5rem + 5vw, 8rem);
	--gutter: clamp(1.125rem, .8rem + 1.5vw, 2.5rem);
	--max: 1240px;
	--max-prose: 42rem;
	--header-h: 76px;
	--r-sm: 10px; --r-btn: 999px; --r-card: 22px; --r-lg: 28px;
	--sh-card: inset 0 1px 0 rgba(255, 255, 255, .05), 0 24px 60px rgba(0, 0, 0, .35);
	--sh-hover: inset 0 1px 0 rgba(255, 255, 255, .08), 0 30px 80px rgba(0, 0, 0, .5), 0 0 40px rgba(22, 119, 255, .18);
	--sh-float: 0 40px 100px rgba(0, 0, 0, .55);
	--sh-glow: 0 0 80px rgba(22, 119, 255, .35);
	--ease: cubic-bezier(.22, .7, .2, 1);
	--focus: 0 0 0 3px var(--c-bg), 0 0 0 5px var(--c-blue);
	--focus-dark: 0 0 0 3px var(--c-ink), 0 0 0 5px var(--c-cyan);
	/* Device mockups (hero reel) — aluminium, glass, titanium */
	--dev-alu-hi: #E9ECF1;
	--dev-alu: #C3C8D0;
	--dev-alu-lo: #8E949E;
	--dev-alu-edge: #5E646E;
	--dev-glass: #07090D;
	--dev-bezel: #0B0D12;
	--dev-ti-hi: #9EA3AB;
	--dev-ti: #4E535B;
	--dev-ti-lo: #24272C;
	--dev-cam: #1A2233;
	--dev-cam-hi: #3B4A66;
	--dev-hinge: #1B1E24;
	--dev-hinge-hi: #3A3E46;
	--dev-black: #000;
	--dev-dot-red: #FF5F57;
	--dev-dot-amber: #FEBC2E;
	--dev-dot-green: #28C840;
	--grain-opacity: .035;
	/* Experience layer (glass room, scroll motion) */
	--glass: linear-gradient(160deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .02) 45%, rgba(94, 184, 255, .04));
	--glass-edge: linear-gradient(150deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, .04) 35%, rgba(94, 184, 255, .08) 70%, rgba(94, 184, 255, .45));
	--glass-blur: blur(18px) saturate(140%);
	--c-white: #FFFFFF;
	--glow-blue: rgba(22, 119, 255, .55);
	--glow-cyan: rgba(94, 184, 255, .45);
	--grid-line: rgba(94, 184, 255, .13);
	--ease-out: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + var(--sp-4)); }
body {
	margin: 0;
	font-family: var(--font);
	font-size: var(--fs-base);
	line-height: 1.65;
	color: var(--c-text);
	background: var(--c-bg);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	font-feature-settings: "cv11", "ss01";
	overflow-x: hidden;
	padding-bottom: var(--dock-mobile-h);
}
html { scroll-padding-bottom: var(--dock-mobile-h); }
body::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: 9999;
	pointer-events: none;
	opacity: var(--grain-opacity);
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	background-size: 180px;
	mix-blend-mode: overlay;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: var(--c-blue); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--c-blue-600); }
:focus-visible { outline: none; box-shadow: var(--focus); border-radius: 6px; }
h1, h2, h3, h4 { margin: 0 0 var(--sp-4); line-height: 1.08; letter-spacing: -.01em; font-weight: 700; color: inherit; text-wrap: balance; }
h1, h2 { font-family: var(--font-display); font-weight: 500; letter-spacing: -.005em; line-height: 1.05; }
h1 { font-size: var(--fs-h1); letter-spacing: 0; line-height: 1.04; }
h2 { font-size: var(--fs-h2); line-height: 1.06; }
h3 { font-size: var(--fs-h3); line-height: 1.25; letter-spacing: -.01em; font-weight: 680; font-family: var(--font); }
p { margin: 0 0 var(--sp-4); text-wrap: pretty; }
p:last-child { margin-bottom: 0; }
ul, ol { margin: 0 0 var(--sp-4); }
address { font-style: normal; }
button, input, select, textarea { font: inherit; color: inherit; }
::selection { background: var(--c-blue); color: var(--c-on-dark); }

.ms-skip { position: absolute; left: var(--sp-4); top: -100px; z-index: 100; padding: var(--sp-3) var(--sp-4); background: var(--c-blue); color: var(--c-on-dark); border-radius: var(--r-sm); }
.ms-skip:focus { top: var(--sp-4); color: var(--c-on-dark); }
.ms-wrap { width: min(var(--max), 100% - 2 * var(--gutter)); margin-inline: auto; }

/* Icons */
.ms-icon { display: inline-block; flex: none; width: 1.5rem; height: 1.5rem; background: currentColor; -webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat; vertical-align: middle; }
.ms-icon--sm { width: 1rem; height: 1rem; }
[data-icon="arrow-up-right"] { --i: url("../icons/arrow-up-right.svg"); }
[data-icon="bot"] { --i: url("../icons/bot.svg"); }
[data-icon="calendar"] { --i: url("../icons/calendar.svg"); }
[data-icon="chart"] { --i: url("../icons/chart.svg"); }
[data-icon="check"] { --i: url("../icons/check.svg"); }
[data-icon="globe"] { --i: url("../icons/globe.svg"); }
[data-icon="handshake"] { --i: url("../icons/handshake.svg"); }
[data-icon="mail"] { --i: url("../icons/mail.svg"); }
[data-icon="map-pin"] { --i: url("../icons/map-pin.svg"); }
[data-icon="menu"] { --i: url("../icons/menu.svg"); }
[data-icon="message-circle"] { --i: url("../icons/message-circle.svg"); }
[data-icon="monitor"] { --i: url("../icons/monitor.svg"); }
[data-icon="phone"] { --i: url("../icons/phone.svg"); }
[data-icon="send"] { --i: url("../icons/send.svg"); }
[data-icon="settings"] { --i: url("../icons/settings.svg"); }
[data-icon="shield-check"] { --i: url("../icons/shield-check.svg"); }
[data-icon="shopping-cart"] { --i: url("../icons/shopping-cart.svg"); }
[data-icon="video"] { --i: url("../icons/video.svg"); }
[data-icon="zap"] { --i: url("../icons/zap.svg"); }

/* Buttons */
.ms-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: var(--sp-2);
	min-height: 52px; padding: 0 var(--sp-6);
	border: 1px solid transparent; border-radius: var(--r-btn);
	font-size: var(--fs-sm); font-weight: 650; line-height: 1.2;
	text-decoration: none; cursor: pointer; white-space: nowrap;
	transition: transform .25s var(--ease), background-color .2s, border-color .2s, box-shadow .25s, color .2s;
}
.ms-btn .ms-icon { width: 1.125rem; height: 1.125rem; }
.ms-btn:hover { transform: translateY(-2px); }
.ms-btn:active { transform: translateY(0); }
.ms-btn--primary {
	background: var(--c-blue); color: var(--c-on-dark);
	box-shadow: 0 10px 32px rgba(22, 119, 255, .35), inset 0 1px 0 rgba(255, 255, 255, .2);
	transform: translate(var(--mx, 0), var(--my, 0));
}
.ms-btn--primary:hover {
	background: var(--c-blue-600); color: var(--c-on-dark);
	box-shadow: 0 16px 40px rgba(22, 119, 255, .45), inset 0 1px 0 rgba(255, 255, 255, .2);
	transform: translate(var(--mx, 0), calc(var(--my, 0px) - 2px));
}
.ms-btn--secondary {
	background: var(--c-surface-2); color: var(--c-on-dark);
	border-color: var(--c-line-dark-2); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.ms-btn--secondary:hover { background: rgba(255, 255, 255, .12); color: var(--c-on-dark); border-color: var(--c-on-dark); }
.ms-btn--ghost { border-color: var(--c-line-2); color: var(--c-text); background: transparent; }
.ms-btn--ghost:hover { border-color: var(--c-text); color: var(--c-text); }
.ms-btn--lg { min-height: 58px; padding: 0 var(--sp-7); font-size: var(--fs-base); }
.ms-btn--block { width: 100%; }
.ms-btn .ms-play { width: 0; height: 0; border-left: 8px solid currentColor; border-top: 5px solid transparent; border-bottom: 5px solid transparent; }
.ms-hero .ms-btn--ghost, .ms-section--dark .ms-btn--ghost, .ms-cta .ms-btn--ghost {
	border-color: var(--c-line-dark-2); color: var(--c-on-dark);
	background: rgba(255, 255, 255, .04); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.ms-hero .ms-btn--ghost:hover, .ms-section--dark .ms-btn--ghost:hover { border-color: var(--c-on-dark); background: rgba(255, 255, 255, .08); }
.ms-hero :focus-visible, .ms-section--dark :focus-visible, .ms-cta :focus-visible, .ms-header :focus-visible { box-shadow: var(--focus-dark); }
.ms-link { display: inline-flex; align-items: center; gap: var(--sp-1); font-size: var(--fs-sm); font-weight: 650; color: var(--c-blue); text-decoration: none; }
.ms-link::after { content: "→"; transition: transform .2s var(--ease); }
.ms-link:has(.ms-icon)::after { content: none; }
.ms-link:hover::after { transform: translateX(4px); }

/* Header — floating pill */
.ms-header {
	position: sticky; top: 0; z-index: 50;
	padding: var(--sp-3) 0 0;
	background: transparent;
	color: var(--c-on-dark);
	pointer-events: none;
}
.ms-header__pill {
	pointer-events: auto;
	display: flex; align-items: center; gap: var(--sp-4);
	height: calc(var(--header-h) - 12px);
	padding: 0 var(--sp-3) 0 var(--sp-4);
	border: 1px solid var(--c-line-dark);
	border-radius: 999px;
	background: rgba(7, 13, 26, .55);
	backdrop-filter: saturate(180%) blur(18px); -webkit-backdrop-filter: saturate(180%) blur(18px);
	box-shadow: 0 8px 32px rgba(0, 0, 0, .2);
	transition: background-color .3s, border-color .3s, box-shadow .3s;
}
.ms-header.is-scrolled .ms-header__pill {
	background: rgba(7, 13, 26, .88);
	border-color: var(--c-line-dark-2);
	box-shadow: 0 12px 40px rgba(0, 0, 0, .35);
}
.ms-logo { display: inline-flex; align-items: center; gap: .55rem; color: var(--c-on-dark); text-decoration: none; font-size: 1.15rem; letter-spacing: -.03em; white-space: nowrap; }
.ms-logo:hover { color: var(--c-on-dark); }
.ms-logo__mark { width: 34px; height: 34px; flex: none; object-fit: contain; }
.ms-logo__text { font-weight: 600; }
.ms-logo__text b { font-weight: 800; }
.ms-nav { margin-left: auto; }
.ms-nav__list { display: flex; align-items: center; gap: 0; margin: 0; padding: 0; list-style: none; }
.ms-nav__item { position: relative; }
.ms-nav__link {
	display: inline-flex; align-items: center; gap: .3rem;
	padding: .5rem .7rem; border: 0; border-radius: 999px; background: none;
	color: var(--c-on-dark-muted); font-size: var(--fs-sm); font-weight: 520;
	text-decoration: none; cursor: pointer; transition: color .2s, background-color .2s;
}
.ms-nav__link:hover, .ms-nav__link[aria-current="page"], .ms-nav__toggle[aria-expanded="true"] {
	color: var(--c-on-dark); background: rgba(255, 255, 255, .08);
}
.ms-nav__toggle svg { transition: transform .2s var(--ease); }
.ms-nav__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.ms-sub {
	position: absolute; top: calc(100% + 14px); left: 50%; width: 380px; padding: var(--sp-2);
	background: var(--c-bg); border: 1px solid var(--c-line); border-radius: var(--r-card);
	box-shadow: var(--sh-hover);
	opacity: 0; visibility: hidden; transform: translate(-50%, 8px);
	transition: opacity .2s, transform .2s var(--ease), visibility .2s;
}
.ms-sub::before { content: ""; position: absolute; inset: -16px 0 auto; height: 16px; }
.ms-nav__item--has-sub:hover .ms-sub,
.ms-nav__item--has-sub:focus-within .ms-sub,
.ms-nav__toggle[aria-expanded="true"] + .ms-sub { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.ms-sub ul { margin: 0; padding: 0; list-style: none; }
.ms-sub a { display: flex; gap: var(--sp-3); align-items: flex-start; padding: var(--sp-3); border-radius: 14px; color: var(--c-text); text-decoration: none; }
.ms-sub a:hover, .ms-sub a[aria-current="page"] { background: var(--c-bg-muted); }
.ms-sub .ms-icon { width: 1.25rem; height: 1.25rem; margin-top: .15rem; color: var(--c-blue); }
.ms-sub strong { display: block; font-size: var(--fs-sm); font-weight: 650; }
.ms-sub small { display: block; color: var(--c-muted); font-size: var(--fs-xs); }
.ms-header__cta { min-height: 42px; padding: 0 var(--sp-4); font-size: .8125rem; flex: none; }
.ms-burger {
	display: none; width: 42px; height: 42px; margin-left: auto; padding: 0;
	border: 1px solid var(--c-line-dark-2); border-radius: 50%; background: none; cursor: pointer;
}
.ms-burger span { display: block; width: 16px; height: 2px; margin: 3.5px auto; background: var(--c-on-dark); border-radius: 2px; transition: transform .25s var(--ease), opacity .2s; }
.ms-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
.ms-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.ms-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
.ms-mobile {
	pointer-events: auto;
	margin-top: var(--sp-2);
	border: 1px solid var(--c-line-dark);
	border-radius: var(--r-lg);
	background: rgba(7, 13, 26, .94);
	backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
	padding: var(--sp-4) 0 var(--sp-5);
	max-height: calc(100dvh - var(--header-h) - 20px);
	overflow-y: auto;
}
.ms-mobile ul { margin: 0 0 var(--sp-4); padding: 0; list-style: none; }
.ms-mobile a:not(.ms-btn) {
	display: flex; align-items: center; gap: var(--sp-3); min-height: 48px;
	padding: 0 var(--sp-2); border-bottom: 1px solid var(--c-line-dark);
	color: var(--c-on-dark); font-weight: 560; text-decoration: none;
}
.ms-mobile .ms-icon { width: 1.25rem; height: 1.25rem; color: var(--c-cyan); }

/* Hero */
.ms-hero {
	position: relative; isolation: isolate; overflow: hidden;
	background: var(--grad-hero); color: var(--c-on-dark);
	margin-top: calc(-1 * var(--header-h));
	padding-top: var(--header-h);
}
.ms-hero::before {
	content: ""; position: absolute; inset: 0; z-index: -2;
	background-image:
		linear-gradient(var(--c-line-dark) 1px, transparent 1px),
		linear-gradient(90deg, var(--c-line-dark) 1px, transparent 1px);
	background-size: 72px 72px;
	mask-image: radial-gradient(ellipse 75% 65% at 70% 35%, #000 15%, transparent 72%);
	-webkit-mask-image: radial-gradient(ellipse 75% 65% at 70% 35%, #000 15%, transparent 72%);
	opacity: .45;
}
.ms-hero::after {
	content: ""; position: absolute; width: 60vmax; height: 60vmax; right: -20%; top: -30%; z-index: -1;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(22, 119, 255, .22), transparent 68%);
	pointer-events: none;
}
.ms-waves { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; opacity: .7; }
.ms-hero h1 { max-width: 14ch; margin-bottom: var(--sp-5); }
.ms-hero h1 em, .ms-section--dark h2 em, .ms-cta h2 em {
	font-style: italic; font-weight: 400;
	background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.ms-hero .ms-lead { max-width: 36rem; color: var(--c-on-dark-muted); }
.ms-hero--page { padding: calc(var(--header-h) + clamp(2.5rem, 1.5rem + 3vw, 4.5rem)) 0 clamp(3rem, 2rem + 3vw, 5rem); }
.ms-hero--page h1 { max-width: 18ch; font-size: var(--fs-h1-page); }
.ms-hero--compact { padding: calc(var(--header-h) + 2rem) 0 2.5rem; }
.ms-hero--compact h1 { margin: 0; }
.ms-hero--home { padding: calc(var(--header-h) + clamp(1rem, .45rem + 1.5vw, 2rem)) 0 clamp(1.1rem, .7rem + 1vw, 1.85rem); }
.ms-hero--home h1 { max-width: 12ch; font-size: clamp(2.15rem, 1.3rem + 2.6vw, 3.85rem); line-height: 1.05; letter-spacing: 0; margin-bottom: var(--sp-3); }
.ms-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(2rem, 1rem + 4vw, 4.5rem); align-items: center; }
.ms-hero--home .ms-hero__grid { grid-template-columns: minmax(0, .86fr) minmax(0, 1.14fr); gap: clamp(1.25rem, .5rem + 2vw, 2.75rem); align-items: center; }
.ms-hero--split .ms-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.ms-hero--split h1 { max-width: 15ch; }
.ms-hero__text { position: relative; z-index: 2; }
.ms-eyebrow {
	display: inline-flex; align-items: center; gap: var(--sp-2);
	margin-bottom: var(--sp-4);
	color: var(--c-blue); font-size: var(--fs-xs); font-weight: 700;
	letter-spacing: .16em; text-transform: uppercase;
}
.ms-hero .ms-eyebrow, .ms-section--dark .ms-eyebrow, .ms-cta .ms-eyebrow { color: var(--c-cyan); }
.ms-hero .ms-eyebrow {
	padding: .45rem .9rem;
	border: 1px solid rgba(94, 184, 255, .28);
	border-radius: 999px;
	background: rgba(94, 184, 255, .08);
}
.ms-hero--home .ms-eyebrow { margin-bottom: var(--sp-3); padding: .35rem .75rem; }
.ms-lead { font-size: var(--fs-lead); line-height: 1.6; color: var(--c-muted); }
.ms-hero--home .ms-lead { font-size: clamp(.95rem, .88rem + .35vw, 1.1rem); margin-bottom: 0; }
.ms-actions { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-top: var(--sp-6); }
.ms-hero--home .ms-actions { margin-top: var(--sp-4); align-items: center; gap: var(--sp-4); }
.ms-hero--home .ms-btn--lg { min-height: 48px; padding: 0 var(--sp-6); }
.ms-actions--hero .ms-link--hero {
	color: var(--c-on-dark-muted); font-size: var(--fs-sm); font-weight: 600;
	text-decoration: none; gap: var(--sp-2);
}
.ms-actions--hero .ms-link--hero:hover { color: var(--c-on-dark); }
.ms-actions--hero .ms-link--hero::after { content: none; }
.ms-actions--hero .ms-play {
	width: 0; height: 0; border-left: 7px solid currentColor;
	border-top: 4.5px solid transparent; border-bottom: 4.5px solid transparent;
}
.ms-trust { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-6) 0 0; padding: 0; list-style: none; color: var(--c-on-dark-muted); font-size: var(--fs-sm); }
.ms-hero--home .ms-trust { margin-top: var(--sp-3); }
.ms-trust--row {
	flex-wrap: wrap; gap: .5rem;  /* wrap instead of clipping the last chip in narrow hero columns (Grok #20) */
	font-size: var(--fs-xs);
}
.ms-trust--row::-webkit-scrollbar { display: none; }
.ms-trust li {
	display: inline-flex; align-items: center; gap: var(--sp-2);
	padding: .4rem .85rem .4rem .45rem;
	border: 1px solid var(--c-line-dark); border-radius: 999px;
	background: rgba(255, 255, 255, .03);
}
.ms-trust--row li {
	flex: none; gap: .35rem;
	padding: .3rem .65rem .3rem .3rem;
	white-space: nowrap;
}
.ms-trust .ms-icon {
	width: 1.7rem; height: 1.7rem; border-radius: 50%;
	background: rgba(94, 184, 255, .12); position: relative;
	-webkit-mask: none; mask: none; color: var(--c-cyan);
}
.ms-trust--row .ms-icon { width: 1.35rem; height: 1.35rem; }
.ms-trust .ms-icon::before {
	content: ""; position: absolute; inset: .35rem;
	background: currentColor;
	-webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
}
.ms-trust--row .ms-icon::before { inset: .28rem; }

@keyframes ms-up { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes ms-in-right { from { opacity: 0; transform: translateX(36px) scale(.97); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }
.ms-hero__text > * { animation: ms-up .85s var(--ease) both; }
.ms-hero__text > :nth-child(2) { animation-delay: .07s; }
.ms-hero__text > :nth-child(3) { animation-delay: .14s; }
.ms-hero__text > :nth-child(4) { animation-delay: .21s; }
.ms-hero__text > :nth-child(5) { animation-delay: .28s; }
.ms-hero .ms-visual { animation: ms-in-right 1s .12s var(--ease) both; }

/* Sections */
.ms-section { padding: var(--section-y) 0; }
.ms-section--muted { background: var(--c-bg-muted); }
.ms-section--dark {
	position: relative; isolation: isolate; overflow: hidden;
	background: var(--grad-dark); color: var(--c-on-dark);
}
.ms-section--dark::before {
	content: ""; position: absolute; z-index: -1;
	width: 800px; height: 800px; right: -220px; top: -280px; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(22, 119, 255, .32), transparent);
}
.ms-section--dark p, .ms-section--dark .ms-lead, .ms-section--dark li { color: var(--c-on-dark-muted); }
.ms-section--dark h2, .ms-section--dark h3, .ms-section--dark strong { color: var(--c-on-dark); }
.ms-section--dark a:not(.ms-btn) { color: var(--c-cyan); }
.ms-section--dark .ms-note {
	border-color: var(--c-line-dark); border-left-color: var(--c-cyan);
	background: rgba(255, 255, 255, .04); color: var(--c-on-dark-muted);
}
.ms-section--dark .ms-price {
	border-color: var(--c-line-dark); background: rgba(12, 21, 40, .8); box-shadow: none;
}
.ms-section--dark .ms-price__amount { color: var(--c-on-dark); }
.ms-section--dark .ms-price > p:not(.ms-price__amount) { color: var(--c-on-dark-muted); }
.ms-section--dark .ms-filter button {
	border-color: var(--c-line-dark-2); background: transparent; color: var(--c-on-dark-muted);
}
.ms-section--dark .ms-filter button:hover { border-color: var(--c-on-dark); color: var(--c-on-dark); }
.ms-section--dark .ms-filter button.is-active {
	border-color: var(--c-blue); background: var(--c-blue); color: var(--c-on-dark);
}
.ms-section--dark .ms-pane { background: var(--c-bg); color: var(--c-text); border-color: var(--c-line); }
.ms-section--dark .ms-pane h2,
.ms-section--dark .ms-pane h3,
.ms-section--dark .ms-pane strong { color: var(--c-text); }
.ms-section--dark .ms-pane p,
.ms-section--dark .ms-pane li,
.ms-section--dark .ms-pane .ms-lead,
.ms-section--dark .ms-pane .ms-small,
.ms-section--dark .ms-pane label { color: var(--c-muted); }
.ms-section--dark .ms-pane a:not(.ms-btn) { color: var(--c-blue); }
.ms-section:not(.ms-section--muted):not(.ms-section--dark) + .ms-section:not(.ms-section--muted):not(.ms-section--dark) { padding-top: 0; }
.ms-head { max-width: 44rem; margin-bottom: clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.ms-head--center { margin-inline: auto; text-align: center; }
.ms-head h2 { margin-bottom: var(--sp-4); }
.ms-head-row { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-6); }
.ms-head-row .ms-head { margin-bottom: clamp(2rem, 1.5rem + 2vw, 3.5rem); }
.ms-head-row > .ms-link, .ms-head-row > .ms-btn { margin-bottom: clamp(2rem, 1.5rem + 2vw, 3.5rem); flex: none; }

.ms-prose { max-width: var(--max-prose); }
.ms-prose h2 { margin-top: var(--sp-8); font-size: clamp(1.75rem, 1.35rem + 1.4vw, 2.35rem); }
.ms-prose h3 { margin-top: var(--sp-6); margin-bottom: var(--sp-3); }
.ms-prose > :first-child { margin-top: 0; }
.ms-prose ul, .ms-prose ol { padding-left: 1.25rem; }
.ms-prose li { margin-bottom: var(--sp-2); }
.ms-prose li::marker { color: var(--c-blue); }
.ms-prose--legal { font-size: var(--fs-sm); }
.ms-prose--legal h2 { font-size: 1.375rem; margin-top: var(--sp-7); font-family: var(--font); }
.ms-prose--legal h3 { font-size: 1.125rem; }
.ms-section--dark .ms-prose li::marker { color: var(--c-cyan); }

.ms-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 1rem + 4vw, 5rem); align-items: center; }
.ms-split--top { align-items: start; }
.ms-split--sticky { align-items: start; }
.ms-split--sticky > :first-child { position: sticky; top: calc(var(--header-h) + var(--sp-5)); }
.ms-split .ms-prose { max-width: none; }
.ms-panel {
	padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
	border: 1px solid var(--c-line); border-radius: var(--r-lg);
	background: var(--c-bg); box-shadow: var(--sh-card);
}
.ms-section--muted .ms-panel { background: var(--c-bg); }
.ms-section--dark .ms-panel {
	border-color: var(--c-line-dark);
	background: rgba(12, 21, 40, .75);
	box-shadow: none;
	backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.ms-panel > h3:first-child { margin-top: 0; }

/* Grids + cards */
.ms-grid { display: grid; gap: clamp(1rem, .75rem + 1vw, 1.5rem); }
.ms-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ms-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ms-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ms-card {
	position: relative; display: flex; flex-direction: column;
	padding: clamp(1.4rem, 1.1rem + 1vw, 1.9rem);
	border: 1px solid var(--c-line); border-radius: var(--r-card);
	background: var(--glass);
	box-shadow: var(--sh-card);
	--gx: 50%; --gy: 0%;
	transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .25s;
}
.ms-card::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
	background: radial-gradient(280px circle at var(--gx) var(--gy), rgba(22, 119, 255, .12), transparent 55%);
	transition: opacity .3s;
}
.ms-card:hover::after { opacity: 1; }
.ms-card:has(a.ms-link):hover { transform: translateY(-4px); box-shadow: var(--sh-hover); border-color: var(--c-line-2); }
.ms-card > .ms-icon {
	width: 48px; height: 48px; margin-bottom: var(--sp-5); padding: 12px;
	border-radius: 14px; border: 1px solid rgba(22, 119, 255, .18);
	background: var(--c-blue-50); color: var(--c-blue);
	-webkit-mask: none; mask: none; position: relative;
}
.ms-card > .ms-icon::before {
	content: ""; position: absolute; inset: 12px; background: currentColor;
	-webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
}
.ms-card h3 { margin-bottom: var(--sp-3); }
.ms-card p { color: var(--c-muted); font-size: var(--fs-sm); line-height: 1.6; }
.ms-card .ms-link { margin-top: auto; padding-top: var(--sp-4); }
.ms-card .ms-link::before { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ms-section--dark .ms-card {
	border-color: var(--c-line-dark);
	background: rgba(12, 21, 40, .72);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06);
	backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.ms-section--dark .ms-card > .ms-icon { background: rgba(94, 184, 255, .1); color: var(--c-cyan); border-color: rgba(94, 184, 255, .25); }
.ms-section--dark .ms-card p { color: var(--c-on-dark-muted); }
.ms-section--dark .ms-card::after { background: radial-gradient(280px circle at var(--gx) var(--gy), rgba(94, 184, 255, .16), transparent 55%); }
.ms-section--muted .ms-card { background: var(--c-bg); }
.ms-section--dark a.ms-card { color: var(--c-on-dark); text-decoration: none; }
.ms-section--dark a.ms-card:hover { border-color: rgba(94, 184, 255, .45); transform: translateY(-4px); }

/* Service cards — each visual shows what the client gets */
.ms-svcgrid {
	display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: clamp(.85rem, .5rem + 1vw, 1.25rem);
}
.ms-svc {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; flex-direction: column;
	border: 1px solid var(--c-line-dark-2); border-radius: var(--r-lg);
	background: linear-gradient(180deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .015)), var(--c-ink-2);
	color: var(--c-on-dark); text-decoration: none;
	transition: transform .5s var(--ease), border-color .4s var(--ease), box-shadow .5s var(--ease);
}
.ms-svc::after {
	content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit;
	background: radial-gradient(420px circle at var(--gx, 50%) var(--gy, 0%), rgba(94, 184, 255, .12), transparent 60%);
	opacity: 0; transition: opacity .4s;
}
.ms-svc:hover { transform: translateY(-4px); border-color: rgba(94, 184, 255, .45); box-shadow: 0 30px 70px rgba(0, 0, 0, .45), 0 0 0 1px rgba(94, 184, 255, .15); color: var(--c-on-dark); }
.ms-svc:hover::after { opacity: 1; }
.ms-svc--web { grid-column: 1 / 8; grid-row: 1 / 3; }
.ms-svc--shop { grid-column: 8 / 13; grid-row: 1; }
.ms-svc--seo { grid-column: 8 / 13; grid-row: 2; }
.ms-svc--ki { grid-column: 1 / 7; grid-row: 3; }
.ms-svc--flow { grid-column: 7 / 13; grid-row: 3; }

.ms-svc__visual {
	position: relative; flex: 1 1 auto; min-height: 250px; overflow: hidden;
	background: radial-gradient(90% 80% at 70% 0%, rgba(22, 119, 255, .28), transparent 65%);
}
.ms-svc--web .ms-svc__visual { min-height: 440px; }
.ms-svc__body { position: relative; z-index: 2; padding: 1rem clamp(1.1rem, .8rem + 1vw, 1.6rem) clamp(1.1rem, .8rem + 1vw, 1.6rem); }
.ms-svc__head { display: flex; align-items: center; gap: .8rem; }
.ms-svc__icon {
	flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px;
	background: rgba(22, 119, 255, .16); border: 1px solid rgba(94, 184, 255, .3); color: var(--c-cyan);
}
.ms-svc__icon .ms-icon { width: 20px; height: 20px; }
.ms-svc__title {
	margin: 0; flex: 1; color: var(--c-on-dark);
	font-family: var(--font); font-size: clamp(1.15rem, 1.05rem + .45vw, 1.45rem);
	font-weight: 650; letter-spacing: -.015em; line-height: 1.2;
}
.ms-svc__go {
	flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
	border: 1px solid var(--c-line-dark-2); color: var(--c-on-dark);
	transition: background .3s, border-color .3s, transform .4s var(--ease);
}
.ms-svc__go .ms-icon { width: 16px; height: 16px; }
.ms-svc:hover .ms-svc__go { background: var(--c-blue); border-color: var(--c-blue); transform: rotate(45deg); }
.ms-svc__text { margin: .75rem 0 0; max-width: 46ch; color: var(--c-on-dark-muted); font-size: var(--fs-sm); line-height: 1.55; }
.ms-svc__chips { display: flex; flex-wrap: wrap; gap: .4rem; margin: .9rem 0 0; padding: 0; list-style: none; }
.ms-svc__chips li {
	padding: .28rem .65rem; border-radius: 999px; border: 1px solid var(--c-line-dark-2);
	background: var(--c-surface); color: var(--c-on-dark); font-size: .78rem; font-weight: 500;
}

/* Browser window */
.ms-svc__browser {
	position: absolute; left: 7%; right: 7%; top: 9%; bottom: -2px;
	display: flex; flex-direction: column; overflow: hidden;
	border-radius: 12px 12px 0 0; border: 1px solid rgba(255, 255, 255, .14); border-bottom: 0;
	background: var(--dev-glass);
	box-shadow: 0 -10px 60px rgba(22, 119, 255, .22), 0 30px 60px rgba(0, 0, 0, .5);
	transition: transform .7s var(--ease);
}
.ms-svc:hover .ms-svc__browser { transform: translateY(-6px); }
.ms-svc__bar {
	flex: none; display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px;
	background: linear-gradient(180deg, var(--c-ink-3), var(--c-ink-2));
	border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.ms-svc__bar i { width: 10px; height: 10px; border-radius: 50%; background: var(--dev-dot-red); }
.ms-svc__bar i:nth-child(2) { background: var(--dev-dot-amber); }
.ms-svc__bar i:nth-child(3) { background: var(--dev-dot-green); }
.ms-svc__url {
	flex: 1; max-width: 70%; margin: 0 auto; padding: .22rem .8rem; border-radius: 7px;
	background: rgba(255, 255, 255, .07); color: var(--c-on-dark-muted);
	font-size: .72rem; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ms-svc__page { position: relative; flex: 1; overflow: hidden; container-type: size; }
.ms-svc__page img { display: block; width: 100%; height: auto; max-width: none; }
.ms-svc__page--scroll img { animation: ms-svc-scroll 26s cubic-bezier(.45, 0, .25, 1) infinite; }
@keyframes ms-svc-scroll {
	0%, 8% { transform: translateY(0); }
	25%, 31% { transform: translateY(calc((-100% + 100cqh) * .3)); }
	48%, 54% { transform: translateY(calc((-100% + 100cqh) * .62)); }
	72%, 80% { transform: translateY(calc(-100% + 100cqh)); }
	100% { transform: translateY(0); }
}
.ms-svc--web .ms-svc__visual::after,
.ms-svc--shop .ms-svc__visual::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 22%; z-index: 1; pointer-events: none;
	background: linear-gradient(transparent, var(--c-ink-2));
}

/* Shop extras */
.ms-svc--shop .ms-svc__browser { left: 6%; right: 6%; top: 10%; }
.ms-svc--shop .ms-svc__visual, .ms-svc--seo .ms-svc__visual { min-height: 290px; }
.ms-svc__toast {
	position: absolute; z-index: 2; left: 9%; bottom: 14%;
	display: flex; align-items: center; gap: .6rem; padding: .55rem .9rem .55rem .55rem;
	border-radius: 14px; background: rgba(245, 248, 255, .96); color: var(--c-text);
	box-shadow: 0 18px 40px rgba(0, 0, 0, .45);
	animation: ms-svc-toast 7s var(--ease) infinite;
}
.ms-svc__toast-ic { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: var(--c-ok-bg); color: var(--c-ok); }
.ms-svc__toast-ic .ms-icon { width: 16px; height: 16px; }
.ms-svc__toast strong { display: block; font-size: .78rem; line-height: 1.2; }
.ms-svc__toast small { display: block; color: var(--c-muted); font-size: .7rem; }
@keyframes ms-svc-toast {
	0%, 12% { opacity: 0; transform: translateY(14px) scale(.96); }
	20%, 82% { opacity: 1; transform: none; }
	92%, 100% { opacity: 0; transform: translateY(6px); }
}
.ms-svc__pay { position: absolute; z-index: 2; right: calc(6% + .75rem); top: calc(10% + 46px); display: flex; gap: .3rem; }
.ms-svc__pay b {
	padding: .25rem .5rem; border-radius: 7px; background: rgba(7, 13, 26, .85);
	border: 1px solid rgba(255, 255, 255, .16); color: var(--c-on-dark); font-size: .68rem; font-weight: 600;
	backdrop-filter: blur(6px);
}

/* SEO: search result + growth line */
.ms-svc__serp {
	position: absolute; z-index: 1; left: 7%; right: 7%; top: 10%;
	display: grid; gap: .55rem; padding: .9rem; border-radius: 16px;
	background: var(--c-bg); color: var(--c-text);
	box-shadow: 0 24px 50px rgba(0, 0, 0, .45);
	transition: transform .7s var(--ease);
}
.ms-svc:hover .ms-svc__serp { transform: translateY(-5px); }
.ms-svc__search {
	display: flex; align-items: center; gap: .55rem; padding: .5rem .8rem; border-radius: 999px;
	border: 1px solid var(--c-line); box-shadow: var(--sh-card); font-size: .8rem; color: var(--c-text);
}
.ms-svc__lens { position: relative; flex: none; width: 12px; height: 12px; border: 2px solid var(--c-muted); border-radius: 50%; }
.ms-svc__lens::after { content: ""; position: absolute; width: 2px; height: 6px; right: -4px; bottom: -5px; border-radius: 2px; background: var(--c-muted); transform: rotate(-45deg); }
.ms-svc__result { display: grid; gap: .15rem; padding: .55rem .7rem; border-radius: 10px; }
.ms-svc__result small { color: var(--c-muted); font-size: .68rem; }
.ms-svc__result strong { color: var(--c-blue-600); font-size: .88rem; font-weight: 600; }
.ms-svc__result em { color: var(--c-ok); font-size: .7rem; font-style: normal; }
.ms-svc__result.is-top { background: var(--c-blue-50); box-shadow: inset 0 0 0 1.5px var(--c-blue); }
.ms-svc__result:not(.is-top) strong,
.ms-svc__result:not(.is-top) em { display: block; height: 8px; border-radius: 4px; background: var(--c-line); }
.ms-svc__result:not(.is-top) strong { width: 70%; }
.ms-svc__result:not(.is-top) em { width: 45%; }
.ms-svc__graph { position: absolute; left: 0; right: 0; bottom: 0; height: 45%; color: var(--c-cyan); opacity: .8; }
.ms-svc__graph svg { display: block; width: 100%; height: 100%; }
.ms-svc__graph span { display: none; }
.ms-svc__line { stroke-dasharray: 260; stroke-dashoffset: 260; animation: ms-svc-draw 6s var(--ease) infinite; }
@keyframes ms-svc-draw { 0% { stroke-dashoffset: 260; } 45%, 100% { stroke-dashoffset: 0; } }

/* KI: live call */
.ms-svc__call {
	position: absolute; left: 8%; right: 8%; top: 10%;
	display: grid; gap: .55rem; padding: 1rem; border-radius: 18px;
	background: rgba(12, 21, 40, .82); border: 1px solid rgba(255, 255, 255, .12);
	box-shadow: 0 24px 50px rgba(0, 0, 0, .45); backdrop-filter: blur(10px);
}
.ms-svc__call-head { display: flex; align-items: center; gap: .65rem; margin-bottom: .2rem; }
.ms-svc__avatar { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--grad-brand); color: var(--c-on-dark); }
.ms-svc__avatar .ms-icon { width: 18px; height: 18px; }
.ms-svc__call-head strong { display: block; font-size: .88rem; }
.ms-svc__call-head small { display: flex; align-items: center; gap: .35rem; color: var(--c-on-dark-muted); font-size: .72rem; }
.ms-svc__call-head small i { width: 7px; height: 7px; border-radius: 50%; background: var(--c-ok); box-shadow: 0 0 0 3px rgba(22, 163, 74, .25); }
.ms-svc__msg { max-width: 84%; padding: .5rem .75rem; border-radius: 14px; font-size: .8rem; line-height: 1.4; }
.ms-svc__msg--in { justify-self: start; background: rgba(255, 255, 255, .08); border-bottom-left-radius: 4px; animation: ms-svc-msg 8s var(--ease) infinite; }
.ms-svc__msg--out { justify-self: end; background: var(--c-blue); border-bottom-right-radius: 4px; animation: ms-svc-msg2 8s var(--ease) infinite; }
@keyframes ms-svc-msg { 0%, 4% { opacity: 0; transform: translateY(8px); } 10%, 90% { opacity: 1; transform: none; } 100% { opacity: 0; } }
@keyframes ms-svc-msg2 { 0%, 22% { opacity: 0; transform: translateY(8px); } 30%, 90% { opacity: 1; transform: none; } 100% { opacity: 0; } }
.ms-svc__wave { display: flex; align-items: center; justify-content: center; gap: 3px; height: 26px; margin-top: .2rem; }
.ms-svc__wave i { width: 3px; height: 100%; border-radius: 2px; background: var(--c-cyan); transform: scaleY(.25); animation: ms-svc-wave 1.1s ease-in-out infinite; }
.ms-svc__wave i:nth-child(2n) { animation-delay: -.35s; }
.ms-svc__wave i:nth-child(3n) { animation-delay: -.7s; }
@keyframes ms-svc-wave { 0%, 100% { transform: scaleY(.25); } 50% { transform: scaleY(1); } }

/* Automation flow */
.ms-svc__flow {
	position: absolute; left: 7%; right: 7%; top: 50%; transform: translateY(-50%);
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem;
}
.ms-svc__flow::before {
	content: ""; position: absolute; left: 12%; right: 12%; top: 26px; height: 2px;
	background: linear-gradient(90deg, rgba(94, 184, 255, .15), rgba(94, 184, 255, .6), rgba(94, 184, 255, .15));
}
.ms-svc__step { position: relative; display: grid; justify-items: center; gap: .55rem; text-align: center; color: var(--c-on-dark); font-size: .76rem; font-weight: 500; line-height: 1.3; }
.ms-svc__step-ic {
	position: relative; display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px;
	background: var(--c-ink-3); border: 1px solid rgba(94, 184, 255, .35); color: var(--c-cyan);
	box-shadow: 0 10px 30px rgba(0, 0, 0, .4);
	animation: ms-svc-step 6s var(--ease) infinite; animation-delay: calc(var(--i) * 1s);
}
.ms-svc__step-ic .ms-icon { width: 22px; height: 22px; }
.ms-svc__step:last-child .ms-svc__step-ic { background: var(--c-blue); border-color: var(--c-blue); color: var(--c-on-dark); }
@keyframes ms-svc-step { 0%, 100% { box-shadow: 0 10px 30px rgba(0, 0, 0, .4); } 8% { box-shadow: 0 0 0 6px rgba(22, 119, 255, .25), 0 0 30px rgba(22, 119, 255, .6); } 20% { box-shadow: 0 10px 30px rgba(0, 0, 0, .4); } }
.ms-svc__pulse {
	position: absolute; top: 22px; left: 12%; width: 10px; height: 10px; border-radius: 50%;
	background: var(--c-cyan); box-shadow: 0 0 14px var(--c-cyan);
	animation: ms-svc-pulse 6s linear infinite;
}
@keyframes ms-svc-pulse { 0% { left: 12%; opacity: 0; } 5% { opacity: 1; } 55% { left: 86%; opacity: 1; } 62%, 100% { left: 86%; opacity: 0; } }

/* Legacy photocard alias → bento looks if any remain */
.ms-photocards { display: contents; }
.ms-photocard { display: none; }

/* Checklist / steps / price */
.ms-checklist { margin: 0 0 var(--sp-4); padding: 0; list-style: none; }
.ms-checklist li { position: relative; margin-bottom: var(--sp-3); padding-left: 2rem; }
.ms-checklist li::before { content: ""; position: absolute; left: 0; top: .2em; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--c-blue-50); }
.ms-checklist li::after {
	content: ""; position: absolute; left: .3rem; top: calc(.2em + .3rem); width: .65rem; height: .65rem;
	background: var(--c-blue);
	-webkit-mask: url("../icons/check.svg") center / contain no-repeat; mask: url("../icons/check.svg") center / contain no-repeat;
}
.ms-section--dark .ms-checklist li::before { background: rgba(94, 184, 255, .14); }
.ms-section--dark .ms-checklist li::after { background: var(--c-cyan); }
.ms-checklist--sm li { font-size: var(--fs-sm); color: var(--c-muted); }
.ms-checklist--cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--sp-5); }

.ms-steps {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(1rem, .75rem + 1vw, 1.5rem); margin: 0; padding: 0; list-style: none;
}
.ms-step { position: relative; padding-top: var(--sp-5); border-top: 1px solid var(--c-line); overflow: hidden; }
.ms-step::before {
	content: ""; position: absolute; top: -1px; left: 0; height: 2px; width: 100%;
	background: var(--grad-brand);
	transform: scaleX(0); transform-origin: left;
	transition: transform 1s var(--ease);
}
.ms-steps.is-live .ms-step::before { transform: scaleX(1); }
.ms-steps.is-live .ms-step:nth-child(2)::before { transition-delay: .15s; }
.ms-steps.is-live .ms-step:nth-child(3)::before { transition-delay: .3s; }
.ms-steps.is-live .ms-step:nth-child(4)::before { transition-delay: .45s; }
.ms-step__num {
	display: inline-grid; place-items: center; min-width: 42px; height: 42px; margin-bottom: var(--sp-3);
	padding: 0 .75rem; border-radius: 999px; background: var(--grad-brand); color: #fff;
	font-size: var(--fs-xs); font-weight: 750; letter-spacing: .04em;
	box-shadow: 0 10px 24px rgba(22, 119, 255, .35);
}
.ms-step h3 { font-size: 1.125rem; margin-bottom: var(--sp-2); }
.ms-step p { color: var(--c-muted); font-size: var(--fs-sm); }
.ms-section--dark .ms-step { border-color: var(--c-line-dark); }

.ms-price {
	position: relative; display: flex; flex-direction: column;
	padding: clamp(1.5rem, 1.2rem + 1vw, 2rem);
	border: 1px solid var(--c-line); border-radius: var(--r-card);
	background: var(--c-bg); box-shadow: var(--sh-card);
	--gx: 50%; --gy: 0%;
}
.ms-price::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
	background: radial-gradient(280px circle at var(--gx) var(--gy), rgba(22, 119, 255, .1), transparent 55%);
	transition: opacity .3s;
}
.ms-price:hover::after { opacity: 1; }
.ms-price h3 { margin-bottom: var(--sp-2); font-size: 1.125rem; }
.ms-price__amount {
	margin-bottom: var(--sp-3); color: var(--c-text);
	font-family: var(--font-display); font-size: clamp(1.85rem, 1.5rem + 1.2vw, 2.5rem);
	font-weight: 500; letter-spacing: -.005em; line-height: 1.08;
}
.ms-price > p:not(.ms-price__amount) { color: var(--c-muted); font-size: var(--fs-sm); }
.ms-price .ms-checklist { margin: var(--sp-4) 0 var(--sp-5); font-size: var(--fs-sm); }
.ms-price .ms-btn { margin-top: auto; }
.ms-price--featured { border-color: var(--c-blue); box-shadow: 0 0 0 1px var(--c-blue), var(--sh-hover); }
.ms-price--featured::before {
	content: "Am häufigsten gewählt"; position: absolute; top: -12px; left: var(--sp-5);
	padding: .2rem .65rem; border-radius: 999px; background: var(--c-blue); color: var(--c-on-dark);
	font-size: .75rem; font-weight: 650;
}
.ms-price .ms-btn--ghost { border-color: var(--c-line-2); }

.ms-note {
	margin: var(--sp-5) 0 0; padding: var(--sp-4) var(--sp-5);
	border: 1px solid var(--c-line); border-left: 3px solid var(--c-blue);
	border-radius: var(--r-sm); background: var(--c-bg-muted); color: var(--c-muted); font-size: var(--fs-sm);
}
.ms-section--muted .ms-note { background: var(--c-bg); }
.ms-alert { margin-bottom: var(--sp-5); padding: var(--sp-4) var(--sp-5); border-radius: var(--r-sm); font-size: var(--fs-sm); font-weight: 560; }
.ms-alert--ok { background: var(--c-ok-bg); color: var(--c-ok); }
.ms-alert--err { background: var(--c-err-bg); color: var(--c-err); }
.ms-alert--done { display: grid; gap: var(--sp-2); padding: var(--sp-6) var(--sp-5); text-align: center; font-size: var(--fs-base); scroll-margin: 6rem; }
.ms-alert--done strong { font-size: var(--fs-lead); }
.ms-alert--done span { font-weight: 450; }
.ms-alert:focus { outline: none; }
.ms-small { color: var(--c-muted); font-size: var(--fs-xs); line-height: 1.55; }

.ms-figure { margin: var(--sp-6) 0; }
.ms-figure img { width: 100%; border: 1px solid var(--c-line); border-radius: var(--r-card); box-shadow: var(--sh-card); }
.ms-figure figcaption { margin-top: var(--sp-3); color: var(--c-muted); font-size: var(--fs-xs); }
.ms-split .ms-figure { margin: 0; }
.ms-figure--portrait { max-width: 320px; }
.ms-figure--portrait img { aspect-ratio: auto; }

.ms-faq { max-width: 52rem; border-top: 1px solid var(--c-line); }
.ms-head--center + .ms-faq { margin-inline: auto; }
.ms-faq details { border-bottom: 1px solid var(--c-line); }
.ms-faq summary {
	position: relative; display: block; padding: var(--sp-5) 3rem var(--sp-5) 0;
	font-size: 1.0625rem; font-weight: 640; line-height: 1.4; cursor: pointer; list-style: none;
}
.ms-faq summary::-webkit-details-marker { display: none; }
.ms-faq summary::after {
	content: ""; position: absolute; right: .25rem; top: 50%; width: 28px; height: 28px; margin-top: -14px;
	border-radius: 50%;
	background: var(--c-bg-muted) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231677FF' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center / 14px no-repeat;
	transition: transform .25s var(--ease);
}
.ms-faq details[open] summary::after { transform: rotate(45deg); }
.ms-faq summary:hover { color: var(--c-blue); }
.ms-faq details > div { padding: 0 3rem var(--sp-5) 0; color: var(--c-muted); }
.ms-section--muted .ms-faq summary::after { background-color: var(--c-bg); }

.ms-cta { padding: var(--section-y) 0; }
.ms-cta .ms-wrap {
	position: relative; isolation: isolate; overflow: hidden;
	display: flex; align-items: center; justify-content: space-between; gap: var(--sp-6);
	padding: clamp(2.25rem, 1.5rem + 3vw, 4.25rem);
	border-radius: var(--r-lg); background: var(--grad-hero); color: var(--c-on-dark);
	border: 1px solid var(--c-line-dark); box-shadow: var(--sh-glow);
}
.ms-cta h2 { max-width: 18ch; margin-bottom: var(--sp-3); }
.ms-cta .ms-lead { max-width: 34rem; color: var(--c-on-dark-muted); }
.ms-cta .ms-actions { margin-top: 0; flex: none; }

/* Projects */
.ms-projects { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1.25rem, 1rem + 1vw, 2rem); }
.ms-project {
	display: flex; flex-direction: column; overflow: hidden;
	border: 1px solid var(--c-line); border-radius: var(--r-card);
	background: var(--c-bg); box-shadow: var(--sh-card);
	transition: transform .3s var(--ease), box-shadow .3s var(--ease);
	--gx: 50%; --gy: 0%;
}
.ms-project:hover { transform: translateY(-4px); box-shadow: var(--sh-hover); }
.ms-project[hidden] { display: none; }
.ms-project__media {
	display: block; overflow: hidden; aspect-ratio: 16 / 10;
	background: var(--c-ink-2); border-bottom: 1px solid var(--c-line);
	position: relative;
}
.ms-project__media::before {
	content: ""; position: absolute; top: 0; left: 0; right: 0; z-index: 1; height: 28px;
	background: linear-gradient(180deg, rgba(7, 13, 26, .9), rgba(7, 13, 26, .55));
	border-bottom: 1px solid rgba(255, 255, 255, .08);
	background-image:
		radial-gradient(circle at 14px 14px, #FF5F57 4px, transparent 5px),
		radial-gradient(circle at 32px 14px, #FEBC2E 4px, transparent 5px),
		radial-gradient(circle at 50px 14px, #28C840 4px, transparent 5px),
		linear-gradient(180deg, rgba(7, 13, 26, .92), rgba(7, 13, 26, .5));
}
.ms-project__media img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .7s var(--ease); }
.ms-project:hover .ms-project__media img { transform: scale(1.05); }
.ms-project__body { display: flex; flex-direction: column; flex: 1; padding: var(--sp-5); }
.ms-project__meta { margin-bottom: var(--sp-2); color: var(--c-muted); font-size: var(--fs-xs); }
.ms-project h3 { margin-bottom: var(--sp-2); font-size: 1.2rem; font-family: var(--font); }
.ms-project__body > p:not(.ms-project__meta) { color: var(--c-muted); font-size: var(--fs-sm); }
.ms-project .ms-link { margin-top: auto; padding-top: var(--sp-3); }
.ms-project .ms-link .ms-icon { margin-left: 2px; }
.ms-badge { display: inline-block; margin-right: var(--sp-2); padding: .15rem .55rem; border-radius: 999px; font-size: .6875rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.ms-badge--kunde { background: var(--c-blue-50); color: var(--c-blue-600); }
.ms-badge--eigen { background: var(--c-ok-bg); color: var(--c-ok); }
.ms-badge--konzept { background: var(--c-bg-muted); color: var(--c-muted); border: 1px solid var(--c-line); }
.ms-tags { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin: var(--sp-2) 0 0; padding: 0; list-style: none; }
.ms-tags li { padding: .2rem .6rem; border: 1px solid var(--c-line); border-radius: 999px; color: var(--c-muted); font-size: .75rem; }
.ms-filter { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-6); }
.ms-filter button {
	min-height: 40px; padding: 0 var(--sp-4);
	border: 1px solid var(--c-line-2); border-radius: 999px; background: var(--c-bg);
	color: var(--c-text); font-size: var(--fs-sm); font-weight: 560; cursor: pointer;
	transition: background-color .2s, color .2s, border-color .2s;
}
.ms-filter button:hover { border-color: var(--c-text); }
.ms-filter button.is-active { border-color: var(--c-ink); background: var(--c-ink); color: var(--c-on-dark); }
.ms-section--dark .ms-project { border-color: var(--c-line-dark); background: rgba(12, 21, 40, .85); box-shadow: none; }
.ms-section--dark .ms-project__media { border-color: var(--c-line-dark); }
.ms-section--dark .ms-project h3 { color: var(--c-on-dark); }
.ms-section--dark .ms-tags li { border-color: var(--c-line-dark-2); color: var(--c-on-dark-muted); }
.ms-section--dark .ms-badge--kunde { background: rgba(94, 184, 255, .14); color: var(--c-cyan); }
.ms-section--dark .ms-link { color: var(--c-cyan); }
.ms-section--dark .ms-project__body > p:not(.ms-project__meta) { color: #B8C4D8; }
.ms-section--dark .ms-project__meta { color: var(--c-on-dark-muted); }

/* Contact */
.ms-contact { display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); gap: clamp(1.5rem, 1rem + 2vw, 3rem); align-items: start; }
.ms-chooser { display: grid; gap: var(--sp-3); }
.ms-choice {
	display: flex; align-items: center; gap: var(--sp-4); width: 100%; min-height: 76px;
	padding: var(--sp-4) var(--sp-5); border: 1px solid transparent; border-radius: 18px;
	background: var(--c-ink); color: #fff; text-align: left; cursor: pointer;
	box-shadow: 0 14px 30px rgba(11, 18, 32, .18);
	transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.ms-choice > .ms-icon {
	width: 44px; height: 44px; padding: 11px; border-radius: 12px;
	background: rgba(94, 184, 255, .14); color: var(--c-cyan);
	position: relative; -webkit-mask: none; mask: none;
}
.ms-choice > .ms-icon::before {
	content: ""; position: absolute; inset: 11px; background: currentColor;
	-webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
}
.ms-choice strong { display: block; font-size: var(--fs-sm); font-weight: 680; }
.ms-choice small { display: block; color: var(--c-on-dark-muted); font-size: var(--fs-xs); }
.ms-choice:hover { border-color: rgba(94, 184, 255, .5); }
.ms-choice.is-active {
	background: linear-gradient(135deg, #123B7A, var(--c-ink));
	border-color: var(--c-blue);
	box-shadow: 0 0 0 1px var(--c-blue), 0 18px 40px rgba(22, 119, 255, .3);
}
.ms-choice.is-active > .ms-icon { background: var(--c-blue); color: var(--c-on-dark); }
.ms-pane {
	padding: clamp(1.5rem, 1rem + 2vw, 2.5rem);
	border: 1px solid var(--c-line); border-radius: var(--r-lg);
	background: var(--c-bg); box-shadow: var(--sh-card);
}
.ms-ki h3 { font-size: clamp(1.375rem, 1.2rem + .8vw, 1.75rem); }
.ms-ki .ms-btn { margin: var(--sp-3) 0 var(--sp-5); }
.ms-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-4) var(--sp-5); }
.ms-field { display: flex; flex-direction: column; gap: var(--sp-2); }
.ms-field--full { grid-column: 1 / -1; }
.ms-field[hidden] { display: none; }
.ms-field label { font-size: var(--fs-sm); font-weight: 600; }
.ms-opt { color: var(--c-muted); font-weight: 400; }
.ms-field input, .ms-field select, .ms-field textarea {
	width: 100%; min-height: 52px; padding: .75rem 1rem;
	border: 1px solid var(--c-line-2); border-radius: 14px; background: var(--c-bg); font-size: 1rem;
	transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.ms-field input:hover, .ms-field select:hover, .ms-field textarea:hover { border-color: var(--c-muted); }
.ms-field textarea { min-height: 140px; resize: vertical; line-height: 1.55; }
.ms-field select {
	appearance: none; padding-right: 2.5rem;
	background: var(--c-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A657A' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right .8rem center / 16px no-repeat;
}
.ms-field input:focus, .ms-field select:focus, .ms-field textarea:focus {
	outline: none; border-color: var(--c-blue); box-shadow: 0 0 0 4px rgba(22, 119, 255, .16); background: var(--c-bg-muted);
}
.ms-field.is-invalid input, .ms-field.is-invalid textarea, .ms-field.is-invalid select { border-color: var(--c-err); }
.ms-field__err { color: var(--c-err); font-size: var(--fs-xs); }
.ms-check { display: flex; gap: var(--sp-3); align-items: flex-start; margin: var(--sp-5) 0; font-size: var(--fs-sm); color: var(--c-muted); }
.ms-check input { flex: none; width: 20px; height: 20px; margin-top: .15rem; accent-color: var(--c-blue); }
.ms-check.is-invalid label { color: var(--c-err); }
.ms-form__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-4) var(--sp-5); }
.ms-form__foot .ms-small { flex: 1 1 16rem; margin: 0; }
.ms-form__status:not(:empty) { margin-top: var(--sp-5); }
.ms-form.is-sending button[type="submit"] { opacity: .7; pointer-events: none; }
.ms-form__foot[hidden] { display: none; }
.ms-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.ms-contact .ms-check[hidden] { display: none; }
.ms-direct {
	display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem;
	border: 1px dashed var(--c-line-2); border-radius: 16px; color: var(--c-text); font-size: var(--fs-sm); text-decoration: none;
}
.ms-direct .ms-icon { color: var(--c-blue); }
.ms-direct:hover { border-color: var(--c-blue); color: var(--c-text); }

.ms-contact-info { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-4); }
.ms-contact-info > a, .ms-contact-info > div {
	display: flex; gap: var(--sp-3); align-items: flex-start; padding: var(--sp-5);
	border: 1px solid var(--c-line); border-radius: 18px; background: var(--c-bg); color: var(--c-text); text-decoration: none;
}
.ms-contact-info > a:hover { border-color: var(--c-line-2); }
.ms-contact-info .ms-icon { color: var(--c-blue); }
.ms-contact-info strong { display: block; font-size: var(--fs-sm); }
.ms-contact-info span { display: block; color: var(--c-muted); font-size: var(--fs-sm); word-break: break-word; }

.ms-profile { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-3); }
.ms-cert {
	display: flex; gap: var(--sp-4); align-items: flex-start; padding: var(--sp-4) var(--sp-5);
	border: 1px solid var(--c-line); border-radius: 16px; background: var(--c-bg);
}
.ms-cert .ms-icon { color: var(--c-blue); margin-top: .15rem; }
.ms-cert strong { display: block; font-size: var(--fs-sm); }
.ms-cert span { color: var(--c-muted); font-size: var(--fs-xs); }
.ms-section--dark .ms-cert {
	border-color: var(--c-line-dark); background: rgba(12, 21, 40, .75);
	backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.ms-section--dark .ms-cert .ms-icon { color: var(--c-cyan); }
.ms-section--dark .ms-cert span { color: var(--c-on-dark-muted); }

/* Footer */
.ms-footer {
	position: relative; isolation: isolate; overflow: hidden;
	padding: clamp(3.5rem, 2.5rem + 3vw, 6rem) 0 var(--sp-6);
	background: var(--grad-footer); color: var(--c-on-dark-muted); font-size: var(--fs-sm);
}
.ms-footer::before {
	content: ""; position: absolute; width: 700px; height: 700px; left: -200px; top: -300px; z-index: -1;
	border-radius: 50%; background: radial-gradient(closest-side, rgba(22, 119, 255, .22), transparent);
}
.ms-footer a { color: var(--c-on-dark-muted); text-decoration: none; }
.ms-footer a:hover { color: var(--c-on-dark); }
.ms-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.3fr; gap: var(--sp-7); }
.ms-footer__brand p { max-width: 22rem; margin-top: var(--sp-4); }
.ms-footer__title { margin-bottom: var(--sp-4); color: var(--c-on-dark); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.ms-footer ul { margin: 0; padding: 0; list-style: none; }
.ms-footer li { margin-bottom: var(--sp-2); }
.ms-footer address { margin-bottom: var(--sp-3); }
.ms-footer__bottom {
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--sp-4);
	margin-top: var(--sp-8); padding-top: var(--sp-5); border-top: 1px solid var(--c-line-dark); font-size: var(--fs-xs);
}
.ms-footer__bottom p { margin: 0; }
.ms-footer__bottom ul { display: flex; gap: var(--sp-5); }
.ms-footer__bottom li { margin: 0; }

/* Reveal */
.js [data-reveal] {
	opacity: 0; transform: translateY(22px); filter: blur(4px);
	transition: opacity .75s var(--ease), transform .75s var(--ease), filter .75s var(--ease);
	transition-delay: var(--d, 0ms);
}
.js [data-reveal].is-in { opacity: 1; transform: none; filter: none; }

/* Marquee — solid dark band; edge fade via mask on track only (not white overlays) */
.ms-marquee {
	overflow: hidden; padding: 1.35rem 0;
	border-block: 1px solid var(--c-line-dark-2);
	background: var(--c-ink);
}
.ms-marquee__fade {
	mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
	-webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 93%, transparent 100%);
}
.ms-marquee ul {
	display: flex; gap: 3.5rem; width: max-content; margin: 0; padding: 0; list-style: none;
	animation: ms-marquee 38s linear infinite;
}
.ms-marquee li {
	color: var(--c-on-dark); font-size: 1rem; font-weight: 650;
	letter-spacing: -.01em; white-space: nowrap;
}
.ms-marquee li::before {
	content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 3.5rem;
	border-radius: 50%; background: var(--c-cyan); vertical-align: middle;
	box-shadow: 0 0 12px rgba(94, 184, 255, .85);
}
@keyframes ms-marquee { to { transform: translateX(-50%); } }

.ms-iconrow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.ms-iconrow li { display: flex; flex-direction: column; align-items: center; gap: .6rem; text-align: center; font-size: var(--fs-sm); font-weight: 600; }
.ms-iconrow .ms-icon {
	width: 56px; height: 56px; border-radius: 16px; border: 1px solid rgba(22, 119, 255, .2);
	background: var(--c-blue-50); color: var(--c-blue); position: relative; -webkit-mask: none; mask: none;
}
.ms-iconrow .ms-icon::before {
	content: ""; position: absolute; inset: 15px; background: currentColor;
	-webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
}

/* Visuals / devices */
.ms-visual { position: relative; min-height: 320px; }
[data-parallax] {
	transform: translate3d(var(--px, 0), var(--py, 0), 0) rotateX(var(--rx, 0)) rotateY(var(--ry, 0));
	transition: transform .5s var(--ease); transform-style: preserve-3d;
}
@keyframes ms-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -12px; } }
[data-float] { transform: translate3d(var(--px, 0), var(--py, 0), 0); transition: transform .5s var(--ease); animation: ms-float 6s ease-in-out infinite; }
[data-float]:nth-of-type(2n) { animation-duration: 7.5s; animation-delay: -2s; }

.ms-devices { position: relative; aspect-ratio: 1.22; perspective: 1600px; }
.ms-devices__glow {
	position: absolute; inset: 10% 5% 0 10%; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(22, 119, 255, .55), transparent); filter: blur(30px);
}
.ms-laptop {
	position: absolute; left: 2%; top: 6%; width: 86%; z-index: 1;
	transform: rotateY(-14deg) rotateX(5deg) rotateZ(-1deg); transform-style: preserve-3d;
}
.ms-hero .ms-devices { transform: scale(1.02); transform-origin: center center; }
.ms-hero--home .ms-devices { transform: scale(.92); transform-origin: center bottom; }
.ms-hero--home .ms-visual { min-height: 0; }
.ms-hero--home .ms-visual--home { min-height: clamp(240px, 28vw, 340px); }

/* Home reel — realistic laptop + phone, scrolling real concept sites */
.ms-reel { position: relative; width: 100%; }
@media (min-width: 901px) {
	.ms-reel { width: calc(100% + clamp(0rem, 3vw, 3rem)); margin-right: calc(-1 * clamp(0rem, 3vw, 3rem)); }
}
.ms-reel__glow {
	position: absolute; inset: 6% 2% 18% 6%; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(22, 119, 255, .42), transparent);
	filter: blur(36px); pointer-events: none;
}
.ms-reel__stage { position: relative; padding: 0 9% 4% 0; }
.ms-reel__laptop { position: relative; z-index: 1; width: 100%; }
.ms-reel__lid {
	position: relative; padding: .55%;
	border-radius: 2.4% 2.4% 0 0 / 3.6% 3.6% 0 0;
	background: linear-gradient(180deg, var(--dev-alu-hi), var(--dev-alu) 40%, var(--dev-alu-lo));
	box-shadow: 0 0 0 1px var(--dev-alu-edge), 0 30px 60px rgba(0, 0, 0, .45);
}
.ms-reel__bezel {
	position: relative; padding: 3.1% 2.2% 2.4%;
	border-radius: 2% 2% 0 0 / 3% 3% 0 0;
	background: var(--dev-bezel);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .05);
}
.ms-reel__cam {
	position: absolute; top: 1.2%; left: 50%; width: .8%; aspect-ratio: 1;
	border-radius: 50%; transform: translateX(-50%);
	background: radial-gradient(circle at 35% 35%, var(--dev-cam-hi), var(--dev-cam) 60%);
}
.ms-reel__hinge {
	position: relative; height: 0; padding-top: 1.1%; margin: 0 1.2%;
	background: linear-gradient(180deg, var(--dev-hinge), var(--dev-hinge-hi) 55%, var(--dev-hinge));
}
.ms-reel__base {
	position: relative; height: 0; padding-top: 2.6%; margin: 0 -7%;
	border-radius: 0 0 46% 46% / 0 0 100% 100%;
	background: linear-gradient(180deg, var(--dev-alu-hi) 0%, var(--dev-alu) 30%, var(--dev-alu-lo) 75%, var(--dev-alu-edge) 100%);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .25) inset;
}
.ms-reel__notch {
	position: absolute; top: 0; left: 50%; width: 15%; height: 42%;
	border-radius: 0 0 14px 14px / 0 0 10px 10px; transform: translateX(-50%);
	background: linear-gradient(180deg, var(--dev-alu-lo), var(--dev-alu) 90%);
	box-shadow: inset 0 1px 2px rgba(0, 0, 0, .35);
}
.ms-reel__floor {
	position: absolute; left: -4%; right: -4%; bottom: -5%; height: 9%; z-index: -1;
	border-radius: 50%;
	background: radial-gradient(closest-side, rgba(0, 0, 0, .7), transparent);
	filter: blur(6px);
}
.ms-reel__screen { position: relative; overflow: hidden; background: var(--dev-glass); }
.ms-reel__screen--laptop { aspect-ratio: 16 / 10; }
.ms-reel__screen::after {
	content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none;
	background: linear-gradient(125deg, rgba(255, 255, 255, .07) 0%, rgba(255, 255, 255, .015) 30%, transparent 46%);
}
.ms-reel__shot {
	position: absolute; left: 0; top: 0; width: 100%; height: auto; max-width: none;
	opacity: 0; z-index: 0; will-change: transform, opacity;
	transition: opacity .7s var(--ease);
}
.ms-reel__shot.is-active { opacity: 1; z-index: 1; }

.ms-reel__phone {
	position: absolute; z-index: 2; right: 0; bottom: 0; width: 23%;
	padding: 1.1%; border-radius: 15% / 7.2%;
	background: linear-gradient(135deg, var(--dev-ti-hi), var(--dev-ti) 22%, var(--dev-ti-lo) 55%, var(--dev-ti) 80%, var(--dev-ti-hi));
	box-shadow:
		0 0 0 1px rgba(0, 0, 0, .6),
		inset 0 0 0 1px rgba(255, 255, 255, .18),
		-18px 30px 50px rgba(0, 0, 0, .55),
		0 0 40px rgba(22, 119, 255, .18);
}
.ms-reel__phone-body {
	position: relative; padding: 4.5%; border-radius: 13.5% / 6.4%;
	background: var(--dev-bezel);
}
.ms-reel__screen--phone { aspect-ratio: 9 / 19.5; border-radius: 11% / 5.1%; }
.ms-reel__island {
	position: absolute; z-index: 4; top: 6%; left: 50%; width: 30%; height: 2.9%;
	border-radius: 999px; transform: translateX(-50%); background: var(--dev-black);
}
.ms-reel__btn {
	position: absolute; width: 2.2%; border-radius: 2px;
	background: linear-gradient(90deg, var(--dev-ti-lo), var(--dev-ti-hi));
}
.ms-reel__btn--a { left: -1.6%; top: 20%; height: 5%; }
.ms-reel__btn--b { left: -1.6%; top: 28%; height: 9%; }
.ms-reel__btn--c { right: -1.6%; top: 26%; height: 13%; transform: scaleX(-1); }

.ms-reel__label {
	position: relative; z-index: 4;
	display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
	gap: .2rem .45rem; margin: .9rem 9% 0 0;
	color: var(--c-on-dark-muted); font-size: var(--fs-xs); letter-spacing: .06em;
	text-transform: uppercase;
}
.ms-reel__label strong {
	color: var(--c-on-dark); font-family: var(--font-display);
	font-weight: 500; font-size: 1.05em; letter-spacing: .08em;
}
.ms-reel__live {
	display: inline-flex; align-items: center; gap: .4rem; margin-right: .35rem;
	padding: .2rem .55rem; border: 1px solid var(--c-line-dark-2); border-radius: 999px;
	color: var(--c-on-dark); font-size: .92em; letter-spacing: .04em; text-transform: none;
}
.ms-reel__live::before {
	content: ""; width: 6px; height: 6px; border-radius: 50%;
	background: var(--c-ok); box-shadow: 0 0 0 3px rgba(22, 163, 74, .25);
}
/* Subpage hero cinema — laptop opens, site scrolls, phone reveals contact */
.ms-visual:has(.ms-cine) { min-height: 0; }
.ms-cine { position: relative; width: 100%; }
.ms-cine__glow {
	position: absolute; inset: 4% 4% 16% 4%; border-radius: 50%;
	background: radial-gradient(closest-side, rgba(22, 119, 255, .42), transparent);
	filter: blur(36px); pointer-events: none;
	transition: opacity 1.2s var(--ease);
}
.ms-cine.is-closed .ms-cine__glow { opacity: .25; }
.ms-cine__cam {
	position: relative; padding: 0 10% 3% 0;
	perspective: 1700px; perspective-origin: 50% 0%;
	transform-origin: 50% 60%;
	transition: transform 1.6s cubic-bezier(.65, 0, .25, 1);
}
.ms-cine.is-closed .ms-cine__cam { transform: translateY(6%) scale(.94); }
/* Phone phase: the phone itself travels to the centre and grows (free consultation with Lisa) */
.ms-cine.is-phone .ms-cine__phone { z-index: 5; transform: translate(-150%, -12%) scale(var(--ms-phone-zoom, 1.75)); }
.ms-cine .ms-reel__label { transition: opacity .6s var(--ease); }
.ms-cine.is-phone .ms-reel__label { opacity: 0; }
.ms-cine.is-phone .ms-cine__card { padding: 36% 6% 10%; gap: .3em; }
.ms-cine.is-phone .ms-cine__ring { width: 30%; }
.ms-cine.is-phone .ms-cine__name { font-size: 1.15em; }
.ms-cine.is-phone .ms-cine__role { font-size: .85em; margin-bottom: .6em; }
.ms-cine.is-phone .ms-cine__btn { font-size: .8em; padding: .7em .3em; gap: .3em; }
.ms-cine.is-phone .ms-cine__btn .ms-icon { width: 1em; height: 1em; flex: none; }
@media (max-width: 900px) {
	.ms-cine { --ms-phone-zoom: 1.6; }
}
.ms-cine__laptop { position: relative; z-index: 1; transform-style: preserve-3d; transition: filter 1.2s var(--ease); }
.ms-cine.is-phone .ms-cine__laptop { filter: brightness(.55) blur(1.5px); }
.ms-cine__lid {
	position: relative; transform-origin: 50% 100%; transform-style: preserve-3d;
	transition: transform 2.1s cubic-bezier(.55, 0, .2, 1);
}
.ms-cine.is-closed .ms-cine__lid { transform: rotateX(-89deg); }
html:not(.js) .ms-cine.is-closed .ms-cine__lid, html:not(.js) .ms-cine.is-closed .ms-cine__cam { transform: none; }
html:not(.js) .ms-cine.is-closed .ms-cine__site { opacity: 1; }
.ms-cine__lid-front { backface-visibility: hidden; }
.ms-cine__lid-back {
	position: absolute; inset: 0; display: grid; place-items: center;
	border-radius: 2.4% 2.4% 0 0 / 3.6% 3.6% 0 0;
	background: linear-gradient(180deg, var(--dev-alu-lo), var(--dev-alu) 45%, var(--dev-alu-hi));
	transform: rotateX(180deg); backface-visibility: hidden;
}
.ms-cine__mark {
	width: 9%; aspect-ratio: 1; border-radius: 50%;
	background: radial-gradient(circle, rgba(255, 255, 255, .6), rgba(255, 255, 255, 0) 70%);
	opacity: .5;
}
.ms-cine__screen { background: var(--dev-glass); }
.ms-cine__site {
	position: absolute; left: 0; top: 0; width: 100%; height: auto; max-width: none;
	opacity: 1; transition: opacity .9s var(--ease) .1s; will-change: transform;
}
.ms-cine__boot {
	position: absolute; inset: 0; z-index: 2; display: grid; place-items: center;
	background: var(--dev-glass); opacity: 0; pointer-events: none;
	transition: opacity .6s var(--ease);
}
.ms-cine__boot img { width: 13%; height: auto; opacity: .9; }
.ms-cine.is-closed .ms-cine__site,
.ms-cine.is-booting .ms-cine__site { opacity: 0; }
.ms-cine.is-booting .ms-cine__boot { opacity: 1; }

.ms-cine__phone {
	position: absolute; z-index: 2; right: 0; bottom: 0; width: 25%;
	padding: 1.1%; border-radius: 15% / 7.2%;
	background: linear-gradient(135deg, var(--dev-ti-hi), var(--dev-ti) 22%, var(--dev-ti-lo) 55%, var(--dev-ti) 80%, var(--dev-ti-hi));
	box-shadow:
		0 0 0 1px rgba(0, 0, 0, .6),
		inset 0 0 0 1px rgba(255, 255, 255, .18),
		-18px 30px 50px rgba(0, 0, 0, .55);
	transition: box-shadow 1.2s var(--ease), transform 1.4s cubic-bezier(.65, 0, .25, 1);
}
.ms-cine.is-closed .ms-cine__phone { transform: translateY(8%); }
.ms-cine.is-phone .ms-cine__phone { box-shadow: 0 0 0 1px rgba(0, 0, 0, .6), inset 0 0 0 1px rgba(255, 255, 255, .18), -18px 30px 50px rgba(0, 0, 0, .55), 0 0 60px rgba(22, 119, 255, .45); }
.ms-cine__pscreen {
	background: radial-gradient(120% 70% at 50% 0%, rgba(255, 255, 255, .05), transparent 60%), var(--dev-glass);
}
.ms-cine__card {
	position: absolute; inset: 0; z-index: 2;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35em;
	padding: 30% 9% 12%; text-align: center;
	font-size: clamp(.55rem, .35rem + .6vw, .85rem);
	background: radial-gradient(120% 60% at 50% 0%, rgba(22, 119, 255, .55), transparent 70%), linear-gradient(180deg, var(--c-ink-2), var(--c-void));
	opacity: 0; visibility: hidden;
	transition: opacity .8s var(--ease) .5s, visibility 0s linear 1.3s;
}
.ms-cine.is-phone .ms-cine__card,
.ms-cine.is-static .ms-cine__card { opacity: 1; visibility: visible; transition: opacity .8s var(--ease) .5s, visibility 0s; }
.ms-cine__face {
	width: 46%; aspect-ratio: 1; object-fit: cover; object-position: 50% 20%;
	border-radius: 50%; border: 2px solid rgba(94, 184, 255, .7);
	box-shadow: 0 0 0 5px rgba(22, 119, 255, .2);
}
.ms-cine__ring {
	display: grid; place-items: center; width: 42%; aspect-ratio: 1; border-radius: 50%;
	background: var(--grad-brand); color: var(--c-on-dark);
	box-shadow: 0 0 0 6px rgba(22, 119, 255, .25), 0 0 30px rgba(22, 119, 255, .6);
	animation: ms-cine-ring 1.6s ease-in-out infinite;
}
.ms-cine__ring .ms-icon { width: 40%; height: 40%; }
@keyframes ms-cine-ring { 50% { box-shadow: 0 0 0 12px rgba(22, 119, 255, .12), 0 0 40px rgba(22, 119, 255, .7); } }
.ms-cine__name { margin-top: .5em; color: var(--c-on-dark); font-size: 1.25em; font-weight: 650; line-height: 1.2; }
.ms-cine__role { margin-bottom: .8em; color: var(--c-on-dark-muted); font-size: .9em; line-height: 1.3; }
.ms-cine__btn {
	display: flex; align-items: center; justify-content: center; gap: .45em; width: 100%;
	padding: .75em .6em; border-radius: 999px;
	background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .16);
	color: var(--c-on-dark); font-size: 1em; font-weight: 600; text-decoration: none; white-space: nowrap;
}
.ms-cine__btn .ms-icon { width: 1.2em; height: 1.2em; }
.ms-cine__btn--wa, .ms-cine__btn--call { background: var(--c-blue); border-color: var(--c-blue); }
.ms-cine__btn:hover { color: var(--c-on-dark); filter: brightness(1.12); }
button.ms-cine__btn { font-family: inherit; cursor: pointer; }
.ms-cine__btn--call { box-shadow: 0 0 0 0 rgba(22, 119, 255, .6); animation: ms-cine-pulse 1.8s ease-out infinite; }
@keyframes ms-cine-pulse { 70% { box-shadow: 0 0 0 .7em rgba(22, 119, 255, 0); } 100% { box-shadow: 0 0 0 0 rgba(22, 119, 255, 0); } }
.ms-cine__role { max-width: 15em; }
.ms-cine .ms-reel__label { margin-right: 10%; }
.ms-laptop__lid {
	position: relative; padding: 2.2% 2.2% 3%; border-radius: 16px 16px 6px 6px;
	background: linear-gradient(160deg, #3A4558, #151C29 40%, #0D121C);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .12) inset, 0 40px 80px rgba(0, 0, 0, .55), 0 0 60px rgba(22, 119, 255, .25);
}
.ms-laptop__screen { position: relative; overflow: hidden; aspect-ratio: 16 / 10; border-radius: 6px; background: #050A14; }
.ms-laptop__screen::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, rgba(255, 255, 255, .12), transparent 35%); pointer-events: none; }
.ms-laptop__screen > img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.ms-laptop__base {
	position: relative; height: 14px; margin: 0 -7%;
	border-radius: 0 0 22px 22px / 0 0 14px 14px;
	background: linear-gradient(#5A6476, #1E2532 60%, #0B0F17);
	box-shadow: 0 30px 50px rgba(0, 0, 0, .6);
}
.ms-laptop__base::before {
	content: ""; position: absolute; left: 42%; right: 42%; top: 0; height: 5px;
	border-radius: 0 0 8px 8px; background: #0E131C;
}
.ms-phone {
	position: absolute; right: 0; bottom: 2%; width: 27%; z-index: 2; padding: 2.4%;
	border-radius: 30px; background: linear-gradient(150deg, #485366, #121822 45%);
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .14) inset, 0 40px 70px rgba(0, 0, 0, .6), 0 0 50px rgba(56, 182, 255, .25);
	transform: rotateY(-8deg) rotateZ(2deg);
}
.ms-phone__screen { position: relative; overflow: hidden; aspect-ratio: 9 / 19; border-radius: 22px; background: #050A14; }
.ms-phone__screen::before {
	content: ""; position: absolute; z-index: 2; top: 3%; left: 50%; width: 32%; height: 3.5%;
	border-radius: 999px; background: #000; transform: translateX(-50%);
}
.ms-phone__screen > img { width: 100%; height: 100%; object-fit: cover; object-position: top; }

.ms-ui { container-type: inline-size; position: absolute; inset: 0; display: flex; flex-direction: column; color: #fff; background: radial-gradient(90% 80% at 80% 20%, #1A4C9C 0%, #0B1630 45%, #060B16 100%); font-family: var(--font); }
.ms-ui__nav { display: flex; align-items: center; gap: 3cqi; padding: 3cqi 4cqi; }
.ms-ui__nav i { display: block; width: 7cqi; height: 1.1cqi; border-radius: 4px; background: rgba(255, 255, 255, .35); }
.ms-ui__nav b { margin-left: auto; padding: 1.2cqi 2.4cqi; border-radius: 1cqi; background: var(--c-blue); font-size: 2.2cqi; font-weight: 700; }
.ms-ui__logo { font-size: 4.5cqi; font-weight: 900; color: var(--c-cyan); margin-right: auto; }
.ms-ui__burger { width: 7cqi; height: 5cqi; margin-left: auto; background: linear-gradient(#fff 0 0) top / 100% 14% no-repeat, linear-gradient(#fff 0 0) center / 100% 14% no-repeat, linear-gradient(#fff 0 0) bottom / 100% 14% no-repeat; opacity: .8; }
.ms-ui__hero { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 0 6cqi 5cqi; }
.ms-ui__m { font-size: 9cqi; font-weight: 900; line-height: 1; letter-spacing: -.02em; background: var(--grad-brand); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: 2cqi; }
.ms-ui__title { margin: 0 0 1.5cqi; font-size: 6.4cqi; line-height: 1.08; font-weight: 600; letter-spacing: -.005em; font-family: var(--font-display); font-style: italic; }
.ms-ui__title em { color: var(--c-cyan); }
.ms-ui__sub { margin: 0 0 3cqi; font-size: 2.4cqi; color: var(--c-on-dark-muted); }
.ms-ui__btns { display: flex; gap: 2cqi; margin-bottom: 2cqi; }
.ms-ui__btns b, .ms-ui__btns i { padding: 1.6cqi 2.6cqi; border-radius: 1.2cqi; font-size: 2.2cqi; font-style: normal; font-weight: 700; white-space: nowrap; }
.ms-ui__btns b { background: var(--c-blue); }
.ms-ui__btns i { border: 1px solid rgba(255, 255, 255, .3); }
.ms-ui__stats { display: flex; gap: 6cqi; margin-top: 3cqi; }
.ms-ui__stats span { font-size: 1.9cqi; color: var(--c-on-dark-muted); }
.ms-ui__stats strong { display: block; font-size: 4.2cqi; color: #fff; font-style: italic; font-family: var(--font-display); }
.ms-ui--phone .ms-ui__nav { padding: 12cqi 7cqi 5cqi; }
.ms-ui--phone .ms-ui__logo { font-size: 9cqi; }
.ms-ui--phone .ms-ui__hero { padding: 0 7cqi 7cqi; text-align: center; align-items: center; }
.ms-ui--phone .ms-ui__m { font-size: 20cqi; letter-spacing: -.02em; }
.ms-ui--phone .ms-ui__title { font-size: 11cqi; }
.ms-ui--phone .ms-ui__sub { font-size: 5cqi; }
.ms-ui--phone .ms-ui__btns { flex-direction: column; width: 100%; }
.ms-ui--phone .ms-ui__btns b, .ms-ui--phone .ms-ui__btns i { font-size: 5cqi; padding: 4cqi; border-radius: 3cqi; text-align: center; }
.ms-ui__tabbar { display: flex; justify-content: space-around; width: 100%; margin-top: auto; padding-top: 6cqi; border-top: 1px solid rgba(255, 255, 255, .1); }
.ms-ui__tabbar span { width: 9cqi; height: 9cqi; border-radius: 2.5cqi; background: rgba(255, 255, 255, .18); }

.ms-floatcard {
	position: absolute; z-index: 4; display: flex; align-items: center; gap: .7rem;
	padding: .7rem 1rem .7rem .7rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: 16px;
	background: rgba(14, 24, 44, .72); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
	box-shadow: 0 20px 40px rgba(0, 0, 0, .35); color: #fff;
}
.ms-floatcard > .ms-icon {
	width: 38px; height: 38px; border-radius: 11px; background: var(--grad-brand);
	position: relative; -webkit-mask: none; mask: none;
}
.ms-floatcard > .ms-icon::before {
	content: ""; position: absolute; inset: 9px; background: #fff;
	-webkit-mask: var(--i) center / contain no-repeat; mask: var(--i) center / contain no-repeat;
}
.ms-floatcard strong { display: block; font-size: .875rem; line-height: 1.2; }
.ms-floatcard small { display: block; font-size: .75rem; color: var(--c-on-dark-muted); }
.ms-floatcard--tl { top: 2%; left: -4%; }
.ms-floatcard--br { right: -2%; bottom: -2%; }
.ms-badge-woo {
	position: absolute; z-index: 4; right: 2%; top: 4%; padding: .5rem 1rem; border-radius: 14px;
	background: linear-gradient(135deg, var(--c-cyan), var(--c-blue)); color: #fff;
	font-size: 1.35rem; font-weight: 800; letter-spacing: -.03em;
	box-shadow: 0 20px 40px rgba(22, 119, 255, .4);
}

.ms-chartcard {
	position: relative; padding: 1.5rem; border: 1px solid rgba(255, 255, 255, .14); border-radius: 24px;
	background: linear-gradient(160deg, rgba(23, 44, 82, .85), rgba(11, 18, 32, .9));
	backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
	box-shadow: 0 40px 80px rgba(0, 0, 0, .45), 0 0 60px rgba(22, 119, 255, .2);
}
.ms-chartcard__head { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; color: #fff; }
.ms-chartcard__head .ms-icon { color: var(--c-cyan); }
.ms-chartcard__head strong { display: block; }
.ms-chartcard__head small { color: var(--c-on-dark-muted); font-size: .75rem; }
.ms-chart { width: 100%; height: 200px; overflow: visible; }
.ms-chart__grid line { stroke: rgba(255, 255, 255, .08); stroke-dasharray: 4 6; }
.ms-chart__line { fill: none; stroke: var(--c-cyan); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 8px rgba(56, 182, 255, .8)); stroke-dasharray: 1; stroke-dashoffset: 1; }
.ms-chart__area { opacity: 0; transition: opacity 1s .9s; }
.ms-chart__dot { fill: #fff; stroke: var(--c-blue); stroke-width: 4; opacity: 0; transition: opacity .4s 1.6s; }
.ms-chartcard.is-live .ms-chart__line { animation: ms-draw 1.8s var(--ease) forwards; }
.ms-chartcard.is-live .ms-chart__area, .ms-chartcard.is-live .ms-chart__dot { opacity: 1; }
@keyframes ms-draw { to { stroke-dashoffset: 0; } }
.ms-chartcard__bars { display: flex; align-items: flex-end; gap: 8px; height: 70px; margin-top: 1rem; }
.ms-chartcard__bars i {
	flex: 1; height: 100%; border-radius: 6px 6px 2px 2px;
	background: linear-gradient(var(--c-cyan), var(--c-blue));
	transform: scaleY(0); transform-origin: bottom;
	transition: transform 1.2s var(--ease);
}
.ms-chartcard.is-live .ms-chartcard__bars i { transform: scaleY(calc(var(--h) / 100)); }
.ms-chartcard__note { margin: .75rem 0 0; color: var(--c-on-dark-muted); font-size: .6875rem; text-align: right; }

/* KI — coded orb, no stock */
.ms-kiframe {
	position: relative; overflow: hidden; aspect-ratio: 4 / 3.4; border-radius: 28px;
	border: 1px solid rgba(255, 255, 255, .12);
	background: radial-gradient(circle at 60% 40%, #1E5BC6, #0B1220 70%);
	box-shadow: 0 40px 80px rgba(0, 0, 0, .5), 0 0 80px rgba(22, 119, 255, .25);
}
.ms-kiframe__orb {
	position: absolute; inset: 18%; border-radius: 50%;
	background: radial-gradient(circle at 35% 35%, #A8E0FF, #1677FF 42%, #061018 72%);
	box-shadow: 0 0 120px rgba(56, 182, 255, .55);
	animation: ms-pulse 4s ease-in-out infinite;
}
.ms-kiframe__ring {
	position: absolute; inset: 12%; border-radius: 50%;
	border: 1px solid rgba(94, 184, 255, .25);
	animation: ms-spin 18s linear infinite;
}
.ms-kiframe__ring::before {
	content: ""; position: absolute; top: -4px; left: 50%; width: 8px; height: 8px;
	border-radius: 50%; background: var(--c-cyan); box-shadow: 0 0 16px var(--c-cyan);
	transform: translateX(-50%);
}
.ms-kiframe__grid {
	position: absolute; inset: 0;
	background-image: linear-gradient(rgba(255, 255, 255, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .04) 1px, transparent 1px);
	background-size: 40px 40px;
	mask-image: radial-gradient(circle at 50% 45%, #000 20%, transparent 70%);
	-webkit-mask-image: radial-gradient(circle at 50% 45%, #000 20%, transparent 70%);
}
@keyframes ms-pulse { 50% { transform: scale(1.06); } }
@keyframes ms-spin { to { transform: rotate(360deg); } }
.ms-voice { position: absolute; z-index: 2; left: 8%; right: 8%; bottom: 8%; display: flex; align-items: center; justify-content: center; gap: 4px; height: 56px; }
.ms-voice i {
	flex: 1; max-width: 6px; height: 100%; border-radius: 4px;
	background: linear-gradient(var(--c-cyan), var(--c-blue));
	box-shadow: 0 0 10px rgba(56, 182, 255, .7);
	transform: scaleY(.2); transform-origin: center;
	animation: ms-voice 1.2s ease-in-out infinite;
}
.ms-voice i:nth-child(3n) { animation-delay: -.3s; }
.ms-voice i:nth-child(3n+1) { animation-delay: -.7s; }
.ms-voice i:nth-child(4n) { animation-duration: .9s; }
.ms-voice i:nth-child(5n) { animation-duration: 1.5s; }
@keyframes ms-voice { 0%, 100% { transform: scaleY(.18); } 50% { transform: scaleY(1); } }
.ms-bubble {
	position: absolute; z-index: 3; left: -6%; top: 14%; display: flex; align-items: center; gap: .6rem;
	max-width: 240px; padding: .9rem 1.1rem; border-radius: 18px 18px 18px 4px;
	background: var(--c-white); color: var(--c-ink); font-size: .9375rem; font-weight: 600; line-height: 1.35;
	box-shadow: 0 20px 40px rgba(0, 0, 0, .35);
}
.ms-bubble__dot { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--c-ok); box-shadow: 0 0 0 4px rgba(22, 163, 74, .2); }
.ms-callbtns { position: absolute; z-index: 3; right: -4%; top: 30%; display: grid; gap: .75rem; }
.ms-callbtns > span {
	display: grid; place-items: center; width: 54px; height: 54px; border-radius: 16px;
	background: var(--grad-brand); color: #fff; box-shadow: 0 14px 30px rgba(22, 119, 255, .45);
}
.ms-callbtns > span:nth-child(n+2) { background: rgba(14, 24, 44, .85); border: 1px solid rgba(255, 255, 255, .16); }

.ms-chat { width: min(380px, 100%); margin-left: auto; overflow: hidden; border-radius: 22px; background: var(--c-ink-2); color: var(--c-text); border: 1px solid var(--c-line-2); box-shadow: 0 40px 80px rgba(0, 0, 0, .45); }
.ms-chat__head { display: flex; align-items: center; gap: .75rem; padding: 1rem 1.1rem; border-bottom: 1px solid var(--c-line); }
.ms-chat__head strong { display: block; font-size: .9375rem; }
.ms-chat__head small { display: flex; align-items: center; gap: .35rem; color: var(--c-muted); font-size: .75rem; }
.ms-chat__avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--c-ink); color: var(--c-cyan); font-weight: 900; font-size: .7rem; letter-spacing: .02em; }
.ms-online { width: 8px; height: 8px; border-radius: 50%; background: var(--c-ok); }
.ms-chat__close { margin-left: auto; width: 36px; height: 36px; border: 0; border-radius: 10px; background: var(--c-bg-muted); font-size: 1.25rem; cursor: pointer; }
.ms-chat__body { padding: 1.1rem; background: var(--c-bg-muted); }
.ms-chat__msg { margin: 0 0 1rem; padding: .85rem 1rem; border-radius: 4px 16px 16px 16px; background: var(--c-ink-3); font-size: .875rem; box-shadow: var(--sh-card); }
.ms-chat__opts { display: grid; gap: .5rem; justify-items: end; }
.ms-chat__opts a {
	padding: .6rem .95rem; border: 1px solid rgba(22, 119, 255, .25); border-radius: 999px;
	background: var(--c-blue-50); color: var(--c-cyan); font-size: .8125rem; font-weight: 600; text-decoration: none;
	transition: background-color .2s, color .2s;
}
.ms-chat__opts a:hover { background: var(--c-blue); color: #fff; }
.ms-chat__foot { padding: .85rem 1.1rem; border-top: 1px solid var(--c-line); font-size: .8125rem; }
.ms-chat__foot a { color: var(--c-muted); }
.ms-section--dark .ms-chat p, .ms-section--dark .ms-chat li { color: var(--c-text); }
.ms-section--dark .ms-chat strong { color: var(--c-text); }
.ms-section--dark .ms-chat small { color: var(--c-muted); }
.ms-section--dark .ms-chat .ms-chat__opts a { color: var(--c-blue-600); }
.ms-section--dark .ms-chat .ms-chat__opts a:hover { color: #fff; }
.ms-section--dark .ms-chat .ms-chat__foot a { color: var(--c-muted); }

/* Persistent contact dock */
.ms-dock { position: fixed; z-index: 60; pointer-events: none; }
.ms-dock__panel {
	position: fixed; right: var(--dock-gap); bottom: calc(var(--dock-gap) + 72px);
	width: min(360px, calc(100vw - 40px)); pointer-events: auto;
	animation: ms-up .35s var(--ease) both;
}
.ms-dock__panel .ms-chat { margin: 0; }
.ms-dock__pill {
	position: fixed; right: var(--dock-gap); bottom: var(--dock-gap);
	display: none; align-items: center; gap: 2px; padding: 4px;
	border: 1px solid var(--c-line-dark-2); border-radius: 999px;
	background: rgba(7, 13, 26, .92); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
	box-shadow: 0 16px 40px rgba(0, 0, 0, .4); pointer-events: auto;
}
.ms-dock__pill-link {
	display: inline-flex; align-items: center; gap: .4rem;
	min-height: 42px; padding: 0 .95rem; border: 0; border-radius: 999px;
	background: transparent; color: var(--c-on-dark); font-size: var(--fs-xs); font-weight: 650;
	text-decoration: none; cursor: pointer; transition: background-color .2s, color .2s;
}
.ms-dock__pill-link .ms-icon { width: 1rem; height: 1rem; color: var(--c-cyan); }
.ms-dock__pill-link:hover { background: rgba(255, 255, 255, .08); color: var(--c-on-dark); }
.ms-dock__pill-link--primary { background: var(--c-blue); color: var(--c-on-dark); }
.ms-dock__pill-link--primary .ms-icon { color: var(--c-on-dark); }
.ms-dock__pill-link--primary:hover { background: var(--c-blue-600); color: var(--c-on-dark); }
.ms-dock__bar {
	display: none; position: fixed; left: 0; right: 0; bottom: 0;
	grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0;
	padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
	border-top: 1px solid var(--c-line-dark-2);
	background: rgba(7, 13, 26, .96); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
	pointer-events: auto;
}
.ms-dock__bar-btn {
	border: 0; background: transparent; font-family: inherit; cursor: pointer;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
	min-height: 52px; padding: .35rem; border-radius: 14px;
	color: var(--c-on-dark-muted); font-size: .6875rem; font-weight: 650; text-decoration: none;
}
.ms-dock__bar-btn .ms-icon { width: 1.25rem; height: 1.25rem; color: var(--c-cyan); }
.ms-dock__bar-btn--primary { color: var(--c-on-dark); background: rgba(22, 119, 255, .18); }
.ms-dock__bar-btn--primary .ms-icon { color: var(--c-on-dark); }
@media (min-width: 901px) {
	.ms-dock.is-dock-visible .ms-dock__pill { display: inline-flex; }
}
@media (max-width: 900px) {
	:root { --dock-mobile-h: calc(68px + env(safe-area-inset-bottom, 0px)); }
	.ms-dock__bar { display: grid; }
	.ms-dock__pill { display: none !important; }
	/* Panel opens on mobile from the dock's Lisa button or the hero phone: bottom sheet above the bar */
	.ms-dock:not(.is-open) .ms-dock__panel { display: none !important; }
	.ms-dock.is-open .ms-dock__panel { left: 12px; right: 12px; width: auto; bottom: calc(var(--dock-mobile-h) + 10px); }
	.ms-dock.is-open .ms-dock__panel .ms-lisa__log { max-height: 38vh; overflow-y: auto; }
}
.ms-lisa__voice [data-lisa-end] { background: var(--c-err, #e5484d); border-color: transparent; color: #fff; }
.ms-lisa__voice [data-lisa-end]:hover { filter: brightness(1.1); color: #fff; }

.ms-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin: 0; padding: 0; list-style: none; }
.ms-stats li { padding: 1.25rem 1.5rem; border: 1px solid var(--c-line-dark); border-radius: 18px; background: rgba(255, 255, 255, .03); }
.ms-stats strong {
	display: block; font-family: var(--font-display); font-size: clamp(1.85rem, 1.35rem + 1.8vw, 2.75rem);
	font-weight: 500; letter-spacing: 0; line-height: 1.08;
	background: linear-gradient(135deg, #fff 30%, var(--c-cyan)); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.ms-stats li > span { display: block; margin-top: .25rem; color: var(--c-on-dark-muted); font-size: var(--fs-sm); }
.ms-hero .ms-stats { margin-top: clamp(1.25rem, .8rem + 1.2vw, 2rem); }
.ms-hero--home .ms-stats {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: .5rem; margin-top: clamp(.85rem, .5rem + .8vw, 1.35rem);
}
.ms-hero--home .ms-stats li { padding: .55rem .7rem; border-radius: 12px; }
.ms-hero--home .ms-stats strong { font-size: clamp(1.2rem, .95rem + .9vw, 1.65rem); }
.ms-hero--home .ms-stats li > span { font-size: .68rem; line-height: 1.3; }

/* 3D coverflow showcase */
.ms-showcase { --cover-w: min(420px, 58vw); }
.ms-coverflow {
	display: none; position: relative;
	outline: none; margin: 0 0 var(--sp-6);
}
html.has-coverflow .ms-coverflow { display: block; }
html.has-coverflow .ms-projects--fallback { display: none; }
.ms-coverflow__viewport {
	position: relative; height: clamp(240px, 32vw, 340px);
	perspective: 1400px; perspective-origin: 50% 45%;
	overflow: hidden;
}
.ms-coverflow__track {
	position: absolute; inset: 0;
	transform-style: preserve-3d;
}
.ms-coverflow__slide {
	position: absolute; top: 50%; left: 50%;
	width: var(--cover-w); margin: 0;
	transform:
		translate(-50%, -50%)
		translateX(calc(var(--o, 0) * 38%))
		translateZ(calc(var(--abs, 0) * -120px))
		rotateY(calc(var(--o, 0) * -42deg))
		scale(calc(1 - var(--abs, 0) * .12));
	transform-style: preserve-3d;
	transition: transform .55s var(--ease), opacity .4s, filter .4s;
	opacity: calc(1 - var(--abs, 0) * .28);
	filter: brightness(calc(1 - var(--abs, 0) * .18));
	cursor: grab; user-select: none;
	z-index: calc(10 - var(--abs, 0));
}
.ms-coverflow__slide.is-active {
	opacity: 1; filter: none; cursor: default;
	z-index: 20;
}
.ms-coverflow__browser {
	overflow: hidden; border-radius: 16px;
	border: 1px solid rgba(255, 255, 255, .16);
	background: var(--c-ink-2);
	box-shadow: 0 30px 70px rgba(0, 0, 0, .5), 0 0 40px rgba(22, 119, 255, .12);
}
.ms-coverflow__chrome {
	display: flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px;
	background: rgba(7, 13, 26, .95); border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.ms-coverflow__chrome i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, .22); }
.ms-coverflow__slide img {
	width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top;
	pointer-events: none;
}
.ms-coverflow__nav {
	position: absolute; top: 50%; z-index: 30;
	display: grid; place-items: center;
	width: 44px; height: 44px; margin-top: -22px; padding: 0;
	border: 1px solid var(--c-line-dark-2); border-radius: 50%;
	background: rgba(7, 13, 26, .75); color: var(--c-on-dark); cursor: pointer;
	backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
	transition: background-color .2s, border-color .2s, transform .2s var(--ease);
}
.ms-coverflow__nav:hover { background: var(--c-blue); border-color: var(--c-blue); transform: scale(1.05); }
.ms-coverflow__nav--prev { left: 0; }
.ms-coverflow__nav--next { right: 0; }
.ms-coverflow__meta {
	display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
	gap: var(--sp-5); max-width: 40rem; margin: 0 auto; text-align: center;
}
.ms-coverflow__info { flex: 1 1 16rem; }
.ms-coverflow__badge { margin-bottom: var(--sp-2); color: var(--c-on-dark-muted); font-size: var(--fs-xs); }
.ms-coverflow__name {
	margin: 0 0 var(--sp-3); font-family: var(--font-display); font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem);
	font-weight: 500; color: var(--c-on-dark);
}
.ms-coverflow__tags { justify-content: center; margin-bottom: var(--sp-4); }
.ms-coverflow__cta { margin-top: var(--sp-2); }
.ms-coverflow__status {
	display: flex; flex-direction: column; align-items: center; gap: var(--sp-3);
	flex: none; color: var(--c-on-dark-muted); font-size: var(--fs-xs); font-weight: 600;
}
.ms-coverflow__dots { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; max-width: 180px; }
.ms-coverflow__dots button {
	width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%;
	background: rgba(255, 255, 255, .25); cursor: pointer;
	transition: transform .2s var(--ease), background-color .2s;
}
.ms-coverflow__dots button.is-active { background: var(--c-cyan); transform: scale(1.35); }
.ms-section:not(.ms-section--dark) .ms-coverflow__name { color: var(--c-text); }
.ms-section:not(.ms-section--dark) .ms-coverflow__badge { color: var(--c-muted); }
.ms-section:not(.ms-section--dark) .ms-coverflow__status { color: var(--c-muted); }
.ms-section:not(.ms-section--dark) .ms-coverflow__nav {
	background: rgba(255, 255, 255, .9); color: var(--c-text); border-color: var(--c-line);
}

.ms-collage { position: relative; aspect-ratio: 1.15; }
.ms-collage__item {
	position: absolute; overflow: hidden; width: 62%;
	border: 1px solid rgba(255, 255, 255, .14); border-radius: 14px;
	background: var(--c-ink-2); box-shadow: 0 30px 60px rgba(0, 0, 0, .5);
}
.ms-collage__item img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; }
.ms-collage__item--1 { top: 0; left: 0; z-index: 2; }
.ms-collage__item--2 { top: 8%; right: 0; z-index: 1; }
.ms-collage__item--3 { bottom: 6%; left: 8%; z-index: 3; }
.ms-collage__item--4 { bottom: 0; right: 4%; z-index: 4; width: 50%; }
.ms-portrait {
	position: relative; width: min(380px, 80%); margin-inline: auto; padding: 10px; border-radius: 30px;
	background: linear-gradient(160deg, rgba(56, 182, 255, .5), rgba(22, 119, 255, .1));
	box-shadow: 0 40px 80px rgba(0, 0, 0, .45), 0 0 80px rgba(22, 119, 255, .25);
}
.ms-portrait img { width: 100%; border-radius: 22px; background: #fff; }

.ms-proof { border-bottom: 1px solid var(--c-line); background: var(--c-bg); }
.ms-proof ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.ms-proof li { display: flex; gap: var(--sp-3); align-items: flex-start; padding: var(--sp-5) var(--sp-4); border-left: 1px solid var(--c-line); }
.ms-proof li:first-child { border-left: 0; padding-left: 0; }
.ms-proof .ms-icon { color: var(--c-blue); margin-top: .1rem; }
.ms-proof strong { display: block; font-size: var(--fs-sm); font-weight: 680; line-height: 1.35; }
.ms-proof span { display: block; color: var(--c-muted); font-size: var(--fs-xs); line-height: 1.45; }

.ms-stage { position: relative; aspect-ratio: 1 / .86; }
.ms-browser { position: absolute; overflow: hidden; border: 1px solid var(--c-line-dark-2); border-radius: 14px; background: var(--c-ink-2); box-shadow: var(--sh-float); }
.ms-browser__bar { display: flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; background: var(--c-ink-3); border-bottom: 1px solid var(--c-line-dark); }
.ms-browser__bar i { width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, .22); }
.ms-browser__bar span { margin-left: 8px; color: var(--c-on-dark-muted); font-size: 11px; letter-spacing: .02em; }
.ms-browser img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; }
.ms-browser--a { top: 0; right: 0; width: 82%; z-index: 1; }
.ms-browser--b { bottom: 4%; left: 0; width: 62%; z-index: 2; }

/* Spotlight host */
.ms-spotlight { --sx: 50%; --sy: 40%; }
.ms-spotlight::after {
	content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
	background: radial-gradient(600px circle at var(--sx) var(--sy), rgba(22, 119, 255, .14), transparent 45%);
	opacity: 0; transition: opacity .4s;
}
.ms-spotlight.is-lit::after { opacity: 1; }

/* Responsive */
@media (max-width: 1100px) {
	.ms-nav, .ms-header__cta { display: none; }
	.ms-burger { display: block; }
	.ms-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ms-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--sp-6); }
	.ms-proof ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ms-proof li:nth-child(3) { border-left: 0; padding-left: 0; }
	.ms-proof li:nth-child(n+3) { border-top: 1px solid var(--c-line); }
	.ms-footer__grid { grid-template-columns: 1fr 1fr; }
	.ms-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ms-hero--home .ms-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
	.ms-hero__grid, .ms-split, .ms-hero--split .ms-hero__grid, .ms-hero--home .ms-hero__grid { grid-template-columns: minmax(0, 1fr); }
	.ms-split--sticky > :first-child { position: static; }
	.ms-stage { max-width: 560px; }
	.ms-grid--3, .ms-projects { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ms-contact { grid-template-columns: minmax(0, 1fr); }
	.ms-chooser { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.ms-choice { flex-direction: column; align-items: flex-start; gap: var(--sp-3); }
	.ms-cta .ms-wrap { flex-direction: column; align-items: flex-start; }
	.ms-contact-info { grid-template-columns: minmax(0, 1fr); }
	.ms-head-row { display: block; }
	.ms-visual { max-width: 560px; margin-inline: auto; width: 100%; }
	.ms-hero .ms-devices { transform: none; }
	.ms-hero--home .ms-visual--home { min-height: 0; max-width: 640px; }
	.ms-reel__glow { opacity: .7; }
	.ms-trust--row { flex-wrap: wrap; }
	.ms-floatcard--tl { left: 0; }
	.ms-floatcard--br { right: 0; }
	.ms-bubble { left: 0; }
	.ms-callbtns { right: 0; }
	.ms-iconrow { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.5rem; }
	.ms-svc--web, .ms-svc--shop, .ms-svc--seo, .ms-svc--ki, .ms-svc--flow { grid-column: span 12; grid-row: auto; }
	.ms-svc--web .ms-svc__visual { min-height: 340px; }
	.ms-coverflow__viewport { height: 220px; }
	.ms-showcase { --cover-w: min(280px, 78vw); }
	.ms-coverflow__nav { width: 38px; height: 38px; margin-top: -19px; }
	.ms-coverflow__meta { flex-direction: column; align-items: center; }
}
@media (max-width: 640px) {
	:root { --header-h: 68px; --grain-opacity: .02; }
	.ms-header { padding-top: var(--sp-2); }
	.ms-grid--2, .ms-grid--3, .ms-grid--4, .ms-projects, .ms-steps, .ms-checklist--cols, .ms-form__grid { grid-template-columns: minmax(0, 1fr); }
	.ms-chooser { grid-template-columns: minmax(0, 1fr); }
	.ms-choice { flex-direction: row; align-items: center; min-height: 64px; }
	.ms-actions .ms-btn, .ms-cta .ms-btn { width: 100%; }
	.ms-actions--hero { flex-direction: column; align-items: stretch; }
	.ms-actions--hero .ms-link--hero { justify-content: center; min-height: 44px; }
	.ms-proof ul { grid-template-columns: minmax(0, 1fr); }
	.ms-proof li { border-left: 0; padding-left: 0; }
	.ms-proof li + li { border-top: 1px solid var(--c-line); }
	.ms-footer__grid { grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
	.ms-faq summary { padding-right: 2.75rem; font-size: 1rem; }
	.ms-faq details > div { padding-right: 0; }
	.ms-logo { font-size: 1.05rem; }
	.ms-logo__mark { width: 32px; height: 32px; }
	.ms-btn { white-space: normal; text-align: center; }
	.ms-hero .ms-eyebrow { letter-spacing: .1em; font-size: .75rem; }
	.ms-hero--home h1 { max-width: 11ch; }
	.ms-svc__visual, .ms-svc--web .ms-svc__visual { min-height: 260px; }
	.ms-svc__flow { gap: .25rem; }
	.ms-svc__step { font-size: .68rem; }
	.ms-svc__step-ic { width: 44px; height: 44px; border-radius: 13px; }
	.ms-svc__flow::before { top: 21px; }
	.ms-svc__pulse { top: 17px; }
	.ms-floatcard { padding: .5rem .75rem .5rem .5rem; }
	.ms-floatcard > .ms-icon { width: 32px; height: 32px; }
	.ms-floatcard small { display: none; }
	.ms-callbtns > span { width: 44px; height: 44px; }
	.ms-bubble { font-size: .8125rem; max-width: 190px; }
	.ms-stats { grid-template-columns: minmax(0, 1fr); }
	.ms-hero--home .ms-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.ms-header__cta { display: none; }
}
@media (min-width: 901px) and (max-height: 900px) {
	.ms-hero--home { padding-top: calc(var(--header-h) + .65rem); padding-bottom: .75rem; }
	.ms-hero--home .ms-hero__grid {
		grid-template-columns: minmax(0, .94fr) minmax(0, 1.06fr);
		gap: clamp(1rem, .35rem + 1.5vw, 2rem);
	}
	.ms-hero--home h1 { font-size: clamp(2rem, 1.2rem + 2.2vw, 3.35rem); margin-bottom: var(--sp-2); }
	.ms-hero--home .ms-lead {
		font-size: clamp(.88rem, .82rem + .28vw, 1rem);
		line-height: 1.5;
		max-width: 38rem;
	}
	.ms-hero--home .ms-actions { margin-top: var(--sp-3); }
	.ms-hero--home .ms-trust { margin-top: var(--sp-2); }
	.ms-hero--home .ms-visual--home { min-height: 200px; }
	.ms-hero--home .ms-stats li { padding: .4rem .5rem; }
	.ms-hero--home .ms-stats strong { font-size: 1.2rem; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
	.js [data-reveal] { opacity: 1; transform: none; filter: none; }
	.ms-chart__line { stroke-dashoffset: 0; }
	.ms-chartcard__bars i { transform: scaleY(calc(var(--h) / 100)); }
	.ms-steps .ms-step::before { transform: scaleX(1); }
	.ms-marquee ul { animation: none; }
	.ms-voice i { transform: scaleY(.5); }
	.ms-svc__line { stroke-dashoffset: 0; }
	.ms-svc__pulse { display: none; }
	html.has-coverflow .ms-coverflow { display: none !important; }
	html.has-coverflow .ms-projects--fallback { display: grid !important; }
	body::after { display: none; }
}

/* ---------- Blog (posts migrated from the old site) ---------- */
.ms-post-meta { margin-top: var(--sp-4); color: var(--c-on-dark-muted); font-size: var(--fs-sm); }
.ms-post-meta a, .ms-post-hero .ms-eyebrow a { color: inherit; }
.ms-post__cover { max-width: 56rem; margin: 0 auto var(--sp-8); border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--c-line); }
.ms-post__cover img { display: block; width: 100%; height: auto; }
.ms-post__body { margin: 0 auto; font-size: var(--fs-base); line-height: 1.75; }
.ms-post__body img { max-width: 100%; height: auto; border-radius: var(--r-sm); }
.ms-post__body a { color: var(--c-cyan); text-decoration: underline; text-underline-offset: 3px; }
.ms-post__body table { width: 100%; border-collapse: collapse; margin: var(--sp-6) 0; font-size: var(--fs-sm); display: block; overflow-x: auto; }
.ms-post__body th, .ms-post__body td { padding: .6rem .8rem; border-bottom: 1px solid var(--c-line); text-align: left; vertical-align: top; }
.ms-post__body blockquote { margin: var(--sp-6) 0; padding: var(--sp-4) var(--sp-5); border-left: 3px solid var(--c-blue); background: var(--c-surface); border-radius: 0 var(--r-sm) var(--r-sm) 0; }
.ms-post__body pre, .ms-post__body code { font-size: .9em; background: var(--c-surface-2); border-radius: 6px; }
.ms-post__body pre { padding: var(--sp-4); overflow-x: auto; }
.ms-post__cta { max-width: var(--max-prose); margin: var(--sp-9) auto 0; padding: var(--sp-7); border-radius: var(--r-lg); border: 1px solid var(--c-line-2); background: var(--c-surface); }
.ms-post__cta h2 { font-size: var(--fs-h3); margin-bottom: var(--sp-3); }
.ms-post__cta p:last-child { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin: var(--sp-5) 0 0; }
.ms-blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr)); gap: var(--sp-6); }
.ms-blog-card { display: flex; flex-direction: column; border-radius: var(--r-card); border: 1px solid var(--c-line); background: var(--c-surface); overflow: hidden; transition: border-color .3s, transform .3s var(--ease); }
.ms-blog-card:hover { border-color: var(--c-line-2); transform: translateY(-4px); }
.ms-blog-card__img img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.ms-blog-card__body { padding: var(--sp-5); }
.ms-blog-card time { color: var(--c-muted); font-size: var(--fs-xs); }
.ms-blog-card h2 { margin: var(--sp-2) 0 var(--sp-3); font-family: var(--font); font-size: 1.15rem; line-height: 1.35; }
.ms-blog-card h2 a { color: var(--c-on-dark); text-decoration: none; }
.ms-blog-card h2 a::after { content: ""; position: absolute; inset: 0; }
.ms-blog-card { position: relative; }
.ms-blog-card p { margin: 0; color: var(--c-muted); font-size: var(--fs-sm); }
.ms-pager { display: flex; flex-wrap: wrap; gap: var(--sp-2); justify-content: center; margin-top: var(--sp-8); }
.ms-pager .page-numbers { padding: .5rem .9rem; border-radius: var(--r-btn); border: 1px solid var(--c-line); color: var(--c-text); text-decoration: none; }
.ms-pager .current { border-color: var(--c-blue); background: var(--c-blue-50); }

/* ---------- Lisa chat (ElevenLabs agent, loaded on click) ---------- */
.ms-lisa { display: flex; flex-direction: column; }
.ms-lisa__orb { position: relative; flex: none; width: 40px; height: 40px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, var(--c-cyan), var(--c-blue) 55%, var(--c-ink-2) 100%); box-shadow: 0 0 18px var(--glow-cyan); }
.ms-lisa.is-live .ms-lisa__orb { animation: ms-lisa-breathe 2.4s var(--ease) infinite; }
.ms-lisa.is-speaking .ms-lisa__orb { animation-duration: .7s; }
@keyframes ms-lisa-breathe { 50% { transform: scale(1.12); box-shadow: 0 0 30px var(--c-cyan); } }
.ms-lisa__log { display: flex; flex-direction: column; gap: .6rem; max-height: 320px; overflow-y: auto; overscroll-behavior: contain; padding-right: .25rem; }
.ms-lisa__log .ms-chat__msg { margin: 0; max-width: 88%; font-size: var(--fs-sm); line-height: 1.5; }
.ms-chat__msg--me { align-self: flex-end; border-radius: 16px 4px 16px 16px; background: var(--c-blue); color: var(--c-on-dark); }
.ms-lisa__start { display: grid; gap: .6rem; margin-top: 1rem; }
.ms-lisa__start .ms-btn { justify-content: center; width: 100%; }
.ms-lisa__note { margin: .25rem 0 0; color: var(--c-muted); font-size: var(--fs-xs); line-height: 1.45; }
.ms-lisa__note a { color: var(--c-cyan); }
.ms-lisa__form { display: flex; gap: .5rem; margin-top: 1rem; }
.ms-lisa__form input { flex: 1; min-width: 0; padding: .75rem 1rem; border: 1px solid var(--c-line-2); border-radius: var(--r-btn); background: var(--c-surface); color: var(--c-text); font: inherit; font-size: var(--fs-sm); }
.ms-lisa__form input:focus { outline: none; border-color: var(--c-blue); box-shadow: var(--focus); }
.ms-lisa__send { display: grid; place-items: center; flex: none; width: 46px; height: 46px; border: 0; border-radius: 50%; background: var(--c-blue); color: var(--c-on-dark); cursor: pointer; }
.ms-lisa__send:hover { background: var(--c-blue-600); }
.ms-lisa__voice { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1rem; }
.ms-lisa__wave { display: flex; align-items: center; gap: 4px; height: 28px; }
.ms-lisa__wave i { width: 4px; height: 30%; border-radius: 2px; background: var(--c-cyan); }
.ms-lisa.is-speaking .ms-lisa__wave i { animation: ms-lisa-wave .9s var(--ease) infinite; }
.ms-lisa__wave i:nth-child(2) { animation-delay: .1s; } .ms-lisa__wave i:nth-child(3) { animation-delay: .2s; }
.ms-lisa__wave i:nth-child(4) { animation-delay: .3s; } .ms-lisa__wave i:nth-child(5) { animation-delay: .4s; }
@keyframes ms-lisa-wave { 50% { height: 100%; } }
.ms-lisa .ms-chat__foot { display: flex; justify-content: space-between; gap: 1rem; }
.ms-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .ms-lisa__orb, .ms-lisa__wave i { animation: none !important; } }
.ms-lisa [hidden] { display: none !important; }