@charset "UTF-8";
.channel-gallery{scrollbar-width:none!important}.channel-gallery::-webkit-scrollbar{display:none}
.universe .orbit-node{animation:none}.universe .orbit-tile{animation:node-float 7s ease-in-out infinite;animation-delay:var(--float-delay)}.universe .orbit-label{background:#ffffffeb;border-radius:12px;padding:2px 5px}.motion-paused .universe .orbit-tile{animation-play-state:paused}
.case-kudo .case-photo>img:first-child{object-position:50% 0!important}.case-yoppi .yoppi-photo>img:first-child{object-position:50% 28%!important}.case-links{display:flex;gap:15px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
@font-face{font-family:"Noto Sans JP";src:url("assets/fonts/noto-sans-jp.woff2") format("woff2");font-weight:100 900;font-display:swap}
:root{--paper:#fff;--navy:#101c33;--blue:#2864ec;--muted:#6e6e73;--body-ink:#424247;--rule:#e5e7ed;--soft:#f5f6f8;--sans:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;--display:"Noto Sans JP",system-ui,sans-serif;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--navy);-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure,dl,dd{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}img,svg{display:block;max-width:100%}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #2864ec;outline-offset:5px}::selection{color:var(--navy);background:#dbe7ff}.section-shell{width:min(1200px,88%);margin-inline:auto}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-70px;left:20px;background:var(--navy);color:white;padding:14px 20px;z-index:100}.skip-link:focus{top:14px}.mobile-break{display:none}

/* Quiet, translucent navigation. */
.site-header{height:76px;position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding-inline:6%;background:#ffffffd9;backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);border-bottom:1px solid #e8ebf180;transition:box-shadow .3s}.site-header.is-scrolled{box-shadow:0 5px 24px #0b1c3c05}.wordmark{display:inline-flex;align-items:center;gap:10px;}.wordmark img{width:25px;height:25px}.site-nav{display:flex;gap:31px;align-items:center;}.site-nav>a{padding:10px 0;color:#505767;transition:color .2s}.site-nav>a:hover,.site-nav>a[aria-current]{color:var(--blue)}.site-nav .nav-contact{background:var(--blue);border-radius:30px;color:white;padding:9px 18px;display:flex;gap:15px;align-items:center}.menu-toggle{display:none}

/* Hero: type and a constellation of the platforms that connect the work. */
.hero{position:relative;display:grid;grid-template-columns:1.12fr 1fr;column-gap:25px;align-items:center;min-height:780px;padding-top:58px}.hero-copy{position:relative;z-index:2;padding:35px 0 60px;min-width:0}.eyebrow{display:flex;align-items:center;gap:8px;color:#69717e;margin-bottom:31px}.status-dot{width:6px;height:6px;border-radius:50%;background:var(--blue);flex-shrink:0;box-shadow:0 0 0 4px #2864ec0b}.hero h1{white-space:nowrap}.hero h1>span{display:block;animation:hero-enter 1s var(--ease) both}.hero h1>span:nth-child(2){animation-delay:.1s}.hero h1>span:nth-child(3){animation-delay:.2s}.hero h1 em{font-style:normal;color:var(--blue);background:linear-gradient(105deg,#166af0,#5879ff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero-description{color:#68707e;margin-top:28px}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:31px}.button-primary{display:inline-flex;align-items:center;gap:28px;padding:14px 23px;background:var(--blue);border-radius:30px;color:white;box-shadow:0 5px 15px #2864ec1a;transition:transform .3s,background .3s}.button-primary:hover{transform:translateY(-2px);background:#1657df}.text-link{display:inline-flex;gap:15px;align-items:center;color:var(--blue);transition:gap .25s,color .25s}.text-link:hover{gap:20px;color:#174ec1}
.universe{position:relative;aspect-ratio:1;min-width:0;color:var(--blue);margin:-13px -18px 50px 0;transform:translate3d(0,calc(var(--hero-scroll,0)*25px),0);will-change:transform;isolation:isolate}.universe::before{content:"";position:absolute;inset:10%;border-radius:50%;z-index:-1;background:radial-gradient(ellipse at 58% 40%,#fff 25%,#f1f5ff 57%,#e7efff55 75%,transparent 80%);box-shadow:inset 0 0 45px #2864ec04}.universe-lines{width:100%;height:100%;position:absolute;inset:0;animation:orbit-breathe 18s ease-in-out infinite}.universe-lines path{opacity:.25}.universe-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;color:var(--navy);white-space:nowrap}.universe-center>span:last-of-type{color:var(--blue)}.universe-center>svg{fill:var(--blue);width:24px;height:24px;position:absolute;top:-42px;left:calc(50% - 12px)}.universe-coord{position:absolute;color:#8a94a7}.coord-top{top:1%;left:34%}.coord-bottom{bottom:0;left:50%;transform:translateX(-50%);white-space:nowrap}.orbit-node{--float-delay:0s;position:absolute;z-index:3;display:flex;flex-direction:column;align-items:center;gap:8px;animation:node-float 7s ease-in-out infinite;animation-delay:var(--float-delay)}.orbit-tile{display:flex;align-items:center;justify-content:center;width:66px;height:66px;border:1px solid #e8ecf2;border-radius:20px;background:#fffffff5;box-shadow:0 8px 25px #1023480a,0 2px 4px #10234803;transition:transform .4s var(--ease),box-shadow .4s}.orbit-node:hover .orbit-tile{transform:translateY(-5px) scale(1.07);box-shadow:0 15px 30px #10234815}.orbit-label{color:#515e73;}.orbit-space{left:8%;top:13%;--float-delay:-1s}.orbit-space .orbit-tile{overflow:hidden}.orbit-space img{width:66px;height:66px}.orbit-auto{right:6%;bottom:8%;--float-delay:-4s}.orbit-auto img{width:56px;height:56px;object-fit:contain;border-radius:15px}.orbit-youtube{right:14%;top:7%;--float-delay:-2.5s}.orbit-instagram{right:-1%;top:41%;--float-delay:-5s}.orbit-x{left:20%;bottom:5%;--float-delay:-3s}.orbit-tiktok{left:-4%;top:48%;--float-delay:-.5s}.tiny-star{position:absolute;opacity:.65}.star-one{left:6%;bottom:22%}.star-two{right:20%;top:32%}.hero-footer{grid-column:1/-1;border-top:1px solid var(--rule);align-self:end;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:82px}.hero-footer>p{display:flex;align-items:baseline;gap:14px;color:var(--muted)}.hero-footer strong{color:var(--navy);}.hero-role{margin-left:14px}.scroll-cue{color:var(--muted);display:flex;align-items:center;gap:22px}.scroll-cue span{color:var(--blue)}.motion-toggle{display:inline-flex;align-items:center;gap:5px;color:var(--muted);padding:8px 0}.motion-toggle:hover{color:var(--blue)}

/* Results: evidence first, then the people and the work. */
.works{padding-top:112px}.section-index{color:var(--muted)}.section-heading{margin-bottom:48px}.section-heading>div{display:flex;justify-content:space-between;align-items:flex-end;gap:45px;margin-top:24px}.section-heading>div>p{color:var(--muted);margin-bottom:4px;max-width:335px}.achievement-metrics{display:grid;grid-template-columns:1.15fr 1.15fr 1fr 1fr;gap:25px;padding:34px 0 36px;border-block:1px solid var(--rule);margin-bottom:54px;scroll-margin-top:120px}.achievement-metrics>div+div{padding-left:25px;border-left:1px solid var(--rule)}.achievement-metrics dt{color:var(--muted);min-height:24px;}.achievement-metrics dd{margin-top:10px;white-space:nowrap}.metric-from{color:var(--blue);vertical-align:middle;}.metric-unit{margin-left:5px;}.achievement-metrics .metric-caption{color:var(--muted);margin-top:14px;white-space:normal}.case-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;scroll-margin-top:110px}.case-study{border-radius:28px;background:var(--soft);overflow:hidden;display:flex;flex-direction:column;min-width:0;transition:box-shadow .45s var(--ease),translate .45s var(--ease)}.case-study:hover{box-shadow:0 18px 45px #0b1b340a;translate:0 -4px}.case-photo{position:relative;aspect-ratio:1.9;background:#ececee;overflow:hidden}.case-photo>img:first-child{width:100%;height:100%;object-fit:cover;object-position:50% 24%;transition:transform 1s var(--ease)}.case-study:hover .case-photo>img:first-child{transform:scale(1.035)}.photo-label{position:absolute;top:20px;left:23px;padding:8px 11px;display:flex;align-items:center;gap:8px;border-radius:20px;background:#ffffffdf;backdrop-filter:blur(15px);color:#263047}.photo-label>img{width:12px;height:12px}.yoppi-photo{background:#eadce4}.yoppi-photo>img:first-child{object-position:45% 50%}.case-photo .profile-avatar{position:absolute;bottom:18px;left:28px;width:93px;height:93px;object-fit:cover;border-radius:50%;border:4px solid #fff;box-shadow:0 3px 20px #0002}.case-content{padding:31px 34px 28px;flex:1;display:flex;flex-direction:column}.case-label{color:var(--muted)}.case-study h3{margin-top:12px}.case-study h3>span{margin-left:8px}.case-subtitle{color:var(--muted);margin-top:8px}.case-result{display:flex;align-items:baseline;gap:15px;min-height:90px;margin:25px 0 19px;align-content:center;flex-wrap:wrap}.case-result strong{color:var(--blue)}.case-description{color:#646d7a;}.case-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;border-top:1px solid #dfe3e9;padding-top:19px;margin-top:auto;position:relative;top:0}.case-description+.case-bottom{margin-top:27px}.case-scope{color:var(--muted)}.case-bottom .text-link{gap:9px;white-space:nowrap}.case-platforms{display:flex;align-items:center;gap:26px;min-height:90px;margin:25px 0 19px}.case-platforms>span{display:flex;align-items:center;gap:12px;}.case-platforms>i{font-style:normal;color:#8d97a8}.case-platforms>span>img{width:30px;height:30px}.case-platforms>span:last-child>img{width:44px;height:32px}

/* Real channel images, with native scrolling and explicit controls. */
.youtube-showcase{padding:83px 0 50px;scroll-margin-top:30px}.showcase-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-bottom:28px}.showcase-heading .section-index{display:flex;align-items:center;gap:9px;}.showcase-heading .section-index>img{width:22px;height:22px}.showcase-heading h3{margin-top:16px}.showcase-heading p:last-child{color:var(--muted);margin-top:10px}.gallery-controls{display:flex;gap:10px;padding-bottom:5px}.gallery-controls>button{display:flex;align-items:center;justify-content:center;width:39px;height:39px;border-radius:50%;background:#eef0f4;transition:background .2s}.gallery-controls>button:hover{background:#e2e7f0}.gallery-controls>button:disabled{opacity:.3;cursor:default}.channel-gallery{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 54px)/4);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#c8d1e0 transparent;padding:3px 1px 22px;overscroll-behavior-x:contain}.channel-card{scroll-snap-align:start;min-width:0;background:#f5f6f8;border-radius:20px;overflow:hidden}.channel-image{aspect-ratio:1.12;overflow:hidden;background:#e6eaf0}.channel-image>img{width:100%;height:100%;object-fit:cover;object-position:center 28%;transition:transform .8s var(--ease)}.channel-card:hover .channel-image>img{transform:scale(1.055)}.channel-card:nth-child(2) .channel-image>img{object-position:center 19%}.channel-card:nth-child(5) .channel-image>img,.channel-card:nth-child(6) .channel-image>img{object-position:center}.channel-card:nth-child(7) .channel-image>img{object-fit:contain;background:#fff}.channel-card figcaption{padding:21px 19px 24px;min-height:112px}.channel-card figcaption>span{display:block;color:var(--muted);margin-bottom:8px}.gallery-note{color:var(--muted);margin-top:9px}.work-detail{border-top:1px solid var(--rule)}.work-detail:last-of-type{border-bottom:1px solid var(--rule)}.work-detail>summary{list-style:none;display:flex;align-items:center;gap:26px;padding:26px 0;cursor:pointer}.work-detail>summary::-webkit-details-marker{display:none}.work-category{width:20%;flex-shrink:0;color:var(--blue)}.work-summary{flex:1;min-width:0}.work-summary strong{display:block;}.work-summary small{display:block;color:var(--muted);margin-top:5px}.service-toggle{position:relative;width:16px;height:16px;flex-shrink:0}.service-toggle::before,.service-toggle::after{content:"";position:absolute;left:0;top:7px;width:16px;height:1.5px;background:currentColor;transition:transform .3s}.service-toggle::after{transform:rotate(90deg)}details[open] .service-toggle::after{transform:rotate(0)}.work-detail-body{margin:0 5% 30px calc(20% + 26px);max-width:750px;color:var(--muted)}.work-credit{margin-top:24px}.work-credit>span{display:block;color:var(--blue);margin-bottom:6px}.work-credit>p{color:var(--navy)}.work-credit>small{display:block;margin-top:7px}.work-additional{margin-top:22px}.work-note{color:var(--muted);margin-top:21px;max-width:820px}

/* Product stories. */
.products{padding-top:116px}.product{display:grid;grid-template-columns:1.15fr 1fr;gap:7%;align-items:center;margin-bottom:80px;scroll-margin-top:120px}.product-visual{position:relative;min-width:0;aspect-ratio:1.12;border-radius:28px;overflow:hidden}.product-copy{padding:17px 0}.product-number{display:flex;justify-content:space-between;gap:16px;color:#929baa;margin-bottom:28px}.product-name{display:flex;gap:13px;align-items:center}.product-name>img{width:44px;height:44px;border-radius:12px}.product-tagline{margin-top:22px}.product-description{color:var(--muted);margin-top:23px}.product-role{color:var(--muted);margin:24px 0 17px}.space-visual{background:#080d29;color:white;isolation:isolate}
.space-demo.product-visual{aspect-ratio:auto;padding:28px;background:radial-gradient(ellipse at 85% 65%,#192144,transparent 65%),#080d20}
.space-demo-tabs{display:flex;gap:4px;padding:4px;background:#ffffff0c;border-radius:28px}
.space-demo-tabs>button{flex:1;min-height:44px;padding:8px 4px;border-radius:24px;color:#bac5df;font-size:14px;line-height:1.5;font-weight:500;white-space:nowrap;transition:color .2s,background .2s}
.space-demo-tabs>button[aria-selected="true"]{background:#e7ecff;color:#172447}
.space-demo-tabs>button:hover{background:#ffffff1a;color:#fff}
.space-demo-tabs>button[aria-selected="true"]:hover{background:#fff;color:#172447}
.space-demo-panel{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:24px;margin-top:28px;min-width:0}
.space-demo-panel[hidden]{display:none}
.space-demo-copy{min-width:0}
.space-demo-step{font-size:12px;line-height:1.5;letter-spacing:.06em;color:#9aabd4}
.space-demo-title{margin-top:14px;font-size:24px;font-weight:600;line-height:1.55;color:#fff;font-feature-settings:"palt" 1}
.space-demo-description{margin-top:16px;font-size:14px;line-height:1.85;color:#c1cbe2}
.space-demo-screen{display:block;width:100%;max-width:214px;justify-self:end;aspect-ratio:0.518;overflow:hidden;border:1px solid #66739580;border-radius:20px;background:#050812;box-shadow:0 20px 36px #0005;transition:transform .3s}
.space-demo-screen>img{width:100%;height:100%;object-fit:contain}
.space-demo-screen:hover{transform:translateY(-3px)}
.space-demo-note{margin-top:24px;color:#8f9ebd;font-size:12px;line-height:1.6;text-align:center}
.space-demo-note>span{margin-inline:5px}
@media (min-width:801px) and (max-width:1100px){.space-demo.product-visual{padding:20px}.space-demo-panel{gap:16px}.space-demo-title{font-size:20px}.space-demo-description{font-size:13px}}
@media (max-width:800px){.space-demo.product-visual{padding:24px 20px}.space-demo-panel{gap:24px;grid-template-columns:1fr;margin-top:24px}.space-demo-copy{text-align:center}.space-demo-title{font-size:22px;line-height:1.5;margin-top:10px}.space-demo-description{font-size:14px;line-height:1.8;max-width:28em;margin:12px auto 0}.space-demo-step{font-size:11px}.space-demo-screen{max-width:180px;justify-self:center;border-radius:14px}.space-demo-note{margin-top:20px;font-size:11px}.space-demo-tabs>button{font-size:13px}}
@media (max-width:359px){.space-demo.product-visual{padding:20px 16px}.space-demo-title{font-size:21px}.space-demo-note{font-size:10px}.space-demo-tabs>button{font-size:12px}}
.visual-caption{position:absolute;bottom:25px;left:30px;z-index:3;color:#a2b3ce}.auto-visual{background:#f0f5ff}.auto-visual-top{position:absolute;top:30px;left:30px;right:30px;display:flex;justify-content:space-between;gap:20px;align-items:center}.auto-visual-top .mono{width:115px;color:#8a9bb5}.auto-path{position:absolute;left:31px;top:92px;display:flex;align-items:center;gap:13px;color:#8190a5;}.auto-path>i{width:22px;height:1px;background:#adc4e2}.auto-circle{position:absolute;width:70%;aspect-ratio:1;border:1px solid #3264f522;border-radius:50%;right:-13%;top:17%}.auto-circle::after{content:"";position:absolute;inset:9%;border:1px solid #3264f511;border-radius:50%}.auto-mascot{position:absolute;bottom:7%;right:-1%;width:63%;height:auto;mix-blend-mode:multiply;transform:rotate(-7deg);transition:transform 1s var(--ease)}.product-auto:hover .auto-mascot{transform:rotate(-3deg) translateY(-8px)}.auto-visual-word{position:absolute;left:30px;top:40%;}.auto-visual-word em{font-style:normal;color:var(--blue)}.auto-visual .visual-caption{color:#7a8ca6}

/* Approach, profile and contact. */
.approach{display:grid;grid-template-columns:1fr 1.1fr;gap:10%;padding-top:45px;padding-bottom:125px}.approach-intro h2{margin-top:23px}.approach-intro>p:last-child{color:var(--muted);margin-top:25px}.service{border-top:1px solid var(--rule);padding:26px 0}.service:last-child{border-bottom:1px solid var(--rule)}.service summary{display:flex;align-items:center;gap:20px;cursor:pointer;list-style:none}.service summary::-webkit-details-marker{display:none}.service-index{color:var(--blue);align-self:flex-start;margin-top:5px}.service summary>span:nth-child(2){flex:1}.service small{color:var(--muted);display:block;margin-bottom:8px}.service-body{padding:20px 10px 3px 35px;color:var(--muted)}.service-body>span{display:block;color:var(--blue);margin-top:18px}.about{background:#f5f7fb;overflow:hidden}.about-inner{display:grid;grid-template-columns:1fr 1fr;gap:11%;align-items:center;padding-top:100px;padding-bottom:105px}.about-signature{position:relative;min-height:370px;align-self:stretch;display:flex;flex-direction:column;justify-content:center}.about-signature .section-index{position:absolute;top:0}.script-word{position:relative;z-index:1;margin-left:4%;color:#15315e}.signature-orbit{position:absolute;width:108%;height:37%;border:1px solid #3264f52b;border-radius:50%;transform:rotate(-31deg);top:37%;left:-9%}.about-star{position:absolute;right:9%;top:20%;color:var(--blue)}.about-role{color:var(--muted)}.about-copy h2{margin-top:13px}.about-copy h2>span{color:var(--muted);margin-left:14px}.about-copy .about-lead{margin:25px 0 22px}.about-copy>p:not(.about-lead,.about-role){color:var(--muted);margin-bottom:18px}.about-copy .text-link{margin-top:5px}.contact{padding-top:115px;padding-bottom:100px}.contact-top{display:flex;justify-content:space-between;gap:30px}.contact-note{color:var(--muted)}.contact h2{position:relative;display:inline-block;margin-top:30px}.contact-star{position:absolute;color:var(--blue);right:-75px;bottom:8px}.contact-bottom{display:grid;grid-template-columns:1fr 1fr;gap:11%;margin-top:58px}.contact-selector>p{color:var(--muted);margin-bottom:15px}.topic-options{display:flex;gap:7px;flex-wrap:wrap}.topic{padding:10px 14px;border:1px solid #dce1e9;border-radius:25px;transition:background .2s,color .2s,border-color .2s}.topic.is-active{background:var(--navy);color:white;border-color:var(--navy)}.topic:hover{border-color:var(--blue)}.contact-mail{display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #bec9dc;padding:21px 0 18px;margin-top:19px;max-width:415px;transition:color .2s}.contact-mail:hover{color:var(--blue)}.contact-mail>span{color:var(--blue)}.contact-direct{padding-top:6px}.contact-direct>span{display:block;color:var(--muted);margin-bottom:14px}.contact-direct>a:first-of-type{overflow-wrap:anywhere}.copy-email{display:block;padding:12px 0;color:var(--muted)}.copy-email>span{margin-left:14px}.copy-status{min-height:16px;color:var(--blue)}.social-link{display:inline-flex;gap:25px;align-items:center;margin-top:14px}.site-footer{display:flex;gap:25px;align-items:center;justify-content:space-between;border-top:1px solid var(--rule);padding-block:28px}.site-footer .wordmark img{width:21px;height:21px}.site-footer>p{color:var(--muted);margin-left:auto}.site-footer>small{color:var(--muted)}.back-top{color:var(--blue);padding:8px}

/* Motion adds depth without taking over scrolling. */
.reveal-ready{opacity:0;transform:translate3d(0,28px,0);transition:opacity 1s var(--ease),transform 1s var(--ease)}.reveal-ready.is-visible{opacity:1;transform:none}.case-grid>[data-reveal]:nth-child(2){transition-delay:.09s}.motion-paused .orbit-node,.motion-paused .universe-lines{animation-play-state:paused}body[data-motion="off"] *,body[data-motion="off"] *::before,body[data-motion="off"] *::after{animation:none!important;transition:none!important}body[data-motion="off"] .universe{transform:none}body[data-motion="off"] .reveal-ready{opacity:1;transform:none}html:has(body[data-motion="off"]){scroll-behavior:auto}@keyframes hero-enter{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes node-float{0%,100%{translate:0 0}50%{translate:0 -8px}}@keyframes orbit-breathe{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}

/* Shared type scale. The same role keeps the same size across every section. */
:root {
  --type-display: 64px;
  --type-section: 40px;
  --type-title: 28px;
  --type-subtitle: 20px;
  --type-body: 18px;
  --type-small: 14px;
  --type-label: 13px;
  --type-data: 56px;
  --type-orbit: 44px;
}
body { font-family: var(--sans); font-size: var(--type-body); font-weight: 500; line-height: 1.65; letter-spacing: 0; }
button, a, summary { font-family: inherit; }
h1, h2, h3 { font-family: var(--display); font-weight: 700; }
strong { font-weight: 600; }
.hero h1 { font-size: var(--type-display); line-height: 1.28; letter-spacing: -.01em; }
.section-heading h2, .approach h2, .about-copy h2, .contact h2 { font-size: var(--type-section); line-height: 1.4; letter-spacing: 0; }
.case-study h3, .showcase-heading h3, .product-name h3, .product-tagline, .about-copy .about-lead { font-size: var(--type-title); line-height: 1.5; letter-spacing: 0; font-weight: 600; }
.product-tagline, .about-copy .about-lead { font-weight: 500; }
.service strong, .work-summary strong, .channel-card figcaption>strong, .contact-mail, .contact-direct>a:first-of-type { font-size: var(--type-subtitle); line-height: 1.6; font-weight: 600; letter-spacing: 0; }
.hero-description, .section-heading>div>p, .case-description, .showcase-heading p:last-child, .product-description, .approach-intro>p:last-child, .service-body, .work-detail-body, .about-copy>p:not(.about-lead,.about-role), .contact-note { font-size: var(--type-body); line-height: 1.65; font-weight: 500; color: var(--body-ink); }
.case-subtitle, .case-result>span, .case-study h3>span, .case-platforms>span, .about-copy h2>span, .hero-footer strong, .social-link { font-size: var(--type-body); line-height: 1.6; font-weight: 500; letter-spacing: 0; }
.site-nav, .menu-toggle, .button-primary, .text-link, .topic { font-size: var(--type-small); line-height: 1.6; font-weight: 500; letter-spacing: 0; }
.hero-footer>p, .hero-role, .case-label, .case-scope, .product-role, .work-summary small, .service-body>span, .work-credit>span, .work-additional, .about-role, .contact-selector>p, .copy-email { font-size: var(--type-small); line-height: 1.7; font-weight: 400; letter-spacing: 0; }
.eyebrow, .section-index, .photo-label, .orbit-label, .motion-toggle, .scroll-cue, .achievement-metrics dt, .achievement-metrics .metric-caption, .channel-card figcaption>span, .gallery-note, .work-category, .work-credit>small, .work-note, .product-number, .space-visual-word>span, .visual-caption, .auto-visual-top .mono, .auto-path, .service-index, .service small, .contact-direct>span, .copy-status, .site-footer>p, .site-footer>small { font-size: var(--type-label); line-height: 1.7; font-weight: 400; letter-spacing: 0; }
.section-index, .work-category, .product-number, .service-index, .service small { font-weight: 500; letter-spacing: .04em; }
.wordmark, .site-footer .wordmark { font-size: var(--type-body); font-weight: 600; line-height: 1.6; letter-spacing: .06em; }
.achievement-metrics dd, .case-result strong { font-family: var(--display); font-size: var(--type-data); line-height: 1.2; font-weight: 600; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.metric-from, .metric-unit { font-size: var(--type-body); line-height: 1.6; letter-spacing: 0; font-weight: 500; }
.universe-center, .script-word { font-family: var(--display); font-size: var(--type-orbit); line-height: 1.15; letter-spacing: -.035em; font-weight: 600; }
.universe-coord { display: none; }
.auto-visual-word { font-size: var(--type-title); line-height: 1.5; letter-spacing: 0; font-weight: 500; }
.auto-visual-top>span:first-child { font-size: var(--type-subtitle); line-height: 1.6; font-weight: 600; }
.button-primary>span, .text-link>span[aria-hidden], .nav-contact span, .gallery-controls>button, .contact-mail>span, .social-link>span[aria-hidden], .back-top { font-size: var(--type-subtitle); line-height: 1; font-weight: 400; }
.tiny-star { font-size: 20px; line-height: 1; }
.visual-star, .about-star, .contact-star { font-size: 40px; line-height: 1; }


/* Layout uses one spacing rhythm. Anchor offset is applied only once. */
:root { --section-space: 88px; --header-height: 76px; --column-gap: 48px; }
html { scroll-padding-top: calc(var(--header-height) + 24px); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { font-kerning: normal; }
h1, h2, h3, .product-tagline, .about-lead, .auto-visual-word, .work-summary strong, .service strong { font-feature-settings: "palt" 1; }
p { line-break: strict; text-wrap: pretty; }
.copy-chunk { display: inline-block; }
.site-header { height: var(--header-height); padding-inline: max(6%, calc((100% - 1200px) / 2)); }
.site-nav .nav-contact:is(:hover, [aria-current]) { color: #fff; background: #1657df; }
.hero { min-height: 0; padding-top: 48px; column-gap: var(--column-gap); row-gap: 32px; }
.hero-copy { padding: 32px 0; }
.eyebrow { margin-bottom: 24px; align-items: center; }
.eyebrow-role::before { content: " · "; }
.hero-description { margin-top: 24px; max-width: 28em; }
.hero-intro { display: block; margin-bottom: 4px; }
.hero-actions { margin-top: 28px; gap: 24px; }
.button-primary, .hero-link { min-height: 48px; }
.universe { width: 100%; margin: 0; }
.hero-footer { min-height: 76px; padding-block: 16px; }
.hero-role { margin-left: 0; }
.section-heading>div, .product, .approach, .about-inner, .contact-intro, .contact-bottom { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--column-gap); align-items: start; }
.section-heading>div { margin-top: 20px; }
.section-heading>div>p { margin: 4px 0 0; max-width: 29em; }
.section-heading { margin-bottom: 36px; }
.works, .products { margin-top: var(--section-space); padding-top: 0; }
.achievement-metrics, .case-grid, .youtube-showcase, .product { scroll-margin-top: 0; }
.achievement-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; padding-block: 28px; margin-bottom: 40px; }
.achievement-metrics>div+div { padding-left: 24px; }
.achievement-metrics dt { min-height: 41px; }
.achievement-metrics dt>span { display: block; }
.achievement-metrics .metric-caption { margin-top: 12px; }
.metric-from { vertical-align: baseline; margin-right: 4px; }
.metric-unit { margin-left: 4px; }
.case-grid { gap: 32px; }
.case-study:hover { translate: none; }
.case-content { padding: 28px; }
.case-study h3 { margin-top: 8px; }
.case-study h3>span { margin-left: 4px; }
.case-result strong { display: inline-flex; align-items: baseline; white-space: nowrap; gap: 5px; }
.case-result-from { font-size: .46em; letter-spacing: 0; margin-right: 4px; }
.case-result-unit { font-family: var(--sans); font-size: var(--type-body); letter-spacing: 0; }
.case-result, .case-platforms { min-height: 72px; margin: 20px 0; }
.case-description { padding-bottom: 24px; }
.case-description+.case-bottom { margin-top: auto; }
.case-bottom { padding-top: 20px; gap: 12px; flex-wrap: wrap; }
.case-links { gap: 16px; }
.case-bottom .text-link { gap: 8px; }
.text-link, .text-link:hover { gap: 12px; }
.text-link { transition: color .25s; }
.text-link>span[aria-hidden] { transition: transform .25s; }
.text-link:hover>span[aria-hidden] { transform: translate(2px, -2px); }
.youtube-showcase { padding: 56px 0 36px; }
.showcase-heading { margin-bottom: 24px; }
.gallery-controls>button { width: 44px; height: 44px; }
.channel-card figcaption { padding: 20px; }
.gallery-note { margin-top: 0; }
.product { margin-bottom: 64px; }
.product:last-child { margin-bottom: 0; }
.product-copy { padding: 8px 0 0; }
.product-number { margin-bottom: 20px; }
.product-name { min-height: 44px; }
.product-tagline { margin-top: 20px; }
.product-description { margin-top: 16px; max-width: 30em; }
.product-role { margin: 20px 0 12px; }
.product-copy>.text-link { min-height: 44px; }
.approach { margin-top: var(--section-space); padding-top: 0; padding-bottom: var(--section-space); }
.approach-intro h2 { margin-top: 20px; }
.approach-intro>p:last-child { margin-top: 20px; }
.service summary { gap: 16px; }
.service-index { width: 20px; flex-shrink: 0; }
.service-body { padding: 16px 0 0 36px; }
.about-inner { padding-block: var(--section-space); }
.script-word { margin: 0; }
.script-word>span { display: block; }
.about-copy { padding-top: 0; }
.about-copy h2 { display: flex; align-items: baseline; gap: 16px; }
.about-copy h2>span { margin-left: 0; }
.about-copy .about-lead { margin: 20px 0; }
.contact { margin-top: var(--section-space); padding-top: 0; padding-bottom: var(--section-space); }
.contact-top { display: block; }
.contact-intro { margin-top: 20px; }
.contact h2 { margin: 0; }
.contact h2>.serif { font-size: inherit; font-weight: inherit; }
.contact-star { position: static; display: inline-block; font-size: 28px; margin-left: 16px; vertical-align: baseline; }
.contact-note { margin-top: 4px; }
.contact-bottom { margin-top: 36px; }
.contact-direct { padding-top: 0; }
.topic { min-height: 44px; }
.contact-mail { margin-top: 16px; }
.copy-email, .social-link, .back-top { min-height: 44px; }
.copy-status:empty { display: none; }
.social-link { margin-top: 8px; }

@media (min-width: 801px) and (max-width: 1200px) {
  :root { --type-display: 48px; --type-section: 32px; --type-title: 24px; --type-orbit: 34px; --type-data: 44px; --column-gap: 32px; --section-space: 72px; }
  .hero { padding-top: 32px; }
  .hero-copy { padding-block: 24px; }
  .site-nav { gap: 20px; }
  .scroll-cue { display: none; }
  .hero-footer { gap: 16px; }
  .hero-footer>p { flex-wrap: wrap; gap: 8px 12px; }
  .achievement-metrics { gap: 16px; }
  .achievement-metrics>div+div { padding-left: 16px; }
  .case-content { padding: 24px; }
  .case-bottom { align-items: flex-start; }
  .case-scope { flex-basis: 100%; }
  .case-platforms { gap: 16px; }
  .orbit-tile { width: 56px; height: 56px; border-radius: 17px; }
  .orbit-space img { width: 56px; height: 56px; }
  .orbit-auto img { width: 48px; height: 48px; }
  .auto-visual-top .mono { display: none; }
  .auto-visual-word { top: 38%; }
  .auto-mascot { width: 68%; bottom: 9%; }
}
@media (min-width: 801px) and (max-width: 960px) {
  :root { --type-display: 40px; --type-orbit: 30px; }
  .hero-role { flex-basis: 100%; }
  .auto-visual-top { left: 24px; top: 24px; }
  .auto-visual-word { left: 24px; }
  .visual-caption { left: 24px; font-size: 12px; }
}

/* Mobile is a separate composition of the same content, not a scaled desktop. */
@media (max-width: 800px) {
  :root { --header-height: 64px; --section-space: 56px; --column-gap: 24px; --type-display: clamp(32px, 9.2vw, 42px); --type-section: clamp(28px, 7.5vw, 32px); --type-title: 24px; --type-body: 16px; --type-subtitle: 18px; --type-orbit: 28px; --type-data: 44px; }
  html { scroll-padding-top: 80px; }
  .section-shell { width: min(600px, calc(100% - 40px)); }
  .site-header { padding-inline: max(20px, env(safe-area-inset-left)); }
  .wordmark img { width: 24px; height: 24px; }
  .menu-toggle { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 8px 0 8px 12px; }
  .menu-toggle i { width: 18px; height: 8px; border-block: 1px solid currentColor; }
  .menu-toggle[aria-expanded="true"] i { transform: rotate(-45deg); height: 1px; border-bottom: 0; }
  .site-nav { display: none; position: absolute; top: var(--header-height); inset-inline: 0; padding: 12px 20px 20px; background: #fffffffa; border-bottom: 1px solid var(--rule); box-shadow: 0 12px 24px #101c3308; max-height: calc(100dvh - var(--header-height)); overflow-y: auto; }
  .site-nav.is-open { display: flex; flex-direction: column; align-items: stretch; gap: 4px; }
  .site-nav>a { min-height: 48px; display: flex; align-items: center; padding: 12px; }
  .site-nav .nav-contact { margin-top: 4px; justify-content: space-between; border-radius: 12px; padding: 12px 16px; }
  .hero { grid-template-columns: 1fr; gap: 0; padding-top: 28px; }
  .hero-copy { padding: 0; }
  .eyebrow { align-items: flex-start; gap: 9px; margin-bottom: 20px; }
  .status-dot { margin-top: 7px; }
  .eyebrow-role { display: block; margin-top: 2px; }
  .eyebrow-role::before { content: none; }
  .hero-description { margin-top: 20px; max-width: 30em; }
  .hero-intro { margin-bottom: 8px; }
  .hero-actions { gap: 12px; margin-top: 24px; }
  .button-primary { justify-content: space-between; gap: 20px; padding: 12px 20px; }
  .hero-link { justify-content: center; padding: 12px; }
  .universe { width: min(340px, 100%); margin: 28px auto 20px; transform: none; }
  .universe-center>svg { width: 18px; height: 18px; top: -30px; left: calc(50% - 9px); }
  .orbit-node { gap: 4px; }
  .orbit-tile { width: 48px; height: 48px; border-radius: 15px; }
  .orbit-space img { width: 48px; height: 48px; }
  .orbit-auto img { width: 42px; height: 42px; }
  .orbit-youtube img { width: 30px; height: 30px; }
  .orbit-instagram img, .orbit-tiktok img { width: 25px; height: 25px; }
  .orbit-x img { width: 23px; height: 23px; }
  .orbit-space { left: 7%; top: 8%; }
  .orbit-youtube { right: 9%; top: 3%; }
  .orbit-instagram { right: -1%; top: 41%; }
  .orbit-tiktok { left: -2%; top: 44%; }
  .orbit-x { left: 16%; bottom: 1%; }
  .orbit-auto { right: 6%; bottom: 3%; }
  .orbit-label { white-space: nowrap; }
  .hero-footer { min-height: 64px; padding-block: 12px; gap: 12px; }
  .hero-footer>p { gap: 8px; flex-wrap: wrap; }
  .hero-footer .hero-role, .scroll-cue { display: none; }
  .motion-toggle { min-height: 44px; white-space: nowrap; padding-inline: 4px; }
  .section-heading>div, .approach, .about-inner, .contact-intro, .contact-bottom { grid-template-columns: 1fr; gap: 20px; }
  .section-heading>div { margin-top: 16px; }
  .section-heading>div>p { max-width: none; margin: 0; }
  .section-heading { margin-bottom: 28px; }
  .desktop-break { display: none; }
  .mobile-break { display: block; }
  .achievement-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; padding: 0; margin-bottom: 28px; }
  .achievement-metrics>div { min-width: 0; padding: 20px 12px 20px 0; }
  .achievement-metrics>div+div { padding-left: 0; border-left: 0; }
  .achievement-metrics>div:nth-child(even) { border-left: 1px solid var(--rule); padding-left: 16px; padding-right: 0; }
  .achievement-metrics>div:nth-child(n+3) { border-top: 1px solid var(--rule); }
  .achievement-metrics dt { min-height: 41px; }
  .achievement-metrics dd { margin-top: 8px; }
  .metric-from, .metric-unit { font-size: 14px; }
  .achievement-metrics .metric-caption { min-height: 41px; margin-top: 8px; }
  .case-grid { grid-template-columns: 1fr; gap: 24px; }
  .case-study { border-radius: 20px; }
  .case-photo { aspect-ratio: 1.6; }
  .photo-label { left: 16px; top: 16px; padding: 6px 10px; }
  .case-content { padding: 24px; }
  .case-result, .case-platforms { min-height: 0; margin: 20px 0; }
  .case-result { gap: 8px 12px; }
  .case-description { padding-bottom: 20px; }
  .case-bottom { padding-top: 16px; align-items: flex-start; gap: 8px; }
  .case-scope { flex-basis: 100%; }
  .case-links { justify-content: flex-start; gap: 20px; }
  .case-bottom .text-link { min-height: 44px; }
  .case-platforms { gap: 20px; }
  .case-platforms>span { gap: 8px; }
  .youtube-showcase { padding: 40px 0 28px; }
  .showcase-heading { flex-wrap: wrap; gap: 16px; margin-bottom: 16px; }
  .showcase-heading>div:first-child { width: 100%; }
  .showcase-heading h3 { margin-top: 12px; }
  .showcase-heading p:last-child { margin-top: 8px; }
  .gallery-controls { position: static; margin-left: auto; padding: 0; gap: 8px; }
  .channel-gallery { grid-auto-columns: 80%; gap: 16px; margin-right: -20px; padding-right: 20px; scroll-padding-left: 1px; padding-bottom: 16px; }
  .channel-card { border-radius: 16px; }
  .channel-card figcaption { min-height: 104px; padding: 20px; }
  .channel-card figcaption>strong { font-size: 18px; }
  .work-detail>summary { position: relative; flex-wrap: wrap; gap: 8px; padding: 20px 28px 20px 0; }
  .work-category { width: 100%; }
  .work-summary { flex-basis: 100%; }
  .work-detail .service-toggle { position: absolute; right: 0; top: 44px; }
  .work-detail-body { margin: 0 0 24px; }
  .work-note { margin-top: 16px; }
  .product { grid-template-columns: 1fr; gap: 0; margin-bottom: 48px; }
  .product-copy { display: contents; }
  .product-number { grid-row: 1; margin: 0 0 12px; gap: 8px; flex-wrap: wrap; }
  .product-name { grid-row: 2; margin-bottom: 20px; }
  .product-name>img { width: 40px; height: 40px; }
  .product-visual { grid-row: 3; aspect-ratio: 1.1; border-radius: 20px; margin-bottom: 24px; }
  .product-tagline { grid-row: 4; margin: 0; }
  .product-description { grid-row: 5; margin: 16px 0 0; }
  .product-role { grid-row: 6; margin: 20px 0 8px; }
  .product-copy>.text-link { grid-row: 7; justify-self: start; }
  .visual-caption { left: 24px; bottom: 20px; font-size: 12px; }
  .auto-visual-top { top: 24px; left: 24px; right: 24px; }
  .auto-visual-top .mono { display: none; }
  .auto-path { top: 64px; left: 24px; gap: 10px; }
  .auto-path>i { width: 16px; }
  .auto-visual-word { left: 24px; top: 36%; }
  .auto-mascot { width: 64%; right: -4%; bottom: 9%; }
  .approach-intro h2 { margin-top: 16px; }
  .approach-intro>p:last-child { margin-top: 16px; }
  .service-list { margin-top: 8px; }
  .service { padding: 20px 0; }
  .service small { margin-bottom: 4px; }
  .service-body { padding: 16px 0 0; }
  .about-inner { gap: 28px; }
  .about-signature { min-height: 0; display: block; }
  .about-signature .section-index { position: static; }
  .script-word { font-size: 28px; line-height: 1.2; margin-top: 20px; max-width: 14em; text-wrap: balance; }
  .script-word>span { display: inline; }
  .signature-orbit, .about-star { display: none; }
  .about-copy h2 { margin-top: 8px; gap: 12px; }
  .about-copy .about-lead { margin: 20px 0 16px; }
  .about-copy .text-link { min-height: 44px; }
  .contact-intro { margin-top: 16px; }
  .contact-note { margin: 0; }
  .contact-bottom { margin-top: 28px; gap: 28px; }
  .contact-selector>p { margin-bottom: 12px; }
  .topic-options { gap: 8px; }
  .topic { padding: 10px 12px; }
  .contact-mail { max-width: none; margin-top: 12px; padding: 16px 0; }
  .contact-direct>span { margin-bottom: 8px; }
  .contact-direct>a:first-of-type { font-size: 16px; }
  .site-footer { flex-wrap: wrap; gap: 8px 16px; padding-block: 20px; }
  .site-footer .wordmark { flex: 1; }
  .site-footer>p { display: none; }
  .site-footer>small { font-size: 12px; }
  .back-top { padding-inline: 8px; }
  .case-grid>[data-reveal]:nth-child(2) { transition-delay: 0s; }
  .reveal-ready { transform: translate3d(0, 12px, 0); transition-duration: .55s; }
}
@media (max-width: 359px) {
  :root { --type-title: 22px; --type-data: 40px; --type-orbit: 24px; }
  .section-shell { width: calc(100% - 32px); }
  .site-header { padding-inline: 16px; }
  .case-content { padding: 20px; }
  .hero-footer>p { gap: 4px 8px; }
  .hero-footer strong { font-size: 14px; }
  .hero-footer>p>span { font-size: 12px; }
  .channel-gallery { margin-right: -16px; padding-right: 16px; }
  .achievement-metrics>div:nth-child(even) { padding-left: 12px; }
  .metric-from { margin-right: 0; }
  .metric-unit { margin-left: 2px; }
  .case-platforms { gap: 16px; }
  .case-platforms>span>img { width: 24px; height: 24px; }
  .case-platforms>span:last-child>img { width: 36px; height: 26px; }
}
@media (hover: none) {
  .button-primary:hover, .case-study:hover .case-photo>img:first-child, .channel-card:hover .channel-image>img { transform: none; }
  .product-auto:hover .auto-mascot { transform: rotate(-7deg); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none!important; transition: none!important; }
  .universe, .reveal-ready { transform: none; }
  .reveal-ready { opacity: 1; }
}
@media print {
  .site-header, .hero-actions, .motion-toggle, .gallery-controls, .contact-selector, .copy-email, .back-top { display: none!important; }
  .section-shell { width: 90%; }
  .hero { min-height: 0; padding-top: 24px; }
  .hero h1 { font-size: 40px; }
  .reveal-ready { opacity: 1; transform: none; }
  .works, .contact { margin-top: 40px; }
  .case-study, .product, .work-detail { break-inside: avoid; }
  .channel-gallery { overflow: visible; display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-flow: row; grid-auto-columns: auto; }
  .case-study, .product-visual, .about { print-color-adjust: exact; }
}