

:root {
	--c-bg: #f0f1fa;
	--c-white: #ffffff;
	--c-black: #000000;
	--c-blue: #2040f0;
	--c-blue-deep: #1730d8;
	--c-blue-light: #6d8dff;
	--c-grey-blue: #2b2e3a;
	--c-dark-white: #e4e6ef;
	--c-panel: #141515;
	--c-sub: #4a4d5a;

	--radius: 20px;
	--radius-card: 15px;
	--pad-x: max(5vw, 40px);
	--pad-y: clamp(30px, 4vw, 50px);
	--gap: 2vw;
	--col: calc((100vw - 2 * var(--pad-x) - 11 * var(--gap)) / 12);
	--cross: clamp(.875rem, 1vw, 2rem);
	--ease: cubic-bezier(.35, 0, 0, 1);
	--ease-out: cubic-bezier(.16, 1, .3, 1);
	--vh: 1vh;

	--font-base: "Inter Tight", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
	--font-mono: "IBM Plex Mono", "Noto Sans JP", monospace;
}

*, *::before, *::after { box-sizing: border-box; }

html {
	font-size: 16px;
	-webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scrollbar-width: none;
}
html::-webkit-scrollbar { display: none; }

body {
	margin: 0;
	background: var(--c-bg);
	color: var(--c-black);
	font-family: var(--font-base);
	font-weight: 400;
	line-height: 1.6;
	overflow-x: hidden;
	overscroll-behavior-y: none;
	font-feature-settings: "palt";
	line-break: strict;
}

