:root {
  --ink: #11131c;
  --ink-soft: #1a1d28;
  --paper: #f2f3ef;
  --white: #ffffff;
  --mist: #aeb9bd;
  --violet: #4936eb;
  --violet-deep: #3020b9;
  --lime: #d8ff5f;
  --line-dark: rgba(255,255,255,.19);
  --line-light: rgba(17,19,28,.18);
  --max: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.45; overflow-x: hidden; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
h1, h2, h3, p { margin-top: 0; }
button { color: inherit; }

.loader { position: fixed; z-index: 1000; inset: 0; display: grid; place-items: center; background: var(--paper); transition: opacity .7s ease, visibility 0s linear .7s; }
.loader img { width: min(38vw, 280px); animation: loader-pulse 1.2s ease infinite alternate; }
.loader-line { position: absolute; left: 0; bottom: 0; width: 100%; height: 5px; background: var(--violet); transform-origin: left; animation: loader-line 1.4s cubic-bezier(.7,0,.2,1) both; }
body.loaded .loader { opacity: 0; visibility: hidden; }
@keyframes loader-pulse { to { transform: scale(1.035); opacity: .72; } }
@keyframes loader-line { from { transform: scaleX(0); } to { transform: scaleX(1); } }

.skip-link { position: fixed; top: 12px; left: 12px; z-index: 1100; padding: 10px 15px; color: white; background: var(--violet); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

.site-header { position: fixed; z-index: 100; top: 0; left: 50%; display: flex; align-items: center; justify-content: space-between; width: min(100%, 1440px); padding: 30px 48px; transform: translateX(-50%); mix-blend-mode: difference; color: white; pointer-events: none; }
.site-header > * { pointer-events: auto; }
.brand { transition: opacity .45s ease, transform .55s cubic-bezier(.22,.7,.2,1), visibility 0s linear 0s; }
.brand img { display: block; width: 185px; filter: invert(1); }
.site-header.logo-hidden .brand { opacity: 0; visibility: hidden; transform: translateY(-24px); transition: opacity .35s ease, transform .45s cubic-bezier(.22,.7,.2,1), visibility 0s linear .45s; }
.menu-toggle { display: grid; grid-template-columns: 40px auto; align-items: center; gap: 0 16px; min-width: 115px; padding: 10px 0; background: transparent; border: 0; cursor: pointer; }
.menu-toggle > span:not(.menu-label) { grid-column: 1; width: 40px; height: 2px; background: currentColor; transition: transform .45s ease, width .35s ease; }
.menu-toggle > span:nth-child(2) { margin-top: -8px; width: 28px; }
.menu-label { grid-column: 2; grid-row: 1 / span 2; font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.menu-toggle:hover > span:nth-child(2) { width: 40px; }
.menu-open .menu-toggle > span:first-child { transform: translateY(5px) rotate(45deg); }
.menu-open .menu-toggle > span:nth-child(2) { width: 40px; transform: translateY(-5px) rotate(-45deg); }
.menu-open .site-header { z-index: 200; mix-blend-mode: normal; }
.menu-open .menu-toggle { position: relative; z-index: 201; color: var(--lime); box-shadow: 0 0 0 12px var(--violet); background: var(--violet); }

.menu-overlay { position: fixed; z-index: 90; inset: 0; display: grid; grid-template-columns: 1.25fr .75fr; padding: 140px clamp(30px, 7vw, 110px) 55px; color: white; background: var(--violet); visibility: hidden; opacity: 0; clip-path: circle(0 at calc(100% - 75px) 55px); transition: clip-path .8s cubic-bezier(.75,0,.2,1), opacity .25s ease, visibility 0s linear .8s; }
.menu-open .menu-overlay { visibility: visible; opacity: 1; clip-path: circle(150% at calc(100% - 75px) 55px); transition-delay: 0s; }
.menu-art { position: absolute; inset: 0 0 0 52%; opacity: .24; background: repeating-radial-gradient(circle at 75% 45%, transparent 0 19px, rgba(255,255,255,.72) 20px 21.5px, transparent 22.5px 40px); transform: translateX(calc(var(--scroll, 0) * -20px)); }
.menu-links { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.menu-links a { display: flex; align-items: center; gap: 24px; font-size: clamp(3.4rem, 8vw, 8rem); font-weight: 750; line-height: .93; letter-spacing: -.065em; transition: transform .3s ease, color .3s ease; }
.menu-links a span { display: inline-flex; align-items: center; justify-content: center; min-width: 56px; font-size: clamp(1.05rem, 1.5vw, 1.45rem); font-weight: 850; line-height: 1; letter-spacing: .08em; }
.menu-links a:hover { color: var(--lime); transform: translateX(18px); }
.menu-meta { position: relative; z-index: 2; align-self: end; justify-self: end; text-align: right; font-weight: 650; }
.menu-meta p { margin-bottom: 8px; }
.menu-meta a { border-bottom: 1px solid currentColor; }

.scene, .services-section, .approach-section, .about-section, .contact-section { position: relative; overflow: hidden; }
.scene { min-height: 100vh; }
.scene-inner { position: relative; z-index: 3; width: min(calc(100% - 64px), var(--max)); margin: 0 auto; }
.dark-scene { color: var(--white); background: var(--ink); }
.light-scene { color: var(--ink); background: var(--paper); }
.violet-scene { color: var(--white); background: var(--violet); }
.scene-index { margin-bottom: 38px; font-size: clamp(1.05rem, 1.35vw, 1.35rem); font-weight: 850; letter-spacing: .14em; line-height: 1.2; text-transform: uppercase; }
em { font-family: Georgia, "Times New Roman", serif; font-weight: 400; }

.hero-scene { min-height: 100svh; }
.hero-inner { display: flex; min-height: 100svh; padding: 170px 0 90px; flex-direction: column; justify-content: center; }
.hero-inner h1 { max-width: 840px; margin-bottom: 62px; font-size: clamp(4.2rem, 9.4vw, 9rem); font-weight: 760; letter-spacing: -.075em; line-height: .86; }
.hero-inner h1 em { color: var(--mist); }
.hero-bottom { display: grid; grid-template-columns: minmax(260px, 510px) auto; align-items: end; gap: 48px; }
.hero-bottom p { margin: 0; color: #d7dddf; font-size: clamp(1.15rem, 1.65vw, 1.45rem); font-weight: 580; }
.pill { display: inline-flex; align-items: center; justify-content: space-between; gap: 30px; width: max-content; min-height: 58px; padding: 15px 24px; border: 2px solid currentColor; border-radius: 999px; font-weight: 800; cursor: pointer; transition: color .3s ease, background .3s ease, transform .3s ease; }
.pill:hover { transform: translateY(-3px); }
.pill-light:hover { color: var(--ink); background: white; }
.pill-accent { color: white; background: var(--violet); border-color: var(--violet); }
.pill-accent:hover { color: var(--ink); background: var(--lime); border-color: var(--lime); }
.contour-art { position: absolute; z-index: 1; inset: 0 0 0 48%; overflow: hidden; opacity: .85; }
.contour { position: absolute; border: clamp(16px, 2vw, 28px) solid #263442; border-radius: 46% 54% 56% 44% / 56% 44% 55% 45%; box-shadow: 0 0 0 24px var(--ink), 0 0 0 48px #263442, 0 0 0 72px var(--ink), 0 0 0 96px #263442, 0 0 0 120px var(--ink), 0 0 0 144px #263442; }
.contour-a { width: 50vw; height: 55vw; top: -16%; right: -12%; transform: rotate(calc(18deg + var(--parallax, 0) * 8deg)); }
.contour-b { width: 29vw; height: 33vw; right: 8%; bottom: -11%; transform: rotate(calc(-28deg + var(--parallax, 0) * -8deg)); }
.contour-c { width: 17vw; height: 20vw; top: 34%; left: 4%; transform: rotate(35deg); }
.signal-dot { position: absolute; top: 23%; right: 19%; width: 18px; height: 18px; background: var(--lime); border-radius: 50%; box-shadow: 0 0 0 12px rgba(216,255,95,.14), 0 0 50px var(--lime); animation: signal 2.4s ease-in-out infinite; }
@keyframes signal { 50% { transform: scale(1.35); box-shadow: 0 0 0 24px rgba(216,255,95,0), 0 0 70px var(--lime); } }
.scroll-cue { position: absolute; z-index: 3; right: 48px; bottom: 42px; display: flex; align-items: center; gap: 12px; font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; writing-mode: vertical-rl; }
.scroll-cue span { width: 1px; height: 55px; background: white; animation: scroll-line 1.8s ease infinite; transform-origin: top; }
@keyframes scroll-line { 0%,100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }

.statement-scene { min-height: 110vh; }
.statement-inner { display: grid; min-height: 110vh; padding: 150px 0; grid-template-columns: 1fr 3fr; align-content: center; }
.statement-inner .scene-index { padding-top: 14px; }
.statement { max-width: 970px; margin-bottom: 75px; font-size: clamp(3rem, 6.7vw, 6.8rem); line-height: .98; letter-spacing: -.065em; }
.statement em { color: var(--violet); }
.statement-copy { grid-column: 2; display: grid; grid-template-columns: minmax(260px, 560px) auto; align-items: end; gap: 40px; }
.statement-copy p { margin: 0; color: #555a5a; font-size: clamp(1.12rem, 1.5vw, 1.35rem); }
.text-arrow { padding-bottom: 5px; font-weight: 800; border-bottom: 2px solid currentColor; }
.text-arrow span { margin-left: 20px; transition: margin .25s ease; }
.text-arrow:hover span { margin-left: 30px; }

.services-section { padding: 145px 0 0; }
.section-intro { padding-bottom: 90px; }
.section-intro h2, .approach-heading h2, .contact-copy h2 { margin: 0; font-size: clamp(3.7rem, 7.8vw, 8rem); line-height: .9; letter-spacing: -.07em; }
.section-intro h2 em { color: var(--mist); }
.service-list { border-top: 1px solid var(--line-dark); }
.service-item { border-bottom: 1px solid var(--line-dark); }
.service-item > button { display: grid; width: 100%; padding: 38px max(32px, calc((100vw - var(--max)) / 2)); grid-template-columns: 100px 1fr 60px; align-items: center; background: transparent; border: 0; text-align: left; cursor: pointer; transition: color .35s ease, background .35s ease; }
.service-item > button:hover, .service-item.open > button { color: var(--ink); background: var(--lime); }
.service-number { font-size: clamp(2rem, 3.2vw, 3.4rem); font-weight: 800; }
.service-name { font-size: clamp(2.2rem, 5vw, 5.6rem); line-height: .98; font-weight: 700; letter-spacing: -.055em; }
.service-icon { justify-self: end; font-size: 3rem; font-weight: 250; transition: transform .45s ease; }
.service-item.open .service-icon { transform: rotate(45deg); }
.service-details { display: grid; max-height: 0; padding: 0 max(32px, calc((100vw - var(--max)) / 2)); grid-template-columns: 1fr 1fr; gap: 70px; overflow: hidden; background: var(--paper); color: var(--ink); transition: max-height .7s cubic-bezier(.65,0,.2,1), padding .5s ease; }
.service-item.open .service-details { max-height: 440px; padding-top: 55px; padding-bottom: 65px; }
.service-details p { max-width: 560px; font-size: 1.35rem; }
.service-details ul { margin: 0; padding: 0; list-style: none; }
.service-details li { padding: 12px 0; border-bottom: 1px solid var(--line-light); font-weight: 700; }

.approach-section { padding: 150px 0; }
.approach-section::before { content: ""; position: absolute; width: 65vw; height: 65vw; right: -32vw; top: 7%; border: 2px solid rgba(255,255,255,.25); border-radius: 50%; box-shadow: 0 0 0 45px rgba(255,255,255,.04), 0 0 0 90px rgba(255,255,255,.04), 0 0 0 135px rgba(255,255,255,.04); }
.approach-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; }
.approach-heading { position: sticky; top: 140px; align-self: start; }
.approach-heading h2 { margin-bottom: 42px; }
.approach-heading h2 em { color: var(--lime); }
.approach-heading > p:last-child { max-width: 520px; color: rgba(255,255,255,.75); font-size: 1.18rem; }
.approach-steps { margin: 0; padding: 0; list-style: none; }
.approach-steps li { display: grid; min-height: 220px; padding: 42px 0; grid-template-columns: 90px 1fr; gap: 24px; border-top: 1px solid rgba(255,255,255,.28); }
.approach-steps li > span { display: flex; align-items: center; justify-content: center; height: clamp(2.3rem, 4vw, 4rem); color: var(--lime); font-size: clamp(1.9rem, 2.8vw, 2.8rem); font-weight: 800; line-height: 1; }
.approach-steps h3 { margin-bottom: 15px; font-size: clamp(2.3rem, 4vw, 4rem); line-height: 1; letter-spacing: -.05em; }
.approach-steps p { color: rgba(255,255,255,.72); font-size: 1.08rem; }

.about-section { padding: 150px 0; }
.about-title { max-width: 1100px; margin-bottom: 100px; font-size: clamp(3.4rem, 7.5vw, 7.6rem); line-height: .95; letter-spacing: -.07em; }
.about-title em { color: var(--violet); }
.about-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 100px; }
.about-copy { color: #555a5a; font-size: 1.22rem; }
.facts { border-top: 1px solid var(--line-light); }
.fact { display: grid; padding: 24px 0 34px; grid-template-columns: 1fr 1fr; align-items: end; border-bottom: 1px solid var(--line-light); }
.fact strong { font-size: clamp(3.4rem, 6.5vw, 6.8rem); line-height: 1; letter-spacing: -.07em; }
.fact span { justify-self: end; max-width: 180px; color: #555a5a; }

.contact-section { padding: 150px 0; }
.contact-art { position: absolute; inset: 0 55% 0 0; opacity: .32; background: repeating-radial-gradient(ellipse at -10% 50%, transparent 0 17px, #40505d 18px 22px); transform: translateY(calc(var(--parallax, 0) * -40px)); }
.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; }
.contact-copy h2 { margin-bottom: 40px; }
.contact-copy h2 em { color: var(--lime); }
.contact-copy > p:not(.scene-index) { max-width: 540px; color: #c4cbcd; font-size: 1.15rem; }
.contact-email { display: inline-block; margin-top: 24px; font-size: clamp(1.25rem, 2vw, 1.8rem); font-weight: 700; border-bottom: 1px solid; }
.contact-form { padding: 42px; color: var(--ink); background: var(--paper); }
.field-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.contact-form label { display: block; margin-bottom: 28px; font-size: 1.12rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }
.contact-form input, .contact-form select, .contact-form textarea { width: 100%; margin-top: 11px; padding: 14px 0; background: transparent; border: 0; border-bottom: 1px solid var(--line-light); border-radius: 0; outline: none; color: var(--ink); font: inherit; font-size: 1.18rem; font-weight: 400; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--violet); box-shadow: 0 2px 0 var(--violet); }
.contact-form textarea { resize: vertical; }
.honeypot { position: absolute; left: -9999px; }
.form-status { min-height: 24px; margin: 14px 0 0; color: #555a5a; }
.form-status.error { color: #a02626; }

.site-footer { display: grid; padding: 65px max(32px, calc((100vw - var(--max)) / 2)); grid-template-columns: 1fr 1fr 1fr; gap: 40px; align-items: end; color: var(--ink); background: var(--lime); }
.site-footer img { width: 175px; }
.site-footer p { margin: 0; font-weight: 700; }
.site-footer > div { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-size: .82rem; }
.site-footer a { border-bottom: 1px solid; }

.reveal { opacity: 0; transform: translateY(45px); transition: opacity .9s ease, transform .9s cubic-bezier(.22,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: .12s; }
.reveal-delay-2 { transition-delay: .24s; }

.cursor { position: fixed; z-index: 1200; top: 0; left: 0; width: 18px; height: 18px; border: 1px solid white; border-radius: 50%; mix-blend-mode: difference; pointer-events: none; transform: translate(-50%,-50%); transition: width .2s ease, height .2s ease, background .2s ease; }
.cursor.active { width: 54px; height: 54px; background: white; }

.legal-page { max-width: 860px; margin: 0 auto; padding: 130px 28px 150px; }
.legal-page h1 { font-size: clamp(3.2rem, 7vw, 6.4rem); }
.legal-page h2 { margin-top: 58px; font-size: clamp(1.7rem, 3vw, 2.5rem); }
.legal-page p { color: #555a5a; font-size: 1.08rem; }
.legal-body { color: var(--ink); background: var(--paper); }
.legal-body main { background: var(--paper); }
.legal-body .site-header { mix-blend-mode: normal; background: rgba(242,243,239,.88); backdrop-filter: blur(16px); }
.legal-body .brand img { filter: none; }
.legal-contact { padding: 12px 18px; color: white; background: var(--ink); border-radius: 999px; font-weight: 800; }
.legal-page a { color: var(--violet); border-bottom: 1px solid; }
.legal-page .legal-date { margin-bottom: 70px; }
.legal-body .site-footer { grid-template-columns: 1fr 1fr; }
.legal-body .footer-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }

@media (max-width: 900px) {
  .site-header { padding: 24px; }
  .brand img { width: 150px; }
  .scene-inner { width: min(calc(100% - 40px), var(--max)); }
  .contour-art { left: 36%; opacity: .55; }
  .hero-bottom, .statement-copy, .approach-grid, .about-layout, .contact-grid { grid-template-columns: 1fr; }
  .hero-bottom { align-items: start; }
  .statement-inner { grid-template-columns: 1fr; }
  .statement-copy { grid-column: 1; }
  .approach-grid, .about-layout, .contact-grid { gap: 58px; }
  .approach-heading { position: static; }
  .contact-art { inset-right: 25%; }
  .menu-overlay { grid-template-columns: 1fr; }
  .menu-art { left: 30%; }
  .menu-meta { justify-self: start; text-align: left; }
}

@media (max-width: 650px) {
  .cursor { display: none; }
  .site-header { padding: 20px 18px; }
  .brand img { width: 132px; }
  .menu-label { display: none; }
  .menu-toggle { min-width: 40px; grid-template-columns: 40px; }
  .hero-inner { padding-top: 135px; }
  .hero-inner h1 { font-size: clamp(3.7rem, 18vw, 6rem); }
  .hero-bottom { gap: 28px; }
  .contour-art { left: 18%; opacity: .4; }
  .scroll-cue { display: none; }
  .statement-inner { padding: 110px 0; }
  .statement { margin-bottom: 45px; }
  .services-section, .approach-section, .about-section, .contact-section { padding-top: 105px; padding-bottom: 105px; }
  .service-item > button { padding: 28px 20px; grid-template-columns: 52px 1fr 36px; }
  .service-name { font-size: 2.25rem; }
  .service-number { font-size: 1.65rem; }
  .service-details { padding-inline: 20px; grid-template-columns: 1fr; gap: 20px; }
  .service-item.open .service-details { max-height: 650px; padding-top: 34px; padding-bottom: 45px; }
  .approach-steps li { grid-template-columns: 55px 1fr; min-height: 170px; }
  .fact { grid-template-columns: 1fr; gap: 10px; }
  .fact span { justify-self: start; }
  .field-pair { grid-template-columns: 1fr; gap: 0; }
  .contact-form { padding: 28px 22px; }
  .site-footer { grid-template-columns: 1fr; }
  .site-footer > div { align-items: flex-start; }
  .menu-overlay { padding: 115px 24px 38px; }
  .menu-links a { font-size: clamp(3rem, 15vw, 5rem); }
  .menu-links a span { min-width: 42px; font-size: 1rem; }
  .scene-index { font-size: 1rem; }
}

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