:root {--blue:#2455cf;--navy:#1c2f58;--ink:#303237;--muted:#70757e;--soft:#f5f6f8;--line:#dedfe4;--ease:cubic-bezier(.2,.75,.2,1)}
body {letter-spacing:.035em}
.button {border-radius:0;letter-spacing:.08em}
.button-plain {border-bottom:2px solid var(--blue);min-width:215px;position:relative;padding:13px 26px 12px 0;gap:36px}
.button-plain>span {font-size:0}
.button-plain:after {content:"";position:absolute;right:0;bottom:0;width:18px;height:18px;border-right:2px solid var(--blue);transform:skew(44deg);transform-origin:bottom right;transition:height .3s}
.button-plain:hover:after {height:25px}
.button-plain:hover {transform:none;color:var(--blue)}
.button-plain:before {content:"";position:absolute;inset:0;background:#eef3ff;z-index:-1;transform:scaleX(0);transform-origin:left;transition:transform .3s}
.button-plain:hover:before {transform:scaleX(1)}
.eyebrow {color:var(--blue)}
.preview-bar {height:24px;background:#f2f4f8;font-size:10px}
.homepage main {position:relative;overflow:clip}
.editorial-section {padding:105px 0 110px;display:grid;grid-template-columns:190px minmax(0,1fr);gap:0;position:relative}
.rail-heading {padding-left:36px;padding-top:4px;color:var(--blue)}
.rail-heading h2 {font-size:20px;letter-spacing:.13em;line-height:1.6}
.rail-heading>span {font:12px Arial,sans-serif;letter-spacing:.18em;display:block;margin-top:17px}
.rail-body {min-width:0;padding-right:0}
.rail-intro {display:flex;align-items:flex-end;justify-content:space-between;padding-right:5vw;gap:25px;margin-bottom:43px}
.rail-intro>p {font-size:17px;color:#535c6c}
.rail-intro h3 {font-size:31px;line-height:1.65;letter-spacing:.07em}
.rail-intro .button {font-size:12px;min-width:190px}
.news-section .rail-intro {margin-bottom:34px}
.motion-carousel {min-width:0;position:relative}
.motion-track {display:flex;gap:40px;overflow-x:auto;scrollbar-width:none;padding:0 5vw 15px 0;overscroll-behavior-x:contain;touch-action:pan-x pan-y;cursor:grab}
.motion-track::-webkit-scrollbar {display:none}
.motion-track.is-dragging {cursor:grabbing;user-select:none}
.motion-track.is-dragging a {pointer-events:none}
.motion-track>.article-card {flex:0 0 clamp(290px,29vw,440px)}
.motion-track>.service-card {flex:0 0 clamp(290px,30vw,450px)}
.motion-track .visual {aspect-ratio:1.8;border-radius:0}
.motion-track .article-card p {display:none}
.motion-track .article-card h3 {font-size:17px;line-height:1.9;margin-top:15px}
.motion-track .article-meta {margin-top:24px;font-size:12px}
.motion-track .article-meta>time {margin-right:auto}
.motion-track .article-meta>span {padding:0 9px}
.motion-controls {display:flex;align-items:center;gap:26px;margin:32px 5vw 0 0}
.motion-controls input[type=range] {appearance:none;-webkit-appearance:none;height:3px;min-height:3px;padding:0;border:0;border-radius:0;background:#dedfe2;width:100%;accent-color:#303237;cursor:pointer}
.motion-controls input[type=range]::-webkit-slider-thumb {appearance:none;-webkit-appearance:none;width:120px;height:3px;background:#33373c;border:0;border-radius:0}
.motion-controls input[type=range]::-moz-range-thumb {width:120px;height:3px;background:#33373c;border:0;border-radius:0}
.motion-buttons {display:flex;gap:8px;flex-shrink:0}
.motion-buttons button {border:0;border-radius:0;background:transparent;color:var(--blue);height:35px;min-width:32px;font-size:20px}
.motion-buttons button[data-motion-toggle] {font-size:14px}
.motion-buttons button:hover {background:#edf2fc}
.about-stage {display:grid;grid-template-columns:190px minmax(0,1fr);background:#f2f3f5;position:relative;padding:95px 0 105px;isolation:isolate;margin-bottom:50px;overflow:visible}
.about-copy {position:relative;z-index:2;width:58%;max-width:680px}
.about-copy h2 {font-size:30px;line-height:1.9;margin-bottom:28px}
.about-copy p {font-size:14px;line-height:2.3;letter-spacing:.035em}
.about-copy .button {margin-top:30px;background:#fff;padding-left:25px;min-width:275px}
.business-section {padding-top:110px}
.service-card h3 {font-size:22px;color:#333;margin-top:13px;gap:12px}
.service-card h3>span, .work-card h3>span {border:0;border-radius:0;width:28px;height:28px;font-size:25px}
.service-card:hover h3>span, .work-card:hover h3>span {background:transparent;color:var(--blue);transform:translate(4px,-4px)}
.service-card p {font-size:14px;color:#626670;line-height:2}
.card-kicker {font-size:11px;margin-top:22px;gap:12px}
.future-line {display:flex;gap:35px;align-items:center;border-block:1px solid #dce0e7;padding:26px 0;margin:70px 5vw 0 0}
.future-line>span {font-size:12px;color:var(--blue)}
.future-line strong {font-size:18px;font-weight:500;letter-spacing:.03em}
.future-line small {display:block;font-size:12px;margin-top:7px;color:#737986}
.future-line>i {font-style:normal;font-size:30px;margin-left:auto;margin-right:10px;transition:transform .3s}
.future-line:hover>i {transform:translate(4px,-4px)}
.poster-label {position:absolute;left:7%;top:8%;font:11px Arial;letter-spacing:.16em;z-index:2}
.visual strong {font-weight:700;line-height:1.55;letter-spacing:.04em}
.art-security {background:#1e3b83;color:#fff}
.art-security:after {content:"";position:absolute;right:-20px;bottom:-20px;width:150px;height:150px;background:radial-gradient(#ffffff38 1px,transparent 1.2px) 0 0/8px 8px}
.art-security>strong {position:absolute;right:7%;bottom:15%;font-size:clamp(22px,2.25vw,35px);text-align:right;z-index:2}
.security-frame {position:absolute;top:28%;left:8%;width:40%;height:55%;color:#83b5ff}
.security-frame>i {position:absolute;width:17px;height:17px;border-top:2px solid;border-left:2px solid;left:0;top:0}
.security-frame>i:nth-child(2) {left:auto;right:0;transform:rotate(90deg)}
.security-frame>i:nth-child(3) {top:auto;bottom:0;transform:rotate(-90deg)}
.security-frame>i:nth-child(4) {left:auto;right:0;top:auto;bottom:0;transform:rotate(180deg)}
.security-frame>span {position:absolute;top:17%;left:14%;font:bold clamp(18px,2.4vw,37px)/1.25 Arial;letter-spacing:.02em}
.scan-line {display:block;position:absolute;left:-15%;top:0;width:130%;height:1px;background:#94c6ff;animation:scan 4s ease-in-out infinite alternate}
.art-support {background:#e8effb;color:#1947a0}
.art-support>strong {position:absolute;left:8%;bottom:20%;font-size:clamp(24px,2.6vw,40px);z-index:2}
.support-rings {position:absolute;inset:0}
.support-rings i {position:absolute;border:20px solid #4175dc;border-radius:50%;width:57%;aspect-ratio:1;right:-12%;top:13%;transform:rotate(-25deg)}
.support-rings i+ i {width:46%;right:15%;top:38%;border:1px solid #668bd2;animation:ring-shift 9s ease-in-out infinite alternate}
.support-note {position:absolute;bottom:7%;left:8%;font-size:10px;letter-spacing:.05em}
.art-development {background:#edf0f5;color:#30446b}
.art-development>strong {position:absolute;left:7%;bottom:13%;font-size:clamp(23px,2.4vw,36px);z-index:2;background:#edf0f5e8;padding:3px 10px 3px 0}
.screen-frame {position:absolute;right:-14%;top:23%;width:78%;transform:rotate(-8deg);box-shadow:0 8px 20px #12214312;border:5px solid #fff;background:#fff}
.screen-frame>div {display:flex;gap:4px;height:12px}
.screen-frame i {height:3px;width:3px;background:#b4bfce;border-radius:50%;margin-top:2px}
.screen-frame img {width:100%;height:auto}
.art-training {background:#ecf4f0;color:#175557}
.art-training strong {position:absolute;left:12%;top:24%;font-size:clamp(24px,2.8vw,43px);display:flex;gap:8px;line-height:1.3;z-index:2}
.art-training strong span {writing-mode:vertical-rl}
.art-training strong span:nth-child(2) {margin-top:24px}
.art-training strong span:nth-child(3) {margin-top:48px}
.art-training>i {position:absolute;width:95px;height:95px;background:#9ac9c3;right:9%;top:22%;clip-path:polygon(0 0,0 100%,100% 100%)}
.art-training>i:nth-of-type(2) {right:-5%;top:64%;background:#397b7c;width:120px;height:120px}
.art-training>i:nth-of-type(3) {right:22%;top:65%;width:40px;height:40px;background:#c6e3db}
.art-brand {background:#f1f4fa}
.art-brand .brand-art-word {font-size:35px;letter-spacing:-1px}
.art-brand i {background:#3561c1}
.art-brand i:nth-of-type(2) {background:#a4c3ed}
.art-brand i:nth-of-type(3) {background:#dce7f7}
.article-grid .visual strong {font-size:27px}
.article-grid .security-frame>span {font-size:27px}
.article-cover.visual strong {font-size:48px}
.detail-visual.visual strong {font-size:42px}
.detail-visual .security-frame>span {font-size:48px}
.detail-visual .art-training strong {font-size:48px}
.work-stage {background:#f5f6f8;padding-top:100px}
.work-editorial {display:grid;grid-template-columns:1fr 1fr;gap:48px;padding-right:5vw;align-items:start}
.work-editorial .work-image {padding:32px 24px;border-radius:0;background:#e2e7ef;aspect-ratio:1.35}
.work-editorial>.work-card:nth-child(2) .work-image {background:#e0ebe8}
.work-editorial .work-image img {border:0;border-radius:0;box-shadow:0 14px 30px #10234e17}
.work-editorial h3 {font-size:22px}
.work-editorial .tags span {background:transparent;border:0;padding:0;margin-right:9px;font-size:11px;color:#557097}
.work-editorial .tags span:before {content:"#"}
.work-editorial p {font-size:14px}
.work-editorial .work-client {font-size:12px}
.join-stage {position:relative;overflow:hidden;padding:110px 15% 150px;display:grid;grid-template-columns:1fr 1fr;gap:80px;isolation:isolate}
.join-label>span {font:72px/1.2 Arial,sans-serif;font-weight:700;letter-spacing:-.04em;color:var(--blue)}
.join-label>p {font-size:15px;margin-top:12px;color:var(--blue);letter-spacing:.15em}
.join-copy h2 {font-size:48px;line-height:1.6;letter-spacing:.08em}
.join-copy>p {font-size:14px;line-height:2.3;margin-top:22px}
.join-copy .button {margin-top:30px;font-size:13px;min-width:270px}
.join-stripes {position:absolute;left:-70px;bottom:30px;width:420px;height:300px;z-index:-1}
.join-stripes i {position:absolute;width:90px;height:500px;left:100px;top:-60px;transform:rotate(-40deg);background:#bfd6fa}
.join-stripes i:nth-child(2) {left:230px;width:35px;background:#2e5ec3}
.join-stripes i:nth-child(3) {left:300px;width:10px;background:#8bafe8}
.join-outline {position:absolute;bottom:-55px;left:27%;font:180px/1 Arial,sans-serif;white-space:nowrap;-webkit-text-stroke:1px #dae3f3;color:transparent;letter-spacing:-.05em;font-weight:700;z-index:-1}
.contact-editorial {padding:70px 10% 75px;background:#f1f4fa;display:flex;justify-content:space-between;align-items:center;gap:30px}
.contact-editorial>div>span {font:12px Arial;letter-spacing:.16em;color:var(--blue)}
.contact-editorial h2 {font-size:38px;margin-top:16px}
.contact-editorial p {font-size:14px;color:#6e7889;margin-top:15px}
.contact-editorial>a {width:35%;min-height:120px;border-bottom:2px solid var(--blue);display:flex;align-items:center;justify-content:space-between;color:var(--blue);font-size:16px;transition:padding .3s}
.contact-editorial>a i {font-size:60px;line-height:1;font-style:normal}
.contact-editorial>a:hover {padding-left:15px}
footer {background:#fff;padding-top:70px}
.footer-bottom {font-size:12px}
.footer-bottom small {font-size:12px}
.footer-links {font-size:13px;gap:25px 40px}
.subpage .page-head {position:relative;overflow:hidden}
.subpage .page-head:after {content:"";position:absolute;right:2%;top:80px;width:130px;height:350px;transform:rotate(-40deg);background:#f0f4fc;z-index:-1}
.subpage .service-card .visual, .subpage .detail-visual, .subpage .article-cover {border-radius:0}
@keyframes scan {to{top:100%}}
@keyframes ring-shift {to{transform:translate(14px,-12px)}}
.js-motion .reveal, .js-motion .work-editorial>.work-card {opacity:0;transform:translateY(35px);transition:opacity .85s var(--ease),transform .85s var(--ease)}
.js-motion .reveal.is-visible, .js-motion .work-editorial>.work-card.is-visible {opacity:1;transform:none}
html[data-motion-paused=true] *, html[data-motion-paused=true] *:before, html[data-motion-paused=true] *:after {animation-play-state:paused!important}
html[data-motion-paused=true] .reveal {opacity:1;transform:none}
@media(min-width:1600px) {
.editorial-section, .about-stage {grid-template-columns:240px minmax(0,1fr)}
.rail-heading {padding-left:55px}
.about-copy h2 {font-size:36px}
.about-copy p {font-size:16px}
}
@media(max-width:1100px) {
.editorial-section, .about-stage {grid-template-columns:155px minmax(0,1fr)}
.rail-heading {padding-left:25px}
.rail-heading h2 {font-size:17px}
.about-copy {width:64%}
.about-copy h2 {font-size:26px}
.join-stage {padding-inline:10%;gap:45px}
.join-label>span {font-size:57px}
.join-copy h2 {font-size:40px}
.motion-track {gap:28px}
.work-editorial {gap:25px}
.work-editorial h3 {font-size:19px}
.rail-intro h3 {font-size:27px}
.rail-intro .button {min-width:155px;font-size:11px}
.future-line {gap:20px}
}
@media(max-width:820px) {
.editorial-section {display:block;padding:65px 0}
.rail-heading {padding:0 24px;margin-bottom:30px;display:flex;align-items:center;gap:18px}
.rail-heading h2 {font-size:19px}
.rail-heading>span {margin-top:0;font-size:11px}
.rail-body {padding-left:24px}
.rail-intro {padding-right:24px;margin-bottom:30px}
.rail-intro h3 {font-size:27px}
.motion-track>.article-card, .motion-track>.service-card {flex-basis:320px}
.motion-controls {margin-right:24px}
.about-stage {display:block;padding:65px 0 100px;margin-bottom:20px}
.about-copy {margin-left:24px;width:67%;max-width:560px}
.about-copy h2 {font-size:27px}
.about-copy p {font-size:13px}
.business-section {padding-top:90px}
.work-editorial {padding-right:24px}
.work-editorial h3 {font-size:18px}
.work-editorial .work-image {padding:20px}
.work-editorial p {font-size:13px}
.future-line {margin-right:24px}
.future-line strong {font-size:16px}
.future-line>span {font-size:11px}
.join-stage {padding:75px 7% 95px;gap:35px}
.join-label>span {font-size:46px}
.join-copy h2 {font-size:35px}
.join-copy p {font-size:13px}
.join-copy .button {min-width:225px;font-size:12px}
.join-stripes {opacity:.7;width:300px}
.join-outline {font-size:130px;bottom:-35px}
.contact-editorial {padding:55px 6%}
.contact-editorial h2 {font-size:29px}
.contact-editorial p {font-size:12px}
.contact-editorial>a {font-size:13px;min-height:95px}
.contact-editorial>a i {font-size:40px}
.visual strong, .detail-visual.visual strong {font-size:29px}
.security-frame>span, .detail-visual .security-frame>span {font-size:29px}
}
@media(max-width:560px) {
.rail-heading {padding-inline:22px;margin-bottom:25px}
.rail-heading h2 {font-size:19px}
.rail-heading>span {font-size:11px}
.editorial-section {padding-block:58px}
.rail-body {padding-left:22px}
.rail-intro {padding-right:22px;display:block;margin-bottom:26px}
.rail-intro>p {font-size:14px}
.rail-intro .button {margin-top:15px;font-size:11px;min-width:180px;min-height:40px;padding-block:8px}
.rail-intro h3 {font-size:26px;line-height:1.7}
.motion-track {gap:25px;padding-right:22px}
.motion-track>.article-card, .motion-track>.service-card {flex-basis:82vw;max-width:355px}
.motion-track .article-card h3 {font-size:16px}
.motion-track .article-meta {font-size:10px;margin-top:18px}
.motion-controls {margin:21px 22px 0 0;gap:12px}
.motion-controls input[type=range]::-webkit-slider-thumb {width:65px}
.motion-controls input[type=range]::-moz-range-thumb {width:65px}
.motion-buttons {gap:2px}
.motion-buttons button {height:32px;min-width:28px;font-size:18px}
.about-stage {padding:55px 0;margin-bottom:0}
.about-copy {margin-left:22px;width:calc(100% - 44px)}
.about-copy h2 {font-size:25px;line-height:1.85;margin-bottom:25px;letter-spacing:.02em}
.about-copy p {font-size:13px;line-height:2.25}
.about-copy p br {display:none}
.about-copy .button {font-size:12px;min-width:235px;margin-top:24px;padding-left:20px}
.business-section {padding-top:72px}
.service-card h3 {font-size:21px}
.service-card p {font-size:13px;max-width:100%}
.card-kicker {font-size:10px;margin-top:18px}
.future-line {margin:40px 22px 0 0;padding-block:22px;gap:10px;flex-wrap:wrap}
.future-line>span {width:100%;font-size:11px}
.future-line>div {max-width:84%}
.future-line strong {font-size:14px}
.future-line small {font-size:11px}
.future-line>i {font-size:24px;margin-right:0}
.poster-label {font-size:10px}
.visual strong, .detail-visual.visual strong {font-size:28px}
.security-frame>span, .detail-visual .security-frame>span {font-size:28px}
.support-rings i {border-width:15px}
.support-rings i+ i {border-width:1px}
.art-training>i {width:70px;height:70px}
.art-training>i:nth-of-type(2) {width:90px;height:90px}
.art-training strong {font-size:30px}
.art-brand .brand-art-word {font-size:32px}
.work-editorial {grid-template-columns:1fr;padding-right:22px;row-gap:45px}
.work-editorial>.work-card {display:block}
.work-editorial .work-image {aspect-ratio:1.5;padding:25px}
.work-editorial h3 {font-size:21px}
.work-editorial p {font-size:13px}
.join-stage {display:block;padding:65px 22px 115px}
.join-label>span {font-size:42px}
.join-label>p {font-size:12px;margin-top:8px}
.join-copy {margin-top:30px;margin-left:16%}
.join-copy h2 {font-size:36px}
.join-copy>p {font-size:13px}
.join-copy .button {font-size:12px;min-width:240px}
.join-stripes {left:-180px;bottom:0;opacity:.6}
.join-outline {font-size:90px;bottom:-20px;left:18%}
.contact-editorial {display:block;padding:50px 22px}
.contact-editorial>div>span {font-size:11px}
.contact-editorial h2 {font-size:29px}
.contact-editorial>a {width:100%;margin-top:15px;min-height:78px;font-size:14px}
.contact-editorial>a i {font-size:40px}
.footer-bottom {font-size:11px}
.footer-bottom small {font-size:11px}
.article-cover.visual strong {font-size:29px}
.detail-visual .poster-label {font-size:11px}
.news-section .rail-intro {margin-bottom:26px}
}
@media(prefers-reduced-motion:reduce) {
.js-motion .reveal, .js-motion .work-editorial>.work-card {opacity:1;transform:none}
*, *:before, *:after {animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media(min-width:821px) and (max-width:1100px) {
.rail-heading h2 {font-size:16px;letter-spacing:.06em}
.about-stage .rail-heading {padding-right:16px}
.about-copy {width:68%}
}
.visual {container-type:inline-size}
.art-security>strong {max-width:52%;font-size:clamp(19px,6.8cqw,41px)}
.security-frame {width:31%;left:7%}
.security-frame>span, .detail-visual .security-frame>span {font-size:clamp(17px,7cqw,43px);left:10%}
.art-support>strong {font-size:clamp(23px,8.2cqw,52px)}
.art-development>strong {font-size:clamp(22px,7.8cqw,48px)}
.art-training strong {font-size:clamp(27px,9cqw,56px)}
.security-frame>span, .detail-visual .security-frame>span {font-size:clamp(16px,6cqw,38px);white-space:nowrap}
