html.mix-story-route,
html.mix-story-route body { overflow-x: clip; background: #fcfbfa !important; }
html.mix-story-route { scroll-padding-top: calc(var(--soceo-header-height, 140px) + 20px); }

.mix-story-page {
  --story-ink: #191426;
  --story-deep: #201044;
  --story-violet: #6e35e7;
  --story-violet-dark: #4c24ab;
  --story-muted: #5b5566;
  --story-line: rgba(45, 30, 77, .18);
  --story-shell: min(1210px, calc(100% - 96px));
  position: relative;
  z-index: 3;
  min-width: 0;
  margin-top: calc(-1 * var(--soceo-nav-height, 96px));
  color: var(--story-ink);
  background: #fcfbfa;
  font-family: Inter, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
.mix-story-page, .mix-story-page *, .mix-story-page *::before, .mix-story-page *::after { box-sizing: border-box; }
.mix-story-page ::selection { color: #fff; background: var(--story-violet); }
.mix-story-page a { color: inherit; text-decoration: none; text-underline-offset: .2em; -webkit-tap-highlight-color: transparent; }
.mix-story-page a:focus-visible, .mix-story-skip:focus-visible { outline: 3px solid #a16df4; outline-offset: 4px; }
.mix-story-shell { width: var(--story-shell); margin-inline: auto; }
.mix-story-skip {
  position: fixed; z-index: 100000; top: 12px; left: 12px; padding: 12px 18px;
  border-radius: 999px; color: #fff; background: var(--story-violet);
  font: 700 14px/1.2 Inter, Arial, sans-serif; text-decoration: none;
  transform: translateY(calc(-100% - 30px));
}
.mix-story-skip:focus-visible { transform: translateY(0); }

.mix-story-hero {
  position: relative; min-height: min(780px, 90svh); overflow: hidden;
  color: #fff; background: var(--story-deep);
}
.mix-story-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(122deg, rgba(23, 10, 52, .98) 13%, rgba(37, 13, 85, .92) 64%, rgba(79, 36, 160, .94));
}
.mix-story-hero__inner {
  position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(360px, .9fr);
  min-height: inherit; align-items: center; gap: 24px; padding-top: clamp(150px, 14vw, 185px); padding-bottom: 100px;
}
.mix-story-hero__copy { max-width: 720px; padding-block: 30px; }
.mix-story-hero__chapter { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 34px; color: #d7c8ff; font-size: 13px; font-weight: 700; letter-spacing: .01em; }
.mix-story-hero__chapter span { opacity: .55; }
.mix-story-hero h1 {
  margin: 0 0 28px; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif;
  font-size: clamp(52px, 5.6vw, 82px); font-weight: 700; line-height: 1.03; letter-spacing: -.035em;
  text-wrap: balance;
}
.mix-story-hero h1 em { color: #c7a8ff; font-style: normal; }
.mix-story-hero__copy > p { max-width: 570px; margin: 0; color: #e0d8ef; font-size: clamp(17px, 1.45vw, 20px); line-height: 1.65; }
.mix-story-hero__jump { display: inline-flex; align-items: center; gap: 18px; margin-top: 34px; padding-bottom: 8px; border-bottom: 1px solid #bca2ef; color: #fff; font-size: 14px; font-weight: 700; transition: gap 180ms ease; }
.mix-story-hero__jump:hover { gap: 24px; }
.mix-story-hero__jump span { font-size: 23px; font-weight: 400; line-height: 1; }
.mix-story-hero__art { position: relative; aspect-ratio: 1; width: min(100%, 500px); justify-self: end; isolation: isolate; }
.mix-story-hero__art::before { content: ""; position: absolute; inset: 22%; border-radius: 50%; background: radial-gradient(circle, rgba(126, 63, 255, .7), rgba(85, 35, 177, .08) 64%, transparent 75%); filter: blur(12px); }
.mix-story-hero__orbit { position: absolute; border: 1px solid rgba(220, 203, 255, .45); border-radius: 50%; transform: rotate(-23deg); }
.mix-story-hero__orbit--outer { inset: 5%; }
.mix-story-hero__orbit--inner { inset: 18%; border-color: rgba(220, 203, 255, .24); }
.mix-story-hero__orbit--outer::before, .mix-story-hero__orbit--inner::before { content: ""; position: absolute; inset: -9%; border: 1px solid rgba(220, 203, 255, .12); border-radius: 50%; transform: scaleX(.64); }
.mix-story-hero__dot { position: absolute; z-index: 2; width: 12px; height: 12px; border-radius: 50%; background: #dbc6ff; box-shadow: 0 0 0 7px rgba(205, 169, 255, .14); }
.mix-story-hero__dot--a { top: 10%; left: 32%; }
.mix-story-hero__dot--b { top: 64%; right: 5%; width: 17px; height: 17px; background: #fff; }
.mix-story-hero__dot--c { bottom: 12%; left: 23%; width: 9px; height: 9px; }
.mix-story-hero__art-word { position: absolute; z-index: 1; inset: 0; display: flex; align-items: center; justify-content: center; gap: 8px; color: #fff; font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: clamp(17px, 2vw, 25px); font-weight: 700; letter-spacing: -.025em; white-space: nowrap; }
.mix-story-hero__art-word span { color: #be9bff; font-family: Inter, sans-serif; font-size: .85em; font-weight: 400; }
.mix-story-hero__base { position: absolute; z-index: 1; left: 0; right: 0; bottom: 26px; display: flex; justify-content: space-between; color: #b9a9d6; font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }

.mix-story-years { position: sticky; z-index: 20; top: var(--soceo-nav-height, 96px); border-bottom: 1px solid var(--story-line); background: rgba(252, 251, 250, .96); backdrop-filter: blur(12px); }
.mix-story-years__inner { display: flex; min-height: 64px; align-items: center; gap: clamp(20px, 4vw, 58px); }
.mix-story-years__label { margin-right: auto; color: var(--story-muted); font-size: 12px; font-weight: 700; }
.mix-story-years a { position: relative; display: inline-flex; align-items: center; min-height: 64px; color: #615b6b; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; transition: color 180ms ease; }
.mix-story-years a::after { content: ""; position: absolute; bottom: -1px; left: 0; right: 0; height: 2px; background: var(--story-violet); transform: scaleX(0); transform-origin: left; transition: transform 180ms ease; }
.mix-story-years a:is(:hover, [aria-current]) { color: var(--story-violet-dark); }
.mix-story-years a:is(:hover, [aria-current])::after { transform: scaleX(1); }
.mix-story-years__current { margin-left: auto; color: #827a8e; font-size: 12px; }

.mix-story-question { padding: clamp(100px, 11vw, 155px) 0; background: #f4f0e9; }
.mix-story-question__grid { display: grid; grid-template-columns: minmax(0, .54fr) minmax(0, .46fr); gap: clamp(60px, 8vw, 120px); align-items: center; }
.mix-story-question__copy > span { display: block; margin-bottom: 35px; color: var(--story-violet-dark); font-size: 13px; font-weight: 750; }
.mix-story-question h2, .mix-story-solo h2, .mix-story-lab h2, .mix-story-shift h2 { margin: 0; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-weight: 700; line-height: 1.08; letter-spacing: -.035em; text-wrap: balance; }
.mix-story-question h2 { max-width: 730px; margin-bottom: 35px; font-size: clamp(43px, 4.6vw, 64px); }
.mix-story-question h2 em { color: var(--story-violet); font-style: normal; }
.mix-story-question__copy p { max-width: 630px; margin: 0 0 23px; color: var(--story-muted); font-size: 17px; line-height: 1.73; }
.mix-story-question__copy p:last-child { margin-bottom: 0; }
.mix-story-question__figure { position: relative; display: flex; flex-direction: column; justify-content: center; min-height: 450px; margin: 0; padding: clamp(35px, 4vw, 65px); overflow: hidden; border: 1px solid #d8cde5; border-radius: 16px; color: #fff; background: #29134f; }
.mix-story-question__figure::before { content: ""; position: absolute; right: -65px; bottom: -130px; width: 340px; aspect-ratio: 1; border: 1px solid rgba(224, 197, 255, .28); border-radius: 50%; box-shadow: 0 0 0 48px rgba(224, 197, 255, .04), 0 0 0 97px rgba(224, 197, 255, .04); }
.mix-story-question__figure blockquote { position: relative; z-index: 1; margin: 0 0 25px; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(35px, 3.4vw, 48px); font-weight: 700; line-height: 1.12; letter-spacing: -.03em; text-wrap: balance; }
.mix-story-question__figure figcaption { position: relative; z-index: 1; max-width: 280px; color: #d9c7ef; font-size: 13px; line-height: 1.5; }
.mix-story-question__branches { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 65px; }
.mix-story-question__branches span { padding: 9px 11px; border: 1px solid rgba(237, 225, 255, .4); border-radius: 999px; color: #e9ddf8; font-size: 11px; font-weight: 700; }

.mix-story-origin { padding: clamp(92px, 10vw, 144px) 0; }
.mix-story-origin__grid { display: grid; grid-template-columns: minmax(200px, .32fr) minmax(0, .68fr); gap: clamp(60px, 8vw, 130px); }
.mix-story-origin__aside { margin: 12px 0 0; color: var(--story-violet-dark); font-size: 13px; font-weight: 750; line-height: 1.55; }
.mix-story-origin__aside::before { content: ""; display: block; width: 26px; height: 2px; margin-bottom: 24px; background: var(--story-violet); }
.mix-story-origin h2, .mix-story-timeline__heading h2, .mix-story-next h2 { margin: 0; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-weight: 700; line-height: 1.06; letter-spacing: -.035em; text-wrap: balance; }
.mix-story-origin h2 { max-width: 850px; margin-bottom: 36px; font-size: clamp(40px, 4.7vw, 64px); }
.mix-story-origin__copy p { max-width: 780px; margin: 0 0 21px; color: var(--story-muted); font-size: 18px; line-height: 1.74; }
.mix-story-origin__copy p:last-child { margin-bottom: 0; }
.mix-story-origin__copy .mix-story-origin__statement { margin-top: 38px; padding: 25px 30px; border-left: 3px solid var(--story-violet); border-radius: 0 14px 14px 0; color: var(--story-ink); background: #f4ecff; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(21px, 2.2vw, 28px); font-weight: 650; line-height: 1.35; letter-spacing: -.018em; }
.mix-story-origin__copy strong { color: var(--story-ink); }

.mix-story-solo { padding: clamp(90px, 10vw, 145px) 0; color: #fff; background: #1e1239; }
.mix-story-solo__top { display: grid; grid-template-columns: minmax(170px, .24fr) minmax(0, .76fr); gap: clamp(35px, 6vw, 90px); }
.mix-story-solo__top > span { padding-top: 14px; color: #ccb9eb; font-size: 13px; font-weight: 750; }
.mix-story-solo h2 { max-width: 1010px; font-size: clamp(48px, 5.6vw, 78px); }
.mix-story-solo h2 em { color: #bc98fc; font-style: normal; }
.mix-story-solo__lead { max-width: 780px; margin: 40px 0 52px auto; color: #dfd5ef; font-size: 18px; line-height: 1.7; }
.mix-story-solo__voice { max-width: 780px; margin: 0 0 80px auto; padding-left: 30px; border-left: 1px solid #af87eb; }
.mix-story-solo__voice p { margin: 0 0 12px; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(25px, 2.5vw, 34px); font-weight: 700; line-height: 1.25; letter-spacing: -.02em; }
.mix-story-solo__voice cite { color: #bda8dc; font-size: 12px; font-style: normal; }
.mix-story-solo__rules { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgba(238, 223, 255, .28); border-bottom: 1px solid rgba(238, 223, 255, .28); }
.mix-story-solo__rules > div { display: flex; min-height: 260px; flex-direction: column; align-items: flex-start; padding: 38px 28px 35px 0; }
.mix-story-solo__rules > div + div { padding-left: 32px; border-left: 1px solid rgba(238, 223, 255, .28); }
.mix-story-solo__rules span { color: #bd9ef1; font-size: 13px; font-weight: 750; }
.mix-story-solo__rules strong { max-width: 350px; margin: 26px 0 auto; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(24px, 2.3vw, 33px); line-height: 1.16; letter-spacing: -.025em; }
.mix-story-solo__rules small { margin-top: 29px; color: #cfc0e5; font-size: 12px; }

.mix-story-foundation { padding: clamp(90px, 10vw, 145px) 0 100px; color: #fff; background: #6330ce; scroll-margin-top: calc(var(--soceo-nav-height, 96px) + 30px); }
.mix-story-foundation__intro { display: grid; grid-template-columns: minmax(170px, .24fr) minmax(0, .76fr); column-gap: clamp(35px, 6vw, 90px); align-items: start; padding-bottom: 90px; }
.mix-story-foundation__intro > span { padding-top: 13px; color: #e1cfff; font-size: 13px; font-weight: 750; }
.mix-story-foundation__intro h2 { max-width: 830px; margin: 0; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(49px, 6vw, 84px); font-weight: 700; line-height: 1.04; letter-spacing: -.035em; text-wrap: balance; }
.mix-story-foundation__intro h2 em { color: #dac3ff; font-style: normal; }
.mix-story-foundation__intro p { grid-column: 2; max-width: 690px; margin: 31px 0 0; color: #eadfff; font-size: 18px; line-height: 1.68; }
.mix-story-foundation__journey { display: grid; grid-template-columns: minmax(330px, .46fr) minmax(0, .54fr); gap: clamp(50px, 7vw, 120px); border-top: 1px solid rgba(255, 255, 255, .32); }
.mix-story-foundation__visual { position: sticky; top: calc(var(--soceo-nav-height, 96px) + 90px); align-self: start; display: grid; place-items: center; min-height: 520px; }
.mix-story-foundation__visual-inner { position: relative; display: grid; place-items: center; width: min(100%, 430px); aspect-ratio: 1; }
.mix-story-foundation__visual-inner::before { content: ""; position: absolute; inset: 12%; border: 1px solid rgba(255, 255, 255, .24); border-radius: 50%; }
.mix-story-foundation__visual-inner::after { content: ""; position: absolute; inset: 25%; border: 1px solid rgba(255, 255, 255, .24); border-radius: 50%; }
.mix-story-foundation__arc { position: absolute; z-index: 1; width: 13px; height: 13px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 10px rgba(255, 255, 255, .1); transition: transform 600ms cubic-bezier(.2, .8, .2, 1), background 300ms ease; }
.mix-story-foundation__arc--one { top: 12%; left: 29%; }
.mix-story-foundation__arc--two { top: 38%; right: 11%; width: 10px; height: 10px; }
.mix-story-foundation__arc--three { bottom: 16%; left: 17%; width: 8px; height: 8px; }
.mix-story-foundation[data-foundation-active="1"] .mix-story-foundation__arc--one { transform: translate(28px, 12px); }
.mix-story-foundation[data-foundation-active="2"] .mix-story-foundation__arc--two { transform: translate(-24px, 19px); }
.mix-story-foundation[data-foundation-active="3"] .mix-story-foundation__arc--three { transform: translate(25px, -23px); }
.mix-story-foundation__visual-core { position: absolute; top: 33%; font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: clamp(34px, 4.5vw, 60px); font-weight: 700; letter-spacing: -.035em; }
.mix-story-foundation__visual-word { position: absolute; top: 54%; max-width: 78%; color: #e8d9ff; font-size: 16px; font-weight: 750; text-align: center; }
.mix-story-foundation__visual-caption { position: absolute; bottom: -10px; color: #e4d2ff; font-size: 12px; }
.mix-story-foundation__steps { min-width: 0; }
.mix-story-foundation__step { position: relative; min-height: 335px; padding: 67px 0 60px; border-bottom: 1px solid rgba(255, 255, 255, .29); }
.mix-story-foundation__step:last-child { border-bottom: 0; }
.mix-story-foundation__step-label { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 24px; color: #e0ceff; font-size: 12px; font-weight: 750; letter-spacing: .05em; }
.mix-story-foundation__step-label i { width: 20px; height: 1px; background: currentColor; }
.mix-story-foundation__step h3 { max-width: 570px; margin: 0 0 21px; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(31px, 3.3vw, 45px); font-weight: 700; line-height: 1.13; letter-spacing: -.03em; text-wrap: balance; }
.mix-story-foundation__step p { max-width: 600px; margin: 0; color: #e5d9fa; font-size: 16px; line-height: 1.72; }
.mix-story-foundation__closing { display: block; margin-top: 70px; padding-top: 65px; border-top: 1px solid rgba(255, 255, 255, .38); }
.mix-story-foundation__closing p { max-width: 900px; margin: 0; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(29px, 3.4vw, 47px); font-weight: 700; line-height: 1.17; letter-spacing: -.025em; text-wrap: balance; }
.mix-story-foundation__closing strong { color: #e0caff; font-weight: inherit; }

.mix-story-timeline { padding: clamp(85px, 10vw, 140px) 0 clamp(100px, 11vw, 160px); background: #f3effa; }
.mix-story-timeline__heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 75px; }
.mix-story-timeline__heading h2 { max-width: 760px; font-size: clamp(40px, 4.8vw, 66px); }
.mix-story-timeline__heading p { max-width: 250px; margin: 0 0 7px; color: var(--story-muted); font-size: 15px; line-height: 1.55; }
.mix-story-timeline__list { border-top: 1px solid rgba(56, 29, 106, .22); }
.mix-story-moment { display: grid; grid-template-columns: minmax(150px, .24fr) minmax(0, .52fr) minmax(180px, .24fr); gap: clamp(20px, 4vw, 70px); min-height: 395px; padding: clamp(46px, 6vw, 88px) 0; border-bottom: 1px solid rgba(56, 29, 106, .22); scroll-margin-top: calc(var(--soceo-nav-height, 96px) + 86px); }
.mix-story-moment__year { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.mix-story-moment__year span { color: var(--story-violet-dark); font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: clamp(43px, 5.4vw, 75px); font-weight: 700; line-height: 1; letter-spacing: -.035em; font-variant-numeric: tabular-nums; }
.mix-story-moment__year small { color: #635b70; font-size: 13px; font-weight: 700; }
.mix-story-moment__body { padding-top: 8px; }
.mix-story-moment__index { display: block; margin-bottom: 22px; color: var(--story-violet-dark); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.mix-story-moment h3 { max-width: 720px; margin: 0 0 25px; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(31px, 3.4vw, 46px); font-weight: 700; line-height: 1.14; letter-spacing: -.03em; text-wrap: balance; }
.mix-story-moment__body p { max-width: 650px; margin: 0 0 24px; color: #5f586a; font-size: 16px; line-height: 1.72; }
.mix-story-moment__body strong { display: block; max-width: 560px; color: var(--story-violet-dark); font-size: 15px; line-height: 1.5; }
.mix-story-moment__signal { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; width: min(100%, 220px); aspect-ratio: 1; justify-self: end; align-self: center; border: 1px solid rgba(93, 45, 174, .18); border-radius: 50%; color: #5f36b2; }
.mix-story-moment__signal::before { content: ""; position: absolute; inset: 13%; border: 1px solid rgba(93, 45, 174, .18); border-radius: 50%; }
.mix-story-moment__signal span:last-child { position: relative; z-index: 1; font-size: 12px; font-weight: 700; line-height: 1.45; text-align: center; }
.mix-story-moment__signal-core { position: relative; z-index: 1; font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: 58px; font-weight: 600; line-height: 1; }
.mix-story-moment__signal--nodes { display: block; }
.mix-story-moment__signal--nodes i, .mix-story-moment__signal--system i { position: absolute; z-index: 1; width: 14px; height: 14px; border-radius: 50%; background: #7842d9; }
.mix-story-moment__signal--nodes i:nth-child(1) { top: 30%; left: 37%; }
.mix-story-moment__signal--nodes i:nth-child(2) { top: 33%; right: 30%; }
.mix-story-moment__signal--nodes i:nth-child(3) { top: 52%; left: 50%; }
.mix-story-moment__signal--nodes span:last-child, .mix-story-moment__signal--system span:last-child { position: absolute; top: 72%; left: 0; right: 0; }
.mix-story-moment__signal--system { display: block; }
.mix-story-moment__signal--system i { width: 18px; height: 18px; border-radius: 5px; }
.mix-story-moment__signal--system i:nth-child(1) { top: 31%; left: 34%; }
.mix-story-moment__signal--system i:nth-child(2) { top: 31%; right: 31%; }
.mix-story-moment__signal--system i:nth-child(3) { top: 48%; left: 34%; }
.mix-story-moment__signal--system i:nth-child(4) { top: 48%; right: 31%; }

.mix-story-lab { padding: clamp(95px, 10vw, 145px) 0; background: #fcfbfa; }
.mix-story-lab__intro { display: grid; grid-template-columns: minmax(170px, .24fr) minmax(0, .76fr); gap: clamp(35px, 6vw, 90px); align-items: start; }
.mix-story-lab__intro > span { padding-top: 13px; color: var(--story-violet-dark); font-size: 13px; font-weight: 750; }
.mix-story-lab h2 { max-width: 850px; font-size: clamp(43px, 4.9vw, 67px); }
.mix-story-lab__intro p { max-width: 740px; margin: 31px 0 0; color: var(--story-muted); font-size: 18px; line-height: 1.7; }
.mix-story-lab__sequence { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 90px; border-top: 1px solid var(--story-line); border-bottom: 1px solid var(--story-line); }
.mix-story-lab__sequence > div { position: relative; min-height: 210px; padding: 39px 36px 42px 0; }
.mix-story-lab__sequence > div + div { padding-left: 36px; border-left: 1px solid var(--story-line); }
.mix-story-lab__sequence > div::before { content: ""; position: absolute; top: -2px; left: 0; width: 75px; height: 3px; background: var(--story-violet); transform: scaleX(.28); transform-origin: left; transition: transform 350ms ease; }
.mix-story-lab__sequence > div + div::before { left: 36px; }
.mix-story-lab__sequence > div:hover::before { transform: scaleX(1); }
.mix-story-lab__sequence span { color: var(--story-violet-dark); font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: 30px; font-weight: 700; letter-spacing: -.025em; }
.mix-story-lab__sequence p { max-width: 320px; margin: 20px 0 0; color: var(--story-muted); font-size: 15px; line-height: 1.62; }
.mix-story-lab__conclusion { display: grid; grid-template-columns: minmax(170px, .24fr) minmax(0, .76fr); gap: clamp(35px, 6vw, 90px); margin-top: 95px; }
.mix-story-lab__conclusion span { color: #9a68ef; font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: 110px; font-weight: 700; line-height: .8; }
.mix-story-lab__conclusion p { max-width: 900px; margin: 0; font-family: "Bricolage Grotesque", "Polysans Neutral", Inter, sans-serif; font-size: clamp(29px, 3.25vw, 44px); font-weight: 700; line-height: 1.22; letter-spacing: -.025em; text-wrap: balance; }

.mix-story-shift { padding: clamp(95px, 10vw, 145px) 0; background: #ece5f8; }
.mix-story-shift__head { display: grid; grid-template-columns: minmax(170px, .24fr) minmax(0, .76fr); gap: clamp(35px, 6vw, 90px); padding-bottom: 70px; border-bottom: 1px solid var(--story-line); }
.mix-story-shift__head span { padding-top: 13px; color: var(--story-violet-dark); font-size: 13px; font-weight: 750; }
.mix-story-shift h2 { max-width: 930px; font-size: clamp(44px, 5.2vw, 73px); }
.mix-story-shift__grid { display: grid; grid-template-columns: minmax(0, .56fr) minmax(320px, .44fr); gap: clamp(50px, 8vw, 120px); padding-top: 70px; }
.mix-story-shift__story p { max-width: 690px; margin: 0 0 27px; color: #514a60; font-size: 17px; line-height: 1.75; }
.mix-story-shift__story p:last-child { margin-bottom: 0; }
.mix-story-shift__story strong { color: var(--story-ink); }
.mix-story-shift__diagram { display: flex; flex-direction: column; align-self: start; padding: 33px clamp(24px, 3vw, 43px); border: 1px solid #d3c3e8; border-radius: 16px; background: #fff; }
.mix-story-shift__diagram > div { position: relative; padding: 12px 0; }
.mix-story-shift__diagram > div span { color: var(--story-violet-dark); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mix-story-shift__diagram > div strong { display: block; margin-top: 8px; font-family: "Bricolage Grotesque", Inter, sans-serif; font-size: clamp(27px, 2.5vw, 36px); font-weight: 700; line-height: 1.1; letter-spacing: -.025em; }
.mix-story-shift__diagram > div p { margin: 8px 0 0; color: var(--story-muted); font-size: 13px; line-height: 1.5; }
.mix-story-shift__diagram > i { display: block; width: 1px; height: 34px; margin: 8px 0 8px 15px; background: #b68be9; }
.mix-story-shift__diagram > div:last-child { padding: 20px 22px; margin: 0 -22px -7px; border-radius: 12px; color: #fff; background: var(--story-violet-dark); }
.mix-story-shift__diagram > div:last-child span, .mix-story-shift__diagram > div:last-child p { color: #e6d8fb; }

@media (prefers-reduced-motion: no-preference) {
  .mix-story-hero__orbit--outer { animation: mix-story-orbit 34s linear infinite; }
  .mix-story-hero__orbit--inner { animation: mix-story-orbit-reverse 44s linear infinite; }
  .mix-story-page.mix-story-motion-ready .mix-story-moment__body { opacity: .86; transform: translateY(18px); transition: opacity 550ms ease, transform 550ms cubic-bezier(.2, .8, .2, 1); }
  .mix-story-page.mix-story-motion-ready .mix-story-moment.is-in-view .mix-story-moment__body { opacity: 1; transform: translateY(0); }
}
@keyframes mix-story-orbit { to { transform: rotate(337deg); } }
@keyframes mix-story-orbit-reverse { to { transform: rotate(-383deg); } }

.mix-story-next { overflow: hidden; color: #fff; background: var(--story-deep); }
.mix-story-next__inner { display: grid; grid-template-columns: minmax(0, .25fr) minmax(0, .75fr); gap: 55px; padding-block: clamp(110px, 13vw, 180px); }
.mix-story-next__line { display: block; width: 1px; min-height: 170px; align-self: start; background: linear-gradient(#d8bcff, transparent); }
.mix-story-next__chapter { display: block; margin-bottom: 22px; color: #c7a8ff; font-size: 13px; font-weight: 700; }
.mix-story-next h2 { max-width: 850px; font-size: clamp(54px, 7vw, 98px); }
.mix-story-next h2 span { color: #a36cf2; }
.mix-story-next p { max-width: 650px; margin: 33px 0 30px; color: #d9d0e8; font-size: 18px; line-height: 1.68; }
.mix-story-next a { display: inline-flex; align-items: center; gap: 12px; min-height: 49px; padding: 0 23px; border-radius: 999px; color: var(--story-deep); background: #fff; font-size: 14px; font-weight: 750; transition: transform 180ms ease, background 180ms ease; }
.mix-story-next a:hover { transform: translateY(-2px); background: #e9deff; }

@media (max-width: 1080px) {
  .mix-story-hero__inner { grid-template-columns: minmax(0, 1.2fr) minmax(270px, .8fr); }
  .mix-story-hero__art-word { font-size: 17px; }
  .mix-story-moment { grid-template-columns: 135px minmax(0, 1fr) 155px; gap: 24px; }
  .mix-story-moment__signal { width: 150px; }
}
@media (max-width: 760px) {
  .mix-story-page { --story-shell: min(100% - 36px, 560px); }
  .mix-story-hero { min-height: auto; }
  .mix-story-hero__inner { display: block; padding-top: 155px; padding-bottom: 100px; }
  .mix-story-hero__copy { padding: 0; }
  .mix-story-hero__chapter { margin-bottom: 23px; }
  .mix-story-hero h1 { font-size: clamp(43px, 10.4vw, 62px); }
  .mix-story-hero__copy > p { font-size: 16px; }
  .mix-story-hero__art { width: min(77vw, 340px); margin: 45px auto 0; }
  .mix-story-hero__art-word { font-size: 16px; }
  .mix-story-hero__base { bottom: 20px; }
  .mix-story-years { top: var(--soceo-nav-height, 70px); }
  .mix-story-years__inner { gap: 26px; overflow-x: auto; scrollbar-width: thin; }
  .mix-story-years__label, .mix-story-years__current { display: none; }
  .mix-story-years a { flex: none; min-height: 54px; }
  .mix-story-question { padding-block: 82px; }
  .mix-story-question__grid { display: block; }
  .mix-story-question__copy > span { margin-bottom: 22px; }
  .mix-story-question h2 { font-size: clamp(37px, 9vw, 51px); }
  .mix-story-question__copy p { font-size: 16px; }
  .mix-story-question__figure { min-height: 390px; margin-top: 48px; padding: 34px; }
  .mix-story-question__figure blockquote { font-size: clamp(32px, 8vw, 45px); }
  .mix-story-question__branches { margin-top: 50px; }
  .mix-story-origin { padding-block: 84px; }
  .mix-story-origin__grid { display: block; }
  .mix-story-origin__aside { margin: 0 0 30px; }
  .mix-story-origin__aside::before { margin-bottom: 14px; }
  .mix-story-origin h2 { margin-bottom: 27px; font-size: clamp(35px, 8.5vw, 48px); }
  .mix-story-origin__copy p { font-size: 16px; }
  .mix-story-origin__copy .mix-story-origin__statement { margin-top: 30px; padding: 21px 23px; font-size: 22px; }
  .mix-story-solo { padding-block: 84px; }
  .mix-story-solo__top { display: block; }
  .mix-story-solo__top > span { display: block; padding: 0 0 22px; }
  .mix-story-solo h2 { font-size: clamp(40px, 9.7vw, 58px); }
  .mix-story-solo__lead { margin: 31px 0 40px; font-size: 16px; }
  .mix-story-solo__voice { margin: 0 0 55px; padding-left: 17px; }
  .mix-story-solo__voice p { font-size: clamp(25px, 6.6vw, 32px); }
  .mix-story-solo__rules { display: block; }
  .mix-story-solo__rules > div { min-height: 0; padding: 34px 0; }
  .mix-story-solo__rules > div + div { padding-left: 0; border-top: 1px solid rgba(238, 223, 255, .28); border-left: 0; }
  .mix-story-solo__rules strong { margin: 15px 0 0; font-size: 30px; }
  .mix-story-solo__rules small { margin-top: 18px; }
  .mix-story-foundation { padding-block: 83px 95px; }
  .mix-story-foundation__intro { display: block; padding-bottom: 53px; }
  .mix-story-foundation__intro > span { display: block; padding: 0 0 22px; }
  .mix-story-foundation__intro h2 { font-size: clamp(43px, 10vw, 62px); }
  .mix-story-foundation__intro p { margin-top: 24px; font-size: 16px; }
  .mix-story-foundation__journey { display: block; }
  .mix-story-foundation__visual { position: relative; top: auto; min-height: 340px; }
  .mix-story-foundation__visual-inner { width: min(100%, 310px); }
  .mix-story-foundation__visual-core { font-size: 42px; }
  .mix-story-foundation__visual-word { font-size: 14px; }
  .mix-story-foundation__visual-caption { bottom: 5px; }
  .mix-story-foundation__step { min-height: auto; padding-block: 45px; }
  .mix-story-foundation__step h3 { font-size: clamp(31px, 7.7vw, 42px); }
  .mix-story-foundation__step p { font-size: 15px; }
  .mix-story-foundation__closing { display: block; margin-top: 30px; padding-top: 45px; }
  .mix-story-foundation__closing p { font-size: clamp(30px, 7.5vw, 42px); }
  .mix-story-timeline { padding-block: 80px 105px; }
  .mix-story-timeline__heading { display: block; margin-bottom: 46px; }
  .mix-story-timeline__heading h2 { font-size: clamp(36px, 8.7vw, 52px); }
  .mix-story-timeline__heading p { max-width: 340px; margin-top: 20px; }
  .mix-story-moment { display: block; min-height: auto; padding-block: 55px; scroll-margin-top: calc(var(--soceo-nav-height, 70px) + 72px); }
  .mix-story-moment__year { display: flex; flex-direction: row; align-items: end; gap: 18px; margin-bottom: 30px; }
  .mix-story-moment__year span { font-size: 54px; }
  .mix-story-moment__year small { padding-bottom: 7px; }
  .mix-story-moment__body { padding: 0; }
  .mix-story-moment h3 { font-size: clamp(31px, 7.5vw, 42px); }
  .mix-story-moment__body p { font-size: 15px; }
  .mix-story-moment__signal { display: none; }
  .mix-story-lab { padding-block: 85px; }
  .mix-story-lab__intro { display: block; }
  .mix-story-lab__intro > span { display: block; padding: 0 0 22px; }
  .mix-story-lab h2 { font-size: clamp(38px, 9vw, 54px); }
  .mix-story-lab__intro p { margin-top: 25px; font-size: 16px; }
  .mix-story-lab__sequence { display: block; margin-top: 53px; }
  .mix-story-lab__sequence > div { min-height: 0; padding: 34px 0; }
  .mix-story-lab__sequence > div + div { padding-left: 0; border-top: 1px solid var(--story-line); border-left: 0; }
  .mix-story-lab__sequence > div + div::before { left: 0; }
  .mix-story-lab__sequence span { font-size: 29px; }
  .mix-story-lab__sequence p { margin-top: 12px; }
  .mix-story-lab__conclusion { display: block; margin-top: 67px; }
  .mix-story-lab__conclusion span { display: block; margin-bottom: 20px; font-size: 75px; }
  .mix-story-lab__conclusion p { font-size: clamp(28px, 7.2vw, 37px); }
  .mix-story-shift { padding-block: 85px; }
  .mix-story-shift__head { display: block; padding-bottom: 50px; }
  .mix-story-shift__head span { display: block; padding: 0 0 22px; }
  .mix-story-shift h2 { font-size: clamp(39px, 9.5vw, 57px); }
  .mix-story-shift__grid { display: block; padding-top: 46px; }
  .mix-story-shift__story p { font-size: 16px; }
  .mix-story-shift__diagram { margin-top: 48px; padding: 27px; }
  .mix-story-shift__diagram > div strong { font-size: 29px; }
  .mix-story-next__inner { display: block; padding-block: 100px 115px; }
  .mix-story-next__line { width: 28px; height: 2px; min-height: 0; margin-bottom: 29px; background: #b993f7; }
  .mix-story-next h2 { font-size: clamp(49px, 11vw, 66px); }
  .mix-story-next p { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .mix-story-page *, .mix-story-page *::before, .mix-story-page *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}