.mc-home { --mc-navy:#233455; --mc-paper:#f5f6f2; --mc-muted:#596878; --mc-line:#d9e0df; color:var(--mc-navy); }
.mc-home main { padding-top:80px; }
.mc-home main [hidden] { display:none!important; }
.mc-home main h1,.mc-home main h2,.mc-home main h3,.mc-home main p { word-break:keep-all; overflow-wrap:anywhere; }
.mc-home main p { margin:0; }
.mc-home main section[id],.mc-home #canvas-room { scroll-margin-top:100px; }
.mc-home :focus-visible { outline:3px solid #568497; outline-offset:5px; }
.mc-home .mc-wrap { width:min(1152px,calc(100% - 64px)); margin-inline:auto; }
.mc-kicker { font-size:11px; font-weight:700; letter-spacing:.14em; display:flex; align-items:center; gap:12px; }
.mc-kicker::before { content:''; width:22px; height:2px; background:currentColor; }
.mc-home main .mc-title { font-size:clamp(31px,3.5vw,46px); letter-spacing:-.05em; line-height:1.28; }
.mc-button { display:inline-flex; gap:25px; align-items:center; justify-content:center; text-decoration:none; color:white; background:var(--mc-navy); border:1px solid var(--mc-navy); border-radius:6px; min-height:49px; padding:13px 21px; font:inherit; font-size:14px; font-weight:650; cursor:pointer; }
.mc-button:hover { background:#3b5577; }
.mc-button--light { background:#d0e6e4; color:#233455; border-color:#d0e6e4; }
.mc-button--light:hover { background:#e2efed; }
.mc-link { display:inline-flex; gap:15px; align-items:center; min-height:44px; color:inherit; font-size:14px; font-weight:600; text-decoration:none; }
.mc-link:hover { text-decoration:underline; text-underline-offset:5px; }
.mc-actions { display:flex; gap:14px 26px; align-items:center; flex-wrap:wrap; }
.mc-hero { position:relative; padding:65px 0 28px; background:var(--mc-paper); overflow:hidden; }
.mc-hero-grid { display:grid; grid-template-columns:1fr 1.07fr; align-items:center; gap:40px; }
.mc-home main .mc-hero h1 { font-size:clamp(44px,5.3vw,71px); letter-spacing:-.06em; line-height:1.16; font-weight:750; margin:26px 0; }
.mc-hero h1 em { color:#538c83; font-style:normal; }
.mc-home main .mc-hero-copy { font-size:16px; line-height:1.85; max-width:430px; color:var(--mc-muted); margin-bottom:28px; }
.mc-hero-note { margin-top:17px!important; font-size:12px; color:#5d756f; }
.mc-index { display:flex; align-items:center; justify-content:space-between; border-top:1px solid #ccd7d0; margin-top:46px; padding-top:20px; gap:20px; }
.mc-index p { font-size:11px; letter-spacing:.07em; color:#63746d; }
.mc-index nav { display:flex; gap:23px; flex-wrap:wrap; }
.mc-index a { text-decoration:none; color:#4c625d; font-size:12px; padding:8px 0; }
.mc-index a:hover { color:#233455; text-decoration:underline; text-underline-offset:5px; }
.mc-scene { min-width:0; position:relative; background:#e4ece8; border:1px solid #d4dfd9; border-radius:18px; color:#233455; overflow:hidden; transition:background .3s; }
.mc-scene[data-light=night] { background:#19263c; color:#e1eeea; border-color:#263954; }
.mc-scene-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:21px 23px 0; font-size:11px; letter-spacing:.12em; font-weight:700; }
.mc-scene-heading span { font-size:10px; letter-spacing:.05em; font-weight:500; opacity:.7; }
.mc-scene-surface { position:relative; height:360px; }
.mc-scene canvas { display:block; width:100%; height:100%; touch-action:pan-y; cursor:grab; position:relative; z-index:1; }
.mc-scene canvas:active { cursor:grabbing; }
.mc-scene-fallback { position:absolute; inset:0; display:grid; place-content:center; gap:16px; text-align:center; }
.mc-scene-fallback strong { font-size:24px; }
.mc-scene-fallback p { font-size:14px; }
.mc-scene.is-rendered .mc-scene-fallback { display:none; }
.mc-scene-tools { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:0 22px; padding:14px 0; border-top:1px solid #819f9340; }
.mc-light-switch { display:flex; gap:5px; }
.mc-light-switch button,.mc-reset { font:inherit; font-size:11px; cursor:pointer; border:1px solid transparent; background:transparent; color:inherit; padding:8px 10px; min-height:36px; border-radius:4px; }
.mc-light-switch button[aria-pressed=true] { background:#fff; color:#233455; border-color:#c6d4cd; }
.mc-reset { text-decoration:underline; text-underline-offset:4px; }
.mc-angle { display:flex; align-items:center; gap:8px; font-size:10px; }
.mc-angle input { width:75px; accent-color:#568c7d; cursor:pointer; }
.mc-scene-bottom { display:flex; justify-content:space-between; gap:12px; padding:0 23px 18px; font-size:10px; color:inherit; opacity:.75; }
.mc-section { padding:82px 0; }
.mc-section-head { display:flex; align-items:end; justify-content:space-between; gap:35px; margin-bottom:32px; }
.mc-section-head .mc-kicker { margin-bottom:15px; color:#557d76; }
.mc-section-head>p { max-width:380px; font-size:14px; color:#677481; line-height:1.85; }
.mc-feature { display:grid; grid-template-columns:1fr 1.17fr; border-radius:15px; overflow:hidden; background:#edf3ee; border:1px solid #d6e2d8; }
.mc-feature-copy { padding:42px; }
.mc-feature-copy .mc-kicker { color:#477967; margin-bottom:23px; }
.mc-feature-copy h2 { font-size:43px; letter-spacing:-.05em; }
.mc-feature-copy h3 { font-size:25px; line-height:1.45; margin:17px 0; letter-spacing:-.035em; }
.mc-feature-copy>p { font-size:14px; color:#546d61; line-height:1.85; }
.mc-feature-copy .mc-actions { margin-top:27px; }
.mc-home main .mc-feature-meta { font-size:11px; margin-top:19px; }
.mc-feature-art { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:35px; position:relative; min-width:0; background:#d7e7df; }
.mc-feature-art .mc-speech { align-self:flex-start; background:#fff; padding:9px 15px; border-radius:12px 12px 12px 2px; font-size:13px; color:#294b43; z-index:2; margin:0 0 -8px 10px; box-shadow:0 6px 17px #2039300b; }
.mc-feature-art .mc-speech--en { align-self:flex-end; margin:-9px 5px 0 0; background:#233455; color:white; border-radius:12px 12px 2px 12px; }
.mc-feature-art img { width:100%; height:auto; border:7px solid #213443; border-radius:11px; transform:perspective(1000px) rotateY(-9deg) rotateX(6deg); box-shadow:15px 22px 30px -18px #23345570; }
.mc-feature-art a { display:block; width:100%; }
.mc-feature-art small { font-size:10px; color:#4e6c60; margin-top:23px; }
.mc-gallery { padding-top:0; }
.mc-apps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.mc-app { display:flex; flex-direction:column; background:#fff; border:1px solid var(--mc-line); border-radius:11px; overflow:hidden; min-width:0; }
.mc-app-visual { min-height:170px; position:relative; overflow:hidden; padding:27px; display:flex; flex-direction:column; justify-content:center; gap:7px; background:#efeae1; }
.mc-app-visual--live { background:#e1edf4; }
.mc-app-visual--say { background:#e2eee7; }
.mc-app-visual>small { font-size:10px; color:#5d6a71; letter-spacing:.1em; }
.mc-app-word { font-size:34px; font-weight:750; letter-spacing:-.06em; }
.mc-app-line { position:absolute; width:130px; height:130px; border:1px solid #8c9c9a70; border-radius:50%; right:-35px; bottom:-33px; }
.mc-app-line::before { content:''; position:absolute; inset:15px; border:1px solid #8c9c9a70; border-radius:50%; }
.mc-app-info { padding:25px; display:flex; flex-direction:column; flex:1; }
.mc-app-info h3 { font-size:20px; margin-bottom:11px; letter-spacing:-.025em; }
.mc-app-info p { font-size:14px; color:#65727c; line-height:1.8; margin-bottom:16px!important; }
.mc-app-info .mc-link { margin-top:auto; }
.mc-app-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; border-top:1px solid var(--mc-line); margin-top:25px; padding-top:20px; }
.mc-app-footer p { font-size:13px; color:#65727c; line-height:1.8; }
.mc-playground { background:#1c2c43; color:#f3f7f6; }
.mc-playground .mc-kicker { color:#a8ccc2; }
.mc-playground .mc-section-head>p { color:#c1d0d7; }
.mc-experiments { display:grid; grid-template-columns:1fr 1fr 1fr; gap:22px; }
.mc-asset-feature { display:grid; grid-template-columns:1.17fr 1fr; gap:0; border:1px solid #ffffff26; border-radius:12px; overflow:hidden; background:#29394b; margin-bottom:30px; }
.mc-asset-feature-image { display:block; position:relative; min-width:0; background:#172637; }
.mc-asset-feature-image img { display:block; width:100%; height:100%; object-fit:cover; }
.mc-asset-feature-image>span { position:absolute; left:22px; bottom:22px; display:grid; place-items:center; width:48px; height:48px; border:1px solid #ffffff80; border-radius:50%; background:#13203877; color:#fff; font-size:24px; }
.mc-asset-feature-copy { padding:34px; display:flex; flex-direction:column; align-items:start; }
.mc-asset-feature-copy .mc-kicker { color:#d7c8a9; margin-bottom:20px; }
.mc-asset-feature-copy h3 { font-size:clamp(26px,3vw,38px); line-height:1.4; letter-spacing:-.05em; margin:0 0 18px; }
.mc-asset-feature-copy>p:not(.mc-kicker) { font-size:14px; line-height:1.85; color:#c6d3d6; }
.mc-asset-tags { display:flex; flex-wrap:wrap; gap:6px; margin:20px 0 10px; }
.mc-asset-tags span { border:1px solid #ffffff30; border-radius:20px; padding:5px 9px; font-size:10px; color:#d2dbd8; }
.mc-asset-feature-copy .mc-link { margin-top:auto; }
@media(max-width:750px) { .mc-asset-feature { grid-template-columns:1fr; } .mc-asset-feature-copy { padding:26px; } .mc-asset-feature-image img { height:auto; } }
.mc-experiment { min-width:0; border:1px solid #ffffff26; background:#24374f; border-radius:10px; overflow:hidden; }
.mc-experiment-art { height:180px; position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; background:#32485d; }
.mc-cube { width:95px; height:95px; transform-style:preserve-3d; transform:rotateX(-24deg) rotateY(35deg); }
.mc-cube span { position:absolute; inset:0; border:1px solid #dfefe880; }
.mc-cube span:nth-child(1) { transform:translateZ(47px); background:#bad4cba8; }
.mc-cube span:nth-child(2) { transform:rotateY(-90deg) translateZ(47px); background:#88ac9fa8; }
.mc-cube span:nth-child(3) { transform:rotateX(90deg) translateZ(47px); background:#dcebe4b8; }
.mc-experiment-art--dialogue { background:#d7e8e1; color:#233455; flex-direction:column; gap:10px; }
.mc-experiment-art--dialogue span { padding:10px 20px; border-radius:10px; background:white; transform:rotate(-4deg); font-size:16px; }
.mc-experiment-art--dialogue span+span { background:#233455; color:#fff; transform:translateX(28px) rotate(4deg); }
.mc-experiment-art img { width:100%; height:100%; object-fit:cover; }
.mc-experiment-body { padding:23px; }
.mc-experiment-body>span { font-size:10px; letter-spacing:.1em; color:#afccc5; }
.mc-experiment-body h3 { font-size:21px; margin:11px 0; }
.mc-experiment-body p { color:#c8d5dc; font-size:13px; line-height:1.8; min-height:48px; }
.mc-experiment-body a,.mc-experiment-body button { margin-top:17px; color:#fff; }
.mc-experiment-body button { background:transparent; border:0; padding:0; cursor:pointer; font-family:inherit; }
.mc-playground-note { margin-top:26px!important; font-size:12px; color:#b3c8d0; line-height:1.8; }
.mc-learn { background:#f4f5f0; }
.mc-learn-grid { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:80px; }
.mc-learn-copy .mc-kicker { color:#617665; margin-bottom:19px; }
.mc-learn-copy>p { font-size:15px; line-height:1.85; color:#617065; margin:24px 0!important; }
.mc-paths { display:grid; gap:0; border-top:1px solid #c9d4cd; }
.mc-path { display:grid; grid-template-columns:28px 1fr 22px; gap:12px; align-items:start; padding:25px 0; border-bottom:1px solid #c9d4cd; text-decoration:none; color:#233455; }
.mc-path>span { font-size:11px; padding-top:4px; color:#6b8373; }
.mc-path strong { font-size:18px; }
.mc-path p { font-size:13px; margin-top:7px!important; line-height:1.8; color:#607268; }
.mc-path:hover strong { text-decoration:underline; text-underline-offset:5px; }
.mc-about-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:80px; }
.mc-about-grid .mc-kicker { margin-bottom:19px; color:#557d76; }
.mc-about-copy>p { margin-top:22px!important; color:#62717c; line-height:1.9; font-size:15px; }
.mc-about-copy .mc-link { margin-top:18px; }
.mc-connection { padding:24px 0; border-top:1px solid #cddbd4; }
.mc-connection:last-child { border-bottom:1px solid #cddbd4; }
.mc-connection small { color:#657d74; font-size:11px; }
.mc-connection h3 { font-size:23px; margin:10px 0; }
.mc-connection p { color:#65747b; font-size:13px; line-height:1.8; }
.mc-connection .mc-link { margin-top:12px; font-size:13px; }
.mc-closing { background:#d4e4e6; padding:49px 0; }
.mc-closing .mc-wrap { display:flex; gap:35px; justify-content:space-between; align-items:center; }
.mc-closing h2 { font-size:30px; letter-spacing:-.04em; }
.mc-closing p { color:#526b76; font-size:14px; margin-top:12px!important; }
.mc-video-dialog { width:min(960px,calc(100% - 32px)); padding:0; border:1px solid #5b6b7d; border-radius:12px; background:#15253c; color:white; max-height:calc(100dvh - 40px); }
.mc-video-dialog::backdrop { background:#0a152bdd; }
.mc-video-head { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:17px 22px; }
.mc-video-head h2 { font-size:18px; }
.mc-video-close { color:#fff; background:#ffffff16; border:1px solid #ffffff30; border-radius:6px; font:inherit; font-size:13px; padding:10px 15px; cursor:pointer; }
.mc-video-dialog video { display:block; width:100%; max-height:65dvh; background:#000; }
.mc-video-dialog>p { margin:0; padding:16px 22px; font-size:12px; color:#c5d6de; line-height:1.7; }
@media(max-width:1000px) {
 .mc-hero-grid { gap:25px; }
 .mc-scene-surface { height:330px; }
 .mc-scene-tools { gap:8px; margin-inline:14px; }
 .mc-scene-heading { padding-inline:16px; }
 .mc-scene-heading span { display:none; }
 .mc-light-switch button,.mc-reset { padding-inline:6px; }
 .mc-angle input { width:55px; }
 .mc-feature-copy { padding:30px; }
 .mc-feature-art { padding:25px; }
 .mc-learn-grid,.mc-about-grid { gap:42px; }
 .mc-experiments,.mc-apps { gap:16px; }
 .mc-experiment-body,.mc-app-info { padding:21px; }
}
@media(max-width:768px) {
 .mc-home main { padding-top:65px; }
 .mc-home .mc-wrap { width:calc(100% - 40px); }
 .mc-hero { padding-top:38px; }
 .mc-hero-grid,.mc-feature,.mc-learn-grid,.mc-about-grid { grid-template-columns:1fr; gap:32px; }
 .mc-home main .mc-hero h1 { font-size:clamp(40px,10.5vw,66px); margin-block:23px; }
 .mc-home main .mc-hero-copy { font-size:15px; }
 .mc-scene-surface { height:320px; }
 .mc-scene-tools { margin-inline:15px; }
 .mc-index { margin-top:30px; display:block; }
 .mc-index>p { margin-bottom:6px!important; }
 .mc-index nav { gap:19px; }
 .mc-section { padding:54px 0; }
 .mc-section-head { display:block; }
 .mc-section-head>p,.mc-section-head>.mc-link { margin-top:19px; }
 .mc-feature { gap:0; }
 .mc-feature-copy { padding:29px; }
 .mc-feature-copy h2 { font-size:36px; }
 .mc-feature-copy h3 { font-size:23px; }
 .mc-feature-art { min-height:280px; }
 .mc-gallery { padding-top:0; }
 .mc-apps,.mc-experiments { grid-template-columns:1fr; gap:22px; }
 .mc-app-visual { min-height:140px; }
 .mc-app-info { padding:25px; }
 .mc-app-footer { display:block; }
 .mc-app-footer .mc-link { margin-top:10px; }
 .mc-experiment-art { height:200px; }
 .mc-experiment-body { padding:25px; }
 .mc-experiment-body p { min-height:0; }
 .mc-closing .mc-wrap { display:block; }
 .mc-closing h2 { font-size:27px; }
 .mc-closing .mc-button { margin-top:23px; }
 .mc-home main .mc-title { font-size:32px; }
}
@media(max-width:360px) {
 .mc-scene-surface { height:270px; }
 .mc-scene-heading { padding:18px 14px 0; font-size:10px; }
 .mc-scene-tools { flex-wrap:wrap; }
 .mc-scene-bottom { padding-inline:14px; font-size:9px; }
 .mc-feature-copy { padding:23px; }
 .mc-feature-art { min-height:225px; padding:20px; }
}
@media(prefers-reduced-motion:reduce) {
 html:has(.mc-home) { scroll-behavior:auto; }
 .mc-scene { transition:none; }
 .mc-feature-art img { transform:none; }
}