@font-face {
  font-family: "MGT Fugiat";
  src: url("fonts/MGTFugiat-Regular.otf?v=7e5182e8") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --black: #000;
  --white: #fff;
  --grey: #d9d9d9;
  --accent: rgba(95, 157, 196, 0.25);
  --gutter: 20rem;
  --edge: 2rem;
  --space-4: 0.4rem;
  --space-8: 0.8rem;
  --space-12: 1.2rem;
  --space-16: 1.6rem;
  --space-20: 2rem;
  --space-24: 2.4rem;
  --space-32: 3.2rem;
  --space-80: 8rem;
  --space-section: 28rem;
  --parallax: 0.15;
  --ease: cubic-bezier(.4, 0, .2, 1);
}

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

html {
  font-size: calc(100vw / 192);
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 1024px;
  background: var(--white);
  color: var(--black);
  font-family: "MGT Fugiat", "Manrope", system-ui, sans-serif;
  font-weight: 400;
  font-size: 1.8rem;
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
p, h1, h2, h3, h4, figure, blockquote, dl, dd, ul { margin: 0; padding: 0; }
h1, h2, h3, h4, b, strong { font-weight: 400; font-synthesis: none; }
ul { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

.br-m { display: none; }

.h1    { font-size: max(1.8rem, 15px); line-height: 1.1;  letter-spacing: -0.02em; }
.h3    { font-size: max(3.4rem, 28px); line-height: 1.1;  letter-spacing: -0.04em; }
.h4    { font-size: max(2.2rem, 18px); line-height: 1.1;  letter-spacing: -0.04em; }
.text-m{ font-size: max(1.8rem, 15px); line-height: 1.4;  letter-spacing: -0.02em; }
.text-s{ font-size: max(1.4rem, 12px); line-height: 1.4;  letter-spacing: -0.02em; }
.h2,
.caps,
.btn {
  font-size: max(1.4rem, 11px);
  line-height: 1.2; letter-spacing: 0.04em;
  text-transform: uppercase;
}

.btn {
  display: inline-flex; align-items: center;
  padding: var(--space-12) var(--space-24);
  border-radius: 0.6rem;
  background: var(--accent);
  transition: background .25s var(--ease);
}
@media (hover: hover) and (pointer: fine) { .btn:hover { background: rgba(95, 157, 196, 0.45); } }

.header {
  position: absolute; inset: 0 0 auto 0;
  height: 10.3rem;
}
:root { --logo-w: 18rem; --logo-h: 10.3rem; --logo-x: 0px; --logo-y: 0px; }
.header__logo {
  display: block;
  position: fixed; left: var(--logo-x); top: var(--logo-y); z-index: 20;
  width: var(--logo-w); height: var(--logo-h);
  mix-blend-mode: multiply;
  overflow: hidden;
  transition: opacity .6s var(--ease),
              width .6s var(--ease), height .6s var(--ease),
              left .6s var(--ease), top .6s var(--ease);
}
.header__logo.is-dim { opacity: .05; }
.header__logo img { width: 100%; height: 100%; object-fit: cover; }

.header__tagline {
  position: fixed; left: var(--gutter); top: var(--space-32); z-index: 20;
  white-space: nowrap;
  transition: opacity .6s var(--ease);
}
.header__tagline.is-hidden { opacity: 0; pointer-events: none; }
@media (hover: hover) and (pointer: fine) {
  .header__logo:hover { opacity: 1; }
  .header__logo:hover ~ .header__tagline { opacity: 1; }
}
.header__tagline strong {
  font-weight: 400;
  -webkit-text-stroke: 0.05rem currentColor;
}

.header .header__cta {
  position: fixed; right: var(--edge); top: var(--space-20); z-index: 20;
}

.hero {
  min-height: 100vh;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 12rem 0 var(--space-20);
  overflow: hidden;
}
.marquee { width: 100%; overflow: hidden; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.marquee__track {
  display: flex; align-items: flex-end;
  width: max-content;
  padding-left: var(--edge);
  will-change: transform;
}
.slide {
  --h: 55vh;
  --h: 55svh;
  position: relative;
  flex: 0 0 auto;
  margin-right: var(--space-20);
  width: var(--w);
}
.slide__link { position: absolute; inset: 0; z-index: 1; cursor: inherit; -webkit-user-drag: none; }
.slide__link:focus-visible { outline: 2px solid var(--black); outline-offset: 0.4rem; }
.slide figcaption {
  margin-bottom: var(--space-8);
  white-space: nowrap;
}
.slide__media {
  position: relative;
  height: var(--h); width: 100%;
  overflow: hidden;
  background: var(--grey);
}
.slide__media img,
.slide__media video {
  position: absolute; top: 0; left: calc(var(--parallax) * -100%);
  width: calc(100% + var(--parallax) * 200%); max-width: none; height: 100%;
  object-fit: cover;
  will-change: transform;
  pointer-events: none; -webkit-user-drag: none;
}
.slide--s  { --w: calc(var(--h) * 0.625); }
.slide--l  { --w: calc(var(--h) * 0.812); }
.slide--xl { --w: calc(var(--h) * 1.133); }
.slide--sq { --w: var(--h); }

.culture {
  position: relative;
  padding: var(--space-80) var(--edge) 0 var(--gutter);
}
.culture__title { margin-top: var(--space-24); width: 111.8rem; }

.culture__aside {
  margin: var(--space-section) 0 0 auto;
  width: 58.2rem;
}
.culture__images { display: flex; gap: var(--space-20); }
.culture__images img {
  width: 28.1rem; height: 34.6rem; object-fit: cover; background: var(--grey);
}
.culture__sub {
  margin-top: var(--space-24);
  width: 57.6rem;
}

.services {
  position: relative;
  display: flex; align-items: flex-end; justify-content: space-between;
  padding: var(--space-section) var(--edge) 0 var(--gutter);
}
.services__list { width: 87rem; }

.services__intro {
  display: flex; gap: var(--space-20);
  padding: var(--space-24) 0 var(--space-80);
  border-top: 1px solid var(--black);
}
.services__intro .h2 { width: 33rem; flex: 0 0 auto; }
.services__intro .h4 { flex: 1; }

.acc__item { position: relative; border-top: 1px solid var(--black); }
.acc__item:last-child { border-bottom: 1px solid var(--black); }

.acc__head {
  display: flex; gap: var(--space-20); align-items: flex-start;
  width: 100%;
  padding: var(--space-20) 0 0;
  text-align: left;
  letter-spacing: inherit;
}
.acc__head::before { content: ""; position: absolute; inset: 0; }
.acc__title { flex: 1; }
.acc__title .hov { overflow: visible; }
.acc__title .hov__t::after { content: none; }
.acc__icon {
  flex: 0 0 auto;
  width: 0.8rem; height: 0.8rem;
  margin-top: calc((1.1em - 0.8rem) / 2);
  border: 1px solid var(--black);
  background: transparent;
  transition: background .35s var(--ease);
}
.acc__item.is-open .acc__icon { background: var(--black); }
@media (hover: hover) and (pointer: fine) { .acc__head:hover .acc__icon { background: var(--black); } }

.acc__panel {
  display: grid; grid-template-rows: 0fr;
  padding-bottom: var(--space-20);
  transition: grid-template-rows .5s var(--ease), margin-top .5s var(--ease), padding-bottom .5s var(--ease);
}
.acc__item.is-open .acc__panel { grid-template-rows: 1fr; margin-top: calc(max(2.2rem, 18px) * -1.1); padding-bottom: 0; }
.acc__body {
  overflow: hidden;
  margin-left: 35rem;
  width: 48.4rem;
  display: flex; flex-direction: column; gap: var(--space-24);
  opacity: 0;
  transition: opacity .15s var(--ease);
}
.acc__item.is-open .acc__body { position: relative; z-index: 1; opacity: 1; transition: opacity .3s var(--ease) .25s; }
.acc__body > :first-child { margin-top: 0.29rem; }
.acc__body > :last-child  { margin-bottom: var(--space-24); }
.acc__body .btn { align-self: flex-start; }

.services .acc {
  min-height: var(--acc-h, auto);
  display: flex; flex-direction: column; justify-content: flex-end;
}

.services__visual {
  position: relative;
  width: 28.1rem; height: 33.3rem;
  margin-bottom: 0;
  background: var(--grey);
  overflow: hidden;
}
.services__img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover;
  opacity: 0; transform: scale(1.04);
  transition: opacity .6s var(--ease), transform .8s var(--ease);
}
.services__img.is-active { opacity: 1; transform: none; }

.work { padding: var(--space-section) var(--edge) 0; }
.work__label { margin-bottom: var(--space-32); }
.work__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-80) var(--space-20);
}
.work__item { display: block; }
.work__img {
  aspect-ratio: 930 / 902;
  background: var(--grey);
  overflow: hidden;
}
.work__img img,
.work__img video {
  width: 100%; height: 100%; object-fit: cover;
}
.work__name { margin-top: var(--space-16); }
.work__name { text-box: trim-end cap alphabetic; }
.work__cat  { text-box: trim-start cap alphabetic; margin-top: var(--space-8); }
@supports not (text-box: trim-both cap alphabetic) {
  .work__cat { margin-top: -0.31rem; }
}