h1, h2, h3, p, ul { margin: 0; padding: 0; font-weight: inherit; }
ul { list-style: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; border: 0; background: none; padding: 0; cursor: pointer; }
img, video, svg { display: block; }
::selection { background: var(--c-blue); color: #fff; }

#bg-canvas { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; display: block; }

@supports (height: 100lvh) { #bg-canvas { height: 100lvh; } }
html.no-js #bg-canvas, html.is-reduced #bg-canvas { display: none; }

html.js.is-stage:not(.is-reduced), html.js.is-stage:not(.is-reduced) body { background-color: #000; }
html.js.is-stage:not(.is-reduced) #bg-canvas { visibility: hidden; }
#page { position: relative; z-index: 1; }

@keyframes scroll-live { from { outline-offset: 0px; } to { outline-offset: 1px; } }
.scroll-live { position: absolute; left: 0; top: 0; width: 1px; height: 1px; pointer-events: none; }
@supports (animation-timeline: scroll()) {
	.scroll-live { animation: scroll-live linear both; animation-timeline: scroll(root); }
}

html.is-gl .ribbon { visibility: hidden; }
html.is-gl .card__visual { background: transparent; }
html.is-gl .card__visual img { visibility: hidden; }
html.is-gl .reel__screen { background: transparent; }
html.is-gl .reel__video { opacity: 0; }
html.is-gl .reel__shade { display: none; }

html.is-gl .reel { padding-bottom: calc(var(--vh) * 100); margin-bottom: calc(var(--vh) * 10); }
html.is-gl .reel__frame { will-change: transform; }

.skip-link { position: fixed; left: 12px; top: -60px; z-index: 300; background: #000; color: #fff; padding: 10px 16px; border-radius: 8px; transition: top .2s; }
.skip-link:focus { top: 12px; }
:focus-visible { outline: 2px solid var(--c-blue); outline-offset: 3px; }

.cross { position: absolute; width: var(--cross); height: var(--cross); display: block; transition: transform .9s var(--ease); }
.cross::before, .cross::after { content: ""; position: absolute; left: 0; top: calc(50% - .0625 * var(--cross)); width: 100%; height: calc(.125 * var(--cross)); background: currentColor; }
.cross::after { transform: rotate(90deg); }
.js .cross { transform: scale(0) rotate(-180deg); }
.js .is-in > .cross, .js .cross.is-in { transform: none; }

.section {
	position: relative;
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	column-gap: var(--gap);
	padding: var(--pad-y) var(--pad-x);
}

.l { display: block; }
.js [data-split] .l { overflow: hidden; }
.ch, .w { display: inline-block; will-change: transform; }

.js.is-loading [data-split] { visibility: hidden; }
.js [data-split="chars"] .ch { transform: translate3d(0, 115%, 0) rotate(9deg); transform-origin: 0 100%; transition: transform 1.15s var(--ease); transition-delay: calc(var(--i) * 38ms); }
.js [data-split="chars"].is-in .ch { transform: none; }
.js [data-split="lines"] .w { transform: translate3d(0, 1.7em, 0) rotate(7deg); transform-origin: 0 100%; transition: transform 1.2s var(--ease); transition-delay: calc(var(--i) * 90ms); }
.js [data-split="lines"].is-in .w { transform: none; }
.js [data-reveal] { opacity: 0; transform: translate3d(0, 1.6em, 0); transition: opacity 1s ease, transform 1.2s var(--ease); }
.js [data-reveal].is-in { opacity: 1; transform: none; }

#preloader { position: fixed; inset: 0; z-index: 200; background: #000; color: #fff; transition: transform .8s cubic-bezier(.4, 0, .2, 1), visibility 0s .8s; }
html.is-ready #preloader { transform: translate3d(100%, 0, 0); visibility: hidden; pointer-events: none; }
html.is-ready .loading_wrap { opacity: 0; }
html.no-js #preloader { display: none; }

html.is-revisit .loading_wrap { display: none; }
.loading_wrap { position: absolute; top: 48%; left: 50%; width: 96px; height: 140px; transform: translate(-50%, -50%); transition: opacity .4s ease; }
.loading_wrap path, .loading_wrap circle { fill: #fff; }
.loading_logo { position: absolute; left: 0; top: 0; width: 96px; height: 95px; background: #000; animation: ld-logo-slide 1s forwards; animation-delay: 1s; }
.loading_logo svg { width: 100%; height: auto; }
.loading_logo > div { position: absolute; opacity: 0; }

.loading_logo_parts1 { left: 27px; top: 0; width: 27px; height: 70px; --from: translate(-27px, -30px); animation: ld-part .5s forwards ease-out; }
.loading_logo_parts2 { left: 6px; top: 29px; width: 49px; height: 35px; --from: translate(-20px, -29px); animation: ld-part .5s forwards ease-out; }
.loading_logo_parts3 { left: 0; bottom: 20px; width: 64px; height: 40px; --from: translate(-20px, 20px); animation: ld-part .5s forwards ease-out; }
.loading_logo_parts4 { left: 29px; bottom: 0; width: 27px; height: 69px; --from: translate(-29px, 20px); animation: ld-part .5s forwards ease-out; }
.loading_logo_parts5 { right: 7px; bottom: 24px; width: 59px; height: 39px; --from: translate(34px, 24px); animation: ld-part .5s forwards ease-out; }
.loading_logo_parts6 { right: 0; top: 12px; width: 74px; height: 47px; --from: translate(50px, -12px); animation: ld-part .5s forwards ease-out; }

.loading_logo_parts7 { left: 38px; top: 42px; width: 8px; height: 8px; transform-origin: 4px -2px; animation: ld-pop .6s forwards .3s; }
.loading_logo_parts8 { right: 0; top: 2px; width: 6px; height: 6px; transform-origin: 3px -5px; animation: ld-pop .6s forwards .6s; }
@keyframes ld-part { 0% { transform: var(--from); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes ld-pop { 0% { transform: scale(0); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
.loading_text { position: absolute; right: 0; top: 31px; height: 40px; margin: auto 0 auto 15px; }
.loading_text .loading_text_wrap { width: 153px; height: 40px; opacity: 0; animation: ld-text-slide 1s forwards; animation-delay: 1s; }
.loading_text svg { width: 100%; height: auto; }
.loading_wrap p.text { position: absolute; bottom: 0; left: -86px; width: 325px; font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "MS P明朝", "MS PMincho", serif; font-size: 18px; line-height: 1; font-feature-settings: normal; -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; text-align: left; white-space: nowrap; opacity: 0; animation: ld-fade 1s forwards; animation-delay: 1s; }
@keyframes ld-fade { 0% { opacity: 0; } 100% { opacity: 1; } }
@keyframes ld-text-slide { 0% { transform: translateX(-10%); opacity: 0; } 100% { transform: translateX(60%); opacity: 1; } }
@keyframes ld-logo-slide { 0% { transform: translateX(0); } 100% { transform: translateX(-70%); } }
@media (max-width: 640px) {
	.loading_wrap { left: 48%; }
	.loading_wrap p.text { font-size: 16px; left: -80px; }
}

#header { position: fixed; left: 0; top: 0; width: 100%; z-index: 100; padding: var(--pad-y) var(--pad-x) 0; display: flex; justify-content: space-between; align-items: center; pointer-events: none; color: var(--c-black); transition: color .5s; }
#header > * { pointer-events: auto; }
html.is-dark #header { color: #fff; }
.header__logo { display: block; width: 7.6rem; transition: opacity .4s, transform .9s var(--ease); }
.header__logo .logo { width: 100%; height: auto; }
.js.is-loading .header__logo { opacity: 0; transform: translate3d(0, -1rem, 0); }
html.is-scrolled-down .header__logo { opacity: 0; pointer-events: none; }

.header__right { display: flex; align-items: center; gap: .6rem; }
.pill { position: relative; display: inline-flex; align-items: center; gap: .9em; height: 3.2em; padding: 0 1.125em 0 1.625em; border-radius: 6.25em; font-size: .875rem; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; overflow: hidden; cursor: pointer; transition: color .4s, background-color .4s, transform .9s var(--ease); }
.js.is-loading .header__right .pill { transform: scale(0); }
.pill--dark { background: var(--c-grey-blue); color: #fff; }
.pill--light { background: var(--c-dark-white); color: #000; }
.pill__text { transition: transform .3s cubic-bezier(.4, 0, .1, 1); }
.pill__dot { width: .34em; height: .34em; border-radius: 50%; background: currentColor; margin: 0 .35em; transition: transform .15s cubic-bezier(.4, 0, .1, 1); }
.pill__arrow { position: absolute; left: 1.2em; top: calc(50% - .5em); width: 1em; height: 1em; transform: translate3d(-2.6em, 0, 0); transition: transform .3s cubic-bezier(.4, 0, .1, 1); }
.pill__arrow svg { width: 100%; height: 100%; }
@media (hover: hover) {
	.pill--dark:hover { background: var(--c-blue); }
	.pill--dark:hover .pill__dot { transform: scale(0); }
	.pill--dark:hover .pill__text { transform: translate3d(1.5em, 0, 0); }
	.pill--dark:hover .pill__arrow { transform: none; }
	.pill--light:hover { background: #fff; }
}
html.is-dark .pill--dark { background: #fff; color: #000; }
html.is-dark .pill--dark:hover { background: var(--c-blue); color: #fff; }

.menu-btn__labels { position: relative; display: grid; height: 1.2em; line-height: 1.2em; overflow: hidden; text-align: left; }
.menu-btn__open, .menu-btn__close { grid-area: 1 / 1; display: block; transition: transform .5s var(--ease); }
.menu-btn__close { transform: translate3d(0, 110%, 0); }
.menu-btn__dots { display: inline-flex; gap: .22em; transition: transform .5s var(--ease); }
.menu-btn__dots i { width: .3em; height: .3em; border-radius: 50%; background: currentColor; }
#header.is-menu-open .menu-btn__open { transform: translate3d(0, -110%, 0); }
#header.is-menu-open .menu-btn__close { transform: none; }
#header.is-menu-open .menu-btn__dots { transform: rotate(90deg); }
#header.is-menu-open .header__menu-btn { background: #fff; color: #000; }

#menu { position: absolute; right: var(--pad-x); top: calc(var(--pad-y) + 3.3rem); width: min(22rem, calc(100vw - 2 * var(--pad-x))); display: flex; flex-direction: column; gap: .5rem; color: #000; }
#menu[hidden] { display: none; }
.menu__card { background: #fff; border-radius: 14px; box-shadow: 0 12px 40px rgba(0, 0, 0, .12); opacity: 0; transform: translate3d(0, -14px, 0) scale(.94); transform-origin: 100% 0; transition: opacity .35s ease, transform .6s var(--ease); }
#header.is-menu-open .menu__card { opacity: 1; transform: none; }
#header.is-menu-open .menu__card:nth-child(2) { transition-delay: .06s; }
#header.is-menu-open .menu__card:nth-child(3) { transition-delay: .12s; }
.menu__links { padding: .6rem; }
.menu__links a { position: relative; display: flex; align-items: baseline; justify-content: space-between; padding: .62rem 1rem; border-radius: 10px; font-size: 1.25rem; font-weight: 500; transition: background-color .3s, padding .4s var(--ease); }
.menu__links a em { font-style: normal; font-size: .72rem; font-family: var(--font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--c-sub); }
.menu__links a.is-current em::after { content: ""; display: inline-block; width: .5em; height: .5em; margin-left: .8em; border-radius: 50%; background: #000; }
@media (hover: hover) { .menu__links a:hover { background: var(--c-bg); padding-left: 1.4rem; } }
.menu__tel { padding: 1.3rem 1.6rem 1.4rem; }
.menu__tel-label { font-size: .8rem; color: var(--c-sub); }
.menu__tel-number { display: block; font-size: 2rem; font-weight: 500; letter-spacing: -.01em; line-height: 1.3; }
.menu__tel-note { font-size: .8rem; color: var(--c-sub); }

.menu__cta { display: flex; align-items: center; justify-content: space-between; padding: 1.25rem 1.6rem; background: var(--c-blue); color: #fff; font-size: 1.1rem; font-weight: 500; }
.menu__cta svg { width: 1.3em; height: 1.3em; transition: transform .5s var(--ease); }
@media (hover: hover) { .menu__cta:hover { background: #000; } .menu__cta:hover svg { transform: translate3d(.2em, -.2em, 0); } }

@media (max-height: 830px) {
	.menu__links a { padding: .42rem 1rem; font-size: 1.12rem; }
	.menu__tel { padding: .9rem 1.6rem 1rem; }
	.menu__tel-number { font-size: 1.7rem; }
	.menu__cta { padding: .95rem 1.6rem; }
}
@media (max-height: 710px) {
	#menu { gap: .35rem; }
	.menu__links { padding: .4rem; }
	.menu__links a { padding: .16rem 1rem; font-size: 1.02rem; }
	.menu__tel { padding: .7rem 1.6rem .8rem; }
	.menu__tel-number { font-size: 1.5rem; }
	.menu__cta { padding: .8rem 1.6rem; font-size: 1rem; }
}

@media (max-height: 570px) {
	#menu { top: calc(var(--pad-y) + 2.9rem); }
	.menu__tel { display: none; }
	.menu__links { padding: .3rem; }
	.menu__links a { padding: .12rem 1rem; font-size: 1rem; line-height: 1.5; }
	.menu__cta { padding: .55rem 1.6rem; }
}

@media (max-height: 410px) {
	#menu { gap: .25rem; }
	.menu__links { padding: .2rem; }
	.menu__links a { padding: 0 1rem; font-size: .9rem; line-height: 1.42; }
	.menu__cta { padding: .35rem 1.6rem; font-size: .95rem; }
}

#scroll-indicator { position: fixed; right: 16px; top: calc(var(--vh) * 40); width: 6px; height: calc(var(--vh) * 20); border-radius: 3px; background: rgba(0, 0, 0, .1); z-index: 90; opacity: 0; transition: opacity .4s; pointer-events: none; }
#scroll-indicator.is-active { opacity: 1; }
#scroll-indicator-bar { position: absolute; left: 0; top: 0; width: 100%; height: 20%; border-radius: 3px; background: #000; }
html.is-dark #scroll-indicator { background: rgba(255, 255, 255, .14); }
html.is-dark #scroll-indicator-bar { background: #fff; }

.journey { position: relative; height: calc(var(--vh) * 560); color: #fff; }
.journey__sticky { position: sticky; top: 0; height: calc(var(--vh) * 100); overflow: hidden; background: #000; }
.journey__canvas { position: absolute; inset: 0; }
.journey__canvas canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.journey.is-no-webgl .journey__canvas { background: radial-gradient(circle at 50% 68%, #14228f 0, #05070f 46%, #000 72%); }
.journey__flash { position: absolute; inset: 0; background: var(--c-bg); opacity: 0; pointer-events: none; }
.journey__head { position: absolute; left: 0; top: 30%; width: 100%; padding: 0 var(--pad-x); transform: translate3d(0, -50%, 0); text-align: center; pointer-events: none; will-change: opacity, transform; }

.journey__title { font-size: min(5.1vw, calc(var(--vh) * 10)); line-height: 1.34; font-weight: 500; letter-spacing: -.01em; }
.journey__lead { position: absolute; left: 0; bottom: calc(var(--pad-y) + var(--vh) * 3.4); width: 100%; padding: 0 var(--pad-x); text-align: center; font-size: clamp(.98rem, 1.5vw, 2.3rem); line-height: 1.7; font-weight: 500; letter-spacing: .02em; color: rgba(255, 255, 255, .82); pointer-events: none; }
.journey__scroll { color: #fff; }

.journey__head::before { content: ""; position: absolute; left: 8%; right: 8%; top: -22%; bottom: -22%; z-index: -1; background: radial-gradient(closest-side, rgba(0, 0, 8, .45), rgba(0, 0, 8, .3) 55%, rgba(0, 0, 8, 0)); pointer-events: none; }
.journey__lead { isolation: isolate; color: #fff; text-shadow: 0 0 .45em rgba(0, 0, 8, .95), 0 0 1.1em rgba(0, 0, 8, .9), 0 0 2.2em rgba(0, 0, 8, .7); }
.journey__lead::before { content: ""; position: absolute; left: 50%; top: -90%; width: min(70vw, 56em); height: 430%; transform: translate3d(-50%, 0, 0); z-index: -1; background: radial-gradient(closest-side, rgba(0, 0, 8, .5), rgba(0, 0, 8, .3) 55%, rgba(0, 0, 8, 0)); pointer-events: none; }
.journey__scroll .hero__scroll-text { text-shadow: 0 0 .5em rgba(0, 0, 8, .95), 0 0 1.2em rgba(0, 0, 8, .8); }

@supports (height: 100lvh) {
	html.js:not(.is-reduced) .journey__sticky { height: 100lvh; }
	html.js:not(.is-reduced) .journey__head { top: 30svh; }
	html.js:not(.is-reduced) .journey__lead { bottom: calc(100lvh - 100svh + var(--pad-y) + 3.4svh); }
	html.js:not(.is-reduced) .journey__scroll { bottom: calc(100lvh - 100svh); }
}

.ib { display: inline-block; }

.statement__desc, .card__desc, .proof__texts p { text-wrap: pretty; }
.statement__desc { text-wrap: balance; }

.statement { padding-top: var(--pad-y); }

html.js:not(.is-reduced) .statement { margin-top: calc(var(--vh) * -62); }

html.js.is-hold .hold { position: relative; margin-top: calc(var(--vh) * -62 - var(--hold-lead, 0px)); }
html.js.is-hold .hold > .statement { position: sticky; top: var(--hold-top, 0px); margin-top: 0; }
html.js.is-hold .hold__space { height: 0; pointer-events: none; }

html.no-js .hold__space { display: none; }
html.no-js .hold > .statement { transform: none !important; }
.ribbon { position: absolute; left: 0; top: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; z-index: 0; }
.ribbon path { stroke: var(--c-blue); stroke-width: max(1.55vw, 14px); }
.ribbon--light path { stroke: var(--c-blue-light); }
.statement__title { position: relative; z-index: 1; grid-column: 1 / -1; font-size: 10vw; line-height: 1.16; font-weight: 500; letter-spacing: -.02em; margin: 10vw 0 5vw -.03em; }
.statement__title .l--indent { padding-left: calc(var(--col) * 2 + var(--gap) * 2); }
.statement__content { position: relative; z-index: 1; grid-column: 7 / span 6; font-size: clamp(1rem, 1.3vw, 2.4rem); line-height: 1.95; }
.statement__desc { max-width: 31em; }

.cta { position: relative; display: inline-flex; align-items: center; gap: 1em; height: 3.375em; padding: 0 1.5em 0 1.625em; margin-top: 3em; border-radius: 5.3em; background: #fff; color: #000; font-size: clamp(.875rem, 1vw, 1.75rem); font-weight: 500; line-height: 1; overflow: hidden; box-shadow: 0 6px 10px rgba(0, 0, 0, .04), 0 2px 4px rgba(0, 0, 0, .04); transition: color .4s; isolation: isolate; }
.cta__dot { width: .5em; height: .5em; border-radius: 50%; background: #000; z-index: -1; transition: background-color .5s var(--ease), transform .5s var(--ease); }
.cta__text { transition: transform .4s var(--ease); }
.cta__arrow { position: absolute; right: 1em; width: 1.2em; height: 1.2em; transform: translate3d(3em, 0, 0); transition: transform .4s cubic-bezier(.4, 0, 0, 1); }
.cta__arrow svg { width: 100%; height: 100%; }
@media (hover: hover) {
	.cta:hover { color: #fff; }
	.cta:hover .cta__dot { transform: translate3d(4em, 0, 0) scale(60); background: var(--c-blue); }
	.cta:hover .cta__text { transform: translate3d(-1.5em, 0, 0); }
	.cta:hover .cta__arrow { transform: none; }
}

@media (min-width: 813px) and (max-height: 700px) {
	.statement__title { margin-bottom: 2.4vw; }
	.statement__content .cta { margin-top: 1.5em; }
}
.cta--center { grid-column: 1 / -1; justify-self: center; margin-top: 12vh; z-index: 1; }
.cta--large { font-size: clamp(1rem, 1.25vw, 2rem); }

.cta--primary, .cta--dark { height: 3.7em; padding: 0 3.7em 0 1.9em; color: #fff; font-size: clamp(1rem, 1.3vw, 2.1rem); }
.cta--primary .cta__dot, .cta--dark .cta__dot { background: #fff; }
.cta--primary .cta__arrow, .cta--dark .cta__arrow { right: 1.5em; transform: none; }
.cta--dark { background: #000; box-shadow: 0 12px 28px rgba(0, 0, 0, .18), 0 3px 8px rgba(0, 0, 0, .12); }
.cta--primary { background: var(--c-blue); box-shadow: 0 14px 34px rgba(32, 64, 240, .3), 0 3px 8px rgba(32, 64, 240, .22); }
.cta--center.cta--primary { font-size: clamp(1.05rem, 1.5vw, 2.4rem); }

.proof .cta--dark { background: var(--c-blue); box-shadow: 0 14px 34px rgba(32, 64, 240, .3), 0 3px 8px rgba(32, 64, 240, .22); }
@media (hover: hover) {
	.cta--primary:hover .cta__dot, .cta--dark:hover .cta__dot { transform: translate3d(4em, 0, 0) scale(80); }
	.cta--primary:hover .cta__dot, .proof .cta--dark:hover .cta__dot { background: #000; }
	.cta--primary:hover .cta__text, .cta--dark:hover .cta__text { transform: none; }
	.cta--primary:hover .cta__arrow, .cta--dark:hover .cta__arrow { transform: translate3d(.3em, 0, 0); }
}
@keyframes cta-glow {
	0%, 100% { box-shadow: 0 14px 34px rgba(32, 64, 240, .3), 0 0 0 0 rgba(32, 64, 240, .38); }
	55% { box-shadow: 0 14px 34px rgba(32, 64, 240, .3), 0 0 0 1em rgba(32, 64, 240, 0); }
}
.cta--pulse { animation: cta-glow 2.8s ease-out infinite; }
html.is-reduced .cta--pulse { animation: none; }
@media (prefers-reduced-motion: reduce) { .cta--pulse { animation: none; } }

.cta-note { margin-top: 1.2em; font-size: clamp(.8rem, .95vw, 1.3rem); line-height: 1.6; letter-spacing: .04em; color: var(--c-sub); }
.cta-note--center { position: relative; z-index: 1; grid-column: 1 / -1; justify-self: center; text-align: center; }

.reel-thumb-wrap { position: relative; grid-column: 1 / span 5; width: calc(100% + var(--gap) * 2); height: 0; top: calc(var(--cross) * -10); pointer-events: none; }
.reel-thumb { aspect-ratio: 16 / 9; visibility: hidden; }

.reel { position: relative; grid-column: 1 / -1; }
.reel__frame { position: relative; width: 100%; aspect-ratio: 2 / 1; margin-top: calc(var(--cross) * 3.2); font-size: clamp(.875rem, 1vw, 2rem); }
.reel-deco { position: absolute; left: 0; width: 100%; height: var(--cross); }
.reel-deco--top { top: calc(-2 * var(--cross)); }
.reel-deco--bottom { bottom: calc(-2 * var(--cross)); }
.reel-deco .cross { top: 0; }
.reel-deco .cross:nth-child(1) { left: 0; }
.reel-deco .cross:nth-child(2) { left: calc(25% - var(--cross) / 2); transition-delay: .06s; }
.reel-deco .cross:nth-child(3) { left: calc(50% - var(--cross) / 2); transition-delay: .12s; }
.reel-deco .cross:nth-child(4) { left: calc(75% - var(--cross) / 2); transition-delay: .18s; }
.reel-deco .cross:nth-child(5) { left: calc(100% - var(--cross)); transition-delay: .24s; }

.reel__screen { position: absolute; inset: 0; border-radius: var(--radius); overflow: hidden; background: #101114; transform: translateZ(0); }
.reel__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.reel__shade { position: absolute; inset: 0; background: #000; opacity: .78; }
.reel__title { position: absolute; left: 50%; top: 50%; display: flex; gap: 2.1em; transform: translate(-50%, -50%); font-size: 7.5em; line-height: 1; font-weight: 400; letter-spacing: -.01em; color: #fff; text-transform: uppercase; white-space: nowrap; pointer-events: none; }
.reel__title > span { display: inline-flex; overflow: hidden; height: 1em; }
.reel__title .roll { display: inline-block; transform: translate3d(0, 110%, 0); transition: transform 1s var(--ease); transition-delay: calc(var(--i) * 45ms); }
.reel__frame.is-open .reel__title .roll { transform: none; }
.reel__btn { position: absolute; left: calc(50% - 4.7em); top: calc(50% - 3em); width: 9.4em; height: 6em; border-radius: 22.5em; display: flex; align-items: center; justify-content: center; overflow: hidden; background: #fff; color: #000; transition: color .3s; }
.reel__btn-bg { position: absolute; inset: 0; background: var(--c-blue); transform: scale3d(1, 0, 1); transform-origin: 50% 100%; transition: transform .4s cubic-bezier(.4, 0, .1, 1); }
.reel__btn svg { position: relative; width: 2em; height: 2em; }

html:not(.is-gl) .reel__btn { transition: transform .8s var(--ease), color .3s; }
@media (hover: hover) {
	.reel__btn:hover { color: #fff; }
	.reel__btn:hover .reel__btn-bg { transform: none; }
	html:not(.is-gl) .reel__btn:hover { transform: scale(1.08); }
}
.reel__caption { position: absolute; left: 1.6rem; bottom: 1.3rem; color: rgba(255, 255, 255, .78); font-size: clamp(.72rem, .9vw, 1.1rem); letter-spacing: .04em; opacity: 0; transition: opacity .6s ease .3s; }
.reel__frame.is-open .reel__caption { opacity: 1; }

.service { padding-top: 10vw; }
.service__head { position: relative; grid-column: 1 / -1; }
.service__title { font-size: 8vw; line-height: 1.05; font-weight: 500; letter-spacing: -.02em; margin-left: -.05em; }
.service__lead { position: absolute; right: 0; bottom: 1.4vw; width: calc(var(--col) * 4 + var(--gap) * 3); font-size: clamp(.8rem, 1.05vw, 1.6rem); line-height: 1.7; font-weight: 500; }

.service__lead .ln { display: block; overflow: hidden; }
.service__lead .ln > span { display: block; }

.cards { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); margin-top: 5vw; }
.card { position: relative; grid-column: 1 / -1; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: 1fr auto auto auto auto 1fr; column-gap: var(--gap); }
.card + .card { margin-top: 7vw; }
.card__visual { position: relative; grid-column: 1 / span 7; grid-row: 1 / -1; align-self: center; aspect-ratio: 16 / 10; border-radius: var(--radius-card); overflow: hidden; background: #d9dcea; transform: translateZ(0); }
.card:nth-child(even) .card__visual { grid-column: 6 / -1; }
.card__tags, .card__title, .card__desc, .card__more { grid-column: 9 / -1; }
.card:nth-child(even) .card__tags, .card:nth-child(even) .card__title, .card:nth-child(even) .card__desc, .card:nth-child(even) .card__more { grid-column: 1 / span 4; }
.card__visual img { position: absolute; inset: -4%; width: 108%; height: 108%; object-fit: cover; transition: transform 1.4s var(--ease-out); will-change: transform; }
.card__stage { position: absolute; left: 1rem; top: 1rem; min-width: 2.4em; height: 2.4em; padding: 0 .9em; display: inline-flex; align-items: center; justify-content: center; border-radius: 2em; background: rgba(255, 255, 255, .92); color: #000; font-family: var(--font-mono); font-size: clamp(.7rem, .85vw, 1.1rem); font-weight: 500; letter-spacing: .06em; }
.card__tags { position: relative; grid-row: 2; margin: 0 0 .9em; min-height: 1.4em; font-size: clamp(.7rem, .9vw, 1.2rem); font-weight: 500; letter-spacing: .06em; line-height: 1.4; text-transform: uppercase; }

.card__tags.is-typing .card__tags-text { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.card__tags:not(.is-typing) .card__tags-typing { display: none; }
.card__title { position: relative; grid-row: 3; font-size: clamp(1.35rem, 2.6vw, 3.9rem); line-height: 1.3; font-weight: 500; letter-spacing: -.01em; overflow: hidden; }
.card__title > span { display: inline-block; transition: transform .6s var(--ease); }

.card__title.is-roll { height: 1.3em; white-space: nowrap; }
.card__title.is-roll > span { display: flex; transition: none; }
.card__title.is-roll .card__arrow { transition: none; }
.card__col { display: flex; flex-direction: column; flex: none; }
.card__col > span { display: block; text-shadow: 0 1.3em 0 currentColor, 0 2.6em 0 currentColor, 0 3.9em 0 currentColor; }
.card__col--space { width: .3em; }
.card__arrow { position: absolute; left: 0; top: .28em; width: .8em; height: .8em; transform: translate3d(-1.2em, 0, 0); transition: transform .6s var(--ease); background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 12h18M13 5l7 7-7 7' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 12h18M13 5l7 7-7 7' fill='none' stroke='%23000' stroke-width='2.4'/%3E%3C/svg%3E") center / contain no-repeat; }
.card__desc { grid-row: 4; margin-top: 1.2em; font-size: clamp(.86rem, 1.08vw, 1.5rem); line-height: 1.85; color: var(--c-sub); }

.card__more { grid-row: 5; justify-self: start; display: inline-flex; align-items: center; gap: 1em; height: 3.7em; margin-top: 1.8em; padding: 0 1.7em 0 1.9em; border-radius: 5.3em; background: #000; color: #fff; font-size: clamp(1rem, 1.3vw, 2.1rem); font-weight: 500; line-height: 1; box-shadow: 0 12px 28px rgba(0, 0, 0, .18), 0 3px 8px rgba(0, 0, 0, .12); transition: background-color .35s; }
.card__more::before { content: ""; flex: none; width: .5em; height: .5em; border-radius: 50%; background: #fff; }
.card__more::after { content: ""; flex: none; width: 1.2em; height: 1.2em; margin-left: .5em; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform .4s var(--ease); }
@media (hover: hover) {
	.card:hover .card__title:not(.is-roll) > span { transform: translate3d(1.25em, 0, 0); }
	.card:hover .card__title:not(.is-roll) .card__arrow { transform: none; }
	.card:hover .card__visual img { transform: scale(1.05); }
	.card:hover .card__more { background: var(--c-blue); }
	.card:hover .card__more::after { transform: translate3d(.3em, 0, 0); }
}

@media (min-width: 813px) and (max-width: 1099px) {
	.card__tags, .card__title, .card__desc, .card__more { grid-column: 8 / -1; margin-left: 1.6vw; }
	.card:nth-child(even) .card__tags, .card:nth-child(even) .card__title, .card:nth-child(even) .card__desc, .card:nth-child(even) .card__more { grid-column: 1 / span 5; margin-left: 0; margin-right: 1.6vw; }
	.card__title { font-size: clamp(1.35rem, 2.9vw, 2rem); }
}

.proof { padding-top: 0; }
.proof__title { position: relative; z-index: 1; grid-column: 1 / -1; font-size: 8vw; line-height: 1.18; font-weight: 500; letter-spacing: -.02em; margin: 16vw 0 4.5vw -.03em; }
.proof__texts { position: relative; z-index: 1; grid-column: 7 / span 6; font-size: clamp(1rem, 1.3vw, 2.4rem); line-height: 1.95; }
.proof__texts p + p { margin-top: 1.6em; }
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gap); margin-top: 3.2em; line-height: 1.5; }
.facts li { border-top: 1px solid rgba(0, 0, 0, .16); padding-top: .9em; }
.facts__label { font-size: .68em; font-weight: 500; letter-spacing: .04em; }
.facts__value { display: flex; align-items: baseline; gap: .1em; font-size: 2.5em; line-height: 1.2; font-weight: 500; letter-spacing: -.02em; }
.facts__value b { font-weight: 500; }
.facts__value small { font-size: .36em; letter-spacing: 0; font-weight: 500; }
.facts__note { font-size: .62em; color: var(--c-sub); }
.numbers { position: relative; z-index: 1; grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--gap); margin-top: 9vw; }
.numbers li { border-top: 1px solid rgba(0, 0, 0, .16); padding-top: 1.3em; }
.numbers__label { font-size: clamp(.75rem, .95vw, 1.3rem); font-weight: 500; letter-spacing: .04em; }
.numbers__value { display: flex; align-items: baseline; gap: .12em; margin-top: .1em; font-size: 7.4vw; line-height: 1.15; font-weight: 500; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.numbers__value b { font-weight: 500; }
.numbers__value small { font-size: .26em; letter-spacing: 0; font-weight: 500; }
.numbers__note { grid-column: 1 / -1; margin-top: 1.6em; font-size: clamp(.7rem, .82vw, 1.1rem); color: var(--c-sub); letter-spacing: .04em; }

.voices__label { position: relative; z-index: 1; grid-column: 1 / -1; margin-top: 6vw; font-size: clamp(.95rem, 1.25vw, 1.9rem); font-weight: 500; letter-spacing: .02em; }
.voices { position: relative; z-index: 1; grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); margin: 1.6vw 0 0; padding: 0; list-style: none; }
.voices li { padding: 1.6em 1.7em 1.7em; border-radius: var(--radius); background: #fff; }
.voices__text { font-size: clamp(.9rem, 1.06vw, 1.6rem); line-height: 1.95; font-weight: 500; text-wrap: pretty; }
@media (max-width: 812px) {
	.voices__label { margin-top: 3.2rem; font-size: 1rem; }
	.voices { grid-template-columns: minmax(0, 1fr); gap: .8rem; margin-top: 1rem; }
	.voices li { padding: 1.3em 1.3em 1.4em; }
	.voices__text { font-size: .95rem; }
}

.proof__about { position: relative; z-index: 1; grid-column: 7 / span 6; margin-top: 7vw; font-size: clamp(1rem, 1.3vw, 2.4rem); line-height: 1.95; }
.proof__about .cta { margin-top: 1.6em; }

.hero { height: calc(var(--vh) * 100); min-height: 34rem; margin-top: 14vw; grid-template-rows: auto minmax(0, 1fr); align-content: flex-start; padding-bottom: var(--pad-y); }
.hero__head { grid-column: 4 / span 6; }
.hero__title { font-size: clamp(1rem, 1.95vw, 3.4rem); line-height: 1.32; font-weight: 500; letter-spacing: .01em; min-height: 2.9rem; }
.hero__head .cta { margin-top: 1.5em; }
.hero__visual { position: relative; grid-column: 1 / -1; margin-top: calc(var(--pad-y) * 3 / 5); border-radius: var(--radius); overflow: hidden; background: var(--c-panel); cursor: pointer; min-height: 0; transform: translateZ(0); }
.hero__visual.is-no-webgl { background: radial-gradient(circle at 50% 50%, #2040f0 0, #141515 55%); }

.hero__scroll { position: absolute; left: var(--pad-x); right: var(--pad-x); bottom: 0; height: var(--pad-y); font-size: var(--cross); font-weight: 500; letter-spacing: .02em; }
.hero__scroll .cross { top: calc(50% - var(--cross) / 2); }
.hero__scroll .cross:nth-child(1) { left: 0; }
.hero__scroll .cross:nth-child(2) { left: calc(33.333% - var(--cross) / 2); transition-delay: .08s; }
.hero__scroll .cross:nth-child(3) { left: calc(66.666% - var(--cross) / 2); transition-delay: .16s; }
.hero__scroll .cross:nth-child(4) { left: calc(100% - var(--cross)); transition-delay: .24s; }
.hero__scroll-text { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); white-space: nowrap; transition: opacity .8s ease .5s; }
.js .hero__scroll:not(.is-in) .hero__scroll-text { opacity: 0; }

.only-touch { display: none; }
@media not all and (hover: hover) and (pointer: fine) {
	.only-mouse { display: none; }
	.only-touch { display: inline; }
}

.office { padding-top: 11vw; padding-bottom: 0; }
.office__head { position: relative; grid-column: 1 / -1; }
.office__title { font-size: 8vw; line-height: 1.05; font-weight: 500; letter-spacing: -.02em; margin-left: -.05em; }
.office__lead { position: absolute; right: 0; bottom: 1.4vw; width: calc(var(--col) * 4 + var(--gap) * 3); font-size: clamp(.8rem, 1.05vw, 1.6rem); line-height: 1.7; font-weight: 500; }

.office__strip { --office-h: clamp(13rem, 24vw, 30rem); grid-column: 1 / -1; margin: 4vw calc(-1 * var(--pad-x)) 0; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.office__strip::-webkit-scrollbar { display: none; }
.office__track { display: flex; gap: var(--gap); width: max-content; margin: 0; padding: 0 var(--pad-x); list-style: none; }
.office__item { flex: none; width: calc(var(--office-h) * var(--r, 1.5)); height: var(--office-h); border-radius: var(--radius); overflow: hidden; background: #dfe2ee; transform: translateZ(0); }
.office__item img { display: block; width: 100%; height: 100%; object-fit: cover; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; pointer-events: none; }

.office__strip.is-flow { overflow: hidden; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.office__strip.is-flow .office__track { padding: 0; will-change: transform; }
@media (hover: hover) and (pointer: fine) {
	.office__strip.is-flow { cursor: grab; }
	.office__strip.is-flow.is-drag { cursor: grabbing; }
}

.footer { padding-top: 12vw; padding-bottom: 2.4rem; row-gap: 5vw; font-size: clamp(.82rem, 1vw, 1.3rem); line-height: 1.75; }
.footer__col { position: relative; }
.footer__address { grid-column: 1 / span 3; }
.footer__name { font-weight: 700; margin-bottom: .4em; }
.footer__links { grid-column: 4 / span 3; display: flex; flex-direction: column; align-items: flex-start; }
.footer__links a { position: relative; }
.footer__links a::after { content: ""; position: absolute; left: 0; bottom: .1em; width: 100%; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: 100% 50%; transition: transform .5s var(--ease); }
@media (hover: hover) { .footer__links a:hover::after { transform: scaleX(1); transform-origin: 0 50%; } }
.footer__sub { margin-top: 2em; color: var(--c-sub); font-size: .9em; }
.footer__tel { font-size: 1.7em; font-weight: 500; line-height: 1.3; letter-spacing: -.01em; }
.footer__hours { color: var(--c-sub); font-size: .9em; }
.footer__contact { grid-column: 7 / span 6; }
.footer__big { font-size: clamp(1.6rem, 3.2vw, 5rem); line-height: 1.25; font-weight: 500; letter-spacing: -.01em; }
.footer__field { display: flex; align-items: center; justify-content: space-between; gap: 1em; width: min(100%, 36em); margin-top: 1.5em; padding: 1.25em 1.5em; border-radius: 12px; background: var(--c-dark-white); color: #2b2e3a; transition: background-color .4s, color .4s; }
.footer__field svg { flex: none; width: 1.4em; height: 1.4em; transition: transform .5s var(--ease); }
@media (hover: hover) { .footer__field:hover { background: var(--c-blue); color: #fff; } .footer__field:hover svg { transform: translate3d(.3em, 0, 0); } }

.footer__field--sub { margin-top: .7em; padding-top: 1em; padding-bottom: 1em; background: none; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .22); font-size: .92em; }
.footer__bottom { grid-column: 1 / -1; display: flex; align-items: center; gap: 2em; font-size: .82em; color: #111; }
.footer__policy { color: var(--c-sub); text-decoration: underline; text-underline-offset: .25em; }
@media (hover: hover) { .footer__policy:hover { color: var(--c-blue); } }
.footer__meta { margin-left: auto; color: var(--c-sub); }
.footer__top { flex: none; width: 3.4rem; height: 3.4rem; border-radius: 50%; background: #000; color: #fff; display: flex; align-items: center; justify-content: center; transition: background-color .4s, transform .6s var(--ease); }
.footer__top svg { width: 1.3rem; height: 1.3rem; }
@media (hover: hover) { .footer__top:hover { background: var(--c-blue); transform: translate3d(0, -.3rem, 0); } }

.next-page { position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: end; padding: calc(var(--pad-y) * 1.4) var(--pad-x) calc(var(--pad-y) * 1.9); background: #191a1c; color: #fff; }
.next-page__label { grid-column: 1 / span 4; font-size: clamp(.68rem, .8vw, 1rem); font-weight: 500; letter-spacing: .06em; line-height: 1.3; }
.next-page__title { grid-column: 1 / span 6; margin-top: .7em; font-size: 3.6vw; line-height: 1.1; font-weight: 400; letter-spacing: -.01em; }
.next-page__link { grid-column: 9 / span 4; grid-row: 2; display: flex; align-items: center; justify-content: flex-end; gap: 1em; font-size: clamp(.7rem, .85vw, 1.1rem); font-weight: 500; letter-spacing: .06em; padding-bottom: 1em; }
.next-page__link i { flex: 0 1 9em; height: 1px; background: rgba(255, 255, 255, .5); transform-origin: 0 50%; transition: transform .7s var(--ease); }
.next-page__link svg { width: 1.2em; height: 1.2em; transition: transform .7s var(--ease); }
@media (hover: hover) { .next-page:hover .next-page__link svg { transform: translate3d(.5em, 0, 0); } }
.next-page .cross { bottom: calc(var(--pad-y) * .7); color: #fff; transform: none; }
.next-page .cross:nth-of-type(1) { left: var(--pad-x); }
.next-page .cross:nth-of-type(2) { left: calc(var(--pad-x) + (100% - 2 * var(--pad-x)) * .25 - var(--cross) / 2); }
.next-page .cross:nth-of-type(3) { left: calc(50% - var(--cross) / 2); }
.next-page .cross:nth-of-type(4) { left: calc(var(--pad-x) + (100% - 2 * var(--pad-x)) * .75 - var(--cross) / 2); }
.next-page .cross:nth-of-type(5) { left: calc(100% - var(--pad-x) - var(--cross)); }

#video-overlay { position: fixed; inset: 0; z-index: 150; background: rgba(0, 0, 0, .94); display: flex; align-items: center; justify-content: center; opacity: 0; transition: opacity .5s ease; }
#video-overlay[hidden] { display: none; }
#video-overlay.is-open { opacity: 1; }
#video-overlay video { max-width: 92vw; max-height: 84vh; width: auto; height: auto; border-radius: 12px; background: #000; }
.video-overlay__close { position: absolute; right: var(--pad-x); top: var(--pad-y); padding: 0 1.6em; }

@media (max-width: 812px) {
	:root { --pad-x: 20px; --pad-y: 22px; --gap: 12px; --col: calc((100vw - 2 * var(--pad-x) - 5 * var(--gap)) / 6); --cross: .8rem; }
	.section { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.header__logo { width: 6rem; }
	.header__talk .pill__text { font-size: .8rem; }
	.pill { font-size: .78rem; }
	html.is-scrolled-down .header__logo { opacity: 1; pointer-events: auto; }

	.hero { padding-top: calc(var(--pad-y) + 4.4rem); margin-top: 22vw; }
	.hero__head { grid-column: 1 / -1; }
	.hero__title { font-size: 4.5vw; line-height: 1.5; }
	.hero__visual { margin-top: 1.2rem; margin-bottom: 1.6rem; }
	.hero__scroll { bottom: 4px; }
	.hero__scroll .cross:nth-child(2), .hero__scroll .cross:nth-child(3) { display: none; }

	.statement__title { font-size: 11.6vw; margin: 16vw 0 8vw; }
	.statement__title .l--indent { padding-left: 0; }
	.statement__content { grid-column: 1 / -1; font-size: 1rem; }
	.cta { font-size: .9rem; margin-top: 2.2em; }
	.reel-thumb-wrap { display: none; }
	.reel { margin-top: 14vw; padding: calc(2 * var(--cross)) 0; }
	html.is-gl .reel { padding-bottom: calc(2 * var(--cross)); margin-bottom: 0; }
	.reel__frame { aspect-ratio: 4 / 5; margin-top: 0; font-size: .8rem; }
	.reel-deco .cross:nth-child(2), .reel-deco .cross:nth-child(4) { display: none; }
	.reel__title { flex-direction: column; gap: 1.75em; font-size: 16vw; align-items: center; }
	.reel__btn { left: calc(50% - 4.2em); top: calc(50% - 2.7em); width: 8.4em; height: 5.4em; }
	.reel__caption { left: 1rem; right: 1rem; bottom: 1rem; }

	.office { padding-top: 22vw; }
	.office__title { font-size: 17vw; }
	.office__lead { position: relative; right: auto; bottom: auto; width: 100%; margin-top: 1.2em; font-size: .95rem; }
	.office__strip { --office-h: min(14rem, 52vw); margin-top: 2rem; }
	.office__strip:not(.is-flow) { --office-h: min(13rem, 46vw); }

	.service { padding-top: 24vw; }
	.service__title { font-size: 17vw; }
	.service__lead { position: relative; right: auto; bottom: auto; width: 100%; margin-top: 1.2em; font-size: .95rem; }
	.cards { grid-template-columns: minmax(0, 1fr); margin-top: 12vw; }

	.card { grid-column: 1 / -1; display: block; }
	.card + .card { margin-top: 12vw; }
	.card__visual { aspect-ratio: 100 / 62; }
	.card__tags { margin: 1.5em 0 .9em; }
	.card__title { font-size: 1.5rem; padding-left: 1.5em; }
	.card__title .card__arrow, .card:hover .card__title:not(.is-roll) .card__arrow { transform: none; }
	.card:hover .card__title:not(.is-roll) > span { transform: none; }
	.card__desc { margin-top: .9em; font-size: .88rem; }
	.card__more { margin-top: 1.4em; font-size: 1rem; }
	.cta--center { margin-top: 4.5em; }
	.cta--primary, .cta--dark { font-size: 1rem; }
	.cta--center.cta--primary { font-size: min(1rem, 4.1vw); }
	.cta-note { font-size: .82rem; }

	.proof__title { font-size: 12.4vw; margin: 34vw 0 9vw; }
	.proof__texts { grid-column: 1 / -1; font-size: 1rem; }
	.facts { margin-top: 2.4em; }
	.facts__value { font-size: 2.1em; }
	.facts__label { font-size: .72em; }
	.facts__note { font-size: .68em; }
	.numbers { grid-template-columns: minmax(0, 1fr); margin-top: 18vw; row-gap: 1.6em; }
	.numbers__value { font-size: 19vw; }
	.numbers__label { font-size: .82rem; }
	.proof__about { grid-column: 1 / -1; margin-top: 16vw; font-size: 1rem; }

	.journey { height: calc(var(--vh) * 430); }

	.journey__title { font-size: min(11vw, calc(var(--vh) * 9.5)); line-height: 1.3; }
	.journey__lead { font-size: min(3.9vw, calc(var(--vh) * 3.6)); bottom: calc(var(--pad-y) + var(--vh) * 5); }
	@supports (height: 100lvh) {
		html.js:not(.is-reduced) .journey__lead { bottom: calc(100lvh - 100svh + var(--pad-y) + 5svh); }
	}

	.footer { padding-top: 22vw; row-gap: 2.6rem; font-size: .9rem; }
	.footer__address, .footer__links, .footer__contact, .footer__bottom { grid-column: 1 / -1; }
	.footer__big { font-size: 2.1rem; }
	.footer__bottom { flex-wrap: wrap; gap: .6em 1.4em; }
	.footer__meta { margin-left: 0; width: 100%; order: 3; }
	.footer__top { margin-left: auto; }
	.next-page { grid-template-columns: repeat(6, minmax(0, 1fr)); padding-bottom: calc(var(--pad-y) * 3); }
	.next-page__label, .next-page__title, .next-page__link { grid-column: 1 / -1; grid-row: auto; }
	.next-page__title { font-size: 2.4rem; }
	.next-page__link { justify-content: flex-start; margin-top: 1.4em; padding-bottom: 0; font-size: .8rem; }
	.next-page .cross:nth-of-type(2), .next-page .cross:nth-of-type(4) { display: none; }
	#scroll-indicator { width: 2px; right: 6px; }
}

@media (prefers-reduced-motion: reduce) {
	.js [data-split] .ch, .js [data-split] .w, .js [data-reveal], .js .cross, .js .card .card__visual img { transition: none !important; }
}
html.is-reduced .journey, html.no-js .journey { height: calc(var(--vh) * 100); min-height: 34rem; }
html.is-reduced .journey__sticky, html.no-js .journey__sticky { position: relative; height: 100%; }
html.is-reduced .journey__flash, html.no-js .journey__flash { display: none; }
html.no-js .journey__canvas { background: radial-gradient(circle at 50% 68%, #14228f 0, #05070f 46%, #000 72%); }

@media (min-width: 813px) {
	html.is-reduced .reel-thumb-wrap { display: none; }
	html.is-reduced .reel { margin-top: 8vw; padding: calc(2 * var(--cross)) 0; }
}

html.no-js #preloader, html.no-js #scroll-indicator, html.no-js .reel, html.no-js .reel-thumb-wrap, html.no-js .ribbon, html.no-js #menu-btn { display: none; }
html.no-js .hero__visual { background: radial-gradient(circle at 50% 45%, #2040f0 0, #141515 60%); }

html.is-reduced #contact .hero__scroll-text, html.no-js #contact .hero__scroll-text { display: none; }

html.no-js #header { position: absolute; color: #fff; }
html.no-js .pill--dark { background: #fff; color: #000; }
