/* NAME: local layout replica (hand-written). Values measured on the reference at 1440 and 390 px.
   Display face: Inter Tight (closest Google match by measured widths), text: Geist, labels: Geist Mono. */

:root {
  --violet: #9B5CFF;
  --lime: #F8D555;
  --temper: #2b2a2c;
  --neutral-light: #eeeef0;
  --grey: #939393;
  --ease-out: cubic-bezier(0.165, 0.84, 0.44, 1);
  --gutter: 4vw;
  --f-display: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  --f-text: "Geist", "Helvetica Neue", Arial, sans-serif;
  --f-mono: "Geist Mono", ui-monospace, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }
body {
  margin: 0; background: #fff; color: #000;
  font-family: var(--f-display); font-size: 16px; line-height: 1.5; font-weight: 400;
  text-transform: uppercase; overflow-x: clip;
}
h1, h2, h3, p { margin: 0; font-weight: 400; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; text-transform: inherit; }
svg { display: block; }
.main { position: relative; }
::selection { background: var(--violet); color: #fff; }

/* ---------- shared ---------- */
.pg { padding-left: var(--gutter); padding-right: var(--gutter); }
.psl { padding-top: 6rem; padding-bottom: 4.5rem; }
.section { position: relative; border-radius: 16px; }
.subheading { font-family: var(--f-mono); font-size: 13px; line-height: normal; text-transform: uppercase; position: relative; z-index: 2; transition: color .4s; }
.display-l { font-size: 3.7rem; line-height: .9; }
.display-l.is-center { text-align: center; }
.grey { color: var(--grey); }
.black40 { color: rgba(0, 0, 0, .4); }
.t-medium { font-family: var(--f-text); font-size: 20px; line-height: 1.5; letter-spacing: -.02em; text-transform: none; }
.t-regular { font-family: var(--f-text); font-size: 16px; line-height: 1.4; text-transform: none; position: relative; z-index: 5; }
.t-xlarge { font-family: var(--f-text); font-size: 40px; line-height: 1.1; letter-spacing: -.04em; text-transform: none; }
.mob-only { display: none; }

/* line masks made by SplitText */
.line-mask { overflow: clip; }

/* buttons: skewed background, text rolls up on hover */
.btn {
  position: relative; z-index: 2; display: inline-block; padding: 16px 24px;
  font-family: var(--f-mono); font-size: 13px; line-height: 19.5px; text-transform: uppercase; color: #000; white-space: nowrap;
}
.btn.is-small { padding: 8px 16px; }
.btn_txt { position: relative; display: block; overflow: clip; height: 19.5px; }
.btn_txt > span { display: block; transition: transform .5s ease-in-out; }
.btn_txt > span + span { position: absolute; left: 0; top: 19.5px; }
.btn:hover .btn_txt > span { transform: translateY(-100%); }
.btn_bg {
  position: absolute; inset: 0; z-index: -1; background: #fff;
  border-radius: 4px 8px 4.08px; transform: skewX(-15deg);
  transition: transform .5s var(--ease-out);
}
.btn:hover .btn_bg { transform: scale(.95) skewX(-5deg); }
.btn.is-violet { color: #fff; z-index: 12; }
.btn.is-violet .btn_bg { background: var(--violet); }

/* neutral image placeholders (gradients + simple shapes, no photographs) */
.ph { position: relative; overflow: hidden; background: #222; }
.ph::before, .ph::after { content: ""; position: absolute; pointer-events: none; }
.ph-portrait { background:
  radial-gradient(60% 45% at var(--lx, 70%) 20%, var(--c3, #3be2ff) 0%, transparent 70%),
  radial-gradient(80% 60% at 30% 100%, var(--c2, #b03dff) 0%, transparent 70%),
  linear-gradient(160deg, var(--c1, #0b1430), #05060c); }
.ph-portrait::before { /* head */
  left: 50%; top: 22%; width: 34%; aspect-ratio: .82; transform: translateX(-50%);
  border-radius: 48% 48% 44% 44%; background: linear-gradient(150deg, var(--skin1, #e9a58e), var(--skin2, #6b3a3f)); filter: blur(1.5px); opacity: .9;
}
.ph-portrait::after { /* shoulders */
  left: 50%; bottom: -14%; width: 92%; height: 46%; transform: translateX(-50%);
  border-radius: 50% 50% 0 0 / 70% 70% 0 0; background: linear-gradient(170deg, var(--cloth1, #b48f9c), var(--cloth2, #2a1e2b)); filter: blur(1px);
}
.ph-night { background:
  radial-gradient(40% 70% at 52% 40%, #1b1b22 0%, #0a0a12 60%, transparent 61%),
  radial-gradient(30% 50% at 15% 55%, rgba(60, 120, 170, .55), transparent 70%),
  radial-gradient(28% 45% at 88% 50%, rgba(255, 150, 110, .45), transparent 70%),
  linear-gradient(180deg, #2c3a55, #0b1020 70%, #10142c); }
.ph-night::before { left: 28%; top: 8%; width: 44%; height: 105%; border-radius: 50% 50% 0 0; border: 22px solid #15151c; border-bottom: 0; box-shadow: inset 0 0 0 6px #2a2a33; }
.ph-night::after { left: 22%; top: 46%; width: 56%; height: 40%; border-radius: 40%; background: radial-gradient(closest-side, #303040, transparent); filter: blur(8px); }
.ph-desk { background: radial-gradient(50% 40% at 40% 30%, #3a7a4a, transparent 70%), linear-gradient(160deg, #146b3a, #0d3d24 60%, #f0f0e8 61%); }
.ph-desk::before { left: 18%; top: 22%; width: 64%; height: 46%; background: repeating-linear-gradient(90deg, #1d8a4a 0 6px, #157a40 6px 12px); border-radius: 4px; }
.ph-crate { background: linear-gradient(170deg, #f1f1ec, #d9e3d5); }
.ph-crate::before { left: 12%; top: 18%; width: 76%; height: 58%; border-radius: 10px; background: linear-gradient(160deg, #1f8f4c, #0e5a2e); box-shadow: 0 18px 30px rgba(0, 0, 0, .25); }
.ph-crate::after { left: 30%; top: 40%; width: 40%; height: 16%; border-radius: 30px; background: #fff; opacity: .92; }
.ph-studio { background: radial-gradient(60% 50% at 70% 30%, #ff7ad0, transparent 70%), linear-gradient(160deg, #3a2a7a, #191338); }
.ph-bloom { background:
  radial-gradient(18% 14% at 22% 28%, #ffd34d, transparent 70%), radial-gradient(16% 12% at 78% 22%, #ff6b8a, transparent 70%),
  radial-gradient(20% 14% at 82% 76%, #74d36b, transparent 70%), radial-gradient(18% 12% at 18% 80%, #ff9c40, transparent 70%),
  linear-gradient(160deg, #6fae5a, #2f6e3c); }
.ph-bloom::before { left: 32%; top: 22%; width: 36%; aspect-ratio: .82; border-radius: 48%; background: linear-gradient(150deg, #f2c2a7, #b0705d); }
.ph-bloom::after { left: 18%; bottom: -12%; width: 64%; height: 46%; border-radius: 50% 50% 0 0; background: radial-gradient(circle at 30% 40%, #1d6b3a 0 8%, transparent 9%) 0 0 / 30px 30px, #f4f1ea; }
.ph-aurora { background:
  radial-gradient(45% 30% at 50% 22%, #ffd84a, #ff9a1f 40%, transparent 70%),
  radial-gradient(60% 40% at 50% 70%, #2a79d6, transparent 70%),
  linear-gradient(180deg, #0b2a5a, #1a5aa8 50%, #0d2140); }
.ph-aurora::before { left: 18%; top: 40%; width: 64%; height: 34%; background: repeating-linear-gradient(90deg, rgba(120, 220, 255, .35) 0 14px, rgba(30, 90, 170, .35) 14px 28px); transform: skewY(-6deg); border-radius: 6px; }
.ph-ember { background:
  radial-gradient(28% 22% at 52% 30%, #ffe28a, #ff8a1c 45%, transparent 70%),
  radial-gradient(70% 55% at 50% 50%, #c4380f, transparent 75%),
  linear-gradient(180deg, #7a1a07, #2b0a03); }
.ph-ember::before { left: 30%; top: 26%; width: 40%; height: 80%; border-radius: 45% 45% 10% 10%; background: linear-gradient(180deg, #3a120a, #120403); }
.ph-ember::after { left: 40%; top: 46%; width: 20%; aspect-ratio: 1; border-radius: 50%; border: 6px solid #d9a24a; opacity: .8; }
.ph-crowd { background: linear-gradient(180deg, #cfe6f5 0%, #9fc7e6 35%, #5f8f5a 36%, #3e6b3f 100%); }
.ph-crowd::before { left: 6%; right: 6%; top: 8%; height: 34%; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .7) 0 2px, transparent 2px 22px), repeating-linear-gradient(0deg, rgba(255, 255, 255, .6) 0 2px, transparent 2px 22px); }
.ph-crowd::after { left: 4%; right: 4%; bottom: 8%; height: 40%; background:
  radial-gradient(circle at 10% 30%, #e8b79a 0 7%, transparent 8%), radial-gradient(circle at 28% 25%, #c48d6c 0 7%, transparent 8%),
  radial-gradient(circle at 46% 32%, #f0c4a4 0 7%, transparent 8%), radial-gradient(circle at 64% 24%, #a8735a 0 7%, transparent 8%),
  radial-gradient(circle at 82% 30%, #e2ab8a 0 7%, transparent 8%),
  linear-gradient(180deg, transparent 38%, #e04a7a 39%, #5a6ad8 60%, #f0e04a 80%, #3a3a5a 100%); }
.ph-face { background: linear-gradient(160deg, var(--c1, #e9e6ff), var(--c2, #b7a7ff)); }
.ph-face::before { left: 50%; top: 20%; width: 40%; aspect-ratio: .8; transform: translateX(-50%); border-radius: 48%; background: linear-gradient(150deg, var(--skin1, #e8b296), var(--skin2, #a76a52)); }
.ph-face::after { left: 50%; bottom: -10%; width: 90%; height: 40%; transform: translateX(-50%); border-radius: 50% 50% 0 0; background: var(--cloth1, #f2f2f6); }

/* placeholder wordmarks */
.logo-ph { position: relative; z-index: 5; display: inline-flex; align-items: center; gap: 8px; color: #fff; white-space: nowrap; text-transform: none; }
.logo-ph i { display: block; width: 26px; height: 26px; background: currentColor; }
.lp-1 { font: 800 25px/1 var(--f-display); letter-spacing: -.02em; text-transform: uppercase; }
.lp-1 i { border-radius: 50% 50% 50% 0; transform: rotate(-12deg); }
.lp-2 { font: 400 18px/1 var(--f-text); }
.lp-2 i { width: 14px; height: 14px; clip-path: polygon(0 0, 40% 0, 40% 60%, 60% 60%, 60% 0, 100% 0, 100% 100%, 0 100%); }
.lp-3 { font: 400 20px/1 var(--f-text); }
.lp-3 i { width: 28px; height: 28px; border-radius: 50%; background: none; border: 2px solid currentColor; box-shadow: inset 0 0 0 5px transparent, inset 0 0 0 7px currentColor; }
.lp-4 { font: 500 17px/1 var(--f-mono); letter-spacing: .32em; }
.lp-5 { font: 900 26px/1 var(--f-display); font-style: italic; letter-spacing: -.04em; transform: skewX(-12deg); font-weight: 700; }
.logo-ph.is-dark { color: #000; }
.logo-ph.is-dim { opacity: .55; }

/* blurred strip under card captions */
.blur-strip { position: absolute; left: 0; right: 0; z-index: 3; border-radius: 0 0 16px 16px; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); -webkit-mask: linear-gradient(transparent, #000, #000); mask: linear-gradient(transparent, #000, #000); }
.blur-strip.is-full { top: -67.5px; bottom: 0; }
.pattern-big, .card-pattern, .campaign_pattern {
  position: absolute; left: 0; right: 0; pointer-events: none;
  background-image: radial-gradient(circle, rgba(255, 255, 255, .9) 0 1px, transparent 1.6px);
  background-size: 6px 6px;
}
.pattern-big { bottom: 0; height: 150px; z-index: 3; mix-blend-mode: overlay; -webkit-mask: linear-gradient(transparent, #000); mask: linear-gradient(transparent, #000); }

/* =========================== LOADER =========================== */
.loader { position: fixed; inset: 0; z-index: 3000; background: #fff; pointer-events: none; }
.is-rm .loader { display: none; }

/* =========================== NAV =========================== */
.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; display: flex; justify-content: center; align-items: flex-start; padding: 24px 16px 16px; pointer-events: none; }
.nav_container { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 16px 32px; color: #fff; border-radius: 17.6px; pointer-events: auto; }
.nav_bg {
  position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: 0 auto; width: 100%; transform: skewX(-15deg);
  background: rgba(0, 0, 0, .4); border-radius: 8px 16px; -webkit-backdrop-filter: blur(64px); backdrop-filter: blur(64px);
}
.js .nav_bg { opacity: 0; }
.js .nav_main { opacity: 0; }
.is-rm .nav_bg, .is-rm .nav_main { opacity: 1; }
.nav_main { position: relative; display: flex; align-items: center; gap: 40px; }
.nav_brand { position: relative; display: flex; align-items: center; gap: 6px; height: 36px; width: 145px; }
.nav_brand-mark { width: 28px; height: 22px; color: #fff; }
.nav_brand-word { font-family: var(--f-display); font-size: 30px; line-height: 1; letter-spacing: -.045em; text-transform: none; }
.nav_menu-content { display: flex; align-items: center; gap: 16px; }
.nav_menu { display: flex; align-items: flex-end; }
.nav_link { position: relative; padding: 0 8px; font-family: var(--f-mono); font-size: 13px; line-height: 19.5px; text-transform: uppercase; color: #fff; white-space: nowrap; }
.nav_lang { margin-left: -24px; padding: 4px 8px; font-family: var(--f-mono); font-size: 13px; line-height: 19.5px; }
.nav_scroll { position: absolute; left: 0; right: 0; top: calc(100% + 13.5px); height: 3px; }
.nav_scroll-line { height: 3px; width: 0; background: var(--lime); }
.nav_burger { display: none; }
.nav_mobile { display: none; }

/* =========================== HERO =========================== */
.hero { margin: 8px 8px 0; height: calc(100svh - 1rem); min-height: 560px; background: var(--violet); color: #fff; overflow: clip; display: flex; flex-direction: column; }
.hero_bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; border-radius: 16px; }
.hero_scene { position: absolute; inset: 0; }
.hero_canvas, .footer_canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.hero_canvas { background:
  radial-gradient(31% 50% at 33% 76%, #B06CF5 55%, transparent 100%),
  radial-gradient(31% 50% at 90% 57%, #F8D555 55%, transparent 100%),
  linear-gradient(118deg, #D884D8 33%, #9B5CFF 67%); }
.hero_logo { position: absolute; left: 50%; top: 50%; width: 40%; aspect-ratio: 1.3; transform: translate(-50%, -50%); pointer-events: none; }
.hero_glass { position: absolute; pointer-events: none; z-index: 1; opacity: 0; transition: opacity .6s; }
.hero_glass.is-ready { opacity: 1; }
.hero_pad { position: relative; z-index: 5; display: flex; flex-direction: column; flex: 1; }
.hero_content { position: relative; flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
.hero_h1 { display: flex; flex-direction: column; justify-content: space-between; flex: 1; gap: 48px; }
.hero_heading { display: block; font-size: 9.1rem; line-height: .9; }
.hero_heading.is-last { margin-left: auto; text-align: right; }
.hero_p-wrap { position: absolute; left: 0; bottom: 0; width: 380px; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.hero_p { font-family: var(--f-text); text-transform: none; }

/* =========================== VISION =========================== */
.vision_content { display: flex; flex-direction: column; gap: 96px; }
.vision_head { display: flex; }
.vision_sub { width: 33.333%; flex: none; }
.vision_heading-wrap { flex: 1; display: flex; flex-direction: column; gap: 40px; }
.h-vision { font-family: var(--f-text); font-size: 59.2px; line-height: 1.1; letter-spacing: -.04em; text-transform: none; }
.vision_p-wrap { display: flex; gap: 32px; }
.vision_p { flex: 1; font-family: var(--f-text); text-transform: none; }
.vision_media { position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 1280 / 566; }
.vision_img { position: absolute; inset: 0; transform: scale(1.2); }
.vision_logos-wrap { position: absolute; inset: 0; display: flex; align-items: flex-end; }
.vision_logos { position: relative; width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 48px 10%; }

/* =========================== TALENTS =========================== */
.talent { margin-top: -50vw; border-radius: 0; }
.talent_inner { height: 600vh; display: flex; flex-direction: column; align-items: center; }
.talent_content { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.talent_track-anchor { position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: 10; }
.talent_track { position: absolute; top: 0; left: 0; display: flex; align-items: center; gap: 20rem; height: 80vh; margin: 10vh 0; padding-left: 115vw; will-change: transform; }
.talent_item { flex: none; }
.talent_item:nth-child(odd) { margin-top: auto; }
.talent_item:nth-child(even) { margin-bottom: auto; }
.talent_card { position: relative; width: 24rem; aspect-ratio: 327 / 380; border-radius: 12px; overflow: hidden; color: #fff; cursor: pointer; }
.talent_item:nth-child(3n + 2) .talent_card { width: max(30vw, 35rem); max-width: 60svh; }
.talent_img { position: absolute; inset: 0; transition: transform 1s var(--ease-out); }
.talent_card:hover .talent_img { transform: scale(1.2); }
.card-bottom { position: absolute; left: 0; right: 0; bottom: 0; height: 20%; display: flex; justify-content: space-between; align-items: center; padding: 0 39.2px 0 20px; }
.card-bottom .card-pattern { inset: 0; opacity: .4; z-index: 4; }
.card-bottom .blur-strip { top: -20%; bottom: 0; }
.card-bottom-grad { position: absolute; inset: 0; z-index: 1; background: linear-gradient(rgba(255, 255, 255, 0), #fff); opacity: .31; }
.talent_name { position: relative; z-index: 4; font-size: 32px; line-height: 1; text-transform: none; white-space: nowrap; }
.card-link { position: relative; z-index: 3; display: flex; justify-content: center; align-items: center; padding: 21.6px; color: var(--violet); }
.card-link svg { position: relative; z-index: 4; width: 20px; height: 20px; transition: transform 1s var(--ease-out); }
.card-link-bg { position: absolute; top: 0; bottom: 0; left: -7px; right: -7px; z-index: 2; background: #fff; border-radius: 4px 8px; transform: skewX(-12deg); transition: background-color .5s; }
.card-top { position: absolute; left: 0; right: 0; top: 0; display: flex; gap: 4px; padding: 16px 20px; z-index: 6; }
.pill { display: flex; align-items: center; gap: 3.2px; padding: 8px 12px; color: #fff; background: rgba(0, 0, 0, .4); border-radius: 16px; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); font-family: var(--f-mono); font-size: 13px; line-height: normal; text-transform: uppercase; white-space: nowrap; }
.pill.is-square { border-radius: 0; }
.pill svg { width: 16px; height: 16px; flex: none; }
.talent_heading { font-size: max(8vw, 6rem); line-height: 1; text-align: center; }
.talent_cta { position: absolute; left: 50%; top: calc(100% - 67.5px); transform: translateX(-50%); z-index: 15; }
.js .talent_cta { opacity: 0; }

/* popup */
.popup { position: fixed; inset: 0; z-index: 2000; display: flex; justify-content: center; align-items: center; background: rgba(0, 0, 0, .4); -webkit-backdrop-filter: blur(19px); backdrop-filter: blur(19px); text-transform: uppercase; }
.popup[hidden] { display: none; }
.popup_pg { width: 100%; height: 100%; position: relative; }
.popup_list { position: relative; height: 100%; max-width: 1325px; margin: 0 auto; }
.popup_item { position: absolute; right: 0; top: 8px; bottom: 8px; width: 31rem; display: none; flex-direction: column; justify-content: space-between; padding: 24px; border-radius: 24px; color: #000; }
.popup_item.is-open { display: flex; }
.popup_bg { position: absolute; inset: 0; background: #fff; border-radius: 24px; z-index: 0; }
.popup_top { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 38px; }
.popup_img { width: 100%; aspect-ratio: 230 / 250; border-radius: 12px; overflow: hidden; }
.popup_img .ph { width: 100%; height: 100%; }
.popup_txt { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.popup_name { font-size: 64px; line-height: 1; text-transform: none; }
.popup_platforms { display: flex; gap: 4px; }
.popup_platform { display: flex; align-items: center; gap: 4px; padding: 6.4px 8px; background: var(--temper); color: #fff; font-family: var(--f-mono); font-size: 13px; }
.popup_platform svg { width: 16px; height: 16px; }
.popup_desc { margin-top: 16px; font-family: var(--f-text); line-height: 1.4; text-transform: none; }
.popup_btn-wrap { position: relative; z-index: 1; display: flex; flex-direction: column; }
.popup_btn-wrap .btn { margin: 0 auto; text-align: center; }
.popup_close { position: absolute; z-index: 10; right: calc(var(--gutter) + 31rem + 24px); top: 32px; width: 63px; height: 63px; display: flex; justify-content: center; align-items: center; color: #fff; }
.popup_close svg { position: relative; z-index: 9; width: 20px; height: 20px; }
.popup_close-bg { position: absolute; inset: 0; background: var(--temper); border-radius: 4px 8px; transform: skewX(-12deg); z-index: 2; }

/* =========================== MAP =========================== */
.maps { margin: 8px 8px 0; height: calc(100svh - 1rem); min-height: 640px; background: var(--violet); color: #fff; overflow: clip; display: flex; flex-direction: column; }
.maps_pad { position: relative; z-index: 5; padding-top: 88px; pointer-events: none; }
.maps_pad a, .maps_pad button { pointer-events: auto; }
.map_heading-inner { position: relative; }
.h-map { font-family: var(--f-display); font-size: 3.7rem; line-height: .9; width: 781px; }
.map_p-wrap { position: absolute; left: 50%; top: 86.4px; padding-left: 64px; width: 50%; }
.map_p { width: 427px; font-family: var(--f-display); font-size: 16px; line-height: 27.2px; text-transform: none; }
.map_absolute { position: absolute; inset: 0; z-index: 1; }
.map_grad { position: absolute; left: -25%; right: -25%; top: 0; height: 62%; z-index: 2; pointer-events: none; background: linear-gradient(var(--violet) 20%, rgba(155, 92, 255, 0)); }
.map_dots { position: absolute; left: 0; top: 72px; width: 100%; height: calc(100% + 34px); z-index: 0; }
.map_ping { position: absolute; z-index: 6; display: flex; justify-content: center; align-items: center; padding: 20.8px 22.4px; color: #000; cursor: pointer; }
.map_ping .ping_icn { position: relative; z-index: 4; width: 20px; height: 20px; transition: transform 1s var(--ease-out); }
.map_ping .card-link-bg { left: 0; right: 0; border-radius: 8px 11.2px; }
.map_ping.is-open { color: #fff; z-index: 7; }
.map_ping.is-open .card-link-bg { background: #000; }
.map_ping.is-open .ping_icn { transform: rotate(-45deg); }
.ping_info { position: absolute; left: -16px; top: -16px; width: 480px; aspect-ratio: 470 / 244; padding: 16px; border-radius: 12px; overflow: hidden; opacity: 0; pointer-events: none; color: #000; }
.map_ping.is-open .ping_info { opacity: 1; pointer-events: auto; }
.ping_bg { position: absolute; left: 0; top: 0; width: 0; height: 0; background: #fff; border-radius: 12px; z-index: 0; }
.ping_title { position: absolute; left: 81px; top: -9.2px; z-index: 3; width: 200px; font-family: var(--f-text); font-size: 32px; line-height: 40px; letter-spacing: -.04em; text-transform: none; color: #000; opacity: 0; pointer-events: none; }
.map_ping.is-open .ping_title { opacity: 1; }
.ping_avatars { position: absolute; right: 32px; top: 32px; z-index: 2; width: 48px; height: 48px; }
.ping_avatar { position: absolute; right: 0; top: 0; width: 48px; height: 48px; border-radius: 8px; border: 3px solid #fff; overflow: hidden; background: #fff; transform: scale(0); }
.ping_avatar .ph { width: 100%; height: 100%; }
.ping_baseline { position: absolute; left: 0; right: 0; top: 118px; display: none; justify-content: space-between; align-items: center; gap: 32px; padding: 0 16px 35px; z-index: 2; }
.ping_baseline.is-active { display: flex; }
.ping_num { font-size: 72px; line-height: 1; }
.ping_baseline p { font-family: var(--f-text); text-transform: none; font-size: 16px; line-height: 1.5; }
.ping_logo { padding: 0 32px; }
.ping_logo .logo-ph { color: #000; opacity: .65; }
.ping_timeline-wrap { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: center; align-items: flex-end; padding-bottom: 16px; z-index: 10; }
.ping_timeline { position: relative; width: 128px; height: 3px; background: rgba(0, 0, 0, .2); }
.ping_timeline-active { position: absolute; inset: 0; background: #000; transform: scaleX(0); transform-origin: left center; }
.map_nav { display: none; }

/* =========================== EXPERTISE =========================== */
.expertise_content { display: flex; flex-direction: column; gap: 96px; }
.expertise_cards { display: flex; flex-direction: column; }
.exp-card { position: sticky; top: 88px; display: flex; flex-direction: column; justify-content: space-between; gap: 160px; padding: 48px; border-radius: 16px; overflow: clip; color: #fff; background: var(--temper); transform-origin: 50% 0; }
.exp-card.is-2 { position: relative; top: 0; margin-top: 7vw; background: var(--violet); }
.exp-card_head { position: relative; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; gap: 16px; }
.exp-card_num { position: absolute; right: 0; top: 0; }
.exp-card_h { font-size: max(8vw, 6rem); line-height: .9; }
.exp-card_info { display: flex; gap: 16px; }
.exp-card_col { width: 184px; font-family: var(--f-text); font-size: 16px; line-height: 1.4; text-transform: none; }
.exp-card_media-wrap { position: absolute; right: 2rem; bottom: 2rem; width: 265px; aspect-ratio: 265 / 284; border-radius: 12px; }
.exp-card_media { position: absolute; inset: 0; border-radius: 12px; overflow: hidden; }

/* =========================== RESULTS =========================== */
.results { margin: 0 8px; background: var(--neutral-light); }
.results_content { display: flex; flex-direction: column; gap: 96px; }
.results_heading-wrap { display: flex; justify-content: center; }
.results_inner { display: flex; }
.results_layout { flex: 1; }
.results_sticky { position: sticky; top: 208px; }
.results_item { position: relative; display: flex; flex-direction: column; padding: 48px 0; }
.results_number { display: flex; font-size: max(8vw, 6rem); line-height: .9; }
.plus { display: inline-block; margin-left: .04em; transform-origin: 50% 50%; }
.results_line { position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: rgba(0, 0, 0, .2); }

/* =========================== CAMPAIGNS =========================== */
.campaign { margin: 0 8px; }
.campaign_content { display: flex; flex-direction: column; gap: 96px; }
.campaign_heading-wrap { display: flex; flex-direction: column; gap: 12px; }
.campaign_p-wrap { margin-left: auto; width: 41.67%; }
.campaign_p { width: 391px; font-family: var(--f-text); text-transform: none; }
.campaign_list { display: flex; flex-wrap: wrap; gap: 13vw 1vw; }
.campaign_card { position: relative; width: calc(50% - .5vw); color: #fff; border-radius: 12px; }
.campaign_card:nth-child(3) { margin-left: 15%; }
.campaign_inner { position: relative; display: block; width: 70%; }
.campaign_card:nth-child(2) .campaign_inner { width: 100%; transform: translateY(20%); }
.campaign_img-wrap { position: relative; aspect-ratio: 448 / 543; border-radius: 12px; overflow: clip; }
.campaign_card:nth-child(2) .campaign_img-wrap { aspect-ratio: 647 / 761; }
.campaign_img { position: absolute; inset: 0; border-radius: 16px; transition: transform 1s var(--ease-out); }
.campaign_inner:hover .campaign_img { transform: scale(1.05); }
.campaign_bottom { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 0 39.2px 20px 20px; border-radius: 16px; }
.campaign_pattern { bottom: 0; height: 30%; opacity: .4; z-index: 4; }
.blur-strip.is-campaign { top: 50%; bottom: 0; }
.campaign_grad { position: absolute; inset: 0; z-index: 1; border-radius: 0 0 16px 16px; background: linear-gradient(rgba(255, 255, 255, 0), #000); opacity: .2; }
.campaign_num { position: relative; z-index: 4; font-size: 6vw; line-height: .9; text-transform: none; }
.campaign_bottom .t-regular { z-index: 5; }
.campaign_sub { position: relative; z-index: 21; display: flex; align-items: center; gap: 10px; padding-top: 16px; color: #000; }
.campaign_cta { display: flex; justify-content: center; margin-top: 80px; }

/* =========================== TEAM =========================== */
.team { margin: 0 8px; background: var(--temper); color: #fff; overflow: clip; }
.team_pad { padding-top: 160px; padding-bottom: 128px; }
.team_content { display: flex; flex-direction: column; gap: 96px; }
.team_marquee { display: flex; justify-content: center; width: max-content; margin-left: 50%; transform: translateX(-50%); }
.team_track { flex: none; display: flex; align-items: center; gap: 48px; padding: 0 24px; animation: marquee 30s linear infinite; }
.team_track .tm-word { font-size: max(8vw, 6rem); line-height: .9; white-space: nowrap; }
.team_track svg { width: 92px; height: 63px; color: #fff; flex: none; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-100%); } }
.team_inner { display: flex; align-items: flex-start; gap: 32px; }
.team_layout { position: sticky; top: 180px; width: 436px; flex: none; display: flex; flex-direction: column; gap: 120px; }
.team_intro { width: 422px; }
.team_image-wrap { position: relative; width: 320px; aspect-ratio: 270 / 304; border-radius: 8px; overflow: hidden; }
.team_img-item { position: absolute; inset: 0; transform: scale(1.1); z-index: 1; transition: transform 1s var(--ease-out); }
.team_img-item.is-active { z-index: 3; transform: scale(1); }
.team_img-item .ph { position: absolute; inset: 0; }
.team_list { flex: 1; }
.team_item { position: relative; }
.team_item-img { display: none; }
.team_item-name { display: flex; align-items: center; }
.team_item-txt { flex: 1; display: flex; align-items: center; }
.team_item-name-wrap { width: 60%; padding: 20px 0; color: rgba(255, 255, 255, .5); transition: color .4s; }
.team_item-name-wrap .t-medium { text-transform: none; }
.team_item .subheading { color: rgba(255, 255, 255, .5); }
.team-line { height: 1px; background: rgba(255, 255, 255, .5); }
.team-line-active { position: absolute; left: 0; bottom: 0; width: 0; height: 1px; background: #fff; transition: width 1s var(--ease-out); }
.team_item:hover .team-line-active { width: 100%; }
.team_item:hover .team_item-name-wrap, .team_item:hover .subheading { color: #fff; }

/* =========================== TESTIMONIALS =========================== */
.testi { margin: 0 8px; }
.testi_pad { padding-top: 160px; padding-bottom: 160px; }
.testi_content { display: flex; flex-direction: column; align-items: flex-start; }
.testi_logos { display: flex; align-items: center; gap: 48px; margin-bottom: 96px; }
.testi_logo { opacity: .2; cursor: pointer; transition: opacity .4s; }
.testi_logo.is-active { opacity: 1; }
.testi_logo .logo-ph { color: #000; transform-origin: left center; }
.testi_logo .lp-1 { font-size: 15px; } .testi_logo .lp-1 i { width: 16px; height: 16px; }
.testi_logo .lp-2 { font-size: 13px; }
.testi_logo .lp-3 { font-size: 14px; } .testi_logo .lp-3 i { width: 18px; height: 18px; }
.testi_logo .lp-5 { font-size: 18px; }
.testi_item-wrap { position: relative; width: 100%; height: 416px; }
.testi_item { position: absolute; left: 0; top: 0; width: 100%; display: flex; justify-content: space-between; gap: 24px; background: #fff; visibility: hidden; opacity: 0; }
.testi_txt { width: 873px; }
.testi_author { width: 300px; display: flex; }
.testi_author-inner { display: flex; align-items: center; gap: 16px; }
.testi_author-img { width: 48px; height: 48px; flex: none; border-radius: 8px; overflow: hidden; }
.testi_author-img .ph { width: 100%; height: 100%; }
.testi_author .subheading { margin-top: 2px; }
.testi_timeline { position: relative; width: 160px; height: 3px; background: rgba(0, 0, 0, .2); }
.testi_timeline-active { position: absolute; left: 0; top: 0; height: 100%; width: 10%; background: #000; }

/* =========================== FOOTER =========================== */
.footer { position: relative; margin: 8px; padding-bottom: 16px; border-radius: 16px; overflow: clip; color: #fff; background: #8a5cf6; }
.footer_canvas { z-index: 0; background:
  radial-gradient(31% 50% at 33% 76%, #B06CF5 55%, transparent 100%),
  radial-gradient(31% 50% at 90% 57%, #F8D555 55%, transparent 100%),
  linear-gradient(118deg, #D884D8 33%, #9B5CFF 67%); }
.footer_top { position: relative; z-index: 5; }
.footer_top-content { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 32px; text-align: center; }
.footer_heading { font-size: 3.7rem; line-height: .9; }
.footer_bottom { position: relative; z-index: 5; display: flex; margin: 0 16px; padding-right: var(--gutter); background: rgba(0, 0, 0, .4); border-radius: 16px; -webkit-backdrop-filter: blur(100px); backdrop-filter: blur(100px); min-height: 611px; }
.footer_first { position: relative; flex: none; width: 55.9%; display: flex; align-items: flex-end; padding: 64px 0; overflow: clip; }
.footer_first.is-mobile { display: none; }
.footer_logo { width: 90%; height: auto; transform: translate(-14%, 36%) rotate(-2deg); }
.footer_second { flex: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 40px 0; gap: 232px; }
.footer_links { display: flex; justify-content: space-between; align-items: flex-start; gap: 32px; }
.footer_links-inner { display: flex; flex-direction: column; }
.footer_link { font-size: 32px; line-height: 1.5; text-transform: none; transition: opacity .3s; white-space: nowrap; }
.footer_links-inner:hover .footer_link { opacity: .4; }
.footer_links-inner:hover .footer_link:hover { opacity: 1; }
.footer_social { display: flex; gap: 16px; }
.social_link { color: #fff; transition: opacity .3s; }
.social_link svg { width: 24px; height: 24px; }
.footer_social:hover .social_link { opacity: .4; }
.footer_social:hover .social_link:hover { opacity: 1; }
.footer_links-bottom { display: flex; flex-direction: column; gap: 40px; }
.footer_legals { display: flex; flex-direction: column; gap: 8px; }
.footer_legal { font-family: var(--f-mono); font-size: 13px; line-height: 19.5px; text-transform: uppercase; }
.footer_baseline { display: flex; justify-content: space-between; gap: 32px; }
.footer_legal.is-dim { opacity: .5; }

/* =========================== TABLET =========================== */
@media (max-width: 991px) {
  .hero_heading { font-size: 6.4rem; }
  .vision_head { flex-direction: column; gap: 24px; }
  .vision_sub { width: auto; }
  .team_layout { width: 34%; }
  .team_intro { width: auto; font-size: 30px; }
  .team_image-wrap { width: 100%; }
  .testi_txt { width: 66%; }
  .footer_links { flex-direction: column; }
  .popup_close { right: calc(var(--gutter) + 31rem + 12px); }
}

/* =========================== MOBILE =========================== */
@media (max-width: 767px) {
  :root { --gutter: 20px; }
  .psl { padding-top: 56px; padding-bottom: 16px; }
  .display-l, .footer_heading, .h-map { font-size: 10vw; }
  .t-xlarge { font-size: 6vw; }
  .desk-only { display: none; }
  .mob-only { display: block; }
  .btn { padding: 13.6px; }
  .btn.is-small { padding: 8px 16px; }
  .btn.is-violet { padding: 16px 24px; }

  /* nav */
  .nav { padding: 24px 20px 16px; }
  .nav_container { width: 100%; padding: 11.2px 8px 11.2px 19.2px; align-items: stretch; }
  .nav_bg { left: -9px; right: -9px; width: auto; }
  .nav_main { justify-content: space-between; gap: 32px; padding-right: 4.8px; }
  .nav_menu-content { display: none; }
  .nav_brand { height: 43px; }
  .nav_burger { position: relative; display: flex; justify-content: center; align-items: center; width: 48px; height: 43px; margin-left: auto; margin-right: -8px; color: #000; }
  .nav_burger svg { position: relative; z-index: 2; width: 20px; height: 20px; }
  .nav_burger .i-close { display: none; }
  .nav_burger.is-open .i-open { display: none; }
  .nav_burger.is-open .i-close { display: block; }
  .nav_burger-bg { position: absolute; top: 0; bottom: 0; left: -5.5px; right: -5.5px; background: #fff; border-radius: 4px 8px; transform: skewX(-15deg); z-index: 0; transition: background-color .5s; }
  .nav_lang { margin-left: -24px; }
  .nav_scroll { left: 13px; right: 24px; top: calc(100% + 8.2px); }
  .nav_mobile { display: flex; flex-direction: column; justify-content: flex-end; gap: 32px; height: 0; overflow: hidden; }
  .nav_mobile-links { display: flex; flex-direction: column; align-items: center; gap: 16px; margin-top: 16px; }
  .nav_mobile-cta { display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 0 16px; }

  /* hero */
  .hero { padding-top: 48px; height: calc(100svh - 8px); min-height: 0; }
  .hero_pad { padding-top: 56px; padding-bottom: 16px; }
  .hero_h1 { gap: 48px; }
  .hero_heading { font-size: 3.9rem; }
  .hero_p-wrap { position: relative; width: auto; gap: 16px; margin-top: 16px; }
  .hero_logo { width: 78%; top: 48%; }

  /* vision */
  .vision { padding-top: 48px; }
  .vision_head { flex-direction: column; gap: 24px; }
  .vision_head .subheading { font-weight: 500; }
  .h-vision { font-size: 32px; }
  .vision_p-wrap { flex-direction: column; gap: 32px; }
  .vision_media { aspect-ratio: 1280 / 1500; }
  .vision_logos { flex-wrap: wrap; justify-content: center; gap: 22.4px 8%; padding: 48px 17.5px; }
  .vision_logos .logo-ph { transform: scale(.62); margin: -6px -14px; }
  .blur-strip.is-full { top: -84px; }
  .pattern-big { height: 40px; }

  /* talents: vertical track */
  .talent { margin-top: -50vw; padding-top: 48px; overflow: clip; }
  .talent_content { width: 100%; }
  .talent_heading { font-size: 12vw; }
  .talent_track-anchor { left: 0; right: 0; width: auto; }
  .talent_track { left: 0; right: 0; flex-direction: column; gap: 288px; height: auto; margin: 100vh 0 0; padding: 0; align-items: center; }
  .talent_item, .talent_item:nth-child(odd), .talent_item:nth-child(even) { margin: 0; }
  .talent_card, .talent_item:nth-child(3n + 2) .talent_card { width: 70vw; max-width: none; }
  .talent_name { font-size: 26px; }
  .talent_cta { top: calc(100% - 92px); }

  .popup_item { left: 0; right: 0; width: auto; top: 96px; bottom: 16px; }
  .popup_name { font-size: 44px; }
  .popup_top { gap: 24px; }
  .popup_img { width: 70%; }
  .popup_close { right: 24px; top: 24px; width: 56px; height: 52px; }

  /* map */
  .maps { min-height: 0; height: calc(100svh - 17px); }
  .maps_pad { padding-top: 39px; }
  .h-map { width: auto; letter-spacing: -.01em; }
  .map_p-wrap { position: relative; left: auto; top: auto; width: auto; padding: 24px 0 32px; }
  .map_p { width: auto; font-size: 16px; line-height: 1.6; }
  .map_absolute { top: var(--map-top, 262px); }
  .map_dots { top: 0; height: 100%; opacity: .9; }
  .map_grad { left: -25%; right: -25%; height: 26%; }
  .map_ping { left: 28px !important; top: 96px !important; padding: 17.6px 19.2px; }
  .map_absolute.has-open .map_ping:not(.is-open) { opacity: 0; pointer-events: none; }
  .ping_info { width: calc(100vw - 72px); aspect-ratio: auto; height: 380px; }
  .ping_title { left: 81px; width: 220px; }
  .ping_baseline { top: 149px; flex-direction: column; align-items: flex-start; gap: 24px; }
  .ping_logo { padding: 0 32px 0 0; }
  .map_nav { position: absolute; left: 0; right: 0; bottom: 30px; display: flex; justify-content: flex-end; gap: 8px; padding-right: 32px; z-index: 8; }
  .map_btn { position: relative; width: 48px; height: 52px; display: flex; justify-content: center; align-items: center; color: #fff; }
  .map_btn svg { position: relative; z-index: 3; width: 20px; height: 20px; }
  .map_btn-bg { position: absolute; top: 0; bottom: 0; left: -7px; right: -7px; background: var(--temper); border: 1px solid rgba(0, 0, 0, .2); border-radius: 4px 8px; transform: skewX(-12deg); z-index: 2; }

  /* expertise */
  .expertise { padding-top: 48px; }
  .expertise_content { gap: 48px; }
  .exp-card { top: 35.5px; padding: 16px; gap: 40px; }
  .exp-card.is-2 { margin-top: 27.3px; }
  .exp-card_head { flex-direction: column; align-items: flex-start; gap: 16px; }
  .exp-card_num { position: static; }
  .exp-card_h { font-size: 9vw; }
  .exp-card_col { width: 50%; }
  .exp-card_info { gap: 16px; }
  .exp-card_media-wrap { position: relative; right: auto; bottom: auto; width: 159px; margin: 8px 0 0 auto; }

  /* results */
  .results { padding-top: 48px; padding-bottom: 64px; }
  .results_content { gap: 48px; }
  .results_inner { flex-direction: column; }
  .results_sticky { position: static; }
  .results_item { padding: 32px 0; }
  .results_number { font-size: 14vw; }

  /* campaigns */
  .campaign_pad { padding-bottom: 64px; }
  .campaign_content { gap: 48px; }
  .campaign_p-wrap { margin-left: 0; width: auto; }
  .campaign_p { width: auto; }
  .campaign_list { flex-direction: column; gap: 48px; }
  .campaign_card, .campaign_card:nth-child(3) { width: 100%; margin: 0; }
  .campaign_inner { width: 100%; }
  .campaign_card:nth-child(2) .campaign_inner { width: 100%; transform: none; margin-left: auto; }
  .campaign_card:nth-child(2) .campaign_img-wrap { aspect-ratio: 448 / 543; }
  .campaign_num { font-size: 9vw; }
  .campaign_cta { margin-top: 32px; }

  /* team */
  .team_pad { padding-top: 48px; padding-bottom: 64px; }
  .team_content { gap: 48px; }
  .team_track .tm-word { font-size: 14vw; }
  .team_track svg { width: 46px; height: 32px; }
  .team_track { gap: 24px; padding: 0 12px; }
  .team_inner { flex-direction: column; gap: 48px; }
  .team_layout { position: sticky; top: 0; z-index: 5; width: 100%; gap: 32px; background: var(--temper); padding-bottom: 8px; }
  .team_intro { width: 247px; font-size: 6vw; }
  .team_image-wrap { display: none; }
  .team_list { width: 100%; }
  .team_item-name { display: flex; align-items: center; gap: 16px; padding: 12px 0; }
  .team_item-img { display: block; width: 64px; height: 64px; border-radius: 8px; overflow: hidden; flex: none; }
  .team_item-img .ph { width: 100%; height: 100%; }
  .team_item-name-wrap { width: auto; padding: 0; color: #fff; }
  .team_item-txt { display: flex; flex-direction: column; align-items: flex-start; }
  .team_item .subheading { color: #fff; }

  /* testimonials */
  .testi { padding-top: 48px; }
  .testi_pad { padding-top: 160px; padding-bottom: 160px; }
  .testi_logos { gap: 32px; margin-bottom: 48px; transform: scale(.5); transform-origin: left center; width: 200%; }
  .testi_item-wrap { height: 480px; }
  .testi_item { flex-direction: column; justify-content: flex-start; gap: 32px; }
  .testi_txt { width: 100%; }

  /* footer */
  .footer_top .psl { padding-top: 56px; }
  .footer_bottom { flex-direction: column; padding-right: 15.6px; min-height: 0; }
  .footer_first { display: none; }
  .footer_first.is-mobile { display: flex; width: 100%; padding: 32px 0; height: 293px; }
  .footer_first.is-mobile .footer_logo { width: 90%; transform: translate(-14%, 30%) rotate(-2deg); }
  .footer_second { padding: 40px 0 40px 15.6px; gap: 74.5px; }
  .footer_links { flex-direction: column; align-items: center; }
  .footer_links-inner { align-items: center; }
  .footer_links-bottom { align-items: center; text-align: center; gap: 32px; }
  .footer_legals { align-items: center; }
  .footer_baseline { flex-direction: column; align-items: center; gap: 24px; }
}

/* reduced motion: everything visible, no marquee */
.is-rm .team_track { animation: none; }
.is-rm .talent_cta { opacity: 1; }

/* ---------- veax ---------- */
.ph > img.fill { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
.nav_brand { width: auto; gap: 9px; }
.nav_brand-mark.is-orb { width: 30px; height: 30px; }
.nav_brand-word { font-family: "Syne", var(--f-display); font-weight: 700; font-size: 27px; letter-spacing: -.02em; }
.hero_logo .hero_orb { position: absolute; left: 50%; top: 50%; height: 100%; width: auto; aspect-ratio: 1; transform: translate(-50%, -50%); }
.team_track .tm-word { font-family: "Syne", var(--f-display); font-weight: 700; letter-spacing: -.03em; text-transform: none; }
.team_track .tm-orb { width: max(6vw, 4.6rem); height: auto; flex: none; }
.footer_logo.is-orb { width: 62%; transform: translate(-8%, 34%); }
.ph.ini { display: grid; place-items: center; width: 100%; height: 100%; background: var(--violet); color: #fff; font-family: var(--f-mono); font-size: 15px; }
.logo-ph .logo-orb { width: 22px; height: 22px; }
.map_nav { display: none; }
@media (max-width: 767px) {
  .team_track .tm-orb { width: 12vw; }
  .footer_first.is-mobile .footer_logo.is-orb { width: 80%; transform: translate(-6%, 30%); }
}
@media (min-width: 768px) { .hero_heading { font-size: min(9.1rem, 10.4vw); } }