.words {
  position: relative;
  margin-top: var(--space-section);
  min-height: max(93.8rem, 128vh);
  color: var(--white);
}
.words__bg { position: absolute; inset: 0; }
.words__bg img { width: 100%; height: 100%; object-fit: cover; }
.words__sticky {
  position: sticky; top: 0;
  padding: var(--space-80) var(--edge) var(--space-80) 0;
}
.words__inner {
  position: relative;
  margin-left: auto;
  width: 83rem;
}
.words__inner .h2,
.words__inner blockquote,
.words__author,
.words__role { text-box: trim-both cap alphabetic; }
.words__inner blockquote { margin-top: var(--space-24); }
.words__author {
  margin-top: var(--space-24);
}
.words__role {
  margin-top: var(--space-12);
}
@supports not (text-box: trim-both cap alphabetic) {
  .words__inner blockquote { margin-top: 1.27rem; }
  .words__author { margin-top: 1.18rem; }
  .words__role { margin-top: 0.09rem; }
}

.team {
  position: relative;
  --team-step: 70vh;
  height: calc(var(--members, 3) * var(--team-step) + 100vh);
}
.team__sticky {
  position: sticky; top: 0;
  height: 100vh;
  display: flex; flex-direction: column;
  padding: var(--space-80) var(--edge) var(--space-80) var(--gutter);
}
.team__head { margin-top: auto; }
.team__title { margin-top: var(--space-24); width: 87rem; }

.team__member {
  position: relative; flex: 0 0 auto;
  height: 41.1rem;
  margin: var(--space-80) 0 auto;
}
.team__photo {
  position: absolute; left: 27.5rem; top: 0;
  width: 32.1rem; height: 41.1rem;
  background: var(--grey);
  overflow: hidden;
}
.team__pic {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%;
  opacity: 0; transform: scale(1.05);
  transition: opacity .7s var(--ease), transform 1s var(--ease);
}
.team__pic.is-active { opacity: 1; transform: none; }

.team__text {
  position: absolute; left: 87rem; top: 50%; transform: translateY(-50%);
  width: 48rem;
  display: grid;
}
.team__desc {
  position: relative; grid-area: 1 / 1; align-self: center;
  opacity: 0; transform: translateY(1.2rem);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
  pointer-events: none;
}
.team__desc.is-active { opacity: 1; transform: none; pointer-events: auto; transition-delay: .1s; }
.team__desc .h4     { text-box: trim-end cap alphabetic; }
.team__desc .text-m { text-box: trim-both cap alphabetic; margin-top: var(--space-32); }
.team__links { display: flex; gap: var(--space-24); margin-top: calc(var(--space-32) - 0.257em); }
@supports not (text-box: trim-both cap alphabetic) {
  .team__desc .text-m { margin-top: 2.18rem; }
}

.approach {
  position: relative;
  --approach-extra: 5.6rem;
  height: calc(164.4rem + var(--approach-extra));
  color: var(--white);
}
.approach__bg { position: absolute; inset: 0; overflow: hidden; }
.approach__bg img {
  width: 100%; height: 100%; object-fit: cover;
  transform: scaleX(-1);
}
.approach__bg::after {
  content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .2);
}
.approach__headwrap {
  position: absolute; left: 0; right: 0; top: 0;
  height: calc(91.6rem + var(--approach-extra) - var(--gutter));
  padding-top: 12rem;
  pointer-events: none;
}
.approach__head {
  position: sticky; top: 12rem;
  margin-left: var(--gutter);
  width: 87rem;
}
.approach__head .h3 { margin-top: var(--space-24); }

.approach__points { position: absolute; inset: 0; }
.point {
  position: absolute;
  display: flex; gap: var(--space-24); align-items: flex-start;
  opacity: 0; transform: translateY(2.4rem);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.point.is-visible { opacity: 1; transform: none; }
.point p {
  width: max(32rem, 17.8em);
}
.point b { font-weight: 400; -webkit-text-stroke: 0.05rem currentColor; }
.point__icon {
  flex: 0 0 auto;
  width: 0.8rem; height: 0.8rem;
  margin-top: calc((1.4em - 0.8rem) / 2);
  background: var(--white);
}
.point--1 { right: 50.8rem; top: calc(91.6rem  + var(--approach-extra)); }
.point--2 { right: 7.8rem;  top: calc(106.5rem + var(--approach-extra)); }
.point--3 { right: 50.8rem; top: calc(121.2rem + var(--approach-extra)); }
.point--4 { right: 7.8rem;  top: calc(138.5rem + var(--approach-extra)); }

.contact {
  position: relative;
  display: flex; justify-content: space-between; align-items: flex-start;
  padding: var(--space-section) var(--edge) 0 var(--gutter);
}
.contact__left {
  width: 89rem;
  min-height: 84.5rem;
  display: flex; flex-direction: column;
}
.contact__title { margin-top: var(--space-24); width: 87rem; }

.contact__rows { margin-top: auto; }
.contact__row {
  display: flex; gap: var(--space-20); align-items: center;
  padding: var(--space-4) 0;
}
.contact__row dt { width: 14.15rem; flex: 0 0 auto; }

.contact__photo {
  position: relative;
  width: 58.2rem; height: 84.5rem;
  overflow: hidden;
  color: var(--white);
}
.contact__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.contact__photo::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 40.8%, rgba(0,0,0,.5) 100%);
}
.contact__photo figcaption {
  position: absolute; left: var(--space-32); bottom: var(--space-32); z-index: 1;
  display: flex; flex-direction: column; gap: var(--space-8);
  width: 27.3rem;
}

.footer {
  position: relative;
  margin-top: var(--space-section);
  height: 129.1rem;
  color: var(--white);
  overflow-x: clip;
}
.footer__bg { position: absolute; inset: 0; overflow: hidden; }
.footer__bg img { width: 100%; height: 100%; object-fit: cover; }

.footer__topwrap {
  position: absolute; inset: 0;
  padding-top: var(--space-80);
  pointer-events: none;
}
.footer__top {
  position: sticky; top: calc(50vh - 1.2rem);
  margin: 0 var(--edge) 0 var(--gutter);
  display: flex; justify-content: space-between;
  pointer-events: auto;
}
.footer__motto { width: 58.2rem; }

.footer__bottom {
  position: absolute; left: calc(var(--gutter) - var(--space-24)); right: calc(var(--edge) - var(--space-24)); bottom: calc(var(--space-32) - var(--space-16));
  display: flex; justify-content: space-between;
}
.footer__social { display: flex; gap: var(--space-12); }
.footer__links  { width: calc(58.2rem + 2 * var(--space-24)); display: flex; gap: var(--space-12); }
.footer__social > *,
.footer__links > * { display: block; padding: var(--space-16) var(--space-24); }
.footer__links button { letter-spacing: inherit; text-transform: inherit; line-height: inherit; text-align: left; }

.hov {
  position: relative;
  display: inline-block;
  overflow: hidden;
  vertical-align: top;
}
.hov__t {
  position: relative;
  display: block;
  transition: transform .5s cubic-bezier(.7, 0, .2, 1);
}
.hov__t::after {
  content: attr(data-label);
  position: absolute; left: 0; top: 100%;
  white-space: nowrap;
}
.hov__t.is-in { transform: translateY(-100%); }
.hov__t.no-anim { transition: none; }

.popup { position: fixed; inset: 0; z-index: 50; display: flex; justify-content: flex-end; align-items: stretch; padding: var(--space-20) var(--space-20) var(--space-20) 0; }
.popup[hidden] { display: none; }
.popup__backdrop {
  position: absolute; inset: 0;
  background: rgba(0, 0, 0, .55);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  opacity: 0; transition: opacity .4s var(--ease);
}
.popup__panel {
  position: relative;
  width: 58.8rem; max-width: 100%; height: 100%;
  overflow: auto;
  display: flex; flex-direction: column;
  background: var(--white); color: var(--black);
  --panel-pb: var(--space-32);
  padding: var(--space-32) var(--space-32) var(--panel-pb);
  opacity: 0; transform: translateX(3rem);
  transition: opacity .5s var(--ease), transform .5s var(--ease);
}
.popup.is-open .popup__backdrop { opacity: 1; }
.popup.is-open .popup__panel { opacity: 1; transform: none; }
body.popup-open { overflow: hidden; }

.popup__close {
  position: absolute; right: var(--space-20); top: var(--space-20);
  width: 4rem; height: 4rem;
  display: grid; place-items: center;
}
.popup__close span { position: relative; width: 1.6rem; height: 1.6rem; display: block; }
.popup__close span::before, .popup__close span::after {
  content: ""; position: absolute; left: 0; top: 50%;
  width: 1.6rem; height: 1.5px; margin-top: -0.75px; background: var(--black);
  transform: rotate(45deg); transition: transform .35s var(--ease);
}
.popup__close span::after { transform: rotate(-45deg); }
@media (hover: hover) and (pointer: fine) {
  .popup__close:hover span::before { transform: rotate(135deg); }
  .popup__close:hover span::after  { transform: rotate(45deg); }
}

.inquiry__title { margin-top: var(--space-24); }
.inquiry .text-m { font-size: max(1.6rem, 15px); }
.inquiry__row { margin: var(--space-32) 0 0; border: 0; padding: 0; min-width: 0; flex: 0 0 auto; }
.inquiry__row legend, .inquiry__field > span { display: block; padding: 0; }

.inquiry input[type="text"],
.inquiry input[type="email"],
.inquiry textarea {
  font: inherit; color: inherit; letter-spacing: inherit;
  background: none; border: 0; border-bottom: 1px solid var(--black); border-radius: 0;
  padding: 0 0 1px; outline: none; width: 100%;
  transition: border-color .25s;
}
.inquiry input::placeholder, .inquiry textarea::placeholder { color: rgba(0, 0, 0, .35); }
.inquiry input:focus, .inquiry textarea:focus { border-bottom-color: var(--black); }
.inquiry input:focus-visible, .inquiry textarea:focus-visible { box-shadow: 0 1px 0 0 var(--black); }
.inquiry { --error: #c0392b; --error-bg: rgba(192, 57, 43, .08); }
.inquiry input:invalid.is-touched, .inquiry textarea:invalid.is-touched {
  border-bottom-color: var(--error);
  background: var(--error-bg);
  box-shadow: 0 0 0 0.6rem var(--error-bg);
}
.inquiry__row:has(.chip input:invalid.is-touched) .chip span { border-color: var(--error); background: var(--error-bg); }
.inquiry textarea { resize: none; display: block; line-height: 1.4; overflow-y: hidden; max-height: 14em; }

.inquiry__field > :last-child { margin-top: var(--space-8); }

.chips { display: flex; flex-wrap: wrap; gap: var(--space-8); margin-top: var(--space-8); }
.chip { position: relative; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.chip input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.chip span {
  display: inline-flex; align-items: center;
  padding: var(--space-8) var(--space-16); border-radius: 0.6rem;
  border: 1px solid var(--black);
  font-size: max(1.2rem, 11px);
  transition: background .25s var(--ease), border-color .25s var(--ease);
}
@media (hover: hover) and (pointer: fine) { .chip:hover span { background: rgba(95, 157, 196, 0.12); } }
.chip input:checked + span { background: var(--accent); border-color: transparent; }
@media (hover: hover) and (pointer: fine) { .chip input:focus-visible + span { outline: 2px solid var(--black); outline-offset: 2px; } }

.inquiry { display: flex; flex-direction: column; flex: 1 0 auto; }
.inquiry__actions {
  margin-top: auto; padding-top: var(--space-4); display: flex; flex: 0 0 auto;
  position: sticky; bottom: calc(-1 * var(--panel-pb)); z-index: 1;
  margin-bottom: calc(-1 * var(--panel-pb)); padding-bottom: var(--panel-pb);
  background: var(--white);
}
.inquiry__actions::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 100%; height: 8rem;
  background: linear-gradient(rgba(255, 255, 255, 0), var(--white));
  pointer-events: none;
  opacity: 0; transition: opacity .3s var(--ease);
}
.popup__panel.has-more .inquiry__actions::before { opacity: 1; }
.inquiry__field:has(input[type="email"]) { margin-bottom: calc(var(--space-32) - var(--space-4)); }
.inquiry__actions .btn { flex: 1; justify-content: center; min-height: 4.4rem; padding-top: 0; padding-bottom: 0; background: var(--black); color: var(--white); cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .inquiry__actions .btn:hover { background: #222; } }
.inquiry__error { margin-top: var(--space-32); color: #c0392b; }
.inquiry__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.inquiry__actions .btn:disabled { opacity: .5; cursor: default; }
.inquiry__error[hidden] { display: none; }

.inquiry[hidden],
.inquiry__done[hidden] { display: none; }
.inquiry__done .h4 { margin-top: var(--space-24); }
.inquiry__follow { display: flex; gap: var(--space-32); margin-top: var(--space-32); }

.work[data-reveal] .work__img { position: relative; }
.work[data-reveal] .work__img img,
.work[data-reveal] .work__img video {
  position: absolute; left: 0; top: calc(var(--parallax) * -100%);
  width: 100%; height: calc(100% + var(--parallax) * 200%);
  max-width: none;
  transform: var(--reveal-shift, none);
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
  .slide[data-href], .work__item { cursor: none; }
}
.cursor {
  position: fixed; left: 0; top: 0; z-index: 90;
  pointer-events: none;
  opacity: 0; transform: translate(0, -50%) scale(.6);
  transition: opacity .25s var(--ease), transform .35s var(--ease);
  will-change: left, top;
}
.cursor.is-on { opacity: 1; transform: translate(0, -50%) scale(1); }
.cursor__label {
  display: inline-flex; align-items: center; gap: var(--space-8); white-space: nowrap;
  padding: var(--space-8); border-radius: 0.6rem;
  color: var(--white);
  background: rgba(0, 0, 0, .15);
  backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
}
.cursor__label::before { content: ""; width: 0.6rem; height: 0.6rem; background: currentColor; }
@media (hover: none), (pointer: coarse) { .cursor { display: none; } }

@media (max-width: 1023px) {
  html.adaptive { font-size: min(calc(100vw / 37.5), 12px); --parallax: 0.1; }
  .adaptive body { min-width: 0; font-size: 15px; }
  .adaptive { --edge: 20px; --gutter: var(--edge); --space-section: 12rem; }

  .adaptive .h1     { font-size: 15px; }
  .adaptive .h2,
  .adaptive .caps,
  .adaptive .btn    { font-size: 11px; }
  .adaptive .h3     { font-size: 19px; letter-spacing: -0.04em; }
  .adaptive .h4     { font-size: 17px; letter-spacing: -0.04em; }
  .adaptive .text-m { font-size: 15px; }
  .adaptive .text-s { font-size: 12px; }
  .adaptive .btn    { padding: var(--space-12) var(--space-20); }

  .adaptive .header { height: auto; }
  html.adaptive { --logo-w: 11.2rem; --logo-h: 6.4rem; }
  html.adaptive.logo-small { --logo-w: 7rem; --logo-h: 4rem; --logo-x: 0px; --logo-y: 0px; }
  .adaptive .header .header__cta { transition: top .6s var(--ease); }
  html.adaptive.logo-small .header .header__cta { top: calc(var(--logo-h) / 2 - 0.7em); }
  .adaptive .header__tagline { left: var(--edge); right: var(--edge); top: var(--space-80); white-space: normal; }
  .adaptive .br-m { display: inline; }

  .adaptive .hero { min-height: 100svh; padding: 18rem 0 var(--space-20); }
  .adaptive .slide { margin-right: var(--space-12); }
  .adaptive .slide figcaption { margin-bottom: var(--space-8); }

  .adaptive .culture { padding: var(--space-80) var(--edge) 0; }
  .adaptive .culture__title { margin-top: var(--space-20); width: auto; }
  .adaptive .culture__aside { margin-top: var(--space-80); width: auto; }
  .adaptive .culture__images { gap: var(--space-12); }
  .adaptive .culture__images img { flex: 1; width: 0; height: auto; aspect-ratio: 281 / 346; }
  .adaptive .culture__sub { margin-top: var(--space-20); width: auto; }

  .adaptive .services { display: block; padding: var(--space-section) var(--edge) 0; }
  .adaptive .services__list { width: auto; }
  .adaptive .services__intro { flex-direction: column; gap: var(--space-16); padding: var(--space-20) 0 var(--space-80); }
  .adaptive .services__intro .h2 { width: auto; }
  .adaptive .services__visual { display: none; }
  .adaptive .acc__head { padding-top: var(--space-20); }
  .adaptive .acc__panel { padding-bottom: var(--space-20); }
  .adaptive .acc__item.is-open .acc__panel { margin-top: 0; padding-bottom: 0; }
  .adaptive .acc__body { margin-left: 0; width: auto; gap: var(--space-20); }
  .adaptive .acc__body > :first-child { margin-top: var(--space-12); }
  .adaptive .acc__body > :last-child { margin-bottom: var(--space-24); }

  .adaptive .work { padding: var(--space-section) var(--edge) 0; }
  .adaptive .work__label { margin-bottom: var(--space-20); }
  .adaptive .work__grid { grid-template-columns: 1fr; gap: var(--space-32); }
  .adaptive .work__name { margin-top: var(--space-12); }
  @supports not (text-box: trim-both cap alphabetic) {
    .adaptive .work__cat { margin-top: -0.14rem; }
  }

  .adaptive .words { margin-top: var(--space-section); min-height: 120svh; }
  .adaptive .words__sticky { padding: var(--space-80) var(--edge); }
  .adaptive .words__inner { width: auto; }
  .adaptive .words__inner blockquote,
  .adaptive .words__author { margin-top: var(--space-20); }

  .adaptive .team__sticky {
    height: 100svh;
    gap: var(--space-80);
    padding: var(--space-80) var(--edge);
  }
  .adaptive .team__member { position: static; height: auto; margin: 0 0 auto; }
  .adaptive .team__title { margin-top: var(--space-20); width: auto; }
  .adaptive .team__member { display: flex; gap: var(--space-16); align-items: flex-start; }
  .adaptive .team__photo { position: relative; left: 0; flex: 0 0 auto; width: 12rem; height: 15.4rem; }
  .adaptive .team__text { position: static; transform: none; flex: 1; width: auto; }
  .adaptive .team__desc .h4 { text-box: trim-both cap alphabetic; }
  @supports not (text-box: trim-both cap alphabetic) {
    .adaptive .team__desc .text-m { margin-top: 2.37rem; }
  }

  .adaptive .approach { height: auto; padding: var(--space-section) var(--edge); }
  .adaptive .approach__headwrap { position: relative; height: auto; padding: 0; }
  .adaptive .approach__head { position: static; margin-left: 0; width: auto; }
  .adaptive .approach__head .h3 { margin-top: var(--space-20); }
  .adaptive .approach__points { position: relative; margin-top: var(--space-80); display: flex; flex-direction: column; gap: var(--space-32); }
  .adaptive .point { position: static; width: auto; }
  .adaptive .point p { width: auto; margin-top: 0; }

  .adaptive .contact { flex-direction: column; padding: var(--space-section) var(--edge) 0; }
  .adaptive .contact__left { width: auto; min-height: 0; }
  .adaptive .contact__title { margin-top: var(--space-20); width: auto; }
  .adaptive .contact__rows { margin-top: var(--space-80); }
  .adaptive .contact__row { gap: var(--space-12); }
  .adaptive .contact__row dt { width: 10rem; }
  .adaptive .contact__row dd { white-space: nowrap; }
  .adaptive .contact__photo { margin-top: var(--space-32); width: 100%; height: auto; aspect-ratio: 582 / 845; }
  .adaptive .contact__photo figcaption { left: var(--space-20); bottom: var(--space-20); width: auto; }

  .adaptive .footer { margin-top: var(--space-section); height: max(80rem, 100svh); }
  .adaptive .footer__top { top: calc(50svh - 1rem); margin: 0 var(--edge); }
  .adaptive .footer__motto { width: auto; }
  .adaptive .footer__bottom {
    left: calc(var(--edge) - var(--space-12)); right: calc(var(--edge) - var(--space-12)); bottom: calc(var(--edge) - 16px);
    flex-direction: column; gap: var(--space-20);
  }
  .adaptive .footer__links > * { padding-left: var(--space-12); padding-right: var(--space-12); }
  .adaptive .footer__social > *,
  .adaptive .footer__links > * { height: 44px; padding-top: 0; padding-bottom: 0; display: flex; align-items: center; }
  .adaptive .footer__social { flex-wrap: nowrap; justify-content: space-between; gap: 0; padding: 0 var(--space-12); }
  .adaptive .footer__social > * { padding-left: 0; padding-right: 0; }
  .adaptive .footer__links { width: auto; }

  .adaptive .popup { padding: 0; }
  .adaptive .popup__panel { width: 100%; --panel-pb: var(--space-20); padding: var(--space-80) var(--edge) var(--panel-pb); }
  .adaptive .inquiry__follow { flex-direction: column; gap: 0; margin-top: calc(var(--space-80) - (44px - 1.2em) / 2); }
  .adaptive .inquiry__follow .hov { display: flex; align-items: center; height: 44px; overflow: visible; }
  .adaptive .inquiry__follow .hov__t::after { content: none; }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .adaptive .h3 { font-size: 28px; }
  .adaptive .h4 { font-size: 18px; }

  .adaptive .culture__aside { margin: var(--space-section) 0 0 40%; width: auto; }

  .adaptive .services__intro { flex-direction: row; gap: var(--space-20); }
  .adaptive .services__intro .h2 { width: calc(40% - var(--space-20)); }
  .adaptive .acc__item.is-open .acc__panel { margin-top: -22px; }
  .adaptive .acc__body { margin: 0 var(--space-32) 0 40%; }
  .adaptive .acc__body > :first-child { margin-top: 0; }

  .adaptive .work__grid { grid-template-columns: repeat(2, 1fr); column-gap: var(--space-12); }

  .adaptive .words__inner { margin-left: 40%; }
  .adaptive .words__inner blockquote { text-wrap: balance; }

  .adaptive .team__member { display: grid; grid-template-columns: 40% 1fr; gap: 0; align-items: center; }
  .adaptive .team__photo { justify-self: center; width: min(24rem, 100% - 2 * var(--space-32)); height: auto; aspect-ratio: 240 / 308; }

  .adaptive .approach__points { margin-left: 40%; }
  .adaptive .point p br { display: none; }

  .adaptive .contact { flex-direction: row; align-items: stretch; gap: var(--space-20); }
  .adaptive .contact__left { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; }
  .adaptive .contact__rows { margin-top: auto; padding-top: var(--space-80); }
  .adaptive .contact__photo { flex: 1 1 0; margin-top: 0; width: auto; }

  .adaptive .footer__social { justify-content: flex-start; padding: 0; }
  .adaptive .footer__social > * { padding-left: var(--space-12); padding-right: var(--space-12); }
}

.toast {
  position: fixed; left: 50%; bottom: var(--space-32); z-index: 95;
  display: inline-flex; align-items: center; gap: var(--space-8); white-space: nowrap;
  padding: var(--space-8); border-radius: 0.6rem;
  color: var(--white);
  background: rgba(0, 0, 0, .15);
  backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px);
  pointer-events: none;
  opacity: 0; transform: translate(-50%, 1rem);
  transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.toast::before { content: ""; width: 0.6rem; height: 0.6rem; background: currentColor; }
.toast.is-on { opacity: 1; transform: translate(-50%, 0); }
@media (max-width: 1023px) {
  .adaptive .toast { bottom: var(--space-section); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: .01ms !important; transition-delay: 0s !important; }
  html { scroll-behavior: auto; }
}

html.is-loading, html.is-revealing { overflow: hidden; }
html.is-loading .header__logo,
html.is-loading .header__tagline,
html.is-loading .header__cta { opacity: 0; }
html.is-loading .header > *, html.is-revealing .header > * { pointer-events: none; }
html.is-loading .marquee, html.is-revealing .marquee { pointer-events: none; }
html.is-loading .cursor, html.is-revealing .cursor { opacity: 0 !important; }
html.is-loading .marquee .slide__media > * { clip-path: inset(0 0 100% 0); }
html.is-loading .marquee .slide__media,
html.is-revealing .marquee .slide__media { background: transparent; }
html.is-loading .marquee .slide figcaption { opacity: 0; }
.loader { position: fixed; inset: 0; z-index: 30; pointer-events: none; }
.loader__rail { position: absolute; left: var(--edge); right: var(--edge); height: 1px; }
.loader__count { position: absolute; left: 0; bottom: var(--space-12); font-variant-numeric: tabular-nums; }
.loader__line { position: absolute; inset: 0; background: var(--black); transform: scaleX(0); transform-origin: left; }
.loader__lane { position: absolute; left: 0; right: 0; bottom: 0; height: var(--h); z-index: 2; pointer-events: none; }
.loader__seg { position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--black); transform-origin: left; }

html.is-entering body { visibility: hidden; }
.page-bar {
  position: fixed; left: 0; right: 0; top: 0; z-index: 100;
  height: 2px; background: var(--black);
  transform-origin: left; pointer-events: none;
}